/* ═══════════════════════════════════════════════════════════════════
   booking-wizard.css
   Timewarp Arcade — multi-step ticket booking wizard + WC checkout skin
   Uses CSS custom properties already declared in :root via global.css
   ═══════════════════════════════════════════════════════════════════ */

/* ────────────────────────────────────────
   WIZARD SHELL
   ──────────────────────────────────────── */
.tw-wizard {
	width: 100%;
	max-width: 600px;
	margin: 0 auto;
	padding: 2rem 1rem 3rem;
	font-family: var(--font-body, 'DM Mono', monospace);
	color: var(--text, #A8BCD8);
	box-sizing: border-box;
	overflow-x: hidden;
}

/* ────────────────────────────────────────
   PROGRESS INDICATOR
   ──────────────────────────────────────── */
.tw-progress {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	margin: 0 auto 2.5rem;
}

.tw-progress__step {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 5px;
	flex-shrink: 0;
}

.tw-progress__num {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	border: 2px solid rgba(120, 100, 255, .25);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: .75rem;
	font-weight: 700;
	color: rgba(168, 188, 216, .35);
	background: var(--bg-panel, #0E0E24);
	transition: border-color .3s, color .3s, background .3s, box-shadow .3s;
}

.tw-progress__lbl {
	font-size: .55rem;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: rgba(168, 188, 216, .3);
	transition: color .3s;
}

.tw-progress__line {
	flex: 1;
	height: 2px;
	background: rgba(120, 100, 255, .18);
	min-width: 24px;
	max-width: 72px;
}

/* Active step */
.tw-progress__step.is-active .tw-progress__num {
	border-color: var(--cyan, #00E5FF);
	color: var(--cyan, #00E5FF);
	background: rgba(0, 229, 255, .08);
	box-shadow: 0 0 18px rgba(0, 229, 255, .35);
}
.tw-progress__step.is-active .tw-progress__lbl { color: var(--cyan, #00E5FF); }

/* Completed step */
.tw-progress__step.is-done .tw-progress__num {
	border-color: var(--green, #39FF14);
	color: var(--bg, #05050E);
	background: var(--green, #39FF14);
	box-shadow: 0 0 12px rgba(57, 255, 20, .3);
}
.tw-progress__step.is-done .tw-progress__lbl { color: var(--green, #39FF14); }

/* ────────────────────────────────────────
   STEP PANELS
   ──────────────────────────────────────── */
.tw-step            { display: none; }
.tw-step.is-active  { display: block; animation: tw-slide-in .22s ease; }

@keyframes tw-slide-in {
	from { opacity: 0; transform: translateY(10px); }
	to   { opacity: 1; transform: translateY(0); }
}

.tw-step__title {
	font-family: var(--font-display, 'Orbitron', sans-serif);
	font-size: clamp(.95rem, 3vw, 1.25rem);
	font-weight: 900;
	color: var(--text-bright, #D0E4F8);
	margin-bottom: 1.5rem;
	line-height: 1.3;
}

/* Validation error / info line below controls */
.tw-step__note {
	font-size: .68rem;
	min-height: 1.2em;
	margin: .5rem 0 0;
	color: var(--pink, #FF2D6B);
}

/* Step footer: back + next buttons */
.tw-step__actions {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin-top: 1.6rem;
	width: 100%;
	box-sizing: border-box;
}

.tw-step__actions .tw-btn {
	width: 100%;
	padding: 1rem 1.25rem;
	text-align: center;
	white-space: normal;
	box-sizing: border-box;
}

/* ────────────────────────────────────────
   BUTTONS — SHARED
   ──────────────────────────────────────── */
.tw-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .45rem;
	padding: .72rem 1.6rem;
	border-radius: 8px;
	font-family: var(--font-display, 'Orbitron', sans-serif);
	font-size: .7rem;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	cursor: pointer;
	border: none;
	transition: box-shadow .2s, opacity .2s, border-color .2s, color .2s;
	white-space: nowrap;
}

.tw-btn--primary {
	background: var(--cyan, #00E5FF);
	color: var(--bg, #05050E);
	box-shadow: 0 0 16px rgba(0, 229, 255, .3);
}
.tw-btn--primary:hover:not(:disabled) { box-shadow: 0 0 28px rgba(0, 229, 255, .55); }

.tw-btn--ghost {
	background: transparent;
	color: rgba(168, 188, 216, .6);
	border: 1px solid rgba(120, 100, 255, .28);
}
.tw-btn--ghost:hover:not(:disabled) {
	color: var(--text-bright, #D0E4F8);
	border-color: rgba(0, 229, 255, .45);
}

.tw-btn--checkout {
	flex: 1;
	padding: .9rem 2rem;
	font-size: .76rem;
	background: linear-gradient(135deg, var(--pink, #FF2D6B), var(--purple, #9D4EDD));
	color: #fff;
	box-shadow: 0 0 20px rgba(255, 45, 107, .35);
}
.tw-btn--checkout:hover:not(:disabled) { box-shadow: 0 0 36px rgba(255, 45, 107, .6); }

.tw-btn:disabled { opacity: .45; cursor: not-allowed; }

/* ────────────────────────────────────────
   STEP 1 — PATH GRID
   ──────────────────────────────────────── */
.tw-path-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(155px, 1fr));
	gap: 1rem;
}

.tw-path-btn {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .6rem;
	padding: 1.5rem 1rem;
	background: var(--bg-card, #12122E);
	border: 2px solid rgba(120, 100, 255, .18);
	border-radius: 12px;
	cursor: pointer;
	text-align: center;
	transition: border-color .25s, box-shadow .25s, transform .2s;
	color: var(--text-bright, #D0E4F8);
}
.tw-path-btn:hover:not(:disabled) {
	border-color: var(--cyan, #00E5FF);
	box-shadow: 0 0 22px rgba(0, 229, 255, .18);
	transform: translateY(-3px);
}

.tw-path-btn__icon  { font-size: 2.2rem; line-height: 1; }

.tw-path-btn__name {
	font-family: var(--font-display, 'Orbitron', sans-serif);
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .5px;
	color: var(--text-bright, #D0E4F8);
}

.tw-path-btn__desc {
	font-size: .6rem;
	color: rgba(168, 188, 216, .55);
}

.tw-path-btn__badge {
	font-size: .55rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: var(--yellow, #FFE600);
	background: rgba(255, 230, 0, .1);
	border: 1px solid rgba(255, 230, 0, .3);
	border-radius: 20px;
	padding: 2px 9px;
}

.tw-path-btn--soon {
	opacity: .4;
	cursor: not-allowed;
}

/* ────────────────────────────────────────
   STEP 2 — TICKET QUANTITY ROWS
   ──────────────────────────────────────── */
.tw-qty-list {
	display: flex;
	flex-direction: column;
	gap: .55rem;
}

.tw-qty-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: .85rem 1rem;
	background: var(--bg-card, #12122E);
	border: 1px solid rgba(120, 100, 255, .16);
	border-radius: 10px;
	transition: border-color .2s;
}
.tw-qty-row:hover { border-color: rgba(0, 229, 255, .22); }

.tw-qty-row__info {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: .18rem;
}

.tw-qty-row__label {
	font-size: .78rem;
	font-weight: 600;
	color: var(--text-bright, #D0E4F8);
}

.tw-qty-row__price {
	font-size: .68rem;
	color: var(--cyan, #00E5FF);
	display: flex;
	align-items: center;
	gap: .4rem;
}

.tw-qty-row__note {
	font-style: normal;
	font-size: .6rem;
	color: var(--green, #39FF14);
	background: rgba(57, 255, 20, .1);
	border-radius: 4px;
	padding: 1px 7px;
}

/* +/- stepper */
.tw-qty-row__ctrl {
	display: flex;
	flex-direction: row;
	align-items: stretch;
	justify-content: center;
	height: 40px;
	border: 1px solid rgba(120, 100, 255, .28);
	border-radius: 8px;
	overflow: hidden;
	flex-shrink: 0;
}

.tw-qty-btn {
	width: 36px;
	height: 100%;
	box-sizing: border-box;
	margin: 0;
	border-radius: 0;
	background: var(--bg-panel, #0E0E24);
	border: none;
	color: var(--text-bright, #D0E4F8);
	font-size: 1.15rem;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition: background .18s, color .18s;
}
.tw-qty-btn:hover:not(:disabled) {
	background: rgba(0, 229, 255, .14);
	color: var(--cyan, #00E5FF);
}
.tw-qty-btn:disabled { opacity: .28; cursor: not-allowed; }

.tw-qty-input {
	width: 44px;
	height: 100%;
	box-sizing: border-box;
	margin: 0;
	border-radius: 0;
	text-align: center;
	background: var(--bg-panel, #0E0E24);
	border: none;
	border-left: 1px solid rgba(120, 100, 255, .18);
	border-right: 1px solid rgba(120, 100, 255, .18);
	color: var(--text-bright, #D0E4F8);
	font-family: var(--font-body, 'DM Mono', monospace);
	font-size: .85rem;
	font-weight: 700;
	-moz-appearance: textfield;
}
.tw-qty-input::-webkit-outer-spin-button,
.tw-qty-input::-webkit-inner-spin-button { -webkit-appearance: none; }

/* Step 2 helper notes */
.tw-step2-notes {
	list-style: none;
	margin: .75rem 0 0;
	padding: .75rem 1rem;
	border-top: 1px solid rgba(120, 100, 255, .12);
	display: flex;
	flex-direction: column;
	gap: .4rem;
}
.tw-step2-notes li {
	font-size: .78rem;
	color: #aaaaaa;
	line-height: 1.5;
}
.tw-step2-notes li strong {
	color: var(--text-bright, #D0E4F8);
}

/* Group discount hint (Step 2) */
.tw-group-hint {
	min-height: 0;
	font-size: .72rem;
	padding: 0 1rem;
	margin-top: .5rem;
	transition: opacity .2s;
}
.tw-group-hint:empty { margin: 0; }
.tw-group-hint--nudge {
	color: var(--text-muted, #8898aa);
}
.tw-group-hint--applied {
	color: var(--green, #00E676);
	font-weight: 600;
}

/* Running subtotal */
.tw-subtotal {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: .85rem 1rem;
	margin-top: .75rem;
	border-top: 1px solid rgba(120, 100, 255, .18);
}

.tw-subtotal__label {
	font-size: .65rem;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: rgba(168, 188, 216, .5);
}

.tw-subtotal__price {
	font-family: var(--font-display, 'Orbitron', sans-serif);
	font-size: 1.05rem;
	font-weight: 900;
	color: var(--cyan, #00E5FF);
}

/* ────────────────────────────────────────
   STEP 3 — DATE PICKER
   ──────────────────────────────────────── */
.tw-cal-wrap    { margin-bottom: 1rem; }

.tw-cal-label {
	display: block;
	font-size: .62rem;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: rgba(168, 188, 216, .5);
	margin-bottom: .5rem;
}

.tw-date-input {
	width: 100%;
	padding: .85rem 1rem;
	background: var(--bg-card, #12122E);
	border: 2px solid rgba(120, 100, 255, .22);
	border-radius: 10px;
	color: var(--text-bright, #D0E4F8);
	font-family: var(--font-body, 'DM Mono', monospace);
	font-size: .85rem;
	cursor: pointer;
	transition: border-color .25s, box-shadow .25s;
}
.tw-date-input:focus,
.tw-date-input.flatpickr-input.active {
	border-color: var(--cyan, #00E5FF);
	box-shadow: 0 0 20px rgba(0, 229, 255, .18);
	outline: none;
}

/* ── Flatpickr — light calendar for universal readability ──
   Native <select> and <input> elements are always legible on white
   regardless of browser or OS. The cyan accent ties it to the theme. ── */
.flatpickr-calendar.tw-flatpickr,
.flatpickr-calendar {
	background: #ffffff !important;
	border: 1px solid #dde2ef !important;
	border-radius: 12px !important;
	box-shadow: 0 12px 40px rgba(0, 0, 0, .5) !important;
	color: #1a1a2e !important;
}

/* Header bar */
.flatpickr-months,
.flatpickr-month                   { background: #f0f4ff !important; border-radius: 10px 10px 0 0; }
.flatpickr-prev-month svg,
.flatpickr-next-month svg          { fill: #1a1a2e !important; }
.flatpickr-prev-month:hover svg,
.flatpickr-next-month:hover svg    { fill: #00E5FF !important; }

/* Month/year controls — explicit colours so native selects are always visible */
.flatpickr-current-month span.cur-month,
.flatpickr-current-month input.cur-year { color: #1a1a2e !important; }

.flatpickr-monthDropdown-months {
	background: #ffffff !important;
	color: #1a1a2e !important;
	border: 1px solid #ccd0e0 !important;
	border-radius: 4px !important;
}
.flatpickr-monthDropdown-months option {
	background: #ffffff !important;
	color: #1a1a2e !important;
}
.flatpickr-current-month .numInputWrapper input.cur-year {
	background: #ffffff !important;
	color: #1a1a2e !important;
}

/* Weekday labels */
span.flatpickr-weekday             { background: #f0f4ff !important; color: #6b7a99 !important; font-size: .65rem; }

/* Day cells */
.flatpickr-day                     { color: #1a1a2e !important; border-radius: 6px; border: none; }
.flatpickr-day:hover               { background: rgba(0, 229, 255, .2) !important; color: #06060f !important; border: none; }

/* Selected day */
.flatpickr-day.selected,
.flatpickr-day.selected:hover {
	background: #00E5FF !important;
	color: #06060f !important;
	font-weight: 700;
	box-shadow: 0 0 12px rgba(0, 229, 255, .5);
	border: none;
}

/* Today indicator */
.flatpickr-day.today {
	border: 2px solid #00E5FF !important;
	color: #1a1a2e !important;
}

/* Disabled days (Mon–Thu) */
.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover {
	color: #c0c8d8 !important;
	background: transparent !important;
	cursor: not-allowed;
}

/* Opening hours reference block */
.tw-hours-ref {
	margin-top: .9rem;
	background: var(--bg-card, #12122E);
	border: 1px solid rgba(120, 100, 255, .16);
	border-radius: 10px;
	padding: .85rem 1rem;
}
.tw-hours-ref__title {
	font-size: .58rem;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: rgba(168, 188, 216, .4);
	margin-bottom: .55rem;
}
.tw-hours-ref__row {
	display: flex;
	justify-content: space-between;
	font-size: .7rem;
	padding: .22rem 0;
	color: rgba(168, 188, 216, .65);
}
.tw-hours-ref__row .open   { color: var(--green, #39FF14); }
.tw-hours-ref__row .closed { color: rgba(168, 188, 216, .25); }

/* ────────────────────────────────────────
   STEP 4 — ORDER SUMMARY
   ──────────────────────────────────────── */
.tw-summary {
	background: var(--bg-card, #12122E);
	border: 1px solid rgba(0, 229, 255, .18);
	border-radius: 12px;
	overflow: hidden;
	margin-bottom: .5rem;
}

.tw-summary__date {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: .85rem 1.1rem;
	background: rgba(0, 229, 255, .05);
	border-bottom: 1px solid rgba(0, 229, 255, .12);
	flex-wrap: wrap;
	gap: .5rem;
}
.tw-summary__date-label {
	font-size: .58rem;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	color: rgba(168, 188, 216, .5);
}
.tw-summary__date-val {
	font-family: var(--font-display, 'Orbitron', sans-serif);
	font-size: .75rem;
	font-weight: 700;
	color: var(--cyan, #00E5FF);
}

.tw-summary__items { padding: .35rem 0; }

.tw-summary__row {
	display: flex;
	justify-content: space-between;
	padding: .45rem 1.1rem;
	font-size: .75rem;
	color: var(--text-bright, #D0E4F8);
	border-bottom: 1px solid rgba(120, 100, 255, .1);
}
.tw-summary__row:last-child { border-bottom: none; }
.tw-summary__row--discount {
	color: var(--green, #00E676);
	font-weight: 600;
	border-bottom: none;
}

.tw-summary__total {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: .85rem 1.1rem;
	border-top: 2px solid rgba(255, 230, 0, .18);
	background: rgba(255, 230, 0, .03);
}
.tw-summary__total span:first-child {
	font-size: .6rem;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: rgba(168, 188, 216, .5);
}
.tw-summary__total span:last-child {
	font-family: var(--font-display, 'Orbitron', sans-serif);
	font-size: 1.15rem;
	font-weight: 900;
	color: var(--yellow, #FFE600);
}

/* ════════════════════════════════════════════
   WOOCOMMERCE CHECKOUT DARK SKIN
   Targets WC's default classes; !important
   needed to override WC's own inline styles.
   ════════════════════════════════════════════ */

/* ── Nav logo: WooCommerce sets img { height: auto } which overrides the
      44px constraint and lets the logo render at its full intrinsic size. ── */
body.woocommerce-checkout      .nav-logo-img,
body.woocommerce-cart          .nav-logo-img,
body.woocommerce-page          .nav-logo-img,
body.woocommerce-order-received .nav-logo-img {
	height: 44px !important;
	width: auto !important;
	max-width: none !important;
	max-height: 44px !important;
}

/* ── Layout: hide GeneratePress sidebar, expand content column ── */
body.woocommerce-checkout       .widget-area,
body.woocommerce-cart           .widget-area,
body.woocommerce-order-received .widget-area {
	display: none !important;
}

body.woocommerce-checkout       .content-area,
body.woocommerce-cart           .content-area,
body.woocommerce-order-received .content-area {
	width: 100% !important;
	max-width: 1200px !important;
	margin: 0 auto !important;
	float: none !important;
	box-sizing: border-box !important;
}

/* ── Background: force dark on every layer ──────────────────────────────────
   GeneratePress dynamically outputs:
     .separate-containers .inside-article { background-color: #fff }
   We must beat it with higher specificity AND a solid colour (not transparent,
   which can fall through to a white stacking context).
   ───────────────────────────────────────────────────────────────────────── */
body.woocommerce-checkout,
body.woocommerce-cart,
body.woocommerce-page,
body.woocommerce-order-received {
	background-color: var(--bg, #05050E) !important;
}

/* GeneratePress card wrapper — beat .separate-containers .inside-article */
body.woocommerce-checkout.separate-containers        .inside-article,
body.woocommerce-checkout .separate-containers       .inside-article,
body.woocommerce-cart.separate-containers            .inside-article,
body.woocommerce-checkout                            .inside-article,
body.woocommerce-checkout                            .inside-page-header,
body.woocommerce-checkout .one-container             .container,
body.woocommerce-order-received.separate-containers  .inside-article,
body.woocommerce-order-received .separate-containers .inside-article,
body.woocommerce-order-received                      .inside-article,
body.woocommerce-order-received                      .inside-page-header,
body.woocommerce-order-received .one-container       .container {
	background-color: var(--bg, #05050E) !important;
	background-image: none !important;
}

/* WooCommerce form wrappers */
.woocommerce,
.woocommerce-page,
.woocommerce-checkout,
.woocommerce-cart,
.woocommerce-checkout form.checkout,
.woocommerce-checkout .entry-content,
.woocommerce-checkout #customer_details,
.woocommerce-checkout .col2-set,
.woocommerce-checkout .col-1,
.woocommerce-checkout .col-2,
.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout .woocommerce-additional-fields {
	background: none !important;
	background-color: transparent !important;
}

/* ── Promo-code section (WooCommerce default, repositioned above payment) ── */
.woocommerce-checkout .woocommerce-form-coupon-toggle,
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout .woocommerce-checkout-review-order-table {
	margin-bottom: 2rem !important;
}
.woocommerce-checkout .woocommerce-form-coupon-toggle {
	padding: 0 !important;
}
/* Notice styled as a plain label — no interactive affordances */
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
	color: var(--text-muted, #8898aa) !important;
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	padding: 0 0 0.4rem !important;
	font-size: 0.78rem !important;
	cursor: default !important;
}
/* Kill the WC info icon */
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info::before {
	display: none !important;
}
/* Coupon form container */
.woocommerce-checkout form.checkout_coupon,
.woocommerce-checkout .woocommerce-form-coupon {
	display: flex !important;
	align-items: center !important;
	flex-wrap: wrap !important;
	gap: 0.5rem !important;
	padding: 0 !important;
	margin: 0 0 2rem !important;
	background: transparent !important;
	border: none !important;
	border-radius: 0 !important;
	box-sizing: border-box !important;
}
/* Apply coupon button */
.woocommerce-checkout form.checkout_coupon .button,
.woocommerce-checkout .woocommerce-form-coupon .button {
	background: var(--yellow, #FFE600) !important;
	color: var(--bg, #05050E) !important;
	font-weight: 700 !important;
	border: none !important;
	padding: 0.65rem 1.2rem !important;
	border-radius: 4px !important;
	cursor: pointer !important;
	white-space: nowrap !important;
	transition: background 0.2s !important;
}
.woocommerce-checkout form.checkout_coupon .button:hover,
.woocommerce-checkout .woocommerce-form-coupon .button:hover {
	background: #ffffff !important;
}
/* Strip WC's floated <p> wrapper margins and widths */
.woocommerce-checkout form.checkout_coupon .form-row,
.woocommerce-checkout .woocommerce-form-coupon .form-row {
	float: none !important;
	width: auto !important;
	margin: 0 !important;
	padding: 0 !important;
}
.woocommerce-checkout form.checkout_coupon .form-row-first {
	flex: 1 1 160px !important;
}
.woocommerce-checkout form.checkout_coupon .form-row-last {
	flex-shrink: 0 !important;
}
/* Input fills its flex cell */
.woocommerce-checkout form.checkout_coupon input[name="coupon_code"] {
	width: 100% !important;
	margin: 0 !important;
}
/* Hide the WC clearfix div */
.woocommerce-checkout form.checkout_coupon .clear {
	display: none !important;
}

/* ── Privacy policy text ─────────────────────────────────────────────────── */
.woocommerce-checkout .woocommerce-privacy-policy-text,
.woocommerce-checkout .woocommerce-privacy-policy-text p,
.woocommerce-checkout .woocommerce-privacy-policy-text a {
	color: var(--text-muted, #8898aa) !important;
	font-size: 0.75rem !important;
	line-height: 1.6 !important;
}
.woocommerce-checkout .woocommerce-privacy-policy-text a {
	color: var(--yellow, #FFE600) !important;
	text-decoration: underline !important;
}

/* ── Hide the empty Additional Information column ─────────────────────────── */
.woocommerce-checkout .col-2,
.woocommerce-checkout .woocommerce-additional-fields,
.woocommerce-checkout .woocommerce-additional-fields__field-wrapper {
	display: none !important;
}

/* Expand the billing/details column to full width when col-2 is gone */
.woocommerce-checkout .col2-set .col-1 {
	width: 100% !important;
	float: none !important;
	max-width: 100% !important;
}

/* ── Section headings h1–h6 ─────────────────────────────────────────────── */
.woocommerce h1, .woocommerce h2, .woocommerce h3,
.woocommerce h4, .woocommerce h5, .woocommerce h6,
.woocommerce-page h1, .woocommerce-page h2, .woocommerce-page h3,
.woocommerce-page h4, .woocommerce-page h5, .woocommerce-page h6,
.woocommerce-checkout h1, .woocommerce-checkout h2, .woocommerce-checkout h3,
.woocommerce-checkout h4, .woocommerce-checkout h5, .woocommerce-checkout h6 {
	font-family: var(--font-display, 'Orbitron', sans-serif) !important;
	font-weight: 700 !important;
	color: var(--text-bright, #D0E4F8) !important;
	text-transform: uppercase;
	letter-spacing: 1px;
	border-bottom: 1px solid rgba(120, 100, 255, .2) !important;
	padding-bottom: .7rem !important;
	margin-bottom: 1.2rem !important;
}

/* ── Field labels ────────────────────────────────────────────────────────── */
.woocommerce label,
.woocommerce-page label,
.woocommerce-checkout label,
.woocommerce form .form-row label {
	/* Use --text-bright rather than pure white so labels read on both
	   dark and any residual light backgrounds in the form area. */
	color: var(--text-bright, #D0E4F8) !important;
	font-family: var(--font-body, 'DM Mono', monospace) !important;
	font-size: .7rem !important;
	font-weight: 600 !important;
	text-transform: uppercase;
	letter-spacing: 1px;
	display: block;
	margin-bottom: 5px;
}

/* Text inputs / selects — white bg for legibility against the dark page */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-checkout .input-text,
.woocommerce-checkout select,
.woocommerce-checkout textarea {
	background-color: #ffffff !important;
	color: #000000 !important;
	border: 1px solid #cccccc !important;
	border-radius: 8px !important;
	font-family: var(--font-body, 'DM Mono', monospace) !important;
	font-size: .83rem !important;
	padding: .75rem 1rem !important;
	transition: border-color .2s, box-shadow .2s !important;
}
.woocommerce form .form-row input.input-text::placeholder,
.woocommerce form .form-row textarea::placeholder {
	color: #666666 !important;
	opacity: 1 !important;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus,
.woocommerce-checkout .input-text:focus,
.woocommerce-checkout select:focus {
	border-color: var(--cyan, #00E5FF) !important;
	box-shadow: 0 0 8px rgba(0, 229, 255, .5) !important;
	outline: none !important;
}

/* Order-review table */
.woocommerce-checkout-review-order-table {
	background: var(--bg-card, #12122E) !important;
	border: 1px solid rgba(120, 100, 255, .18) !important;
	border-radius: 10px !important;
	overflow: hidden;
}
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
	background: transparent !important;
	color: var(--text-bright, #D0E4F8) !important;
	border-color: rgba(120, 100, 255, .12) !important;
	font-family: var(--font-body, 'DM Mono', monospace) !important;
}
.woocommerce-checkout-review-order-table tfoot .order-total td {
	color: var(--yellow, #FFE600) !important;
	font-family: var(--font-display, 'Orbitron', sans-serif) !important;
	font-size: .95rem !important;
	font-weight: 900 !important;
}

/* Cart item meta (Visit Date) */
.woocommerce-checkout-review-order-table .variation dt,
.woocommerce-checkout-review-order-table .variation dd,
.cart-item-meta { color: rgba(168, 188, 216, .55) !important; font-size: .68rem !important; }

/* Payment section */
.woocommerce-checkout #payment,
.woocommerce-checkout .woocommerce-checkout-payment {
	margin-top: 0 !important;
	background: var(--bg-panel, #0E0E24) !important;
	border: 1px solid rgba(120, 100, 255, .18) !important;
	border-radius: 10px !important;
}
.woocommerce-checkout #payment ul.wc_payment_methods {
	padding-top: 1.25rem !important;
}
.woocommerce-checkout #payment .payment_methods li {
	border-color: rgba(120, 100, 255, .15) !important;
	background: transparent !important;
}
.woocommerce-checkout #payment label { color: var(--text-bright, #D0E4F8) !important; }
.woocommerce-checkout #payment .payment_box {
	background: rgba(0, 0, 0, .3) !important;
	color: rgba(168, 188, 216, .7) !important;
}

/* Coupon / promo code */
.woocommerce-checkout .showcoupon,
.woocommerce-cart   .showcoupon  { color: var(--cyan, #00E5FF) !important; }
.woocommerce-checkout #coupon_code { color: #000000 !important; }

/* Place Order button — yellow neon, matches .btn-yellow in global.css */
#place_order {
	background: var(--yellow, #FFE600) !important;
	color: var(--bg, #05050E) !important;
	font-family: var(--font-display, 'Orbitron', sans-serif) !important;
	font-size: .78rem !important;
	font-weight: 700 !important;
	letter-spacing: 1.5px !important;
	text-transform: uppercase !important;
	border: none !important;
	border-radius: 8px !important;
	padding: 1rem 2rem !important;
	width: 100% !important;
	box-shadow: 0 0 28px rgba(255, 230, 0, .35) !important;
	transition: background .2s, box-shadow .2s, transform .2s !important;
	cursor: pointer !important;
}
#place_order:hover {
	background: #ffffff !important;
	color: var(--bg, #05050E) !important;
	box-shadow: 0 0 45px rgba(255, 255, 255, .45) !important;
	transform: translateY(-2px) !important;
}

/* WC notices — info, message, error */
.woocommerce-info,
.woocommerce-message,
.woocommerce-error {
	background-color: #0f1016 !important;
	background-image: none !important;
	color: #ffffff !important;
	border-top: 3px solid #00f3ff !important;
	font-family: var(--font-body, 'DM Mono', monospace) !important;
	font-size: .72rem !important;
}
.woocommerce-info a,
.woocommerce-message a,
.woocommerce-error a { color: #fce300 !important; }

/* Inline confirm-email error from JS */
.tw-confirm-error {
	color: var(--pink, #FF2D6B) !important;
	font-size: .68rem !important;
}

/* ════════════════════════════════════════════════════════════════════
   ORDER RECEIVED (THANK YOU) PAGE
   ════════════════════════════════════════════════════════════════════ */

/* Base text colour — everything inherits from here */
body.woocommerce-order-received .woocommerce,
body.woocommerce-order-received .woocommerce-order {
	color: var(--text, #A8BCD8) !important;
}

/* "Thank you. Your order has been received." banner */
body.woocommerce-order-received .woocommerce-thankyou-order-received {
	font-family: var(--font-display, 'Orbitron', sans-serif) !important;
	font-size: clamp(1rem, 2.5vw, 1.4rem) !important;
	font-weight: 700 !important;
	color: var(--green, #00E676) !important;
	background: rgba(0, 230, 118, .08) !important;
	border-left: 3px solid var(--green, #00E676) !important;
	border-radius: 6px !important;
	padding: 1rem 1.25rem !important;
	margin-bottom: 2rem !important;
}

/* Order overview strip (order no · date · email · total · payment method) */
.woocommerce-order-received .woocommerce-order-overview {
	list-style: none !important;
	margin: 0 0 2.5rem !important;
	padding: 0 !important;
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 1px !important;
	background: rgba(120, 100, 255, .2) !important;
	border: 1px solid rgba(120, 100, 255, .2) !important;
	border-radius: 8px !important;
	overflow: hidden !important;
}
.woocommerce-order-received .woocommerce-order-overview li {
	flex: 1 1 160px !important;
	background: var(--bg-mid, #0B0B1A) !important;
	padding: .9rem 1.1rem !important;
	font-size: .72rem !important;
	text-transform: uppercase !important;
	letter-spacing: .5px !important;
	color: var(--text-muted, #8898aa) !important;
	border: none !important;
}
.woocommerce-order-received .woocommerce-order-overview li strong {
	display: block !important;
	font-size: .95rem !important;
	font-weight: 700 !important;
	color: var(--text-bright, #D0E4F8) !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	margin-top: .2rem !important;
}

/* Section headings */
.woocommerce-order-received .woocommerce-order-details__title,
.woocommerce-order-received .woocommerce-column__title {
	font-family: var(--font-display, 'Orbitron', sans-serif) !important;
	font-size: .85rem !important;
	font-weight: 700 !important;
	color: var(--text-bright, #D0E4F8) !important;
	text-transform: uppercase !important;
	letter-spacing: 1px !important;
	border-bottom: 1px solid rgba(120, 100, 255, .25) !important;
	padding-bottom: .6rem !important;
	margin-bottom: 1rem !important;
}

/* Order details table */
.woocommerce-order-received .woocommerce-table--order-details {
	width: 100% !important;
	border-collapse: collapse !important;
	margin-bottom: 2rem !important;
}
.woocommerce-order-received .woocommerce-table--order-details th,
.woocommerce-order-received .woocommerce-table--order-details td {
	padding: .7rem .9rem !important;
	border-bottom: 1px solid rgba(120, 100, 255, .12) !important;
	color: var(--text, #A8BCD8) !important;
	background: transparent !important;
	text-align: left !important;
}
.woocommerce-order-received .woocommerce-table--order-details thead th {
	font-size: .65rem !important;
	text-transform: uppercase !important;
	letter-spacing: .6px !important;
	color: var(--text-muted, #8898aa) !important;
	border-bottom-color: rgba(120, 100, 255, .25) !important;
}
.woocommerce-order-received .woocommerce-table--order-details .product-name {
	color: var(--text-bright, #D0E4F8) !important;
	font-weight: 600 !important;
}
.woocommerce-order-received .woocommerce-table--order-details tfoot th,
.woocommerce-order-received .woocommerce-table--order-details tfoot td {
	font-weight: 700 !important;
	color: var(--text-bright, #D0E4F8) !important;
}
.woocommerce-order-received .woocommerce-table--order-details tfoot .order-total td {
	color: var(--yellow, #FFE600) !important;
	font-family: var(--font-display, 'Orbitron', sans-serif) !important;
	font-size: 1rem !important;
}

/* Customer details addresses */
.woocommerce-order-received .woocommerce-customer-details address {
	background: var(--bg-mid, #0B0B1A) !important;
	border: 1px solid rgba(120, 100, 255, .2) !important;
	border-radius: 8px !important;
	padding: 1rem 1.25rem !important;
	color: var(--text, #A8BCD8) !important;
	font-style: normal !important;
}

/* Notices (info / error) */
.woocommerce-order-received .woocommerce-info,
.woocommerce-order-received .woocommerce-message {
	background: rgba(0, 229, 255, .07) !important;
	border-top-color: var(--cyan, #00E5FF) !important;
	color: var(--text-bright, #D0E4F8) !important;
}

/* ── QR code block (thank you page) ─────────────────────────────────────── */
.tw-qr-wrap {
	text-align: center;
	margin: 2rem auto 2.5rem;
	padding: 1.5rem 1rem;
	background: rgba(120, 100, 255, .06);
	border: 1px solid rgba(120, 100, 255, .25);
	border-radius: 12px;
	max-width: 320px;
}
.tw-qr-ref {
	font-size: .72rem;
	text-transform: uppercase;
	letter-spacing: .5px;
	color: var(--text-muted, #8898aa);
	margin-bottom: 1rem;
}
.tw-qr-ref strong {
	display: block;
	font-family: var(--font-display, 'Orbitron', sans-serif);
	font-size: 1rem;
	color: var(--yellow, #FFE600);
	letter-spacing: 2px;
	margin-top: .25rem;
}
.neon-ticket-qr {
	display: block;
	margin: 0 auto 1rem;
	border: 3px solid #D946EF;
	box-shadow: 0 0 15px rgba(217, 70, 239, .6), 0 0 40px rgba(217, 70, 239, .2);
	border-radius: 10px;
	padding: 10px;
	background: #ffffff;
}
.tw-qr-note {
	font-size: .68rem;
	color: var(--text-muted, #8898aa);
	text-transform: uppercase;
	letter-spacing: .5px;
}

/* ════════════════════════════════════════════════════════════════════
   ARCADE TRANSITION LOADER
   ════════════════════════════════════════════════════════════════════ */
#arcade-transition-loader {
	position: fixed;
	inset: 0;
	z-index: 99999;
	background: #000000;
	display: none; /* shown via JS */
	flex-direction: column;
	justify-content: center;
	align-items: center;
	pointer-events: auto;
}

/* Body lock — prevents scroll and stray clicks outside the overlay */
body.tw-body-locked {
	overflow: hidden !important;
	pointer-events: none !important;
}
/* Overlay itself must still receive events */
#arcade-transition-loader,
#arcade-transition-loader * {
	pointer-events: auto !important;
}

.atl-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
}

/* Spinning coin */
.atl-coin {
	font-size: 3rem;
	animation: atl-spin 1s linear infinite;
	display: block;
}
@keyframes atl-spin {
	from { transform: rotateY(0deg);   }
	to   { transform: rotateY(360deg); }
}

/* Main heading */
.atl-text {
	font-family: monospace, monospace;
	font-size: clamp(1.4rem, 4vw, 2rem);
	font-weight: 700;
	color: #fce300;
	text-shadow: 0 0 10px #fce300, 0 0 25px rgba(252, 227, 0, .5);
	letter-spacing: 3px;
	text-transform: uppercase;
	animation: atl-blink 1s step-end infinite;
}
@keyframes atl-blink {
	0%, 100% { opacity: 1; }
	50%       { opacity: 0; }
}

/* Dot ellipsis that cycles independently */
.atl-dots::after {
	content: '';
	animation: atl-dots 1.2s steps(4, end) infinite;
}
@keyframes atl-dots {
	0%   { content: '';    }
	25%  { content: '.';   }
	50%  { content: '..';  }
	75%  { content: '...'; }
}

/* Sub-label */
.atl-sub {
	font-family: monospace, monospace;
	font-size: .8rem;
	color: rgba(252, 227, 0, .55);
	letter-spacing: 2px;
	text-transform: uppercase;
}

/* Scanning progress bar */
.atl-bar-wrap {
	width: min(260px, 70vw);
	height: 4px;
	background: rgba(252, 227, 0, .15);
	border-radius: 2px;
	overflow: hidden;
	margin-top: .5rem;
}
.atl-bar {
	height: 100%;
	width: 40%;
	background: #fce300;
	box-shadow: 0 0 10px #fce300;
	border-radius: 2px;
	animation: atl-scan 1.4s ease-in-out infinite;
}
@keyframes atl-scan {
	0%   { transform: translateX(-100%); }
	100% { transform: translateX(350%);  }
}

/* ── Checkout editable quantity controls ────────────────────────────────── */
.tw-qty-ctrl {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	margin-left: 0.4rem;
	vertical-align: middle;
}
.tw-qty-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	padding: 0;
	background: var(--bg, #05050E);
	border: 1px solid rgba(120, 100, 255, .5);
	border-radius: 4px;
	color: var(--yellow, #FFE600);
	font-size: 1rem;
	line-height: 1;
	cursor: pointer;
	transition: border-color .15s, background .15s;
}
.tw-qty-btn:hover {
	border-color: var(--yellow, #FFE600);
	background: rgba(255, 230, 0, .1);
}
.tw-qty-val {
	display: inline-block;
	min-width: 1.4rem;
	text-align: center;
	font-weight: 700;
	font-size: .85rem;
	color: var(--text-bright, #D0E4F8);
}

/* ────────────────────────────────────────
   RESPONSIVE
   ──────────────────────────────────────── */
@media (max-width: 540px) {
	.tw-wizard         { padding: 1.2rem .25rem 2rem; }
	.tw-path-grid      { grid-template-columns: 1fr; }
	.tw-qty-row        { flex-wrap: wrap; }
	.tw-qty-row__ctrl  { align-self: flex-end; }
	.tw-step__actions           { flex-direction: column-reverse; }
	.tw-progress__lbl  { font-size: .48rem; letter-spacing: .5px; }
	.tw-progress__line { min-width: 12px; }
	.tw-progress__num  { width: 28px; height: 28px; font-size: .62rem; }
}

/* ────────────────────────────────────────
   BOOKING SWITCHED OFF - PRICING FALLBACK
   Shown by tw_tickets_offline_html() when
   TIMEWARP_ONLINE_BOOKING is false.
   ──────────────────────────────────────── */
.tw-offline {
	max-width: 520px;
	margin: 0 auto;
	text-align: left;
}

.tw-offline__prices {
	background: var(--bg-card, #12122E);
	border: 1px solid rgba(120, 100, 255, .18);
	border-radius: 12px;
	overflow: hidden;
}
.tw-offline__row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 1rem;
	padding: .8rem 1.1rem;
	border-bottom: 1px solid rgba(120, 100, 255, .1);
}
.tw-offline__row:last-child { border-bottom: none; }

.tw-offline__label {
	font-family: var(--font-body, monospace);
	font-size: .72rem;
	color: var(--text-bright, #D0E4F8);
}
.tw-offline__price {
	font-family: var(--font-display, sans-serif);
	font-weight: 700;
	font-size: .95rem;
	color: var(--yellow, #FFE600);
	white-space: nowrap;
}
.tw-offline__price strong {
	font-size: .78rem;
	color: var(--green, #39FF14);
}

.tw-offline__notice {
	display: flex;
	gap: .8rem;
	align-items: flex-start;
	margin-top: .9rem;
	padding: .95rem 1.1rem;
	background: rgba(255, 230, 0, .06);
	border: 1px solid rgba(255, 230, 0, .28);
	border-radius: 10px;
}
.tw-offline__notice-icon { font-size: 1.15rem; line-height: 1; flex-shrink: 0; }

/* Group discount: cyan + dashed so it reads as an offer, not an entry price */
.tw-offline__notice--group {
	background: rgba(0, 229, 255, .05);
	border: 1px dashed rgba(0, 229, 255, .45);
}
.tw-offline__notice.tw-offline__notice--group strong { color: var(--cyan, #00E5FF); }
.tw-offline__notice--group p b { color: var(--text-bright, #D0E4F8); }

/* Discount figures: price · unit · was · saving */
.tw-offer {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: .15rem .55rem;
	margin: .1rem 0 .45rem;
}
.tw-offer__price {
	font-family: var(--font-display, sans-serif);
	font-weight: 700;
	font-size: 1.05rem;
	color: var(--yellow, #FFE600);
}
.tw-offer__unit {
	font-size: .7rem;
	color: var(--text-bright, #D0E4F8);
}
.tw-offer__was {
	font-size: .7rem;
	color: rgba(168, 188, 216, .7);
	text-decoration: line-through;
}
.tw-offer__save {
	font-family: var(--font-display, sans-serif);
	font-weight: 700;
	font-size: .62rem;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--green, #39FF14);
	border: 1px solid rgba(57, 255, 20, .45);
	border-radius: 3px;
	padding: .15rem .4rem;
	white-space: nowrap;
}
.tw-offline__notice strong {
	display: block;
	font-family: var(--font-display, sans-serif);
	font-size: .8rem;
	color: var(--yellow, #FFE600);
	margin-bottom: .3rem;
}
.tw-offline__notice p {
	margin: 0;
	font-size: .7rem;
	line-height: 1.6;
	color: rgba(168, 188, 216, .8);
}

@media (max-width: 480px) {
	.tw-offline__row      { padding: .7rem .85rem; }
	.tw-offline__label    { font-size: .66rem; }
	.tw-offline__price    { font-size: .85rem; }
	.tw-offline__notice   { padding: .8rem .85rem; }
}