/* ─── Design tokens ──────────────────────────────────── */
:root {
	--gza-primary:    #8B1A35;
	--gza-primary-d:  #5C1022;
	--gza-primary-l:  #C2185B;
	--gza-grad:       linear-gradient(135deg, #8B1A35 0%, #C2185B 100%);
	--gza-grad-hero:  linear-gradient(160deg, rgba(10,5,20,.55) 0%, rgba(0,0,0,.82) 100%);
	--gza-surface:    #ffffff;
	--gza-bg:         #F3F2F0;
	--gza-border:     #E4E3E8;
	--gza-text:       #0F0F0F;
	--gza-muted:      #6B6977;
	--gza-radius-lg:  18px;
	--gza-radius-md:  12px;
	--gza-radius-sm:  8px;
	--gza-shadow-sm:  0 1px 4px rgba(0,0,0,.06);
	--gza-shadow-md:  0 4px 20px rgba(0,0,0,.10);
	--gza-shadow-lg:  0 12px 40px rgba(0,0,0,.14);
	--gza-shadow-xl:  0 24px 64px rgba(0,0,0,.18);
	--gza-transition: 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ─── Reset within plugin scope ─────────────────────── */
.gza-hero *, .gza-body * { box-sizing: border-box; }

/* ═══════════════════════════════════════════════════════
   HERO
═══════════════════════════════════════════════════════ */

.gza-hero {
	position: relative;
	min-height: 420px;
	display: flex;
	align-items: flex-end;
	overflow: hidden;
	background: linear-gradient(160deg, #1a0810 0%, #0d0514 100%);
}

/* blurred image layer */
.gza-hero-bg {
	position: absolute;
	inset: -24px;
	background-size: cover;
	background-position: center;
	filter: blur(18px) brightness(.55) saturate(1.1);
	transform: scale(1.05);
	z-index: 0;
}

/* gradient overlay */
.gza-hero-overlay {
	position: absolute;
	inset: 0;
	background: var(--gza-grad-hero);
	z-index: 1;
}

/* vignette bottom fade */
.gza-hero::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 120px;
	background: linear-gradient(to bottom, transparent, rgba(0,0,0,.65));
	z-index: 2;
	pointer-events: none;
}

.gza-hero-inner {
	position: relative;
	z-index: 3;
	width: 100%;
	max-width: 1120px;
	margin: 0 auto;
	padding: 48px 24px 48px;
}

.gza-hero-content {
	max-width: 800px;
}

.gza-hero-title {
	font-size: clamp(28px, 5vw, 52px);
	font-weight: 900;
	line-height: 1.08;
	letter-spacing: -0.03em;
	color: #ffffff;
	margin: 0 0 22px;
	text-shadow: 0 2px 20px rgba(0,0,0,.4);
}

/* glassmorphism pills */
.gza-hero-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.gza-glass-pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 16px;
	background: rgba(255,255,255,.12);
	backdrop-filter: blur(12px) saturate(180%);
	-webkit-backdrop-filter: blur(12px) saturate(180%);
	border: 1px solid rgba(255,255,255,.22);
	border-radius: 40px;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	white-space: nowrap;
	transition: background var(--gza-transition), border-color var(--gza-transition);
}

.gza-glass-pill:hover {
	background: rgba(255,255,255,.20);
	border-color: rgba(255,255,255,.35);
}

.gza-pill-icon {
	width: 15px;
	height: 15px;
	flex-shrink: 0;
	opacity: .85;
}

/* ═══════════════════════════════════════════════════════
   BODY / GRID
═══════════════════════════════════════════════════════ */

.gza-body {
	background: var(--gza-bg);
	padding: 40px 0 80px;
}

.gza-container {
	max-width: 1120px;
	margin: 0 auto;
	padding: 0 24px;
	display: grid;
	grid-template-columns: 1fr 400px;
	gap: 36px;
	align-items: start;
}

@media (max-width: 900px) {
	.gza-container { grid-template-columns: 1fr; }
}

/* ─── Left column ────────────────────────────────────── */

.gza-flyer-wrap {
	border-radius: var(--gza-radius-lg);
	overflow: hidden;
	box-shadow: var(--gza-shadow-xl);
	margin-bottom: 32px;
	position: relative;
}

.gza-flyer-img {
	width: 100%;
	height: auto;
	display: block;
	transition: transform 0.5s ease;
}

.gza-flyer-wrap:hover .gza-flyer-img {
	transform: scale(1.015);
}

.gza-description {
	background: var(--gza-surface);
	border-radius: var(--gza-radius-lg);
	border: 1px solid var(--gza-border);
	padding: 28px 32px 32px;
	box-shadow: var(--gza-shadow-sm);
}

.gza-section-heading {
	font-size: 18px;
	font-weight: 800;
	color: var(--gza-text);
	margin: 0 0 14px;
	letter-spacing: -0.01em;
}

.gza-description-body {
	font-size: 15px;
	line-height: 1.8;
	color: #3d3b47;
}

.gza-description-body p:first-child { margin-top: 0; }
.gza-description-body p:last-child  { margin-bottom: 0; }

/* ─── Right column ───────────────────────────────────── */

.gza-right {
	position: sticky;
	top: 28px;
}

@media (max-width: 900px) { .gza-right { position: static; } }

/* ═══════════════════════════════════════════════════════
   TICKETS CARD
═══════════════════════════════════════════════════════ */

.gza-tickets-card {
	background: var(--gza-surface);
	border-radius: var(--gza-radius-lg);
	border: 1px solid var(--gza-border);
	box-shadow: var(--gza-shadow-lg);
	overflow: hidden;
}

/* Top gradient accent bar */
.gza-card-accent {
	height: 4px;
	background: var(--gza-grad);
}

/* Card header */
.gza-card-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px 22px 18px;
	border-bottom: 1px solid var(--gza-border);
}

.gza-card-eyebrow {
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--gza-primary);
	margin: 0 0 3px;
}

.gza-card-heading {
	font-size: 17px;
	font-weight: 800;
	color: var(--gza-text);
	margin: 0;
	letter-spacing: -0.01em;
}

/* Calendar badge */
.gza-card-date-badge {
	display: flex;
	flex-direction: column;
	align-items: center;
	background: var(--gza-bg);
	border: 1px solid var(--gza-border);
	border-radius: 10px;
	padding: 6px 12px;
	min-width: 48px;
}

.gza-cdb-num {
	font-size: 22px;
	font-weight: 900;
	line-height: 1;
	color: var(--gza-primary);
}

.gza-cdb-mon {
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--gza-muted);
	margin-top: 1px;
}

/* ─── Ticket rows ────────────────────────────────────── */

.gza-tt-list { padding: 8px 0; }

.gza-tt-row {
	position: relative;
	display: flex;
	align-items: center;
	gap: 0;
	padding: 16px 22px 16px 0;
	cursor: pointer;
	border-bottom: 1px solid #F5F4F6;
	transition: background var(--gza-transition), transform var(--gza-transition), box-shadow var(--gza-transition);
	overflow: hidden;
}

.gza-tt-row:last-child { border-bottom: none; }

.gza-tt-row:hover:not(.gza-tt-row--off) {
	background: rgba(139,26,53,.03);
	transform: translateX(3px);
}

.gza-tt-row--off {
	cursor: not-allowed;
	opacity: 0.48;
}

/* Left color indicator */
.gza-tt-indicator {
	width: 4px;
	align-self: stretch;
	background: var(--tt-color, var(--gza-primary));
	border-radius: 0 3px 3px 0;
	margin-right: 16px;
	opacity: 0.5;
	transition: opacity var(--gza-transition), width var(--gza-transition);
	flex-shrink: 0;
}

.gza-tt-row:hover:not(.gza-tt-row--off) .gza-tt-indicator {
	opacity: 1;
	width: 5px;
}

.gza-tt-body {
	flex: 1;
	min-width: 0;
}

.gza-tt-name {
	display: block;
	font-size: 14px;
	font-weight: 700;
	color: var(--gza-text);
	line-height: 1.3;
}

.gza-tt-desc {
	display: block;
	font-size: 12px;
	color: var(--gza-muted);
	margin-top: 2px;
}

.gza-tt-tag {
	display: inline-block;
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	padding: 2px 7px;
	border-radius: 6px;
	margin-top: 5px;
}

.gza-tt-tag--sold { background: #FEE2E2; color: #B91C1C; }
.gza-tt-tag--soon { background: #FEF3C7; color: #92400E; }
.gza-tt-tag--low  { background: #FFF7ED; color: #C2410C; }

.gza-tt-right {
	display: flex;
	align-items: center;
	gap: 6px;
	flex-shrink: 0;
	margin-left: 12px;
}

.gza-tt-price {
	font-size: 15px;
	font-weight: 800;
	color: var(--tt-color, var(--gza-primary));
	white-space: nowrap;
}

.gza-tt-chevron {
	width: 16px;
	height: 16px;
	color: #C8C6D0;
	transition: color var(--gza-transition), transform var(--gza-transition);
	flex-shrink: 0;
}

.gza-tt-row:hover:not(.gza-tt-row--off) .gza-tt-chevron {
	color: var(--tt-color, var(--gza-primary));
	transform: translateX(2px);
}

.gza-tt-empty {
	padding: 20px 22px;
	font-size: 14px;
	color: var(--gza-muted);
}

/* ═══════════════════════════════════════════════════════
   CHECKOUT PANEL
═══════════════════════════════════════════════════════ */

.gza-checkout-panel {
	border-top: 1px solid var(--gza-border);
	padding: 20px 22px 22px;
	animation: gza-slide-down 0.25s ease;
}

@keyframes gza-slide-down {
	from { opacity: 0; transform: translateY(-8px); }
	to   { opacity: 1; transform: translateY(0); }
}

.gza-checkout-top {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 18px;
}

.gza-back-btn {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 6px 12px;
	background: #F5F4F8;
	border: 1px solid var(--gza-border);
	border-radius: var(--gza-radius-sm);
	font-size: 13px;
	font-weight: 600;
	color: var(--gza-muted);
	cursor: pointer;
	transition: background var(--gza-transition), color var(--gza-transition), border-color var(--gza-transition);
}

.gza-back-btn svg {
	width: 14px;
	height: 14px;
}

.gza-back-btn:hover {
	background: #ECEAF0;
	color: var(--gza-text);
	border-color: #CCC;
}

.gza-checkout-tt-name {
	font-size: 14px;
	font-weight: 800;
	color: var(--gza-text);
}

/* ─── Form ───────────────────────────────────────────── */

.gza-form-qty-row {
	display: flex;
	gap: 14px;
	margin-bottom: 14px;
}

.gza-qty-wrap,
.gza-total-wrap {
	flex: 1;
}

.gza-qty-label {
	display: block;
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--gza-muted);
	margin-bottom: 6px;
}

/* Stepper */
.gza-qty-stepper {
	display: flex;
	align-items: center;
	background: var(--gza-bg);
	border: 1.5px solid var(--gza-border);
	border-radius: var(--gza-radius-sm);
	overflow: hidden;
}

.gza-stepper-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 40px;
	background: none;
	border: none;
	cursor: pointer;
	color: var(--gza-muted);
	transition: background var(--gza-transition), color var(--gza-transition);
	flex-shrink: 0;
}

.gza-stepper-btn svg { width: 16px; height: 16px; }

.gza-stepper-btn:hover {
	background: #ECEAF0;
	color: var(--gza-text);
}

.gza-qty-stepper input[type="number"] {
	flex: 1;
	border: none;
	border-left: 1.5px solid var(--gza-border);
	border-right: 1.5px solid var(--gza-border);
	text-align: center;
	font-size: 16px;
	font-weight: 800;
	color: var(--gza-text);
	background: #fff;
	padding: 0;
	height: 40px;
	-moz-appearance: textfield;
}

.gza-qty-stepper input::-webkit-outer-spin-button,
.gza-qty-stepper input::-webkit-inner-spin-button { -webkit-appearance: none; }

.gza-total-amount {
	height: 40px;
	display: flex;
	align-items: center;
	font-size: 20px;
	font-weight: 900;
	background: linear-gradient(135deg, var(--gza-primary), var(--gza-primary-l));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

/* Fields */
.gza-field {
	margin-bottom: 12px;
}

.gza-field label {
	display: block;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.07em;
	color: var(--gza-muted);
	margin-bottom: 5px;
}

.gza-field input {
	width: 100%;
	height: 44px;
	padding: 0 14px;
	background: var(--gza-bg);
	border: 1.5px solid var(--gza-border);
	border-radius: var(--gza-radius-sm);
	font-size: 14px;
	color: var(--gza-text);
	transition: border-color var(--gza-transition), background var(--gza-transition), box-shadow var(--gza-transition);
}

.gza-field input::placeholder { color: #B0ADB8; }

.gza-field input:focus {
	outline: none;
	background: #fff;
	border-color: var(--gza-primary);
	box-shadow: 0 0 0 3px rgba(139,26,53,.12);
}

.gza-req { color: #E53E3E; margin-left: 1px; }

/* Pay button */
.gza-pay-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 100%;
	height: 50px;
	padding: 0 20px;
	background: var(--gza-grad);
	color: #fff;
	border: none;
	border-radius: var(--gza-radius-md);
	font-size: 15px;
	font-weight: 800;
	letter-spacing: 0.03em;
	cursor: pointer;
	margin-top: 8px;
	box-shadow: 0 4px 18px rgba(139,26,53,.35);
	transition: transform var(--gza-transition), box-shadow var(--gza-transition), filter var(--gza-transition);
	position: relative;
	overflow: hidden;
}

/* Shimmer sweep on hover */
.gza-pay-btn::after {
	content: '';
	position: absolute;
	top: 0; left: -75%;
	width: 50%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent);
	transform: skewX(-20deg);
	transition: left 0.5s ease;
}

.gza-pay-btn:hover::after { left: 130%; }

.gza-pay-btn:hover {
	filter: brightness(1.08);
	box-shadow: 0 8px 28px rgba(139,26,53,.45);
	transform: translateY(-1px);
}

.gza-pay-btn:active {
	transform: translateY(0);
	box-shadow: 0 3px 10px rgba(139,26,53,.30);
}

.gza-pay-btn:disabled {
	background: #C8C6D0;
	box-shadow: none;
	cursor: not-allowed;
	transform: none;
	filter: none;
}

.gza-pay-btn svg {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
}

/* Status messages */
#gza-checkout-status:not(:empty) {
	margin-top: 10px;
	padding: 10px 14px;
	border-radius: var(--gza-radius-sm);
	font-size: 13px;
	font-weight: 500;
}

.gza-status--error {
	background: #FEF2F2;
	border: 1px solid #FECACA;
	color: #B91C1C;
}

.gza-status--info {
	background: #EFF6FF;
	border: 1px solid #BFDBFE;
	color: #1D4ED8;
}

/* ─── Secure note ────────────────────────────────────── */

.gza-secure-note {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 12px 22px 14px;
	font-size: 11px;
	font-weight: 600;
	color: #AAA8B4;
	letter-spacing: 0.03em;
	border-top: 1px solid var(--gza-border);
}

.gza-secure-note svg {
	width: 12px;
	height: 12px;
	flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════
   PAYMENT MODAL
═══════════════════════════════════════════════════════ */

body.gza-no-scroll { overflow: hidden; }

#gza-pay-modal {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 99999;
	align-items: center;
	justify-content: center;
	padding: 16px;
}

#gza-pay-modal.gza-pm-visible {
	display: flex;
}

.gza-pm-backdrop {
	position: fixed;
	inset: 0;
	background: rgba(8,5,18,.65);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	animation: gza-pm-fade .22s ease;
}

@keyframes gza-pm-fade {
	from { opacity: 0; }
	to   { opacity: 1; }
}

.gza-pm-dialog {
	position: relative;
	z-index: 1;
	background: #fff;
	border-radius: 20px;
	width: 100%;
	max-width: 520px;
	max-height: 90vh;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	box-shadow: 0 32px 80px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.08);
	animation: gza-pm-rise .28s cubic-bezier(.34,1.56,.64,1);
}

@keyframes gza-pm-rise {
	from { opacity: 0; transform: scale(.93) translateY(12px); }
	to   { opacity: 1; transform: scale(1) translateY(0); }
}

/* Modal header */
.gza-pm-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 20px;
	border-bottom: 1px solid #EEEDF2;
	flex-shrink: 0;
}

.gza-pm-header-left {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	font-weight: 700;
	color: #111;
}

.gza-pm-header-left svg {
	width: 16px;
	height: 16px;
	stroke: var(--gza-primary, #8B1A35);
}

.gza-pm-close {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	background: #F5F4F8;
	border: 1px solid #E4E3E8;
	border-radius: 8px;
	cursor: pointer;
	color: #6B6977;
	transition: background .15s, color .15s;
}

.gza-pm-close:hover { background: #ECEAF0; color: #111; }
.gza-pm-close svg   { width: 14px; height: 14px; }

/* Modal body */
.gza-pm-body {
	flex: 1;
	overflow: hidden;
	position: relative;
	min-height: 480px;
}

.gza-pm-loading {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 16px;
	background: #fff;
	z-index: 2;
}

.gza-pm-loading p {
	font-size: 14px;
	color: #6B6977;
	margin: 0;
}

.gza-pm-spinner {
	width: 36px;
	height: 36px;
	border: 3px solid #EEEDF2;
	border-top-color: var(--gza-primary, #8B1A35);
	border-radius: 50%;
	animation: gza-spin .7s linear infinite;
}

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

.gza-pm-frame {
	width: 100%;
	height: 100%;
	min-height: 480px;
	border: none;
	display: block;
	transition: opacity .2s;
}

/* Modal footer */
.gza-pm-footer {
	display: flex;
	align-items: center;
	gap: 7px;
	padding: 11px 20px;
	background: #FAFAF8;
	border-top: 1px solid #EEEDF2;
	font-size: 11px;
	color: #9995A4;
	flex-shrink: 0;
}

.gza-pm-footer svg {
	width: 13px;
	height: 13px;
	flex-shrink: 0;
}

.gza-pm-newwindow {
	margin-left: auto;
	font-size: 11px;
	font-weight: 600;
	color: var(--gza-primary, #8B1A35);
	text-decoration: none;
	white-space: nowrap;
}

.gza-pm-newwindow:hover { text-decoration: underline; }

/* Payment success state */
.gza-payment-success {
	padding: 28px 22px;
	text-align: center;
}

.gza-ps-icon {
	width: 56px; height: 56px;
	background: linear-gradient(135deg, #8B1A35, #C2185B);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 16px;
	box-shadow: 0 4px 16px rgba(139,26,53,.30);
}

.gza-ps-icon svg { width: 28px; height: 28px; stroke: #fff; }

.gza-payment-success h4 {
	font-size: 18px;
	font-weight: 800;
	color: #111;
	margin: 0 0 8px;
}

.gza-payment-success p {
	font-size: 14px;
	color: #6B6977;
	line-height: 1.6;
	margin: 0;
}

@media (max-width: 540px) {
	.gza-pm-dialog  { border-radius: 16px 16px 0 0; max-height: 95vh; align-self: flex-end; }
	#gza-pay-modal  { padding: 0; align-items: flex-end; }
}

/* ─── Mobile tweaks ──────────────────────────────────── */

@media (max-width: 480px) {
	.gza-hero-inner { padding: 32px 16px 40px; }
	.gza-hero-title { font-size: 26px; }
	.gza-glass-pill { font-size: 12px; padding: 6px 12px; }
	.gza-container  { padding: 0 16px; }
	.gza-form-qty-row { gap: 10px; }
	.gza-total-amount { font-size: 17px; }
}