/**
 * Struktura formularza i modala — ładowana zawsze, niezależnie od trybu chota.css.
 * Tylko układ i rzeczy funkcjonalne (honeypot, komunikaty, <dialog>), bez „wyglądu” pól.
 *
 * @package WP_Jac_Simple_Form
 * @since   1.7.0
 * @version 1.14.0
 */

.wpjac-sifo-field { margin-bottom: 14px; display: flex; flex-direction: column; gap: 4px; }
.wpjac-sifo-radio-group { display: flex; flex-direction: column; gap: 4px; }
.wpjac-sifo-checkbox-label { display: flex; align-items: center; gap: 6px; font-weight: 400; }
.wpjac-sifo-hp-wrap { position: absolute; left: -9999px; top: -9999px; }
.wpjac-sifo-submit:disabled { opacity: 0.6; cursor: default; }
.wpjac-sifo-messages { min-height: 20px; }
.wpjac-sifo-messages.wpjac-sifo-success { color: #15803d; }
.wpjac-sifo-messages.wpjac-sifo-error { color: #b91c1c; }

/* ---- Modal (natywny <dialog>: Esc, pułapka focusu i powrót focusu robi przeglądarka) ---- */
.wpjac-sifo-modal {
	border: 0;
	padding: 0;
	width: min( 560px, calc( 100vw - 32px ) );
	max-width: none;
	background: transparent;
	color: inherit;
	overflow: visible;
}
.wpjac-sifo-modal::backdrop { background: rgba( 0, 0, 0, 0.5 ); }
.wpjac-sifo-modal-card {
	background: #fff;
	color: #1f2328;
	border-radius: 6px;
	box-shadow: 0 10px 30px rgba( 0, 0, 0, 0.25 );
	padding: 20px 24px;
	max-height: calc( 100vh - 32px );
	max-height: calc( 100dvh - 32px );
	overflow: auto;
}
.wpjac-sifo-modal-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.wpjac-sifo-modal-title { margin: 0; font-size: 1.25em; line-height: 1.3; }
.wpjac-sifo-modal-close { background: none; border: 0; padding: 4px 8px; font-size: 24px; line-height: 1; cursor: pointer; color: inherit; }
.wpjac-sifo-modal-status { margin: 8px 0; }
/* Bez przewijania strony pod modalem. Blokada na <html> (to on przewija stronę), a miejsce po pasku
   przewijania zostaje zarezerwowane (scrollbar-gutter), więc układ w tle nie przeskakuje (1.14.0).
   Klasę wpjac-sifo-gutter JS dodaje tylko, gdy strona faktycznie ma pasek zajmujący miejsce. */
html.wpjac-sifo-modal-open { overflow: hidden; }
html.wpjac-sifo-modal-open.wpjac-sifo-gutter { scrollbar-gutter: stable; }
/* Wbudowana chota: kontener zakresu w modalu jest tylko „opakowaniem” karty — bez własnego tła. */
.wpjac-sifo-modal .wpjac-sifo-scope { background: transparent; }
.wpjac-sifo-modal .card.wpjac-sifo-modal-card { margin: 0; }

/* ---- Błędy pól (1.8.0) — kolor z chota (--color-error), jeśli jest, inaczej własny ---- */
.wpjac-sifo-hint { display: block; margin-top: 2px; font-size: 0.875em; line-height: 1.4; color: var( --color-error, #b91c1c ); }
.wpjac-sifo-has-error input:not([type="checkbox"]):not([type="radio"]),
.wpjac-sifo-has-error select,
.wpjac-sifo-has-error textarea { border-color: var( --color-error, #b91c1c ); }
.wpjac-sifo-has-error input:not([type="checkbox"]):not([type="radio"]):focus,
.wpjac-sifo-has-error select:focus,
.wpjac-sifo-has-error textarea:focus { outline-color: var( --color-error, #b91c1c ); }

/* ---- Ładowanie (1.8.0) ---- */
.wpjac-sifo-loading { cursor: progress; }
.wpjac-sifo-submit.is-loading { cursor: progress; display: inline-flex; align-items: center; justify-content: center; }
.wpjac-sifo-submit.is-loading:disabled { opacity: 0.85; }
.wpjac-sifo-spinner {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1em;
	height: 1em;
	line-height: 1;
	margin-right: 0.5em;
	flex: none;
}
.wpjac-sifo-spinner img,
.wpjac-sifo-spinner svg { display: block; width: 1em; height: 1em; }
.wpjac-sifo-spinner.is-spinning { animation: wpjac-sifo-spin 0.9s linear infinite; }
.wpjac-sifo-modal-status { display: flex; align-items: center; }
@keyframes wpjac-sifo-spin { to { transform: rotate( 360deg ); } }
@media ( prefers-reduced-motion: reduce ) {
	.wpjac-sifo-spinner.is-spinning { animation-duration: 3s; }
}
