/* ============================================================
   Fontanel Estate booking engine — guest + staff styles.
   All selectors scoped to .bte-embed to avoid WP conflicts.

   VISUAL SYSTEM — "ink and paper".
   The estate sells more than one kind of evening, so the chrome is
   monochrome and the EVENT'S OWN PHOTOGRAPH carries its personality. A
   Regency tea and a concert can then sit in the same grid without
   fighting. One accent (the estate green already used on the marketing
   site) handles links, focus and availability; primary actions are ink,
   which is what makes it read modern rather than corporate.

   Any event may override --bte-accent for its own card and page — see
   accent_color in DOCUMENTATION.md §5.
   ============================================================ */

.bte-embed {
    /* --- ink & paper -------------------------------------------------- */
    /* #111 rather than #000: pure black on white glares on an LCD and
       makes long copy harder to read. */
    --bte-ink:        #111114;  /* headings, primary actions            */
    --bte-body:       #3A3B38;  /* body copy                            */
    --bte-muted:      #6B6F6A;
    --bte-faint:      #9A9E98;
    --bte-border:     #E3E5E1;
    --bte-border-2:   #CFD2CC;
    --bte-cream:      #FFFFFF;  /* page ground (name kept: used widely) */
    --bte-ivory:      #F6F7F5;  /* wells                                */

    /* The greys carry a barely-perceptible green bias so they sit with
       the accent instead of looking like stock UI grey. */

    /* --- the one accent ----------------------------------------------- */
    /* #2D5A27 is already on fontanelestate.com (the homepage badge), so
       it's the estate's colour rather than one I invented. Events can
       override it per-event; nothing else in the system is coloured. */
    --bte-accent:     #2D5A27;
    --bte-accent-d:   #21441C;
    --bte-accent-wash:#EDF2EC;

    /* Primary actions. Ink by default — switch to var(--bte-accent) here
       if you'd rather the buttons carry the green. */
    --bte-action:     var(--bte-ink);
    --bte-action-d:   #2B2B30;

    --bte-gold:       #8A7A46;  /* packages — desaturated to sit in mono */
    --bte-gold-light: #E8E4D6;

    /* --- semantic: availability only. Deliberately not the accent, so a
           colour here always means state and never decoration. -------- */
    --bte-sage:       #2D5A27;  /* seats available                      */
    --bte-sage-wash:  #EDF2EC;
    --bte-amber:      #8A6410;  /* nearly gone                          */
    --bte-amber-wash: #F8F2E4;
    --bte-crit:       #A32820;  /* sold out / failed                    */
    --bte-crit-wash:  #F9ECEB;

    /* Legacy aliases — plenty of older rules still use these names. */
    --bte-peri:       var(--bte-border-2);
    --bte-peri-wash:  var(--bte-ivory);
    --bte-rose:       var(--bte-accent);
    --bte-rose-dark:  var(--bte-accent-d);

    /* --- type --------------------------------------------------------- */
    --bte-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans,
                Ubuntu, Cantarell, "Helvetica Neue", Arial, sans-serif;
    --bte-display: var(--bte-sans);

    /* Modern reads as crisp, not soft: tighter radii than before. */
    --bte-radius:    6px;
    --bte-radius-lg: 10px;

    font-family: var(--bte-sans);
    font-size: 1rem;
    line-height: 1.6;
    color: var(--bte-body);
    background: var(--bte-cream);
}

.bte-embed *,
.bte-embed *::before,
.bte-embed *::after {
    box-sizing: border-box;
}

/* ── Embed armour ─────────────────────────────────────────────
   When embed.js injects this markup into a WordPress page, the host theme's
   CSS cascades into it — that's where the serif headings, brown buttons and
   stray list numbers in a broken embed come from. These rules re-assert the
   booking UI over the theme. !important is used sparingly and only on the few
   properties host themes fight hardest over (typeface, list markers, button
   skin); a widget dropped into an unknown stylesheet is exactly the case it's
   meant for. All scoped to .bte-embed, so nothing here touches the host page. */
.bte-embed,
.bte-embed h1, .bte-embed h2, .bte-embed h3, .bte-embed h4, .bte-embed h5, .bte-embed h6,
.bte-embed p, .bte-embed a, .bte-embed span, .bte-embed div, .bte-embed li,
.bte-embed label, .bte-embed button, .bte-embed input, .bte-embed select, .bte-embed textarea {
    font-family: var(--bte-sans) !important;
    letter-spacing: normal;
}
.bte-embed h1, .bte-embed h2, .bte-embed h3, .bte-embed h4 {
    color: var(--bte-ink); line-height: 1.2; font-weight: 700;
}
.bte-embed p { color: var(--bte-body); }
.bte-embed a { text-decoration: none; box-shadow: none; }
.bte-embed ul, .bte-embed ol, .bte-embed li {
    list-style: none !important; margin: 0; padding: 0;
}
.bte-embed img { max-width: 100%; height: auto; }
/* Host themes love to skin every <button> and <input>. Neutralise that, then
   our own .bte-btn / field rules (below) re-apply the booking look at higher
   specificity so the theme can't win. */
.bte-embed button, .bte-embed input, .bte-embed select {
    margin: 0; text-transform: none; box-shadow: none;
}
/* Buttons: the theme fights over BOTH skin and SIZE (padding, width, font-size,
   radius), so armour both. Size first, so a themed padding/width can't reshape
   our CTAs. */
.bte-embed .bte-btn {
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    width: auto !important; min-width: 0 !important; max-width: none !important;
    height: auto !important; min-height: 0 !important;
    padding: 0.6rem 1.35rem !important;
    font-size: 0.9rem !important; font-weight: 650 !important; line-height: 1.3 !important;
    border-radius: var(--bte-radius) !important;
    text-transform: none !important; text-shadow: none !important; letter-spacing: normal !important;
    text-decoration: none !important; vertical-align: middle;
}
.bte-embed .bte-btn--primary { background: var(--bte-action) !important; color: #fff !important; border: 1px solid var(--bte-action) !important; }
.bte-embed .bte-btn--primary:hover { background: var(--bte-action-d) !important; border-color: var(--bte-action-d) !important; }
.bte-embed .bte-btn--outline { background: #fff !important; color: var(--bte-ink) !important; border: 1px solid var(--bte-border-2) !important; }
.bte-embed .bte-btn--soft { background: var(--bte-ivory) !important; color: var(--bte-ink) !important; border: 1px solid var(--bte-border) !important; }
/* Buttons that mean to be full-width or smaller keep their intent despite the above. */
.bte-embed .bte-wiz__btn--full { width: 100% !important; }
.bte-embed .bte-date__row .bte-btn { padding: 0.42rem 0.95rem !important; font-size: 0.82rem !important; }
/* CRITICAL: the armour's `display: … !important` above would otherwise force a
   [hidden] button to show. The wizard hides Back / Continue / Continue-to-payment
   with the hidden attribute as you move through the steps, so this must win. The
   `.bte-btn[hidden]` selector (0,2,1) out-specifies the armour (0,2,0). */
.bte-embed [hidden],
.bte-embed .bte-btn[hidden],
.bte-embed .bte-wiz__pm[hidden] { display: none !important; }

/* Stepper: fixed round ± and a centered number — never theme-sized. */
.bte-embed .bte-wiz__stepper { width: auto !important; }
.bte-embed .bte-wiz__pm {
    width: 34px !important; height: 34px !important; min-height: 0 !important; padding: 0 !important;
    flex: 0 0 auto !important; border-radius: 50% !important; font-size: 1.2rem !important; line-height: 1 !important;
    background: none !important; color: var(--bte-ink) !important; border: 0 !important; text-transform: none !important;
}
.bte-embed .bte-wiz__pm:hover { background: var(--bte-ivory) !important; }
.bte-embed .bte-wiz__qty {
    width: 44px !important; height: auto !important; padding: 0 !important; text-align: center !important;
    font-size: 1rem !important; border: 0 !important; background: none !important;
}
/* Detail inputs (name / email / phone): theme padding + width bleed here too. */
.bte-embed .bte-wiz__field input {
    width: 100% !important; height: auto !important; padding: 0.6rem 0.7rem !important;
    font-size: 1rem !important; border: 1px solid var(--w-border, var(--bte-border)) !important;
    border-radius: 9px !important;
}

/* ── Buttons ─────────────────────────────────────────────────
   Sized and weighted like Astra's own buttons so a booking CTA framed
   into the site doesn't announce itself as foreign. No uppercase, no
   letterspacing: the old treatment read as a different decade. */
.bte-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 0.6rem 1.35rem;
    font-family: var(--bte-sans);
    font-size: 0.9rem;
    font-weight: 650;
    line-height: 1.3;
    text-decoration: none;
    border: 1px solid transparent;
    border-radius: var(--bte-radius);
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.bte-btn--primary {
    background: var(--bte-action);
    color: #fff;
    border-color: var(--bte-action);
}

.bte-btn--primary:hover {
    background: var(--bte-action-d);
    border-color: var(--bte-action-d);
    color: #fff;
}

/* Secondary: a hairline, not a second filled button — so there's never a
   question about which action is the primary one. */
.bte-btn--outline {
    background: #fff;
    color: var(--bte-ink);
    border-color: var(--bte-border-2);
}

.bte-btn--outline:hover {
    background: var(--bte-ivory);
    border-color: var(--bte-ink);
    color: var(--bte-ink);
}

.bte-btn--soft {
    background: var(--bte-ivory);
    color: var(--bte-ink);
    border-color: var(--bte-border);
}

.bte-btn--soft:hover { background: #EDEEEB; border-color: var(--bte-border-2); }

.bte-btn[disabled],
.bte-btn--disabled {
    background: var(--bte-border);
    border-color: var(--bte-border);
    color: var(--bte-faint);
    cursor: not-allowed;
}

/* ── Availability chips ───────────────────────────────────────
   State, encoded in form as well as words, so a scan of the grid
   answers "can I come?" without reading. */
.bte-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.18rem 0.55rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    white-space: nowrap;
}

.bte-chip--ok   { background: var(--bte-sage-wash);  color: var(--bte-sage); }
.bte-chip--few  { background: var(--bte-amber-wash); color: var(--bte-amber); }
.bte-chip--out  { background: var(--bte-crit-wash);  color: var(--bte-crit); }
.bte-chip--gilt { background: #FAF3E0;               color: #806012; }

/* ── Section chrome ──────────────────────────────────────── */
/* Left-aligned to sit in the flow of a WordPress page rather than
   announcing itself as a separate centred composition. */
.bte-section-head {
    text-align: left;
    margin-bottom: 1.25rem;
}

.bte-section-label {
    margin: 0 0 0.25rem;
    font-family: var(--bte-sans);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    color: var(--bte-accent);
}

.bte-section-title {
    margin: 0 0 0.4rem;
    font-family: var(--bte-display);
    /* Astra's own h2 scale, so a framed heading matches the page around it. */
    font-size: clamp(1.35rem, 3vw, 2rem);
    font-weight: 600;
    line-height: 1.25;
    color: var(--bte-ink);
}

.bte-rule {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
}

.bte-rule span:not(.bte-diamond) {
    display: block;
    width: 4rem;
    height: 1px;
    background: var(--bte-gold);
}

.bte-diamond {
    font-size: 0.55rem;
    color: var(--bte-gold);
}

/* ── Hero ────────────────────────────────────────────────── */
.bte-hero {
    position: relative;
    min-height: 56vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 5rem 1.5rem 4rem;
    background:
        linear-gradient(180deg, rgba(181,100,90,0.06) 0%, transparent 60%),
        var(--bte-cream);
    border-bottom: 1px solid var(--bte-border);
    overflow: hidden;
}

.bte-hero__inner {
    position: relative;
    z-index: 1;
    max-width: 700px;
}

.bte-eyebrow {
    margin: 0 0 0.6rem;
    font-family: var(--bte-display);
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--bte-gold);
}

.bte-title {
    margin: 0 0 0.75rem;
    font-family: var(--bte-display);
    font-size: clamp(2.75rem, 5.5vw, 5rem);
    font-weight: 600;
    line-height: 1.05;
    color: var(--bte-ink);
}

.bte-location {
    margin: 0 0 2rem;
    font-size: 1.1rem;
    font-style: italic;
    color: var(--bte-muted);
}

.bte-hero__ornament {
    margin-top: 2rem;
}

.bte-flourish {
    font-size: 2rem;
    color: var(--bte-gold);
    opacity: 0.5;
}

/* ── Dates ───────────────────────────────────────────────── */
.bte-dates {
    padding: 4rem 1.5rem;
    background: var(--bte-ivory);
    border-top: 1px solid var(--bte-border);
    border-bottom: 1px solid var(--bte-border);
}

.bte-dates__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
    max-width: 1100px;
    margin: 0 auto;
}

.bte-date-card {
    background: #fff;
    border: 1px solid var(--bte-border);
    padding: 2rem 1.5rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
}

.bte-date-card__date {
    margin: 0;
    font-family: var(--bte-display);
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--bte-ink);
}

.bte-date-card__time {
    margin: 0;
    font-size: 1rem;
    color: var(--bte-muted);
}

.bte-date-card__price {
    margin: 0 0 1rem;
    font-family: var(--bte-display);
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--bte-rose);
}

.bte-date-card--cta {
    grid-column: span 3;
    background: var(--bte-cream);
    border-color: var(--bte-gold-light);
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem 2rem;
    padding: 1.5rem 2rem;
}

.bte-date-card--cta .bte-date-card__date {
    font-size: 1.2rem;
}

.bte-date-card--cta .bte-date-card__time {
    font-size: 0.95rem;
}

/* ── Menu ────────────────────────────────────────────────── */
.bte-menu {
    padding: 4rem 1.5rem;
    background: var(--bte-cream);
}

.bte-menu__columns {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2rem;
    max-width: 1100px;
    margin: 0 auto 2rem;
}

.bte-menu__col {
    text-align: center;
    padding: 2rem 1.5rem;
    border: 1px solid var(--bte-border);
    background: var(--bte-ivory);
}

.bte-menu__col h3 {
    margin: 0 0 0.75rem;
    font-family: var(--bte-display);
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--bte-ink);
}

.bte-menu__col p {
    margin: 0;
    color: var(--bte-muted);
    font-size: 1rem;
}

.bte-menu__note {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    font-size: 1rem;
    color: var(--bte-sage);
    font-style: italic;
    padding: 1.25rem 1.5rem;
    border-top: 1px solid var(--bte-border);
}

/* ── Details ─────────────────────────────────────────────── */
.bte-details {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    background: var(--bte-ivory);
    border-top: 1px solid var(--bte-border);
    border-bottom: 1px solid var(--bte-border);
}

.bte-detail-card {
    padding: 3rem 2rem;
    border-right: 1px solid var(--bte-border);
}

.bte-detail-card:last-child {
    border-right: none;
}

.bte-detail-card__icon {
    font-size: 1.1rem;
    color: var(--bte-gold);
    margin-bottom: 0.75rem;
}

.bte-detail-card h2 {
    margin: 0 0 0.9rem;
    font-family: var(--bte-display);
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--bte-ink);
}

.bte-detail-card p {
    margin: 0 0 0.85rem;
    color: var(--bte-muted);
    font-size: 1rem;
}

.bte-detail-card strong {
    color: var(--bte-rose);
}

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 900px) {
    .bte-dates__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .bte-date-card--cta {
        grid-column: span 2;
    }

    .bte-menu__columns {
        grid-template-columns: 1fr;
    }

    .bte-details {
        grid-template-columns: 1fr;
    }

    .bte-detail-card {
        border-right: none;
        border-bottom: 1px solid var(--bte-border);
    }

    .bte-detail-card:last-child {
        border-bottom: none;
    }
}

@media (max-width: 600px) {
    .bte-hero {
        padding: 3.5rem 1.25rem 3rem;
    }

    .bte-dates__grid {
        grid-template-columns: 1fr;
    }

    .bte-date-card--cta {
        grid-column: span 1;
        flex-direction: column;
    }

    .bte-detail-card {
        padding: 2rem 1.25rem;
    }
}

/* ============================================================
   Booking engine — checkout, tickets, check-in, admin.
   Everything below is also scoped to .bte-embed / .bte-page.
   ============================================================ */

/* Standalone pages get a min-height + centered column. */
.bte-page {
    min-height: 100vh;
    padding: 2.5rem 1.25rem 4rem;
}

/* ── Framed mode ──────────────────────────────────────────────
   Inside the iframe on fontanelestate.com the page IS the content: no
   full-viewport height (the frame is sized to fit by frame.js, and a
   100vh floor would leave a permanent gap), and only enough padding to
   keep cards off the frame edge. The WordPress page supplies the rest. */
.bte-page--frame {
    min-height: 0;
    padding: 0.25rem 0 1rem;
    background: transparent;
}

/* ── Branded chrome for standalone booking-host pages ─────────────────
   Only shown on full pages a guest might land on directly (checkout,
   success, ticket, package links). The inline embed never uses these —
   it keeps WordPress's own header and footer. */
.bte-sitehdr {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    padding: 1rem clamp(1rem, 4vw, 2.5rem);
    border-bottom: 1px solid var(--bte-border);
    background: #fff;
}
.bte-sitehdr__brand { display: flex; flex-direction: column; line-height: 1.1; text-decoration: none; }
.bte-sitehdr__name {
    font-size: 1.05rem; font-weight: 700; letter-spacing: 0.02em; color: var(--bte-ink);
}
.bte-sitehdr__sub {
    font-size: 0.62rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--bte-faint);
}
.bte-sitehdr__link { font-size: 0.82rem; font-weight: 600; color: var(--bte-muted); text-decoration: none; white-space: nowrap; }
.bte-sitehdr__link:hover { color: var(--bte-ink); }

/* With a header above, the content no longer needs a full-viewport floor or a
   big top pad — it sits directly under the bar. */
.bte-page--chrome { min-height: 0; padding: clamp(1.5rem, 4vw, 2.75rem) 1.25rem 3rem; }
/* Keep the footer at the bottom on short pages (a 404, a sold-out notice). */
body:has(.bte-page--chrome) { min-height: 100vh; display: flex; flex-direction: column; }
body:has(.bte-page--chrome) .bte-page--chrome { flex: 1 0 auto; }

.bte-sitefoot {
    margin-top: 2rem;
    padding: 2rem clamp(1rem, 4vw, 2.5rem);
    border-top: 1px solid var(--bte-border);
    background: var(--bte-ivory);
    text-align: center;
    color: var(--bte-muted);
    font-size: 0.85rem;
}
.bte-sitefoot p { margin: 0.15rem 0; }
.bte-sitefoot__name { font-weight: 650; color: var(--bte-ink); }
.bte-sitefoot__link { margin-top: 0.6rem; }
.bte-sitefoot__link a { color: var(--bte-muted); }
.bte-sitefoot__link a:hover { color: var(--bte-ink); }

.bte-framepage__sec + .bte-framepage__sec { margin-top: 2.75rem; }

/* ── Date-card booking controls ──────────────────────────── */
.bte-date-card__per {
    font-size: 0.85rem;
    font-weight: 400;
    color: var(--bte-muted);
}

.bte-date-card__form {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    margin-top: 0.25rem;
}

.bte-date-card__qty {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
    color: var(--bte-muted);
}

.bte-date-card__qty select,
.bte-field select,
.bte-field input,
.bte-admin__form input,
.bte-admin__form select {
    font-family: inherit;
    font-size: 1rem;
    padding: 0.5rem 0.65rem;
    border: 1px solid var(--bte-border);
    background: #fff;
    color: var(--bte-ink);
    border-radius: 0;
}

.bte-date-card__seats {
    margin: 0;
    font-size: 0.8rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--bte-sage);
}

.bte-date-card__soldout {
    margin: 0.5rem 0 0;
    font-family: var(--bte-display);
    font-size: 1.1rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--bte-rose-dark);
}

/* ── Forms (checkout) ────────────────────────────────────── */
.bte-checkout,
.bte-confirm,
.bte-ticket,
.bte-checkin,
.bte-staff,
.bte-admin {
    max-width: 720px;
    margin: 0 auto;
}

.bte-checkout__meta {
    color: var(--bte-muted);
    font-style: italic;
}

.bte-form {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    max-width: 480px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid var(--bte-border);
    padding: 2rem;
}

.bte-field {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.bte-field__label {
    font-family: var(--bte-display);
    font-weight: 600;
    letter-spacing: 0.04em;
    color: var(--bte-ink);
}

.bte-field__hint {
    font-size: 0.8rem;
    color: var(--bte-sage);
}

.bte-consent {
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
    font-size: 0.82rem;
    line-height: 1.5;
    color: var(--bte-muted);
    background: var(--bte-cream);
    border: 1px solid var(--bte-border);
    padding: 0.85rem;
}

.bte-consent input {
    margin-top: 0.2rem;
    flex: 0 0 auto;
}

.bte-form__submit {
    width: 100%;
}

.bte-form__note {
    margin: 0;
    font-size: 0.8rem;
    text-align: center;
    color: var(--bte-sage);
}

/* ── Alerts ──────────────────────────────────────────────── */
.bte-alert {
    max-width: 480px;
    margin: 0 auto 1.25rem;
    padding: 0.85rem 1rem;
    text-align: center;
    background: var(--bte-ivory);
    border: 1px solid var(--bte-border);
    color: var(--bte-muted);
}

.bte-alert--error {
    background: #fbeceb;
    border-color: var(--bte-rose);
    color: var(--bte-rose-dark);
}

.bte-alert--notice {
    background: #eef3ea;
    border-color: var(--bte-sage);
    color: var(--bte-sage);
}

/* ── Confirmation / cancel ───────────────────────────────── */
.bte-confirm {
    text-align: center;
    padding-top: 2rem;
}

.bte-confirm__mark {
    font-size: 2.5rem;
    color: var(--bte-gold);
    opacity: 0.6;
}

.bte-confirm__title {
    font-family: var(--bte-display);
    font-size: clamp(2.2rem, 4vw, 3rem);
    font-weight: 600;
    margin: 0.5rem 0 1rem;
    color: var(--bte-ink);
}

.bte-confirm__lead {
    font-size: 1.1rem;
    color: var(--bte-muted);
    max-width: 520px;
    margin: 0 auto 2rem;
}

.bte-confirm__card {
    background: #fff;
    border: 1px solid var(--bte-border);
    padding: 2rem;
    max-width: 440px;
    margin: 0 auto 2rem;
}

.bte-confirm__event {
    font-family: var(--bte-display);
    font-size: 1.4rem;
    font-weight: 600;
    margin: 0 0 0.25rem;
}

.bte-confirm__meta {
    margin: 0.15rem 0;
    color: var(--bte-muted);
}
.bte-confirm__totals {
    margin: 0.75rem auto 0;
    max-width: 20rem;
    display: grid;
    gap: 0.3rem;
    text-align: left;
}
.bte-confirm__totals > div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    font-size: 0.9rem;
    color: var(--bte-muted);
}
.bte-confirm__totals dt, .bte-confirm__totals dd { margin: 0; }
.bte-confirm__grand {
    margin-top: 0.25rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--bte-border, #e4e2dd);
    font-weight: 700;
    color: var(--bte-ink) !important;
    font-size: 1rem !important;
}

/* ---------------------------------------------------------------------------
   Offers / packages — the "Packages" grid and the prefilled-wizard banner.
   Cards reuse .bte-tour-card, so only the extra bits are defined here.
   --------------------------------------------------------------------------- */

.bte-offers__when {
    margin: 0.35rem 0 0;
    color: var(--bte-muted);
    font-size: 0.92rem;
}

.bte-offers__left {
    align-self: flex-start;
    margin: 0.4rem 0 0;
    padding: 0.18rem 0.55rem;
    border-radius: 999px;
    background: var(--bte-amber-wash);
    color: var(--bte-amber);
    font-size: 0.72rem;
    font-weight: 700;
}

.bte-offers__cta { margin: 1rem 0 0; }

/* Banner at the top of a wizard that was opened from a package link. */
.bte-offer-banner {
    background: #fff;
    border: 1px solid var(--bte-border);
    border-left: 3px solid var(--bte-gold, #b08d3f);
    padding: 1.1rem 1.3rem;
    margin: 0 0 1.5rem;
}

.bte-offer-banner__label {
    margin: 0;
    font-size: 0.72rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--bte-muted);
}

.bte-offer-banner__title {
    font-family: var(--bte-display);
    font-size: 1.35rem;
    font-weight: 600;
    margin: 0.25rem 0 0;
}

.bte-offer-banner__desc { margin: 0.4rem 0 0; color: var(--bte-muted); }

.bte-offer-banner__note {
    margin: 0.5rem 0 0;
    font-size: 0.9rem;
    color: var(--bte-muted);
    font-style: italic;
}

/* "We left the 11am tour off — it's full" — must be noticed, not alarming. */
.bte-offer-banner__changes {
    margin: 0.7rem 0 0;
    padding: 0.6rem 0 0 1.1rem;
    border-top: 1px solid var(--bte-border);
    font-size: 0.9rem;
    color: var(--bte-rose-dark);
}

.bte-offer-banner__changes li { margin: 0.2rem 0; }

.bte-offer-gone { text-align: center; padding: 3rem 1rem; }

.bte-offer-gone__title {
    font-family: var(--bte-display);
    font-size: 1.8rem;
    font-weight: 600;
    margin: 0 0 0.75rem;
}

/* Line-item receipt on the thank-you page (drives tour-only orders too). */
.bte-confirm__items {
    list-style: none;
    margin: 0.85rem 0;
    padding: 0.85rem 0;
    border-top: 1px solid var(--bte-border);
    border-bottom: 1px solid var(--bte-border);
    text-align: left;
    color: var(--bte-muted);
    font-size: 0.95rem;
}

.bte-confirm__items li { margin: 0.2rem 0; }

.bte-confirm__tickets {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--bte-border);
}

.bte-confirm__tickets-label,
.bte-confirm__pending {
    margin: 0;
    font-size: 0.9rem;
    color: var(--bte-sage);
}

/* ── Ticket ──────────────────────────────────────────────── */
.bte-ticket {
    text-align: center;
}

.bte-ticket__card {
    background: #fff;
    border: 1px solid var(--bte-border);
    border-top: 4px solid var(--bte-rose);
    padding: 2.25rem 2rem;
    max-width: 380px;
    margin: 0 auto 1.25rem;
}

.bte-ticket--checked_in {
    border-top-color: var(--bte-sage);
}

.bte-ticket--void {
    border-top-color: var(--bte-muted);
    opacity: 0.8;
}

.bte-ticket__eyebrow {
    margin: 0;
    font-size: 0.8rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--bte-gold);
}

.bte-ticket__title {
    font-family: var(--bte-display);
    font-size: 1.6rem;
    font-weight: 600;
    margin: 0.35rem 0 0.25rem;
    color: var(--bte-ink);
}

.bte-ticket__meta {
    margin: 0 0 0.25rem;
    color: var(--bte-muted);
}

.bte-ticket__guest {
    font-family: var(--bte-display);
    font-size: 1.2rem;
    font-weight: 600;
    margin: 0.5rem 0 1rem;
}

.bte-ticket__qr {
    display: inline-block;
    padding: 0.75rem;
    background: #fff;
    border: 1px solid var(--bte-border);
}

.bte-ticket__qr img {
    display: block;
    width: 240px;
    height: 240px;
}

.bte-ticket__code {
    font-family: var(--bte-display);
    letter-spacing: 0.15em;
    font-size: 1rem;
    margin: 1rem 0 0.5rem;
    color: var(--bte-ink);
}

.bte-ticket__status {
    display: inline-block;
    font-size: 0.8rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 0.3rem 0.9rem;
    border: 1px solid currentColor;
}

.bte-ticket__status--valid { color: var(--bte-rose); }
.bte-ticket__status--checked_in { color: var(--bte-sage); }
.bte-ticket__status--void { color: var(--bte-muted); }

.bte-ticket__note {
    margin: 0.9rem 0 0;
    font-size: 0.85rem;
    color: var(--bte-muted);
}

.bte-ticket__location {
    font-size: 0.8rem;
    color: var(--bte-sage);
}

/* ── Check-in result ─────────────────────────────────────── */
.bte-checkin__result {
    text-align: center;
    max-width: 420px;
    margin: 2rem auto 0;
    padding: 2.5rem 2rem;
    background: #fff;
    border: 2px solid var(--bte-border);
}

.bte-checkin__result h1 {
    font-family: var(--bte-display);
    font-size: 2rem;
    margin: 0 0 0.75rem;
}

.bte-checkin__result--ok { border-color: var(--bte-sage); }
.bte-checkin__result--ok h1 { color: var(--bte-sage); }
.bte-checkin__result--already { border-color: var(--bte-gold); }
.bte-checkin__result--already h1 { color: var(--bte-gold); }
.bte-checkin__result--void { border-color: var(--bte-rose); }
.bte-checkin__result--void h1 { color: var(--bte-rose-dark); }

.bte-checkin__guest {
    font-size: 1.3rem;
    font-weight: 600;
    margin: 0 0 0.5rem;
}

.bte-checkin__meta { color: var(--bte-muted); margin: 0 0 0.75rem; }
.bte-checkin__code { letter-spacing: 0.15em; color: var(--bte-muted); margin: 0; }
.bte-checkin__note { font-size: 0.85rem; color: var(--bte-muted); margin: 0.75rem 0 0; }

/* ── Staff dashboard ─────────────────────────────────────── */
.bte-staff__meta { color: var(--bte-muted); font-style: italic; margin: 0.25rem 0; }
.bte-staff__count { color: var(--bte-ink); font-size: 1.1rem; margin: 0.25rem 0 0; }

.bte-staff__list {
    list-style: none;
    padding: 0;
    margin: 1.5rem auto 0;
    max-width: 560px;
}

.bte-staff__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 1rem;
    background: #fff;
    border: 1px solid var(--bte-border);
    border-bottom: none;
}

.bte-staff__row:last-child { border-bottom: 1px solid var(--bte-border); }
.bte-staff__row--checked_in { background: #f2f5ef; }
.bte-staff__row--void { opacity: 0.6; }

.bte-staff__who { display: flex; flex-direction: column; text-align: left; }
.bte-staff__name { font-weight: 600; }
.bte-staff__code { font-size: 0.78rem; letter-spacing: 0.1em; color: var(--bte-muted); }

.bte-staff__badge {
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 0.25rem 0.6rem;
}
.bte-staff__badge--in { color: var(--bte-sage); }
.bte-staff__badge--void { color: var(--bte-muted); }

.bte-staff__btn { padding: 0.5rem 1.1rem; font-size: 0.85rem; }

/* ── Admin ───────────────────────────────────────────────── */
.bte-admin { max-width: 960px; }

.bte-admin__title {
    font-family: var(--bte-display);
    font-size: 2rem;
    margin: 0 0 1.5rem;
}

.bte-admin__panel {
    background: #fff;
    border: 1px solid var(--bte-border);
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.bte-admin__panel h2 {
    font-family: var(--bte-display);
    font-size: 1.4rem;
    margin: 0 0 1rem;
}

.bte-admin__form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.bte-admin__form label {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    font-size: 0.85rem;
    color: var(--bte-muted);
}

.bte-admin__form .bte-btn,
.bte-admin__hint { grid-column: span 2; }
.bte-admin__hint { font-size: 0.8rem; color: var(--bte-sage); margin: 0; }

/* Recurring-tour admin: weekly schedule editor + closures */
.bte-admin__sched { grid-column: span 2; border: 1px solid var(--bte-border); border-radius: 8px; padding: 0.9rem 1rem; }
.bte-admin__sched legend { font-weight: 600; padding: 0 0.4rem; }
.bte-admin__sched-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.6rem 1rem; margin-top: 0.5rem; }
.bte-admin__sched-grid label { display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.82rem; color: var(--bte-muted); }
.bte-admin__toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 0.75rem; margin-bottom: 1rem; }
.bte-admin__closures { margin-bottom: 1.25rem; border: 1px solid var(--bte-border); border-radius: 8px; padding: 0.5rem 1rem; }
.bte-admin__closures summary { cursor: pointer; font-weight: 600; padding: 0.35rem 0; }
.bte-admin__closure-list { list-style: none; margin: 0.5rem 0; padding: 0; display: grid; gap: 0.4rem; }
.bte-admin__closure-list li { display: flex; justify-content: space-between; align-items: center; gap: 1rem; font-size: 0.88rem; }
@media (max-width: 640px) { .bte-admin__sched-grid { grid-template-columns: 1fr; } }

.bte-admin__table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.bte-admin__table th,
.bte-admin__table td {
    text-align: left;
    padding: 0.6rem 0.5rem;
    border-bottom: 1px solid var(--bte-border);
    vertical-align: top;
}

.bte-admin__table small { color: var(--bte-muted); }
.bte-admin__inline { margin: 0; }

.bte-admin__status {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.15rem 0.5rem;
    border: 1px solid currentColor;
}
.bte-admin__status--paid { color: var(--bte-sage); }
.bte-admin__status--refunded { color: var(--bte-rose-dark); }
.bte-admin__status--failed { color: #8a1c1c; }

.bte-admin__refund { padding: 0.4rem 0.9rem; font-size: 0.8rem; }

.bte-admin__subhead {
    font-family: var(--bte-display);
    font-size: 1.1rem;
    font-weight: 600;
    margin: 1.5rem 0 0.75rem;
    padding-top: 1rem;
    border-top: 1px solid var(--bte-border);
    color: var(--bte-ink);
}

.bte-admin__full { grid-column: span 2; }

/* Link-style button for inline table actions (Delete, Resend). */
.bte-admin__link-btn {
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    font-size: 0.9rem;
    color: var(--bte-rose);
    cursor: pointer;
    text-decoration: underline;
}
.bte-admin__link-btn:hover { color: var(--bte-rose-dark); }
/* Destructive inline action — reads as dangerous without shouting. */
.bte-admin__danger { color: var(--bte-crit); }
.bte-admin__danger:hover { color: #8a1c1c; }

/* Event drill-down */
.bte-admin__detail-head {
    display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between;
    gap: 1rem; margin-bottom: 1.25rem;
}
.bte-admin__detail-head h2 { margin: 0 0 0.2rem; }
.bte-admin__totals {
    display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem;
    padding: 0.75rem 1rem; margin-bottom: 1.25rem;
    background: var(--bte-paper, #f7f6f3); border: 1px solid var(--bte-border);
    border-radius: 8px; font-size: 0.9rem; color: var(--bte-muted);
}
.bte-admin__totals b { color: var(--bte-ink); font-weight: 600; margin-right: 0.3rem; }
.bte-admin__totals-grand { margin-left: auto; }
.bte-admin__totals-grand b { color: var(--bte-ink); }
.bte-admin__table--tight { font-size: 0.86rem; margin-bottom: 0.5rem; }
.bte-admin__table--tight th, .bte-admin__table--tight td { padding: 0.4rem 0.6rem; }
.bte-admin__table .t__num,
.bte-admin__table--tight .t__num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.bte-admin__table code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.85em; }

.bte-admin__row-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

@media (max-width: 600px) {
    .bte-admin__form { grid-template-columns: 1fr; }
    .bte-admin__form .bte-btn,
    .bte-admin__hint,
    .bte-admin__full { grid-column: span 1; }
    .bte-admin__table { display: block; overflow-x: auto; }
}

/* ============================================================
   Tours & Options (addons) — cart upsell, tours listing,
   SEO landing pages, embed. Scoped to .bte-embed as before.
   ============================================================ */

/* ── Checkout addon fieldsets ────────────────────────────── */
.bte-addons {
    border: 1px solid var(--bte-border);
    padding: 1rem 1.1rem 1.2rem;
    margin: 0;
    background: var(--bte-cream);
}

.bte-addons legend {
    font-family: var(--bte-display);
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--bte-ink);
    padding: 0 0.5rem;
}

.bte-addons legend span {
    font-family: var(--bte-sans);
    font-size: 0.85rem;
    font-style: italic;
    color: var(--bte-muted);
}

.bte-addons .bte-field { margin-top: 0.75rem; }

/* Option rows: title/desc/price on the left, qty select on the right. */
.bte-option-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.7rem 0;
    border-top: 1px solid var(--bte-border);
}
.bte-option-row:first-of-type { border-top: none; }

.bte-option-row__info { display: flex; flex-direction: column; }
.bte-option-row__title { font-weight: 600; color: var(--bte-ink); }
.bte-option-row__desc { font-size: 0.85rem; color: var(--bte-muted); }
.bte-option-row__price { font-size: 0.85rem; color: var(--bte-rose); }
.bte-option-row select { flex: 0 0 auto; }

/* ── Tours listing ───────────────────────────────────────── */
/* ── Tours & packages ─────────────────────────────────────────
   Same card language as the tea dates, so a guest scrolling from one
   to the other never feels handed to a different product. */
.bte-tours { padding: 0; background: var(--bte-cream); }

.bte-tours__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1rem;
    max-width: 1000px;
    margin: 0 auto;
}

.bte-tours__empty {
    text-align: center;
    color: var(--bte-muted);
    padding: 2.5rem 1rem;
    background: var(--bte-ivory);
    border: 1px solid var(--bte-border);
    border-radius: var(--bte-radius-lg);
}

.bte-tour-card {
    background: #fff;
    border: 1px solid var(--bte-border);
    border-radius: var(--bte-radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.bte-tour-card:hover {
    border-color: var(--bte-peri);
    box-shadow: 0 1px 2px rgba(30,41,59,.06), 0 8px 20px -12px rgba(30,41,59,.3);
}

/* Card body: everything except the image gets the padding. */
.bte-tour-card > *:not(.bte-tour-card__img) { margin-left: 1rem; margin-right: 1rem; }
.bte-tour-card > *:first-child:not(.bte-tour-card__img) { margin-top: 1rem; }
.bte-tour-card__slots { margin-bottom: 1rem; }

.bte-tour-card__title {
    font-family: var(--bte-display);
    font-size: 1.02rem;
    font-weight: 650;
    margin: 0.95rem 0 0.35rem;
    color: var(--bte-ink);
}

.bte-tour-card__desc { margin: 0 0 0.5rem; color: var(--bte-muted); font-size: 0.85rem; }

.bte-tour-card__price {
    font-size: 0.88rem;
    font-weight: 650;
    color: var(--bte-ink);
    margin: 0 0 0.2rem;
    font-variant-numeric: tabular-nums;
}
.bte-tour-card__price span { font-size: 0.85rem; font-weight: 400; color: var(--bte-muted); }

.bte-tour-card__slots {
    list-style: none;
    margin-top: 0.55rem;
    padding: 0.6rem 0 0;
    border-top: 1px solid var(--bte-border);
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.bte-tour-slot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.7rem;
    font-size: 0.85rem;
}

.bte-tour-slot__when { color: var(--bte-body); font-variant-numeric: tabular-nums; }
.bte-tour-slot__btn { padding: 0.35rem 0.8rem; font-size: 0.78rem; white-space: nowrap; }
.bte-tour-slot__full {
    font-size: 0.72rem;
    font-weight: 700;
    padding: 0.18rem 0.55rem;
    border-radius: 999px;
    background: var(--bte-crit-wash);
    color: var(--bte-crit);
}

/* ── SEO landing pages ───────────────────────────────────── */
.bte-landing {
    max-width: 640px;
    margin: 0 auto;
    text-align: center;
}
.bte-landing__meta { color: var(--bte-muted); font-style: italic; }
.bte-landing__desc { color: var(--bte-muted); max-width: 520px; margin: 0 auto 1.5rem; }
.bte-landing__where { color: var(--bte-sage); margin: 1.5rem 0; line-height: 1.6; }
.bte-landing__cta { margin-top: 1.5rem; }
.bte-landing__slots { max-width: 480px; margin: 1.5rem auto 0; text-align: left; }

/* Guest self-service (reschedule / cancel-request) */
.bte-manage__lead { color: var(--bte-muted); margin: 0 auto 1.5rem; max-width: 520px; }
.bte-manage__form { max-width: 460px; margin: 0 auto; text-align: left; display: grid; gap: 1.1rem; }
.bte-manage__dates { border: 1px solid var(--bte-border); border-radius: 10px; padding: 0.9rem 1rem; display: grid; gap: 0.2rem; }
.bte-manage__dates legend { font-weight: 600; padding: 0 0.4rem; }
.bte-manage__opt { display: flex; align-items: center; gap: 0.6rem; padding: 0.5rem 0.3rem; border-radius: 8px; cursor: pointer; }
.bte-manage__opt:hover { background: var(--bte-paper, #f7f6f3); }
.bte-manage__note { display: flex; flex-direction: column; gap: 0.35rem; font-size: 0.9rem; color: var(--bte-muted); }
.bte-manage__note textarea { font: inherit; padding: 0.5rem 0.6rem; border: 1px solid var(--bte-border); border-radius: 8px; resize: vertical; }
.bte-manage__fine { font-size: 0.8rem; color: var(--bte-muted); max-width: 460px; margin: 0.9rem auto 0; text-align: center; }
/* Admin flag when a guest submitted a reschedule/cancel request */
.bte-adm__reqflag { display: inline-block; margin-top: 0.25rem; font-size: 0.72rem; font-weight: 600; color: #9a3412; background: #fff3e6; border: 1px solid #f5c99b; border-radius: 999px; padding: 0.1rem 0.5rem; }

/* ── Admin: option curation + booking items ──────────────── */
.bte-admin__options {
    border: 1px solid var(--bte-border);
    border-radius: 8px;
    padding: 0.9rem 1rem 1rem;
    margin: 0;
}
.bte-admin__options legend {
    font-size: 0.78rem; font-weight: 600; letter-spacing: 0.02em;
    color: var(--bte-muted); padding: 0 0.4rem;
}
/* Checks in a neat left-aligned grid — each a tickable row, not a centred stack. */
.bte-admin__checks {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 0.4rem 0.6rem;
    margin-top: 0.5rem;
}
/* Beat the generic ".bte-admin__form label { flex-direction: column }" that was
   stacking (and centring) each checkbox above its text. */
.bte-admin__form .bte-admin__check,
.bte-admin__check {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
    text-align: left;
    margin: 0;
    padding: 0.45rem 0.6rem;
    border: 1px solid var(--bte-border);
    border-radius: 6px;
    font-size: 0.88rem;
    color: var(--bte-ink);
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
}
.bte-admin__check:hover { border-color: var(--bte-border-2); background: var(--bte-ivory); }
.bte-admin__check input { flex: 0 0 auto; width: 16px; height: 16px; margin: 0; }
.bte-admin__check-t { flex: 1; min-width: 0; }
.bte-admin__check-p { color: var(--bte-muted); font-variant-numeric: tabular-nums; }
/* The standalone "Featured" checkbox uses the same class but shouldn't be boxed. */
.bte-admin__form > .bte-admin__check { border: 0; padding: 0.2rem 0; }
.bte-admin__form > .bte-admin__check:hover { background: none; }

.bte-admin__items { list-style: none; margin: 0; padding: 0; font-size: 0.85rem; }
.bte-admin__items li { padding: 0.1rem 0; }
.bte-admin__items small { color: var(--bte-muted); }

/* ── Embed loading state ─────────────────────────────────── */
.bte-embed__loading {
    text-align: center;
    padding: 2rem;
    color: var(--bte-muted);
    font-style: italic;
}

/* ── Images (events / tours / checkout / landing) ────────── */
.bte-date-card__img {
    width: 100%;
    height: 150px;
    object-fit: cover;
    margin-bottom: 0.85rem;
    border: 1px solid var(--bte-border);
}

.bte-tour-card__img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
    object-fit: cover;
    margin: 0;
}

.bte-checkout__img,
.bte-landing__img {
    display: block;
    width: 100%;
    max-width: 480px;
    height: 240px;
    object-fit: cover;
    margin: 0 auto 1.5rem;
    border: 1px solid var(--bte-border);
}

/* Option thumbnail in the checkout options list. */
.bte-option-row__img {
    width: 56px;
    height: 56px;
    object-fit: cover;
    border: 1px solid var(--bte-border);
    flex: 0 0 auto;
    margin-right: 0.75rem;
}

/* ============================================================
   Auth — login, staff home, admin who-am-I, booking portal.
   ============================================================ */

/* ── Login ───────────────────────────────────────────────── */
.bte-login { max-width: 440px; margin: 0 auto; text-align: center; }
.bte-login__hint { color: var(--bte-muted); font-size: 0.95rem; margin: 0 auto 1.25rem; max-width: 26rem; }
.bte-login__form { max-width: 340px; }
.bte-login__form input[name="code"] {
    text-align: center;
    letter-spacing: 0.4em;
    font-size: 1.4rem;
    font-family: var(--bte-display);
}
.bte-login__resend { margin-top: 1rem; }
.bte-login__link {
    background: none; border: none; padding: 0; font: inherit;
    color: var(--bte-rose); text-decoration: underline; cursor: pointer;
}
.bte-login__link:hover { color: var(--bte-rose-dark); }

/* ── Staff home / admin who-am-I ─────────────────────────── */
.bte-staff__subhead {
    font-family: var(--bte-display);
    font-size: 1.3rem;
    font-weight: 600;
    margin: 1.75rem auto 0.5rem;
    max-width: 560px;
    color: var(--bte-ink);
}
.bte-admin__whoami {
    margin: -0.5rem 0 1.5rem;
    font-size: 0.9rem;
    color: var(--bte-muted);
}
.bte-admin__whoami a,
.bte-staff__meta a { color: var(--bte-rose); }

/* ============================================================
   Booking portal — glassmorphism splash + login (index.php,
   login.php). A frosted card floats over a gradient with soft
   orbs, in the estate's rose / plum / gold palette.
   ============================================================ */

/* Full-viewport gradient backdrop + blurred orbs, painted behind
   the frosted card. Fixed so it fills the viewport regardless of
   the .bte-page padding, and stays put on scroll. */
.bte-portal__bg {
    position: fixed;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    background: linear-gradient(150deg, #a95a51 0%, #7d4553 46%, #453645 100%);
}

.bte-blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(64px);
    will-change: transform;
}
.bte-blob--1 { width: 360px; height: 360px; background: #c9a84c; top: -90px;  left: -70px;  opacity: 0.55; animation: bte-float 16s ease-in-out infinite; }
.bte-blob--2 { width: 320px; height: 320px; background: #e8d5a3; bottom: -80px; right: -50px; opacity: 0.40; animation: bte-float 20s ease-in-out infinite reverse; }
.bte-blob--3 { width: 280px; height: 280px; background: #b5645a; bottom: 6%;   left: 6%;     opacity: 0.50; animation: bte-float 22s ease-in-out infinite; }
.bte-blob--4 { width: 240px; height: 240px; background: #6b7c5e; top: 10%;     right: 10%;   opacity: 0.32; animation: bte-float 18s ease-in-out infinite reverse; }

@keyframes bte-float {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
    50%      { transform: translate3d(0, -26px, 0) scale(1.06); }
}
@media (prefers-reduced-motion: reduce) {
    .bte-blob { animation: none !important; }
}

/* Centered column holding the frosted card + powered-by footer. */
.bte-portal {
    position: relative;
    z-index: 1;
    min-height: 82vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    text-align: center;
}

/* The frosted-glass panel. Kept light + translucent so the
   estate's black wordmark and the dark body text stay legible
   while the orbs glow softly through. */
.bte-glass {
    position: relative;
    width: 100%;
    max-width: 460px;
    padding: 2.75rem clamp(1.5rem, 5vw, 2.75rem);
    background: rgba(250, 246, 240, 0.58);
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 24px;
    box-shadow:
        0 24px 70px rgba(43, 31, 24, 0.38),
        inset 0 1px 0 rgba(255, 255, 255, 0.5);
    -webkit-backdrop-filter: blur(22px) saturate(130%);
    backdrop-filter: blur(22px) saturate(130%);
}

/* Fallback where backdrop-filter is unsupported: lean opaque so
   text never sits on a muddy see-through panel. */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .bte-glass { background: rgba(250, 246, 240, 0.94); }
}

/* ── Logos row ───────────────────────────────────────────── */
.bte-portal__logos {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.15rem;
    margin-bottom: 1.5rem;
}
.bte-portal__logo {
    max-height: 84px;
    width: auto;
    /* Logo art is black on an opaque white ground; multiply drops
       the white so it sits cleanly on the frosted card. */
    mix-blend-mode: multiply;
}
.bte-portal__divider { color: var(--bte-gold); font-size: 1.1rem; opacity: 0.8; }
.bte-portal__auria {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    line-height: 1.05;
}
.bte-portal__auria-mark {
    font-family: var(--bte-display);
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--bte-ink);
}
.bte-portal__auria-sub {
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--bte-gold);
}

/* ── Copy ────────────────────────────────────────────────── */
.bte-portal__lead {
    font-size: 1.02rem;
    font-style: italic;
    color: var(--bte-muted);
    margin: 0 auto 1.75rem;
    max-width: 22rem;
}

/* ── Actions ─────────────────────────────────────────────── */
.bte-portal__actions {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}
.bte-portal__actions .bte-btn { width: 100%; }

/* Gold, emphasized primary action (the "sign in" / login button). */
.bte-btn--gold {
    background: linear-gradient(135deg, #e8d5a3 0%, #c9a84c 100%);
    color: var(--bte-ink);
    border: 2px solid transparent;
    box-shadow: 0 10px 24px rgba(201, 168, 76, 0.35);
}
.bte-btn--gold:hover { filter: brightness(1.06); color: var(--bte-ink); }

/* ── Powered-by footer (sits on the gradient, below the card) ─ */
.bte-portal__powered {
    margin: 0;
    font-size: 0.78rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.82);
}
.bte-portal__powered strong { color: #fff; font-weight: 600; }

/* ── Login form inside the frosted card ──────────────────── */
.bte-glass.bte-login { max-width: 440px; text-align: center; }
.bte-glass .bte-form {
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
    max-width: none;
    gap: 1rem;
}
.bte-glass .bte-field input {
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(255, 255, 255, 0.85);
    border-radius: 12px;
}
.bte-glass .bte-field input:focus {
    outline: none;
    border-color: var(--bte-gold);
    box-shadow: 0 0 0 3px rgba(201, 168, 76, 0.25);
}
.bte-glass .bte-login__hint { color: var(--bte-ink); }
.bte-glass .bte-alert { background: rgba(255, 255, 255, 0.55); }

/* Match the splash: the login submit is gold too. */
.bte-glass .bte-form__submit {
    background: linear-gradient(135deg, #e8d5a3 0%, #c9a84c 100%);
    color: var(--bte-ink);
    border-color: transparent;
    box-shadow: 0 10px 24px rgba(201, 168, 76, 0.35);
}
.bte-glass .bte-form__submit:hover { filter: brightness(1.06); color: var(--bte-ink); }

/* ── Responsive ──────────────────────────────────────────── */
@media (min-width: 520px) {
    .bte-portal__actions { flex-direction: row; }
}
@media (max-width: 420px) {
    .bte-portal__logos { flex-direction: column; gap: 0.75rem; }
    .bte-portal__auria { align-items: center; }
}

/* ============================================================
   Admin login — split screen (login.php). A full-bleed estate
   photo fills the viewport; a frosted panel on the left holds the
   sign-in form, so the same photo reads sharp on the right and
   softly blurred behind the glass. The photo URL is passed in as
   --login-photo; the gradient below is the fallback if it's absent.
   ============================================================ */
.bte-authsplit {
    position: fixed;
    inset: 0;
    z-index: 5;
    display: grid;
    grid-template-columns: minmax(320px, 33vw) 1fr;
    background:
        var(--login-photo, none) center / cover no-repeat,
        linear-gradient(150deg, #a95a51 0%, #7d4553 46%, #453645 100%);
}

/* The frosted sign-in column. backdrop-filter blurs the photo behind
   it; the dark tint keeps the white copy legible over any frame. */
.bte-authsplit__panel {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: clamp(2rem, 4vw, 3.5rem) clamp(1.5rem, 2.6vw, 2.75rem);
    background: rgba(26, 22, 18, 0.34);
    border-right: 1px solid rgba(255, 255, 255, 0.16);
    -webkit-backdrop-filter: blur(16px) saturate(115%);
    backdrop-filter: blur(16px) saturate(115%);
    color: #fff;
    overflow-y: auto;
}
/* Where backdrop-filter is unsupported, lean opaque so text never
   sits on a muddy see-through panel. */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .bte-authsplit__panel { background: rgba(26, 22, 18, 0.78); }
}

.bte-authsplit__inner { margin-top: clamp(1rem, 9vh, 5.5rem); }

.bte-authsplit__head { margin-bottom: 1.6rem; }
.bte-authsplit__title {
    font-family: var(--bte-display);
    font-size: clamp(1.85rem, 3vw, 2.5rem);
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.1;
    margin: 0 0 0.4rem;
    color: #fff;
}
.bte-authsplit__sub {
    margin: 0;
    font-size: 0.98rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.82);
}

.bte-authsplit__alert { margin: 0 0 1.1rem; }
.bte-authsplit__hint {
    margin: 0 0 1.1rem;
    font-size: 0.85rem;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.78);
}

.bte-authsplit__form { display: flex; flex-direction: column; gap: 0.85rem; }

/* White pill input, centered value — matches the target mock. */
.bte-authsplit__input {
    font: inherit;
    font-size: 1rem;
    text-align: center;
    padding: 0.85rem 1.1rem;
    border: 1px solid rgba(255, 255, 255, 0.75);
    border-radius: 999px;
    background: #fff;
    color: var(--bte-ink);
}
.bte-authsplit__input::placeholder { color: #9aa0a6; }
.bte-authsplit__input:focus {
    outline: none;
    border-color: var(--bte-gold);
    box-shadow: 0 0 0 3px rgba(201, 168, 76, 0.35);
}

/* Neutral pill for the primary submit (the mock de-emphasizes it
   next to the gold tea-dates CTA below). */
.bte-authsplit__submit {
    font: inherit;
    font-size: 1rem;
    font-weight: 700;
    padding: 0.85rem 1.1rem;
    border: none;
    border-radius: 999px;
    background: rgba(214, 216, 220, 0.94);
    color: #1f2430;
    cursor: pointer;
    transition: background 0.15s, transform 0.05s;
}
.bte-authsplit__submit:hover { background: #e8eaee; }
.bte-authsplit__submit:active { transform: translateY(1px); }

.bte-authsplit__resend { margin-top: 0.9rem; text-align: center; }
.bte-authsplit__link {
    background: none;
    border: 0;
    padding: 0.25rem;
    font: inherit;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.85);
    text-decoration: underline;
    cursor: pointer;
}
.bte-authsplit__link:hover { color: #fff; }

/* Gold CTA pinned to the bottom of the panel. */
.bte-authsplit__dates {
    margin-top: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.9rem 1.25rem;
    border-radius: 12px;
    background: #e8b23e;
    color: #1f2430;
    font-weight: 700;
    font-size: 0.95rem;
    text-decoration: none;
    box-shadow: 0 8px 20px rgba(232, 178, 62, 0.32);
    transition: filter 0.15s;
}
.bte-authsplit__dates:hover { filter: brightness(1.05); }
.bte-authsplit__check { font-weight: 800; }

/* Phones: the photo fills the screen and the panel becomes a
   full-width frosted overlay (darker, for legibility over any part
   of the image). */
@media (max-width: 720px) {
    .bte-authsplit { grid-template-columns: 1fr; }
    .bte-authsplit__panel {
        border-right: 0;
        background: rgba(22, 18, 14, 0.55);
    }
    @supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
        .bte-authsplit__panel { background: rgba(22, 18, 14, 0.82); }
    }
    .bte-authsplit__inner { margin-top: clamp(1rem, 6vh, 3rem); }
}

/* ============================================================
   Booking Admin — app shell (admin/index.php).
   Dark sidebar + light workspace, gold/rose accents. Scoped to
   .bte-adm; also restyles the .bte-admin__* panels within it.
   ============================================================ */
.bte-adm {
    --adm-side:      #241a1f;
    --adm-side-2:    #30232a;
    --adm-side-line: rgba(255,255,255,0.09);
    --adm-side-txt:  rgba(255,255,255,0.70);
    --adm-side-txt2: rgba(255,255,255,0.45);
    --adm-workspace: #f3eee6;
    --adm-card:      #ffffff;
    --adm-ink:       #2b1f18;
    --adm-muted:     #8a7a6b;
    --adm-border:    #e8ddce;
    --adm-gold:      #c9a84c;
    --adm-gold-d:    #ac8d34;
    --adm-rose:      #b5645a;
    --adm-rose-d:    #8f4a42;
    --adm-sage:      #6b7c5e;
    --adm-radius:    14px;
    --adm-shadow:    0 1px 2px rgba(43,31,24,0.04), 0 8px 24px rgba(43,31,24,0.06);
    --adm-sans:      system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

    display: grid;
    grid-template-columns: 252px 1fr;
    min-height: 100vh;
    font-family: var(--adm-sans);
    font-size: 15px;
    line-height: 1.5;
    color: var(--adm-ink);
    background: var(--adm-workspace);
}
.bte-adm *, .bte-adm *::before, .bte-adm *::after { box-sizing: border-box; }

/* ── Sidebar ─────────────────────────────────────────────── */
.bte-adm__side {
    background: var(--adm-side);
    color: var(--adm-side-txt);
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    padding: 1.4rem 0.9rem;
    position: sticky;
    top: 0;
    align-self: start;
    height: 100vh;
    overflow-y: auto;
}
.bte-adm__brand { display: flex; flex-direction: column; padding: 0.3rem 0.6rem 1.1rem; border-bottom: 1px solid var(--adm-side-line); margin-bottom: 0.7rem; }
.bte-adm__brand-mark { font-family: var(--bte-display); font-size: 1.5rem; font-weight: 700; color: #fff; line-height: 1.05; }
.bte-adm__brand-sub { font-size: 0.62rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--adm-gold); margin-top: 0.35rem; }

.bte-adm__nav { display: flex; flex-direction: column; gap: 0.15rem; }
.bte-adm__nav-label { font-size: 0.62rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--adm-side-txt2); padding: 0.7rem 0.7rem 0.3rem; margin: 0; }
.bte-adm__nav-item {
    display: flex; align-items: center; gap: 0.7rem; width: 100%; text-align: left;
    background: none; border: 0; cursor: pointer; color: var(--adm-side-txt);
    font: inherit; font-size: 0.92rem; padding: 0.6rem 0.7rem; border-radius: 10px; position: relative;
}
.bte-adm__nav-item svg { width: 18px; height: 18px; flex: 0 0 auto; opacity: 0.8; }
/* Reserve space for Feather placeholders until feather.replace() swaps in the SVG. */
.bte-adm [data-feather] { display: inline-block; width: 18px; height: 18px; }
.bte-adm__search [data-feather] { width: 15px; height: 15px; }
.bte-adm__nav-item span { white-space: nowrap; }
.bte-adm__nav-item:hover { background: var(--adm-side-2); color: #fff; }
.bte-adm__nav-item.is-active { background: var(--adm-side-2); color: #fff; }
.bte-adm__nav-item.is-active::before { content: ""; position: absolute; left: -0.9rem; top: 0.4rem; bottom: 0.4rem; width: 3px; border-radius: 0 3px 3px 0; background: var(--adm-gold); }
.bte-adm__nav-badge { margin-left: auto; font-size: 0.7rem; background: var(--adm-rose); color: #fff; border-radius: 999px; padding: 0.05rem 0.45rem; }

.bte-adm__promo { margin-top: auto; background: linear-gradient(150deg, var(--adm-gold) 0%, var(--adm-gold-d) 100%); color: var(--adm-ink); border-radius: var(--adm-radius); padding: 1rem; }
.bte-adm__promo p { margin: 0 0 0.6rem; font-size: 0.82rem; font-weight: 600; }
.bte-adm__promo button { width: 100%; border: 0; border-radius: 9px; padding: 0.5rem; background: rgba(43,31,24,0.9); color: #fff; font: inherit; font-size: 0.8rem; font-weight: 600; cursor: pointer; }
.bte-adm__promo button:hover { background: var(--adm-ink); }

.bte-adm__user { display: flex; align-items: center; gap: 0.6rem; padding: 0.75rem 0.5rem 0.25rem; margin-top: 0.6rem; border-top: 1px solid var(--adm-side-line); }
.bte-adm__avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--adm-rose); color: #fff; display: grid; place-items: center; font-size: 0.75rem; font-weight: 700; flex: 0 0 auto; }
.bte-adm__who { font-size: 0.8rem; line-height: 1.25; color: #fff; }
.bte-adm__who small { display: block; color: var(--adm-side-txt2); font-size: 0.72rem; }
.bte-adm__who a { color: var(--adm-gold); }

/* ── Main / topbar ───────────────────────────────────────── */
.bte-adm__main { display: flex; flex-direction: column; min-width: 0; }
.bte-adm__topbar {
    display: flex; align-items: center; gap: 1rem; padding: 1rem 1.6rem;
    background: rgba(255,255,255,0.75); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--adm-border); position: sticky; top: 0; z-index: 5;
}
.bte-adm__title { font-family: var(--bte-display); font-size: 1.6rem; font-weight: 600; margin: 0; color: var(--adm-ink); }
.bte-adm__search { margin-left: auto; display: flex; align-items: center; gap: 0.5rem; background: var(--adm-card); border: 1px solid var(--adm-border); border-radius: 999px; padding: 0.4rem 0.9rem; color: var(--adm-muted); min-width: 220px; }
.bte-adm__search input { border: 0; outline: 0; font: inherit; font-size: 0.85rem; background: none; color: var(--adm-ink); width: 100%; }
.bte-adm__new { flex: 0 0 auto; }

.bte-adm__content { padding: 1.6rem; }
.bte-adm__view { display: none; flex-direction: column; gap: 1.4rem; }
.bte-adm__view.is-active { display: flex; animation: bte-adm-fade 0.24s ease; }
@keyframes bte-adm-fade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .bte-adm__view.is-active { animation: none; } }
.bte-adm .bte-alert--notice { margin-bottom: 1.4rem; }

/* ── Stat cards ──────────────────────────────────────────── */
.bte-adm__stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.bte-adm__stat { background: var(--adm-card); border: 1px solid var(--adm-border); border-radius: var(--adm-radius); padding: 1.1rem 1.2rem; box-shadow: var(--adm-shadow); }
.bte-adm__stat-top { display: flex; align-items: center; justify-content: space-between; }
.bte-adm__stat-label { font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--adm-muted); }
.bte-adm__stat-icon { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: rgba(201,168,76,0.14); color: var(--adm-gold-d); font-size: 1rem; }
.bte-adm__stat-num { font-family: var(--bte-display); font-size: 2.1rem; font-weight: 700; margin: 0.45rem 0 0.15rem; font-variant-numeric: tabular-nums; }
.bte-adm__stat-sub { font-size: 0.78rem; color: var(--adm-muted); }

/* ── Card wrapper (dashboard) ────────────────────────────── */
.bte-adm__card { background: var(--adm-card); border: 1px solid var(--adm-border); border-radius: var(--adm-radius); box-shadow: var(--adm-shadow); overflow: hidden; }
.bte-adm__card-head { display: flex; align-items: center; gap: 1rem; padding: 1.05rem 1.3rem; border-bottom: 1px solid var(--adm-border); }
.bte-adm__card-head h2 { font-family: var(--bte-display); font-size: 1.25rem; font-weight: 600; margin: 0; }
.bte-adm__card-head .bte-btn { margin-left: auto; padding: 0.45rem 1rem; font-size: 0.8rem; }
.bte-adm__tablewrap { overflow-x: auto; }

/* ── Restyle existing panels as cards within the shell ───── */
.bte-adm .bte-admin__panel {
    background: var(--adm-card); border: 1px solid var(--adm-border); border-radius: var(--adm-radius);
    box-shadow: var(--adm-shadow); padding: 1.3rem 1.4rem; margin: 0;
}
.bte-adm .bte-admin__panel h2 { font-family: var(--bte-display); font-size: 1.3rem; margin: 0 0 1rem; }
.bte-adm .bte-admin__subhead { font-family: var(--bte-display); color: var(--adm-ink); margin-top: 1.4rem; }

.bte-adm .bte-admin__table { width: 100%; border-collapse: collapse; font-size: 0.88rem; }
.bte-adm .bte-admin__table th { text-align: left; font-size: 0.68rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--adm-muted); font-weight: 600; padding: 0.7rem 0.9rem; border-bottom: 1px solid var(--adm-border); }
.bte-adm .bte-admin__table td { padding: 0.75rem 0.9rem; border-bottom: 1px solid var(--adm-border); vertical-align: middle; }
.bte-adm .bte-admin__table tbody tr:last-child td { border-bottom: 0; }
.bte-adm .bte-admin__table tbody tr:hover { background: #faf7f1; }
.bte-adm .bte-admin__table small { color: var(--adm-muted); }

.bte-adm .bte-admin__status { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.72rem; font-weight: 600; padding: 0.2rem 0.6rem; border-radius: 999px; border: 0; text-transform: capitalize; letter-spacing: 0; }
.bte-adm .bte-admin__status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.bte-adm .bte-admin__status--paid { color: var(--adm-sage); background: rgba(107,124,94,0.13); }
.bte-adm .bte-admin__status--refunded { color: var(--adm-rose-d); background: rgba(181,100,90,0.14); }
/* Ticket never reached GHL — needs a Resend. Deliberately loud. */
.bte-adm .bte-admin__status--failed { color: #8a1c1c; background: rgba(176,42,42,0.14); margin-top: 0.3rem; cursor: help; }
.bte-adm .bte-admin__status--active { color: var(--adm-sage); background: rgba(107,124,94,0.13); }
.bte-adm .bte-admin__status--inactive { color: var(--adm-ink, #2b1f18); background: rgba(0,0,0,0.07); }

/* Packages: the copyable share link + the add-on quantity picker. */
.bte-admin__copy { width: 100%; min-width: 15rem; font-size: 0.75rem; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; padding: 0.3rem 0.45rem; cursor: pointer; }
.bte-admin__share { display: block; margin: 0 0 1.25rem; }
.bte-admin__share span { display: block; font-size: 0.8rem; color: var(--bte-muted); margin-bottom: 0.3rem; }
.bte-admin__share .bte-admin__copy { max-width: 32rem; }
.bte-admin__via { color: var(--adm-sage, #6b7c5e); font-style: italic; }
.bte-admin__picker { display: grid; gap: 0.3rem; margin: 0.5rem 0 1rem; }
.bte-admin__pickrow { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.4rem 0.6rem; border: 1px solid var(--bte-border); border-radius: 4px; }
.bte-admin__pickrow span { display: flex; flex-direction: column; font-size: 0.88rem; }
.bte-admin__pickrow small { color: var(--bte-muted); font-size: 0.78rem; }
.bte-admin__pickrow input { width: 5rem; }

/* Forms inside the shell */
.bte-adm .bte-admin__form { gap: 0.9rem 1rem; }
.bte-adm .bte-admin__form label { font-size: 0.8rem; color: var(--adm-muted); }
.bte-adm .bte-admin__form input,
.bte-adm .bte-admin__form select,
.bte-adm .bte-admin__form textarea { font-family: inherit; font-size: 0.9rem; padding: 0.55rem 0.65rem; border: 1px solid var(--adm-border); border-radius: 9px; background: #fff; color: var(--adm-ink); }
.bte-adm .bte-admin__form input:focus,
.bte-adm .bte-admin__form select:focus,
.bte-adm .bte-admin__form textarea:focus { outline: none; border-color: var(--adm-gold); box-shadow: 0 0 0 3px rgba(201,168,76,0.2); }
.bte-adm .bte-admin__hint { font-size: 0.8rem; color: var(--adm-muted); }

/* Buttons + inline actions */
.bte-adm .bte-admin__link-btn,
.bte-adm .bte-admin__table a { color: var(--adm-rose); font-weight: 600; }
.bte-adm .bte-admin__link-btn:hover,
.bte-adm .bte-admin__table a:hover { color: var(--adm-rose-d); }
.bte-adm .bte-admin__row-actions { display: flex; align-items: center; gap: 0.85rem; }
.bte-adm .bte-btn { border-radius: 10px; text-transform: none; letter-spacing: 0; font-family: var(--adm-sans); }
.bte-adm .bte-admin__refund { padding: 0.35rem 0.85rem; font-size: 0.8rem; }

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 900px) {
    .bte-adm { grid-template-columns: 1fr; }
    .bte-adm__side { position: static; height: auto; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 0.4rem; }
    .bte-adm__brand { width: 100%; border-bottom: 0; margin-bottom: 0; padding-bottom: 0.3rem; }
    .bte-adm__nav { flex-direction: row; flex-wrap: wrap; }
    .bte-adm__nav-label, .bte-adm__promo, .bte-adm__nav-item.is-active::before { display: none; }
    .bte-adm__user { width: 100%; margin-top: 0; border-top: 0; }
    .bte-adm__stats { grid-template-columns: repeat(2, 1fr); }
    .bte-adm__search { min-width: 0; }
}
@media (max-width: 560px) {
    .bte-adm__stats { grid-template-columns: 1fr; }
    .bte-adm__content { padding: 1rem; }
}

/* ── Embedded Stripe Checkout (on-domain payment page) ───── */
.bte-checkout--pay { max-width: 560px; }
.bte-embedded-checkout {
    max-width: 480px;
    margin: 0 auto 1.5rem;
    min-height: 320px;
}

/* ============================================================
   Events calendar — monthly booking tables. Modeled on the
   provided schedule module. The module itself has NO background
   (it blends into the host page); only the month columns are white.
   ============================================================ */
.bte-embed--widget { background: transparent; }   /* embed: nothing behind the widget */

/* ── Tea dates ────────────────────────────────────────────────
   Was a three-column table, which made a guest read across to answer
   one question: can I come on this date, and is there room? Each date
   is now a card — the day carries the visual weight it carries in the
   decision, availability is a colour, and the action sits with the
   thing it acts on at a real tap size. */
.bte-cal { max-width: 1000px; margin: 0 auto; color: var(--bte-body); }
.bte-cal__empty {
    text-align: center; color: var(--bte-muted);
    padding: 2.5rem 1rem; background: var(--bte-ivory);
    border: 1px solid var(--bte-border); border-radius: var(--bte-radius-lg);
}

/* ── Featured strip ───────────────────────────────────────────────────
   A short, prominent row above the month tabs for special dates. Horizontal
   scroll on mobile so it stays one clean line, not a stack. */
.bte-cal__featured { margin-bottom: 1.6rem; }
.bte-cal__featured-label {
    font-size: 0.72rem; font-weight: 700; letter-spacing: 0.13em; text-transform: uppercase;
    color: var(--bte-accent); margin: 0 0 0.6rem;
}
.bte-cal__featured-row {
    display: grid; gap: 0.7rem;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}
.bte-cal__featured .bte-date { border-color: var(--bte-ink); }
@media (max-width: 560px) {
    .bte-cal__featured-row {
        grid-auto-flow: column; grid-auto-columns: 82%;
        grid-template-columns: none; overflow-x: auto;
        scroll-snap-type: x mandatory; margin: 0 -1rem; padding: 0 1rem 0.4rem;
    }
    .bte-cal__featured-row .bte-date { scroll-snap-align: start; }
}

/* ── Month tabs ───────────────────────────────────────────────────────
   CSS-only: hidden radios drive which panel shows (rules generated per
   render). One month at a time, so the list never becomes a wall. */
.bte-cal__mradio { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.bte-cal__tabs {
    display: flex; gap: 0.45rem; margin: 0 0 1.1rem;
    overflow-x: auto; padding-bottom: 0.3rem; scrollbar-width: none;
}
.bte-cal__tabs::-webkit-scrollbar { display: none; }
.bte-cal__tab {
    display: inline-flex; align-items: center; gap: 0.4rem; white-space: nowrap;
    padding: 0.5rem 0.95rem; border-radius: 999px; cursor: pointer;
    border: 1px solid var(--bte-border-2); background: #fff; color: var(--bte-body);
    font-size: 0.88rem; font-weight: 600; transition: border-color 0.15s, background 0.15s, color 0.15s;
}
.bte-cal__tab:hover { border-color: var(--bte-ink); }
.bte-cal__tabn {
    font-size: 0.72rem; font-weight: 700; color: var(--bte-muted);
    background: var(--bte-ivory); border-radius: 999px; padding: 0.05rem 0.4rem;
    font-variant-numeric: tabular-nums;
}
/* Active tab + its count are recoloured by the per-render generated rules. */
.bte-cal__mradio:focus-visible ~ .bte-cal__tabs label[for] { outline: 2px solid var(--bte-accent); outline-offset: 2px; }

.bte-cal__panel { display: none; }

.bte-cal__dates {
    display: grid; gap: 0.7rem;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
}

.bte-date {
    display: grid; grid-template-columns: auto 1fr; gap: 0.85rem; align-items: center;
    padding: 0.8rem 0.9rem; background: #fff;
    border: 1px solid var(--bte-border); border-radius: var(--bte-radius-lg);
    transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
}
.bte-date:hover {
    border-color: var(--bte-peri);
    box-shadow: 0 1px 2px rgba(30,41,59,.06), 0 8px 20px -12px rgba(30,41,59,.3);
    transform: translateY(-1px);
}
.bte-date--out { background: var(--bte-ivory); }
.bte-date--out:hover { transform: none; box-shadow: none; border-color: var(--bte-border); }

/* The date block: month / number / weekday, read in one pass. */
.bte-date__cal {
    width: 52px; flex: none; text-align: center; background: #fff;
    border: 1px solid var(--bte-border-2); border-radius: var(--bte-radius); overflow: hidden;
}
.bte-date__mo {
    background: var(--bte-accent); color: #fff; padding: 0.16rem 0;
    font-size: 0.62rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
}
.bte-date--out .bte-date__mo { background: var(--bte-faint); }
.bte-date__day {
    font-size: 1.28rem; font-weight: 700; color: var(--bte-ink);
    line-height: 1.15; padding: 0.16rem 0 0; font-variant-numeric: tabular-nums;
}
.bte-date--out .bte-date__day { color: var(--bte-faint); }
.bte-date__dow {
    font-size: 0.64rem; color: var(--bte-muted);
    text-transform: uppercase; letter-spacing: 0.08em; padding-bottom: 0.22rem;
}

.bte-date__main { min-width: 0; display: flex; flex-direction: column; gap: 0.3rem; }
.bte-date__title { font-size: 0.98rem; font-weight: 700; color: var(--bte-ink); line-height: 1.2; }
.bte-date__time { font-size: 0.92rem; font-weight: 650; color: var(--bte-ink); }
.bte-date__price {
    font-size: 0.85rem; color: var(--bte-muted);
    font-variant-numeric: tabular-nums; display: flex; align-items: baseline; gap: 0.35rem;
}
.bte-date__was { text-decoration: line-through; color: var(--bte-faint); font-size: 0.8rem; }
.bte-date__now { color: var(--bte-ink); font-weight: 650; }
.bte-date--out .bte-date__now { color: var(--bte-faint); }
.bte-date__row {
    display: flex; align-items: center; justify-content: space-between;
    gap: 0.6rem; margin-top: 0.15rem;
}
.bte-date__row .bte-btn { padding: 0.42rem 0.95rem; font-size: 0.82rem; }

/* Time picker: when a tour runs more than once on a day, the times become a row
   of small "book this time" buttons inside one card. */
.bte-date__times { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.4rem; }
.bte-date__time {
    display: inline-flex; align-items: center; gap: 0.3rem;
    padding: 0.4rem 0.8rem; border: 1px solid var(--bte-ink); border-radius: 999px;
    font-size: 0.82rem; font-weight: 600; line-height: 1; text-decoration: none;
    color: var(--bte-ink); background: transparent; transition: background .12s, color .12s;
}
.bte-date__time:hover { background: var(--bte-ink); color: #fff; }
.bte-date__time--out {
    border-color: var(--bte-border, #ddd); color: var(--bte-muted);
    text-decoration: line-through; cursor: not-allowed; font-weight: 500;
}
.bte-embed .bte-date__time { padding: 0.4rem 0.8rem !important; font-size: 0.82rem !important; }

/* --- Image-led variant -------------------------------------------------
   When an event has a photograph, the photograph leads and the card stacks:
   image, then details. The date rides on the image as a paper stamp, so the
   day is still the first thing read. Events without a photo keep the
   typographic calendar block above — both are deliberate, neither is a
   fallback that looks broken. */
.bte-date--img {
    display: block;
    padding: 0;
    overflow: hidden;
}

.bte-date__media { position: relative; aspect-ratio: 16 / 10; background: var(--bte-ivory); }

.bte-date__media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Sold-out photography is drained rather than hidden — the date still reads,
   it just stops competing with the ones you can book. */
.bte-date--out .bte-date__media img { filter: saturate(0.25) opacity(0.75); }

.bte-date__stamp {
    position: absolute;
    left: 0.7rem;
    bottom: 0.7rem;
    background: var(--bte-cream);
    border-radius: var(--bte-radius);
    padding: 0.4rem 0.6rem 0.35rem;
    text-align: center;
    line-height: 1;
    box-shadow: 0 2px 8px rgba(17,17,20,.28);
    min-width: 46px;
}

.bte-date__stamp b {
    display: block;
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--bte-ink);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
}

.bte-date__stamp i {
    display: block;
    font-style: normal;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--bte-muted);
    margin-top: 0.12rem;
}

.bte-date--img .bte-date__main { padding: 0.85rem 0.95rem 1rem; }

.bte-date__when {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--bte-muted);
}
/* Package blurb — a quiet line under the title on offer cards. */
.bte-date__desc {
    font-size: 0.85rem;
    line-height: 1.4;
    color: var(--bte-muted);
}

/* Legend under the grid — explains the colours once, quietly. */
.bte-cal__key {
    margin-top: 1.4rem; padding-top: 1rem; border-top: 1px solid var(--bte-border);
    font-size: 0.82rem; color: var(--bte-muted);
    display: flex; flex-wrap: wrap; gap: 0.5rem 1.4rem;
}
.bte-cal__key span { display: inline-flex; align-items: center; gap: 0.35rem; }
.bte-cal__dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }

@media (max-width: 560px) {
    .bte-cal__dates { grid-template-columns: 1fr; gap: 0.55rem; }
    /* Tighter cards so a month's worth doesn't feel heavy on a phone. */
    .bte-date { padding: 0.65rem 0.75rem; gap: 0.7rem; }
    .bte-date__cal { width: 46px; }
    .bte-date__day { font-size: 1.15rem; }
    .bte-date__per { display: none; }          /* "$85" is enough; drop "per guest" */
    .bte-date__row .bte-btn { padding: 0.4rem 0.85rem; }
    .bte-cal__tab { padding: 0.45rem 0.8rem; font-size: 0.84rem; }
    .bte-cal__key { font-size: 0.76rem; gap: 0.4rem 1rem; }
}
@media (prefers-reduced-motion: reduce) {
    .bte-date, .bte-date:hover { transform: none; transition: none; }
    .bte-cal__featured-row { scroll-behavior: auto; }
}

/* ============================================================
   Embedded checkout (WordPress) — booking details form + inline
   Stripe payment + thank-you. Rendered outside .bte-embed, so
   these rules are unscoped. Matches the calendar's clean look.
   ============================================================ */
.bte-ec {
    font-family: Arial, sans-serif;
    max-width: 520px;
    margin: 0 auto;
    color: #333;
    text-align: left;
}
.bte-ec__back {
    display: inline-block;
    margin-bottom: 1rem;
    color: #4b5169;
    font-size: 13px;
    text-decoration: none;
}
.bte-ec__back:hover { text-decoration: underline; }
.bte-ec__title {
    margin: 0 0 0.25rem;
    font-size: 22px;
    font-weight: bold;
    color: #1E293B;
}
.bte-ec__meta { margin: 0 0 1.25rem; color: #666; font-size: 14px; }

.bte-ec__error {
    background: #fdecea;
    border: 1px solid #f5c6c2;
    color: #b71c1c;
    padding: 10px 12px;
    border-radius: 4px;
    font-size: 13px;
    margin-bottom: 1rem;
}

.bte-ec__form { display: flex; flex-direction: column; gap: 1rem; }
.bte-ec__field { display: flex; flex-direction: column; gap: 0.3rem; font-size: 13px; color: #555; }
.bte-ec__field > span { font-weight: bold; }
.bte-ec__field input,
.bte-ec__field select,
.bte-ec__option select {
    font-family: inherit;
    font-size: 14px;
    padding: 9px 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background: #fff;
    color: #1E293B;
}

.bte-ec__addons {
    border: 1px solid #e2e5ee;
    border-radius: 6px;
    background: #f7f8fc;
    padding: 0.75rem 1rem 1rem;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.bte-ec__addons legend { font-weight: bold; color: #1E293B; font-size: 14px; padding: 0 0.4rem; }

.bte-ec__option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-top: 1px solid #e6e8f0;
    padding-top: 0.6rem;
}
.bte-ec__option:first-of-type { border-top: none; padding-top: 0; }
.bte-ec__option-info { display: flex; flex-direction: column; }
.bte-ec__option-title { font-weight: bold; color: #1E293B; font-size: 14px; }
.bte-ec__option-price { color: #777; font-size: 12px; }
.bte-ec__option select { flex: 0 0 auto; }

.bte-ec__consent {
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
    font-size: 12px;
    line-height: 1.5;
    color: #666;
    background: #f7f8fc;
    border: 1px solid #e2e5ee;
    border-radius: 6px;
    padding: 0.75rem;
}
.bte-ec__consent input { margin-top: 3px; flex: 0 0 auto; }

.bte-ec__submit {
    background-color: #BEC6DD;
    color: #1E293B;
    border: none;
    padding: 12px 16px;
    border-radius: 6px;
    cursor: pointer;
    font-weight: bold;
    font-size: 14px;
    transition: opacity 0.2s;
}
.bte-ec__submit:hover { opacity: 0.9; }
.bte-ec__submit:disabled { opacity: 0.6; cursor: default; }
.bte-ec__note { margin: 0; font-size: 12px; color: #888; text-align: center; }

.bte-ec__pay { margin-top: 0.5rem; }

.bte-ec--done { text-align: center; padding: 1.5rem 0; }
.bte-ec__done-mark { font-size: 34px; color: #BEC6DD; }
.bte-ec--done .bte-ec__title { margin-top: 0.5rem; }

/* Thank-you: ticket links (after polling) */
.bte-ec__preparing { color: #888; font-style: italic; }
.bte-ec__tickets {
    margin: 1rem auto 0;
    max-width: 320px;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}
.bte-ec__tickets > p { margin: 0; font-size: 13px; color: #555; font-weight: bold; }
.bte-ec__ticket-link {
    display: inline-block;
    background-color: #BEC6DD;
    color: #1E293B;
    padding: 10px 14px;
    border-radius: 6px;
    font-weight: bold;
    font-size: 13px;
    text-decoration: none;
}
.bte-ec__ticket-link:hover { opacity: 0.9; }

/* ============================================================
   Checkout wizard (checkout.php) — Bridgerton palette,
   transparent container so the host page owns the backdrop.
   ============================================================ */
.bte-wiz {
    /* The wizard was built on its own periwinkle/gold palette; these now alias
       the ink-and-paper tokens so the whole wizard re-tints in one place, and a
       per-event accent (--bte-accent, set on this element) flows through. */
    --w-peri:var(--bte-border); --w-cream:var(--bte-ivory); --w-ivory:var(--bte-ivory);
    --w-blue:var(--bte-ink); --w-blue-d:var(--bte-action-d);
    --w-gold:var(--bte-accent); --w-gold-l:var(--bte-accent);
    --w-blush:var(--bte-accent); --w-sage:var(--bte-muted); --w-ink:var(--bte-ink); --w-muted:var(--bte-muted);
    --w-border:var(--bte-border); --w-surface:#ffffff;
    max-width:940px; margin:0 auto; color:var(--w-ink);
    font-family:var(--bte-sans);
}
.bte-wiz--single { max-width:560px; }

/* Return link — sits above the wizard, quiet. */
.bte-wiz__backlink { display:inline-block; margin-bottom:1rem; font-size:.85rem; font-weight:600; color:var(--bte-muted); text-decoration:none; }
.bte-wiz__backlink:hover { color:var(--bte-ink); }

.bte-wiz__head { text-align:left; margin-bottom:1.25rem; }
.bte-wiz__eyebrow { font-family:var(--bte-sans); font-size:.72rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--bte-accent); margin:0 0 .25rem; }
.bte-wiz__title { font-family:var(--bte-display); font-size:clamp(1.5rem,3.5vw,2.1rem); font-weight:700; letter-spacing:-.02em; line-height:1.15; margin:0; }
.bte-wiz__meta { color:var(--w-muted); margin:.35rem 0 0; }

/* Progress rail. It's an <ol> for semantics, so kill the default list markers
   (they showed up as a second "1. 2. 3." beside our numbered dots). */
/* The rail spans the full content width so its numbers line up with the grid
   columns below. A 640px cap here left it centred and narrower than the grid,
   so step 1 sat inside the layout instead of above the left column. */
.bte-wiz__steps { display:flex; align-items:flex-start; justify-content:center; margin:1.75rem 0 2rem; max-width:none; list-style:none; padding:0; }
.bte-wiz__step { flex:1; text-align:center; position:relative; list-style:none; }
.bte-wiz__step.is-active, .bte-wiz__step.is-done { cursor:pointer; }
.bte-wiz__step:not(:last-child)::after { content:""; position:absolute; top:15px; left:50%; width:100%; height:2px; background:var(--w-peri); z-index:0; }
.bte-wiz__step.is-done:not(:last-child)::after { background:var(--w-gold); }
.bte-wiz__dot { position:relative; z-index:1; width:32px; height:32px; margin:0 auto .45rem; border-radius:50%; display:grid; place-items:center; background:var(--w-surface); border:2px solid var(--w-border); color:var(--w-muted); font-family:var(--bte-display); font-weight:700; }
.bte-wiz__step.is-active .bte-wiz__dot { border-color:var(--w-blue); color:var(--w-blue); box-shadow:0 0 0 4px rgba(86,106,154,.15); }
.bte-wiz__step.is-done .bte-wiz__dot { background:var(--w-gold); border-color:var(--w-gold); color:#fff; }
.bte-wiz__steplabel { font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--w-muted); }
.bte-wiz__step.is-active .bte-wiz__steplabel { color:var(--w-ink); font-weight:600; }

/* Layout */
.bte-wiz__grid { display:grid; grid-template-columns:1.55fr 1fr; gap:1.5rem; align-items:start; }
.bte-wiz__main { min-width:0; }
.bte-wiz__card, .bte-wiz__panel, .bte-wiz__summary { background:var(--w-surface); border:1px solid var(--w-border); border-radius:14px; }
.bte-wiz__panel { padding:1.6rem; display:none; }
.bte-wiz__panel.is-active { display:block; animation:bte-wiz-fade .24s ease; }
@keyframes bte-wiz-fade { from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:none;} }
@media (prefers-reduced-motion:reduce){ .bte-wiz__panel.is-active{ animation:none; } }
.bte-wiz__card { padding:1.6rem; }

.bte-wiz__ptitle { font-family:var(--bte-display); font-size:1.5rem; font-weight:600; margin:0 0 .2rem; }
.bte-wiz__psub { color:var(--w-muted); margin:0 0 1.25rem; font-size:.95rem; }

/* Ticket highlight */
.bte-wiz__ticket { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.1rem 1.25rem; background:var(--w-ivory); border:1px solid var(--w-border); border-radius:12px; margin-bottom:1rem; }
.bte-wiz__ticket-price { font-family:var(--bte-display); font-size:1.6rem; font-weight:600; color:var(--w-blue); }
.bte-wiz__ticket-per { font-size:.8rem; color:var(--w-muted); }

/* Stepper */
.bte-wiz__stepper { display:inline-flex; align-items:center; border:1px solid var(--w-border); border-radius:999px; background:var(--w-surface); overflow:hidden; flex:0 0 auto; }
.bte-wiz__pm { width:34px; height:34px; border:0; background:none; font-size:1.2rem; line-height:1; color:var(--w-blue); cursor:pointer; }
.bte-wiz__pm:hover { background:var(--w-cream); }
.bte-wiz__qty { width:44px; text-align:center; border:0; background:none; font:inherit; font-size:1rem; font-variant-numeric:tabular-nums; color:var(--w-ink); -moz-appearance:textfield; }
.bte-wiz__qty::-webkit-outer-spin-button, .bte-wiz__qty::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }

/* Add-on / tour rows */
.bte-wiz__item { display:flex; align-items:center; gap:1rem; padding:1rem 0; border-top:1px solid var(--w-border); }
.bte-wiz__item:first-of-type { border-top:0; }
.bte-wiz__item.is-disabled { opacity:.6; }
.bte-wiz__thumb { width:56px; height:56px; border-radius:10px; object-fit:cover; border:1px solid var(--w-border); flex:0 0 auto; }
.bte-wiz__iteminfo { flex:1; min-width:0; }
.bte-wiz__itemname { font-weight:600; }
.bte-wiz__itemdesc { font-size:.85rem; color:var(--w-muted); }
.bte-wiz__itemprice { font-size:.85rem; color:var(--w-blue); }
.bte-wiz__full { font-size:.8rem; letter-spacing:.08em; text-transform:uppercase; color:var(--w-muted); }
.bte-wiz__empty { color:var(--w-muted); font-style:italic; }

/* Details fields */
.bte-wiz__field { display:flex; flex-direction:column; gap:.35rem; margin-bottom:1rem; }
.bte-wiz__field span { font-family:var(--bte-display); font-weight:600; }
.bte-wiz__field input { font:inherit; font-size:1rem; padding:.6rem .7rem; border:1px solid var(--w-border); border-radius:9px; background:var(--w-surface); color:var(--w-ink); }
.bte-wiz__field input:focus { outline:none; border-color:var(--w-gold); box-shadow:0 0 0 3px rgba(194,162,74,.2); }
.bte-wiz__consent { display:flex; gap:.6rem; align-items:flex-start; font-size:.8rem; color:var(--w-muted); background:var(--w-cream); border:1px solid var(--w-border); border-radius:9px; padding:.85rem; margin-bottom:1rem; }
.bte-wiz__consent input { margin-top:.2rem; flex:0 0 auto; }

/* Nav buttons. The buttons carry .bte-btn (monochrome) plus a --next/--back/--pay
   modifier used only for layout, so styling comes from .bte-btn. */
.bte-wiz__nav { display:flex; gap:.75rem; margin-top:1.25rem; align-items:center; }
.bte-wiz__btn--next, .bte-wiz__btn--pay { margin-left:auto; }
.bte-wiz__btn--full { width:100%; margin:.75rem 0 0; }
.bte-wiz [hidden] { display:none; }

/* Summary */
.bte-wiz__summary { position:sticky; top:1.5rem; padding:1.5rem; border-top:2px solid var(--bte-ink); }
.bte-wiz__sumtitle { font-family:var(--bte-display); font-size:1.25rem; font-weight:600; margin:0 0 1rem; padding-bottom:.75rem; border-bottom:1px solid var(--w-border); }
.bte-wiz__sumline { display:flex; justify-content:space-between; gap:1rem; font-size:.92rem; padding:.35rem 0; }
.bte-wiz__sumline small { color:var(--w-muted); }
.bte-wiz__sumempty { color:var(--w-muted); font-style:italic; font-size:.9rem; margin:0; }
/* Subtotal / gratuity / tax rows sit between the line items and the grand total. */
.bte-wiz__sublines { border-top:1px solid var(--w-border); margin-top:.5rem; padding-top:.25rem; }
.bte-wiz__sublines:empty { border-top:0; margin-top:0; padding-top:0; }
.bte-wiz__sumline--sub { color:var(--w-muted); font-size:.86rem; padding:.2rem 0; }
.bte-wiz__sumline--save span:last-child { color: var(--bte-accent, #2D5A27); font-weight: 600; }
.bte-confirm__save dd { color: var(--bte-accent, #2D5A27); font-weight: 600; }
.bte-wiz__sumtotal { display:flex; justify-content:space-between; margin-top:.75rem; padding-top:.9rem; border-top:1px solid var(--w-border); font-family:var(--bte-display); font-size:1.35rem; font-weight:700; }
.bte-wiz__sumnote { font-size:.75rem; color:var(--w-sage); margin:.75rem 0 0; }
.bte-wiz__back { margin-top:1rem; }
.bte-wiz__back a { color:var(--w-blue); }

@media (max-width:780px){
    .bte-wiz__grid { grid-template-columns:1fr; }
    .bte-wiz__summary { position:static; }
    .bte-wiz__steplabel { font-size:.62rem; }
}

/* Phones: the wizard carries its own side gutter so nothing runs into the
   screen edge — the inline WordPress embed sits in a full-bleed host column
   with no padding of its own, and the standalone page's gutter is tight under
   this display type. Card padding eases in to match the smaller screen. */
@media (max-width:600px){
    .bte-wiz { padding-left:1.15rem; padding-right:1.15rem; }
    .bte-wiz__panel, .bte-wiz__card { padding:1.25rem; }
    .bte-wiz__summary { padding:1.25rem; }
    .bte-wiz__ticket { padding:1rem; }
}

/* ============================================================
   Admin console — monochrome "Ticketing App" restyle (admin/
   index.php). Overrides the warm rose/gold theme with a clean,
   light, greyscale Linear/Notion aesthetic: white sidebar with
   grouped icon-dot nav, an airy purchases table with pill badges
   and owner avatars, and a search / filter / view-toggle toolbar.
   Appended last so it wins the cascade over the base .bte-adm rules.
   ============================================================ */
.bte-adm {
    --adm-side:      #ffffff;
    --adm-side-2:    #f3f4f6;   /* hover / active nav pill            */
    --adm-side-line: #ececec;
    --adm-side-txt:  #3b3d42;
    --adm-side-txt2: #9aa0a6;
    --adm-workspace: #ffffff;
    --adm-card:      #ffffff;
    --adm-ink:       #16171a;
    --adm-muted:     #8a8f98;
    --adm-border:    #ececed;
    --adm-gold:      #16171a;   /* accents collapse to ink            */
    --adm-gold-d:    #16171a;
    --adm-rose:      #6b7280;
    --adm-rose-d:    #16171a;
    --adm-sage:      #3f8f5b;
    --adm-radius:    12px;
    --adm-shadow:    none;
    background: #ffffff;
    font-size: 14.5px;
    grid-template-columns: 248px 1fr;
}

/* ── Sidebar ─────────────────────────────────────────────── */
.bte-adm__side {
    background: var(--adm-side);
    border-right: 1px solid var(--adm-side-line);
    padding: 1.4rem 1rem;
}
.bte-adm__brand { border-bottom: 0; padding: 0.2rem 0.5rem 1.4rem; margin-bottom: 0.4rem; }
.bte-adm__brand-mark { color: var(--adm-ink); font-size: 1.3rem; font-weight: 800; letter-spacing: -0.01em; }
.bte-adm__brand-sub { color: var(--adm-side-txt2); font-size: 0.78rem; font-weight: 600; letter-spacing: 0; text-transform: none; margin-top: 0.2rem; }

.bte-adm__nav { gap: 0.1rem; }
.bte-adm__nav-label {
    font-size: 1rem; font-weight: 700; letter-spacing: 0; text-transform: none;
    color: var(--adm-ink); padding: 1.1rem 0.5rem 0.45rem;
}
.bte-adm__nav-item {
    color: var(--adm-side-txt); font-weight: 500; font-size: 0.92rem;
    border-radius: 9px; padding: 0.5rem 0.6rem; gap: 0.7rem;
}
.bte-adm__nav-item:hover { background: var(--adm-side-2); color: var(--adm-ink); }
.bte-adm__nav-item.is-active { background: var(--adm-side-2); color: var(--adm-ink); font-weight: 600; }
.bte-adm__nav-item.is-active::before { content: none; }   /* drop the gold rail */
.bte-adm__nav-item svg { display: none; }                 /* replaced by the dot */

/* Grey icon-dot to the left of each nav label (matches the mock). */
.bte-adm__nav-dot {
    flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%;
    background: #e6e7ea; border: 1px solid #dcdee2;
}
.bte-adm__nav-item.is-active .bte-adm__nav-dot { background: #d7d9dd; border-color: #c9ccd1; }
.bte-adm__nav-badge { background: #16171a; color: #fff; font-weight: 600; }

/* Hide the promo card + restyle the user footer for the light theme. */
.bte-adm__promo { display: none; }
.bte-adm__user { border-top: 1px solid var(--adm-side-line); }
.bte-adm__avatar { background: #16171a; color: #fff; }
.bte-adm__who { color: var(--adm-ink); }
.bte-adm__who small { color: var(--adm-side-txt2); }
.bte-adm__who a { color: var(--adm-ink); text-decoration: underline; }

/* ── Topbar + toolbar ────────────────────────────────────── */
.bte-adm__topbar {
    padding: 1.5rem 1.9rem 0.5rem;
    border-bottom: 0;
    gap: 1rem;
    align-items: center;
    flex-wrap: wrap;
}
.bte-adm__title { font-size: 1.6rem; font-weight: 800; letter-spacing: -0.02em; color: var(--adm-ink); }
.bte-adm__tools { margin-left: auto; display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap; }
.bte-adm__search {
    margin-left: 0; min-width: 240px; width: clamp(240px, 34vw, 420px);
    border: 1px solid var(--adm-border); border-radius: 10px; background: #fff;
    padding: 0.5rem 0.85rem; color: var(--adm-muted);
}
.bte-adm__search input { color: var(--adm-ink); }

/* Filter button + popover menu */
.bte-adm__filter { position: relative; }
.bte-adm__filterbtn {
    display: inline-flex; align-items: center; gap: 0.45rem;
    border: 1px solid var(--adm-border); border-radius: 10px; background: #fff;
    padding: 0.5rem 0.9rem; font: inherit; font-size: 0.88rem; color: #4b4f56;
    cursor: pointer;
}
.bte-adm__filterbtn:hover { background: #f7f7f8; }
.bte-adm__filterbtn.is-on { border-color: #16171a; color: #16171a; }
.bte-adm__filtermenu {
    position: absolute; right: 0; top: calc(100% + 6px); z-index: 20;
    background: #fff; border: 1px solid var(--adm-border); border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.10); padding: 0.35rem; min-width: 160px;
    display: flex; flex-direction: column; gap: 0.1rem;
}
.bte-adm__filtermenu[hidden] { display: none; }
.bte-adm__filteropt {
    text-align: left; border: 0; background: none; font: inherit; font-size: 0.86rem;
    color: #3b3d42; padding: 0.45rem 0.6rem; border-radius: 7px; cursor: pointer;
}
.bte-adm__filteropt:hover { background: #f3f4f6; }
.bte-adm__filteropt.is-active { background: #f3f4f6; font-weight: 600; color: #16171a; }

/* Segmented list / grid / calendar toggle */
.bte-adm__viewtoggle {
    display: inline-flex; gap: 2px; padding: 3px;
    background: #f1f2f4; border-radius: 10px;
}
.bte-adm__viewtoggle button {
    width: 34px; height: 30px; border: 0; border-radius: 8px; background: none;
    color: #8a8f98; cursor: pointer; display: grid; place-items: center;
}
.bte-adm__viewtoggle button:hover { color: #16171a; }
.bte-adm__viewtoggle button.is-active {
    background: #fff; color: #16171a; box-shadow: 0 1px 3px rgba(0,0,0,0.12);
}
.bte-adm__viewtoggle [data-feather] { width: 16px; height: 16px; }

/* Hide the list-only controls when the active view isn't a list. */
.bte-adm__topbar.is-formview .bte-adm__filter,
.bte-adm__topbar.is-formview .bte-adm__viewtoggle { display: none; }

.bte-adm__content { padding: 1.2rem 1.9rem 2.5rem; }

/* ── Purchases / list tables (mock look) ─────────────────── */
/* A borderless, airy table: hairline row dividers, generous height,
   pill badges, an owner avatar and a row-menu button. */
.bte-adm__ptable { width: 100%; }
.bte-adm__ptable table { width: 100%; border-collapse: collapse; }
.bte-adm__ptable thead th {
    text-align: left; font-size: 0.8rem; font-weight: 600; color: #9aa0a6;
    padding: 0.5rem 0.9rem 0.9rem; border-bottom: 1px solid var(--adm-border);
    text-transform: none; letter-spacing: 0;
}
.bte-adm__ptable tbody td {
    padding: 0.95rem 0.9rem; border-bottom: 1px solid #f1f1f2; vertical-align: middle;
    font-size: 0.92rem; color: var(--adm-ink);
}
.bte-adm__ptable tbody tr:hover { background: #fafafa; }
.bte-adm__ptable .bte-adm__ref { color: #9aa0a6; font-variant-numeric: tabular-nums; }
.bte-adm__ptable .bte-adm__ptitle { font-weight: 600; color: var(--adm-ink); }
.bte-adm__ptable .bte-adm__pdate { color: #9aa0a6; white-space: nowrap; }
.bte-adm__ptable td.bte-adm__pnum { font-variant-numeric: tabular-nums; }

/* Pill badge (Event / Source / priority-style chips) */
.bte-adm__pill {
    display: inline-block; max-width: 16rem; overflow: hidden; text-overflow: ellipsis;
    white-space: nowrap; vertical-align: middle;
    border: 1px solid var(--adm-border); border-radius: 8px;
    padding: 0.2rem 0.6rem; font-size: 0.8rem; font-weight: 500; color: #3b3d42;
    background: #fff;
}
.bte-adm__pill--muted { color: #9aa0a6; }
.bte-adm__pill--paid { color: #2f7d4f; border-color: #cfe8d9; background: #f4fbf7; }
.bte-adm__pill--refunded { color: #9a3f36; border-color: #f0d8d4; background: #fdf6f5; }

/* Owner avatar (initials) */
.bte-adm__owner {
    width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center;
    background: #e6e7ea; color: #4b4f56; font-size: 0.72rem; font-weight: 700;
    overflow: hidden;
}
.bte-adm__owner img { width: 100%; height: 100%; object-fit: cover; }

/* Row menu (⋯) */
.bte-adm__rowmenu {
    border: 0; background: none; color: #b3b7bd; cursor: pointer; font-size: 1.1rem;
    line-height: 1; padding: 0.25rem 0.5rem; border-radius: 7px; text-decoration: none;
}
.bte-adm__rowmenu:hover { background: #f1f1f2; color: #16171a; }

.bte-adm__pempty { padding: 2rem 0.9rem; text-align: center; color: #9aa0a6; }

/* Grid view — reflow the same rows into cards. */
.bte-adm__ptable.is-grid thead { display: none; }
.bte-adm__ptable.is-grid tbody {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 0.9rem;
}
.bte-adm__ptable.is-grid tbody tr {
    display: flex; flex-direction: column; gap: 0.45rem;
    border: 1px solid var(--adm-border); border-radius: 12px; padding: 1rem;
}
.bte-adm__ptable.is-grid tbody tr:hover { background: #fafafa; }
.bte-adm__ptable.is-grid tbody td { border: 0 !important; padding: 0 !important; }

.bte-adm__calnote { margin: 0.75rem 0.2rem 0; font-size: 0.85rem; color: #9aa0a6; }
.bte-adm__calnote[hidden] { display: none; }

@media (max-width: 720px) {
    .bte-adm__topbar { padding: 1.1rem 1.1rem 0.4rem; }
    .bte-adm__content { padding: 1rem 1.1rem 2rem; }
    .bte-adm__tools { width: 100%; margin-left: 0; }
    .bte-adm__search { width: 100%; }
}

/* ── Admin forms — sectioned "card" pattern (mock) ────────────
   A form is split into labelled sections; each section heading sits
   ABOVE a bordered rounded card holding a two-column field grid, with
   bold black labels over clean light inputs. Opt in by adding
   .bte-adm__form2 to a .bte-admin__form. */
.bte-adm .bte-adm__form2 { display: block; }
.bte-adm__formtitle {
    font-family: var(--bte-display); font-size: 1.9rem; font-weight: 800;
    letter-spacing: -0.01em; color: var(--adm-ink); margin: 0.4rem 0 1.4rem;
}
.bte-adm__fsec { margin: 0 0 1.8rem; }
.bte-adm__fsec-title {
    font-family: var(--bte-display); font-size: 1.35rem; font-weight: 700;
    color: var(--adm-ink); margin: 0 0 0.8rem;
}
.bte-adm__fsec-card {
    background: #fff; border: 1px solid var(--adm-border); border-radius: 16px;
    padding: 1.7rem 1.8rem;
}
.bte-adm__fgrid {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.15rem 1.7rem; align-items: start;
}
.bte-adm__fgrid > .bte-admin__full { grid-column: span 2; }
.bte-adm__fgrid > .bte-adm__ftall { grid-row: span 2; }   /* e.g. a description textarea */

/* Bold black labels + roomier inputs inside the sectioned form. */
.bte-adm .bte-adm__form2 label { color: var(--adm-ink); font-weight: 600; font-size: 0.95rem; gap: 0.45rem; }
.bte-adm .bte-adm__form2 label small,
.bte-adm .bte-adm__form2 .bte-admin__hint { font-weight: 400; color: var(--adm-muted); }
.bte-adm .bte-adm__form2 input,
.bte-adm .bte-adm__form2 select,
.bte-adm .bte-adm__form2 textarea {
    padding: 0.72rem 0.9rem; border: 1px solid var(--adm-border); border-radius: 10px;
    font-size: 0.95rem; background: #fff; color: var(--adm-ink);
}
.bte-adm .bte-adm__form2 input::placeholder,
.bte-adm .bte-adm__form2 textarea::placeholder { color: #b0b4ba; }
.bte-adm .bte-adm__form2 input:focus,
.bte-adm .bte-adm__form2 select:focus,
.bte-adm .bte-adm__form2 textarea:focus {
    outline: none; border-color: #16171a; box-shadow: 0 0 0 3px rgba(22,23,26,0.08);
}
.bte-adm .bte-adm__form2 textarea { min-height: 8.5rem; resize: vertical; line-height: 1.5; }

/* Add-on / tour picker: two-across grid of item rows, with the "Tours" /
   "Add-ons" subheads spanning the full width. */
.bte-adm__form2 .bte-admin__picker {
    margin: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem 1.2rem;
}
.bte-adm__form2 .bte-admin__picker .bte-admin__subhead { grid-column: 1 / -1; margin: 0.4rem 0 0; }
/* Each row is a <label>, so it inherits flex-direction:column from the generic
   form-label rule — force it back to a left(name)/right(qty) row. */
.bte-adm__form2 .bte-admin__pickrow {
    flex-direction: row; align-items: center; justify-content: space-between;
    gap: 1rem; border-radius: 10px; padding: 0.7rem 0.9rem;
}
.bte-adm__form2 .bte-admin__pickrow span { flex-direction: column; align-items: flex-start; }
.bte-adm__form2 .bte-admin__pickrow input { flex: 0 0 auto; width: 4.5rem; }

.bte-adm__formactions { display: flex; align-items: center; gap: 1rem; margin-top: 0.5rem; }

@media (max-width: 720px) {
    .bte-adm__fsec-card { padding: 1.2rem; }
    .bte-adm__fgrid { grid-template-columns: 1fr; }
    .bte-adm__fgrid > .bte-admin__full,
    .bte-adm__fgrid > .bte-adm__ftall { grid-column: span 1; grid-row: auto; }
    .bte-adm__form2 .bte-admin__picker { grid-template-columns: 1fr; }
}

/* ============================================================
   Booking listing — month "calendar table" (events + tours).
   A periwinkle month banner over an Event Date / Time · Price /
   Booking Link table, where the booking status collapses into the
   button (Book date / Few left / Sold out). Rendered by
   bte_caltable() in lib/render.php; shows in the WordPress embed
   and on the standalone booking pages.
   ============================================================ */
/* The set holds the month tables side by side, centred, and — crucially —
   capped so the widget never stretches to the full page width. */
.bte-caltbl-set {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    gap: 1.5rem;
    max-width: 840px;
    margin: 0 auto;
}
.bte-caltbl {
    flex: 1 1 360px;
    max-width: 400px;
    margin: 0;
    background: #fff;
    border: 1px solid #e5e6ea;
    border-radius: 10px;
    overflow: hidden;
}
.bte-caltbl__month {
    background: #c3c7e2;
    color: #2b2f3a;
    text-align: center;
    font-family: var(--bte-display);
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: 0;
    padding: 0.7rem;
    margin: 0;
}
.bte-caltbl__table { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.bte-caltbl__table th {
    background: #f4f4f6;
    font-family: var(--bte-sans);
    text-align: left;
    font-size: 0.72rem; font-weight: 700; color: #4b4f56;
    padding: 0.5rem 0.7rem;
    border-bottom: 1px solid #e5e6ea;
}
.bte-caltbl__c-book { text-align: right; }
.bte-caltbl__table td {
    padding: 0.5rem 0.7rem;
    color: #2b2f3a;
    border-bottom: 1px solid #f0f0f2;
    vertical-align: middle;
}
.bte-caltbl__table tbody tr:last-child td { border-bottom: 0; }
.bte-caltbl__table tbody tr:nth-child(even) { background: #fafafb; }
.bte-caltbl__c-date { font-weight: 700; white-space: nowrap; }
.bte-caltbl__c-date, .bte-caltbl__c-time { border-right: 1px solid #f0f0f2; }
.bte-caltbl__rowtitle { display: block; font-size: 0.7rem; font-weight: 700; color: #8a8f98; }
.bte-caltbl__was { color: #9aa0a6; text-decoration: line-through; margin-right: 0.1rem; }
.bte-caltbl__now { font-weight: 600; }

.bte-caltbl__book {
    display: inline-block; text-align: center;
    padding: 0.32rem 0.85rem; border-radius: 6px;
    background: #c3c7e2; color: #2b2f3a;
    font-size: 0.68rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
    text-decoration: none; border: 0; cursor: pointer; line-height: 1.3;
    transition: filter 0.15s;
}
.bte-caltbl__book:hover { filter: brightness(0.95); color: #2b2f3a; }
.bte-caltbl__book--few { background: #9b93a6; color: #fff; }
/* Sold out reads as plain red text, not a filled button. */
.bte-caltbl__book--out {
    background: none; color: #b0201f; padding: 0.32rem 0;
    letter-spacing: 0.1em; cursor: default;
}

@media (max-width: 520px) {
    .bte-caltbl { flex-basis: 100%; max-width: 100%; }
}

/* ============================================================
   Booking wizard — heading armour for the WordPress embed.
   When the checkout is injected into a WP page, the host theme's
   heading rules (e.g. .entry-content h1/h2) outrank our single-class
   .bte-wiz__* selectors and blow the titles up to marketing size.
   Re-pin them at higher specificity + !important (the same tactic the
   embed already uses for buttons/fields) so they stay sensible. Scoped
   to .bte-embed, which wraps the wizard on both the standalone page and
   the injected fragment. */
.bte-embed .bte-wiz__title {
    font-size: clamp(1.4rem, 4.5vw, 2rem) !important;
    line-height: 1.15 !important;
}
.bte-embed .bte-wiz__ptitle {
    font-size: 1.3rem !important;
    line-height: 1.25 !important;
}
.bte-embed .bte-wiz__sumtitle { font-size: 1.1rem !important; }
.bte-embed .bte-wiz__sumtotal { font-size: 1.15rem !important; }
.bte-embed .bte-wiz__eyebrow { font-size: 0.72rem !important; }
.bte-embed .bte-wiz__ticket-price { font-size: 1.4rem !important; }