/* ==========================================================================
   EventGo Australia — WordPress-only additions to the V3 event page
   (eventgo-experience; NOT part of the synced V3 assets, never edits them)
   --------------------------------------------------------------------------
   · .eg-wp-incl   "incl. fees" next to all-in prices (PRODUCT-RULES §3)
   · .eg-wp-terms  Terms & Conditions acceptance before Continue (§1)
   Built only from the V3 design tokens (tokens.css) so it sits inside the
   ticket summary like a native part of it. No motion, no new colours.
   ========================================================================== */
.eg-wp-incl {
  font-family: var(--font-body); font-size: var(--t-meta); font-weight: 500; letter-spacing: 0;
  color: var(--c-text-2); white-space: nowrap;
}
.eg-c-tier[data-state="sold-out"] .eg-wp-incl,
.eg-c-tier[data-state="unavailable"] .eg-wp-incl { color: var(--c-text-3); }

/* R7: an ENDED event (EventView 'ended', by PastListing's rule). The frozen V3 CSS knows no such state: the badge
   ("Ended", hero and cards) takes the closed tone of "Sold out"; the hero's line and its two ways out replace the
   price and "Get tickets" inside the ticket stub. Tokens only, no new colours. */
.eg-c-evx__state[data-state="ended"], .eg-c-ecard__state[data-state="ended"] { color: var(--c-text-3); }
.eg-wp-ended { flex: 1 1 100%; margin: 0; font-size: var(--t-meta); line-height: 1.5; font-weight: 600; color: var(--c-text-2); }
.eg-wp-ended b { color: var(--c-text); font-weight: 700; }
.eg-wp-ended__acts { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.5rem; margin: 0; flex: 1 1 100%; }
@media (max-width: 519.98px) { .eg-wp-ended__acts .eg-c-btn { width: 100%; } }

.eg-wp-terms { display: grid; gap: .5rem; margin: 0; }
.eg-wp-terms__event { margin: 0; font-size: var(--t-meta); line-height: 1.45; color: var(--c-text-2); }
.eg-wp-terms__event b { margin-right: .25rem; color: var(--c-text); font-weight: 700; }
.eg-wp-terms__row { display: flex; align-items: flex-start; gap: .75rem; min-height: 44px; }
.eg-wp-terms__in {
  flex: none; width: 1.25rem; height: 1.25rem; margin: .125rem 0 0;
  accent-color: var(--c-accent); cursor: pointer;
}
.eg-wp-terms__in:focus-visible { outline: 3px solid var(--c-accent); outline-offset: 3px; }
.eg-wp-terms__t { font-size: var(--t-meta); line-height: 1.5; color: var(--c-text-2); cursor: pointer; }
.eg-wp-terms__t a { color: var(--c-text); text-decoration: underline; text-underline-offset: .18em; text-decoration-thickness: 1px; }
.eg-wp-terms__t a:hover { text-decoration-thickness: 2px; }
.eg-wp-terms__err { margin: 0; font-size: var(--t-meta); font-weight: 600; color: var(--status-warning); }
.eg-wp-terms__err:empty { display: none; }
.eg-wp-terms.is-invalid .eg-wp-terms__in { outline: 2px solid var(--status-warning); outline-offset: 3px; }
.eg-wp-terms__dev { margin: 0; font-size: .6875rem; line-height: 1.4; color: var(--c-text-3); overflow-wrap: anywhere; }
.eg-wp-terms__dev code { font-family: var(--font-mono); font-size: inherit; }
@media (forced-colors: active) {
  .eg-wp-terms.is-invalid .eg-wp-terms__in { outline-color: Mark; }
}

/* Breadcrumb: V3 caps the current crumb at 40ch with an ellipsis (90-detail.css). Real
   Eventin titles are longer than the prototype's, and at 320-360px 40ch is wider than the
   hero column, so the crumb was clipped by the hero with its ellipsis out of view. Cap it at
   the column as well; the ellipsis then shows. */
.eg-c-evx__in .eg-c-crumbs li { min-width: 0; max-width: 100%; }
.eg-c-evx__in .eg-c-crumbs [aria-current] { max-width: min(40ch, 100%); }   /* loads before the V3 CSS: out-specify it */

/* Homepage trust cue (V3 defect, frozen markup): 00-base.css makes every img display:block, so the
   inline WhatsApp glyph in "Email ticket included · [glyph] WhatsApp delivery optional" broke the
   line in three. Its own inline vertical-align shows it was meant to sit in the text. */
.eg-c-hh__deliver img[data-wa-mark] { display: inline-block; }

/* K1: abandoned-booking recovery disclosure beside the Terms checkbox / Continue (V3 checkout only). */
.eg-wp-terms__recovery { margin: .5rem 0 0; font-size: .8125rem; line-height: 1.45; color: var(--c-text-2); }

/* Homepage headline FAILSAFE (discovery/02 H13). The synced 21-home-hero.css hides the hero's lines and its
   [data-hh-fade] parts while html.eg-c-js is set (the pre-paint head script sets it); only body scripts take it
   off (eg-home-hero.js first, eg-boot.js as its safety net). If they never run — the network fails after the HTML,
   or a core file is missing — the head script's own failsafe lifts the Route Pass cover at 6s, and the headline
   would stay invisible for good. At the same 6s the hero shows itself. Self-cancelling: the moment a script removes
   html.eg-c-js these selectors stop matching and GSAP's own start state takes over, so it never touches an
   entrance that runs. The same pattern as the auth page's 3s failsafe (86-auth.css). Reduced motion never sets
   html.eg-c-js, so it never applies there. */
html.eg-c-js .eg-c-hh__line > span { animation: eg-wp-hh-rise .01s linear 6s forwards; }
html.eg-c-js [data-hh-fade] { animation: eg-wp-hh-show .01s linear 6s forwards; }
@keyframes eg-wp-hh-rise { to { transform: none; } }
@keyframes eg-wp-hh-show { to { opacity: 1; } }