/*
 * Spektrix Events — Public Stylesheet
 *
 * Structural layout only. Colours, fonts and spacing belong in your theme.
 * BEM naming: .sx-{block}__{element}--{modifier}
 */

/* ── Shared palette (override on :root or a component wrapper in your theme) ─ */

:root {
	--sx-navy:        #161886;
	--sx-accent:      #2a65d9;
	--sx-tan:         #a06835;
	--sx-tan-hover:   #925a28;
	--sx-white:       #fff;
	--sx-list-stripe: #efefef;
	--sx-text:        #1e1e1e;
	--sx-merch-card:  #d4a876;
	--sx-error:       #c0392b;
	--sx-off-sale:    #6b6b6b;
	--sx-red:		  #931937;
}

/* ── Screen reader only (WordPress-compatible) ─────────────────────────────── */

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

/* ── [spektrix_upcoming_events] — card grid ──────────────────────────────── */

.sx-events--upcoming {
	--sx-events-columns:    3;
	--sx-events-gap:          clamp( 1rem, 2.5vw, 1.5rem );
	--sx-events-card-padding: clamp( 0.875rem, 2vw, 1.25rem );
	--sx-events-title-size:   clamp( 0.875rem, 1.2vw + 0.5rem, 1rem );
	--sx-events-date-size:    clamp( 1rem, 1.5vw + 0.5rem, 1.375rem );
	--sx-events-image-ratio:  4 / 3;
	box-sizing: border-box;
	max-width: 100%;
}

.sx-events--upcoming .sx-events__list {
	display: grid;
	grid-template-columns: repeat( var( --sx-events-columns ), minmax( 0, 1fr ) );
	gap: var( --sx-events-gap );
	list-style: none;
	margin: 0;
	padding: 0;
}

.sx-events--upcoming .sx-event-card {
	display: flex;
	flex-direction: column;
	min-width: 0;
	border: 1px solid var( --sx-text );
}

.sx-events--upcoming .sx-event-card__image-wrap {
	display: block;
	flex-shrink: 0;
	line-height: 0;
	overflow: hidden;
}

.sx-events--upcoming .sx-event-card__image {
	width: 100%;
	aspect-ratio: var( --sx-events-image-ratio );
	object-fit: cover;
	display: block;
}

.sx-events--upcoming .sx-event-card__body {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: var( --sx-events-card-padding );
	gap: 0.35rem;
	min-width: 0;
}

.sx-events--upcoming .sx-event-card__title {
	margin: 0;
	font-size: var( --sx-events-title-size );
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	line-height: 1.25;
	overflow-wrap: break-word;
	word-break: break-word;
	hyphens: auto;
	max-width: 100%;
}

.sx-events--upcoming .sx-event-card__title a {
	color: inherit;
	text-decoration: none;
	transition: color 0.15s ease, text-decoration-color 0.15s ease;
}

.sx-events--upcoming .sx-event-card:nth-child( odd ) .sx-event-card__title a {
	color: var( --sx-white );
}

.sx-events--upcoming .sx-event-card:nth-child( even ) .sx-event-card__title a {
	color: var( --sx-navy );
}

.sx-events--upcoming .sx-event-card__title a:hover,
.sx-events--upcoming .sx-event-card__title a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 0.12em;
	outline: none;
}

.sx-events--upcoming .sx-event-card:nth-child( odd ) .sx-event-card__title a:hover,
.sx-events--upcoming .sx-event-card:nth-child( odd ) .sx-event-card__title a:focus-visible {
	color: var( --sx-white );
}

.sx-events--upcoming .sx-event-card:nth-child( even ) .sx-event-card__title a:hover,
.sx-events--upcoming .sx-event-card:nth-child( even ) .sx-event-card__title a:focus-visible {
	color: var( --sx-navy );
}

.sx-events--upcoming .sx-event-card__date {
	margin: 0;
	font-size: var( --sx-events-date-size );
	font-weight: 500;
	line-height: 1.3;
	max-width: 100%;
}

.sx-events--upcoming .sx-event-card__excerpt {
	margin-top: 0.5rem;
	max-width: 100%;
}

.sx-events--upcoming .sx-event-card__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.5rem;
	margin-top: 0.75rem;
	max-width: 100%;
}

.sx-events--upcoming .sx-event-card__more-info:focus-visible,
.sx-events--upcoming .sx-event-card__buy-btn:focus-visible {
	outline: 2px solid var( --sx-navy );
	outline-offset: 2px;
}

/* Odd cards (1, 3, 5…) — dark blue bg, white text */
.sx-events--upcoming .sx-event-card:nth-child( odd ) .sx-event-card__body {
	background-color: var( --sx-navy );
	color: var( --sx-white );
}

.sx-events--upcoming .sx-event-card:nth-child( odd ) .sx-event-card__body .sx-event-card__title {
	color: var( --sx-white );
}

/* Even cards (2, 4, 6…) — white bg, dark text */
.sx-events--upcoming .sx-event-card:nth-child( even ) .sx-event-card__body {
	background-color: var( --sx-white );
	color: var( --sx-text );
}

@media ( max-width: 1024px ) {
	.sx-events--upcoming {
		--sx-events-columns: 2;
	}
}

@media ( max-width: 640px ) {
	.sx-events--upcoming {
		--sx-events-columns: 1;
	}
}

/* ── Booking page wrapper ─────────────────────────────────────────────────── */

.sx-booking-wrap {
	max-width: 820px;
	margin: 0 auto;
	padding: 0 1rem;
}

/* ── Back link ────────────────────────────────────────────────────────────── */

.sx-booking-back {
	margin-bottom: 1.5rem;
}

.sx-booking-back__link {
	display: inline-flex;
	align-items: center;
	gap: 0.35em;
	text-decoration: none;
	font-size: 0.9em;
}

/* ── Event header ─────────────────────────────────────────────────────────── */

.sx-booking-header {
	display: flex;
	gap: 1.5rem;
	align-items: flex-start;
	margin-bottom: 2rem;
}

.sx-booking-header__image {
	flex-shrink: 0;
	width: 160px;
}

.sx-booking-header__img {
	width: 100%;
	height: auto;
	display: block;
}

.sx-booking-header__title {
	margin: 0 0 0.5rem;
}

/* ── Progress bar ─────────────────────────────────────────────────────────── */

.sx-booking-steps {
	display: flex;
	gap: 0;
	list-style: none;
	margin: 0 0 2rem;
	padding: 0;
	counter-reset: sx-step;
}

.sx-booking-steps__step {
	flex: 1;
	text-align: center;
	font-size: 0.8em;
	padding: 0.5em;
	opacity: 0.4;
	position: relative;
}

.sx-booking-steps__step::before {
	counter-increment: sx-step;
	content: counter( sx-step );
	display: block;
	font-weight: 700;
}

.sx-booking-steps__step.is-active  { opacity: 1; font-weight: 600; }
.sx-booking-steps__step.is-complete { opacity: 0.7; }

/* ── Steps ────────────────────────────────────────────────────────────────── */

.sx-step { margin-top: 1rem; }
.sx-step__heading { margin: 0 0 1.25rem; }

/* ── Instance list ────────────────────────────────────────────────────────── */

.sx-instance-list {
	list-style: none;
	margin: 0 0 1.5rem;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.sx-instance-btn {
	width: 100%;
	text-align: left;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0.75rem 1rem;
	cursor: pointer;
	border: 1px solid currentColor;
	background: transparent;
	font: inherit;
}

.sx-instance-btn:hover,
.sx-instance-btn.is-selected { outline: 3px solid; }

.sx-instance-btn__avail {
	font-size: 0.85em;
	opacity: 0.7;
}

/* ── Seat grid ────────────────────────────────────────────────────────────── */

.sx-seat-grid {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin-bottom: 1.5rem;
	overflow-x: auto;
}

.sx-seat-row {
	display: flex;
	gap: 4px;
	justify-content: center;
}

.sx-seat {
	width: 32px;
	height: 32px;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.6rem;
	border: 1px solid transparent;
	cursor: default;
}

.sx-seat__label { pointer-events: none; }

.sx-seat--gap { background: transparent; border-color: transparent; }

.sx-seat--available {
	background: var( --sx-band-color, #ccc );
	cursor: pointer;
}

.sx-seat--unavailable {
	background: #e0e0e0;
	opacity: 0.4;
}

.sx-seat--available:hover,
.sx-seat--available.is-selected {
	outline: 2px solid;
	outline-offset: 1px;
}

/* ── Price legend ─────────────────────────────────────────────────────────── */

.sx-price-legend {
	list-style: none;
	margin: 0 0 1rem;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	font-size: 0.875em;
}

.sx-price-legend__item {
	display: flex;
	align-items: center;
	gap: 0.4em;
}

.sx-price-legend__swatch {
	width: 14px;
	height: 14px;
	display: inline-block;
	border-radius: 2px;
	flex-shrink: 0;
}

/* ── GA picker ────────────────────────────────────────────────────────────── */

.sx-ga-ticket-types { display: flex; flex-direction: column; gap: 1rem; margin-bottom: 1rem; }

.sx-ga-ticket-type {
	display: flex;
	align-items: center;
	gap: 1rem;
	flex-wrap: wrap;
}

.sx-ga-ticket-type__name { flex: 1; font-weight: 600; }
.sx-ga-ticket-type__price { min-width: 80px; }

.sx-ga-qty-control {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.sx-ga-qty-btn {
	width: 32px;
	height: 32px;
	cursor: pointer;
	border: 1px solid currentColor;
	background: transparent;
	font: inherit;
	font-size: 1.2em;
}

.sx-ga-qty-input {
	width: 48px;
	text-align: center;
	border: 1px solid currentColor;
	padding: 0.25em;
	font: inherit;
}

.sx-ga-availability { font-size: 0.85em; opacity: 0.7; margin-top: 0.5rem; }

/* ── Basket page ──────────────────────────────────────────────────────────── */

.sx-basket {
	--sx-basket-icon-color: var( --sx-navy );
	--sx-basket-icon-hover-opacity: 0.85;
	max-width: var( --sx-content-max, 1380px );
	margin: 0 auto;
	padding: 0 var( --sx-content-gutter, 24px );
	color: var( --sx-text );
}

.sx-basket__error {
	color: var( --sx-error );
	margin: 0;
}

.sx-basket__empty {
	padding: 2rem 0;
	text-align: center;
	opacity: 0.85;
}

.sx-basket__loading {
	padding: 2rem 0;
	text-align: center;
	font-style: italic;
	opacity: 0.7;
}

.sx-basket__inner {
	margin-top: 1rem;
}

.sx-basket__promo {
	background-color: #f8f7f7;
	border-radius: 4px;
	margin-bottom: 1.25rem;
	padding: 1.25rem 1.5rem;
}

.sx-basket__promo-label {
	display: block;
	margin: 0 0 0.65rem;
	color: var( --sx-navy );
	font-size: 1.125rem;
	font-weight: 700;
}

.sx-basket__promo-controls {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
}

.sx-basket__promo-input {
	box-sizing: border-box;
	flex: 1 1 12rem;
	min-width: 0;
	min-height: 48px;
	padding: 0.65em 1em;
	border: 1px solid rgba( 22, 24, 134, 0.25 );
	border-radius: 4px;
	background: var( --sx-white, #fff );
	color: var( --sx-text );
	font: inherit;
	font-size: 1rem;
}

.sx-basket__promo-input:focus {
	outline: 2px solid var( --sx-accent, var( --sx-navy ) );
	outline-offset: 2px;
}

.sx-basket__promo-applied {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem 1rem;
}

.sx-basket__promo-applied .sx-basket__promo-label {
	margin: 0;
}

.sx-basket__promo-code {
	font-weight: 700;
	color: var( --sx-navy );
	letter-spacing: 0.02em;
}

#sx-basket button.sx-basket__promo-apply {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	min-width: 6rem;
	padding: 0.65em 1.5em;
	border: none;
	border-radius: 18px;
	background: var( --sx-tan );
	background-image: none;
	box-shadow: none;
	color: var( --sx-white );
	font-family: inherit;
	font-size: inherit;
	font-weight: 800;
	letter-spacing: 0.04em;
	line-height: 1.2;
	text-transform: none;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	transition: background 0.15s, opacity 0.15s;
}

#sx-basket button.sx-basket__promo-apply:hover:not( :disabled ) {
	background: var( --sx-tan-hover );
	background-image: none;
	color: var( --sx-white );
}

#sx-basket button.sx-basket__promo-apply:focus-visible {
	outline: 2px solid var( --sx-accent );
	outline-offset: 2px;
}

#sx-basket button.sx-basket__promo-apply:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

#sx-basket button.sx-basket__promo-remove {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 0;
	padding: 0.45em 1em;
	border: 2px solid var( --sx-navy );
	border-radius: 18px;
	background: transparent;
	background-image: none;
	color: var( --sx-navy );
	font-family: inherit;
	font-size: 0.875rem;
	font-weight: 400;
	letter-spacing: 0.04em;
	line-height: 1.2;
	text-transform: none;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	transition: background 0.15s, color 0.15s, opacity 0.15s;
}

#sx-basket button.sx-basket__promo-remove:hover:not( :disabled ) {
	background: var( --sx-navy );
	background-image: none;
	color: var( --sx-white );
}

#sx-basket button.sx-basket__promo-remove:focus-visible {
	outline: 2px solid var( --sx-accent );
	outline-offset: 2px;
}

#sx-basket button.sx-basket__promo-remove:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

.sx-basket__fee-row--savings .sx-basket__total-amount {
	color: var( --sx-navy );
}

.sx-basket__table-wrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.sx-basket__table {
	width: 100%;
	border-collapse: collapse;
	font-size: 1rem;
}

.sx-basket__table th,
.sx-basket__table td {
	padding: 0.75rem 0.5rem;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid rgba( 22, 24, 134, 0.12 );
}

.sx-basket__table thead th {
	font-weight: 700;
	color: var( --sx-navy );
	border-bottom-width: 2px;
}

.sx-basket__col--price {
	text-align: right;
	white-space: nowrap;
}

.sx-basket__col--remove {
	width: 2.25rem;
	text-align: center;
}

.sx-basket__item-name {
	display: block;
	font-weight: 400;
}

.sx-basket__item-meta {
	display: block;
	font-size: 0.875em;
	opacity: 0.75;
	margin-top: 0.15rem;
}

/* Theme shields — global button/table rules (e.g. Folly) override bare class selectors */
#sx-basket .sx-basket__item-name,
#sx-basket .sx-basket__col--price {
	font-weight: 400;
	font-size: 1rem;
}

#sx-basket button.sx-basket__remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-width: 32px;
	min-height: 32px;
	padding: 0;
	border: none;
	border-radius: 4px;
	background: transparent;
	background-image: none;
	color: var( --sx-basket-icon-color );
	font-family: inherit;
	font-size: 1.25rem;
	font-weight: 400;
	line-height: 1;
	text-transform: none;
	letter-spacing: normal;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	transition: opacity 0.15s;
}

#sx-basket button.sx-basket__remove:hover:not( :disabled ),
#sx-basket button.sx-basket__remove:focus-visible {
	background: transparent;
	background-image: none;
	color: var( --sx-basket-icon-color );
	opacity: var( --sx-basket-icon-hover-opacity );
	outline: 2px solid var( --sx-accent );
	outline-offset: 2px;
}

#sx-basket button.sx-basket__remove:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

.sx-basket__remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 32px;
	min-height: 32px;
	padding: 0;
	border: none;
	background: transparent;
	color: var( --sx-basket-icon-color );
	font-size: 1.25rem;
	line-height: 1;
	cursor: pointer;
	border-radius: 4px;
	transition: opacity 0.15s;
}

.sx-basket__remove:hover:not( :disabled ),
.sx-basket__remove:focus-visible {
	opacity: var( --sx-basket-icon-hover-opacity );
	outline: 2px solid var( --sx-accent );
	outline-offset: 2px;
}

.sx-basket__remove:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

.sx-basket__subtotal-row td,
.sx-basket__fee-row td {
	border-bottom: none;
	padding-top: 0.5rem;
	font-weight: 400;
}

.sx-basket__table tfoot tr:first-child td {
	border-top: 2px solid var( --sx-navy );
}

.sx-basket__total-row td {
	border-bottom: none;
	padding-top: 1rem;
	font-weight: 700;
}

.sx-basket__table tfoot tr:last-child td {
	border-bottom: 2px solid var( --sx-navy );
}

.sx-basket__total-label {
	text-align: right;
	color: var( --sx-navy );
}

.sx-basket__total-amount {
	text-align: right;
	font-size: 1rem;
}

.sx-basket__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	align-items: center;
	justify-content: space-between;
	margin-top: 1.5rem;
}

#sx-basket button.sx-basket__clear {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 0;
	padding: 0.45em 1em;
	border: 2px solid var( --sx-navy );
	border-radius: 18px;
	background: transparent;
	background-image: none;
	color: var( --sx-navy );
	font-family: inherit;
	font-size: 0.875rem;
	font-weight: 400;
	letter-spacing: 0.04em;
	line-height: 1.2;
	text-transform: none;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	transition: background 0.15s, color 0.15s, opacity 0.15s;
}

#sx-basket button.sx-basket__clear:hover:not( :disabled ) {
	background: var( --sx-navy );
	background-image: none;
	color: var( --sx-white );
}

#sx-basket button.sx-basket__clear:focus-visible {
	outline: 2px solid var( --sx-accent );
	outline-offset: 2px;
}

#sx-basket button.sx-basket__clear:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

.sx-basket__clear {
	padding: 0.45em 1em;
	border: 2px solid var( --sx-navy );
	border-radius: 18px;
	background: transparent;
	color: var( --sx-navy );
	font: inherit;
	font-size: 0.875rem;
	font-weight: inherit;
	letter-spacing: 0.04em;
	cursor: pointer;
}

.sx-basket__clear:hover:not( :disabled ) {
	background: var( --sx-navy );
	color: var( --sx-white );
}

.sx-basket__clear:focus-visible {
	outline: 2px solid var( --sx-accent );
	outline-offset: 2px;
}

.sx-basket__clear:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

.sx-basket__checkout {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	min-width: 200px;
	padding: 0.65em 1.5em;
	border: none;
	border-radius: 18px;
	background: var( --sx-tan );
	color: var( --sx-white );
	font: inherit;
	font-weight: 800;
	letter-spacing: 0.04em;
	text-decoration: none;
	cursor: pointer;
}

.sx-basket__checkout:hover {
	background: var( --sx-tan-hover );
	color: var( --sx-white );
	text-decoration: none;
}

.sx-basket__checkout:focus-visible {
	outline: 2px solid var( --sx-accent );
	outline-offset: 2px;
}

/* Theme shields — Elementor/theme link & button kits override bare <a> selectors */
#sx-basket a.sx-basket__checkout {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	min-width: 200px;
	padding: 0.65em 1.5em;
	border: none;
	border-radius: 18px;
	background: var( --sx-tan );
	background-image: none;
	box-shadow: none;
	color: var( --sx-white );
	font-family: inherit;
	font-size: inherit;
	font-weight: 800;
	letter-spacing: 0.04em;
	line-height: 1.2;
	text-decoration: none;
	text-transform: none;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
}

#sx-basket a.sx-basket__checkout:hover {
	border: none;
	background: var( --sx-tan-hover );
	background-image: none;
	box-shadow: none;
	color: var( --sx-white );
	text-decoration: none;
}

#sx-basket a.sx-basket__checkout:focus-visible {
	outline: 2px solid var( --sx-accent );
	outline-offset: 2px;
}

.sx-basket__feedback {
	margin-top: 1rem;
	padding: 0.75rem 1rem;
	border-radius: 6px;
}

.sx-basket__feedback--success {
	background: #e8f5e9;
	color: #1b5e20;
}

.sx-basket__feedback--error {
	background: #fdecea;
	color: var( --sx-error );
}

.sx-error {
	color: var( --sx-error );
	margin: 0 0 1rem;
}

@media ( max-width: 640px ) {
	.sx-basket__table thead {
		display: none;
	}

	.sx-basket__table,
	.sx-basket__table tbody,
	.sx-basket__table tr,
	.sx-basket__table td {
		display: block;
		width: 100%;
	}

	.sx-basket__row {
		padding: 1rem 0;
		border-bottom: 1px solid rgba( 22, 24, 134, 0.12 );
	}

	.sx-basket__row td {
		border-bottom: none;
		padding: 0.25rem 0;
	}

	.sx-basket__col--item {
		padding-bottom: 0.5rem;
	}

	.sx-basket__col--price {
		text-align: left;
		font-weight: 400;
	}

	.sx-basket__col--price::before {
		content: attr( data-label );
		display: inline-block;
		font-weight: 400;
		opacity: 0.75;
		margin-right: 0.5rem;
	}

	.sx-basket__col--remove {
		text-align: left;
		padding-top: 0.5rem;
	}

	.sx-basket__total-row {
		display: flex;
		flex-wrap: wrap;
		align-items: baseline;
		justify-content: space-between;
		gap: 0.5rem;
		padding-top: 1rem;
	}

	.sx-basket__table tfoot tr:first-child {
		border-top: 2px solid var( --sx-navy );
	}

	.sx-basket__subtotal-row,
	.sx-basket__fee-row {
		display: flex;
		flex-wrap: wrap;
		align-items: baseline;
		justify-content: space-between;
		gap: 0.5rem;
		padding-top: 0.5rem;
	}

	.sx-basket__subtotal-row td,
	.sx-basket__fee-row td,
	.sx-basket__total-row td {
		display: block;
		width: auto;
		padding: 0;
		border-top: none;
	}

	.sx-basket__total-label {
		text-align: left;
	}

	.sx-basket__table tfoot tr:last-child {
		border-bottom: 2px solid var( --sx-navy );
		padding-bottom: 0.5rem;
	}

	.sx-basket__actions {
		flex-direction: column;
		align-items: stretch;
	}

	.sx-basket__promo-controls {
		flex-direction: column;
		align-items: stretch;
	}

	.sx-basket__promo-input,
	#sx-basket button.sx-basket__promo-apply,
	#sx-basket button.sx-basket__promo-remove {
		width: 100%;
	}

	.sx-basket__clear {
		align-self: flex-start;
		width: auto;
	}

	.sx-basket__checkout {
		width: 100%;
	}
}

/* ── Checkout iframe ──────────────────────────────────────────────────────── */

.sx-checkout-iframe-wrap {
	margin-top: 2rem;
	border: 1px solid currentColor;
}

.sx-checkout-iframe {
	width: 100%;
	min-height: 600px;
	border: none;
	display: block;
}

/* ── Standalone checkout page ─────────────────────────────────────────────── */

.sx-checkout-wrap .sx-checkout-iframe-wrap {
	margin-top: 0;
}

.sx-checkout__empty,
.sx-checkout__error {
	padding: 2rem 0;
	text-align: center;
}

.sx-checkout__empty p {
	margin-bottom: 1rem;
}

/* ── Booking step 2 — review + checkout CTAs ────────────────────────────── */

.sx-booking-wrap--seat-selection .sx-booking-checkout-actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px;
	margin-top: 32px;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__continue--secondary {
	background: transparent;
	color: var( --sx-navy );
	border: 2px solid var( --sx-navy );
}

.sx-booking-wrap--seat-selection .sx-seat-selection__continue--secondary:hover,
.sx-booking-wrap--seat-selection .sx-seat-selection__continue--secondary:focus-visible {
	background: var( --sx-navy );
	color: #fff;
	opacity: 1;
	text-decoration: none;
}

@media ( max-width: 640px ) {
	.sx-booking-wrap--seat-selection .sx-booking-checkout-actions {
		flex-direction: column;
		align-items: center;
	}

	.sx-booking-wrap--seat-selection .sx-booking-checkout-actions .sx-seat-selection__continue {
		width: 100%;
		max-width: 320px;
	}
}

/* ── Step nav ─────────────────────────────────────────────────────────────── */

.sx-step-nav {
	display: flex;
	gap: 1rem;
	align-items: center;
	margin-top: 1.5rem;
}

/* ── Buttons ──────────────────────────────────────────────────────────────── */

.sx-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	padding: 0.65em 1.25em;
	cursor: pointer;
	border: 1px solid currentColor;
	background: transparent;
	font: inherit;
	text-decoration: none;
}

.sx-btn:disabled { opacity: 0.45; cursor: not-allowed; }
.sx-btn--primary { font-weight: 600; }

/* ── Event picker (booking page — no event selected) ──────────────────────── */

.sx-booking-wrap--picker { max-width: 680px; }

.sx-picker__heading { margin: 0 0 1.25rem; }
.sx-picker__empty   { opacity: 0.7; }

.sx-picker-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.sx-picker-list__item {
	border-bottom: 1px solid currentColor;
}

.sx-picker-list__link {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 0.875rem 0;
	text-decoration: none;
	color: inherit;
}

.sx-picker-list__link:hover { opacity: 0.75; }

.sx-picker-list__thumb {
	width: 72px;
	height: 72px;
	object-fit: cover;
	flex-shrink: 0;
}

.sx-picker-list__info {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.sx-picker-list__title {
	font-weight: 600;
}

.sx-picker-list__date {
	font-size: 0.875em;
	opacity: 0.7;
}

.sx-picker-list__cta {
	display: flex;
	align-items: center;
	gap: 0.25em;
	font-size: 0.85em;
	flex-shrink: 0;
}

/* ── Notices ──────────────────────────────────────────────────────────────── */

.sx-booking-notice {
	padding: 0.75rem 1rem;
	border-left: 4px solid currentColor;
	margin: 1rem 0;
}

.sx-booking-loading { font-style: italic; opacity: 0.7; }

/* ── Responsive ───────────────────────────────────────────────────────────── */

@media ( max-width: 600px ) {
	.sx-booking-header { flex-direction: column; }
	.sx-booking-header__image { width: 100%; }
	.sx-booking-steps { font-size: 0.7em; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   [spektrix_upcoming_events] — Enhanced listing
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Listing wrapper ──────────────────────────────────────────────────────── */

.sx-listing {
	--sx-content-max:    1380px;
	--sx-content-gutter: 16px;
	max-width: 100%;
	box-sizing: border-box;
	--sx-filter-bg:             var( --sx-navy );
	--sx-filter-color:          var( --sx-white );
	--sx-filter-option-color:   var( --sx-navy );
	--sx-filter-pill-height:    46px;
	--sx-filter-pill-padding-x: 28px;
	--sx-filter-pill-radius:    999px;
	--sx-filter-pill-gap:       14px;
	--sx-filter-font-size:      0.8125rem;
	--sx-btn-bg:                var( --sx-accent );
}

/* ── Filter bar ───────────────────────────────────────────────────────────── */

.sx-listing__filters {
	max-width: var( --sx-content-max );
	margin-left: auto;
	margin-right: auto;
	padding-left:  var( --sx-content-gutter );
	padding-right: var( --sx-content-gutter );
	width: 100%;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var( --sx-filter-pill-gap );
	margin-bottom: 40px;
	position: relative;
	z-index: 50;
	isolation: isolate;
}

.sx-listing__filters--calendar {
	margin-bottom: 16px;
}

.sx-listing__filters-main {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var( --sx-filter-pill-gap );
	flex: 0 1 auto;
}

.sx-filter {
	position: relative;
	flex-shrink: 0;
	display: block;
	z-index: 1;
}

.sx-filter:has( .sx-filter__panel.is-open ),
.sx-filter:has( .sx-filter__btn[aria-expanded="true"] ) {
	z-index: 60;
}

.sx-listing .sx-filter--view {
	display: block;
	visibility: visible;
}

/* Pill toggle — Categories, Date Range, List View (shield from theme button styles) */
.sx-listing .sx-filter__btn,
.sx-listing button.sx-filter__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	box-sizing: border-box;
	min-height: var( --sx-filter-pill-height );
	padding: 0 var( --sx-filter-pill-padding-x );
	border: 2px solid var( --sx-navy );
	border-radius: var( --sx-filter-pill-radius );
	background: var( --sx-navy );
	background-image: none;
	color: #fff;
	font-family: inherit;
	font-size: var( --sx-filter-font-size );
	font-weight: 800;
	letter-spacing: 0.04em;
	line-height: 1.2;
	text-transform: uppercase;
	cursor: pointer;
	white-space: nowrap;
	appearance: none;
	-webkit-appearance: none;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, opacity 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
	-webkit-font-smoothing: antialiased;
}

.sx-listing--motion .sx-filter__btn:hover,
.sx-listing--motion .sx-filter__btn:focus-visible {
	transform: translateY( -1px );
}

.sx-filter__label {
	display: inline-block;
}

.sx-listing .sx-filter__btn:hover,
.sx-listing .sx-filter__btn:focus-visible {
	background: var( --sx-navy );
	color: #fff;
	opacity: 0.92;
	outline: 2px solid var( --sx-accent );
	outline-offset: 2px;
}

.sx-listing .sx-filter__btn[aria-expanded="true"] {
	background: var( --sx-navy );
	color: #fff;
	opacity: 1;
	box-shadow: 0 2px 8px rgba( 22, 24, 134, 0.25 );
}

/* Active filter — subtle highlight, label stays static per design */
.sx-listing .sx-filter__btn.is-filtered {
	background: var( --sx-navy );
	color: #fff;
	box-shadow: inset 0 0 0 1px rgba( 255, 255, 255, 0.35 );
}

/* Dropdown caret */
.sx-filter__caret {
	display: inline-block;
	width: 0;
	height: 0;
	margin-top: 2px;
	border-left:  5px solid transparent;
	border-right: 5px solid transparent;
	border-top:   6px solid currentColor;
	flex-shrink: 0;
	transition: transform 0.15s;
}

.sx-filter__btn[aria-expanded="true"] .sx-filter__caret {
	transform: rotate( 180deg );
}

/* Dropdown panel — shared */
.sx-filter__panel {
	display: none;
	position: absolute;
	top: calc( 100% + 8px );
	left: 0;
	z-index: 200;
	min-width: 200px;
	list-style: none;
	margin: 0;
	padding: 8px 0;
	background: #fff;
	border: 1px solid #d0d5e8;
	border-radius: 12px;
	box-shadow: 0 8px 24px rgba( 22, 24, 134, 0.12 );
}

.sx-filter__panel.is-open {
	display: block;
	animation: sx-panel-in 0.22s ease-out;
}

@keyframes sx-panel-in {
	from {
		opacity: 0;
		transform: translateY( -6px );
	}
	to {
		opacity: 1;
		transform: translateY( 0 );
	}
}

.sx-filter__panel li {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Category / view options — <a> links */
.sx-filter__option {
	display: block;
	padding: 10px 18px;
	font-size: 0.875rem;
	color: var( --sx-filter-option-color );
	text-decoration: none;
	white-space: nowrap;
	transition: background 0.12s;
}

.sx-filter__option:hover {
	background: #eef1f9;
	color: var( --sx-filter-option-color );
}

.sx-filter__option.is-active {
	background: #eef1f9;
	font-weight: 700;
}

/* Date range panel */
.sx-filter__panel--dates {
	display: none;
	min-width: 280px;
	padding: 18px;
	flex-direction: column;
	gap: 14px;
	border-radius: 12px;
}

.sx-filter__panel--dates.is-open {
	display: flex;
}

.sx-date-label {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var( --sx-filter-option-color );
}

.sx-date-input {
	flex: 1;
	padding: 8px 10px;
	border: 1px solid #c0c8e0;
	border-radius: 8px;
	font: inherit;
	font-size: 0.8125rem;
}

.sx-date-actions {
	display: flex;
	gap: var( --sx-filter-pill-gap );
	margin-top: 4px;
}

/* Apply / Clear — match filter pills & Box Office */
.sx-listing .sx-date-apply,
.sx-listing button.sx-date-apply,
.sx-listing .sx-date-clear,
.sx-listing .sx-filter__clear-all {
	box-sizing: border-box;
	flex: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var( --sx-filter-pill-height );
	padding: 0 20px;
	border-radius: var( --sx-filter-pill-radius );
	font-family: inherit;
	font-size: var( --sx-filter-font-size );
	font-weight: 800;
	letter-spacing: 0.04em;
	line-height: 1.2;
	text-transform: uppercase;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	-webkit-font-smoothing: antialiased;
	transition: background 0.15s, color 0.15s, border-color 0.15s, opacity 0.15s;
}

.sx-listing .sx-date-apply,
.sx-listing button.sx-date-apply {
	border: 2px solid var( --sx-navy );
	background: var( --sx-navy );
	background-image: none;
	color: #fff;
	appearance: none;
	-webkit-appearance: none;
}

.sx-listing .sx-date-apply:hover,
.sx-listing .sx-date-apply:focus-visible,
.sx-listing button.sx-date-apply:hover,
.sx-listing button.sx-date-apply:focus-visible {
	background: var( --sx-navy );
	border-color: var( --sx-navy );
	color: #fff;
	opacity: 0.92;
	outline: none;
}

.sx-listing .sx-date-clear {
	border: 2px solid var( --sx-navy );
	background: #fff;
	color: var( --sx-navy );
}

.sx-listing .sx-filter__clear-all {
	border: 2px solid var( --sx-navy );
	background: #fff;
	color: var( --sx-navy );
	flex: 0 1 auto;
}

.sx-listing .sx-date-clear:hover,
.sx-listing .sx-date-clear:focus-visible,
.sx-listing .sx-filter__clear-all:hover,
.sx-listing .sx-filter__clear-all:focus-visible {
	background: var( --sx-navy );
	border-color: var( --sx-navy );
	color: #fff;
	outline: none;
}

/* Page switch — tan filled pill (e.g. Upcoming Events on past listing) */
.sx-listing .sx-filter__page-switch {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: var( --sx-filter-pill-height );
	padding: 0 var( --sx-filter-pill-padding-x );
	margin-left: 0;
	border: 2px solid var( --sx-tan );
	border-radius: var( --sx-filter-pill-radius );
	background: var( --sx-tan );
	font-family: inherit;
	font-size: var( --sx-filter-font-size );
	font-weight: 800;
	letter-spacing: 0.04em;
	line-height: 1.2;
	text-transform: uppercase;
	text-decoration: none;
	color: #fff;
	white-space: nowrap;
	flex-shrink: 0;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
	-webkit-font-smoothing: antialiased;
}

.sx-listing--motion .sx-filter__page-switch:hover,
.sx-listing--motion .sx-filter__page-switch:focus-visible {
	transform: translateY( -1px );
}

.sx-listing .sx-filter__page-switch:hover,
.sx-listing .sx-filter__page-switch:focus-visible {
	background: var( --sx-tan-hover );
	border-color: var( --sx-tan-hover );
	color: var( --sx-white );
	outline: none;
}

/* Box Office — outlined pill, same height as filters */
.sx-listing .sx-filter__box-office {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: var( --sx-filter-pill-height );
	padding: 0 var( --sx-filter-pill-padding-x );
	margin-left: 0;
	border: 2px solid var( --sx-navy );
	border-radius: var( --sx-filter-pill-radius );
	background: #fff;
	font-family: inherit;
	font-size: var( --sx-filter-font-size );
	font-weight: 800;
	letter-spacing: 0.04em;
	line-height: 1.2;
	text-transform: uppercase;
	text-decoration: none;
	color: var( --sx-navy );
	white-space: nowrap;
	flex-shrink: 0;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
	-webkit-font-smoothing: antialiased;
}

.sx-listing--motion .sx-filter__box-office:hover,
.sx-listing--motion .sx-filter__box-office:focus-visible {
	transform: translateY( -1px );
}

.sx-listing .sx-filter__box-office:hover,
.sx-listing .sx-filter__box-office:focus-visible {
	background: var( --sx-navy );
	border-color: var( --sx-navy );
	color: #fff;
	outline: none;
}

/* Filter bar — small screens: one filter per row */
@media ( max-width: 640px ) {
	.sx-listing {
		--sx-filter-pill-padding-x: 20px;
		--sx-filter-pill-gap:       10px;
	}

	.sx-listing__filters {
		flex-direction: column;
		align-items: stretch;
		width: 100%;
		margin-top: 15px;
	}

	.sx-listing__filters-main {
		flex-direction: column;
		align-items: stretch;
		width: 100%;
	}

	.sx-listing__filters-main,
	.sx-listing .sx-filter,
	.sx-listing .sx-filter__box-office,
	.sx-listing .sx-filter__page-switch,
	.sx-listing .sx-filter__clear-all {
		flex: 1 1 100%;
		width: 100%;
		min-width: 0;
		max-width: 100%;
	}

	.sx-listing .sx-filter__btn,
	.sx-listing .sx-filter__box-office,
	.sx-listing .sx-filter__page-switch,
	.sx-listing .sx-filter__clear-all {
		width: 100%;
		padding-left: 16px;
		padding-right: 16px;
		font-size: 0.75rem;
	}

	.sx-filter__label {
		overflow: hidden;
		text-overflow: ellipsis;
	}
}

/* ── Results area ─────────────────────────────────────────────────────────── */

.sx-listing__results,
.sx-listing__events {
	max-width: 100%;
	min-width: 0;
	overflow: visible;
	position: relative;
	z-index: 1;
}

.sx-listing__events { display: flex; flex-direction: column; }

/* Shared content column — filters, grid, calendar, empty state */
.sx-listing__results--grid .sx-listing__events,
.sx-listing__results--calendar .sx-listing__calendar,
.sx-listing__empty {
	max-width: var( --sx-content-max );
	margin-left: auto;
	margin-right: auto;
	padding-left:  var( --sx-content-gutter );
	padding-right: var( --sx-content-gutter );
	width: 100%;
	box-sizing: border-box;
}

/* ── Single event row (list view) ─────────────────────────────────────────── */

.sx-listing-event {
	padding: 32px 0;
	border-top: none;
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}

/* List view — full-width row bands; inner blocks stay in content column */
.sx-listing__results:not( .sx-listing__results--grid ):not( .sx-listing__results--calendar ) .sx-listing-event {
	width: 100%;
}

.sx-listing__results:not( .sx-listing__results--grid ):not( .sx-listing__results--calendar ) .sx-listing-event:nth-child( odd ) {
	background: var( --sx-list-stripe );
}

.sx-listing__results:not( .sx-listing__results--grid ):not( .sx-listing__results--calendar ) .sx-listing-event:nth-child( even ) {
	background: #fff;
}

.sx-listing__results:not( .sx-listing__results--grid ):not( .sx-listing__results--calendar ) .sx-listing-event__body,
.sx-listing__results:not( .sx-listing__results--grid ):not( .sx-listing__results--calendar ) .sx-listing-event__perfs {
	max-width: var( --sx-content-max );
	margin-left: auto;
	margin-right: auto;
	padding-left:  var( --sx-content-gutter );
	padding-right: var( --sx-content-gutter );
	width: 100%;
	box-sizing: border-box;
}

/* List view — title aligns with content column; rule extends to page edge */
.sx-listing__results:not( .sx-listing__results--grid ):not( .sx-listing__results--calendar ) .sx-listing-event__header {
	padding-left: max( var( --sx-content-gutter ), calc( ( 100% - var( --sx-content-max ) ) / 2 + var( --sx-content-gutter ) ) );
	padding-right: 0;
	width: 100%;
	box-sizing: border-box;
}

/* Title + extending horizontal rule */
.sx-listing-event__header {
	display: flex;
	align-items: center;
	gap: 20px;
	margin-bottom: 22px;
	min-width: 0;
	max-width: 100%;
}
.sx-listing-event__title {
	margin: 0;
	font-size: clamp( 1.125rem, 3vw, 1.625rem );
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	white-space: normal;
	flex: 0 1 auto;
	min-width: 0;
	max-width: 100%;
	overflow-wrap: break-word;
	word-break: break-word;
	color: var( --sx-navy );
}

.sx-listing .sx-listing-event__title a {
	color: var( --sx-navy );
	text-decoration: none;
	overflow-wrap: break-word;
	word-break: break-word;
}

.sx-listing .sx-listing-event__title a:hover {
	color: var( --sx-navy );
	text-decoration: underline;
}

.sx-listing .sx-listing-event__title a:focus-visible {
	outline: 2px solid var( --sx-navy );
	outline-offset: 2px;
}

/* Double rule lines extending from title (Figma) */
.sx-listing-event__header::after {
	content: '';
	flex: 1;
	min-width: 20px;
	height: 3px;
	border-radius: 1px;
	background: var( --sx-navy );
	box-shadow: 0 7px 0 0 var( --sx-navy );
	opacity: 1;
}

/* Image | info two-column layout */
.sx-listing-event__body {
	display: grid;
	grid-template-columns: 210px 1fr;
	gap: 24px;
	margin-bottom: 24px;
	align-items: start;
}

/* Image + date badge — bottom-right radius 30px (Figma) */
.sx-listing-event__media {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: 0 0 30px 0;
}

.sx-listing-event__media a {
	display: block;
	overflow: hidden;
}

.sx-listing-event__media img {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	height: auto;
	object-fit: cover;
	transition: transform 0.5s cubic-bezier( 0.22, 1, 0.36, 1 );
}

@media ( prefers-reduced-motion: no-preference ) {
	.sx-listing-event__media:hover img,
	.sx-listing-event__media a:focus-visible img {
		transform: scale( 1.05 );
	}
}

.sx-listing-event__no-image {
	width: 100%;
	aspect-ratio: 1 / 1;
	background: #e2e6f0;
}

.sx-listing-event__badge {
	padding: 10px 12px;
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.03em;
	text-align: center;
	line-height: 1.3;
	background: var( --sx-navy );
	color: #fff;
}

.sx-listing-event__info {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
}
.sx-listing-event__excerpt {
	font-size: 0.875rem;
	line-height: 1.65;
	margin-bottom: 4px;
	color: #333;
}

.sx-listing-event__excerpt p { margin: 0 0 8px; }
.sx-listing-event__excerpt p:last-child { margin-bottom: 0; }

.sx-listing .sx-listing-event__readmore {
	font-size: 0.875rem;
	font-weight: 700;
	text-decoration: underline;
	color: var( --sx-accent );
}

.sx-listing .sx-listing-event__readmore:hover {
	color: var( --sx-accent );
	opacity: 0.85;
}

.sx-listing .sx-listing-event__readmore:focus-visible,
.sx-listing .sx-listing-event__category a:focus-visible {
	outline: 2px solid var( --sx-navy );
	outline-offset: 2px;
}

.sx-listing .sx-listing-event__category {
	font-size: 0.8125rem;
	margin: 6px 0 0;
	opacity: 1;
	/* color: var( --sx-accent ); */
}

.sx-listing .sx-listing-event__category a {
	color: var( --sx-accent );
	text-decoration: none;
	font-weight: 600;
}

.sx-listing .sx-listing-event__category a:hover {
	text-decoration: underline;
}

.sx-listing-event__section-label {
	margin: 0;
	font-size: 1.125rem;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var( --sx-navy );
}

.sx-listing-event__presented-by {
	margin-bottom: 8px;
}

.sx-listing-event__presenters {
	margin: 4px 0 0;
	font-size: 0.875rem;
	line-height: 1.65;
	color: #333;
}

.sx-listing-event__presenters strong {
	font-weight: 700;
}

.sx-listing-event__sponsors {
	margin-top: 12px;
}

.sx-listing-event__sponsors .sx-listing-event__section-label {
	margin-bottom: 8px;
}

.sx-listing-event__logos {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 16px;
}

.sx-listing-event__logo img { max-height: 48px; width: auto; }

/* ── Performance schedule row ─────────────────────────────────────────────── */

.sx-listing-event__perfs {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.sx-perf {
	display: flex;
	flex-direction: column;
	border: 2px solid var( --sx-navy );
	border-radius: 24px;
	overflow: hidden;
	flex: 0 1 auto;
	background: #f0f2f8;
}

/* Single showtime — compact card */
.sx-perf--single {
	min-width: 140px;
	max-width: 200px;
}

/* Multiple showtimes — times side by side (Figma) */
.sx-perf--multi {
	min-width: 260px;
	max-width: 420px;
}

.sx-perf__date {
	padding: 12px 16px 10px;
	font-size: 1.125rem;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-align: left;
	text-transform: uppercase;
	color: var( --sx-navy );
	background: transparent;
}

/* Times + buttons in a horizontal row */
.sx-perf__slots {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: stretch;
	justify-content: center;
	gap: 0;
	padding: 4px 10px 14px;
}

.sx-perf__slot {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 8px;
	padding: 8px 14px 4px;
	min-width: 0;
}

.sx-perf--multi .sx-perf__slot + .sx-perf__slot {
	border-left: 1px solid #d4d9e8;
}

.sx-perf__time {
	font-size: 0.8125rem;
	font-weight: 700;
	text-align: center;
	color: #333;
}

.sx-listing .sx-perf__cta {
	display: inline-block;
	padding: 6px 14px;
	border-radius: 20px;
	font-size: 14px;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	background: var( --sx-accent );
	color: #fff;
	transition: opacity 0.15s;
}

.sx-listing .sx-perf__cta:focus-visible {
	outline: 2px solid var( --sx-navy );
	outline-offset: 2px;
}

.sx-listing .sx-perf__cta:hover {
	opacity: 0.88;
	background: var( --sx-accent );
	color: #fff;
}
.sx-perf__cta--off-sale { background: var( --sx-off-sale ); cursor: default; }

/* ── Grid view — compact cards (no overlapping labels) ─────────────────────── */

.sx-listing__results--grid .sx-listing__events {
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	gap: 28px;
	align-items: stretch;
}

@media ( max-width: 1024px ) {
	.sx-listing__results--grid .sx-listing__events {
		grid-template-columns: repeat( 2, 1fr );
	}
}

@media ( max-width: 640px ) {
	.sx-listing__results--grid .sx-listing__events {
		grid-template-columns: 1fr;
	}
}

.sx-listing__results--grid .sx-listing-event {
	display: grid;
	grid-template-areas:
		"media"
		"title"
		"info"
		"perfs";
	grid-template-rows: auto auto 1fr auto;
	min-width: 0;
	overflow: hidden;
	padding: 0;
	border: none;
	border-top: none;
	border-radius: 12px;
	box-shadow: 0 0 0 1px #dde0ec;
	border-top: 3px solid var( --sx-navy );
	height: 100%;
	background: #fff;
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.sx-listing__results--grid .sx-listing-event:hover {
	box-shadow: 0 6px 20px rgba( 22, 24, 134, 0.1 );
	transform: translateY( -2px );
}

.sx-listing__results--grid .sx-listing-event__header {
	grid-area: title;
	flex-direction: column;
	align-items: stretch;
	gap: 0;
	margin-bottom: 0;
	padding: 12px 16px 0;
	min-height: calc( 1rem * 1.3 * 2 + 12px );
	box-sizing: border-box;
}

.sx-listing__results--grid .sx-listing-event__header::after {
	display: none;
}

.sx-listing__results--grid .sx-listing-event__title {
	white-space: normal;
	overflow-wrap: break-word;
	word-break: break-word;
	hyphens: auto;
	font-size: 1rem;
	line-height: 1.3;
	width: 100%;
	min-width: 0;
	max-width: 100%;
}

/* Flatten body so image + copy stack in the card grid */
.sx-listing__results--grid .sx-listing-event__body {
	display: contents;
}

.sx-listing__results--grid .sx-listing-event__media {
	grid-area: media;
	min-width: 0;
	width: 100%;
	border-radius: 0;
}

.sx-listing__results--grid .sx-listing-event__media img,
.sx-listing__results--grid .sx-listing-event__no-image {
	aspect-ratio: 4 / 3;
	width: 100%;
}

.sx-listing__results--grid .sx-listing-event__badge {
	font-size: 0.75rem;
	padding: 8px 12px;
}

.sx-listing__results--grid .sx-listing-event__info {
	grid-area: info;
	display: flex;
	flex-direction: column;
	min-width: 0;
	width: 100%;
	min-height: 0;
	height: 100%;
	padding: 10px 16px 16px;
	box-sizing: border-box;
}

.sx-listing__results--grid .sx-listing-event__excerpt {
	flex: 1 1 auto;
	font-size: 0.875rem;
	line-height: 1.65;
	margin-bottom: 0;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	min-height: calc( 0.875rem * 1.65 * 3 );
}

.sx-listing__results--grid .sx-listing-event__excerpt p {
	display: inline;
	margin: 0;
}

.sx-listing__results--grid .sx-listing-event__excerpt p + p::before {
	content: ' ';
}

.sx-listing__results--grid .sx-listing-event__readmore,
.sx-listing__results--grid .sx-listing-event__category {
	display: block;
	overflow-wrap: break-word;
	flex-shrink: 0;
}

.sx-listing__results--grid .sx-listing-event__readmore {
	margin-top: auto;
	padding-top: 8px;
}

.sx-listing__results--grid .sx-listing-event__category {
	margin-top: 4px;
	margin-bottom: 0;
}

.sx-listing__results--grid .sx-listing-event__logo {
	margin-top: 8px;
	margin-bottom: 4px;
}

/* Grid view — scrollable time slots only (equal card heights) */
.sx-listing__results--grid .sx-listing-event__perfs--grid {
	grid-area: perfs;
	width: 100%;
	min-width: 0;
	padding: 16px 16px;
	margin-top: auto;
}

.sx-grid-times {
	list-style: none;
	margin: 0;
	padding: 0;
	max-height: 140px;
	overflow-x: hidden;
	border: 2px solid var( --sx-navy );
	border-radius: 16px;
	background: var( --sx-list-stripe );
	scrollbar-width: thin;
	scrollbar-color: var( --sx-navy ) transparent;
}

/* Scroll only when showtimes exceed the cap (avoids empty scroll tracks on load) */
.sx-grid-times:has( .sx-grid-times__row:nth-child( 4 ) ) {
	overflow-y: auto;
}

.sx-grid-times::-webkit-scrollbar {
	width: 5px;
}

.sx-grid-times::-webkit-scrollbar-thumb {
	background: rgba( 22, 24, 134, 0.3 );
	border-radius: 3px;
}

.sx-grid-times__row {
	display: grid;
	grid-template-columns: minmax( 0, 4.2em ) minmax( 0, 1fr ) auto;
	align-items: center;
	gap: 8px 10px;
	padding: 10px 12px;
	margin: 0;
	border-bottom: 1px solid #d4d9e8;
	min-width: 0;
}

.sx-grid-times__row:last-child {
	border-bottom: none;
}

.sx-grid-times__date {
	font-size: 0.6875rem;
	font-weight: 800;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var( --sx-navy );
	line-height: 1.2;
}

.sx-grid-times__time {
	font-size: 0.8125rem;
	font-weight: 700;
	color: #333;
	white-space: nowrap;
	min-width: 0;
}

.sx-grid-times__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 5px 10px;
	border-radius: 20px;
	font-size: 14px !important;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none !important;
	white-space: nowrap;
	background: var( --sx-accent );
	color: #fff !important;
	flex-shrink: 0;
	transition: opacity 0.15s;
}

.sx-grid-times__cta:hover {
	opacity: 0.88;
	color: #fff !important;
}

.sx-grid-times__cta--off-sale {
	background: var( --sx-off-sale );
	cursor: default;
}

/* ── Calendar view (TEC Pro month embed — minimal overrides) ──────────────── */

.sx-listing__results--calendar {
	padding-top: 8px;
}

.sx-listing__calendar {
	width: 100%;
}

.sx-listing__calendar .tribe-events {
	max-width: 100%;
}

.tribe-common--breakpoint-medium.tribe-common .tribe-common-l-container {
	padding-left: 0 !important;
	padding-right: 0 !important;
	padding-top: 0 !important;
}

/* ── Pagination ───────────────────────────────────────────────────────────── */

.sx-listing__pagination {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
	padding: 28px 0 28px;
}

/* Page numbers — plain text; active only gets a circle (Figma) */
.sx-page-btn {
	box-sizing: border-box;
	min-width: auto;
	height: auto;
	padding: 0 4px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: none;
	border-radius: 0;
	background: transparent;
	color: var( --sx-navy );
	font: inherit;
	font-size: 1rem;
	font-weight: 700;
	text-decoration: none;
	line-height: 1;
	cursor: pointer;
	transition: color 0.2s ease, opacity 0.2s ease;
}

.sx-page-btn:not( .sx-page-btn--arrow ):not( .is-active ):hover {
	color: var( --sx-accent );
}

.sx-page-btn:focus-visible {
	outline: 2px solid var( --sx-navy );
	outline-offset: 2px;
}

.sx-page-btn.is-active {
	min-width: 40px;
	width: 40px;
	height: 40px;
	padding: 0;
	border-radius: 50%;
	background: var( --sx-navy );
	color: #fff;
	cursor: default;
}

/* Thick chevron arrows (Figma) */
.sx-page-btn--arrow {
	min-width: 32px;
	width: 32px;
	height: 32px;
	padding: 0;
	border: none;
	background: transparent;
	border-radius: 0;
}

.sx-page-btn__chevron {
	display: block;
	width: 11px;
	height: 11px;
	border-right: 3px solid var( --sx-navy );
	border-bottom: 3px solid var( --sx-navy );
}

.sx-page-btn--prev .sx-page-btn__chevron {
	transform: rotate( 135deg );
	margin-left: 4px;
}

.sx-page-btn--next .sx-page-btn__chevron {
	transform: rotate( -45deg );
	margin-left: -2px;
}

.sx-page-btn--arrow[aria-disabled="true"] {
	opacity: 0.3;
	cursor: default;
	pointer-events: none;
}

.sx-page-btn--arrow[aria-disabled="true"] .sx-page-btn__chevron {
	border-color: #9aa3c4;
}

.sx-page-btn--arrow:not( [aria-disabled="true"] ):hover .sx-page-btn__chevron {
	border-color: var( --sx-accent );
}

/* ── Empty state ──────────────────────────────────────────────────────────── */

.sx-listing__empty { text-align: center; padding: 48px 20px; opacity: 0.6; }

/* ── Listing motion (scroll reveal + staged content) ─────────────────────── */

@media ( prefers-reduced-motion: no-preference ) {
	/* Only below-fold blocks get sx-reveal (hidden until scroll); see sx-public.js */
	.sx-listing--motion .sx-reveal {
		opacity: 0;
		transform: translateY( 36px );
		transition:
			opacity 0.55s cubic-bezier( 0.22, 1, 0.36, 1 ),
			transform 0.6s cubic-bezier( 0.22, 1, 0.36, 1 );
		transition-delay: var( --sx-reveal-delay, 0ms );
	}

	.sx-listing--motion .sx-reveal.is-inview {
		opacity: 1;
		transform: translateY( 0 );
	}

	/* Event cards: hidden pose matches sx-card-rise so scroll reveal feels continuous */
	.sx-listing--motion .sx-listing-event.sx-reveal {
		transform: translateY( 48px ) scale( 0.97 );
		transition: none;
	}

	/* Stagger when a below-fold block scrolls into view */
	.sx-listing--motion .sx-reveal.sx-filter:nth-child( 1 ) { --sx-reveal-delay: 0ms; }
	.sx-listing--motion .sx-reveal.sx-filter:nth-child( 2 ) { --sx-reveal-delay: 60ms; }
	.sx-listing--motion .sx-reveal.sx-filter:nth-child( 3 ) { --sx-reveal-delay: 120ms; }

	/* Filter / misc blocks — simple fade when revealed */
	.sx-listing--motion .sx-filter.is-inview,
	.sx-listing--motion .sx-filter__box-office.is-inview,
	.sx-listing--motion .sx-filter__page-switch.is-inview,
	.sx-listing--motion .sx-listing__pagination.is-inview,
	.sx-listing--motion .sx-listing__calendar.is-inview,
	.sx-listing--motion .sx-listing__empty.is-inview {
		animation: sx-fade-up 0.6s cubic-bezier( 0.22, 1, 0.36, 1 ) both;
	}

	/* Whole event card rises in on scroll (stagger via --sx-card-delay from JS) */
	.sx-listing--motion .sx-listing-event.sx-animate-in {
		animation: sx-card-rise 0.65s cubic-bezier( 0.22, 1, 0.36, 1 ) both;
		animation-delay: var( --sx-card-delay, 0ms );
	}

	/* Event cards — staged parts (sx-animate-in added by JS after is-inview) */
	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-listing-event__header {
		animation: sx-slide-in-left 0.6s cubic-bezier( 0.22, 1, 0.36, 1 ) 0.08s both;
	}

	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-listing-event__header::after {
		animation: sx-rule-grow 0.55s cubic-bezier( 0.22, 1, 0.36, 1 ) 0.16s both;
		transform-origin: left center;
	}

	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-listing-event__media {
		animation: sx-media-in 0.65s cubic-bezier( 0.22, 1, 0.36, 1 ) 0.12s both;
	}

	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-listing-event__badge {
		animation: sx-fade-up 0.55s cubic-bezier( 0.22, 1, 0.36, 1 ) 0.2s both;
	}

	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-listing-event__excerpt {
		animation: sx-fade-up 0.55s cubic-bezier( 0.22, 1, 0.36, 1 ) 0.14s both;
	}

	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-listing-event__readmore {
		animation: sx-fade-up 0.5s cubic-bezier( 0.22, 1, 0.36, 1 ) 0.2s both;
	}

	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-listing-event__category,
	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-listing-event__logo {
		animation: sx-fade-up 0.5s cubic-bezier( 0.22, 1, 0.36, 1 ) 0.22s both;
	}

	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-listing-event__perfs {
		animation: sx-fade-up 0.55s cubic-bezier( 0.22, 1, 0.36, 1 ) 0.16s both;
	}

	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-perf {
		animation: sx-scale-in 0.5s cubic-bezier( 0.22, 1, 0.36, 1 ) both;
	}

	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-perf:nth-child( 1 ) { animation-delay: 0.2s; }
	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-perf:nth-child( 2 ) { animation-delay: 0.28s; }
	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-perf:nth-child( 3 ) { animation-delay: 0.36s; }
	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-perf:nth-child( n + 4 ) { animation-delay: 0.44s; }

	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-grid-times {
		animation: sx-scale-in 0.5s cubic-bezier( 0.22, 1, 0.36, 1 ) 0.16s both;
	}

	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-grid-times__row {
		animation: sx-fade-up 0.45s cubic-bezier( 0.22, 1, 0.36, 1 ) both;
	}

	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-grid-times__row:nth-child( 1 ) { animation-delay: 0.22s; }
	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-grid-times__row:nth-child( 2 ) { animation-delay: 0.3s; }
	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-grid-times__row:nth-child( 3 ) { animation-delay: 0.38s; }
	.sx-listing--motion .sx-listing-event.sx-animate-in .sx-grid-times__row:nth-child( n + 4 ) { animation-delay: 0.46s; }

	.sx-listing--motion .sx-listing__results--grid .sx-listing-event.sx-animate-in .sx-listing-event__title {
		animation: sx-fade-up 0.55s cubic-bezier( 0.22, 1, 0.36, 1 ) 0.12s both;
	}

	.sx-listing--motion .sx-listing__results--grid .sx-listing-event.sx-animate-in .sx-listing-event__info {
		animation: sx-fade-up 0.55s cubic-bezier( 0.22, 1, 0.36, 1 ) 0.18s both;
	}

	/* CTAs — subtle hover */
	.sx-listing--motion .sx-perf__cta,
	.sx-listing--motion .sx-grid-times__cta {
		transition: transform 0.2s ease, opacity 0.2s ease, box-shadow 0.2s ease;
	}

	.sx-listing--motion .sx-perf__cta:hover,
	.sx-listing--motion .sx-grid-times__cta:hover {
		transform: translateY( -1px ) scale( 1.02 );
	}

	.sx-listing--motion .sx-page-btn:not( .is-active ):hover {
		transform: scale( 1.08 );
	}

	.sx-listing--motion .sx-listing-event__readmore {
		transition: letter-spacing 0.2s ease, opacity 0.2s ease;
	}

	.sx-listing--motion .sx-listing-event__readmore:hover {
		letter-spacing: 0.02em;
	}
}

@keyframes sx-fade-up {
	from {
		opacity: 0;
		transform: translateY( 28px );
	}
	to {
		opacity: 1;
		transform: translateY( 0 );
	}
}

@keyframes sx-card-rise {
	from {
		opacity: 0;
		transform: translateY( 48px ) scale( 0.97 );
	}
	to {
		opacity: 1;
		transform: translateY( 0 ) scale( 1 );
	}
}

@keyframes sx-slide-in-left {
	from {
		opacity: 0;
		transform: translateX( -40px );
	}
	to {
		opacity: 1;
		transform: translateX( 0 );
	}
}

@keyframes sx-media-in {
	from {
		opacity: 0;
		transform: scale( 1.08 );
	}
	to {
		opacity: 1;
		transform: scale( 1 );
	}
}

@keyframes sx-scale-in {
	from {
		opacity: 0;
		transform: scale( 0.88 );
	}
	to {
		opacity: 1;
		transform: scale( 1 );
	}
}

@keyframes sx-rule-grow {
	from {
		opacity: 0;
		transform: scaleX( 0 );
	}
	to {
		opacity: 1;
		transform: scaleX( 1 );
	}
}

/* ── Responsive ───────────────────────────────────────────────────────────── */

@media ( max-width: 640px ) {
	.sx-listing-event__body    { grid-template-columns: 1fr; }
	.sx-listing-event__media img,
	.sx-listing-event__no-image { height: 220px; }

	.sx-listing-event__header {
		flex-wrap: wrap;
		gap: 12px;
	}

	.sx-listing-event__title {
		white-space: normal;
		flex-shrink: 1;
		width: 100%;
	}

	.sx-listing-event__header::after {
		display: none;
	}

	.sx-listing__results--grid .sx-listing-event__title {
		white-space: normal;
		overflow-wrap: anywhere;
		word-break: break-word;
	}

	.sx-perf { min-width: 0; max-width: 100%; }

	.sx-grid-times__row {
		grid-template-columns: minmax( 0, 3.5em ) minmax( 0, 1fr );
	}

	.sx-grid-times__cta {
		grid-column: 1 / -1;
		justify-self: start;
	}
}

/* ═══════════════════════════════════════════════════════════════════════════
   [spektrix_merchandise] — Merch page (Figma)
   Override tokens on .sx-merchandise in your theme if needed.
   ═══════════════════════════════════════════════════════════════════════════ */

.sx-merchandise {
	--sx-merch-navy:          var( --sx-navy );
	--sx-merch-card-bg:       var( --sx-merch-card );
	--sx-merch-grid-bg:       #e6e6e6;
	--sx-merch-price-color:   var( --sx-navy );
	--sx-merch-btn-bg:        var( --sx-tan );
	--sx-merch-desc-color:    var( --sx-text );
	--sx-merch-btn-color:     var( --sx-white );
	--sx-merch-view-more-bg:  var( --sx-merch-btn-bg );
	--sx-merch-grid-max:      1200px;
	max-width: 100%;
}

/* ── Page intro ───────────────────────────────────────────────────────────── */

.sx-merchandise__intro {
	text-align: center;
	margin-bottom: 28px;
	padding: 0 16px;
}

.sx-merchandise__title {
	margin: 0 0 10px;
	font-size: 60px;
	font-weight: 900;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var( --sx-merch-navy );
	line-height: 1.1;
	overflow-wrap: break-word;
}

.sx-merchandise__subtitle {
	margin: 0;
	font-size: 18px;
	line-height: 1.5;
	color: #222;
	max-width: 42em;
	margin-left: auto;
	margin-right: auto;
}

/* ── Grid area (light gray band — products + View More) ───────────────────── */

.sx-merchandise__grid-wrap {
	display: block;
	position: relative;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	margin: 0;
	padding: 28px 24px 32px;
	border-radius: 0;
	margin-bottom: 0;
	background: var( --sx-merch-grid-bg );
}

.sx-merchandise__grid {
	list-style: none;
	margin: 0 auto;
	padding: 0;
	max-width: var( --sx-merch-grid-max );
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	gap: 24px;
}

@media ( max-width: 768px ) {
	.sx-merchandise__grid {
		grid-template-columns: repeat( 2, 1fr );
	}
}

@media ( max-width: 480px ) {
	.sx-merchandise__grid {
		grid-template-columns: 1fr;
	}
}

/* ── Card shell ───────────────────────────────────────────────────────────── */

.sx-merchandise .sx-merch-card {
	display: flex;
	flex-direction: column;
	border-radius: 10px;
	overflow: hidden;
	background: var( --sx-merch-card-bg );
	box-shadow: 0 1px 4px rgba( 0, 0, 0, 0.06 );
	min-width: 0;
}

.sx-merchandise .sx-merch-card--out-of-stock {
	opacity: 0.75;
}

.sx-merchandise .sx-merch-card--hidden {
	display: none !important;
}

/* ── Title header band (navy) ─────────────────────────────────────────────── */

.sx-merchandise .sx-merch-card__header {
	box-sizing: border-box;
	background: var( --sx-merch-navy );
	color: #fff;
	font-size: 24px;
	font-weight: 800;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	text-align: center;
	line-height: 1.25;
	padding: 14px 12px;
	height: calc( ( 24px * 1.25 * 3 ) + 28px ); /* 3 lines + 14px padding top/bottom */
	display: flex;
	align-items: center;
	justify-content: center;
	overflow-wrap: break-word;
}

.sx-merchandise .sx-merch-card__title {
	margin: 0;
	font: inherit;
	font-size: inherit;
	font-weight: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
	line-height: inherit;
	color: inherit;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

/* ── Image zone (navy padding around product photo) ───────────────────────── */

.sx-merchandise .sx-merch-card__image-zone {
	background: var( --sx-merch-navy );
	line-height: 0;
	padding: 0 12px 12px;
}

.sx-merchandise .sx-merch-card__image {
	display: block;
	width: 100%;
	height: 200px;
	object-fit: cover;
	border-radius: 2px;
}

.sx-merchandise .sx-merch-card__no-image {
	height: 200px;
	background: var( --sx-merch-navy );
	border-radius: 2px;
}

/* ── Body (tan / beige) ───────────────────────────────────────────────────── */

.sx-merchandise .sx-merch-card__body {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 18px 16px 22px;
	background: var( --sx-merch-card-bg );
}

.sx-merchandise .sx-merch-card__description {
	font-size: 18px;
	line-height: 1.55;
	color: var( --sx-merch-desc-color );
	margin: 0 0 auto;
	padding-bottom: 10px;
}

.sx-merchandise .sx-merch-card__price {
	font-size: 1.5rem;
	font-weight: 800;
	color: var( --sx-merch-price-color );
	margin: 14px 0 16px;
	line-height: 1.1;
}

.sx-merchandise .sx-merch-card__pp {
	display: block;
	font-size: 0.75rem;
	font-weight: 500;
	color: var( --sx-merch-desc-color );
	margin-top: 4px;
}

.sx-merchandise .sx-merch-card__image--gift-certificate {
	object-fit: contain;
	background: #fff;
}

.sx-merchandise .sx-merch-card__cta,
.sx-merchandise button.sx-merch-card__cta,
.sx-merchandise a.sx-merch-card__cta {
	display: inline-block;
	width: calc( 100% - 8px );
	max-width: 220px;
	padding: 12px 16px;
	border: none;
	border-radius: 8px;
	font-family: inherit;
	font-size: 20px;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-align: center;
	cursor: pointer;
	background: var( --sx-merch-btn-bg );
	background-image: none;
	color: var( --sx-merch-btn-color );
	appearance: none;
	-webkit-appearance: none;
	transition: opacity 0.15s;
	line-height: 1.2;
}

.sx-merchandise .sx-merch-card__cta--gift-certificate {
	max-width: 240px !important;
	white-space: normal;
}

.sx-merchandise .sx-merch-card__cta:hover:not(:disabled),
.sx-merchandise button.sx-merch-card__cta:hover:not(:disabled),
.sx-merchandise a.sx-merch-card__cta:hover {
	opacity: 0.9;
	background: var( --sx-merch-btn-bg );
	color: var( --sx-merch-btn-color );
}

.sx-merchandise .sx-merch-card__cta:focus-visible,
.sx-merchandise button.sx-merch-card__cta:focus-visible,
.sx-merchandise a.sx-merch-card__cta:focus-visible {
	outline: 2px solid var( --sx-merch-navy );
	outline-offset: 2px;
}

.sx-merchandise a.sx-merch-card__cta {
	text-decoration: none;
}

.sx-merchandise .sx-merch-card__cta:disabled {
	opacity: 0.5;
	cursor: wait;
}

.sx-merchandise .sx-merch-card__cta--out-of-stock {
	background: var( --sx-off-sale );
	cursor: default;
}

.sx-merchandise .sx-merch-card__feedback {
	font-size: 0.8125rem;
	margin-top: 10px;
	color: #333;
}

.sx-merchandise .sx-merch-card__feedback--success {
	color: var( --sx-merch-navy );
}

.sx-merchandise .sx-merch-card__feedback--error {
	color: var( --sx-error );
}

/* ── View More / Load more (inside gray band) ─────────────────────────────── */

.sx-merchandise__actions {
	display: block;
	text-align: center;
	margin: 28px auto 0;
	padding: 0 8px;
	max-width: var( --sx-merch-grid-max );
	background: transparent;
}

.sx-merchandise .sx-merchandise__view-more,
.sx-merchandise .sx-merchandise__load-more {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0 36px;
	border: none;
	border-radius: 8px;
	background: var( --sx-merch-view-more-bg );
	color: #fff;
	font-family: inherit;
	font-size: 20px;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	transition: opacity 0.15s, transform 0.2s ease, box-shadow 0.2s ease;
	-webkit-font-smoothing: antialiased;
}

.sx-merchandise .sx-merchandise__view-more:hover,
.sx-merchandise .sx-merchandise__view-more:focus-visible,
.sx-merchandise .sx-merchandise__load-more:hover,
.sx-merchandise .sx-merchandise__load-more:focus-visible {
	color: #fff;
	background: var( --sx-merch-view-more-bg );
	opacity: 0.92;
	outline: none;
}

.sx-merchandise__actions[hidden] {
	display: none;
}

/* ── Empty state ──────────────────────────────────────────────────────────── */

.sx-merchandise__empty {
	text-align: center;
	padding: 48px 20px;
	opacity: 0.6;
}

@media ( max-width: 768px ) {
	.sx-merchandise__title {
		font-size: clamp( 2rem, 8vw, 60px );
	}

	.sx-merchandise__grid-wrap {
		padding: 20px 16px 24px;
	}
}

/* ── Merchandise motion (scroll reveal + card stagger) ─────────────────────── */

@media ( prefers-reduced-motion: no-preference ) {
	.sx-merchandise--motion .sx-reveal {
		opacity: 0;
		transition: opacity 0.35s cubic-bezier( 0.22, 1, 0.36, 1 );
		transition-delay: var( --sx-reveal-delay, 0ms );
	}

	.sx-merchandise--motion .sx-reveal.is-inview {
		opacity: 1;
	}

	.sx-merchandise--motion .sx-merchandise__intro.sx-reveal.is-inview {
		animation: sx-fade-up 0.55s cubic-bezier( 0.22, 1, 0.36, 1 ) both;
	}

	.sx-merchandise--motion .sx-merchandise__intro .sx-merchandise__title {
		animation: sx-fade-up 0.5s cubic-bezier( 0.22, 1, 0.36, 1 ) 0.05s both;
	}

	.sx-merchandise--motion .sx-merchandise__intro .sx-merchandise__subtitle {
		animation: sx-fade-up 0.45s cubic-bezier( 0.22, 1, 0.36, 1 ) 0.12s both;
	}

	.sx-merchandise--motion .sx-merch-card.sx-reveal.is-inview,
	.sx-merchandise--motion .sx-merch-card.sx-animate-in {
		animation: sx-scale-in 0.45s cubic-bezier( 0.22, 1, 0.36, 1 ) both;
		animation-delay: var( --sx-card-delay, 0ms );
	}

	.sx-merchandise--motion .sx-merchandise__actions.sx-reveal.is-inview {
		animation: sx-fade-up 0.45s cubic-bezier( 0.22, 1, 0.36, 1 ) both;
	}

	.sx-merchandise--motion .sx-merch-card__cta,
	.sx-merchandise--motion .sx-merchandise__view-more,
	.sx-merchandise--motion .sx-merchandise__load-more {
		transition: transform 0.2s ease, opacity 0.2s ease, box-shadow 0.2s ease;
	}

	.sx-merchandise--motion .sx-merch-card__cta:hover:not(:disabled),
	.sx-merchandise--motion .sx-merchandise__view-more:hover,
	.sx-merchandise--motion .sx-merchandise__load-more:hover {
		transform: translateY( -2px );
		box-shadow: 0 4px 14px rgba( 0, 0, 0, 0.12 );
	}
}

/* ═══════════════════════════════════════════════════════════════════════════
   [spektrix_page_chrome] — event bar + breadcrumb (left) + cart (right)
   ═══════════════════════════════════════════════════════════════════════════ */

.sx-page-chrome-wrap {
	width: 100%;
}

.sx-page-chrome__event-bar {
	background: var( --sx-navy );
	color: var( --sx-white );
	text-align: center;
	padding: 16px 20px;
}

.sx-page-chrome__event-bar-inner {
	max-width: 1380px;
	margin: 0 auto;
}

.sx-page-chrome__event-title {
	margin: 0;
	font-size: clamp( 1.125rem, 2.4vw, 1.75rem );
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var( --sx-white ) !important;
}

.sx-page-chrome {
	--sx-content-max:    1380px;
	--sx-content-gutter: 16px;
	--sx-chrome-accent:  #484848;
	display: grid !important;
	grid-template-columns: minmax( 0, 1fr ) auto !important;
	grid-template-rows: auto !important;
	align-items: center !important;
	column-gap: 20px;
	row-gap: 0;
	width: 100%;
	max-width: var( --sx-content-max );
	margin-left: auto;
	margin-right: auto;
	padding: 16px;
	padding-top: 30px;
	padding-bottom: 40px;
	padding-left:  var( --sx-content-gutter );
	padding-right: var( --sx-content-gutter );
	box-sizing: border-box;
}

.sx-page-chrome > .sx-page-chrome__breadcrumb,
.sx-page-chrome > .sx-page-chrome__cart {
	display: flex !important;
	align-items: center !important;
	align-self: center !important;
	width: auto !important;
	max-width: none;
	margin: 0;
	padding: 0;
	float: none !important;
	clear: none !important;
}

.sx-page-chrome__breadcrumb {
	grid-column: 1;
	min-width: 0;
	overflow: hidden;
}

.sx-page-chrome .sx-page-chrome__trail {
	display: block;
	margin: 0;
	padding: 0 0 0.25em;
	max-width: 100%;
	font-size: 18px;
	line-height: 1.4;
	color: var( --sx-chrome-accent );
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.sx-page-chrome .sx-page-chrome__trail a,
.sx-page-chrome .sx-page-chrome__trail span {
	display: inline !important;
	float: none !important;
	width: auto !important;
	max-width: none;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
	white-space: nowrap;
}

.sx-page-chrome .sx-page-chrome__sep {
	margin-inline: 0.45em;
	opacity: 0.72;
	font-weight: 700;
}

.sx-page-chrome .sx-page-chrome__link {
	color: inherit;
	text-decoration: none;
	text-underline-offset: 0.15em;
}

.sx-page-chrome .sx-page-chrome__link:hover {
	color: var( --sx-red );
	text-decoration: underline;
	outline: none;
}

.sx-page-chrome .sx-page-chrome__link:focus-visible {
	color: var( --sx-red );
	text-decoration: underline;
	outline: 2px solid var( --sx-accent );
	outline-offset: 2px;
}

.sx-page-chrome .sx-page-chrome__current {
	color: inherit;
}

.sx-page-chrome__cart {
	grid-column: 2;
	justify-self: end;
	flex-shrink: 0;
	white-space: nowrap;
}

.sx-page-chrome__cart .sx-cart-icon-wrap {
	display: inline-flex !important;
	width: auto !important;
	max-width: none;
	justify-content: flex-end;
	align-items: center;
}

@media ( max-width: 640px ) {
	.sx-page-chrome {
		column-gap: 12px;
		padding: 14px 16px;
	}

	.sx-page-chrome .sx-page-chrome__trail {
		font-size: 18px;
	}

	.sx-page-chrome .sx-page-chrome__sep {
		margin-inline: 0.35em;
	}

	.sx-page-chrome__cart .sx-cart-icon {
		gap: 8px;
	}

	/* .sx-page-chrome__cart .sx-cart-icon__label,
	.sx-page-chrome__cart .sx-cart-icon__count {
		font-size: 15px;
	} */

	.sx-page-chrome__cart .sx-cart-icon__svg svg {
		width: 20px;
		height: 18px;
	}
}

/* ═══════════════════════════════════════════════════════════════════════════
   [spektrix_cart_icon] — Breadcrumb row cart link (Figma)
   Override --sx-cart-color on .sx-cart-icon-wrap in your theme if needed.
   ═══════════════════════════════════════════════════════════════════════════ */

.sx-cart-icon-wrap {
	--sx-cart-color: var( --sx-navy );
	display: flex;
	justify-content: flex-end;
	align-items: center;
	width: 100%;
}

.sx-cart-icon {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	box-sizing: border-box;
	border: none;
	border-radius: 0;
	background: transparent;
	background-image: none;
	box-shadow: none;
	color: var( --sx-cart-color ) !important;
	text-decoration: none;
	font-family: inherit;
	font-size: 0.8125rem;
	letter-spacing: 0.06em;
	line-height: 1;
	outline: none;
	transition: opacity 0.15s, color 0.15s;
	-webkit-font-smoothing: antialiased;
}

.sx-cart-icon:hover {
	border: none;
	background: transparent;
	background-image: none;
	box-shadow: none;
	color: var( --sx-cart-color ) !important;
	text-decoration: none;
	opacity: 0.85;
	outline: none;
}

.sx-cart-icon:focus-visible {
	color: var( --sx-cart-color ) !important;
	text-decoration: none;
	opacity: 0.85;
	outline: 2px solid var( --sx-accent );
	outline-offset: 2px;
}

.sx-cart-icon__svg {
	display: inline-flex;
	flex-shrink: 0;
	line-height: 0;
}

.sx-cart-icon__svg svg {
	display: block;
	width: 22px;
	height: 20px;
}

.sx-cart-icon__label {
	text-transform: uppercase;
	font-size: 18px;
}

.sx-cart-icon__count {
	font-size: 18px;
	min-width: 1ch;
}

/* ═══════════════════════════════════════════════════════════════════════════
   Booking seat-selection redesign
   ═══════════════════════════════════════════════════════════════════════════ */

.sx-booking-wrap--seat-selection {
	--sx-topbar-thumb-size: clamp( 88px, 14vw, 180px );
	--sx-topbar-select-width: clamp( 300px, 42vw, 380px );
	--sx-topbar-select-height: clamp( 58px, 8vw, 68px );
	--sx-topbar-inset: clamp( 12px, 6vw, 120px );
	--sx-topbar-gap: clamp( 16px, 3vw, 28px );
	max-width: 1380px;
	padding: 0 16px 48px;
	overflow-x: visible;
}

.sx-booking-wrap--seat-selection .sx-booking-loading,
.sx-booking-wrap--seat-selection .sx-booking-notice {
	font-size: 18px;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__charts {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 0;
	width: 100%;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__context,
.sx-booking-wrap--seat-selection .sx-seat-selection__payment-context {
	margin: 0 auto 22px;
	text-align: center;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__eyebrow {
	margin: 0 0 10px;
	font-size: 0.88rem;
	font-weight: 900;
	letter-spacing: 0.12em;
	color: var( --sx-navy );
	text-transform: uppercase;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__event-title {
	margin: 0;
	font-size: clamp( 1.9rem, 4vw, 3rem );
	line-height: 1.08;
	font-weight: 900;
	color: #1a1a1a;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__event-title--payment {
	font-size: clamp( 1.5rem, 3vw, 2.2rem );
}

.sx-booking-wrap--seat-selection .sx-seat-selection__payment-instance {
	margin: 10px 0 0;
	font-size: 18px;
	font-weight: 700;
	color: var( --sx-navy );
}

.sx-booking-wrap--seat-selection .sx-seat-selection__topbar {
	position: relative;
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	column-gap: var( --sx-topbar-gap );
	margin-bottom: 24px;
	min-height: var( --sx-topbar-thumb-size );
}

.sx-booking-wrap--seat-selection .sx-seat-selection__event-chip {
	grid-column: 1;
	justify-self: start;
	width: var( --sx-topbar-thumb-size );
	height: var( --sx-topbar-thumb-size );
	border-radius: 999px;
	overflow: hidden;
	background: #f2f2f2;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__event-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__event-placeholder {
	font-size: clamp( 1.5rem, 4vw, 2.5rem );
	font-weight: 700;
	color: var( --sx-navy );
}

.sx-booking-wrap--seat-selection .sx-seat-selection__instance-picker {
	grid-column: 2;
	display: flex;
	justify-content: center;
	justify-self: center;
	width: var( --sx-topbar-select-width );
	max-width: min( 100%, var( --sx-topbar-select-width ) );
}

.sx-booking-wrap--seat-selection .sx-seat-selection__select-wrap {
	position: relative;
	display: inline-flex;
	align-items: center;
	width: 100%;
	min-width: 0;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__select {
	width: 100%;
	height: var( --sx-topbar-select-height );
	padding: 0 clamp( 40px, 8vw, 52px ) 0 clamp( 12px, 2vw, 18px );
	border: none;
	border-radius: 0;
	background: var( --sx-navy );
	color: #fff;
	font: inherit;
	font-size: 20px;
	text-align: center;
	appearance: none;
	-webkit-appearance: none;
}

@media ( min-width: 1024px ) {
	.sx-booking-wrap--seat-selection .sx-seat-selection__topbar {
		display: flex;
		align-items: center;
		width: 100vw;
		max-width: 100vw;
		margin-left: calc( 50% - 50vw );
		margin-right: calc( 50% - 50vw );
		padding-left: var( --sx-topbar-inset );
		box-sizing: border-box;
	}

	.sx-booking-wrap--seat-selection .sx-seat-selection__instance-picker {
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate( -50%, -50% );
		grid-column: auto;
		max-width: min( var( --sx-topbar-select-width ), calc( 100vw - 32px ) );
	}
}

.sx-booking-wrap--seat-selection .sx-seat-selection__select-icon {
	position: absolute;
	right: clamp( 12px, 2vw, 18px );
	color: #fff;
	font-size: clamp( 0.8rem, 1.4vw, 0.95rem );
	pointer-events: none;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__hero {
	position: relative;
	min-height: 520px;
	margin-bottom: 28px;
	background:
		linear-gradient( rgba( 20, 24, 96, 0.1 ), rgba( 20, 24, 96, 0.1 ) ),
		var( --sx-overview-image ) center / cover no-repeat,
		linear-gradient( 180deg, #f6f2ea 0%, #efe7dc 100% );
	overflow: hidden;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__hero.is-placeholder {
	background:
		linear-gradient( 180deg, rgba( 22, 24, 134, 0.07 ) 0%, rgba( 22, 24, 134, 0.02 ) 100% ),
		linear-gradient( 180deg, #f8f8f8 0%, #f1f1f1 100% );
}

.sx-booking-wrap--seat-selection .sx-seat-selection__hero[hidden] {
	display: none !important;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__hero-overlay {
	position: absolute;
	inset: 0;
	padding: 32px;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__hero-label {
	position: absolute;
	left: 50%;
	transform: translateX( -50% );
	font-size: clamp( 2.5rem, 5vw, 4rem );
	font-weight: 900;
	line-height: 1;
	letter-spacing: 0.02em;
	color: #fff;
	text-transform: uppercase;
	text-shadow: 0 3px 14px rgba( 0, 0, 0, 0.28 );
}

.sx-booking-wrap--seat-selection .sx-seat-selection__hero-label--dynamic {
	transform: translate( -50%, -50% );
}

.sx-booking-wrap--seat-selection .sx-seat-selection__hero-label--balcony {
	top: 28%;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__hero-label--orchestra {
	top: 68%;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__hero-label--stack-1 {
	top: 34%;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__hero-label--stack-2 {
	top: 62%;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__hero-label--stack-3 {
	top: 80%;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__intro {
	max-width: 960px;
	margin: 0 auto 22px;
	text-align: center;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__intro-note {
	margin: 0 0 12px;
	font-size: 18px;
	line-height: 1.45;
	/* font-weight: 700; */
	color: #484848;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__intro-note--muted {
	max-width: 860px;
	margin: 0 auto;
	font-size: 18px;
	font-weight: 700;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__ticket-type {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 10px;
	width: 100%;
	max-width: 520px;
	margin: 0 auto 24px;
	padding: 0 4px;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__ticket-label {
	margin: 0;
	font-size: 0.88rem;
	font-weight: 900;
	letter-spacing: 0.12em;
	color: var( --sx-navy );
	text-transform: uppercase;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__select-wrap--ticket {
	width: 100%;
	min-width: 0;
	max-width: 420px;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__select--ticket {
	font-weight: 700;
}

.sx-booking-wrap--seat-selection .sx-seat-coordinate-layout {
	display: grid;
	grid-template-columns: minmax( 0, 1.06fr ) minmax( 0, 0.94fr );
	gap: 16px;
	align-items: start;
	justify-items: center;
	margin-bottom: 28px;
	min-width: 0;
	width: 100%;
}

.sx-booking-wrap--seat-selection .sx-seat-plan-group {
	display: grid;
	grid-template-rows: auto auto auto;
	justify-items: center;
	align-items: start;
	gap: 18px;
	min-width: 0;
	width: 100%;
}

.sx-booking-wrap--seat-selection .sx-seat-plan-group__title {
	margin-bottom: 2px;
}

.sx-booking-wrap--seat-selection .sx-seat-plan-canvas {
	position: relative;
	width: calc( var( --sx-plan-width, 800 ) * 1px );
	height: calc( var( --sx-plan-height, 600 ) * 1px );
	transform-origin: 0 0;
	border: 0;
	background: transparent;
	overflow: hidden;
}

.sx-booking-wrap--seat-selection .sx-seat-plan-canvas__image,
.sx-booking-wrap--seat-selection .sx-seat-plan-canvas__overlay {
	position: absolute;
	inset: 0;
}

.sx-booking-wrap--seat-selection .sx-seat-plan-canvas__image {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.sx-booking-wrap--seat-selection .sx-seat-plan-canvas__image svg text {
	paint-order: stroke;
	stroke: rgba( 255, 255, 255, 0.92 );
	stroke-width: 3px;
	stroke-linejoin: round;
}

.sx-booking-wrap--seat-selection .sx-seat-plan-canvas__overlay {
	z-index: 1;
}

.sx-booking-wrap--seat-selection .sx-panzoom-wrapper {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	min-width: 0;
	max-width: 100%;
}

.sx-booking-wrap--seat-selection .sx-panzoom-viewport {
	width: 100%;
	min-width: 0;
	max-width: 100%;
	overflow: hidden;
	cursor: grab;
	touch-action: none;
	height: 400px;
	min-height: 400px;
}

.sx-booking-wrap--seat-selection .sx-panzoom-viewport:active {
	cursor: grabbing;
}

.sx-booking-wrap--seat-selection .sx-panzoom-controls {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
	padding: 8px 0;
	align-items: center;
	width: 100%;
}

.sx-booking-wrap--seat-selection .sx-pz-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: 1px solid #d0d0d0;
	border-radius: 6px;
	background: #fff;
	color: #333;
	font-size: 16px;
	cursor: pointer;
	transition: background 0.15s, border-color 0.15s;
	touch-action: manipulation;
}

.sx-booking-wrap--seat-selection .sx-pz-btn:hover {
	background: #f0f0f0;
	border-color: #aaa;
}

.sx-booking-wrap--seat-selection .sx-pz-btn:active {
	background: #e0e0e0;
}

.sx-booking-wrap--seat-selection .sx-pz-btn--arrow.sx-pz-btn--left,
.sx-booking-wrap--seat-selection .sx-pz-btn--arrow.sx-pz-btn--right {
	font-size: 0;
	line-height: 0;
}

.sx-booking-wrap--seat-selection .sx-pz-btn--arrow.sx-pz-btn--left::before,
.sx-booking-wrap--seat-selection .sx-pz-btn--arrow.sx-pz-btn--right::before {
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-top: 6px solid transparent;
	border-bottom: 6px solid transparent;
}

.sx-booking-wrap--seat-selection .sx-pz-btn--arrow.sx-pz-btn--left::before {
	border-right: 8px solid currentColor;
	margin-left: -2px;
}

.sx-booking-wrap--seat-selection .sx-pz-btn--arrow.sx-pz-btn--right::before {
	border-left: 8px solid currentColor;
	margin-right: -2px;
}

@media ( min-width: 1024px ) {
	.sx-booking-wrap--seat-selection .sx-seat-coordinate-layout {
		align-items: stretch;
	}

	.sx-booking-wrap--seat-selection .sx-seat-plan-group {
		grid-template-rows: auto 1fr auto;
		height: 100%;
	}

	.sx-booking-wrap--seat-selection .sx-seat-plan-group .sx-seat-section__legend {
		justify-self: center;
		width: min( 100%, 430px );
		margin-top: 0;
		margin-inline: auto;
	}

	.sx-booking-wrap--seat-selection .sx-seat-plan-canvas {
		width: 100%;
		height: auto;
		aspect-ratio: var( --sx-plan-width, 1 ) / var( --sx-plan-height, 1 );
		transform-origin: center center;
	}

	.sx-booking-wrap--seat-selection .sx-seat-plan-canvas--orchestra {
		width: 100%;
		max-width: 100%;
		margin-top: 8px;
		margin-inline: auto;
	}

	.sx-booking-wrap--seat-selection .sx-panzoom-viewport {
		overflow: visible;
		cursor: default;
		touch-action: auto;
		height: auto;
		min-height: 0;
	}

	.sx-booking-wrap--seat-selection .sx-panzoom-controls {
		display: none;
	}
}

.sx-booking-wrap--seat-selection .sx-seat-plan-group .sx-seat-section__legend {
	width: min( 100%, 430px );
	margin-top: auto;
	margin-inline: auto;
	justify-self: center;
}

.sx-booking-wrap--seat-selection .sx-seat.sx-seat--coordinate {
	position: absolute;
	transform: translate( -50%, -50% );
	width: 16px;
	height: 16px;
	min-width: 16px;
	min-height: 16px;
	touch-action: manipulation;
}

.sx-booking-wrap--seat-selection .sx-seat-plan-legend {
	max-width: 520px;
	margin: 0 auto 32px;
	padding: 18px 20px;
	border: 1px solid #c2c2c2;
	background: #fff;
}

.sx-booking-wrap--seat-selection .sx-seat-plan-legend__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.sx-booking-wrap--seat-selection .sx-seat-plan-legend__item {
	display: grid;
	grid-template-columns: 18px minmax( 0, 1fr ) auto;
	gap: 12px;
	align-items: center;
}

.sx-booking-wrap--seat-selection .sx-seat-plan-legend__swatch {
	width: 18px;
	height: 18px;
	border-radius: 999px;
}

.sx-booking-wrap--seat-selection .sx-seat-plan-legend__name {
	font-size: 18px;
	font-weight: 700;
	text-transform: uppercase;
}

.sx-booking-wrap--seat-selection .sx-seat-plan-legend__price {
	font-size: 18px;
	font-weight: 700;
	white-space: nowrap;
}

.sx-booking-wrap--seat-selection .sx-seat-plan-legend__item--unavailable {
	margin-top: 8px;
}

.sx-booking-wrap--seat-selection .sx-seat-plan-legend__bar {
	display: block;
	width: 18px;
	height: 6px;
	border-radius: 2px;
	background: #dedede;
	align-self: center;
}

.sx-booking-wrap--seat-selection .sx-seat-plan-legend__item--unavailable .sx-seat-plan-legend__name {
	color: #767676;
	font-weight: 800;
	text-transform: uppercase;
}

.sx-booking-wrap--seat-selection .sx-seat-plan-legend__item--unavailable .sx-seat-plan-legend__price {
	display: block;
	min-width: 0;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__section-grid {
	display: grid;
	grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	gap: 40px;
	align-items: start;
	justify-items: center;
	margin-bottom: 32px;
	width: 100%;
}

.sx-booking-wrap--seat-selection .sx-seat-section {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 18px;
}

.sx-booking-wrap--seat-selection .sx-seat-section__title {
	margin: 0;
	font-size: clamp( 2rem, 4vw, 3.5rem );
	line-height: 1;
	font-weight: 900;
	letter-spacing: 0.04em;
	color: var( --sx-navy );
	text-transform: uppercase;
	text-align: center;
}

.sx-booking-wrap--seat-selection .sx-seat-section__areas {
	min-height: 22px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px 10px;
}

.sx-booking-wrap--seat-selection .sx-seat-section__area-pill {
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	color: #666;
	text-transform: uppercase;
	text-align: center;
}

.sx-booking-wrap--seat-selection .sx-seat-section__stage {
	width: min(100%, 240px);
	padding: 12px 18px;
	background: var( --sx-navy );
	color: #fff;
	font-weight: 800;
	font-size: 1.1rem;
	letter-spacing: 0.04em;
	text-align: center;
	text-transform: uppercase;
}

.sx-booking-wrap--seat-selection .sx-seat-area-layout {
	width: 100%;
	display: grid;
	gap: 22px 18px;
	align-items: start;
}

.sx-booking-wrap--seat-selection .sx-seat-area-layout--orchestra {
	grid-template-columns: repeat( 3, minmax( 0, 1fr ) );
}

.sx-booking-wrap--seat-selection .sx-seat-area-layout--balcony {
	grid-template-columns: repeat( 3, minmax( 0, 1fr ) );
}

.sx-booking-wrap--seat-selection .sx-seat-area {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
}

.sx-booking-wrap--seat-selection .sx-seat-area__label {
	margin: 0;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	color: #666;
	text-transform: uppercase;
	text-align: center;
}

.sx-booking-wrap--seat-selection .sx-seat-area__map {
	width: 100%;
}

.sx-booking-wrap--seat-selection .sx-seat-area--compact {
	max-width: 120px;
	justify-self: center;
}

.sx-booking-wrap--seat-selection .sx-seat-area--orchestra-left {
	grid-column: 1;
}

.sx-booking-wrap--seat-selection .sx-seat-area--orchestra-center {
	grid-column: 2;
}

.sx-booking-wrap--seat-selection .sx-seat-area--orchestra-right {
	grid-column: 3;
}

.sx-booking-wrap--seat-selection .sx-seat-area--balcony-wing-left {
	grid-column: 1;
	grid-row: 1;
}

.sx-booking-wrap--seat-selection .sx-seat-area--balcony-wing-right {
	grid-column: 3;
	grid-row: 1;
}

.sx-booking-wrap--seat-selection .sx-seat-area--balcony-lower-left {
	grid-column: 1;
	grid-row: 2;
}

.sx-booking-wrap--seat-selection .sx-seat-area--balcony-lower-center {
	grid-column: 2;
	grid-row: 2;
}

.sx-booking-wrap--seat-selection .sx-seat-area--balcony-lower-right {
	grid-column: 3;
	grid-row: 2;
}

.sx-booking-wrap--seat-selection .sx-seat-area--balcony-upper-left {
	grid-column: 1;
	grid-row: 3;
}

.sx-booking-wrap--seat-selection .sx-seat-area--balcony-upper-center {
	grid-column: 2;
	grid-row: 3;
}

.sx-booking-wrap--seat-selection .sx-seat-area--balcony-upper-right {
	grid-column: 3;
	grid-row: 3;
}

.sx-booking-wrap--seat-selection .sx-seat-map {
	width: 100%;
	display: grid;
	grid-auto-rows: minmax( 14px, auto );
	gap: 6px 8px;
	align-items: center;
	justify-items: center;
}

.sx-booking-wrap--seat-selection .sx-seat-map__row-label {
	align-self: center;
	justify-self: start;
	font-size: 0.72rem;
	font-weight: 700;
	color: #666;
	text-transform: uppercase;
}

.sx-booking-wrap--seat-selection .sx-seat {
	width: 14px;
	height: 14px;
	padding: 0;
	border-radius: 999px;
	border: 1px solid transparent;
	background: var( --sx-seat-color, #d9d9d9 );
	color: transparent;
	cursor: default;
	box-shadow: none;
	position: relative;
}

.sx-booking-wrap--seat-selection .sx-seat--available,
.sx-booking-wrap--seat-selection .sx-seat--accessible,
.sx-booking-wrap--seat-selection .sx-seat--locked {
	cursor: pointer;
}

.sx-booking-wrap--seat-selection .sx-seat--available:hover,
.sx-booking-wrap--seat-selection .sx-seat--accessible:hover,
.sx-booking-wrap--seat-selection .sx-seat--locked:hover {
	border-color: var( --sx-navy );
	outline: 2px solid var( --sx-navy );
	outline-offset: 2px;
}

.sx-booking-wrap--seat-selection .sx-seat.is-selected,
.sx-booking-wrap--seat-selection .sx-seat.sx-seat--coordinate.is-selected,
.sx-booking-wrap--seat-selection .sx-seat--available.is-selected,
.sx-booking-wrap--seat-selection .sx-seat--accessible.is-selected,
.sx-booking-wrap--seat-selection .sx-seat--locked.is-selected,
.sx-booking-wrap--seat-selection .sx-seat--in-basket.is-selected {
	background: var( --sx-seat-color, #d9d9d9 );
	border-color: var( --sx-navy );
	outline: 2px solid var( --sx-navy );
	outline-offset: 1px;
	cursor: pointer;
	overflow: visible;
	z-index: 2;
}

.sx-booking-wrap--seat-selection .sx-seat.is-selected::after {
	content: "🎟";
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 10px;
	line-height: 1;
	color: #111;
	pointer-events: none;
}

.sx-booking-wrap--seat-selection .sx-seat.sx-seat--coordinate.is-selected::after {
	font-size: 11px;
}

.sx-booking-wrap--seat-selection .sx-seat--in-basket:not( .is-selected ),
.sx-booking-wrap--seat-selection .sx-seat--unavailable:not( .is-selected ) {
	background: #dedede;
}

.sx-booking-wrap--seat-selection .sx-seat--locked {
	background:
		linear-gradient( 135deg, rgba( 22, 24, 134, 0.16 ) 25%, transparent 25%, transparent 50%, rgba( 22, 24, 134, 0.16 ) 50%, rgba( 22, 24, 134, 0.16 ) 75%, transparent 75%, transparent 100% ),
		var( --sx-seat-color, #d9d9d9 );
	background-size: 6px 6px;
}

.sx-booking-wrap--seat-selection .sx-seat--locked.is-selected {
	background: var( --sx-seat-color, #d9d9d9 );
	background-size: auto;
}

.sx-booking-wrap--seat-selection .sx-seat--accessible {
	border-color: #20b314;
}

.sx-booking-wrap--seat-selection .sx-seat--accessible::after,
.sx-booking-wrap--seat-selection .sx-seat--info::after,
.sx-booking-wrap--seat-selection .sx-seat--info-companion::after {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 900;
	line-height: 1;
	color: inherit;
	pointer-events: none;
}

.sx-booking-wrap--seat-selection .sx-seat--accessible:not( .is-selected )::after {
	content: "♿";
	font-size: 9px;
	color: #0f4f1f;
}

.sx-booking-wrap--seat-selection .sx-seat--info:not( .is-selected )::after {
	content: "𝓲";
	font-size: 10px;
	color: #fff;
	text-shadow: 0 0 2px rgba( 0, 0, 0, 0.65 );
}

.sx-booking-wrap--seat-selection .sx-seat--info-companion:not( .is-selected )::after {
	content: "Ｃ";
	font-size: 9px;
	color: #fff;
	text-shadow: 0 0 2px rgba( 0, 0, 0, 0.65 );
}

.sx-booking-wrap--seat-selection .sx-seat-section__legend {
	width: min(100%, 360px);
	margin-inline: auto;
	padding: 18px 20px;
	border: 1px solid #c2c2c2;
	background: #fff;
}

.sx-booking-wrap--seat-selection .sx-seat-section__legend-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__select:focus-visible,
.sx-booking-wrap--seat-selection .sx-seat-selection__select--ticket:focus-visible {
	outline: 2px solid var( --sx-navy );
	outline-offset: 2px;
}

.sx-booking-wrap--seat-selection .sx-pz-btn:focus-visible {
	outline: 2px solid var( --sx-navy );
	outline-offset: 2px;
	border-color: var( --sx-navy );
}

.sx-booking-wrap--seat-selection .sx-seat-selection__back:focus-visible {
	outline: 2px solid var( --sx-navy );
	outline-offset: 2px;
}

.sx-booking-wrap--seat-selection .sx-ga-card__input:focus-visible {
	outline: 2px solid var( --sx-navy );
	outline-offset: 2px;
	border-color: var( --sx-navy );
}

.sx-booking-wrap--seat-selection .sx-seat-section__legend-item {
	display: grid;
	grid-template-columns: 18px minmax( 0, 1fr ) auto;
	gap: 12px;
	align-items: center;
	font-size: 18px;
	line-height: 1.35;
	font-weight: 700;
}

.sx-booking-wrap--seat-selection .sx-seat-section__legend-swatch {
	width: 18px;
	height: 18px;
	border-radius: 999px;
	flex-shrink: 0;
}

.sx-booking-wrap--seat-selection .sx-seat-section__legend-name {
	color: #1a1a1a;
	text-transform: uppercase;
}

.sx-booking-wrap--seat-selection .sx-seat-section__legend-price {
	color: #333;
	font-weight: 700;
	white-space: nowrap;
}

.sx-booking-wrap--seat-selection .sx-seat-section__legend-item--unavailable {
	margin-top: 8px;
}

.sx-booking-wrap--seat-selection .sx-seat-section__legend-bar {
	display: block;
	width: 18px;
	height: 18px;
	border-radius: 999px;
	background: #dedede;
	align-self: center;
}

.sx-booking-wrap--seat-selection .sx-seat-section__legend-item--unavailable .sx-seat-section__legend-name {
	color: #767676;
	font-weight: 800;
	text-transform: uppercase;
}

.sx-booking-wrap--seat-selection .sx-seat-section__legend-item--unavailable .sx-seat-section__legend-price {
	display: block;
	min-width: 0;
}

.sx-booking-wrap--seat-selection .sx-ga-card {
	max-width: 420px;
	margin: 0 auto;
	padding: 30px 24px;
	border: 1px solid #d7d7d7;
	text-align: center;
}

.sx-booking-wrap--seat-selection .sx-ga-card__title {
	margin: 0 0 12px;
	font-size: 2rem;
	font-weight: 900;
	color: var( --sx-navy );
	text-transform: uppercase;
}

.sx-booking-wrap--seat-selection .sx-ga-card__availability {
	margin: 0 0 18px;
	font-size: 18px;
	font-weight: 700;
}

.sx-booking-wrap--seat-selection .sx-ga-card__controls {
	display: inline-flex;
	align-items: center;
	gap: 12px;
}

.sx-booking-wrap--seat-selection .sx-ga-card__stepper,
.sx-booking-wrap--seat-selection button.sx-ga-card__stepper {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: none;
	background: var( --sx-navy );
	background-image: none;
	color: #fff;
	font: inherit;
	font-size: 1.6rem;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	flex-shrink: 0;
}

.sx-booking-wrap--seat-selection .sx-ga-card__stepper:hover:not( :disabled ),
.sx-booking-wrap--seat-selection .sx-ga-card__stepper:focus-visible:not( :disabled ),
.sx-booking-wrap--seat-selection button.sx-ga-card__stepper:hover:not( :disabled ),
.sx-booking-wrap--seat-selection button.sx-ga-card__stepper:focus-visible:not( :disabled ) {
	background: #1a1f78;
	color: #fff;
	text-decoration: none;
}

.sx-booking-wrap--seat-selection .sx-ga-card__stepper:disabled,
.sx-booking-wrap--seat-selection button.sx-ga-card__stepper:disabled {
	opacity: 0.45;
	cursor: not-allowed;
	background: var( --sx-navy );
	color: #fff;
}

.sx-booking-wrap--seat-selection .sx-ga-card__stepper--minus {
	padding-bottom: 2px;
}

.sx-booking-wrap--seat-selection .sx-ga-card__input {
	width: 72px;
	height: 44px;
	border: 1px solid #c7c7c7;
	text-align: center;
	font: inherit;
	font-size: 1rem;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__selection-summary {
	margin: 0 0 28px;
	text-align: center;
	font-size: 18px;
	font-weight: 700;
	color: var( --sx-navy );
}

.sx-booking-wrap--seat-selection .sx-seat-selection__checkout-notes {
	max-width: 620px;
	margin: 0 auto 28px;
	text-align: center;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__fees-intro,
.sx-booking-wrap--seat-selection .sx-seat-selection__delivery-label,
.sx-booking-wrap--seat-selection .sx-seat-selection__sales-note {
	margin: 0 0 10px;
	font-size: 18px;
	line-height: 1.35;
	font-weight: 700;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__delivery-list {
	list-style: disc;
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
	margin: 0 0 14px;
	padding-left: 22px;
	text-align: left;
	font-size: 18px;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__debug {
	max-width: 960px;
	margin: 0 auto 32px;
	padding: 18px 20px;
	border: 1px solid #d7d7d7;
	background: #fafafa;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__debug summary {
	cursor: pointer;
	font-weight: 800;
	color: var( --sx-navy );
}

.sx-booking-wrap--seat-selection .sx-seat-selection__debug-note {
	margin: 14px 0;
	font-size: 18px;
	line-height: 1.4;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__debug-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 10px 16px;
	margin-right: 10px;
	border: 1px solid var( --sx-navy );
	background: #fff;
	color: var( --sx-navy );
	font: inherit;
	font-weight: 700;
	cursor: pointer;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__debug-button--secondary {
	border-color: #7b7b7b;
	color: #333;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__debug-button:disabled {
	opacity: 0.55;
	cursor: default;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__debug-output {
	display: grid;
	gap: 16px;
	margin-top: 16px;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__debug-block {
	padding: 16px;
	border: 1px solid #dfdfdf;
	background: #fff;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__debug-title {
	margin: 0 0 10px;
	font-size: 1rem;
	font-weight: 800;
	color: var( --sx-navy );
}

.sx-booking-wrap--seat-selection .sx-seat-selection__debug-pre {
	margin: 0;
	overflow-x: auto;
	white-space: pre-wrap;
	word-break: break-word;
	font-size: 0.82rem;
	line-height: 1.45;
	font-family: SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__footer {
	display: flex;
	justify-content: center;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__continue {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 178px;
	min-height: 56px;
	padding: 0 34px;
	border: none;
	border-radius: 18px;
	background: var( --sx-navy );
	background-image: none;
	color: #fff;
	font-family: "Roboto Condensed", sans-serif;
	font-size: 1.8rem;
	font-weight: 900;
	letter-spacing: 0.04em;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	appearance: none;
	-webkit-appearance: none;
	-webkit-font-smoothing: antialiased;
	transition: background 0.2s ease, color 0.2s ease, opacity 0.2s ease;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__continue:hover:not( :disabled ),
.sx-booking-wrap--seat-selection .sx-seat-selection__continue:focus-visible:not( :disabled ) {
	background: var( --sx-navy );
	background-image: none;
	color: #fff;
	opacity: 0.92;
	text-decoration: none;
	outline: 2px solid var( --sx-accent );
	outline-offset: 2px;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__continue:disabled,
.sx-booking-wrap--seat-selection .sx-seat-selection__continue:disabled:hover {
	background: var( --sx-navy );
	background-image: none;
	color: #fff;
	opacity: 0.45;
	cursor: not-allowed;
	border: none;
	outline: none;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__payment-header {
	display: flex;
	flex-direction: column;
	gap: 24px;
	margin-bottom: 24px;
}

.sx-booking-wrap--seat-selection .sx-seat-selection__back {
	align-self: flex-start;
	padding: 0;
	border: none;
	background: transparent;
	color: var( --sx-navy );
	font: inherit;
	font-weight: 700;
	cursor: pointer;
}

.sx-booking-wrap--seat-selection .sx-payment-summary {
	padding: 24px;
	border: 1px solid #e2e2e2;
	background: #fff;
}

.sx-booking-wrap--seat-selection .sx-payment-summary__title {
	margin: 0 0 18px;
	font-size: 1.5rem;
	font-weight: 900;
	color: var( --sx-navy );
}

.sx-booking-wrap--seat-selection .sx-payment-summary__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.sx-booking-wrap--seat-selection .sx-payment-summary__item {
	display: grid;
	grid-template-columns: minmax( 0, 1fr ) auto auto;
	gap: 14px;
	align-items: center;
	padding-bottom: 12px;
	border-bottom: 1px solid #ececec;
	font-size: 18px;
}

.sx-booking-wrap--seat-selection .sx-payment-summary__item-seat {
	color: #666;
	font-size: 18px;
}

.sx-booking-wrap--seat-selection .sx-payment-summary__item-price {
	font-weight: 700;
}

.sx-booking-wrap--seat-selection .sx-payment-summary__total {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 18px;
	font-size: 18px;
}

@media ( max-width: 1023px ) and ( min-width: 641px ) {
	.sx-booking-wrap--seat-selection .sx-seat-plan-group .sx-seat-section__legend,
	.sx-booking-wrap--seat-selection .sx-seat-section__legend {
		margin-inline: auto;
		justify-self: center;
	}
}

@media ( max-width: 900px ) {
	.sx-booking-wrap--seat-selection .sx-seat-coordinate-layout {
		grid-template-columns: 1fr;
	}

	.sx-booking-wrap--seat-selection .sx-seat-selection__section-grid {
		grid-template-columns: 1fr;
	}

	.sx-booking-wrap--seat-selection .sx-seat-selection__select-wrap--ticket {
		max-width: none;
	}

	.sx-booking-wrap--seat-selection .sx-seat-selection__hero {
		min-height: 360px;
	}

	.sx-booking-wrap--seat-selection .sx-seat-selection__hero-overlay {
		padding: 24px;
	}

	.sx-booking-wrap--seat-selection .sx-seat-area-layout--orchestra,
	.sx-booking-wrap--seat-selection .sx-seat-area-layout--balcony {
		grid-template-columns: repeat( 3, minmax( 0, 1fr ) );
	}
}

@media ( max-width: 640px ) {
	.sx-booking-wrap--seat-selection {
		--sx-topbar-thumb-size: clamp( 80px, 22vw, 96px );
		--sx-topbar-select-width: 100%;
		--sx-topbar-select-height: 58px;
		padding: 0 12px max( 36px, env( safe-area-inset-bottom ) );
	}

	.sx-booking-wrap--seat-selection .sx-seat-selection__topbar {
		grid-template-columns: 1fr;
		row-gap: 18px;
	}

	.sx-booking-wrap--seat-selection .sx-seat-selection__event-chip {
		grid-column: 1;
		justify-self: center;
	}

	.sx-booking-wrap--seat-selection .sx-seat-selection__instance-picker {
		grid-column: 1;
		justify-self: stretch;
		width: 100%;
	}

	.sx-booking-wrap--seat-selection .sx-seat-selection__select-wrap {
		width: 100%;
	}

	.sx-booking-wrap--seat-selection .sx-seat-selection__select-wrap--ticket {
		max-width: none;
	}

	.sx-booking-wrap--seat-selection .sx-seat-selection__ticket-type {
		max-width: none;
		margin-bottom: 20px;
	}

	.sx-booking-wrap--seat-selection .sx-seat-selection__hero {
		min-height: 280px;
		margin-left: -12px;
		margin-right: -12px;
		width: calc( 100% + 24px );
	}

	.sx-booking-wrap--seat-selection .sx-seat-selection__hero-label {
		font-size: clamp( 2rem, 9vw, 2.8rem );
	}

	.sx-booking-wrap--seat-selection .sx-seat-selection__hero-label--balcony {
		top: 24%;
	}

	.sx-booking-wrap--seat-selection .sx-seat-selection__hero-label--orchestra {
		top: 66%;
	}

	.sx-booking-wrap--seat-selection .sx-seat-section__title {
		font-size: 2.2rem;
	}

	.sx-booking-wrap--seat-selection .sx-seat-area-layout--orchestra,
	.sx-booking-wrap--seat-selection .sx-seat-area-layout--balcony {
		grid-template-columns: 1fr;
	}

	.sx-booking-wrap--seat-selection .sx-seat-area--orchestra-left,
	.sx-booking-wrap--seat-selection .sx-seat-area--orchestra-center,
	.sx-booking-wrap--seat-selection .sx-seat-area--orchestra-right,
	.sx-booking-wrap--seat-selection .sx-seat-area--balcony-wing-left,
	.sx-booking-wrap--seat-selection .sx-seat-area--balcony-wing-right,
	.sx-booking-wrap--seat-selection .sx-seat-area--balcony-lower-left,
	.sx-booking-wrap--seat-selection .sx-seat-area--balcony-lower-center,
	.sx-booking-wrap--seat-selection .sx-seat-area--balcony-lower-right,
	.sx-booking-wrap--seat-selection .sx-seat-area--balcony-upper-left,
	.sx-booking-wrap--seat-selection .sx-seat-area--balcony-upper-center,
	.sx-booking-wrap--seat-selection .sx-seat-area--balcony-upper-right {
		grid-column: auto;
		grid-row: auto;
	}

	.sx-booking-wrap--seat-selection .sx-seat-section__stage {
		width: 100%;
	}

	.sx-booking-wrap--seat-selection .sx-seat {
		width: 18px;
		height: 18px;
		min-width: 18px;
		min-height: 18px;
	}

	.sx-booking-wrap--seat-selection .sx-seat.sx-seat--coordinate {
		width: 22px;
		height: 22px;
		min-width: 22px;
		min-height: 22px;
	}

	.sx-booking-wrap--seat-selection .sx-seat.is-selected::after,
	.sx-booking-wrap--seat-selection .sx-seat.sx-seat--coordinate.is-selected::after {
		font-size: 12px;
	}

	.sx-booking-wrap--seat-selection .sx-seat-coordinate-layout {
		gap: 28px;
	}

	.sx-booking-wrap--seat-selection .sx-seat-section__legend,
	.sx-booking-wrap--seat-selection .sx-seat-plan-legend {
		width: 100%;
		padding: 16px;
	}

	.sx-booking-wrap--seat-selection .sx-seat-selection__continue {
		width: 100%;
		max-width: 320px;
		min-height: 52px;
		font-size: 1.35rem;
		justify-content: center;
		text-align: center;
	}

	.sx-booking-wrap--seat-selection .sx-seat-selection__footer {
		position: sticky;
		bottom: 0;
		z-index: 5;
		padding: 12px 0 max( 8px, env( safe-area-inset-bottom ) );
		background: linear-gradient( 180deg, rgba( 255, 255, 255, 0 ) 0%, #fff 28% );
	}

	.sx-booking-wrap--seat-selection .sx-ga-card {
		width: 100%;
		max-width: none;
		padding: 24px 16px;
	}

	.sx-booking-wrap--seat-selection .sx-ga-card__stepper {
		width: 48px;
		height: 48px;
	}

	.sx-booking-wrap--seat-selection .sx-ga-card__input {
		width: 80px;
		height: 48px;
		font-size: 1.05rem;
	}

	.sx-booking-wrap--seat-selection .sx-payment-summary__item {
		grid-template-columns: minmax( 0, 1fr ) auto;
	}

	.sx-booking-wrap--seat-selection .sx-payment-summary__item-seat {
		grid-column: 1 / -1;
	}
}

/* ═══════════════════════════════════════════════════════════════════════════
   Gift voucher form
   ═══════════════════════════════════════════════════════════════════════════ */

.sx-gift-voucher {
	--sx-gv-navy: var( --sx-navy );
	--sx-gv-btn-bg: var( --sx-tan );
	max-width: 640px;
	margin: 0 auto;
	padding: 0 16px 48px;
}

.sx-gift-voucher__title {
	margin: 0 0 12px;
	font-size: clamp( 1.75rem, 4vw, 2.25rem );
	font-weight: 900;
	color: var( --sx-gv-navy );
	text-transform: uppercase;
}

.sx-gift-voucher__description {
	margin: 0 0 28px;
	font-size: 1.05rem;
	line-height: 1.5;
}

.sx-gift-voucher__form {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.sx-gift-voucher__field {
	display: flex;
	flex-direction: column;
	gap: 8px;
	border: none;
	margin: 0;
	padding: 0;
}

.sx-gift-voucher__field[hidden],
.sx-gift-voucher__email-wrap[hidden] {
	display: none !important;
}

.sx-gift-voucher__label {
	font-size: 0.85rem;
	font-weight: 800;
	letter-spacing: 0.06em;
	color: var( --sx-gv-navy );
	text-transform: uppercase;
}

.sx-gift-voucher__input,
.sx-gift-voucher__select,
.sx-gift-voucher__textarea {
	width: 100%;
	padding: 12px 14px;
	border: 1px solid #c7c7c7;
	border-radius: 4px;
	font: inherit;
	font-size: 1rem;
	background: #fff;
	transition: border-color 0.15s, box-shadow 0.15s;
}

.sx-gift-voucher__select {
	cursor: pointer;
	padding-right: 40px;
	color: #222;
	appearance: none;
	-webkit-appearance: none;
	background-color: #fff;
	background-image: url( "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%231f2391' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E" );
	background-repeat: no-repeat;
	background-position: right 14px center;
}

.sx-gift-voucher__select:hover {
	border-color: var( --sx-gv-navy );
}

.sx-gift-voucher__select:focus-visible {
	border-color: var( --sx-gv-navy );
	outline: 2px solid var( --sx-gv-navy );
	outline-offset: 2px;
}

.sx-gift-voucher__select option {
	color: #222;
	background: #fff;
}

.sx-gift-voucher__textarea {
	resize: vertical;
	min-height: 96px;
}

.sx-gift-voucher__field-error {
	font-size: 0.8125rem;
	color: var( --sx-error );
}

.sx-gift-voucher__field--error .sx-gift-voucher__label,
.sx-gift-voucher__amounts--error .sx-gift-voucher__label {
	color: var( --sx-error );
}

.sx-gift-voucher__field--error .sx-gift-voucher__input,
.sx-gift-voucher__field--error .sx-gift-voucher__select,
.sx-gift-voucher__field--error .sx-gift-voucher__textarea,
.sx-gift-voucher__amounts--error .sx-gift-voucher__custom-amount {
	border-color: var( --sx-error );
	box-shadow: 0 0 0 1px var( --sx-error );
}

.sx-gift-voucher__amounts--error .sx-gift-voucher__amount-display,
.sx-gift-voucher__amounts--error .sx-form-amount-display {
	border-color: var( --sx-error );
}

/* ── Shared amount preset (donation + gift voucher) ─────────────────────── */

.sx-form-amount-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.sx-form-amount-label {
	display: inline-flex;
	cursor: pointer;
}

.sx-form-amount-radio {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.sx-form-amount-display {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 88px;
	padding: 12px 18px;
	border: 2px solid currentColor;
	border-radius: 6px;
	font-weight: 700;
	transition: background 0.15s, color 0.15s;
}

.sx-gift-voucher .sx-form-amount-display {
	border-color: var( --sx-gv-navy );
	color: var( --sx-gv-navy );
}

.sx-gift-voucher .sx-form-amount-radio:checked + .sx-form-amount-display,
.sx-gift-voucher .sx-form-amount-label:hover .sx-form-amount-display {
	background: var( --sx-gv-navy );
	color: #fff;
}

.sx-form-custom-input-wrap {
	display: flex;
	align-items: center;
	gap: 8px;
}

.sx-gift-voucher .sx-form-currency-symbol {
	font-weight: 700;
	color: var( --sx-gv-navy );
}

.sx-gift-voucher .sx-form-custom-amount {
	max-width: 160px;
}

.sx-gift-voucher__submit-wrap,
.sx-gift-voucher__basket-cta {
	display: flex;
	justify-content: center;
	margin-top: 8px;
}

.sx-gift-voucher .sx-btn--primary,
.sx-gift-voucher .sx-btn--gift-voucher,
.sx-gift-voucher .sx-gift-voucher__basket-link {
	min-width: 200px;
	padding: 14px 28px;
	border: none;
	border-radius: 18px;
	background: var( --sx-gv-btn-bg );
	color: #fff;
	font-size: 1rem;
	font-weight: 800;
	letter-spacing: 0.04em;
	text-decoration: none;
	cursor: pointer;
}

.sx-gift-voucher .sx-btn--primary:hover,
.sx-gift-voucher .sx-btn--primary:focus-visible,
.sx-gift-voucher .sx-btn--gift-voucher:hover,
.sx-gift-voucher .sx-btn--gift-voucher:focus-visible,
.sx-gift-voucher .sx-gift-voucher__basket-link:hover,
.sx-gift-voucher .sx-gift-voucher__basket-link:focus-visible {
	background: var( --sx-tan-hover );
	color: var( --sx-white );
	text-decoration: none;
	outline: 2px solid var( --sx-gv-navy );
	outline-offset: 2px;
}

.sx-gift-voucher .sx-btn--gift-voucher.sx-btn--loading,
.sx-gift-voucher .sx-btn--gift-voucher.sx-btn--loading:hover,
.sx-gift-voucher .sx-btn--gift-voucher.sx-btn--loading:focus-visible,
.sx-donation .sx-btn--donate.sx-btn--loading,
.sx-donation .sx-btn--donate.sx-btn--loading:hover,
.sx-donation .sx-btn--donate.sx-btn--loading:focus-visible {
	position: relative;
	background: var( --sx-gv-btn-bg );
	color: transparent;
	pointer-events: none;
	outline: none;
}

.sx-gift-voucher .sx-btn--gift-voucher.sx-btn--loading::after,
.sx-donation .sx-btn--donate.sx-btn--loading::after {
	content: '';
	position: absolute;
	inset: 0;
	width: 22px;
	height: 22px;
	margin: auto;
	border: 2px solid rgba( 255, 255, 255, 0.35 );
	border-top-color: #fff;
	border-radius: 50%;
	animation: sx-btn-spin 0.65s linear infinite;
}

@keyframes sx-btn-spin {
	to {
		transform: rotate( 360deg );
	}
}

.sx-gift-voucher__feedback {
	padding: 12px 16px;
	border-radius: 4px;
	font-weight: 600;
	text-align: center;
}

.sx-gift-voucher__feedback.sx-feedback--success {
	background: #e8f5e9;
	color: #1b5e20;
}

.sx-gift-voucher__feedback.sx-feedback--error {
	background: #ffebee;
	color: #b71c1c;
}

/* ═══════════════════════════════════════════════════════════════════════════
   [spektrix_donation_form] — Donation form (Figma)
   ═══════════════════════════════════════════════════════════════════════════ */

.sx-page-chrome-wrap + .sx-donation {
	margin-top: 24px;
}

.sx-donation {
	--sx-dn-card-bg:      var( --sx-navy );
	--sx-dn-text:         var( --sx-white );
	--sx-dn-fund-bg:      #d2b48c;
	--sx-dn-fund-hover:   #c9a87c;
	--sx-dn-fund-text:    var( --sx-navy );
	--sx-dn-input-bg:     var( --sx-white );
	--sx-dn-input-text:   #222;
	--sx-dn-btn-bg:       #8b2332;
	--sx-dn-btn-hover:    #7a1f2c;
	--sx-dn-error-text:   #ffb4b4;
	--sx-gv-btn-bg: var( --sx-dn-btn-hover );
	--sx-dn-radius-card:  28px;
	--sx-dn-radius-input: 12px;
	--sx-dn-radius-fund:  14px;
	--sx-dn-radius-btn:   20px;
	max-width: 960px;
	margin: 0 auto 48px;
	padding: 48px 56px 56px;
	background: var( --sx-dn-card-bg );
	border-radius: var( --sx-dn-radius-card );
	color: var( --sx-dn-text );
	font-family: "Roboto Condensed", sans-serif;
	box-sizing: border-box;
}

.sx-donation__title {
	margin: 0 0 28px;
	font-size: clamp( 1.75rem, 4vw, 2.25rem );
	font-weight: 900;
	color: var( --sx-dn-text );
	text-transform: uppercase;
}

.sx-donation__description {
	margin: 0;
	font-size: 18px;
	line-height: 1.55;
	color: var( --sx-dn-text );
	text-align: center;
}

.sx-donation__header {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 18px;
	width: 100%;
	text-align: center;
}

.sx-donation__form {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.sx-donation__field {
	display: flex;
	flex-direction: column;
	gap: 10px;
	border: none;
	margin: 0;
	padding: 0;
}

.sx-donation__field--fund {
	align-items: center;
	gap: 16px;
	width: 100%;
	text-align: center;
}

.sx-donation__fund-select-wrap {
	display: inline-flex;
	max-width: 100%;
}

.sx-donation__description-wrap {
	width: 100%;
	max-width: 52em;
}

.sx-donation__tribute-wrap {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.sx-donation__tribute-row {
	display: grid;
	grid-template-columns: minmax( 0, 38% ) minmax( 0, 1fr );
	gap: 16px;
	align-items: start;
}

.sx-donation__description-wrap[hidden],
.sx-donation__tribute-wrap[hidden],
.sx-donation__custom-wrap[hidden] {
	display: none !important;
}

/* Category label — sentence case, centered */
.sx-donation__label--category {
	font-size: 18px;
	font-weight: 400;
	letter-spacing: normal;
	text-transform: none;
	color: var( --sx-dn-text );
	text-align: center;
}

/* Field labels — AMOUNT, RECOGNITION NAME */
.sx-donation__label--field {
	font-size: 18px;
	font-weight: 800;
	letter-spacing: 0.06em;
	color: var( --sx-dn-text );
	text-transform: uppercase;
}

.sx-donation__label--recognition {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.35em;
}

.sx-donation__label-text {
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.sx-donation__help {
	font-size: 18px;
	font-weight: 400;
	text-transform: none;
	letter-spacing: normal;
	color: var( --sx-dn-text );
}

.sx-donation__amounts .sx-donation__label {
	font-size: 18px;
	font-weight: 800;
	letter-spacing: 0.06em;
	color: var( --sx-dn-text );
	text-transform: uppercase;
}

/* Fund select — centered tan pill, content-width */
.sx-donation__select--fund {
	width: fit-content;
	max-width: 100%;
	padding: 14px 56px 14px 32px;
	border: none;
	border-radius: var( --sx-dn-radius-fund );
	font-family: "Roboto Condensed", sans-serif;
	font-size: 18px;
	font-weight: 800;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var( --sx-dn-fund-text );
	background-color: var( --sx-dn-fund-bg );
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	background-image: url( "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23161886' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E" );
	background-repeat: no-repeat;
	background-position: right 24px center;
	transition: background-color 0.15s;
	text-align: center;
	text-align-last: center;
}

.sx-donation__select--fund:hover {
	background-color: var( --sx-dn-fund-hover );
}

.sx-donation__select--fund:focus-visible {
	outline: 2px solid var( --sx-dn-text );
	outline-offset: 2px;
}

.sx-donation__select--fund option {
	color: var( --sx-dn-input-text );
	background: var( --sx-dn-input-bg );
	font-weight: 600;
	text-transform: none;
}

/* Tribute + text inputs */
.sx-donation__input,
.sx-donation__select--tribute {
	width: 100%;
	padding: 12px 16px;
	border: none;
	border-radius: var( --sx-dn-radius-input );
	font-family: "Roboto Condensed", sans-serif;
	font-size: 18px;
	color: var( --sx-dn-input-text );
	background: var( --sx-dn-input-bg );
	transition: box-shadow 0.15s;
	border-radius: 11px !important;
	height: 45px;
}

.sx-donation__select--tribute {
	cursor: pointer;
	padding-right: 40px;
	appearance: none;
	-webkit-appearance: none;
	background-image: url( "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23161886' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E" );
	background-repeat: no-repeat;
	background-position: right 14px center;
}

.sx-donation__select--tribute:focus-visible,
.sx-donation__input:focus-visible {
	outline: 2px solid var( --sx-dn-text );
	outline-offset: 2px;
}

.sx-donation__input:disabled {
	background: #e8e8e8;
	color: #595959;
	cursor: not-allowed;
}

.sx-donation__amount-input-wrap,
.sx-donation__custom-input-wrap {
	display: flex;
	align-items: center;
	gap: 8px;
}

.sx-donation__amount-input {
	max-width: 140px;
}

.sx-donation__currency-symbol {
	font-size: 18px;
	font-weight: 700;
	color: var( --sx-dn-text );
}

.sx-donation__checkbox-wrap {
	flex-direction: row;
	align-items: flex-start;
	gap: 12px;
}

.sx-donation__checkbox {
	width: 20px;
	height: 20px;
	flex-shrink: 0;
	accent-color: var( --sx-dn-text );
	cursor: pointer;
	border-radius: 11px !important;
}

.sx-donation__checkbox-label {
	font-size: 18px;
	font-weight: 400;
	text-transform: none;
	letter-spacing: normal;
	color: var( --sx-dn-text );
	cursor: pointer;
}

.sx-donation__field-error {
	font-size: 0.8125rem;
	color: var( --sx-dn-error-text );
}

.sx-donation__field--error .sx-donation__label,
.sx-donation__amounts--error .sx-donation__label {
	color: var( --sx-dn-error-text );
}

.sx-donation__field--error .sx-donation__input,
.sx-donation__field--error .sx-donation__select,
.sx-donation__amounts--error .sx-donation__custom-amount,
.sx-donation__amounts--error .sx-donation__amount-input {
	box-shadow: 0 0 0 2px var( --sx-error );
}

.sx-donation__amounts--error .sx-donation__amount-display,
.sx-donation__amounts--error .sx-form-amount-display {
	border-color: var( --sx-dn-error-text );
}

/* Preset amounts (when suggested_amounts is set) */
.sx-donation .sx-form-amount-display {
	border-color: var( --sx-dn-text );
	color: var( --sx-dn-text );
	font-family: "Roboto Condensed", sans-serif;
	font-size: 18px;
}

.sx-donation .sx-form-amount-radio:checked + .sx-form-amount-display,
.sx-donation .sx-form-amount-label:hover .sx-form-amount-display {
	background: var( --sx-dn-text );
	color: var( --sx-dn-fund-text );
}

.sx-donation .sx-form-currency-symbol {
	font-weight: 700;
	color: var( --sx-dn-text );
}

.sx-donation__submit-wrap {
	display: flex;
	justify-content: center;
	margin-top: 12px;
}

.sx-donation .sx-btn--primary,
.sx-donation .sx-btn--donate {
	min-width: 260px;
	padding: 16px 48px;
	border: none;
	border-radius: var( --sx-dn-radius-btn );
	background: var( --sx-dn-btn-bg );
	color: var( --sx-dn-text );
	font-family: "Roboto Condensed", sans-serif;
	font-size: 24px;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background 0.15s;
	display: inline !important;
}

.sx-donation .sx-btn--primary:hover,
.sx-donation .sx-btn--primary:focus-visible,
.sx-donation .sx-btn--donate:hover,
.sx-donation .sx-btn--donate:focus-visible {
	background: var( --sx-dn-btn-hover );
	color: var( --sx-dn-text );
	outline: 2px solid var( --sx-dn-text );
	outline-offset: 2px;
}

.sx-donation__feedback {
	padding: 12px 16px;
	border-radius: var( --sx-dn-radius-input );
	font-weight: 600;
	text-align: center;
}

.sx-donation__feedback.sx-feedback--success {
	background: #e8f5e9;
	color: #1b5e20;
}

.sx-donation__feedback.sx-feedback--error {
	background: #ffebee;
	color: #b71c1c;
}

@media ( max-width: 640px ) {
	.sx-page-chrome-wrap {
		margin-top: 16px;
	}

	.sx-page-chrome-wrap + .sx-donation {
		margin-top: 20px;
	}

	.sx-donation {
		margin-bottom: 32px;
		padding: 32px 24px 40px;
		border-radius: 20px;
	}

	.sx-donation__select--fund {
		padding: 12px 48px 12px 24px;
	}

	.sx-donation__tribute-row {
		grid-template-columns: 1fr;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.sx-donation__select--fund,
	.sx-donation .sx-btn--donate,
	.sx-donation__amount-display {
		transition: none;
	}
}

.sx-gift-voucher--modal {
	max-width: none;
	margin: 0;
	padding: 0;
}

/* Gift voucher modal (merchandise grid) */
.sx-gift-voucher-modal[hidden] {
	display: none !important;
}

.sx-gift-voucher-modal {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px 16px;
}

.sx-gift-voucher-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba( 0, 0, 0, 0.55 );
}

.sx-gift-voucher-modal__panel {
	position: relative;
	z-index: 1;
	width: min( 100%, 640px );
	max-height: min( 92vh, 900px );
	overflow: auto;
	padding: 28px 24px 32px;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 16px 48px rgba( 0, 0, 0, 0.28 );
}

.sx-gift-voucher-modal__close {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: none;
	border-radius: 999px;
	background: transparent;
	color: var( --sx-navy ) !important;
	background-color: transparent !important;
	font-size: 1.75rem;
	line-height: 1;
	cursor: pointer;
}

.sx-gift-voucher-modal__close:hover,
.sx-gift-voucher-modal__close:focus-visible {
	background: rgba( 22, 24, 134, 0.08 );
	outline: 2px solid var( --sx-navy );
	outline-offset: 2px;
}

body.sx-gift-voucher-modal-open {
	overflow: hidden;
}

@media ( max-width: 480px ) {
	.sx-booking-wrap--seat-selection .sx-seat-selection__section-grid {
		gap: 28px;
	}

	.sx-booking-wrap--seat-selection .sx-seat-map {
		gap: 5px 6px;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		padding-bottom: 4px;
	}

}

/* ── Season subscriptions (package cards + inline tier) ───────────────────── */

.sx-season-subscriptions {
	max-width: var( --sx-season-list-max, 1100px );
	width: 100%;
	margin: 0 auto;
	box-sizing: border-box;
	overflow-x: hidden;
}

.sx-season-subscriptions__empty {
	text-align: center;
	color: var( --sx-text-muted, #555 );
}

.sx-season-subscriptions__packages-data {
	display: none;
}

/* ── Season ticket purchase ───────────────────────────────────────────────── */

.sx-season-purchase {
	--sx-season-border: #c58c5c;
	--sx-season-header-bg: #c58c5c;
	--sx-season-action-text: #7A4E28;
	--sx-season-package-bg: #e9e9f3;
	--sx-season-package-text: #161886;
	--sx-season-body-text: #333;

	max-width: var( --sx-season-list-max, 1100px );
	width: 100%;
	margin: 0 auto;
	box-sizing: border-box;
	overflow-x: hidden;
}

.sx-season-purchase__empty {
	text-align: center;
	color: var( --sx-text-muted, #555 );
}

.sx-season-purchase__heading {
	margin: 0 0 1.25rem;
	font-size: clamp( 1.25rem, 2.5vw, 1.5rem );
	color: var( --sx-navy, #161886 );
	text-align: center;
}

.sx-season-purchase__back-link,
.sx-season-purchase__back-btn {
	display: inline-block;
	margin-bottom: 1rem;
	padding: 0;
	border: none;
	background: none;
	color: var( --sx-navy, #161886 );
	font: inherit;
	font-weight: 600;
	text-align: left;
	text-decoration: none;
	cursor: pointer;
}

.sx-season-purchase__back-link:hover,
.sx-season-purchase__back-link:focus-visible,
.sx-season-purchase__back-btn:hover,
.sx-season-purchase__back-btn:focus-visible {
	text-decoration: underline;
}

.sx-season-purchase__back-btn:focus-visible {
	outline: 2px solid var( --sx-navy, #161886 );
	outline-offset: 2px;
}

.sx-season-purchase__package-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

@media ( min-width: 600px ) {
	.sx-season-purchase__package-list {
		grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
		gap: 1.25rem;
	}
}

@media ( min-width: 960px ) {
	.sx-season-purchase__package-list {
		grid-template-columns: repeat( 3, minmax( 0, 1fr ) );
	}
}

.sx-season-purchase__package-item {
	min-width: 0;
	max-width: 100%;
}

.sx-season-purchase__package-card {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	min-height: 8.5rem;
	height: 100%;
	padding: 1.5rem 1.25rem;
	border: 2px solid var( --sx-season-border, #c58c5c );
	border-radius: 8px;
	background: var( --sx-season-package-bg, #e9e9f3 );
	color: var( --sx-season-package-text, #161886 );
	font: inherit;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	box-sizing: border-box;
	overflow-wrap: anywhere;
	word-break: break-word;
	transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

button.sx-season-purchase__package-card {
	appearance: none;
	-webkit-appearance: none;
}

.sx-season-purchase__package-card:hover,
.sx-season-purchase__package-card:focus-visible {
	border-color: var( --sx-navy, #161886 );
	box-shadow: 0 4px 12px rgb( 22 24 134 / 12% );
}

.sx-season-purchase__package-card.is-selected {
	border-color: var( --sx-navy, #161886 );
	background: #fff;
	box-shadow: 0 4px 16px rgb( 22 24 134 / 15% );
}

.sx-season-purchase__package-card:focus-visible {
	outline: 2px solid var( --sx-navy, #161886 );
	outline-offset: 2px;
}

.sx-season-purchase__package-card--unavailable {
	cursor: default;
	opacity: 0.72;
}

.sx-season-purchase__package-card--unavailable:hover,
.sx-season-purchase__package-card--unavailable:focus-visible {
	border-color: var( --sx-season-border, #c58c5c );
	box-shadow: none;
}

.sx-season-purchase__package-status {
	margin-top: 0.5rem;
	color: var( --sx-text-muted, #666 );
	font-size: 0.85rem;
	font-style: italic;
	font-weight: 600;
}

.sx-season-purchase__package-name {
	font-weight: 700;
	font-size: 1rem;
	line-height: 1.35;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

.sx-season-purchase__package-shows {
	color: var( --sx-season-body-text, #333 );
	font-size: 0.95rem;
	font-weight: 600;
}

.sx-season-purchase__package-action {
	margin-top: 0.5rem;
	color: var( --sx-season-action-text, #7A4E28 );
	font-size: 0.85rem;
	font-weight: 700;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.sx-season-purchase__tier-card,
.sx-season-purchase__iframe-card {
	margin-top: 1.75rem;
	padding: 1.5rem;
	border: 2px solid var( --sx-season-border, #c58c5c );
	border-radius: 8px;
	background: #fff;
	animation: sx-season-tier-open 0.25s ease;
}

@keyframes sx-season-tier-open {
	from {
		opacity: 0;
		transform: translateY( 8px );
	}

	to {
		opacity: 1;
		transform: translateY( 0 );
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.sx-season-purchase__tier-card,
	.sx-season-purchase__iframe-card {
		animation: none;
	}
}

.sx-season-purchase__tier-card-header,
.sx-season-purchase__iframe-card-header {
	margin-bottom: 1rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var( --sx-list-stripe, #e8e8e8 );
	text-align: center;
}

.sx-season-purchase__tier-card-title,
.sx-season-purchase__iframe-card-title {
	margin: 0 0 0.35rem;
	font-size: 1.25rem;
	color: var( --sx-navy, #161886 );
	text-transform: uppercase;
}

.sx-season-purchase__tier-card-shows,
.sx-season-purchase__iframe-card-shows {
	margin: 0;
	color: var( --sx-text-muted, #555 );
	font-weight: 600;
}

.sx-season-purchase__iframe-wrap {
	margin-top: 0.5rem;
	border: 1px solid var( --sx-list-stripe, #e8e8e8 );
	border-radius: 4px;
	overflow: hidden;
	background: #fff;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

.sx-season-purchase__iframe,
#SpektrixIFrame.sx-season-purchase__iframe {
	display: block;
	width: 100%;
	max-width: 100%;
	height: 1000px;
	border: 0;
	overflow: hidden;
	box-sizing: border-box;
}

.sx-season-purchase__tier-card-intro {
	margin: 0 0 1rem;
	font-weight: 600;
}

.sx-season-purchase__tier-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sx-season-purchase__tier-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem 1rem;
	padding: 0.85rem 0;
	border-bottom: 1px solid var( --sx-list-stripe, #e8e8e8 );
}

.sx-season-purchase__tier-row:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.sx-season-purchase__tier-info {
	display: flex;
	flex: 1 1 12rem;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.35rem 1rem;
	min-width: 0;
}

.sx-season-purchase__tier-name {
	font-weight: 600;
}

.sx-season-purchase__tier-price {
	color: var( --sx-navy, #161886 );
	font-size: 1.1rem;
	font-weight: 700;
}

.sx-season-purchase__tier-cta {
	flex-shrink: 0;
	padding: 0.65rem 1.25rem;
	background: var( --sx-navy, #161886 );
	color: #fff;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	font: inherit;
	font-size: 0.9rem;
	font-weight: 600;
	white-space: nowrap;
}

.sx-season-purchase__tier-cta:hover:not(:disabled) {
	opacity: 0.9;
}

.sx-season-purchase__tier-cta:focus-visible {
	outline: 2px solid var( --sx-navy, #161886 );
	outline-offset: 2px;
}

.sx-season-purchase__tier-cta:disabled {
	cursor: not-allowed;
	opacity: 0.6;
}

.sx-season-purchase__feedback {
	margin-top: 1rem;
	padding: 0.75rem 1rem;
	border-radius: 6px;
}

.sx-season-purchase__feedback.sx-feedback--success {
	background: #e8f5e9;
	color: #1b5e20;
}

.sx-season-purchase__feedback.sx-feedback--error {
	background: #fdecea;
	color: var( --sx-error, #c41230 );
}

@media ( max-width: 480px ) {
	.sx-season-purchase__tier-row {
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
	}

	.sx-season-purchase__tier-info {
		flex: 0 1 auto;
	}

	.sx-season-purchase__tier-cta {
		width: 100%;
	}
}

/* ── [spektrix_donation_options] — fund card grid ─────────────────────────── */

.sx-donation-options {
	--sx-do-columns: 3;
	--sx-do-layout-cols: 3;
	--sx-do-gap: clamp( 1rem, 2.5vw, 1.75rem );
	/* Match prior Folly donation cards: deep navy + soft tan CTA, white type */
	--sx-do-card-bg: #161886;
	--sx-do-text: #ffffff;
	--sx-do-btn-bg: #8a5a2b;
	--sx-do-btn-hover: #9a6230;
	--sx-do-btn-text: #ffffff;
	--sx-do-card-radius: 16px;
	--sx-do-btn-radius: 6px;
	--sx-do-padding: clamp( 1.25rem, 2.5vw, 1.75rem );
	--sx-do-image-ratio: 16 / 10;
	box-sizing: border-box;
	max-width: 100%;
	margin-bottom: 2.5rem;
	color: var( --sx-do-text );
}

.sx-donation-options--count-1 {
	--sx-do-columns: 1;
}

.sx-donation-options--count-2 {
	--sx-do-columns: 2;
}

.sx-donation-options--count-1 .sx-donation-options__list,
.sx-donation-options--count-2 .sx-donation-options__list {
	--sx-do-track: calc(
		( 100% - ( var( --sx-do-layout-cols ) - 1 ) * var( --sx-do-gap ) )
		/ var( --sx-do-layout-cols )
	);
	grid-template-columns: repeat( var( --sx-do-columns ), minmax( 0, var( --sx-do-track ) ) );
	justify-content: center;
}

.sx-donation-options *,
.sx-donation-options *::before,
.sx-donation-options *::after {
	box-sizing: border-box;
}

.sx-donation-options__empty {
	margin: 0;
	text-align: center;
}

.sx-donation-options__list {
	display: grid;
	grid-template-columns: repeat( var( --sx-do-columns ), minmax( 0, 1fr ) );
	gap: var( --sx-do-gap );
	list-style: none;
	margin: 0;
	padding: 0;
}

.sx-donation-options__item {
	margin: 0;
	min-width: 0;
}

.sx-donation-options__card {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: var( --sx-do-padding );
	border-radius: var( --sx-do-card-radius );
	background: var( --sx-do-card-bg );
	color: var( --sx-do-text );
	text-align: center;
}

.sx-donation-options__title {
	margin: 0 0 1rem;
	color: var( --sx-do-text ) !important;
	font-family: "Roboto Condensed", sans-serif;
	font-size: 25px !important;
	font-weight: 700;
	letter-spacing: 0.04em;
	line-height: 1.25;
	text-transform: uppercase;
}

.sx-donation-options__image-wrap {
	flex-shrink: 0;
	margin: 0 0 1rem;
	overflow: hidden;
	line-height: 0;
}

.sx-donation-options__image {
	display: block;
	width: 100%;
	aspect-ratio: var( --sx-do-image-ratio );
	object-fit: cover;
}

.sx-donation-options__description {
	flex-grow: 1;
	margin: 0 0 1.25rem;
	color: var( --sx-do-text );
	font-size: 18px !important;
	line-height: 1.55;
}

.sx-donation-options__description p {
	margin: 0 0 0.75em;
	color: var( --sx-do-text );
	font-size: 18px !important;
}

.sx-donation-options__description p:last-child {
	margin-bottom: 0;
}

.sx-donation-options__actions {
	margin: auto 0 0;
	padding-top: 0.5rem;
}

/* Anchor + :link/:visited so theme link colors (often maroon) cannot win */
.sx-donation-options a.sx-donation-options__donate,
.sx-donation-options a.sx-donation-options__donate:link,
.sx-donation-options a.sx-donation-options__donate:visited {
	display: inline-block;
	min-width: 10rem;
	padding: 0.75rem 1.75rem;
	border: none;
	border-radius: var( --sx-do-btn-radius );
	background: var( --sx-do-btn-bg );
	color: var( --sx-do-btn-text );
	font-family: "Roboto Condensed", sans-serif;
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1.2;
	text-decoration: none;
	text-transform: uppercase;
	transition: background 0.15s ease;
}

.sx-donation-options a.sx-donation-options__donate:hover,
.sx-donation-options a.sx-donation-options__donate:focus,
.sx-donation-options a.sx-donation-options__donate:focus-visible,
.sx-donation-options a.sx-donation-options__donate:active {
	background: var( --sx-do-btn-hover );
	color: var( --sx-do-btn-text );
	text-decoration: none;
	outline: 2px solid var( --sx-do-text );
	outline-offset: 2px;
}

@media ( max-width: 900px ) {
	.sx-donation-options {
		--sx-do-columns: 2;
		--sx-do-layout-cols: 2;
	}

	.sx-donation-options--count-1 {
		--sx-do-columns: 1;
	}
}

@media ( max-width: 600px ) {
	.sx-donation-options {
		--sx-do-columns: 1;
		--sx-do-layout-cols: 1;
	}
}