/**
 * Campi VisuraSi in pagina prodotto.
 *
 * Il problema che risolve: i campi ereditavano lo sfondo del blocco prodotto
 * (grigio-azzurro chiaro) e risultavano quasi indistinguibili dal contenitore.
 * Qui si dichiara uno sfondo bianco esplicito e un bordo leggibile.
 *
 * Regole di convivenza con il tema:
 * - selettori discendenti da .vsm-fields, per stare sopra agli stili generici
 *   del tema sugli input senza ricorrere a !important;
 * - nessun appearance/background-image sui select: la freccia la disegna il
 *   tema e sovrascriverla la farebbe sparire o raddoppiare;
 * - colori neutri, cosi' il blocco resta coerente con qualsiasi palette.
 */

.vsm-fields {
	margin: 0 0 1.2em;
}

.vsm-field {
	margin: 0 0 14px;
}

.vsm-fields .vsm-label {
	display: block;
	margin: 0 0 5px;
	font-weight: 600;
	line-height: 1.3;
}

/* Il campo deve staccare dal contenitore: sfondo proprio e bordo definito. */
.vsm-fields .vsm-input {
	display: block;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	padding: 10px 12px;
	background-color: #fff;
	border: 1px solid #b9c2cd;
	border-radius: 6px;
	line-height: 1.4;
	color: inherit;
	box-shadow: none;
}

.vsm-fields .vsm-input:hover {
	border-color: #93a0af;
}

.vsm-fields .vsm-input:focus {
	border-color: #2b6cb0;
	outline: 0;
	box-shadow: 0 0 0 3px rgba(43, 108, 176, 0.15);
}

/* Tendina non ancora popolata (serve prima la provincia, o il comune). */
.vsm-fields .vsm-input:disabled,
.vsm-fields .vsm-input[disabled] {
	background-color: #f1f3f6;
	border-color: #d3d9e0;
	color: #8a94a0;
	cursor: not-allowed;
}

/* Data di nascita: tre caselle piccole in linea, non a tutta larghezza. */
.vsm-fields .vsm-dob {
	display: flex;
	gap: 8px;
	align-items: center;
}

.vsm-fields .vsm-dob .vsm-input.vsm-dob-part {
	width: auto;
	flex: 0 0 5.5em;
	text-align: center;
}

.vsm-fields .vsm-check {
	display: flex;
	gap: 8px;
	align-items: flex-start;
	line-height: 1.4;
}

.vsm-fields .vsm-check .vsm-input {
	display: inline-block;
	width: auto;
	margin-top: 2px;
	padding: 0;
}

.vsm-fields .vsm-help {
	display: block;
	margin-top: 5px;
	font-size: 0.85em;
	line-height: 1.35;
	color: #6b7280;
}

/* Errori di validazione (prima iniettati da JS: qui non dipendono dallo script). */
.vsm-field .vsm-error {
	display: block;
	margin-top: 5px;
	font-size: 0.85em;
	line-height: 1.35;
	color: #b32d2e;
}

.vsm-field.vsm-has-error .vsm-input {
	border-color: #b32d2e;
	background-color: #fffafa;
}

.vsm-field.vsm-has-error .vsm-input:focus {
	box-shadow: 0 0 0 3px rgba(179, 45, 46, 0.15);
}

/* Il campo obbligatorio: asterisco meno gridato del rosso pieno. */
.vsm-fields .vsm-label .required {
	color: #b32d2e;
	text-decoration: none;
}