/**
 * 3ks-event-registration — registration form styles (Phase 1c-A).
 * Branding: #290038 (dark purple), #741099 (accent) — prev-interv.com.
 * WCAG: states never conveyed by colour alone (icons/text carry the meaning);
 * visible focus rings on every interactive element.
 */

.evreg {
	--evreg-dark: #290038;
	--evreg-accent: #741099;
	--evreg-border: #d9cfe2;
	--evreg-bg: #faf7fc;
	--evreg-error: #b3261e;
	--evreg-ok: #1b6e3c;
	max-width: 720px;
	font-size: 15px;
	line-height: 1.5;
}

/* E2E finding: Enfold styluje label/fieldset display:… co NADPISUJE UA-rule dla
   [hidden] — wymuszamy, inaczej pola firmowe/nocleg widać od startu. */
.evreg [hidden] { display: none !important; }

.evreg fieldset {
	border: 1px solid var(--evreg-border);
	border-radius: 8px;
	padding: 14px 16px;
	margin: 0 0 18px;
}

.evreg legend {
	font-weight: 700;
	color: var(--evreg-dark);
	padding: 0 6px;
}

.evreg label { display: block; margin: 6px 0; }
.evreg input[type="text"],
.evreg textarea {
	width: 100%;
	max-width: 420px;
	padding: 7px 10px;
	border: 1px solid var(--evreg-border);
	border-radius: 6px;
	display: block;
	margin-top: 2px;
}

.evreg input:focus-visible,
.evreg textarea:focus-visible,
.evreg button:focus-visible,
.evreg a:focus-visible {
	outline: 3px solid var(--evreg-accent);
	outline-offset: 2px;
}

/* — Buttons — */
.evreg-btn {
	display: inline-block;
	padding: 9px 20px;
	border-radius: 6px;
	border: 2px solid var(--evreg-accent);
	background: transparent;
	color: var(--evreg-accent);
	font-weight: 700;
	cursor: pointer;
	text-decoration: none;
}
/* LLM intent (Task 069.02 kontrast CTA — bug E17): a.evreg-btn--primary to <a>, więc link-color
   motywu Enfold (`.main_color a...`) wygrywa specyficznością i maluje CIEMNY tekst na ciemnym tle
   (nieczytelne CTA). `color:#fff !important` odwraca to — zweryfikowane na LIVE przez Konrada.
   Osobna reguła na hover/focus, bo Enfold koloruje każdy stan linku niezależnie; visited trzyma
   accent-bg (nie dark) żeby po powrocie przycisk nie wyglądał jak wciśnięty. */
.evreg-btn--primary,
.evreg-btn--primary:visited { background: var(--evreg-accent); color: #fff !important; }
.evreg-btn--primary:hover,
.evreg-btn--primary:focus { background: var(--evreg-dark); border-color: var(--evreg-dark); color: #fff !important; }
.evreg-btn--ghost:hover { background: var(--evreg-bg); }
.evreg-btn--danger { border-color: var(--evreg-error); color: var(--evreg-error); }
.evreg-btn--danger:hover { background: var(--evreg-error); color: #fff; }
.evreg-btn[disabled] { opacity: 0.55; cursor: not-allowed; }

/* — Participation tiles (F1: two large tiles, not a dropdown) — */
.evreg-tiles { display: block; }
.evreg-tile { display: inline-block; width: calc(50% - 8px); vertical-align: top; margin: 4px 0; }
.evreg-tile input { position: absolute; opacity: 0; }
.evreg-tile__box {
	display: block;
	border: 2px solid var(--evreg-border);
	border-radius: 10px;
	padding: 14px;
	cursor: pointer;
	transition: border-color 0.15s, background 0.15s;
	min-height: 108px;
}
.evreg-tile input:checked + .evreg-tile__box {
	border-color: var(--evreg-accent);
	background: var(--evreg-bg);
	box-shadow: inset 0 0 0 1px var(--evreg-accent);
}
.evreg-tile input:focus-visible + .evreg-tile__box {
	outline: 3px solid var(--evreg-accent);
	outline-offset: 2px;
}
.evreg-tile input:checked + .evreg-tile__box .evreg-tile__name::before {
	content: "✓ ";
	color: var(--evreg-accent);
}
.evreg-tile__name { display: block; font-weight: 700; color: var(--evreg-dark); font-size: 17px; }
.evreg-tile__desc { display: block; font-size: 13px; margin: 4px 0; }
.evreg-tile__price { display: block; font-weight: 700; color: var(--evreg-accent); }
/* Task 090.04 B1: cena na kafelku udziału dziedziczyła 15px i była mniejsza od tytułu kafla (17px) — bump do 16px. */
.evreg-tile__price { font-size: 16px; }
/* Task 068: kafelek udziału „tylko warsztaty" bez dostępnych slotów — wyszarzony, nieklikalny (nota
   w treści niesie stan, nie sam kolor — WCAG). Opis bez ceny bywa dłuższy: min-height wyżej trzyma równanie. */
.evreg-tile--disabled .evreg-tile__box { opacity: 0.55; cursor: not-allowed; }
.evreg-tile--disabled input { cursor: not-allowed; }

/* — Radios / checks — */
.evreg-radio--inline { display: inline-block; margin-right: 16px; }
.evreg-check input { margin-right: 6px; }
.evreg-check--disabled { opacity: 0.55; }
.evreg-soldout { color: var(--evreg-error); font-style: normal; font-weight: 700; margin-left: 6px; }

/* — Add-ons (F-01) — */
/* Task 090.04 #2: pole wyboru add-onu i jego cena były w rozmiarze bazowym (15px) i zlewały się z
   otoczeniem — checkbox do 16px, cena add-onu z wagą/akcentem ceny (spójnie z .evreg-tile__price). */
.evreg-addons .evreg-check { font-size: 16px; }
.evreg-addon__price { font-weight: 700; color: var(--evreg-accent); }
/* LLM intent (Task 090.03 [required hints]): stars are presentation only; the authoritative verdict
   still comes from TicketService::validate(). VAT/Tax ID shows its star only while existing JS marks
   the currently visible EU field required. Cross-ref: D-138, P-111, G-214. */
.evreg-required { color: var(--evreg-accent); font-weight: 700; }
.evreg-required--dynamic { display: none; }
.evreg label:has(input[required]) .evreg-required--dynamic { display: inline; }

/* LLM intent (Task 077 U-15 [link do regulaminu/polityki niewidoczny — Konrad klikał przez przypadek
   zaznaczając zgodę]): linki w sekcji zgód motyw Enfold malował jak zwykły tekst (brak podkreślenia/
   koloru) → user nie wiedział, że „regulamin wydarzenia" jest klikalny. Wymuszamy wygląd linku:
   accent + podkreślenie + pogrubienie + strzałka ↗ (otwiera się w nowej karcie target=_blank).
   Cross-ref: Task 077 U-15, 077.01. */
.evreg-consents a,
.evreg-consents__info a {
	color: var(--evreg-accent);
	text-decoration: underline;
	text-underline-offset: 2px;
	font-weight: 700;
}
.evreg-consents a:hover,
.evreg-consents a:focus,
.evreg-consents__info a:hover,
.evreg-consents__info a:focus { color: var(--evreg-dark); }
.evreg-consents a::after,
.evreg-consents__info a::after { content: " ↗"; font-weight: 400; }

/* — Price preview — */
/* U1 (Task 069.05, uwagi po smoke #1): tekst NIOSĄCY treść (tier, hinty, noty) był szarawy (#666/#555)
   i w podsumowaniach wyglądał jak pozycja nieaktywna — podniesiony do #444 (hierarchię niesie rozmiar,
   nie wyblakły kolor). Szarość zostaje WYŁĄCZNIE na dekoracji (bordery/separatory) i badge'ach statusów
   (.evreg-badge--* to celowe stany — NIE ruszać). Objęte: .evreg-price__tier, .evreg-hint, .evreg-info__note. */
.evreg-price { font-size: 17px; color: var(--evreg-dark); }
.evreg-price__amount { color: var(--evreg-accent); font-size: 20px; }
.evreg-price__tier { font-size: 13px; color: #444; margin-left: 6px; }
/* LLM intent (Task 090.03 [currency auto-switch notice]): this is informational, not a validation
   error; draw the frame only while JS supplies localized copy. Cross-ref: D-138, P-111, G-214.
   Task 090.04 B2: nota progu cenowego (.evreg-price__note, register.js z boot.tiers) to ten sam wzorzec
   „nota informacyjna" — wspólny selektor, jedna ramka info; :not(:empty) trzyma ramkę poza pustym stanem. */
.evreg-currency__note:not(:empty),
.evreg-price__note:not(:empty) {
	background: #eef5ff;
	border: 1px solid #b8d4f0;
	border-radius: 6px;
	padding: 8px 12px;
	color: #294861;
	font-weight: 400;
}
/* LLM intent (Task 077 U-13 [„ordynarnie wielki tekst" przy kaflu Tylko warsztaty]): modyfikator
   nakładany/zdejmowany przez register.js repaint — 2-zdaniowe podsumowanie wyboru WO NIE może mieć
   stylu kwoty (20px accent bold), schodzi do rozmiaru akapitu .evreg (15px), normalnej wagi i koloru
   treści. Bazowe .evreg-price__amount NIE ruszać: na zwykłym bilecie klasa znika i selektor dalej
   niesie kwotę w pełnym stylu (kontrakt E2E K-02/K-04). Cross-ref: Task 077 U-13, 077.01. */
.evreg-price--wo .evreg-price__amount {
	font-size: 15px;
	font-weight: 400;
	color: inherit;
}

/* — Code — */
.evreg-code { margin: 0 0 18px; }
.evreg-code__row { display: flex; gap: 8px; max-width: 420px; }
.evreg-code__row input { flex: 1; margin-top: 0; }
.evreg-code__result { margin: 6px 0 0; font-weight: 600; min-height: 1.2em; }
.evreg-code__result.is-ok { color: var(--evreg-ok); }
.evreg-code__result.is-bad { color: var(--evreg-error); }

/* — Student document (Task 067 #1B): revealed by JS for scope=student — */
.evreg-student-doc__input { margin: 6px 0; max-width: 420px; }
.evreg-student-doc__status { margin: 6px 0 0; font-weight: 600; min-height: 1.2em; }
.evreg-student-doc__status.is-ok { color: var(--evreg-ok); }
.evreg-student-doc__status.is-bad { color: var(--evreg-error); }

/* — Hints / errors / flash — */
.evreg-hint { font-size: 13px; color: #444; margin: 4px 0; } /* U1: treść, nie dekoracja */
/* U-17 (Task 077): hint formatu pola (NIP/VAT/adres faktury) to <span class="evreg-hint"> WEWNĄTRZ
   <label> — chowa się razem z polem (label.evreg-billing__nip/__vat ma hidden) i nie zostaje osobnym
   itemem 2-kolumnowej siatki .evreg-billing__fields; span jest inline, wymuszamy własną linię pod inputem. */
.evreg label > .evreg-hint { display: block; margin-bottom: 0; }
.evreg-form__error,
.evreg-error {
	background: #fdeceb;
	border: 1px solid var(--evreg-error);
	color: var(--evreg-error);
	border-radius: 6px;
	padding: 10px 14px;
	margin: 0 0 16px;
	font-weight: 600;
}
/* LLM intent (Task 090.03 W4 [anti-jump init]): PHP reserves the populated block before JS starts;
   visibility and opacity hide its content without ever removing its height from flow. Cross-ref: D-138. */
.evreg-form__error { visibility: hidden; opacity: 0; transition: opacity 0.15s ease; }
.evreg-form__error.is-visible { visibility: visible; opacity: 1; }
/* Task 087 B: pełna lista błędów POD przyciskiem submit (drugi kontener; góra = baner err_banner).
   Wzorzec wizualny .evreg-form__error; margines od góry, bo kontener siedzi ZA przyciskiem. */
.evreg-form__errors {
	background: #fdeceb;
	border: 1px solid var(--evreg-error);
	color: var(--evreg-error);
	border-radius: 6px;
	padding: 10px 14px;
	margin: 16px 0 0;
	font-weight: 600;
}
.evreg-form__errors ul { margin: 0; padding-left: 20px; }
.evreg-form__errors li { margin: 2px 0; }
/* LLM intent (Task 090.03 [neutral server checklist]): --pending is the permanent grey/todo tone
   for the complete server verdict; field outlines and aria-invalid still identify exact controls.
   Cross-ref: D-138, P-111, G-214. */
.evreg-form__errors--pending {
	background: #f5f5f5;
	border-color: #ccc;
	color: #444;
	font-weight: 400;
}
.evreg input.evreg-field--invalid,
.evreg select.evreg-field--invalid,
.evreg textarea.evreg-field--invalid {
	border-color: var(--evreg-error);
}
.evreg fieldset.evreg-field--invalid { border-color: var(--evreg-error); }
.evreg label.evreg-field--invalid {
	outline: 1px solid var(--evreg-error);
	outline-offset: 2px;
	border-radius: 4px;
}
.evreg-flash {
	background: #eaf6ee;
	border: 1px solid var(--evreg-ok);
	color: var(--evreg-ok);
	border-radius: 6px;
	padding: 10px 14px;
	margin: 0 0 16px;
	font-weight: 600;
}

/* — Status card — */
.evreg-card {
	border: 1px solid var(--evreg-border);
	border-radius: 10px;
	padding: 18px 20px;
	background: #fff;
}
.evreg-card__title { margin: 0 0 10px; color: var(--evreg-dark); }
.evreg-badge {
	display: inline-block;
	padding: 2px 10px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 700;
	border: 1.5px solid;
}
.evreg-badge--pending_payment { color: #8a5a00; border-color: #8a5a00; background: #fff7e6; }
.evreg-badge--confirmed { color: var(--evreg-ok); border-color: var(--evreg-ok); background: #eaf6ee; }
.evreg-badge--waitlisted { color: #145a8a; border-color: #145a8a; background: #e8f2fa; }
.evreg-badge--cancelled { color: #8a1c1c; border-color: #8a1c1c; background: #fbeaea; }
.evreg-badge--expired { color: #555; border-color: #999; background: #f2f2f2; }
/* Task 069.05: CTA warsztatów na karcie biletu — primary NAD linkiem potwierdzenia i self-cancel;
   .evreg-card__agenda-teaser usunięty razem z renderem teasera (zastąpiony przez CTA). */
.evreg-card__cta-row { display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0 6px; }
.evreg-card__workshops-note { margin: 14px 0 6px; }
.evreg-cancel { margin-top: 10px; }
.evreg-terminal__next { margin-top: 8px; }

/* — Task 069.09: „Zarządzaj rejestracją" (self-cancel schowany w <details>) + lista konsekwencji — */
.evreg-manage { margin-top: 14px; border-top: 1px solid var(--evreg-border); padding-top: 8px; }
.evreg-manage > summary { cursor: pointer; font-weight: 700; color: var(--evreg-dark); padding: 4px 0; }
.evreg-manage[open] > summary { margin-bottom: 6px; }
.evreg-cancel__q { margin: 6px 0; font-weight: 600; }
.evreg-cancel__consequences { margin: 0 0 10px; padding-left: 20px; font-size: 14px; color: #444; }
.evreg-cancel__consequences li { margin: 3px 0; }

/* — Task 069.16: helpy uczestnika (HelpBox `<details>` + mini-instrukcja formularza; gate show_helps — przy OFF
   markup nie istnieje, G-186). Blok skopiowany 1:1 z assets/agenda.css (strona formularza NIE ładuje agenda.css). — */
.evreg-help {
	margin: 0 0 12px;
	border: 1px solid var(--evreg-border, #d9cfe2);
	border-radius: 8px;
	padding: 8px 12px;
	background: var(--evreg-bg, #faf7fc);
}
.evreg-help > summary { cursor: pointer; font-weight: 700; color: var(--evreg-dark, #290038); padding: 4px 0; }
.evreg-help[open] > summary { margin-bottom: 6px; }
/* #444 = ta sama barwa treści co .evreg-cancel__consequences (kontrasty U1 — nie zmieniać). */
.evreg-help__list { margin: 0 0 4px; padding-left: 20px; font-size: 14px; color: #444; }
.evreg-help__list li { margin: 3px 0; }

/* — Anonymous event info card (Task 069.01 Etap 1) — */
.evreg-card--info { margin-bottom: 16px; }
.evreg-info { margin: 0 0 12px; }
.evreg-info__row { display: flex; gap: 10px; padding: 5px 0; border-bottom: 1px solid var(--evreg-border); }
.evreg-info__row:last-child { border-bottom: 0; }
.evreg-info__row dt { flex: 0 0 34%; margin: 0; font-weight: 700; color: var(--evreg-dark); }
.evreg-info__row dd { margin: 0; }
/* Task 090.04 B5: wiersz ceny („Opłata od …") wyróżniony — dd pogrubione + akcent (hook markupu
   evreg-info__row--price daje inne zadanie; pozostałe dd zostają na normalnej wadze — zwykła konwencja <dl>). */
.evreg-info__row--price dd { font-weight: 700; color: var(--evreg-accent); }
.evreg-info__includes { font-size: 14px; color: #444; }
.evreg-info__note { font-size: 13px; color: #444; } /* U1: treść, nie dekoracja */

/* — Payment block — */
.evreg-pay {
	margin: 14px 0;
	border: 1px solid var(--evreg-border);
	border-radius: 8px;
	padding: 12px 16px;
	background: var(--evreg-bg);
}
.evreg-pay__title { margin: 0 0 8px; color: var(--evreg-dark); }
.evreg-pay__table { width: 100%; border-collapse: collapse; margin: 0 0 8px; }
.evreg-pay__table th, .evreg-pay__table td { padding: 4px 8px; border-bottom: 1px solid var(--evreg-border); text-align: left; }
.evreg-pay__table .evreg-num { text-align: right; white-space: nowrap; }
.evreg-pay__gross th, .evreg-pay__gross td { border-top: 2px solid var(--evreg-dark); }
.evreg-pay__due th, .evreg-pay__due td { color: var(--evreg-accent); font-size: 16px; }
/* Task 090.04 #3b (front): opłata pogrubiona; wiersz-nagłówek grupy kaucji pogrubiony + separator nad
   grupą (markup emituje G2 — reguły inertne do tego czasu). Cross-ref: Task 090.04 §2.3, #3b. */
.evreg-pay__row--fee th, .evreg-pay__row--fee td { font-weight: 700; }
.evreg-pay__row--dep-header th { font-weight: 700; border-top: 2px solid var(--evreg-border); }
/* Task 090.04 B3: termin płatności do rozmiaru kwoty „do zapłaty" (16px) — krytyczna data nie mniejsza od otoczenia. */
.evreg-pay__deadline { font-size: 16px; }
/* Task 090.04 B4: tytuł przelewu / dane konta to dane krytyczne — z 14px do 16px (nie mniejsze od bazy);
   sam tytuł przelewu (.evreg-pay__ref code) dodatkowo pogrubiony. */
.evreg-pay__ref code, .evreg-pay__bank code {
	background: #fff;
	border: 1px solid var(--evreg-border);
	border-radius: 4px;
	padding: 2px 6px;
	font-size: 16px;
}
.evreg-pay__ref code { font-weight: 700; }
.evreg-pay__settled { color: var(--evreg-ok); font-weight: 700; }
.evreg-pay__overpaid { color: #8a5a00; font-weight: 600; }
.evreg-pay__bank { margin: 8px 0 0; }
.evreg-pay__bank dt { font-weight: 700; color: var(--evreg-dark); }
.evreg-pay__bank dd { margin: 2px 0 2px 12px; }

/* — Login CTA — */
.evreg-login { padding: 14px 0; }
/* Task 069.02: dwa CTA anonima (Zaloguj się / Utwórz konto) w jednym rzędzie, zawijane na mobile. */
.evreg-login__actions { display: flex; flex-wrap: wrap; gap: 10px; }

/* Task 069.07: ludzkie zdanie-status pod metryką karty (StatusCard::status_line). */
.evreg-card__status-line { margin: 6px 0 10px; color: #444; }

/* — Event nav ([3ks_event_nav] — Task 069 U4b): pasek zakładek eventu — */
/* Buttony niosą atomy .evreg-btn (markup: class="evreg-btn evreg-nav__btn") — wygląd spójny
   z resztą CTA bez duplikacji reguł; kontener ma klasę .evreg (zmienne --evreg-* + max-width).
   Tu tylko layout paska + stan bieżącej strony (aria-current="page" niesie stan dla AT). */
.evreg-nav {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 18px;
}
/* Task 074 (K-074-4): utwardzenie navu na inline-wrappery edytorów — Avia/wklejenie potrafi owinąć
   linki w <strong>/<b> (objaw 3 audytu-diagnozy 074), co wyrzuciłoby buttony z układu flex paska.
   display:contents rozpuszcza wrapper, więc <a> zostają bezpośrednimi flex-itemami. Cross-ref: _tasks/074 K-074-4. */
.evreg-nav > strong, .evreg-nav > b { display: contents; }
.evreg-nav__btn:hover { background: var(--evreg-bg); } /* jak .evreg-btn--ghost */
/* Bieżąca zakładka: wypełniony akcent jak .evreg-btn--primary; !important z tego samego
   powodu co fix E17 (Enfold koloruje <a> mocniejszym selektorem motywu). */
.evreg-nav__btn.is-current,
.evreg-nav__btn.is-current:visited {
	background: var(--evreg-accent);
	color: #fff !important;
	pointer-events: none; /* klik w bieżącą zakładkę = no-op */
}

/* — Mobile (§6: ≤768px) — */
@media (max-width: 768px) {
	.evreg-tile { width: 100%; display: block; }
	.evreg-code__row { flex-direction: column; }
	.evreg input[type="text"], .evreg textarea { max-width: 100%; }
}

/* — Task 077 fala III½ (uwagi Konrada z przeglądu Dockera 2026-07-11) —
   1) Tekst WPISYWANY w pola = ciemny (bez jawnego color dziedziczył szary z Enfolda i zlewał się
      z placeholderem — szary zarezerwowany dla podpowiedzi).
   2) Selecty (kraj uczestnika/nabywcy) stylowane spójnie z inputami.
   3) Szeroki ekran: sekcje pól w 2 kolumnach zamiast długiej pojedynczej (pełna przebudowa
      layoutu = backlog P-17; tu tylko tani grid). */
.evreg input,
.evreg textarea,
.evreg select { color: #111 !important; }
.evreg input::placeholder,
.evreg textarea::placeholder { color: #8c8c8c; opacity: 1; }
.evreg select {
	width: 100%;
	max-width: 420px;
	padding: 7px 10px;
	border: 1px solid var(--evreg-border);
	border-radius: 6px;
	display: block;
	margin-top: 2px;
	background: #fff;
}

@media (min-width: 1024px) {
	.evreg { max-width: 960px; }
	.evreg-participant,
	.evreg-billing__fields {
		display: grid;
		grid-template-columns: 1fr 1fr;
		column-gap: 28px;
		align-items: start;
	}
	/* Pełna szerokość: textarea (uwagi/adres), hint pod uwagami i pole nazwy nabywcy;
	   bez :has() (starsze przeglądarki) siatka po prostu zostaje 1-kolumnowa w tej parze — degradacja łagodna. */
	.evreg-participant > label:has(textarea),
	.evreg-participant > .evreg-hint,
	.evreg-billing__fields > label:first-child,
	.evreg-billing__fields > label:has(textarea) { grid-column: 1 / -1; }
}
