/* ==========================================================================
   Eventix — light editorial front-end design system
   Palette, type and styling mirror the Sarfira Experiences look:
   white/cream surfaces, near-black ink, a coral primary accent and
   soft pastel tints. Plus Jakarta Sans for text, Instrument Serif for
   italic accents. Everything is scoped under .eventix-app so it neither
   leaks into nor is clobbered by the active theme.
   ========================================================================== */

.eventix-app,
.eventix-app *,
.eventix-app *::before,
.eventix-app *::after { box-sizing: border-box; }

.eventix-app {
	/* Core surfaces / ink */
	--etx-bg:        #ffffff;
	--etx-bg-2:      #fafafa;
	--etx-bg-warm:   #fdfaf6;
	--etx-ink:       #0a0a0a;
	--etx-ink-soft:  #2a2a2a;
	--etx-muted:     #6b6b6b;
	--etx-faint:     #a8a8a8;
	--etx-line:      #ececec;
	--etx-line-soft: #f4f4f4;
	--etx-glass:     #ffffff;
	--etx-glass-2:   #fafafa;

	/* Soothing accents */
	--etx-coral:      #ff2d55;
	--etx-coral-deep: #ff1a47;
	--etx-rose:       #ff2d55;
	--etx-gold:       #c9a063;
	--etx-peach:      #ffe4d4;
	--etx-peach-soft: #fff4ed;
	--etx-sky-soft:   #e8f1fb;
	--etx-mint-soft:  #ebf6f0;
	--etx-cream:      #faf4ea;

	/* Coral is the primary action; soft peach is the "selected" wash */
	--etx-grad:      linear-gradient(135deg, #ff5570 0%, #ff2d55 55%, #ff1a47 100%);
	--etx-grad-soft: linear-gradient(135deg, var(--etx-peach) 0%, var(--etx-peach-soft) 100%);

	--etx-r-lg: 24px;
	--etx-r-md: 16px;
	--etx-r-sm: 12px;

	--etx-shadow: 0 12px 32px rgba(0,0,0,.06), 0 2px 8px rgba(0,0,0,.04);
	--etx-glow:   0 0 0 1.5px var(--etx-coral), 0 14px 34px -10px rgba(255,45,85,.30);

	--etx-display: "Instrument Serif", Georgia, "Times New Roman", serif;
	--etx-body: "Plus Jakarta Sans", system-ui, -apple-system, sans-serif;

	font-family: var(--etx-body);
	color: var(--etx-ink);
	line-height: 1.55;
	letter-spacing: -.01em;
	-webkit-font-smoothing: antialiased;
	position: relative;
	margin: 0 auto;
	padding: 0;
	max-width: 1280px;
}

/* Atmospheric canvas — a barely-there warm wash behind the whole app */
.eventix-app::before {
	content: "";
	position: fixed;
	inset: 0;
	z-index: -2;
	background:
		radial-gradient(60vw 50vw at 8% -8%,  rgba(255,228,212,.45), transparent 60%),
		radial-gradient(55vw 45vw at 100% 0%, rgba(232,241,251,.45), transparent 58%),
		radial-gradient(70vw 60vw at 50% 120%, rgba(250,244,234,.55), transparent 60%),
		var(--etx-bg);
}
/* Grain overlay removed for the clean light look */
.eventix-app::after { content: none; }

.eventix-app a { color: inherit; text-decoration: none; }
/* Some themes underline all content links; keep our cards/buttons clean. */
.eventix-app a,
.eventix-app a:hover,
.eventix-app a:focus,
.eventix-app .etx-ecard,
.eventix-app .etx-ecard *,
.eventix-app .etx-poster,
.eventix-app .etx-poster * { text-decoration: none !important; }
.eventix-app img { max-width: 100%; display: block; }

/* ==========================================================================
   Reveal animation system (JS adds .etx-js, then .is-in per element)
   ========================================================================== */
.eventix-app.etx-js .etx-reveal {
	opacity: 0;
	transform: translateY(26px);
	transition: opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1);
	transition-delay: calc(var(--i, 0) * 70ms);
	will-change: opacity, transform;
}
.eventix-app.etx-js .etx-reveal.is-in { opacity: 1; transform: none; }

/* ==========================================================================
   Listing — editorial header + poster wall
   ========================================================================== */
.etx-head {
	padding: 54px 4px 30px;
	max-width: 760px;
}
.etx-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	font-size: .74rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--etx-coral);
	font-weight: 600;
	margin-bottom: 18px;
}
.etx-eyebrow::before {
	content: "";
	width: 22px; height: 1.5px; border-radius: 2px;
	background: var(--etx-coral);
}
.etx-head h1 {
	font-family: var(--etx-body);
	font-weight: 700;
	font-size: clamp(2.6rem, 6vw, 4.4rem);
	line-height: 1.0;
	letter-spacing: -.035em;
	margin: 0 0 16px;
	color: var(--etx-ink);
}
.etx-head h1 em {
	font-family: var(--etx-display);
	font-style: italic;
	font-weight: 400;
	letter-spacing: -.02em;
	color: var(--etx-coral);
	-webkit-text-fill-color: currentColor;
}
.etx-head p { color: var(--etx-muted); font-size: 1.08rem; margin: 0; max-width: 56ch; }

.etx-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(258px, 1fr));
	gap: 20px;
	padding: 14px 4px 90px;
}

.etx-poster {
	position: relative;
	display: block;
	border-radius: var(--etx-r-lg);
	overflow: hidden;
	background: var(--etx-bg-2);
	border: 1px solid var(--etx-line);
	aspect-ratio: 3 / 4;
	box-shadow: var(--etx-shadow);
	transition: transform .5s cubic-bezier(.16,1,.3,1), box-shadow .5s, border-color .5s;
	transform: translateZ(0);
}
.etx-poster:hover { transform: translateY(-4px); border-color: var(--etx-coral); box-shadow: 0 20px 44px -16px rgba(255,45,85,.32); }

.etx-poster-img {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	transition: transform .8s cubic-bezier(.16,1,.3,1);
}
.etx-poster:hover .etx-poster-img { transform: scale(1.07); }
.etx-poster-img.is-empty {
	background: linear-gradient(135deg, var(--etx-peach) 0%, var(--etx-sky-soft) 100%);
}

.etx-poster-scrim {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(10,10,10,.88) 6%, rgba(10,10,10,.42) 40%, transparent 70%);
}
.etx-poster-body {
	position: absolute;
	inset: auto 0 0 0;
	padding: 20px 20px 22px;
	z-index: 2;
}
.etx-date-chip {
	display: inline-flex;
	align-items: baseline;
	gap: 5px;
	padding: 5px 11px;
	border-radius: 999px;
	background: rgba(255,255,255,.85);
	border: 1px solid rgba(255,255,255,.7);
	backdrop-filter: blur(8px);
	font-size: .72rem;
	font-weight: 600;
	letter-spacing: .01em;
	color: var(--etx-ink-soft);
	margin-bottom: 12px;
}
.etx-date-chip b { color: var(--etx-coral); }
.etx-poster h3 {
	font-family: var(--etx-body);
	font-weight: 700;
	font-size: 1.42rem;
	line-height: 1.12;
	letter-spacing: -.02em;
	margin: 0 0 7px;
	color: #fff;
}
.etx-poster-meta {
	display: flex;
	align-items: center;
	gap: 8px;
	color: rgba(255,255,255,.78);
	font-size: .85rem;
}
.etx-price-pill {
	margin-left: auto;
	font-weight: 700;
	font-size: .82rem;
	color: #fff;
	white-space: nowrap;
}
.etx-price-pill span { color: rgba(255,255,255,.6); font-weight: 500; font-size: .72rem; }
.etx-poster-go {
	position: absolute;
	top: 16px; right: 16px;
	width: 40px; height: 40px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	background: var(--etx-ink);
	border: 1px solid var(--etx-ink);
	transform: scale(.6) rotate(-30deg);
	opacity: 0;
	transition: .45s cubic-bezier(.16,1,.3,1);
	z-index: 3;
}
.etx-poster:hover .etx-poster-go { transform: none; opacity: 1; }
.etx-poster-go svg { width: 17px; height: 17px; stroke: #fff; }

.etx-soldout-tag {
	position: absolute; top: 16px; left: 16px; z-index: 3;
	font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
	padding: 5px 10px; border-radius: 999px;
	background: rgba(255,255,255,.85); border: 1px solid rgba(255,255,255,.7); color: var(--etx-coral-deep);
	backdrop-filter: blur(8px);
}

.etx-empty {
	grid-column: 1 / -1;
	text-align: center;
	padding: 80px 20px;
	color: var(--etx-muted);
	font-size: 1.05rem;
	border: 1px dashed var(--etx-line);
	border-radius: var(--etx-r-lg);
}

/* ==========================================================================
   Detail page
   ========================================================================== */
.etx-back {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 34px 4px 18px;
	color: var(--etx-muted);
	font-weight: 600;
	font-size: .9rem;
	transition: color .3s, gap .3s;
}
.etx-back:hover { color: var(--etx-ink); gap: 12px; }
.etx-back svg { width: 16px; height: 16px; stroke: currentColor; }

.etx-hero {
	position: relative;
	margin: 0 4px;
	height: clamp(340px, 46vw, 480px);
	border-radius: var(--etx-r-lg);
	overflow: hidden;
	border: 1px solid var(--etx-line);
	box-shadow: var(--etx-shadow);
}
.etx-hero-img {
	position: absolute; inset: 0;
	background-size: cover; background-position: center;
	animation: etx-kenburns 18s ease-out forwards;
}
.etx-hero-img.is-empty { background: linear-gradient(135deg, var(--etx-peach) 0%, var(--etx-sky-soft) 100%); }
@keyframes etx-kenburns { from { transform: scale(1.12); } to { transform: scale(1); } }

.etx-hero-scrim {
	position: absolute; inset: 0;
	background: linear-gradient(to top, rgba(10,10,10,.9) 4%, rgba(10,10,10,.35) 46%, rgba(10,10,10,.1) 100%),
	            linear-gradient(to right, rgba(10,10,10,.5), transparent 55%);
}
.etx-hero-body {
	position: absolute; inset: auto 0 0 0;
	padding: clamp(24px, 4vw, 46px);
	z-index: 2;
}
.etx-chips { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 16px; }
.etx-chip {
	display: inline-flex; align-items: center; gap: 7px;
	padding: 7px 13px;
	border-radius: 999px;
	background: rgba(255,255,255,.85);
	border: 1px solid rgba(255,255,255,.7);
	backdrop-filter: blur(10px);
	font-size: .82rem; font-weight: 600; color: var(--etx-ink-soft);
}
.etx-chip svg { width: 14px; height: 14px; stroke: var(--etx-coral); }
.etx-hero-body h1 {
	font-family: var(--etx-body);
	font-weight: 700;
	font-size: clamp(2.3rem, 5.5vw, 4rem);
	line-height: 1.02;
	letter-spacing: -.03em;
	margin: 0;
	max-width: 18ch;
	color: #fff;
	text-shadow: 0 2px 30px rgba(0,0,0,.4);
}

.etx-detail {
	display: grid;
	grid-template-columns: 1.55fr 1fr;
	gap: 30px;
	padding: 32px 4px 130px;
	align-items: start;
}
@media (max-width: 860px) { .etx-detail { grid-template-columns: 1fr; } }

.etx-section-label {
	font-family: var(--etx-display);
	font-style: italic;
	font-size: 1.6rem;
	color: var(--etx-ink);
	margin: 0 0 14px;
}
.etx-about { color: var(--etx-muted); font-size: 1.06rem; line-height: 1.7; }
.etx-about p { margin: 0 0 1em; }

/* Booking panel */
.etx-panel {
	position: sticky;
	top: 24px;
	background: var(--etx-glass);
	border: 1px solid var(--etx-line);
	border-radius: var(--etx-r-lg);
	padding: 24px;
	box-shadow: var(--etx-shadow);
}
.etx-panel-title {
	font-family: var(--etx-body);
	font-weight: 700;
	font-size: 1.35rem;
	letter-spacing: -.02em;
	color: var(--etx-ink);
	margin: 0 0 4px;
}
.etx-panel-sub { color: var(--etx-faint); font-size: .85rem; margin: 0 0 20px; }

.etx-types { display: flex; flex-direction: column; gap: 12px; }
.etx-type {
	position: relative;
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 16px 18px;
	border-radius: var(--etx-r-md);
	border: 1px solid var(--etx-line);
	background: var(--etx-bg);
	cursor: pointer;
	transition: border-color .35s, background .35s, transform .25s, box-shadow .35s;
}
.etx-type:hover { border-color: var(--etx-coral); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,.05); }
.etx-type input { position: absolute; opacity: 0; pointer-events: none; }
.etx-type-radio {
	flex: 0 0 20px; width: 20px; height: 20px;
	border-radius: 50%;
	border: 2px solid var(--etx-faint);
	display: grid; place-items: center;
	transition: border-color .3s;
}
.etx-type-radio::after {
	content: ""; width: 10px; height: 10px; border-radius: 50%;
	background: var(--etx-coral); transform: scale(0); transition: transform .3s cubic-bezier(.16,1,.3,1);
}
.etx-type-info { flex: 1; min-width: 0; }
.etx-type-name { font-weight: 700; font-size: 1rem; letter-spacing: -.015em; color: var(--etx-ink); }
.etx-type-stock { font-size: .78rem; color: var(--etx-faint); margin-top: 2px; }
.etx-type-stock.low { color: var(--etx-coral-deep); }
.etx-type-price { font-weight: 700; font-size: 1.05rem; white-space: nowrap; color: var(--etx-ink); }

.etx-type.is-selected { border-color: var(--etx-coral); background: var(--etx-grad-soft); box-shadow: var(--etx-glow); }
.etx-type.is-selected .etx-type-radio { border-color: var(--etx-coral); }
.etx-type.is-selected .etx-type-radio::after { transform: scale(1); }
.etx-type.is-disabled { opacity: .42; cursor: not-allowed; pointer-events: none; }

.etx-qty-row {
	display: flex; align-items: center; justify-content: space-between;
	margin: 22px 0 6px;
}
.etx-qty-row span { color: var(--etx-muted); font-weight: 600; }
.etx-stepper {
	display: inline-flex; align-items: center;
	border: 1px solid var(--etx-line); border-radius: 999px;
	background: var(--etx-bg-2);
	overflow: hidden;
}
.etx-stepper button {
	width: 42px; height: 42px; border: 0; background: transparent;
	color: var(--etx-ink); font-size: 1.3rem; cursor: pointer;
	transition: background .25s, color .25s;
}
.etx-stepper button:hover { background: var(--etx-peach-soft); color: var(--etx-coral); }
.etx-stepper input {
	width: 46px; text-align: center; border: 0; background: transparent;
	color: var(--etx-ink); font-family: var(--etx-body); font-size: 1.05rem; font-weight: 700;
	-moz-appearance: textfield;
}
.etx-stepper input::-webkit-outer-spin-button,
.etx-stepper input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.etx-cta {
	width: 100%;
	margin-top: 18px;
	padding: 16px 26px;
	border: 0;
	border-radius: 999px;
	background: var(--etx-grad);
	color: #fff;
	font-family: var(--etx-body);
	font-weight: 700;
	font-size: 1.02rem;
	letter-spacing: -.01em;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	transition: filter .25s ease, transform .3s cubic-bezier(.16,1,.3,1), box-shadow .3s;
	box-shadow: 0 12px 28px -12px rgba(255,45,85,.6);
}
.etx-cta:hover { filter: brightness(1.05); transform: translateY(-2px); box-shadow: 0 18px 38px -14px rgba(255,45,85,.6); }
.etx-cta:active { transform: translateY(0); }
.etx-cta:disabled { background: var(--etx-line); color: var(--etx-faint); cursor: not-allowed; transform: none; box-shadow: none; filter: none; }
.etx-cta-arrow { transition: transform .25s ease; }
.etx-cta:hover .etx-cta-arrow { transform: translateX(3px); }

/* Secured-payment badge under the checkout button (replaces the old text line). */
.etx-paybadge { display: flex; justify-content: center; margin-top: 18px; }
.etx-paybadge img { display: block; width: 100%; max-width: 100%; height: auto; opacity: .95; }

/* Mobile-only secured-payment badge shown below the event details (the in-panel
   badge is hidden on mobile, where booking happens via the sticky bar). */
.etx-paybadge-mobile { display: none; }
@media (max-width: 860px) {
	.etx-paybadge-mobile { display: flex; justify-content: center; margin: 6px 4px 130px; }
	.etx-paybadge-mobile img { width: 100%; max-width: 420px; height: auto; }
}

.etx-notice {
	margin: 0 4px 18px;
	padding: 14px 18px;
	border-radius: var(--etx-r-md);
	border: 1px solid var(--etx-peach);
	background: var(--etx-peach-soft);
	color: var(--etx-coral-deep);
	font-size: .92rem;
}

/* ==========================================================================
   Loading overlay (booking submit)
   ========================================================================== */
.etx-loader {
	position: fixed; inset: 0; z-index: 99999;
	display: none;
	place-items: center;
	background: rgba(255,255,255,.86);
	backdrop-filter: blur(10px);
}
.etx-loader.is-on { display: grid; animation: etx-fade .35s ease; }
@keyframes etx-fade { from { opacity: 0; } to { opacity: 1; } }
.etx-loader-box { text-align: center; }
.etx-spinner {
	width: 68px; height: 68px; margin: 0 auto 22px;
	border-radius: 50%;
	background: conic-gradient(from 0deg, transparent, var(--etx-coral), var(--etx-coral-deep), transparent);
	-webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 5px), #000 calc(100% - 4px));
	mask: radial-gradient(farthest-side, transparent calc(100% - 5px), #000 calc(100% - 4px));
	animation: etx-spin 1s linear infinite;
}
@keyframes etx-spin { to { transform: rotate(1turn); } }
.etx-loader-box p { font-family: var(--etx-display); font-style: italic; font-size: 1.4rem; color: var(--etx-ink); margin: 0; }
.etx-loader-box small { display: block; color: var(--etx-faint); margin-top: 6px; font-family: var(--etx-body); }

/* ==========================================================================
   My Tickets
   ========================================================================== */
.etx-tickets { padding: 30px 4px 90px; display: flex; flex-direction: column; gap: 18px; }
.etx-ticket {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 22px;
	align-items: center;
	padding: 22px 24px;
	border-radius: var(--etx-r-lg);
	border: 1px solid var(--etx-line);
	background: var(--etx-glass);
	box-shadow: var(--etx-shadow);
	position: relative;
	overflow: hidden;
}
.etx-ticket::before {
	content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--etx-grad);
}
.etx-ticket.is-used { opacity: .6; }
.etx-ticket.is-used::before { background: var(--etx-line); }
.etx-ticket h4 { font-family: var(--etx-body); font-weight: 700; font-size: 1.4rem; letter-spacing: -.02em; color: var(--etx-ink); margin: 0 0 4px; }
.etx-ticket-meta { color: var(--etx-muted); font-size: .88rem; margin-bottom: 12px; }
.etx-ticket-type { color: var(--etx-coral); font-size: .8rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.etx-ticket-code {
	font-family: ui-monospace, "SF Mono", Menlo, monospace;
	font-size: 1.15rem; letter-spacing: 3px; font-weight: 700; color: var(--etx-ink); margin: 6px 0 10px;
}
.etx-qr { width: 116px; height: 116px; flex: 0 0 116px; background: #fff; border: 1px solid var(--etx-line); border-radius: 14px; padding: 8px; display: grid; place-items: center; }
.etx-qr img, .etx-qr canvas { width: 100px !important; height: 100px !important; }
.etx-status {
	display: inline-block; font-size: .68rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em;
	padding: 4px 10px; border-radius: 999px;
}
.etx-status-valid { background: var(--etx-mint-soft, #ebf6f0); color: #2f9e6b; }
.etx-status-used { background: var(--etx-line-soft); color: var(--etx-faint); }
.etx-status-cancelled { background: var(--etx-peach-soft); color: var(--etx-coral-deep); }

@media (max-width: 560px) {
	.etx-ticket { grid-template-columns: 1fr; }
	.etx-qr { justify-self: start; }
}

@media (prefers-reduced-motion: reduce) {
	.eventix-app * { animation-duration: .001ms !important; transition-duration: .001ms !important; }
	.etx-hero-img { animation: none; }
}

/* ==========================================================================
   Mobile sticky checkout bar (created by JS, lives on <body>)
   ========================================================================== */
.etx-stickybar {
	position: fixed;
	left: 0; right: 0; bottom: 0;
	z-index: 9000;
	display: none;
	align-items: center;
	gap: 14px;
	padding: 14px 18px calc(14px + env(safe-area-inset-bottom));
	background: rgba(255,255,255,.92);
	border-top: 1px solid var(--etx-line, #ececec);
	backdrop-filter: blur(18px);
	box-shadow: 0 -12px 40px -22px rgba(0,0,0,.25);
	transform: translateY(110%);
	transition: transform .45s cubic-bezier(.16,1,.3,1);
	font-family: "Plus Jakarta Sans", system-ui, sans-serif;
}
.etx-stickybar.is-on { transform: none; }
.etx-stickybar-info { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; flex: 1 1 auto; }
.etx-stickybar-label { font-size: .76rem; color: #6b6b6b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.etx-stickybar-total { font-size: 1.2rem; font-weight: 800; color: #0a0a0a; letter-spacing: -.02em; }

/* Quantity stepper inside the bar */
.etx-stickybar-stepper {
	display: inline-flex; align-items: center; flex: 0 0 auto;
	border: 1px solid var(--etx-line); border-radius: 999px; background: var(--etx-bg-2); overflow: hidden;
}
.etx-stickybar-stepper button {
	width: 38px; height: 40px; border: 0; background: transparent;
	color: var(--etx-ink); font-size: 1.2rem; line-height: 1; cursor: pointer;
	transition: background .2s, color .2s;
}
.etx-stickybar-stepper button:hover { background: var(--etx-peach-soft); color: var(--etx-coral); }
.etx-stickybar-qty { min-width: 24px; text-align: center; font-weight: 700; font-size: 1rem; color: var(--etx-ink); }

.etx-stickybar-btn {
	flex: 0 0 auto;
	border: 0;
	border-radius: 999px;
	padding: 13px 24px;
	font-family: inherit;
	font-weight: 700;
	font-size: .98rem;
	color: #fff;
	background: var(--etx-grad);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	box-shadow: 0 12px 26px -12px rgba(255,45,85,.6);
	transition: filter .25s ease, transform .2s ease, box-shadow .2s ease;
}
.etx-stickybar-btn:hover { filter: brightness(1.06); transform: translateY(-1px); box-shadow: 0 16px 32px -14px rgba(255,45,85,.65); }
.etx-stickybar-btn:active { transform: translateY(0); }

@media (max-width: 860px) {
	.etx-stickybar.is-on { display: flex; }
	/* The mobile pay badge after the details carries the clearance for the fixed
	   bar, so the details themselves only need a little breathing room. */
	.eventix-app .etx-detail { padding-bottom: 16px; }

	/* Mobile uses a single booking control — the sticky bar. So on the detail
	   panel: a single-ticket-type event hides the whole (now redundant) panel,
	   and a multi-type event keeps the type chooser but drops the duplicate
	   quantity + button + secure line. */
	.eventix-app .etx-book-form.etx-one-type { display: none; }
	.eventix-app .etx-book-form:not(.etx-one-type) .etx-qty-row,
	.eventix-app .etx-book-form:not(.etx-one-type) .etx-cta,
	.eventix-app .etx-book-form:not(.etx-one-type) .etx-paybadge { display: none; }
}
@media (min-width: 861px) {
	/* The sticky bar is a mobile-only affordance. */
	.etx-stickybar { display: none !important; }
}
@media (max-width: 420px) {
	.etx-stickybar { gap: 10px; padding-left: 12px; padding-right: 12px; }
	.etx-stickybar-btn { padding: 13px 16px; }
}

/* Live total inside the main CTA */
.etx-cta-total { opacity: .9; }
.etx-cta-total:not(:empty)::before { content: "· "; }

/* ==========================================================================
   Full events page — banner, ticker, sections (light editorial)
   ========================================================================== */

/* Shared big section heading */
.etx-display {
	font-family: var(--etx-body);
	font-weight: 700;
	font-size: clamp(2rem, 4.6vw, 3.4rem);
	line-height: 1.04;
	letter-spacing: -.035em;
	color: var(--etx-ink);
	margin: 0;
}
.etx-display em {
	font-family: var(--etx-display);
	font-style: italic;
	font-weight: 400;
	letter-spacing: -.02em;
	color: var(--etx-coral);
}

/* Banner */
.etx-banner {
	margin: 0 4px 0;
	border-radius: var(--etx-r-lg);
	overflow: hidden;
	border: 1px solid var(--etx-line);
	box-shadow: var(--etx-shadow);
	background: var(--etx-bg-2);
}
.etx-banner img { width: 100%; display: block; }
.etx-banner-mobile { display: none; }
@media (max-width: 720px) {
	/* Swap to the mobile image only when one was actually provided. Otherwise
	   keep showing the desktop image (full width) so the banner is never blank. */
	.etx-banner.has-mobile .etx-banner-desktop { display: none; }
	.etx-banner.has-mobile .etx-banner-mobile  { display: block; }
}

/* Ticker */
.etx-ticker {
	margin: 18px 4px 0;
	border-radius: 999px;
	background: var(--etx-ink);
	color: #fff;
	padding: 12px 0;
	overflow: hidden;
	white-space: nowrap;
	position: relative;
}
.etx-ticker-track {
	display: inline-flex;
	gap: 48px;
	align-items: center;
	padding-left: 48px;
	animation: etx-ticker 36s linear infinite;
}
@keyframes etx-ticker { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.etx-ticker-item {
	display: inline-flex; align-items: center; gap: 10px;
	font-size: .82rem; font-weight: 500; letter-spacing: .02em;
}
.etx-ticker-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--etx-coral); }

/* Matches / events section */
.etx-matches { padding: 56px 4px 24px; }
.etx-mhead {
	display: flex; align-items: flex-end; justify-content: space-between;
	gap: 28px; flex-wrap: wrap; margin-bottom: 36px;
}
.etx-mintro { max-width: 640px; }
.etx-mintro h1.etx-display { margin: 6px 0 14px; font-size: clamp(2.3rem, 5vw, 3.8rem); }
.etx-mintro p { color: var(--etx-muted); font-size: 1.05rem; line-height: 1.6; margin: 0; }

.etx-pricechip {
	display: flex; align-items: center; gap: 14px;
	background: var(--etx-peach-soft);
	border: 1px solid var(--etx-peach);
	padding: 13px 20px; border-radius: 999px;
}
.etx-pricechip-icon {
	width: 36px; height: 36px; border-radius: 50%;
	background: var(--etx-coral); color: #fff;
	display: grid; place-items: center; font-size: 1rem;
}
.etx-pricechip-icon svg { width: 18px; height: 18px; stroke: #fff; }
.etx-pricechip-amount { display: block; font-size: 1.4rem; font-weight: 700; letter-spacing: -.02em; color: var(--etx-ink); }
.etx-pricechip-label { display: block; font-size: .72rem; color: var(--etx-muted); }

/* Event cards */
.etx-ecards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	padding-bottom: 8px;
}
@media (max-width: 1024px) { .etx-ecards { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .etx-ecards { grid-template-columns: 1fr; } }

.etx-ecard {
	display: flex; flex-direction: column;
	background: #fff;
	border: 1px solid var(--etx-line);
	border-radius: 20px;
	overflow: hidden;
	color: var(--etx-ink);
	box-shadow: 0 1px 2px rgba(0,0,0,.03);
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.etx-ecard:hover { transform: translateY(-4px); border-color: transparent; box-shadow: var(--etx-shadow); }

.etx-ecard-top {
	position: relative;
	min-height: 168px;
	padding: 22px;
	display: flex; flex-direction: column; justify-content: space-between;
	overflow: hidden;
}
/* pastel variants for image-less cards */
.etx-ecard:nth-child(7n+1) .etx-ecard-top:not(.has-img) { background: linear-gradient(135deg, var(--etx-peach) 0%, var(--etx-peach-soft) 100%); }
.etx-ecard:nth-child(7n+2) .etx-ecard-top:not(.has-img) { background: linear-gradient(135deg, var(--etx-sky-soft) 0%, #cfe1f5 100%); }
.etx-ecard:nth-child(7n+3) .etx-ecard-top:not(.has-img) { background: linear-gradient(135deg, var(--etx-mint-soft) 0%, #cdeadb 100%); }
.etx-ecard:nth-child(7n+4) .etx-ecard-top:not(.has-img) { background: linear-gradient(135deg, #f1eefb 0%, #ddd6f4 100%); }
.etx-ecard:nth-child(7n+5) .etx-ecard-top:not(.has-img) { background: linear-gradient(135deg, #ffe1da 0%, var(--etx-peach) 100%); }
.etx-ecard:nth-child(7n+6) .etx-ecard-top:not(.has-img) { background: linear-gradient(135deg, var(--etx-cream) 0%, var(--etx-peach-soft) 100%); }
.etx-ecard:nth-child(7n)   .etx-ecard-top:not(.has-img) { background: linear-gradient(135deg, var(--etx-sky-soft) 0%, #f1eefb 100%); }
.etx-ecard-top:not(.has-img)::after {
	content: ""; position: absolute; top: -50px; right: -50px;
	width: 140px; height: 140px; border-radius: 50%;
	background: rgba(255,255,255,.35); pointer-events: none;
}
/* image cards — banner aspect 1920×800 (≈ 2.4:1) */
.etx-ecard-top.has-img {
	background-size: cover; background-position: center;
	min-height: 0; aspect-ratio: 1920 / 800;
}
.etx-ecard-top.has-img::before {
	content: ""; position: absolute; inset: 0;
	background: linear-gradient(to top, rgba(10,10,10,.82), rgba(10,10,10,.05) 70%);
}
.etx-ecard-top.has-img .etx-ecard-meta,
.etx-ecard-top.has-img .etx-ecard-title { position: relative; z-index: 1; }
.etx-ecard-top.has-img .etx-ecard-title { color: #fff; }
.etx-ecard-top.has-img .etx-ecard-date,
.etx-ecard-top.has-img .etx-ecard-tag { background: rgba(255,255,255,.85); color: var(--etx-ink-soft); }

.etx-ecard-meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.etx-ecard-date {
	display: inline-flex; align-items: center; gap: 5px;
	background: rgba(255,255,255,.65); padding: 5px 11px; border-radius: 999px;
	font-size: .72rem; font-weight: 600; color: var(--etx-ink-soft);
}
.etx-ecard-date::before { content: "📅"; font-size: .72rem; }
.etx-ecard-tag {
	font-size: .64rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
	color: var(--etx-ink-soft); background: rgba(255,255,255,.6);
	padding: 4px 9px; border-radius: 999px;
	max-width: 50%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.etx-ecard-tag--out { color: #fff; background: var(--etx-coral); }
.etx-ecard-title {
	font-family: var(--etx-body);
	font-weight: 700; font-size: 1.3rem; line-height: 1.12; letter-spacing: -.02em;
	color: var(--etx-ink); margin: 18px 0 0;
}

.etx-ecard-bottom { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 22px 20px; }
.etx-ecard-time { display: flex; flex-direction: column; gap: 2px; }
.etx-ecard-time-label { font-size: .62rem; color: var(--etx-faint); font-weight: 500; letter-spacing: .05em; text-transform: uppercase; }
.etx-ecard-time-value { font-size: .92rem; font-weight: 600; color: var(--etx-ink-soft); letter-spacing: -.01em; }
.etx-ecard-cta {
	display: inline-flex; align-items: center; gap: 6px;
	background: var(--etx-ink); color: #fff;
	padding: 9px 16px; border-radius: 999px;
	font-size: .82rem; font-weight: 600; white-space: nowrap;
	transition: background .2s, gap .2s;
}
.etx-ecard:hover .etx-ecard-cta { background: var(--etx-coral); gap: 9px; }
.etx-ecard-arrow { transition: transform .2s; }
.etx-ecard:hover .etx-ecard-arrow { transform: translateX(2px); }

/* Experience section */
.etx-exp { padding: 64px 4px; }
.etx-exp-head { max-width: 640px; margin-bottom: 32px; }
.etx-exp-head .etx-display { margin-top: 8px; }
.etx-exp-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; }
@media (max-width: 900px) { .etx-exp-grid { grid-template-columns: 1fr; gap: 32px; } }
.etx-feats { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 560px) { .etx-feats { grid-template-columns: 1fr; } }
.etx-feat {
	background: #fff; border: 1px solid var(--etx-line); border-radius: 16px; padding: 22px;
	transition: transform .25s, box-shadow .25s;
}
.etx-feat:hover { transform: translateY(-2px); box-shadow: var(--etx-shadow); }
.etx-feat-icon {
	width: 44px; height: 44px; border-radius: 12px; background: var(--etx-peach-soft);
	display: grid; place-items: center; font-size: 1.3rem; margin-bottom: 14px;
}
.etx-feat:nth-child(2) .etx-feat-icon { background: var(--etx-sky-soft); }
.etx-feat:nth-child(3) .etx-feat-icon { background: var(--etx-mint-soft); }
.etx-feat:nth-child(4) .etx-feat-icon { background: #f1eefb; }
.etx-feat-title { font-size: .98rem; font-weight: 700; color: var(--etx-ink); margin-bottom: 6px; letter-spacing: -.015em; }
.etx-feat-desc { font-size: .86rem; color: var(--etx-muted); line-height: 1.55; }

/* Ticket / price card */
.etx-ticketcard {
	background: linear-gradient(155deg, #0a0a0a 0%, #1a1a1a 100%);
	border-radius: 24px; padding: 36px; color: #fff; position: relative; overflow: hidden;
}
.etx-ticketcard::before {
	content: ""; position: absolute; top: -100px; right: -100px; width: 300px; height: 300px;
	background: radial-gradient(circle, var(--etx-coral) 0%, transparent 70%); opacity: .2; pointer-events: none;
}
.etx-ticketcard > * { position: relative; z-index: 1; }
.etx-ticketcard-label {
	display: inline-block; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.16);
	padding: 6px 14px; border-radius: 999px; font-size: .7rem; font-weight: 600; letter-spacing: .05em;
	text-transform: uppercase; margin-bottom: 18px;
}
.etx-ticketcard-pref {
	display: block; font-size: .82rem; color: rgba(255,255,255,.65);
	letter-spacing: .04em; text-transform: uppercase; font-weight: 600; margin: 14px 0 4px;
}
.etx-ticketcard-price { font-size: 3.4rem; font-weight: 700; letter-spacing: -.04em; line-height: 1; margin-bottom: 6px; }
.etx-ticketcard-price .woocommerce-Price-amount { color: #fff; }
.etx-ticketcard-tag { font-size: .9rem; color: rgba(255,255,255,.6); margin-bottom: 26px; }
.etx-ticketcard-list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 28px; }
.etx-ti-row { display: flex; align-items: center; gap: 10px; font-size: .9rem; color: rgba(255,255,255,.85); }
.etx-ti-tick { width: 18px; height: 18px; flex: 0 0 18px; border-radius: 50%; background: var(--etx-coral); color: #fff; display: grid; place-items: center; font-size: .6rem; }
.etx-ticketcard-btn {
	display: inline-flex; align-items: center; gap: 8px;
	background: var(--etx-coral); color: #fff; padding: 13px 26px; border-radius: 999px;
	font-size: .95rem; font-weight: 600; transition: background .2s, transform .2s;
}
.etx-ticketcard-btn:hover { background: var(--etx-coral-deep); transform: translateY(-1px); }

/* Venue section */
.etx-venue { padding: 64px 4px; }
.etx-venue-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
@media (max-width: 900px) { .etx-venue-grid { grid-template-columns: 1fr; gap: 36px; } }
.etx-venue-name { font-family: var(--etx-body); font-weight: 700; font-size: clamp(2rem, 4vw, 3rem); letter-spacing: -.03em; line-height: 1.05; color: var(--etx-ink); margin: 8px 0 14px; }
.etx-venue-name em { font-family: var(--etx-display); font-style: italic; font-weight: 400; color: var(--etx-coral); }
.etx-venue-loc {
	display: inline-flex; align-items: center; gap: 6px;
	background: var(--etx-peach-soft); padding: 8px 16px; border-radius: 999px;
	font-size: .82rem; font-weight: 600; color: var(--etx-ink-soft); margin-bottom: 20px;
}
.etx-venue-desc { font-size: 1rem; color: var(--etx-muted); line-height: 1.65; max-width: 460px; margin-bottom: 22px; }
.etx-venue-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.etx-vchip { background: #fff; border: 1px solid var(--etx-line); padding: 7px 14px; border-radius: 999px; font-size: .78rem; font-weight: 500; color: var(--etx-ink-soft); }
.etx-venue-visual {
	aspect-ratio: 4 / 3; border-radius: 24px; position: relative; overflow: hidden;
	background: linear-gradient(155deg, var(--etx-peach-soft) 0%, var(--etx-sky-soft) 100%);
	display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.etx-venue-visual::before {
	content: ""; position: absolute; inset: 0;
	background-image: linear-gradient(rgba(0,0,0,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(0,0,0,.04) 1px, transparent 1px);
	background-size: 32px 32px;
}
.etx-venue-pin {
	width: 60px; height: 60px; border-radius: 50%; background: var(--etx-coral); color: #fff;
	display: grid; place-items: center; font-size: 1.6rem; margin-bottom: 14px; position: relative; z-index: 1;
	box-shadow: 0 8px 24px rgba(255,45,85,.4);
}
.etx-venue-pin::after { content: ""; position: absolute; inset: -8px; border: 2px solid var(--etx-coral); border-radius: 50%; opacity: .3; animation: etx-pulse 2s ease-out infinite; }
@keyframes etx-pulse { 0% { transform: scale(.9); opacity: .5; } 100% { transform: scale(1.5); opacity: 0; } }
.etx-venue-visual-text { position: relative; z-index: 1; text-align: center; }
.etx-venue-visual-text strong { display: block; font-size: 1.2rem; font-weight: 700; color: var(--etx-ink); letter-spacing: -.02em; }
.etx-venue-visual-text span { font-size: .82rem; color: var(--etx-muted); }

/* Bottom CTA */
.etx-cta-section { padding: 48px 4px 80px; }
.etx-ctacard {
	background: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 100%);
	border-radius: 32px; padding: 72px 40px; text-align: center; color: #fff; position: relative; overflow: hidden;
}
.etx-ctacard::before { content: ""; position: absolute; top: -150px; right: -150px; width: 400px; height: 400px; background: radial-gradient(circle, var(--etx-coral) 0%, transparent 70%); opacity: .25; pointer-events: none; }
.etx-ctacard::after  { content: ""; position: absolute; bottom: -150px; left: -150px; width: 400px; height: 400px; background: radial-gradient(circle, #b8d4f0 0%, transparent 70%); opacity: .15; pointer-events: none; }
.etx-ctacard > * { position: relative; z-index: 1; }
.etx-ctacard-eyebrow {
	display: inline-block; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.16);
	padding: 7px 16px; border-radius: 999px; font-size: .72rem; font-weight: 600; letter-spacing: .04em;
	text-transform: uppercase; color: rgba(255,255,255,.85); margin-bottom: 22px;
}
.etx-ctacard-title { font-family: var(--etx-body); font-size: clamp(2.2rem, 5vw, 3.6rem); font-weight: 700; letter-spacing: -.035em; line-height: 1.05; margin-bottom: 14px; color: #fff; }
.etx-ctacard-title em { font-family: var(--etx-display); font-style: italic; font-weight: 400; color: var(--etx-coral); }
.etx-ctacard-sub { font-size: 1.05rem; color: rgba(255,255,255,.7); max-width: 480px; margin: 0 auto 32px; line-height: 1.6; }
.etx-ctacard-btn {
	display: inline-flex; align-items: center; gap: 9px;
	background: var(--etx-grad); color: #fff; padding: 16px 34px; border-radius: 999px;
	font-size: 1rem; font-weight: 700; letter-spacing: -.015em; text-decoration: none;
	box-shadow: 0 14px 32px -12px rgba(255,45,85,.65);
	transition: filter .2s, transform .2s, box-shadow .2s;
}
.etx-ctacard-btn:hover { filter: brightness(1.06); transform: translateY(-2px); box-shadow: 0 18px 40px -12px rgba(255,45,85,.7); }

/* ==========================================================================
   Booking confirmation
   ========================================================================== */
.etx-confirm { padding: 40px 4px 90px; }
.etx-confirm-head { max-width: 640px; margin: 0 auto 32px; text-align: center; }
.etx-confirm-badge {
	display: inline-flex; align-items: center; gap: 7px;
	background: var(--etx-mint-soft); color: #2f9e6b;
	padding: 7px 16px; border-radius: 999px; font-size: .8rem; font-weight: 700;
	letter-spacing: .02em; margin-bottom: 18px;
}
.etx-confirm-badge svg { width: 15px; height: 15px; stroke: #2f9e6b; }
.etx-confirm-head h1 {
	font-family: var(--etx-body); font-weight: 700; font-size: clamp(2.2rem, 5vw, 3.4rem);
	letter-spacing: -.035em; line-height: 1.02; margin: 0 0 12px; color: var(--etx-ink);
}
.etx-confirm-head h1 em { font-family: var(--etx-display); font-style: italic; font-weight: 400; color: var(--etx-coral); }
.etx-confirm-head p { color: var(--etx-muted); font-size: 1.02rem; margin: 0; }
.etx-confirm-tickets { display: flex; flex-direction: column; gap: 18px; max-width: 760px; margin: 0 auto; }
.etx-confirm-foot { text-align: center; margin-top: 26px; }
.etx-confirm-foot a { color: var(--etx-coral); font-weight: 600; }

.etx-confirm-pending {
	max-width: 520px; margin: 0 auto; text-align: center;
	background: #fff; border: 1px solid var(--etx-line); border-radius: var(--etx-r-lg);
	padding: 40px 28px; box-shadow: var(--etx-shadow);
}
.etx-confirm-pending h3 { font-family: var(--etx-body); font-weight: 700; font-size: 1.3rem; letter-spacing: -.02em; color: var(--etx-ink); margin: 8px 0 8px; }
.etx-confirm-pending p { color: var(--etx-muted); font-size: .96rem; margin: 0 0 22px; }
.etx-spinner--inline { width: 48px; height: 48px; margin: 0 auto 6px; }
.etx-confirm-refresh { width: auto; display: inline-block; margin-top: 0; padding: 12px 28px; }

/* ==========================================================================
   Fixed site header + footer (shared across plugin pages)
   ========================================================================== */
.etx-header {
	position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
	background: rgba(255,255,255,.82);
	-webkit-backdrop-filter: saturate(180%) blur(14px);
	backdrop-filter: saturate(180%) blur(14px);
	border-bottom: 1px solid var(--etx-line);
}
.etx-header-inner {
	max-width: 1280px; margin: 0 auto; padding: 0 24px;
	height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 18px;
}
.etx-header-brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; }
.etx-header-logo {
	width: 32px; height: 32px; border-radius: 999px;
	background: var(--etx-grad); color: #fff;
	display: inline-grid; place-items: center; line-height: 1; flex: 0 0 32px;
	box-shadow: 0 6px 14px -6px rgba(255,45,85,.55);
}
.etx-header-logo svg { width: 18px; height: 18px; stroke: #fff; }
.etx-header-name {
	font-family: var(--etx-body); font-weight: 800; font-size: 1.05rem;
	letter-spacing: -.02em; color: var(--etx-ink); white-space: nowrap;
}
.etx-header-nav { display: flex; align-items: center; gap: 26px; }
.etx-header-nav > a {
	font-size: .92rem; font-weight: 600; color: var(--etx-ink-soft);
	text-decoration: none; letter-spacing: -.01em; transition: color .15s;
}
.etx-header-nav > a:hover { color: var(--etx-coral); }
.etx-header-cta {
	background: var(--etx-grad); color: #fff !important;
	padding: 10px 20px; border-radius: 999px; font-weight: 700 !important;
	box-shadow: 0 8px 20px -8px rgba(255,26,71,.6); transition: transform .18s, box-shadow .18s;
}
.etx-header-cta:hover { transform: translateY(-1px); box-shadow: 0 12px 26px -8px rgba(255,26,71,.7); }

/* Mobile menu toggle — hidden on desktop, becomes a hamburger on small screens. */
.etx-nav-toggle { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.etx-burger {
	display: none; flex: 0 0 auto; width: 42px; height: 42px;
	border-radius: 12px; border: 1px solid var(--etx-line); background: #fff;
	cursor: pointer; align-items: center; justify-content: center; flex-direction: column; gap: 5px;
	transition: border-color .15s;
}
.etx-burger span {
	display: block; width: 20px; height: 2px; border-radius: 2px; background: var(--etx-ink);
	transition: transform .25s ease, opacity .2s ease;
}
.etx-burger:hover { border-color: var(--etx-coral); }

/* Push page content below the fixed header. */
.etx-app-body { padding-top: 64px; }

@media (max-width: 768px) {
	.etx-header-inner { padding: 0 16px; height: 58px; position: relative; }
	.etx-app-body { padding-top: 58px; }
	.etx-header-name { display: none; }

	/* Show the hamburger, collapse the inline nav into a dropdown panel. */
	.etx-burger { display: inline-flex; }
	.etx-header-nav {
		position: absolute; top: 100%; left: 0; right: 0;
		flex-direction: column; align-items: stretch; gap: 0;
		background: #fff; border-bottom: 1px solid var(--etx-line);
		box-shadow: 0 18px 40px -20px rgba(0,0,0,.25);
		padding: 8px; display: none;
	}
	.etx-nav-toggle:checked ~ .etx-header-nav { display: flex; }
	.etx-header-nav > a {
		font-size: 1rem; padding: 14px 14px; border-radius: 12px;
		display: block; width: 100%;
	}
	.etx-header-nav > a:not(.etx-header-cta):hover { background: var(--etx-peach-soft); }
	.etx-header-cta {
		text-align: center; margin-top: 6px; padding: 14px 20px;
	}

	/* Animate the hamburger into a close (X) when open. */
	.etx-nav-toggle:checked ~ .etx-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
	.etx-nav-toggle:checked ~ .etx-burger span:nth-child(2) { opacity: 0; }
	.etx-nav-toggle:checked ~ .etx-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
}

@media (max-width: 600px) {
	.etx-header-logo-img { height: 28px; max-width: 140px; }
}

/* Footer */
.etx-footer {
	margin-top: 40px; border-top: 1px solid var(--etx-line);
	background: var(--etx-bg-warm);
	/* Full-bleed: break out of the theme's constrained content container so the
	   footer background spans the entire viewport width. Inner content stays
	   centred via .etx-footer-inner / .etx-footer-bottom max-widths. */
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}
.etx-footer-inner {
	max-width: 1280px; margin: 0 auto; padding: 48px 24px 28px;
	display: flex; flex-wrap: wrap; gap: 28px; justify-content: space-between; align-items: flex-start;
}
.etx-footer-brand { max-width: 420px; }
.etx-footer-logo {
	width: 32px; height: 32px; border-radius: 999px;
	background: var(--etx-grad); color: #fff;
	display: inline-grid; place-items: center; vertical-align: middle;
}
.etx-footer-logo svg { width: 18px; height: 18px; stroke: #fff; }
.etx-footer-name {
	font-family: var(--etx-body); font-weight: 800; font-size: 1.1rem;
	letter-spacing: -.02em; color: var(--etx-ink); margin-left: 8px;
}
.etx-footer-tag { margin: 12px 0 0; color: var(--etx-muted); font-size: .92rem; line-height: 1.6; }
.etx-footer-links { display: flex; flex-direction: column; gap: 10px; }
.etx-footer-links a { color: var(--etx-ink-soft); text-decoration: none; font-size: .92rem; font-weight: 600; }
.etx-footer-links a:hover { color: var(--etx-coral); }
.etx-footer-bottom {
	max-width: 1280px; margin: 0 auto; padding: 18px 24px 40px;
	display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between;
	color: var(--etx-faint); font-size: .82rem; border-top: 1px solid var(--etx-line-soft);
}
.etx-footer-secure { display: inline-flex; align-items: center; gap: 6px; }
.etx-footer-secure svg { width: 13px; height: 13px; stroke: currentColor; }

/* CTA button: never render blank — keep label readable */
.etx-ctacard-btn .etx-ctacard-btn-text { display: inline-block; min-width: 1ch; }

/* ==========================================================================
   Download ticket button (confirmation page)
   ========================================================================== */
.etx-ticket-download {
	display: inline-flex; align-items: center; gap: 8px; margin-top: 14px;
	background: var(--etx-ink); color: #fff; border: 0; cursor: pointer;
	padding: 11px 20px; border-radius: 999px; font-family: var(--etx-body);
	font-size: .9rem; font-weight: 600; letter-spacing: -.01em;
	transition: transform .18s, box-shadow .18s, background .18s;
}
.etx-ticket-download svg { width: 17px; height: 17px; stroke: currentColor; }
.etx-ticket-download:hover { transform: translateY(-2px); box-shadow: 0 12px 26px -10px rgba(0,0,0,.5); }
.etx-ticket-download.is-busy { opacity: .6; pointer-events: none; }
.etx-ticket-download.is-busy span { opacity: .8; }

/* ==========================================================================
   Mobile compact + responsive refinements (v1.3)
   ========================================================================== */
@media (max-width: 720px) {
	/* Tighter section padding so the page is less scrolly */
	.etx-matches { padding: 28px 4px 32px; }
	.etx-mhead { gap: 14px; margin-bottom: 18px; }
	.etx-display { font-size: clamp(1.7rem, 7vw, 2.3rem); line-height: 1.08; }
	.etx-mintro p { font-size: .95rem; }

	.etx-ecards { gap: 14px; }
	.etx-ecard-bottom { padding: 14px 18px; }
	.etx-ecard-title { font-size: 1.05rem !important; line-height: 1.25; }

	.etx-exp { padding: 36px 4px 36px; }
	.etx-exp-head { margin-bottom: 22px; }
	.etx-exp-grid { gap: 18px; }
	.etx-feat { padding: 16px; }
	.etx-feat-icon { font-size: 1.6rem; }
	.etx-feat-title { font-size: 1rem; }
	.etx-feat-desc { font-size: .85rem; }
	.etx-ticketcard { padding: 26px 22px; }
	.etx-ticketcard-price { font-size: 2.4rem; }

	.etx-venue { padding: 32px 4px; }
	.etx-venue-grid { gap: 18px; }
	.etx-venue-info { padding: 22px 18px; }
	.etx-venue-name { font-size: 1.5rem; }
	.etx-venue-visual { min-height: 220px; padding: 22px; }

	.etx-cta-section { padding: 28px 4px 56px; }
	.etx-ctacard { padding: 44px 22px; border-radius: 22px; }
	.etx-ctacard-title { font-size: clamp(1.7rem, 6.5vw, 2.4rem); margin-bottom: 10px; }
	.etx-ctacard-sub { font-size: .95rem; margin-bottom: 22px; }
	.etx-ctacard-btn { padding: 13px 26px; font-size: .95rem; }

	/* Single event page — compact + no hero animation. The hero matches the
	   recommended 1920×800 banner ratio (12:5) on mobile and uses the full image
	   (no crop, no Ken Burns zoom) so the whole banner is visible. */
	.etx-hero { margin-top: 14px; height: auto; aspect-ratio: 12 / 5; }
	.etx-hero-img { animation: none; transform: none; background-size: cover; background-position: center; }
	.etx-hero-body { padding: 18px 18px 22px; }
	.etx-hero-body h1 { font-size: clamp(1.6rem, 6.5vw, 2.2rem); }
	.etx-detail { padding: 28px 4px 40px; gap: 22px; }
	.etx-detail .etx-section-label { font-size: .72rem; margin-bottom: 10px; }
	.etx-about { font-size: .96rem; }
	.etx-panel { padding: 20px 18px; }
	.etx-panel-title { font-size: 1.15rem; }
	.etx-type { padding: 12px 14px; }

	.etx-back { margin: 12px 4px 0; }

	/* Banner: no extra space above on mobile either */
	.etx-banner { margin: 0; border-radius: var(--etx-r-md); }

	/* Confirmation */
	.etx-confirm { padding: 22px 4px 56px; }
	.etx-confirm-head { margin-bottom: 22px; }
	.etx-confirm-head h1 { font-size: clamp(1.6rem, 7vw, 2.3rem); }
	.etx-ticket { padding: 18px; gap: 14px; }
	.etx-ticket h4 { font-size: 1.15rem; }
	.etx-qr { width: 96px; height: 96px; flex: 0 0 96px; }
	.etx-qr img, .etx-qr canvas { width: 84px !important; height: 84px !important; }
}

/* FE7 — keep the single-event hero static on mobile (no slide/fade) */
@media (max-width: 720px) {
	.eventix-app.etx-js .etx-hero.etx-reveal,
	.eventix-app.etx-js .etx-hero .etx-reveal {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
		animation: none !important;
	}
	/* Image inside hero never animates on mobile */
	.etx-hero-img { animation: none !important; transform: none !important; }
}

/* FE4 — login card */
.etx-login {
	max-width: 440px; margin: 32px auto; padding: 32px 28px;
	background: #fff; border: 1px solid var(--etx-line); border-radius: var(--etx-r-lg);
	box-shadow: var(--etx-shadow);
}
.etx-login h2 {
	font-family: var(--etx-body); font-weight: 800; font-size: 1.6rem;
	letter-spacing: -.02em; color: var(--etx-ink); margin: 0 0 6px; text-align: center;
}
.etx-login p { color: var(--etx-muted); font-size: .95rem; text-align: center; margin: 0 0 22px; }
.etx-login .login-username,
.etx-login .login-password { margin-bottom: 12px; }
.etx-login label {
	display: block; font-size: .82rem; font-weight: 600;
	color: var(--etx-ink-soft); margin-bottom: 6px; letter-spacing: -.005em;
}
.etx-login .input,
.etx-login input[type="text"],
.etx-login input[type="email"],
.etx-login input[type="password"] {
	width: 100%; padding: 12px 14px; border: 1px solid var(--etx-line);
	border-radius: var(--etx-r-sm); font-family: var(--etx-body); font-size: 1rem;
	color: var(--etx-ink); background: #fff; transition: border-color .15s, box-shadow .15s;
}
.etx-login input:focus { outline: none; border-color: var(--etx-coral); box-shadow: 0 0 0 3px rgba(255,45,85,.12); }
.etx-login .login-remember { display: flex; align-items: center; gap: 8px; margin: 10px 0 18px; color: var(--etx-muted); font-size: .9rem; }
.etx-login .login-submit { margin-top: 8px; }
.etx-login .button-primary,
.etx-login input[type="submit"] {
	width: 100%; background: var(--etx-grad); color: #fff !important;
	border: 0; padding: 13px 22px; border-radius: 999px;
	font-family: var(--etx-body); font-weight: 700; font-size: 1rem; cursor: pointer;
	letter-spacing: -.01em; box-shadow: 0 10px 24px -10px rgba(255,45,85,.6);
	transition: transform .18s, box-shadow .18s;
}
.etx-login .button-primary:hover,
.etx-login input[type="submit"]:hover { transform: translateY(-1px); box-shadow: 0 14px 30px -10px rgba(255,45,85,.7); }
.etx-login-foot { text-align: center; margin-top: 18px; font-size: .88rem; color: var(--etx-muted); }
.etx-login-foot a { color: var(--etx-coral); font-weight: 600; text-decoration: none; }

/* Make all major reveals trigger immediately if user prefers reduced motion */
@media (prefers-reduced-motion: reduce) {
	.eventix-app.etx-js .etx-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* FE1 — hide WordPress / theme page titles on Eventix pages, even when themes
   render them via the_title or post_title outside the_content filter. */
.eventix-page .entry-title,
.eventix-page .page-title,
.eventix-page .post-title,
.eventix-page .wp-block-post-title,
.eventix-page .elementor-page-title,
.eventix-page .breadcrumbs,
.eventix-page .single-page-banner,
.eventix-page .page-header > h1,
.eventix-page header.entry-header,
.eventix-page header.page-header { display: none !important; }

/* ==========================================================================
   Super Admin dashboard
   ========================================================================== */
.eventix-app.eventix-dash { max-width: 1320px; }
.etx-dash { padding: 28px 20px 56px; }
@media (max-width: 720px) { .etx-dash { padding: 18px 12px 40px; } }

.etx-dash-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin-bottom: 18px; }
.etx-dash-head h1 { font-size: clamp(1.8rem, 4vw, 2.6rem); margin: 4px 0 0; }
.etx-dash-actions { display: flex; gap: 10px; }
.etx-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	border: 0; cursor: pointer; padding: 11px 18px; border-radius: 12px;
	font-family: var(--etx-body); font-weight: 600; font-size: .92rem; letter-spacing: -.005em;
	transition: transform .15s, box-shadow .15s, background .15s;
}
.etx-btn--primary { background: var(--etx-coral); color: #fff; box-shadow: 0 10px 22px -10px rgba(255,45,85,.55); }
.etx-btn--primary:hover { transform: translateY(-1px); box-shadow: 0 14px 28px -10px rgba(255,45,85,.7); }
.etx-btn--ghost { background: #fff; color: var(--etx-ink); border: 1px solid var(--etx-line); }
.etx-btn--ghost:hover { border-color: var(--etx-coral); color: var(--etx-coral); }

/* Filters bar */
.etx-dash-filters {
	display: flex; flex-wrap: wrap; gap: 12px; align-items: end;
	background: #fff; border: 1px solid var(--etx-line); border-radius: 16px;
	padding: 14px; box-shadow: var(--etx-shadow); margin-bottom: 22px;
}
.etx-dash-range { display: inline-flex; padding: 4px; background: var(--etx-bg-2); border-radius: 10px; gap: 4px; }
.etx-rng {
	border: 0; background: transparent; color: var(--etx-muted);
	font-family: var(--etx-body); font-weight: 600; font-size: .85rem;
	padding: 8px 14px; border-radius: 8px; cursor: pointer; transition: background .15s, color .15s;
}
.etx-rng:hover { color: var(--etx-ink); }
.etx-rng.is-active { background: var(--etx-coral); color: #fff; box-shadow: 0 6px 14px -6px rgba(255,45,85,.5); }

.etx-dash-field { display: flex; flex-direction: column; gap: 4px; }
.etx-dash-field span {
	font-size: .72rem; font-weight: 700; color: var(--etx-faint);
	text-transform: uppercase; letter-spacing: .06em;
}
.etx-dash-field input,
.etx-dash-field select {
	padding: 9px 12px; border: 1px solid var(--etx-line); border-radius: 10px;
	font-family: var(--etx-body); font-size: .9rem; color: var(--etx-ink); background: #fff;
	min-width: 150px;
}
.etx-dash-field input:focus,
.etx-dash-field select:focus { outline: none; border-color: var(--etx-coral); box-shadow: 0 0 0 3px rgba(255,45,85,.12); }

.etx-dash-sect {
	font-family: var(--etx-body); font-weight: 800; font-size: 1.15rem;
	letter-spacing: -.015em; color: var(--etx-ink); margin: 8px 0 14px;
}

/* KPI cards */
.etx-kpis {
	display: grid; gap: 14px; margin-bottom: 22px;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}
.etx-kpi {
	background: #fff; border: 1px solid var(--etx-line); border-radius: 16px;
	padding: 18px 18px 16px; box-shadow: var(--etx-shadow);
	display: flex; flex-direction: column; gap: 6px; min-height: 110px;
}
.etx-kpi-label {
	font-size: .72rem; font-weight: 700; color: var(--etx-faint);
	text-transform: uppercase; letter-spacing: .06em;
}
.etx-kpi-value {
	font-family: var(--etx-body); font-weight: 800; font-size: clamp(1.5rem, 3vw, 2rem);
	letter-spacing: -.025em; color: var(--etx-ink); margin-top: 2px;
}

/* Charts */
.etx-charts {
	display: grid; gap: 16px; margin-bottom: 22px;
	grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
}
.etx-chart-card {
	background: #fff; border: 1px solid var(--etx-line); border-radius: 16px;
	padding: 18px; box-shadow: var(--etx-shadow); min-height: 240px;
}
.etx-chart-head {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	margin-bottom: 12px; color: var(--etx-ink);
}
.etx-chart-head strong { font-size: 1rem; font-weight: 700; letter-spacing: -.015em; }
.etx-chart-legend { font-size: .82rem; color: var(--etx-muted); }

.etx-donut-wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: center; }
.etx-donut-legend { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.etx-donut-legend li { display: flex; align-items: center; gap: 10px; font-size: .9rem; color: var(--etx-ink); }
.etx-donut-legend .etx-dot { width: 10px; height: 10px; border-radius: 50%; flex: 0 0 10px; }
.etx-donut-legend .etx-leg-name { flex: 1; color: var(--etx-ink-soft); }
.etx-donut-legend .etx-leg-val { font-weight: 700; color: var(--etx-ink); }
@media (max-width: 540px) { .etx-donut-wrap { grid-template-columns: 1fr; } }

/* Table */
.etx-dash-table {
	background: #fff; border: 1px solid var(--etx-line); border-radius: 16px;
	box-shadow: var(--etx-shadow); overflow: hidden;
}
.etx-dash-tablehead {
	display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
	padding: 16px 18px; border-bottom: 1px solid var(--etx-line); background: var(--etx-bg-2);
}
.etx-dash-tablehead strong { font-size: 1rem; font-weight: 700; color: var(--etx-ink); }
.etx-dash-tableactions { display: flex; gap: 10px; align-items: center; }
.etx-dash-tableactions select {
	padding: 9px 12px; border: 1px solid var(--etx-line); border-radius: 10px;
	font-family: var(--etx-body); font-size: .88rem; background: #fff;
}
.etx-dash-tablewrap { overflow-x: auto; }
.etx-table { width: 100%; border-collapse: collapse; min-width: 760px; }
.etx-table th, .etx-table td { text-align: left; padding: 12px 14px; font-size: .88rem; }
.etx-table th {
	font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
	color: var(--etx-faint); background: #fff; border-bottom: 1px solid var(--etx-line);
}
.etx-table tbody tr { border-bottom: 1px solid var(--etx-line-soft); }
.etx-table tbody tr:hover { background: #fafafa; }
.etx-table code {
	background: var(--etx-bg-2); padding: 3px 8px; border-radius: 6px;
	font-family: "JetBrains Mono", "Courier New", monospace; font-size: .82rem; color: var(--etx-ink);
}
.etx-table .etx-table-sub { color: var(--etx-muted); font-size: .8rem; }
.etx-dash-loading { padding: 28px; text-align: center; color: var(--etx-muted); }

.etx-dash.is-loading .etx-kpi-value,
.etx-dash.is-loading .etx-chart-card { opacity: .55; transition: opacity .2s; }

/* Status pills */
.etx-status { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: .75rem; font-weight: 700; }
.etx-status-valid { background: var(--etx-mint-soft); color: #2f9e6b; }
.etx-status-used  { background: rgba(255,45,85,.1); color: var(--etx-coral-deep); }
.etx-status-refunded, .etx-status-cancelled { background: #fef3c7; color: #b45309; }

/* ==========================================================================
   Check-in scanner
   ========================================================================== */
.eventix-app.eventix-checkin { max-width: 1180px; }
.etx-checkin { padding: 28px 20px 56px; }
@media (max-width: 720px) { .etx-checkin { padding: 18px 12px 40px; } }

.etx-checkin-head { max-width: 720px; margin-bottom: 24px; }
.etx-checkin-head h1 { font-size: clamp(1.8rem, 5vw, 2.6rem); margin: 4px 0 8px; }
.etx-checkin-head p { color: var(--etx-muted); font-size: .98rem; }

.etx-checkin-grid {
	display: grid; gap: 22px;
	grid-template-columns: minmax(320px, 1fr) minmax(280px, 1fr);
}
@media (max-width: 880px) { .etx-checkin-grid { grid-template-columns: 1fr; } }

.etx-checkin-scanner,
.etx-checkin-side {
	background: #fff; border: 1px solid var(--etx-line); border-radius: 16px;
	padding: 20px; box-shadow: var(--etx-shadow);
}
.etx-qr-reader {
	background: #000; border-radius: 14px; overflow: hidden;
	aspect-ratio: 1 / 1; max-width: 460px; margin: 0 auto; width: 100%;
	display: flex; align-items: center; justify-content: center;
	color: #6b7280; font-size: .9rem;
}
.etx-qr-reader:empty::before { content: 'Camera preview will appear here.'; }
.etx-checkin-actions { display: flex; gap: 10px; margin: 14px 0 4px; }
.etx-checkin-manual { display: flex; gap: 10px; align-items: end; margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--etx-line); }
.etx-checkin-manual .etx-dash-field { flex: 1; }
.etx-checkin-manual input { font-family: "JetBrains Mono", "Courier New", monospace; letter-spacing: .04em; }

.etx-checkin-stats { display: flex; gap: 12px; margin-bottom: 16px; }
.etx-checkin-stats > div {
	flex: 1; background: var(--etx-bg-2); border-radius: 12px; padding: 14px 16px;
}
.etx-checkin-stats span { display: block; font-size: .7rem; font-weight: 700; color: var(--etx-faint); text-transform: uppercase; letter-spacing: .06em; }
.etx-checkin-stats strong { display: block; font-size: 1.8rem; font-weight: 800; color: var(--etx-ink); margin-top: 4px; }

.etx-checkin-result {
	border-radius: 14px; padding: 18px; margin-bottom: 16px;
	background: var(--etx-bg-2); min-height: 110px; transition: background .2s, border-color .2s;
	border: 1px solid var(--etx-line);
}
.etx-checkin-result .etx-empty { color: var(--etx-muted); text-align: center; margin: 12px 0; }
.etx-checkin-banner {
	font-weight: 700; font-size: 1.05rem; letter-spacing: -.01em; margin-bottom: 10px;
}
.etx-checkin-card { background: #fff; border: 1px solid var(--etx-line); border-radius: 10px; padding: 14px; }
.etx-checkin-label {
	font-family: "JetBrains Mono", "Courier New", monospace;
	font-weight: 700; font-size: .95rem; color: var(--etx-ink); margin-bottom: 6px;
}
.etx-checkin-event { font-weight: 700; font-size: 1.05rem; color: var(--etx-ink); margin-bottom: 4px; }
.etx-checkin-meta { color: var(--etx-muted); font-size: .88rem; }

.etx-checkin-result.is-ok { background: var(--etx-mint-soft); border-color: #cdeadb; }
.etx-checkin-result.is-ok .etx-checkin-banner { color: #16785b; }
.etx-checkin-result.is-already_used { background: #fef3c7; border-color: #fde68a; }
.etx-checkin-result.is-already_used .etx-checkin-banner { color: #b45309; }
.etx-checkin-result.is-unknown,
.etx-checkin-result.is-invalid,
.etx-checkin-result.is-not_valid,
.etx-checkin-result.is-wrong_event { background: #fee2e2; border-color: #fecaca; }
.etx-checkin-result.is-unknown .etx-checkin-banner,
.etx-checkin-result.is-invalid .etx-checkin-banner,
.etx-checkin-result.is-not_valid .etx-checkin-banner,
.etx-checkin-result.is-wrong_event .etx-checkin-banner { color: #b91c1c; }

.etx-checkin-loglabel {
	font-family: var(--etx-body); font-weight: 800; font-size: .82rem;
	letter-spacing: .06em; text-transform: uppercase; color: var(--etx-faint); margin: 18px 0 8px;
}
.etx-checkin-log { list-style: none; padding: 0; margin: 0; max-height: 320px; overflow: auto; }
.etx-log-item {
	display: grid; grid-template-columns: 64px 20px 1fr auto; gap: 8px; align-items: center;
	padding: 8px 4px; border-bottom: 1px solid var(--etx-line-soft); font-size: .85rem;
}
.etx-log-time { color: var(--etx-faint); font-family: "JetBrains Mono", monospace; font-size: .78rem; }
.etx-log-icon { font-weight: 800; }
.etx-log-item.is-ok .etx-log-icon { color: #16a34a; }
.etx-log-item:not(.is-ok) .etx-log-icon { color: #b91c1c; }
.etx-log-code { font-family: "JetBrains Mono", monospace; font-size: .82rem; color: var(--etx-ink); }
.etx-log-msg { color: var(--etx-muted); text-align: right; font-size: .82rem; }

/* My Tickets — guest notice (shown when not logged in & no recent purchase) */
.etx-head-sub {
	max-width: 640px; margin: 10px 0 0; color: var(--etx-muted); font-size: .98rem; line-height: 1.55;
}
.etx-tickets-notice {
	max-width: 640px; margin: 0 auto;
	background: #fff; border: 1px solid var(--etx-line); border-radius: var(--etx-r-lg);
	box-shadow: var(--etx-shadow); padding: 40px 32px;
	text-align: center;
}
.etx-tickets-notice-icon {
	width: 56px; height: 56px; margin: 0 auto 18px;
	background: var(--etx-peach-soft); color: var(--etx-coral); border-radius: 999px;
	display: grid; place-items: center;
}
.etx-tickets-notice-icon svg { width: 28px; height: 28px; stroke: var(--etx-coral); }
.etx-tickets-notice-title {
	font-family: var(--etx-body); font-weight: 800; font-size: clamp(1.3rem, 3.6vw, 1.7rem);
	letter-spacing: -.02em; color: var(--etx-ink); margin: 0 0 18px;
}
.etx-tickets-notice-list {
	list-style: none; counter-reset: notice; padding: 0; margin: 0 auto 26px;
	text-align: left; max-width: 480px;
}
.etx-tickets-notice-list li {
	counter-increment: notice; position: relative;
	padding: 14px 14px 14px 56px; margin-bottom: 10px;
	background: var(--etx-bg-2); border-radius: 12px; line-height: 1.55;
	color: var(--etx-ink-soft); font-size: .96rem;
}
.etx-tickets-notice-list li::before {
	content: counter(notice);
	position: absolute; left: 14px; top: 14px;
	width: 28px; height: 28px; border-radius: 999px;
	background: var(--etx-coral); color: #fff;
	display: grid; place-items: center;
	font-weight: 800; font-size: .85rem; line-height: 1;
}
.etx-tickets-notice-list strong { color: var(--etx-ink); display: block; margin-bottom: 2px; font-weight: 700; }
.etx-tickets-notice-actions {
	display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-bottom: 16px;
}
.etx-cta.etx-cta--ghost {
	background: #fff !important; color: var(--etx-coral) !important;
	border: 1.5px solid var(--etx-coral); box-shadow: none;
}
.etx-cta.etx-cta--ghost:hover {
	background: var(--etx-peach-soft) !important; color: var(--etx-coral-deep) !important;
	box-shadow: 0 8px 18px -10px rgba(255,45,85,.3);
}
.etx-tickets-notice-foot {
	color: var(--etx-faint); font-size: .85rem; line-height: 1.55; margin: 18px 0 0;
}
@media (max-width: 540px) {
	.etx-tickets-notice { padding: 28px 18px; }
	.etx-tickets-notice-list { max-width: none; }
	.etx-tickets-notice-actions a { flex: 1 1 100%; }
}

/* Lock Chart.js canvases to a fixed height so the dashboard doesn't keep
   auto-resizing on every render. */
.etx-chart-canvas { position: relative; height: 220px; width: 100%; }
.etx-chart-canvas--donut { height: 220px; max-width: 220px; margin: 0 auto; }
.etx-chart-canvas--bar { height: 260px; }
.etx-chart-canvas > canvas { width: 100% !important; height: 100% !important; display: block; }
@media (max-width: 720px) {
	.etx-chart-canvas { height: 200px; }
	.etx-chart-canvas--bar { height: 240px; }
}

/* ==========================================================================
   My Tickets — notice card visibility & button overrides (v1.3.1)
   Themes can win specificity for <a> color rules; bump ours with !important
   so the "Sign in" button text is always visible against the black pill.
   ========================================================================== */

/* Force notice card always visible — it's static, not animated. Belt-and-
   braces in case the IntersectionObserver hasn't fired yet on mobile. */
.eventix-app .etx-tickets-notice {
	opacity: 1 !important;
	transform: none !important;
}

/* Make the primary CTA bulletproof against theme link styles. */
.eventix-app a.etx-cta,
.eventix-app .etx-cta,
.eventix-app a.etx-ctacard-btn,
.eventix-app .etx-ctacard-btn {
	color: #fff !important;
	text-decoration: none !important;
}
.eventix-app a.etx-cta:hover,
.eventix-app .etx-cta:hover,
.eventix-app a.etx-ctacard-btn:hover,
.eventix-app .etx-ctacard-btn:hover {
	color: #fff !important;
}
/* Ghost variant text stays coral. */
.eventix-app a.etx-cta.etx-cta--ghost,
.eventix-app .etx-cta.etx-cta--ghost {
	color: var(--etx-coral) !important;
	background: #fff !important;
}

/* In the notice card the CTAs should look like proper pill buttons (not full-
   width "submit" buttons from the booking flow). */
.etx-tickets-notice-actions .etx-cta {
	width: auto;
	min-width: 220px;
	margin-top: 0;
	padding: 13px 26px;
	font-size: .96rem;
}

/* Compact, more clearly bordered notice card on mobile so it never reads as
   blank white space against the page background. */
@media (max-width: 720px) {
	.etx-tickets-notice {
		max-width: none;
		margin: 0 12px;
		padding: 26px 18px 22px;
		border-radius: 18px;
		box-shadow: 0 10px 30px -18px rgba(0,0,0,.18), 0 0 0 1px rgba(0,0,0,.04);
	}
	.etx-tickets-notice-icon { width: 48px; height: 48px; margin-bottom: 14px; }
	.etx-tickets-notice-icon svg { width: 24px; height: 24px; }
	.etx-tickets-notice-title { font-size: 1.18rem; margin-bottom: 14px; }
	.etx-tickets-notice-list li {
		padding: 12px 12px 12px 48px;
		font-size: .9rem;
		line-height: 1.5;
	}
	.etx-tickets-notice-list li::before {
		left: 12px; top: 12px;
		width: 24px; height: 24px;
		font-size: .78rem;
	}
	.etx-tickets-notice-actions {
		flex-direction: column;
		gap: 10px;
		margin-bottom: 12px;
	}
	.etx-tickets-notice-actions .etx-cta {
		width: 100%;
		min-width: 0;
	}
	.etx-tickets-notice-foot { font-size: .8rem; }
}

/* Even smaller breakpoint — phone portrait. */
@media (max-width: 420px) {
	.etx-tickets-notice {
		margin: 0 8px;
		padding: 22px 14px 18px;
	}
}

/* ==========================================================================
   Brand logo (header / footer / auth) + logout + register additions
   ========================================================================== */
/* Logo image in the fixed header. Replaces the round icon + wordmark. */
.etx-header-logo-img {
	display: block; height: 36px; width: auto; max-width: 200px;
	object-fit: contain;
}
/* Logo image in the footer. */
.etx-footer-logo-img {
	display: block; height: 40px; width: auto; max-width: 220px;
	object-fit: contain; margin-bottom: 14px;
}

@media (max-width: 600px) {
	.etx-header-logo-img { height: 30px; max-width: 150px; }
	.etx-footer-logo-img { height: 34px; }
}

/* Logo on the sign-in / create-account cards. */
.etx-login-logo {
	display: block; height: 46px; width: auto; max-width: 220px;
	object-fit: contain; margin: 0 auto 18px;
}

/* Inline error banner on the auth cards. */
.etx-login-error {
	background: #fff1f0; border: 1px solid #ffd6d2; color: #c0341d;
	border-radius: var(--etx-r-sm); padding: 11px 14px; margin: 0 0 18px;
	font-size: .9rem; font-weight: 500; text-align: center;
}

/* Register form re-uses .etx-login styling; tidy label/field spacing. */
.etx-register-form .login-username,
.etx-register-form .login-password { margin-bottom: 12px; }
.etx-register-form .login-submit { margin-top: 8px; }

/* My Tickets — header action row + logout button. */
.etx-head-actions { margin-top: 18px; }
.etx-logout {
	display: inline-flex; align-items: center; gap: 8px;
	background: #fff; color: var(--etx-ink) !important;
	border: 1px solid var(--etx-line); text-decoration: none;
	padding: 10px 20px; border-radius: 999px;
	font-family: var(--etx-body); font-weight: 600; font-size: .9rem;
	letter-spacing: -.01em; transition: border-color .15s, color .15s, transform .18s, box-shadow .18s;
}
.etx-logout:hover {
	border-color: var(--etx-coral); color: var(--etx-coral) !important;
	transform: translateY(-1px); box-shadow: 0 10px 22px -12px rgba(255,45,85,.5);
}

/* Make the download button line up nicely on the My Tickets cards. */
.etx-tickets .etx-ticket-download { margin-top: 16px; }

/* Guard: the full-bleed footer uses 100vw; prevent a hairline horizontal
   scrollbar on plugin pages (header + sticky bar are position:fixed, so this
   does not affect them). */
body.eventix-page { overflow-x: hidden; }