/* Formularz kontaktowy — WYŁĄCZNIE to, czego kit nie rysuje.

   Pola, etykiety, komunikaty, zgoda i załącznik przyszły z kitu (grupa forms
   w kit.css) i nie ma ich tutaj ani jednej reguły. Wcześniej stał w tym pliku
   komplet własnych pól, złożony z tokenów w oczekiwaniu na komponent — te same
   nazwy klas, więc przeniesienie kitu było podmianą arkusza, dokładnie jak
   zapowiadał nagłówek poprzedniej wersji. Aliasy --foreto-field-* przeniosły
   się przy tej okazji do kit-bridge.css, bo od teraz czyta je kit, a nie
   ten plik.

   Zostaje pięć rzeczy, których kit nie zna, bo nie należą do POLA, tylko do
   tego jednego formularza: pułapka na roboty, podsumowanie wyniku, lista
   błędów, stopka z notą i stan wysyłki na przycisku.                        */

/* Kotwica dla pułapki — patrz .foreto-form__reserve na końcu pliku. */
.foreto-form {
	position: relative;
}

/* --- Stopka ------------------------------------------------------------ */

.foreto-form__actions {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--foreto-space-4);
	margin-top: var(--foreto-space-5);
}

.foreto-form__note {
	margin: 0;
	font-size: var(--foreto-font-size-card);
	line-height: var(--foreto-msg-line);
	color: var(--foreto-text-muted);
}

.foreto-form__policy {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Wysyłka w toku. aria-busy zamiast disabled, bo wyłączony przycisk wypada
   z kolejności tabulacji i fokus przeskakuje w nieoczekiwane miejsce.
   Wygaszenie .5 jest wprost z kitu — .foreto-btn[disabled].               */
.foreto-form__submit[aria-busy="true"] {
	opacity: .5;
	cursor: progress;
}

/* --- Podsumowanie wyniku ----------------------------------------------- */

.foreto-form__status {
	padding: var(--foreto-space-4);
	background: var(--foreto-surface-band);
	border-inline-start: var(--foreto-space-1) solid var(--foreto-border-strong);
}

.foreto-form__status:empty {
	display: none;
}

/* Kolor paska jest DRUGIM nośnikiem, nigdy pierwszym: pierwszym jest zdanie
   w środku („Nie wysłaliśmy wiadomości…" / treść podziękowania) i rola
   elementu, którą słyszy czytnik ekranu.                                   */
.foreto-form__status--error {
	border-inline-start-color: var(--foreto-text-accent);
}

.foreto-form__status--success {
	border-inline-start-color: var(--foreto-text-success);
}

/* :focus, nie :focus-visible. Fokus przychodzi tu z kodu (kotwica w adresie
   albo skrypt) na element z tabindex="-1", a dla takiego fokusa część
   przeglądarek nie zapala :focus-visible — obwódki by nie było akurat wtedy,
   gdy jest najbardziej potrzebna.                                          */
.foreto-form__status:focus {
	outline: 2px solid var(--foreto-focus);
	outline-offset: 2px;
}

.foreto-form__status-title {
	margin: 0;
	font-weight: 700;
}

.foreto-form__errors {
	display: flex;
	flex-direction: column;
	gap: var(--foreto-space-1);
	margin: var(--foreto-space-2) 0 0;
}

/* Podkreślenie, bo w podsumowaniu błędów wszystko jest czerwone — bez niego
   odsyłacz niczym nie różni się od tekstu obok.                            */
.foreto-form__errors a {
	color: var(--foreto-text-accent);
	text-decoration: underline;
}

/* --- Pułapka na roboty -------------------------------------------------- */

/* NIE display:none i NIE atrybut hidden: jedno i drugie robot rozpoznaje
   z samego znacznika, bez pobierania arkusza. Pole stoi poza obszarem okna,
   więc żeby je odróżnić, trzeba wczytać i policzyć CSS — a i wtedy zostaje
   nazwa pola liczona z soli witryny, której zgadnąć się nie da.

   -9999px to jedyna wartość na sztywno w tym pliku i nie jest decyzją
   projektową, tylko odległością „na pewno poza ekranem". W układzie od lewej
   do prawej odsunięcie w lewo nie tworzy paska przewijania.                */
.foreto-form__reserve {
	position: absolute;
	top: 0;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}
