/* ==========================================================================
   TechShow X. VIP regisztráció — Prizma
   2. fázis: teljes űrlap-stílus

   🔴 GUARD-CSS — MIÉRT `!important` MINDENHOL?
   A Divi/Extra téma felülírja a natív elemeket (p, h1, h2, button, input,
   label, fieldset, legend, select, textarea, a, dl). Ezért MINDEN szabály:
     - a `.tsz` scope alatt fut, és
     - `!important`-tal.

   Élesben mért driftek, amiket minden ÚJ komponensnél újra ellenőrizni kell:
     - input::placeholder{text-transform:uppercase;letter-spacing:1.2px}
       → a PSZEUDO-ELEMET is fedni kell, nem elég az inputot
     - <a class="tsz-btn"> → a téma ALÁHÚZZA → linknek látszik, nem gombnak
     - a nyilatkozatok linkjeit külön kell színezni
     - a fieldset/legend a témában keretet és nagybetűs feliratot kap
   ========================================================================== */

/* --------------------------------------------------------------------------
   Tokenek + alap
   -------------------------------------------------------------------------- */
.tsz {
	--ts-bg: #F4F5F8;
	--ts-surface: #FFFFFF;
	--ts-ink: #0A0B0E;
	--ts-ink-2: #5C616B;
	--ts-ink-3: #8A8F99;
	--ts-line: #E8EAF0;
	--ts-night: #0A0F1E;
	--ts-night-2: #121A30;
	--ts-accent: #5227FF;
	--ts-accent-hover: #3D14E0;
	--ts-accent-soft: #F1EDFF;
	--ts-fin-neon: #22C8E8;
	--ts-pay-neon: #FF5FAD;
	--ts-bank-neon: #FFC233;
	--ts-danger: #D6273A;
	--ts-danger-soft: #FDEDEF;
	--ts-radius: 12px;
	--ts-radius-s: 8px;
	--ts-radius-pill: 999px;
	--ts-font-display: 'Schibsted Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--ts-font-body: 'Space Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;

	font-family: var(--ts-font-body) !important;
	color: var(--ts-ink) !important;
	text-align: left !important;

	/* Halvány alap az űrlap mögé. A blokkok fehér kártyák, ezért fehér
	   oldalháttéren nem lenne kontrasztjuk. Így a shortcode bármelyik
	   oldalon önmagában is jól néz ki. A hero saját, sötét hátteret kap
	   (lásd .tsz-hero-wrap, ami ez után következik a fájlban). */
	background: var(--ts-bg) !important;
}

.tsz *,
.tsz *::before,
.tsz *::after {
	box-sizing: border-box !important;
}

/* --------------------------------------------------------------------------
   Hero — éjkék, teljes szélességben
   -------------------------------------------------------------------------- */
.tsz-hero-wrap {
	background: linear-gradient(160deg, var(--ts-night) 0%, var(--ts-night-2) 100%) !important;
	margin: 0 !important;
	padding: 0 !important;
}

.tsz-hero {
	max-width: 760px !important;
	margin: 0 auto !important;
	padding: 56px 20px 48px !important;
	position: relative !important;
}

/* Prizma-hármas: vékony színcsík a hero alján */
.tsz-hero-wrap::after {
	content: '' !important;
	display: block !important;
	height: 3px !important;
	background: linear-gradient(90deg,
		var(--ts-fin-neon) 0%, var(--ts-fin-neon) 33.3%,
		var(--ts-pay-neon) 33.3%, var(--ts-pay-neon) 66.6%,
		var(--ts-bank-neon) 66.6%, var(--ts-bank-neon) 100%) !important;
}

.tsz-hero-kicker {
	font-family: var(--ts-font-body) !important;
	font-size: 13px !important;
	line-height: 1.4 !important;
	letter-spacing: 0.14em !important;
	text-transform: uppercase !important;
	color: var(--ts-fin-neon) !important;
	margin: 0 0 14px !important;
	padding: 0 !important;
	font-weight: 500 !important;
}

.tsz-hero-title {
	font-family: var(--ts-font-display) !important;
	font-size: 40px !important;
	line-height: 1.12 !important;
	font-weight: 700 !important;
	color: #FFFFFF !important;
	margin: 0 0 16px !important;
	padding: 0 !important;
	text-transform: none !important;
	letter-spacing: -0.01em !important;
}

.tsz-hero-motto {
	font-family: var(--ts-font-body) !important;
	font-size: 18px !important;
	line-height: 1.55 !important;
	color: rgba(255, 255, 255, 0.82) !important;
	margin: 0 0 20px !important;
	padding: 0 !important;
	max-width: 56ch !important;
}

.tsz-hero-deadline {
	display: inline-block !important;
	font-family: var(--ts-font-body) !important;
	font-size: 14px !important;
	line-height: 1.4 !important;
	font-weight: 500 !important;
	color: #FFFFFF !important;
	background: rgba(255, 255, 255, 0.10) !important;
	border: 1px solid rgba(255, 255, 255, 0.18) !important;
	border-radius: var(--ts-radius-pill) !important;
	padding: 7px 16px !important;
	margin: 0 !important;
}

/* --------------------------------------------------------------------------
   Törzs
   -------------------------------------------------------------------------- */
/* 🔴 A FÜGGŐLEGES TÉRKÖZ EGYETLEN HELYEN, ITT VAN.
   Az űrlap a TechShow-oldalon két idegen elem közé kerül: fölötte a logó-
   futószalag, alatta a Theme Builder lábléce. Egyik sem hoz magával térközt,
   ezért ha ez hiányzik, minden összecsúszik.
   Követelmény (Gábor, 2026-08-12): desktopon legalább 35px fent és lent,
   kisebb nézetekben arányosan. */
.tsz-body {
	max-width: 760px !important;
	margin: 0 auto !important;
	padding: 56px 20px 64px !important;
}

.tsz-intro {
	font-family: var(--ts-font-body) !important;
	font-size: 16px !important;
	line-height: 1.62 !important;
	color: var(--ts-ink-2) !important;
	margin: 0 0 32px !important;
	padding: 0 !important;
	max-width: 62ch !important;
}

/* --------------------------------------------------------------------------
   Blokkok
   -------------------------------------------------------------------------- */
.tsz-block {
	background: var(--ts-surface) !important;
	border: 1px solid var(--ts-line) !important;
	border-radius: var(--ts-radius) !important;
	padding: 28px !important;
	margin: 0 0 20px !important;
}

.tsz-block-head {
	margin: 0 0 22px !important;
	padding: 0 !important;
	border: 0 !important;
}

.tsz-block-code {
	display: inline-block !important;
	font-family: var(--ts-font-display) !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	letter-spacing: 0.06em !important;
	color: var(--ts-accent) !important;
	background: var(--ts-accent-soft) !important;
	border-radius: var(--ts-radius-s) !important;
	padding: 6px 10px !important;
	margin: 0 0 12px !important;
}

.tsz-block-title {
	font-family: var(--ts-font-display) !important;
	font-size: 22px !important;
	line-height: 1.3 !important;
	font-weight: 600 !important;
	color: var(--ts-ink) !important;
	margin: 0 0 6px !important;
	padding: 0 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
}

.tsz-block-sub {
	font-family: var(--ts-font-body) !important;
	font-size: 14px !important;
	line-height: 1.55 !important;
	color: var(--ts-ink-3) !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* --------------------------------------------------------------------------
   Mezőrács
   -------------------------------------------------------------------------- */
.tsz-fields {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 20px !important;
}

.tsz-field {
	grid-column: 1 / -1 !important;
	min-width: 0 !important;
}

.tsz-field--half {
	grid-column: span 1 !important;
}

/* --------------------------------------------------------------------------
   Címkék és beviteli mezők
   -------------------------------------------------------------------------- */
.tsz-label {
	display: block !important;
	font-family: var(--ts-font-body) !important;
	font-size: 14px !important;
	line-height: 1.4 !important;
	font-weight: 600 !important;
	color: var(--ts-ink) !important;
	margin: 0 0 7px !important;
	padding: 0 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	float: none !important;
}

.tsz-req {
	color: var(--ts-accent) !important;
	font-weight: 700 !important;
}

.tsz-optnote {
	font-weight: 400 !important;
	color: var(--ts-ink-3) !important;
	font-size: 13px !important;
}

.tsz-input {
	display: block !important;
	width: 100% !important;
	font-family: var(--ts-font-body) !important;
	font-size: 16px !important;   /* 16px alatt az iOS ráközelít a mezőre */
	line-height: 1.45 !important;
	font-weight: 400 !important;
	color: var(--ts-ink) !important;
	background: var(--ts-surface) !important;
	border: 1px solid var(--ts-line) !important;
	border-radius: var(--ts-radius-s) !important;
	padding: 11px 14px !important;
	margin: 0 !important;
	box-shadow: none !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	-webkit-appearance: none !important;
	appearance: none !important;
	transition: border-color .15s ease, box-shadow .15s ease !important;
}

/* A téma nagybetűsíti és ritkítja a helykitöltő szöveget — a pszeudo-elemet
   külön kell fedni, az inputra tett szabály erre NEM hat. */
.tsz-input::placeholder {
	color: var(--ts-ink-3) !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	opacity: 1 !important;
	font-size: 16px !important;
}

.tsz-input:focus {
	outline: none !important;
	border-color: var(--ts-accent) !important;
	box-shadow: 0 0 0 3px var(--ts-accent-soft) !important;
}

.tsz-input--locked {
	background: var(--ts-bg) !important;
	color: var(--ts-ink-2) !important;
	cursor: not-allowed !important;
}

.tsz-input--locked:focus {
	border-color: var(--ts-line) !important;
	box-shadow: none !important;
}

select.tsz-input {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath fill='%235C616B' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 14px center !important;
	padding-right: 38px !important;
}

textarea.tsz-input {
	resize: vertical !important;
	min-height: 96px !important;
}

.tsz-hint {
	font-family: var(--ts-font-body) !important;
	font-size: 13px !important;
	line-height: 1.5 !important;
	color: var(--ts-ink-3) !important;
	margin: 7px 0 0 !important;
	padding: 0 !important;
}

/* --------------------------------------------------------------------------
   Rádiógombok
   A téma a fieldsetre keretet, a legendre nagybetűs feliratot tesz.
   -------------------------------------------------------------------------- */
.tsz-radiogroup {
	border: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	min-width: 0 !important;
}

.tsz-radiogroup .tsz-label {
	display: block !important;
	width: 100% !important;
	float: none !important;
	margin: 0 0 10px !important;
	padding: 0 !important;
	background: none !important;
	border: 0 !important;
}

.tsz-radio {
	display: flex !important;
	align-items: flex-start !important;
	gap: 11px !important;
	font-family: var(--ts-font-body) !important;
	font-size: 15px !important;
	line-height: 1.5 !important;
	font-weight: 400 !important;
	color: var(--ts-ink) !important;
	background: var(--ts-surface) !important;
	border: 1px solid var(--ts-line) !important;
	border-radius: var(--ts-radius-s) !important;
	padding: 13px 15px !important;
	margin: 0 0 9px !important;
	cursor: pointer !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	transition: border-color .15s ease, background .15s ease !important;
}

.tsz-radio:last-child {
	margin-bottom: 0 !important;
}

.tsz-radio:hover {
	border-color: #C9CEDC !important;
}

.tsz-radio input[type="radio"] {
	flex: 0 0 auto !important;
	width: 19px !important;
	height: 19px !important;
	margin: 1px 0 0 !important;
	padding: 0 !important;
	accent-color: var(--ts-accent) !important;
	cursor: pointer !important;
}

.tsz-radio:has(input:checked) {
	border-color: var(--ts-accent) !important;
	background: var(--ts-accent-soft) !important;
}

.tsz-radio-text {
	display: block !important;
	padding: 0 !important;
}

/* --------------------------------------------------------------------------
   Hozzájárulások
   -------------------------------------------------------------------------- */
.tsz-consent {
	display: flex !important;
	align-items: flex-start !important;
	gap: 11px !important;
	font-family: var(--ts-font-body) !important;
	font-size: 14px !important;
	line-height: 1.55 !important;
	font-weight: 400 !important;
	color: var(--ts-ink-2) !important;
	margin: 0 !important;
	padding: 0 !important;
	cursor: pointer !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	float: none !important;
}

.tsz-consent input[type="checkbox"] {
	flex: 0 0 auto !important;
	width: 19px !important;
	height: 19px !important;
	margin: 1px 0 0 !important;
	padding: 0 !important;
	accent-color: var(--ts-accent) !important;
	cursor: pointer !important;
}

.tsz-consent-text {
	display: block !important;
	padding: 0 !important;
}

.tsz-consent-link {
	margin: 7px 0 0 30px !important;
	padding: 0 !important;
	font-size: 13px !important;
	line-height: 1.5 !important;
}

/* A téma az aloldalakon saját linkszínt használ — a nyilatkozatoknál külön kell.
   🔴 A :not(.tsz-btn) NEM elhagyható. Ez a szabály a FOLYÓSZÖVEGBEN lévő
   linkeknek szól, de `.tsz-box-body a` (0,2,0) erősebb, mint `.tsz-btn` (0,1,0),
   ezért aláhúzta a dobozban lévő LINK-ALAPÚ gombokat is — a „Mégis kitöltöm"
   linknek látszott, nem gombnak. Élesben mérve a lemondó megerősítő oldalon,
   2026-08-12. Ez pontosan a CLAUDE.md 6. szabályában leírt drift, csak nem a
   téma okozta, hanem a saját CSS-ünk. */
/* 🔴 A `.tsz-consent-text a` NEM HAGYHATÓ EL.
   A nyilatkozat linkje 2026-08-13 óta a MONDATBA van ágyazva (korábban külön
   sorban állt, `.tsz-consent-link` alatt). A régi szabály így nem illeszkedett
   rá: élesben mérve az "adatkezelési tájékoztatót" link se aláhúzást, se
   akcentus-színt nem kapott - csak egy árnyalattal sötétebb szürke lett, ami
   nem olvasható linknek. Egy jogszabály szerint kötelező dokumentum
   hivatkozásánál ez nem elég. */
.tsz-consent-text a:not(.tsz-btn),
.tsz-consent-link a:not(.tsz-btn),
.tsz-box-body a:not(.tsz-btn),
.tsz-decline a:not(.tsz-btn) {
	color: var(--ts-accent) !important;
	text-decoration: underline !important;
	font-weight: 500 !important;
}

.tsz-consent-text a:not(.tsz-btn):hover,
.tsz-consent-link a:not(.tsz-btn):hover,
.tsz-box-body a:not(.tsz-btn):hover,
.tsz-decline a:not(.tsz-btn):hover {
	color: var(--ts-accent-hover) !important;
}

/* A két hozzájárulás közé nagyobb levegő, mint a rács alap gapje */
.tsz-field--consent + .tsz-field--consent {
	margin-top: 4px !important;
}

/* --------------------------------------------------------------------------
   Hibaüzenetek
   -------------------------------------------------------------------------- */
.tsz-error {
	font-family: var(--ts-font-body) !important;
	font-size: 13px !important;
	line-height: 1.5 !important;
	font-weight: 500 !important;
	color: var(--ts-danger) !important;
	margin: 7px 0 0 !important;
	padding: 0 !important;
}

.tsz-error[hidden] {
	display: none !important;
}

.tsz-field--invalid .tsz-input {
	border-color: var(--ts-danger) !important;
}

.tsz-field--invalid .tsz-input:focus {
	box-shadow: 0 0 0 3px var(--ts-danger-soft) !important;
}

.tsz-formerror {
	font-family: var(--ts-font-body) !important;
	font-size: 14px !important;
	line-height: 1.55 !important;
	font-weight: 500 !important;
	color: var(--ts-danger) !important;
	background: var(--ts-danger-soft) !important;
	border: 1px solid #F5C2C8 !important;
	border-radius: var(--ts-radius-s) !important;
	padding: 13px 16px !important;
	margin: 0 0 20px !important;
}

.tsz-formerror[hidden] {
	display: none !important;
}

/* Semleges visszajelzés ugyanabban a sávban (nem hiba) */
.tsz-formerror--info {
	color: var(--ts-ink) !important;
	background: var(--ts-accent-soft) !important;
	border-color: #D9CEFF !important;
}

/* --------------------------------------------------------------------------
   Gombok
   A téma az <a class="tsz-btn"> elemet ALÁHÚZZA — ezért text-decoration:none.
   -------------------------------------------------------------------------- */
.tsz-actions {
	margin: 28px 0 0 !important;
	padding: 0 !important;
}

.tsz-actions--row {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 12px !important;
	align-items: center !important;
}

.tsz-btn {
	display: inline-block !important;
	font-family: var(--ts-font-body) !important;
	font-size: 16px !important;
	line-height: 1.2 !important;
	font-weight: 600 !important;
	color: #FFFFFF !important;
	background: var(--ts-accent) !important;
	border: 1px solid var(--ts-accent) !important;
	border-radius: var(--ts-radius-pill) !important;
	padding: 15px 30px !important;
	margin: 0 !important;
	cursor: pointer !important;
	text-align: center !important;
	text-decoration: none !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	box-shadow: 0 2px 10px rgba(82, 39, 255, 0.22) !important;
	-webkit-appearance: none !important;
	appearance: none !important;
	transition: background .15s ease, border-color .15s ease !important;
}

.tsz-btn:hover {
	background: var(--ts-accent-hover) !important;
	border-color: var(--ts-accent-hover) !important;
	color: #FFFFFF !important;
	text-decoration: none !important;
}

.tsz-btn:disabled,
.tsz-btn[aria-disabled="true"] {
	background: #B9BECC !important;
	border-color: #B9BECC !important;
	box-shadow: none !important;
	cursor: not-allowed !important;
}

.tsz-btn--ghost {
	color: var(--ts-accent) !important;
	background: transparent !important;
	border-color: var(--ts-accent) !important;
	box-shadow: none !important;
}

.tsz-btn--ghost:hover {
	color: #FFFFFF !important;
	background: var(--ts-accent) !important;
}

.tsz-btn--quiet {
	color: var(--ts-ink) !important;
	background: transparent !important;
	border-color: var(--ts-line) !important;
	box-shadow: none !important;
}

.tsz-btn--quiet:hover {
	color: var(--ts-ink) !important;
	background: var(--ts-bg) !important;
	border-color: #C9CEDC !important;
}

.tsz-note {
	font-family: var(--ts-font-body) !important;
	font-size: 13px !important;
	line-height: 1.55 !important;
	color: var(--ts-ink-3) !important;
	margin: 14px 0 0 !important;
	padding: 0 !important;
	max-width: 56ch !important;
}

/* Beküldött adatlapon a lemondó linkre érkezőnek szóló magyarázat. Nem hiba,
   de ELTÉR a várakozásától (lemondani jött), ezért el kell különülnie a
   normál jegyzetektől - különben beleolvad a köszönő szövegbe.
   Minden szabály !important és .tsz scope alatt: az Extra téma a `p`-t is
   felülírja (a projekt 6. szabálya). */
/* 🔴 A SZELEKTOR EREJE SZÁMÍT, NEM CSAK AZ !important (2026-08-16, élesben mérve).
   Első változatban `.tsz-note--kiemelt` állt itt. A saját `.tsz-box-body p`
   szabályunk (feljebb) EGGYEL erősebb (osztály + elem), ezért a padding, a
   font-size és a margin onnan jött - a böngészőben mérve `padding: 0px`. A
   háttér és a keret látszott, a térköz nem: a doboz szövege a keretre tapadt.
   A 6. szabály tehát nem elég úgy, hogy „mindenhova !important" - a
   specifikusságnak is el kell érnie a felülírandó szabályét. */
.tsz-box-body p.tsz-note--kiemelt {
	font-size: 15px !important;
	color: var(--ts-ink) !important;
	background: #F4F2FF !important;
	border-left: 3px solid var(--ts-accent) !important;
	border-radius: var(--ts-radius-s) !important;
	padding: 12px 14px !important;
	margin: 0 0 18px !important;
	max-width: none !important;
}

/* 🔴 A GOMB ÉS AZ ALATTA LÉVŐ SZÖVEG ÖSSZEOLVADT.
   A 14px-es alaptérköz egy inline-block gomb alatt vizuálisan még kevesebbnek
   látszik, mert a gomb saját sormagassága is beleszámít. Élesben mérve
   (2026-08-13): a „Módosítom az adataimat" gomb és a „A határidőig bármikor
   visszatérhetsz erre a linkre." egy blokknak tűnt. */
.tsz-actions + .tsz-note {
	margin-top: 26px !important;
}

@media (max-width: 640px) {
	.tsz-actions + .tsz-note {
		margin-top: 20px !important;
	}
}

/* --------------------------------------------------------------------------
   "Nem tudok részt venni"
   -------------------------------------------------------------------------- */
.tsz-decline {
	font-family: var(--ts-font-body) !important;
	font-size: 14px !important;
	line-height: 1.6 !important;
	color: var(--ts-ink-3) !important;
	text-align: center !important;
	margin: 32px 0 0 !important;
	padding: 22px 0 0 !important;
	border-top: 1px solid var(--ts-line) !important;
}

/* --------------------------------------------------------------------------
   Üzenetdoboz + összegzés
   -------------------------------------------------------------------------- */
.tsz-box {
	background: var(--ts-surface) !important;
	border: 1px solid var(--ts-line) !important;
	border-radius: var(--ts-radius) !important;
	padding: 32px !important;
	max-width: 760px !important;
	margin: 0 auto !important;
}

.tsz-box-title {
	font-family: var(--ts-font-display) !important;
	font-size: 24px !important;
	line-height: 1.25 !important;
	font-weight: 600 !important;
	color: var(--ts-ink) !important;
	margin: 0 0 16px !important;
	padding: 0 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
}

.tsz-box-body p {
	font-family: var(--ts-font-body) !important;
	font-size: 16px !important;
	line-height: 1.62 !important;
	color: var(--ts-ink-2) !important;
	margin: 0 0 12px !important;
	padding: 0 !important;
}

.tsz-box-body p:last-child {
	margin-bottom: 0 !important;
}

.tsz-box-body strong {
	color: var(--ts-ink) !important;
	font-weight: 600 !important;
}

.tsz-muted {
	color: var(--ts-ink-3) !important;
	font-size: 14px !important;
}

.tsz-summary {
	display: grid !important;
	/* 🔴 A CÍMKE-OSZLOP NEM NŐHET KORLÁTLANUL (2026-08-14, Gábor jelezte).
	   Eddig `minmax(140px, auto)` volt: az `auto` a LEGHOSSZABB címkéhez
	   igazodik („I am uploading a new profile photo"), és a maradékot kapta az
	   ÉRTÉK - ezért tört négy sorba a „CEO for Central, South, and East
	   Europe". Gábor döntése: FELE-FELE. Mindkét oszlop ugyanannyit kap, a
	   címke és az érték is ugyanúgy tördelődik - nincs, ami a másik rovására
	   nőjön. */
	grid-template-columns: 1fr 1fr !important;
	gap: 10px 20px !important;
	margin: 22px 0 0 !important;
	padding: 20px 0 0 !important;
	border-top: 1px solid var(--ts-line) !important;
}

.tsz-summary dt {
	font-family: var(--ts-font-body) !important;
	font-size: 13px !important;
	line-height: 1.5 !important;
	font-weight: 600 !important;
	color: var(--ts-ink-3) !important;
	margin: 0 !important;
	padding: 0 !important;
}

.tsz-summary dd {
	font-family: var(--ts-font-body) !important;
	font-size: 15px !important;
	line-height: 1.5 !important;
	color: var(--ts-ink) !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* --------------------------------------------------------------------------
   A BEKÜLDÖTT VENDÉGLISTA — részletes táblázat az összegzés alatt (3. fázis)
   --------------------------------------------------------------------------

   🔴 MIÉRT VAN SAJÁT, GÖRGETHETŐ KERETE.
   Négy oszlop (vezetéknév, keresztnév, e-mail, belépő) keskeny telefonon nem
   fér ki. Görgethető keret nélkül a LAP görgetne vízszintesen — a projekt
   elrendezés-ellenőrzője pontosan ezt méri hibaként (`scrollWidth >
   clientWidth` a törzsön). Így a túlfolyás a táblázaton belül marad.

   A szelektorok elem-nevet IS tartalmaznak (`table.tsz-summary-tabla`), mert az
   Extra téma a natív `table`, `th`, `td` elemekre ad saját szabályt, és
   2026-08-16-ban megfizettük, hogy az `!important` önmagában kevés: a
   SPECIFIKUSSÁGNAK is el kell érnie a felülírandóét. */

/* 🔴 A ROVATCÍM NEM NAGYBETŰS ÉS NEM SZÜRKE (Gábor, 2026-08-17:
   „optikailag ezek összefolynak"). Az első változatban a „Vendégek" cím
   BETŰRE úgy nézett ki, mint alatta a „VEZETÉKNÉV" fejléc-cella - kicsi,
   nagybetűs, ritkított, halvány -, és a kettő egyetlen kétsoros feliratnak
   látszott. A cím innentől a szöveg-hierarchia része (sötét, normál betűs,
   elválasztó vonallal), a táblázat fejléce pedig megtartja a szürke sávot. */
.tsz-summary-cim {
	font-family: var(--ts-font-display) !important;
	font-size: 17px !important;
	font-weight: 700 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	color: var(--ts-ink) !important;
	margin: 28px 0 12px !important;
	padding: 18px 0 0 !important;
	border-top: 1px solid var(--ts-line) !important;
}

.tsz-summary-tabla-keret {
	overflow-x: auto !important;
	-webkit-overflow-scrolling: touch !important;
	border: 1px solid var(--ts-line) !important;
	border-radius: var(--ts-radius-s, 8px) !important;
	background: var(--ts-surface, #fff) !important;
}

.tsz table.tsz-summary-tabla {
	width: 100% !important;
	border-collapse: collapse !important;
	margin: 0 !important;
	font-family: var(--ts-font-body) !important;
}

.tsz table.tsz-summary-tabla th,
.tsz table.tsz-summary-tabla td {
	text-align: left !important;
	padding: 10px 14px !important;
	border: 0 !important;
	border-bottom: 1px solid var(--ts-line) !important;
	vertical-align: top !important;
	white-space: normal !important;
	word-break: break-word !important;
}

.tsz table.tsz-summary-tabla th {
	font-size: 12px !important;
	font-weight: 700 !important;
	letter-spacing: 0.04em !important;
	text-transform: uppercase !important;
	color: var(--ts-ink-3) !important;
	background: var(--ts-bg, #F4F5F8) !important;
}

.tsz table.tsz-summary-tabla td {
	font-size: 15px !important;
	line-height: 1.45 !important;
	color: var(--ts-ink) !important;
}

.tsz table.tsz-summary-tabla tr:last-child td {
	border-bottom: 0 !important;
}

/* A sorszám-oszlop keskeny és halvány: tájékozódási pont, nem adat. */
.tsz table.tsz-summary-tabla th.tsz-summary-sorszam,
.tsz table.tsz-summary-tabla td.tsz-summary-sorszam {
	width: 1% !important;
	white-space: nowrap !important;
	padding-right: 4px !important;
	color: var(--ts-ink-3) !important;
	font-variant-numeric: tabular-nums !important;
}

/* Csak képernyőolvasónak: a sorszám-oszlop fejléce. Nem `display:none`, mert
   azt a képernyőolvasó sem olvassa fel. */
.tsz .tsz-vak {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important;
	white-space: nowrap !important;
}

/* --------------------------------------------------------------------------
   Mobil
   -------------------------------------------------------------------------- */
@media (max-width: 640px) {
	.tsz-hero {
		padding: 40px 16px 34px !important;
	}
	.tsz-hero-title {
		font-size: 30px !important;
	}
	.tsz-hero-motto {
		font-size: 16px !important;
	}
	/* Mobilon arányosan kisebb, de a 35px-es alsó határ fölött marad. */
	.tsz-body {
		padding: 40px 16px 48px !important;
	}
	.tsz-block,
	.tsz-box {
		padding: 22px 18px !important;
	}
	.tsz-fields {
		grid-template-columns: 1fr !important;
	}
	.tsz-field--half {
		grid-column: 1 / -1 !important;
	}
	.tsz-btn {
		display: block !important;
		width: 100% !important;
	}
	.tsz-actions--row .tsz-btn {
		width: 100% !important;
	}
	.tsz-summary {
		grid-template-columns: 1fr !important;
		gap: 3px 0 !important;
	}
	.tsz-summary dd {
		margin: 0 0 12px !important;
	}
}

/* --------------------------------------------------------------------------
   Piszkozat - visszatérő sáv és mentés-jelző
   -------------------------------------------------------------------------- */

/* A visszatérőnek szóló sáv. Nem hiba és nem siker - tájékoztatás, ezért
   a lila akcentus halvány változata, nem zöld/piros. */
.tsz-resume {
	font-family: var(--ts-font-body) !important;
	font-size: 15px !important;
	line-height: 1.6 !important;
	color: var(--ts-ink) !important;
	background: var(--ts-accent-soft) !important;
	border: 1px solid #DCD2FF !important;
	border-radius: var(--ts-radius-s) !important;
	padding: 13px 16px !important;
	margin: 0 0 22px !important;
}

.tsz-resume strong {
	font-weight: 700 !important;
	color: var(--ts-ink) !important;
}

.tsz-save {
	font-family: var(--ts-font-body) !important;
	font-size: 13.5px !important;
	line-height: 1.55 !important;
	color: var(--ts-ink-3) !important;
	margin: 10px 0 0 !important;
	padding: 0 !important;
}

.tsz-save--kozben {
	color: var(--ts-ink-2) !important;
}

.tsz-save--kesz {
	color: var(--ts-accent) !important;
}

/* A sikertelen piszkozat-mentés NEM piros: a beküldés ettől még működik, és a
   helyi másolat is megvan. A piros itt fölöslegesen megijesztené a kitöltőt. */
.tsz-save--gond {
	color: var(--ts-ink-2) !important;
	font-weight: 500 !important;
}

/* --------------------------------------------------------------------------
   Fotó-feltöltés

   A testvérprojekt élesben bevált stílusából, a `.tsz` névtérre igazítva.
   A hibás állapotot itt a mező-keret `.tsz-field--invalid` osztálya jelöli
   (ugyanaz, mint a többi mezőnél) - nem kell külön `is-error`.
   -------------------------------------------------------------------------- */

.tsz-photo {
	margin: 0 !important;
}

/* 🔴 KRITIKUS: a guard-réteg `display:flex !important`-je FELÜLÍRNÁ a [hidden]
   attribútumot (a böngésző alap display:none-ja gyengébb szabály). Enélkül az
   üres állapotban is látszana az előnézet és a gombsor. */
.tsz-photo [hidden] {
	display: none !important;
}

.tsz-photo-drop {
	position: relative !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 14px !important;
	min-height: 132px !important;
	padding: 22px !important;
	text-align: center !important;
	cursor: pointer !important;
	background: var(--ts-surface) !important;
	border: 2px dashed var(--ts-line) !important;
	border-radius: var(--ts-radius) !important;
	transition: border-color .15s ease, background .15s ease !important;
}

.tsz-photo-drop:hover,
.tsz-photo-drop:focus-visible {
	border-color: var(--ts-accent) !important;
	background: #FBFAFF !important;
	outline: none !important;
}

.tsz-photo-drop.is-over {
	border-color: var(--ts-accent) !important;
	background: #F4F1FF !important;
}

.tsz-photo-drop.is-busy {
	cursor: progress !important;
}

.tsz-field--invalid .tsz-photo-drop {
	border-color: var(--ts-danger) !important;
	box-shadow: 0 0 0 3px var(--ts-danger-soft) !important;
}

.tsz-photo-empty {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	gap: 5px !important;
}

.tsz-photo-empty strong {
	font-family: var(--ts-font-body) !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	color: var(--ts-ink) !important;
}

.tsz-photo-sub {
	font-size: 13.5px !important;
	line-height: 1.5 !important;
	color: var(--ts-ink-3) !important;
}

.tsz-photo-prev {
	display: flex !important;
	align-items: center !important;
	gap: 16px !important;
}

/* A kártyán négyzetesre vágva jelenik meg - az előnézet is így mutassa. */
.tsz-photo-prev img {
	display: block !important;
	width: 120px !important;
	height: 120px !important;
	object-fit: cover !important;
	border-radius: var(--ts-radius-s) !important;
	border: 1px solid var(--ts-line) !important;
}

.tsz-photo-meta {
	font-size: 13.5px !important;
	color: var(--ts-ink-3) !important;
	text-align: left !important;
}

.tsz-photo-bar {
	position: absolute !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	height: 4px !important;
	background: var(--ts-line) !important;
	border-radius: 0 0 var(--ts-radius) var(--ts-radius) !important;
	overflow: hidden !important;
}

.tsz-photo-bar > span {
	display: block !important;
	height: 100% !important;
	width: 0 !important;
	background: var(--ts-accent) !important;
	transition: width .18s ease !important;
}

.tsz-photo-actions {
	display: flex !important;
	gap: 10px !important;
	margin-top: 10px !important;
}

/* A téma a natív <button>-t átszínezi és nagybetűsíti - mindent lefedünk. */
.tsz-photo-actions button {
	font-family: var(--ts-font-body) !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	color: var(--ts-ink-2) !important;
	background: var(--ts-surface) !important;
	border: 1px solid var(--ts-line) !important;
	border-radius: var(--ts-radius-pill) !important;
	padding: 8px 14px !important;
	cursor: pointer !important;
}

.tsz-photo-actions button:hover {
	border-color: var(--ts-accent) !important;
	color: var(--ts-accent) !important;
}

.tsz-photo-remove:hover {
	border-color: var(--ts-danger) !important;
	color: var(--ts-danger) !important;
}

@media (max-width: 640px) {
	.tsz-photo-drop {
		min-height: 0 !important;
		padding: 18px !important;
	}
	.tsz-photo-prev {
		flex-direction: column !important;
		gap: 10px !important;
	}
	.tsz-photo-meta {
		text-align: center !important;
	}
	/* Ujjbeggyel is elérhető méret */
	.tsz-photo-actions button {
		flex: 1 1 0 !important;
		min-height: 44px !important;
	}
}

/* Csökkentett mozgás igénye esetén ne animáljunk */
@media (prefers-reduced-motion: reduce) {
	.tsz * {
		transition: none !important;
	}
}

/* ==========================================================================
   ISMÉTLŐDŐ MEZŐCSOPORT — TÁBLÁZATOS ALAK
   (2026-08-17, Gábor visszajelzése után ÁTDOLGOZVA)

   🔴 MI VOLT A BAJ AZ ELSŐ VÁLTOZATTAL
   A sorszám egy 40 px-es rács-oszlopba került, a felirata („1. vendég") viszont
   60 px széles és `nowrap` volt: KIFOLYT az első mező alá. A méréseim ezt nem
   fogták meg, mert DOBOZ-MÉRETEKET néztem (`getBoundingClientRect`), nem
   szövegtúlfolyást (`scrollWidth > clientWidth`). Ráadásul minden sor kiírta
   mind a négy mezőnevet - negyven vendégnél az önmagában is zsúfolt.

   AZ ÚJ ALAK: egy FEJLÉC-sor a rovatnevekkel, alatta tömör, számozott sorok.
   A fejléc és a sorok UGYANAZT a rács-változót használják - két külön
   definíció biztosan elcsúszna egymástól.

   🔴 MINDEN SZABÁLY `!important`, `.tsz` scope alatt (a Divi/Extra téma
   felülírja a natív elemeket), ÉS a specifikusság is számít: ahol a saját
   `.tsz-fields p` szabályunk erősebb lenne, ott osztály + elem alakot írunk.
   ========================================================================== */

.tsz .tsz-repeat {
	/* A közös rács: sorszám · vezetéknév · keresztnév · e-mail · belépő · törlés.
	   Az `fr` és a `minmax(0,…)` együtt kell: az `auto` a leghosszabb TARTALOMHOZ
	   igazodna (élesben ezen csúszott el egyszer az összegzés-tábla), a
	   `minmax(0,…)` pedig megakadályozza, hogy egy hosszú e-mail-cím szétfeszítse. */
	--tsz-sor-racs: 2.75rem minmax(0, 1.05fr) minmax(0, 1.05fr) minmax(0, 1.9fr) minmax(0, 1.55fr) 2.25rem;
	display: block !important;
	margin: 0 0 var(--ts-space-4, 24px) 0 !important;
}

/* --- a fejléc-sor --- */
.tsz .tsz-repeat-fejlec {
	display: grid !important;
	grid-template-columns: var(--tsz-sor-racs) !important;
	align-items: end !important;
	gap: 10px !important;
	padding: 0 12px 6px 12px !important;
	border-bottom: 1px solid var(--ts-line, #E8EAF0) !important;
}
.tsz span.tsz-repeat-fejlec-cella {
	display: block !important;
	min-width: 0 !important;
	color: var(--ts-ink-3, #8A8F99) !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	letter-spacing: .04em !important;
	text-transform: uppercase !important;
	line-height: 1.3 !important;
}

/* --- egy sor --- */
.tsz .tsz-repeat-sorok { display: block !important; margin: 0 !important; padding: 0 !important; }

.tsz .tsz-repeat-sor {
	display: grid !important;
	grid-template-columns: var(--tsz-sor-racs) !important;
	align-items: start !important;
	gap: 10px !important;
	margin: 0 !important;
	padding: 10px 12px !important;
	border-bottom: 1px solid var(--ts-line, #E8EAF0) !important;
	background: transparent !important;
}
.tsz .tsz-repeat-sor:hover { background: var(--ts-bg, #F4F5F8) !important; }

/* 🔴 A SORSZÁM SAJÁT OSZLOPA. `min-width:0` + `overflow-wrap`: ha a szöveg
   valaha hosszabb lenne az oszlopnál, TÖRJÖN, ne folyjon a szomszédra. Ez az a
   védelem, ami az első változatból hiányzott. */
.tsz span.tsz-repeat-szam {
	display: block !important;
	min-width: 0 !important;
	padding-top: 11px !important;
	overflow-wrap: anywhere !important;
	white-space: normal !important;
	color: var(--ts-ink-3, #8A8F99) !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	font-variant-numeric: tabular-nums !important;
	text-align: right !important;
}

.tsz .tsz-repeat-mezo { display: block !important; min-width: 0 !important; }

.tsz .tsz-repeat-mezo input.tsz-input,
.tsz .tsz-repeat-mezo select.tsz-input {
	width: 100% !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 9px 10px !important;
	font-size: 15px !important;
	line-height: 1.35 !important;
}

.tsz .tsz-repeat-mezo p.tsz-error {
	margin: 4px 0 0 0 !important;
	font-size: 12px !important;
	line-height: 1.4 !important;
}

/* A sor-címkék asztali nézetben REJTETTEK (a fejléc mondja meg a rovatot), de
   a képernyőolvasó számára megmaradnak. Mobilon újra láthatóvá válnak. */
.tsz label.tsz-label--sor {
	position: absolute !important;
	width: 1px !important; height: 1px !important;
	margin: -1px !important; padding: 0 !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/* --- törlés --- */
.tsz button.tsz-repeat-torol {
	align-self: start !important;
	width: 2.25rem !important;
	height: 2.25rem !important;
	margin-top: 1px !important;
	padding: 0 !important;
	border: 1px solid transparent !important;
	border-radius: var(--ts-radius-s, 8px) !important;
	background: transparent !important;
	color: var(--ts-ink-3, #8A8F99) !important;
	font-size: 20px !important;
	line-height: 1 !important;
	cursor: pointer !important;
	text-decoration: none !important;   /* a téma aláhúzná */
}
.tsz button.tsz-repeat-torol:hover {
	border-color: #B0004E !important;
	color: #B0004E !important;
	background: #fff !important;
}

/* --- „+ új vendég" és az üres állapot --- */
.tsz button.tsz-repeat-add {
	display: inline-block !important;
	margin: 12px 0 0 0 !important;
	text-decoration: none !important;
}
.tsz button.tsz-repeat-add[disabled] { opacity: .5 !important; cursor: not-allowed !important; }

.tsz p.tsz-repeat-ures {
	margin: 0 !important;
	padding: 20px 16px !important;
	border-bottom: 1px solid var(--ts-line, #E8EAF0) !important;
	color: var(--ts-ink-3, #8A8F99) !important;
	font-size: 14px !important;
	text-align: center !important;
}

/* ==========================================================================
   MOBIL: a táblázat kártyákká esik szét

   780 px alatt hat oszlop nem fér ki olvashatóan. A fejléc elrejtőzik, és a
   sor-címkék - amiket asztali nézetben csak a képernyőolvasó lát - újra
   megjelennek. Így mobilon sincs olyan mező, aminek ne lenne neve.
   ========================================================================== */
@media (max-width: 780px) {
	.tsz .tsz-repeat-fejlec { display: none !important; }

	.tsz .tsz-repeat-sor {
		grid-template-columns: 1fr 2.25rem !important;
		gap: 8px !important;
		margin: 0 0 10px 0 !important;
		padding: 12px !important;
		border: 1px solid var(--ts-line, #E8EAF0) !important;
		border-radius: var(--ts-radius-s, 8px) !important;
	}
	.tsz span.tsz-repeat-szam {
		grid-column: 1 !important;
		padding-top: 0 !important;
		text-align: left !important;
	}
	.tsz button.tsz-repeat-torol { grid-column: 2 !important; grid-row: 1 !important; }
	.tsz .tsz-repeat-mezo { grid-column: 1 / -1 !important; }

	.tsz label.tsz-label--sor {
		position: static !important;
		width: auto !important; height: auto !important;
		margin: 0 0 4px 0 !important;
		overflow: visible !important;
		clip: auto !important;
		display: block !important;
		color: var(--ts-ink-2, #5C616B) !important;
		font-size: 13px !important;
		font-weight: 600 !important;
		text-transform: none !important;
	}
}

/* 🔴 AZ ISMÉTLŐDŐ BLOKK A TELJES SZÉLESSÉGET KAPJA.
   A `.tsz-fields` kétoszlopos rács; enélkül a vendéglista az egyik oszlopba
   szorulna (371 px a 762-ből). */
.tsz .tsz-field--repeat { grid-column: 1 / -1 !important; }

/* ==========================================================================
   A SZPONZORI KERET PANELJE (2026-08-17, Gábor kérése)

   „Vizuálisan is legyen kiemelve, nagyon jól látható módon, hogy összesen hány
   darab 2 napos jeggyel rendelkeznek… és hogy összesen még hány darabot
   használhatnak fel."

   Éjkék kártya a Prizma tokenekkel: az űrlapon ez az EGYETLEN sötét felület,
   ezért a szem először ide néz. A nagy szám a MARADÉK, mert a kitöltés közben
   az a kérdés - a teljes keret fölötte, halványabban, viszonyítási pontnak.
   ========================================================================== */

.tsz .tsz-keret {
	position: relative !important;
	display: block !important;
	margin: 0 0 28px 0 !important;
	padding: 22px 24px !important;
	border-radius: var(--ts-radius, 12px) !important;
	background: linear-gradient(135deg,
		var(--ts-night, #0A0F1E) 0%, var(--ts-night-2, #121A30) 100%) !important;
	color: #fff !important;
	overflow: hidden !important;
}

.tsz .tsz-keret-fej {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: baseline !important;
	gap: 4px 12px !important;
	margin: 0 0 14px 0 !important;
}

.tsz span.tsz-keret-szponzor {
	display: inline-block !important;
	padding: 3px 10px !important;
	border-radius: var(--ts-radius-pill, 999px) !important;
	background: rgba(255,255,255,.12) !important;
	color: #fff !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	letter-spacing: .02em !important;
}

/* (2) A TELJES kontingens - halványabb, viszonyítási pont. */
.tsz span.tsz-keret-teljes {
	display: inline-block !important;
	color: rgba(255,255,255,.72) !important;
	font-size: 14px !important;
	line-height: 1.45 !important;
}

/* (3) AMI MÉG FELHASZNÁLHATÓ - ez a nagy szám. */
.tsz .tsz-keret-fo {
	display: flex !important;
	align-items: baseline !important;
	gap: 12px !important;
	margin: 0 0 6px 0 !important;
}

.tsz span.tsz-keret-szam {
	display: block !important;
	color: #fff !important;
	font-size: 56px !important;
	font-weight: 800 !important;
	line-height: 1 !important;
	letter-spacing: -.02em !important;
	font-variant-numeric: tabular-nums !important;
}

/* 🔴 EGY SORBAN (2026-08-17, Gábor: „Ez miért van 2 sorba törve?").
   Az első változatban `max-width: 14rem` állt itt - az tördelte ketté a
   „db kétnapos jegy még felhasználható" feliratot, pedig bőven van hely.
   A korlátot kivettem; mobilon a `flex-wrap` amúgy is új sorba teszi. */
.tsz span.tsz-keret-egyseg {
	display: block !important;
	color: rgba(255,255,255,.92) !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	line-height: 1.25 !important;
	white-space: nowrap !important;
}

/* A fejszám és a felirat egy sorban marad, amíg elfér. A `flex-wrap` gondoskodik
   arról, hogy keskeny kijelzőn a felirat a szám ALÁ kerüljön, ne pedig három
   sorba törjön mellette. */
.tsz .tsz-keret-fo {
	flex-wrap: wrap !important;
}

@media (max-width: 520px) {
	/* Keskeny kijelzőn a `nowrap` vízszintes görgetést okozna - ott inkább törjön. */
	.tsz span.tsz-keret-egyseg { white-space: normal !important; }
}

.tsz p.tsz-keret-alt {
	margin: 0 0 14px 0 !important;
	color: rgba(255,255,255,.72) !important;
	font-size: 14px !important;
	line-height: 1.45 !important;
}

/* A felhasználtság sávja. Nem díszítés: a szám mellett a sáv az, amiről egy
   pillantással látszik, hogy „majdnem tele" vagy „még bőven van". */
.tsz .tsz-keret-sav {
	height: 6px !important;
	margin: 0 0 12px 0 !important;
	border-radius: 999px !important;
	background: rgba(255,255,255,.16) !important;
	overflow: hidden !important;
}
.tsz .tsz-keret-sav-belso {
	height: 6px !important;
	border-radius: 999px !important;
	background: var(--ts-fin-neon, #22C8E8) !important;
	transition: width .18s ease-out !important;
}

.tsz p.tsz-keret-labjegyzet {
	margin: 0 !important;
	color: rgba(255,255,255,.55) !important;
	font-size: 13px !important;
	line-height: 1.45 !important;
}

/* TÚLLÉPÉS: az egész kártya vált, hogy ne lehessen elnézni. */
.tsz .tsz-keret--tul {
	background: linear-gradient(135deg, #6B0030 0%, #B0004E 100%) !important;
}
.tsz .tsz-keret--tul .tsz-keret-sav-belso { background: #FF5FAD !important; }

.tsz p.tsz-keret-tul {
	margin: 12px 0 0 0 !important;
	padding: 10px 12px !important;
	border-radius: var(--ts-radius-s, 8px) !important;
	background: rgba(255,255,255,.16) !important;
	color: #fff !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	line-height: 1.45 !important;
}

/* Beállítatlan keret: nem hallgatunk róla, de nem is riasztunk. */
.tsz .tsz-keret--nincs {
	background: #FFF4E0 !important;
	color: #7a4d00 !important;
}
.tsz p.tsz-keret-nincs {
	margin: 0 !important;
	color: #7a4d00 !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	line-height: 1.5 !important;
}

@media (max-width: 600px) {
	.tsz .tsz-keret { padding: 18px 16px !important; }
	.tsz span.tsz-keret-szam { font-size: 44px !important; }
}

/* ==========================================================================
   A VENDÉG-TÁBLÁZAT FINOMÍTÁSA (2026-08-17)
   „A design tovább is gyenge." - a táblázat kapott keretet, világosabb
   rovat-fejlécet és nagyobb belső teret.
   ========================================================================== */

.tsz .tsz-repeat-fejlec {
	border-radius: var(--ts-radius-s, 8px) var(--ts-radius-s, 8px) 0 0 !important;
	padding: 10px 14px !important;
	background: var(--ts-bg, #F4F5F8) !important;
	border-bottom: 1px solid var(--ts-line, #E8EAF0) !important;
}
.tsz span.tsz-repeat-fejlec-cella {
	color: var(--ts-ink-2, #5C616B) !important;
	font-size: 11px !important;
	letter-spacing: .06em !important;
}

.tsz .tsz-repeat-sorok {
	border-left: 1px solid var(--ts-line, #E8EAF0) !important;
	border-right: 1px solid var(--ts-line, #E8EAF0) !important;
}
.tsz .tsz-repeat-sor { padding: 12px 14px !important; }
.tsz .tsz-repeat-sor:last-child { border-bottom: 0 !important; }

.tsz .tsz-repeat-fejlec + .tsz-repeat-sorok {
	border-top: 0 !important;
}
.tsz .tsz-repeat-sorok,
.tsz p.tsz-repeat-ures {
	border-bottom: 1px solid var(--ts-line, #E8EAF0) !important;
	border-radius: 0 0 var(--ts-radius-s, 8px) var(--ts-radius-s, 8px) !important;
	background: var(--ts-surface, #FFFFFF) !important;
}
.tsz p.tsz-repeat-ures {
	border-left: 1px solid var(--ts-line, #E8EAF0) !important;
	border-right: 1px solid var(--ts-line, #E8EAF0) !important;
}

@media (max-width: 780px) {
	.tsz .tsz-repeat-sorok {
		border: 0 !important;
		border-radius: 0 !important;
		background: transparent !important;
	}
}

/* --- A gombsor: beküldés + „ment, de nem küld" (2026-08-17) ---------------
   A két gomb VIZUÁLISAN is elkülönül: a beküldés tömör lila (visszafordíthatatlan
   lépés), a mentés körvonalas (bármikor ismételhető). Ha egyformák lennének, a
   kapcsolattartó véletlenül beküldhetné a fél listát. */
.tsz .tsz-actions {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	gap: 12px !important;
}

.tsz button.tsz-btn--masodlagos {
	background: transparent !important;
	color: var(--ts-accent, #5227FF) !important;
	border: 1.5px solid var(--ts-accent, #5227FF) !important;
	text-decoration: none !important;   /* a téma aláhúzná */
}
.tsz button.tsz-btn--masodlagos:hover {
	background: rgba(82, 39, 255, .08) !important;
}
.tsz button.tsz-btn--masodlagos[disabled] {
	opacity: .55 !important;
	cursor: progress !important;
}

/* A mentés-jelző a gombok UTÁN, saját sorban: így nem szorítja össze őket. */
.tsz p.tsz-save {
	flex-basis: 100% !important;
	margin: 4px 0 0 0 !important;
	color: var(--ts-ink-3, #8A8F99) !important;
	font-size: 13px !important;
	line-height: 1.45 !important;
}

/* ==========================================================================
   A KERET TAPADÓ SÁVJA — a vendég-táblázat fölött (2026-08-17)

   🔴 A MÁSODIK KIJELZŐ. Gábor kérte, és igaza volt: negyven soros listánál a
   lap tetején lévő panel kigörget a képből, és épp ott nem látszik, ahol a
   kapcsolattartó dolgozik. Az első érvem („két helyen elcsúszna") rossz válasz
   volt — a helyes megoldás nem az, hogy egy kijelző van, hanem hogy MINDEGYIK
   ugyanabból a számításból frissül (`szponzor.js`, `querySelectorAll`).
   ========================================================================== */

.tsz .tsz-keret-sav-tapado {
	position: sticky !important;
	top: 0 !important;
	z-index: 5 !important;
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: baseline !important;
	gap: 4px 10px !important;
	margin: 0 !important;
	padding: 10px 14px !important;
	border: 1px solid var(--ts-line, #E8EAF0) !important;
	border-bottom: 0 !important;
	border-radius: var(--ts-radius-s, 8px) var(--ts-radius-s, 8px) 0 0 !important;
	background: var(--ts-night, #0A0F1E) !important;
	color: #fff !important;
}

.tsz span.tsz-keret-sav-szam {
	color: #fff !important;
	font-size: 24px !important;
	font-weight: 800 !important;
	line-height: 1.1 !important;
	font-variant-numeric: tabular-nums !important;
}
.tsz span.tsz-keret-sav-egyseg {
	color: rgba(255,255,255,.9) !important;
	font-size: 14px !important;
	font-weight: 600 !important;
}
.tsz span.tsz-keret-sav-bontas {
	color: rgba(255,255,255,.62) !important;
	font-size: 13px !important;
}

/* Túllépéskor ez a sáv is vált — ugyanaz az osztály, mint a felső panelen. */
.tsz .tsz-keret-sav-tapado.tsz-keret--tul {
	background: #B0004E !important;
}
.tsz span.tsz-keret-sav-tul {
	flex-basis: 100% !important;
	margin: 2px 0 0 0 !important;
	color: #fff !important;
	font-size: 13px !important;
	font-weight: 600 !important;
}

/* A fejléc-sor a tapadó sáv alá kerül, ezért a felső lekerekítése elmarad. */
.tsz .tsz-keret-sav-tapado + .tsz-repeat-fejlec {
	border-radius: 0 !important;
	border-top: 0 !important;
}