@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700&display=swap');
/* Purchase pages under the Showroom template on modernvegas.com (seat map, GA tickets, package seats, NLiven + SCS
   checkout, confirmation, pickup, expired) — Pete 11/1 consumer pass: the seat page "switches to the old dark design".
   COLOUR SKIN ONLY: docs/Checkout-UX-Spec.md 7.3 keeps one layout everywhere, so nothing here moves, resizes or hides
   anything. Swaps the near-black surfaces for the site's midnight navy with the logo's sky-blue hairline. The font stays
   the site theme's (light) Outfit, so every line height and size is what buyers had before (a skin drops the site theme).
   Every functional colour is left alone (seat price colours, selected seats, Value Seats magenta, cyan Checkout,
   sold-out red, success green). The SCS checkout keeps the site's light checkout (scs-light) — it already matches the
   white site. Same structure as strip-purchase.css / selena-purchase.css. */
body.tpl-buy-showroom:not(.scs-light) {
    --sb-bg: #0a1430;
    --sb-surface: #0e1b3d;
    --sb-surface-2: #16295a;
    --sb-input: #12224a;
    --sb-line: rgba(27, 169, 233, .38);
    --sb-stage: #081028;
    background:
        radial-gradient(ellipse 70% 30% at 0% 0%, rgba(27, 169, 233, .12), transparent 70%),
        radial-gradient(ellipse 70% 30% at 100% 0%, rgba(242, 106, 33, .07), transparent 70%),
        var(--sb-bg) !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
    min-height: 100vh;
    font-family: 'Outfit', -apple-system, sans-serif;
}
html:has(> body.tpl-buy-showroom:not(.scs-light)) { background: #0a1430; }

/* Header bar: navy with the sky-blue hairline the site's bands use. */
body.tpl-buy-showroom:not(.scs-light) :is(.seating-header, .site-header) {
    background: rgba(10, 20, 48, .97); border-bottom: 1px solid #1ba9e9; box-shadow: none;
}

/* Cards and panels. */
body.tpl-buy-showroom:not(.scs-light) :is(.card, .sidebar, .consumer-actions, .seat-cart-card, .checkout-card, .ga-intro-note,
    .ga-modal-card, .scs-ga-modal__card, .hold-expired-card, .ga-page:not(.ga-page--seatmap) .ga-actions) {
    background: var(--sb-surface); border-color: var(--sb-line);
}
body.tpl-buy-showroom:not(.scs-light) :is(.ga-section-card, .ga-summary) {
    background: linear-gradient(165deg, var(--sb-surface-2) 0%, var(--sb-surface) 100%); border-color: var(--sb-line);
}
body.tpl-buy-showroom:not(.scs-light) .ga-section-card.ga-section-sold-out { background: var(--sb-surface); }

/* Map stage: navy in the black so the dark seats still read. */
body.tpl-buy-showroom:not(.scs-light) :is(.map-panel, .map-viewport, .map-panel svg) { background: var(--sb-stage); }

/* Inputs, steppers, small buttons. */
body.tpl-buy-showroom:not(.scs-light) :is(.field input, #stripe-card-element, .stripe-payment-element-wrap, .promo-row input, .promo-controls input,
    .ga-promo-input, .controls input, .controls select, .consumer-controls select, .consumer-controls input) {
    background: var(--sb-input); border-color: var(--sb-line);
}
body.tpl-buy-showroom:not(.scs-light) :is(.zoom-controls .zoom-btn, .ga-quantity-btn, .ga-stepper-button, .scs-ga-modal__step, .btn:not(.primary),
    .pay-alt .pay-btn, .promo-controls button, .ga-promo-apply) {
    background: var(--sb-surface-2); border-color: var(--sb-line);
}
body.tpl-buy-showroom:not(.scs-light) :is(.ga-modal-quantity-display) { background: var(--sb-bg); }

/* SCS confirmation + tour pickup (the gap the spec 7.3 audit found in other skins). */
body.tpl-buy-showroom:not(.scs-light) .confirm-card { background: var(--sb-surface); border-color: var(--sb-line); }
body.tpl-buy-showroom:not(.scs-light) :is(.ticket-row, .cal-btn) { background: var(--sb-surface-2); border-color: var(--sb-line); }
body.tpl-buy-showroom:not(.scs-light) .field select { background: var(--sb-input); border-color: var(--sb-line); }