/**
 * AP Rimborso — stili base, a bassa specificità, pensati per ereditare il tema.
 *
 * Principi:
 * - Nessun colore brand hard-coded: pulsanti e form usano le classi WooCommerce
 *   (.button, .wp-element-button, .input-text, .form-row) e prendono lo stile
 *   del tema ospite.
 * - Custom properties con default che ereditano dal block theme
 *   (--wp--preset--color--*) e fallback su currentColor.
 * - Solo spaziatura/layout essenziali, scoped sotto .ap-rimborso.
 * - Niente !important, niente colori assoluti.
 */
.ap-rimborso {
	/* Scala di spaziatura coerente (base 8px). */
	--ap-rimborso-gap: 1.25rem;
	--ap-rimborso-gap-sm: 0.5rem;
	--ap-rimborso-radius: 0.375rem;

	/* Colori che ereditano dal tema con fallback morbidi su currentColor.
	   color-mix smorza senza ridurre il contrasto del testo (a differenza di
	   opacity, che renderebbe il testo meno leggibile). */
	--ap-rimborso-border: color-mix(in srgb, currentColor 22%, transparent);
	--ap-rimborso-surface: color-mix(in srgb, currentColor 5%, transparent);
	--ap-rimborso-muted: color-mix(in srgb, currentColor 72%, transparent);
	--ap-rimborso-accent: var( --wp--preset--color--primary, currentColor );

	margin: var(--ap-rimborso-gap) 0;
}

.ap-rimborso__title {
	margin: 0 0 var(--ap-rimborso-gap-sm);
}

/* Indicatore di passaggio: progressione leggibile, senza JS né icone proprietarie. */
.ap-rimborso__step {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0 var(--ap-rimborso-gap-sm);
	margin: 0 0 var(--ap-rimborso-gap);
	color: var(--ap-rimborso-muted);
}

.ap-rimborso__step-badge {
	font-weight: 600;
	color: inherit;
}

.ap-rimborso__summary {
	margin: 0 0 var(--ap-rimborso-gap);
	padding: 1rem;
	border: 1px solid var(--ap-rimborso-border);
	border-radius: var(--ap-rimborso-radius);
	background: var(--ap-rimborso-surface);
}

.ap-rimborso__summary > :first-child {
	margin-top: 0;
}

.ap-rimborso__summary > :last-child {
	margin-bottom: 0;
}

.ap-rimborso__receipt {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ap-rimborso__receipt li {
	margin: 0 0 var(--ap-rimborso-gap-sm);
}

.ap-rimborso__receipt li:last-child {
	margin-bottom: 0;
}

.ap-rimborso__receipt-label {
	display: block;
	font-size: 0.875em;
	color: var(--ap-rimborso-muted);
}

.ap-rimborso__receipt-tz {
	color: var(--ap-rimborso-muted);
}

.ap-rimborso__notice {
	margin: 0 0 var(--ap-rimborso-gap);
}

/* Spaziatura tra azione e contenuto, indipendente dal tema. */
.ap-rimborso__actions {
	margin-bottom: 0;
}

/* Focus visibile garantito anche su temi che lo rimuovono.
   Eredita il colore (accent del block theme o currentColor): nessun brand fisso. */
.ap-rimborso :is(input, button, a):focus-visible {
	outline: 2px solid var(--ap-rimborso-accent);
	outline-offset: 2px;
}

/* Il pulsante di conferma resta lo stile del tema (.button.alt); aggiungiamo solo
   una transizione sobria del focus, disabilitata se l'utente preferisce. */
.ap-rimborso__button {
	transition: box-shadow 0.15s ease, outline-offset 0.15s ease;
}

@media (prefers-reduced-motion: reduce) {
	.ap-rimborso__button {
		transition: none;
	}
}
