/* beta12: hide the entire WPGB badge block while its content is being prepared.
   Never display:none an active badge: that reorders the flex/grid children. */
.lgml-availability { transition: opacity 180ms ease !important; animation: none !important; transform: none !important; }
.lgml-availability:not(.lgml-availability--ready) { opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; }
.lgml-availability.lgml-availability--ready { opacity: 1 !important; visibility: visible !important; }
/* Hide the styled WPGB block as well as the inner span. Keep its layout slot. */
.wpgb-card [class*="wpgb-block"]:has(> .lgml-availability:not(.lgml-availability--ready)),
.wpgb-card [class*="wpgb-block"]:has(> .lgml-drive-time:not(.lgml-drive-time--ready)) { visibility: hidden !important; }
.wpgb-card [class*="wpgb-block"]:has(> .lgml-availability.lgml-availability--ready),
.wpgb-card [class*="wpgb-block"]:has(> .lgml-drive-time.lgml-drive-time--ready) { visibility: visible !important; }
[data-lgml-drive-post].lgml-drive-time--active { transition: opacity 280ms ease-out !important; transform: none !important; }
.wpgb-card .lgml-dates-pill { transition: opacity 180ms ease !important; animation: none !important; transform: none !important; }
@media (prefers-reduced-motion: reduce) { .lgml-availability, [data-lgml-drive-post].lgml-drive-time--active, .wpgb-card .lgml-dates-pill { transition-duration: 0ms !important; } }

/* beta84: single fade for cached and newly calculated driving labels. */
.wpgb-card .lgml-drive-time--active,
.wpgb-card .lgml-availability,
.wpgb-card .lgml-dates-pill {
  transition: opacity 280ms ease-out !important;
  animation: none !important;
  transform: none !important;
}
.wpgb-card .lgml-drive-time--active:not(.lgml-drive-time--ready) { opacity: 0 !important; }
.wpgb-card .lgml-drive-time--active.lgml-drive-time--ready { opacity: 1 !important; }
.wpgb-card .lgml-drive-time--active.lgml-drive-time--revealing { opacity: 0 !important; }
@media (prefers-reduced-motion: reduce) {
  .wpgb-card .lgml-drive-time--active,
  .wpgb-card .lgml-availability,
  .wpgb-card .lgml-dates-pill { transition: none !important; }
}

/* beta94: exactly one date-related badge per card.
   Any visible iCal result (available OR next availability) replaces the neutral
   dates pill. If the iCal result is absent or not ready, show the dates instead.
   Restrict to the same card so other cards remain unaffected. */
html.lgml-has-saved-dates .wpgb-card:has(.lgml-availability.lgml-availability--ready:not([hidden])) [class*="wpgb-block"]:has(> .lgml-dates-pill),
.wpgb-card:has(.lgml-availability.lgml-availability--ready:not([hidden])) [class*="wpgb-block"]:has(> .lgml-dates-pill) {
  display: none !important;
}

/* beta95: even after the iCal result settles, a ready iCal badge wins. */
html.lgml-has-saved-dates .wpgb-card:has(.lgml-availability.lgml-availability--ready:not([hidden])) [class*="wpgb-block"]:has(> .lgml-dates-pill) { display: none !important; }

/* beta98: badge wrappers fade only after their final text is ready.
   WPGB applies the visual background to the wrapper, not necessarily the span. */
.wpgb-card [class*="wpgb-block"]:has(> .lgml-dates-pill),
.wpgb-card [class*="wpgb-block"]:has(> .lgml-availability),
.wpgb-card [class*="wpgb-block"]:has(> .lgml-drive-time) {
  transition: opacity 220ms ease-out !important;
  animation: none !important;
  transform: none !important;
}
.wpgb-card [class*="wpgb-block"]:has(> .lgml-dates-pill:not(.lgml-dates-pill--ready)),
.wpgb-card [class*="wpgb-block"]:has(> .lgml-availability:not(.lgml-availability--ready)),
.wpgb-card [class*="wpgb-block"]:has(> .lgml-drive-time:not(.lgml-drive-time--ready)),
.wpgb-card [class*="wpgb-block"]:has(> .lgml-drive-time--revealing) { opacity: 0 !important; pointer-events: none !important; }
.wpgb-card [class*="wpgb-block"]:has(> .lgml-dates-pill.lgml-dates-pill--ready:not(:empty)),
.wpgb-card [class*="wpgb-block"]:has(> .lgml-availability.lgml-availability--ready:not(:empty)),
.wpgb-card [class*="wpgb-block"]:has(> .lgml-drive-time.lgml-drive-time--ready:not(.lgml-drive-time--revealing):not(:empty)) { opacity: 1 !important; visibility: visible !important; }
@media (prefers-reduced-motion: reduce) {
  .wpgb-card [class*="wpgb-block"]:has(> .lgml-dates-pill),
  .wpgb-card [class*="wpgb-block"]:has(> .lgml-availability),
  .wpgb-card [class*="wpgb-block"]:has(> .lgml-drive-time) { transition-duration: 0ms !important; }
}

/* beta100: pending date/availability slots take NO space. A ready badge
   appears above the already visible driving-time label, without a gap. */
.wpgb-card [class*="wpgb-block"]:has(> .lgml-availability:not(.lgml-availability--ready)),
.wpgb-card [class*="wpgb-block"]:has(> .lgml-dates-pill:not(.lgml-dates-pill--ready)),
.wpgb-card [class*="wpgb-block"]:has(> .lgml-availability[hidden]),
.wpgb-card [class*="wpgb-block"]:has(> .lgml-dates-pill[hidden]) {
  display: none !important;
}

/* beta101: iCal slot is display:none until ready (beta100). A CSS opacity
   transition cannot animate from display:none; animate the newly displayed
   WPGB wrapper itself, matching the 220ms driving-time fade. */
@keyframes lgml-availability-wrapper-reveal {
  from { opacity: 0; }
  to { opacity: 1; }
}
.wpgb-card [class*="wpgb-block"]:has(> .lgml-availability.lgml-availability--ready:not([hidden]):not(:empty)) {
  animation: lgml-availability-wrapper-reveal 220ms ease-out both !important;
}
@media (prefers-reduced-motion: reduce) {
  .wpgb-card [class*="wpgb-block"]:has(> .lgml-availability.lgml-availability--ready:not([hidden]):not(:empty)) {
    animation: none !important;
  }
}

/* beta102: no invisible slots in the badge stack. The reveal coordinator
   assigns sequence only to fully populated badges. */
.wpgb-card [class*="wpgb-block"]:has(> .lgml-drive-time:not(.lgml-drive-time--ready)),
.wpgb-card [class*="wpgb-block"]:has(> .lgml-drive-time[hidden]),
.wpgb-card [class*="wpgb-block"]:has(> .lgml-availability:not(.lgml-availability--ready)),
.wpgb-card [class*="wpgb-block"]:has(> .lgml-availability[hidden]),
.wpgb-card [class*="wpgb-block"]:has(> .lgml-dates-pill:not(.lgml-dates-pill--ready)),
.wpgb-card [class*="wpgb-block"]:has(> .lgml-dates-pill[hidden]) { display: none !important; }
/* The already-visible badge is never moved: subsequent badges are inserted
   after it. Do not reserve space for the second badge. */
.wpgb-card [class*="wpgb-block"].lgml-badge102-reveal { animation: lgml-badge102-fade 220ms ease-out both !important; }
@keyframes lgml-badge102-fade { from { opacity:0; } to { opacity:1; } }
@media (prefers-reduced-motion:reduce) { .wpgb-card [class*="wpgb-block"].lgml-badge102-reveal { animation:none !important; } }

/* beta106: hide ALL native source wrappers, including before JS initializes.
   WPGB continues to own the source data; the coordinator alone owns the visuals. */
.wpgb-card [class*="wpgb-block"]:has(> .lgml-dates-pill),
.wpgb-card [class*="wpgb-block"]:has(> .lgml-availability),
.wpgb-card [class*="wpgb-block"]:has(> [data-lgml-drive-post]) {display:none !important;}
.wpgb-card .lgml-engine-badge-stack {
 display:flex !important; flex-direction:column-reverse !important;
 align-items:flex-start; gap:0; margin:0; padding:0;
}
.wpgb-card .lgml-engine-badge-stack .lgml-engine-badge-item {
 display:block !important; visibility:visible !important;
 transition:none !important; transform:none !important;
 animation:none !important;
}
@keyframes lgml-badge106-fade {from{opacity:0;}to{opacity:1;}}
@media(prefers-reduced-motion:reduce){
 .wpgb-card .lgml-engine-badge-stack .lgml-engine-badge-item {animation:none !important;}
}

/* Override the legacy footer inline dates rule, including before coordinator init. */
html body .wpgb-card [class*="wpgb-block"]:has(> .lgml-dates-pill) {display:none !important;}


/* beta108: vertical spacing belongs exclusively to WP Grid Builder blocks.
   The coordinator keeps the native wpgb-block classes and their configured margins. */