/**
 * Stile del wizard di prenotazione.
 *
 * Valori allineati all'app presa a riferimento dal Cliente
 * (app.outreachitalia.it), rilevati dagli stili calcolati della pagina:
 * sfondo #e6f0f9, card bianche 12px con ombra tenue, campi pieni #f8f9fa da
 * 8px, navy #0e1f3b per titoli e call to action.
 *
 * Il font non è dichiarato: viene ereditato dal tema del sito.
 */

.dbhc {
	--dbhc-navy: #0e1f3b;
	--dbhc-navy-hover: #1b3560;
	--dbhc-navy-soft: #dae5f1;
	--dbhc-tab-hover: #cfdcec;
	--dbhc-bg: #e6f0f9;
	--dbhc-fill: #f8f9fa;
	--dbhc-text: #212529;
	--dbhc-muted: #5b6b82;
	--dbhc-blue: #1863dc;
	--dbhc-error: #b3261e;
	--dbhc-warning-bg: #fff6e5;
	--dbhc-warning-border: #e6a23c;
	--dbhc-card-radius: 12px;
	--dbhc-field-radius: 8px;
	--dbhc-shadow: 0 2px 4px rgba( 0, 0, 0, 0.075 );

	max-width: 780px;
	margin: 0 auto;
	color: var( --dbhc-text );
	font-size: 16px;
	line-height: 1.5;
	box-sizing: border-box;
}

.dbhc *,
.dbhc *::before,
.dbhc *::after {
	box-sizing: inherit;
}

.dbhc--boxed {
	padding: 32px 20px;
	border-radius: 16px;
	background: var( --dbhc-bg );
}

.dbhc-icon {
	width: 20px;
	height: 20px;
	flex: 0 0 auto;
	display: block;
}

/* ------------------------------------------------------------------ *
 * Titolo e barra di avanzamento
 * ------------------------------------------------------------------ */

.dbhc-title {
	margin: 0 auto 32px;
	max-width: 22ch;
	color: var( --dbhc-navy );
	font-size: 32px;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
}

.dbhc-progress {
	display: flex;
	max-width: 420px;
	margin: 0 auto 40px;
	padding: 0;
	list-style: none;
}

.dbhc-progress__item {
	position: relative;
	flex: 1 1 0;
	text-align: center;
	min-width: 0;
}

.dbhc-progress__item + .dbhc-progress__item::before {
	content: "";
	position: absolute;
	top: 20px;
	right: 50%;
	left: -50%;
	height: 2px;
	background: var( --dbhc-navy-soft );
}

.dbhc-progress__num {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin: 0 auto 8px;
	border-radius: 50%;
	background: var( --dbhc-navy-soft );
	color: var( --dbhc-navy );
	font-size: 16px;
	font-weight: 600;
	line-height: 1;
}

.dbhc-progress__label {
	display: block;
	color: var( --dbhc-muted );
	font-size: 14px;
}

.dbhc-progress__item.is-active .dbhc-progress__num {
	background: var( --dbhc-navy );
	color: #fff;
}

.dbhc-progress__item.is-active .dbhc-progress__label {
	color: var( --dbhc-navy );
	font-weight: 600;
}

/* ------------------------------------------------------------------ *
 * Tab tipo di viaggio
 * ------------------------------------------------------------------ */

.dbhc-tabs {
	display: flex;
	gap: 12px;
	margin-bottom: 16px;
}

.dbhc-tab {
	flex: 1 1 0;
	padding: 10px 15px;
	border: 0;
	border-radius: 6px;
	background: var( --dbhc-navy-soft );
	color: var( --dbhc-navy );
	font: inherit;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.4;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
}

.dbhc-tab:hover {
	background: var( --dbhc-tab-hover );
}

.dbhc-tab.is-active {
	background: var( --dbhc-navy );
	color: #fff;
}

/* ------------------------------------------------------------------ *
 * Card
 * ------------------------------------------------------------------ */

.dbhc-card {
	margin: 0 0 16px;
	padding: 24px;
	border: 0;
	border-radius: var( --dbhc-card-radius );
	background: #fff;
	box-shadow: var( --dbhc-shadow );
}

.dbhc-card__title {
	display: block;
	float: none;
	width: auto;
	padding: 0;
	margin: 0 0 16px;
	color: var( --dbhc-navy );
	font-size: 20px;
	font-weight: 600;
	line-height: 1.3;
}

.dbhc-grid {
	display: grid;
	grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	gap: 16px;
}

.dbhc-grid--single {
	grid-template-columns: 1fr;
}

.dbhc-field {
	min-width: 0;
	margin-bottom: 16px;
}

.dbhc-field:last-child,
.dbhc-grid .dbhc-field {
	margin-bottom: 0;
}

/* ------------------------------------------------------------------ *
 * Campi pieni
 * ------------------------------------------------------------------ */

.dbhc-input {
	display: flex;
	align-items: flex-start;
	padding: 8px 16px;
	border-radius: var( --dbhc-field-radius );
	background: var( --dbhc-fill );
}

.dbhc-input__icon {
	display: flex;
	align-items: center;
	margin: 26px 8px 0 0;
	color: var( --dbhc-navy );
	flex: 0 0 auto;
}

.dbhc-input__body {
	position: relative;
	display: block;
	flex: 1 1 auto;
	min-width: 0;
}

/*
 * L'icona nativa di data e ora duplicherebbe quella a sinistra: viene resa
 * trasparente e stesa su tutto il campo, così un clic in qualunque punto
 * apre comunque il selettore del browser.
 */
.dbhc-input__control[type="date"],
.dbhc-input__control[type="time"] {
	cursor: pointer;
}

.dbhc-input__control::-webkit-calendar-picker-indicator {
	position: absolute;
	inset: 0;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	opacity: 0;
	cursor: pointer;
}

.dbhc-input__label {
	display: block;
	margin: 0;
	color: var( --dbhc-text );
	font-size: 14px;
	font-weight: 700;
	line-height: 21px;
}

.dbhc-input__control {
	display: block;
	width: 100%;
	margin-top: 4px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var( --dbhc-text );
	font: inherit;
	font-size: 16px;
	line-height: 24px;
	min-height: 24px;
	appearance: none;
	-webkit-appearance: none;
}

select.dbhc-input__control {
	padding-right: 22px;
	background-image: url( "data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230e1f3b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E" );
	background-repeat: no-repeat;
	background-position: right center;
	background-size: 16px 16px;
	cursor: pointer;
}

textarea.dbhc-input__control {
	resize: vertical;
	min-height: 84px;
}

.dbhc-input__control:focus {
	outline: 2px solid var( --dbhc-blue );
	outline-offset: 3px;
}

.dbhc-input__control::placeholder {
	color: #8b97a8;
}

.dbhc-field.has-error .dbhc-input {
	box-shadow: inset 0 0 0 1px var( --dbhc-error );
}

.dbhc-req {
	margin-left: 2px;
	color: var( --dbhc-error );
}

.dbhc-error {
	display: block;
	margin-top: 6px;
	color: var( --dbhc-error );
	font-size: 14px;
	font-weight: 500;
}

.dbhc-error:empty {
	display: none;
}

.dbhc-hint {
	margin: 12px 0 0;
	color: var( --dbhc-muted );
	font-size: 14px;
}

.dbhc-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* ------------------------------------------------------------------ *
 * Opzioni a card (modalità di ritorno, pagamento)
 * ------------------------------------------------------------------ */

.dbhc-options {
	display: grid;
	gap: 12px;
}

.dbhc-option {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 12px 16px;
	border-radius: var( --dbhc-field-radius );
	background: var( --dbhc-fill );
	cursor: pointer;
	transition: box-shadow 0.15s ease, background 0.15s ease;
}

.dbhc-option input {
	margin: 3px 0 0;
	flex: 0 0 auto;
	accent-color: var( --dbhc-navy );
}

.dbhc-option:has( input:checked ) {
	background: #eef4fb;
	box-shadow: inset 0 0 0 2px var( --dbhc-navy );
}

.dbhc-option__body {
	display: block;
	min-width: 0;
}

.dbhc-option__label {
	display: block;
	color: var( --dbhc-navy );
	font-size: 16px;
	font-weight: 600;
}

.dbhc-option__price {
	display: inline-block;
	margin-left: 6px;
	padding: 1px 8px;
	border-radius: 999px;
	background: var( --dbhc-navy );
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	white-space: nowrap;
}

.dbhc-option__desc {
	display: block;
	margin-top: 2px;
	color: var( --dbhc-muted );
	font-size: 14px;
}

/* ------------------------------------------------------------------ *
 * Contatori passeggeri
 * ------------------------------------------------------------------ */

.dbhc-counter {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 12px 0;
	border-bottom: 1px solid #eef1f5;
}

.dbhc-counter:last-of-type {
	border-bottom: 0;
	padding-bottom: 4px;
}

.dbhc-counter__label {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var( --dbhc-navy );
	font-size: 16px;
	min-width: 0;
}

.dbhc-counter__controls {
	display: flex;
	align-items: center;
	gap: 12px;
	flex: 0 0 auto;
}

.dbhc-counter__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 1px solid var( --dbhc-navy-soft );
	border-radius: 50%;
	background: #fff;
	color: var( --dbhc-navy );
	font: inherit;
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
}

.dbhc-counter__btn:hover {
	border-color: var( --dbhc-navy );
}

.dbhc-counter__value {
	width: 34px;
	padding: 0;
	border: 0;
	background: transparent;
	color: var( --dbhc-navy );
	font: inherit;
	font-size: 16px;
	font-weight: 600;
	text-align: center;
	-moz-appearance: textfield;
	appearance: textfield;
}

.dbhc-counter__value::-webkit-outer-spin-button,
.dbhc-counter__value::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* ------------------------------------------------------------------ *
 * Richieste speciali
 * ------------------------------------------------------------------ */

.dbhc-extra {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 14px 0;
	border-bottom: 1px solid #eef1f5;
	flex-wrap: wrap;
}

.dbhc-extra:last-of-type {
	border-bottom: 0;
	padding-bottom: 0;
}

.dbhc-extra__text {
	flex: 1 1 240px;
	min-width: 0;
}

.dbhc-extra__label {
	display: block;
	color: var( --dbhc-navy );
	font-size: 15px;
}

.dbhc-extra__price {
	display: block;
	margin-top: 2px;
	color: var( --dbhc-muted );
	font-size: 13px;
	font-weight: 600;
}

.dbhc-toggle {
	display: flex;
	align-items: center;
	gap: 4px;
	flex: 0 0 auto;
}

.dbhc-toggle__opt {
	position: relative;
	cursor: pointer;
}

.dbhc-toggle__opt input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
}

.dbhc-toggle__opt span {
	display: block;
	min-width: 48px;
	padding: 6px 14px;
	border-radius: 999px;
	color: var( --dbhc-navy );
	font-size: 15px;
	font-weight: 600;
	text-align: center;
}

.dbhc-toggle__opt input:checked + span {
	background: var( --dbhc-navy );
	color: #fff;
}

.dbhc-toggle__opt input:focus-visible + span {
	outline: 2px solid var( --dbhc-blue );
	outline-offset: 2px;
}

/* ------------------------------------------------------------------ *
 * Avvisi
 * ------------------------------------------------------------------ */

.dbhc-notice {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-top: 16px;
	padding: 12px 16px;
	border-radius: var( --dbhc-field-radius );
	background: var( --dbhc-fill );
	color: var( --dbhc-navy );
	font-size: 14px;
	line-height: 1.45;
}

.dbhc-notice .dbhc-icon {
	margin-top: 1px;
	color: var( --dbhc-blue );
}

.dbhc-notice--warning {
	background: var( --dbhc-warning-bg );
	box-shadow: inset 0 0 0 1px var( --dbhc-warning-border );
}

.dbhc-notice--warning .dbhc-icon {
	color: #b57608;
}

.dbhc-notice--error {
	background: #fdecea;
	box-shadow: inset 0 0 0 1px var( --dbhc-error );
	color: var( --dbhc-error );
	font-weight: 500;
}

.dbhc-notice--error .dbhc-icon {
	color: var( --dbhc-error );
}

/* ------------------------------------------------------------------ *
 * Multitratta
 * ------------------------------------------------------------------ */

.dbhc-multi__contacts {
	display: grid;
	gap: 10px;
	margin: 16px 0 0;
}

.dbhc-multi__row {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 16px;
	border-radius: var( --dbhc-field-radius );
	background: var( --dbhc-fill );
	color: var( --dbhc-navy );
	font-size: 16px;
	font-weight: 600;
}

.dbhc-multi__row a {
	color: var( --dbhc-navy );
	text-decoration: none;
}

.dbhc-multi__row em {
	color: var( --dbhc-muted );
	font-size: 13px;
	font-style: normal;
	font-weight: 400;
}

/* ------------------------------------------------------------------ *
 * Step 3 – mappa, riepilogo, totale
 * ------------------------------------------------------------------ */

.dbhc-map {
	margin-bottom: 16px;
	border-radius: var( --dbhc-card-radius );
	overflow: hidden;
	box-shadow: var( --dbhc-shadow );
	line-height: 0;
}

.dbhc-map img {
	width: 100%;
	height: auto;
	display: block;
}

.dbhc-recap {
	display: grid;
	gap: 14px;
	margin: 0;
}

.dbhc-recap__row {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.dbhc-recap__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	flex: 0 0 auto;
	border-radius: 50%;
	background: var( --dbhc-fill );
	color: var( --dbhc-navy );
}

.dbhc-recap__body {
	min-width: 0;
	font-size: 15px;
	line-height: 1.45;
}

.dbhc-recap__body strong {
	color: var( --dbhc-navy );
}

.dbhc-recap__body span {
	display: block;
	overflow-wrap: anywhere;
}

.dbhc-total-row {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 6px 0;
	font-size: 15px;
	color: var( --dbhc-muted );
}

.dbhc-total-row__value {
	flex: 0 0 auto;
	color: var( --dbhc-text );
	font-weight: 600;
	white-space: nowrap;
}

.dbhc-total-row--grand {
	align-items: baseline;
	margin-top: 12px;
	padding-top: 16px;
	border-top: 1px solid #eef1f5;
	color: var( --dbhc-navy );
	font-size: 20px;
	font-weight: 700;
}

.dbhc-total-row--grand .dbhc-total-row__value {
	color: var( --dbhc-navy );
	font-size: 28px;
	font-weight: 700;
}

.dbhc-total-note {
	margin: 12px 0 0;
	color: var( --dbhc-muted );
	font-size: 13px;
	line-height: 1.45;
}

/* ------------------------------------------------------------------ *
 * Privacy, azioni, conferma
 * ------------------------------------------------------------------ */

.dbhc-check {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 14px;
	line-height: 1.45;
	cursor: pointer;
}

.dbhc-check input {
	margin: 3px 0 0;
	flex: 0 0 auto;
	accent-color: var( --dbhc-navy );
}

.dbhc-check a {
	color: var( --dbhc-blue );
}

.dbhc-actions {
	display: flex;
	align-items: stretch;
	gap: 12px;
	margin-top: 24px;
}

.dbhc-btn {
	border: 0;
	border-radius: var( --dbhc-field-radius );
	font: inherit;
	font-size: 16px;
	font-weight: 500;
	cursor: pointer;
	transition: opacity 0.15s ease;
}

.dbhc-btn:disabled {
	opacity: 0.65;
	cursor: default;
}

.dbhc-btn--primary {
	flex: 1 1 auto;
	padding: 16px 12px;
	background: var( --dbhc-navy );
	color: #fff;
}

.dbhc-btn--primary:hover:not( :disabled ) {
	opacity: 0.9;
}

.dbhc-btn--back {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 56px;
	background: #fff;
	color: var( --dbhc-navy );
	box-shadow: inset 0 0 0 1px var( --dbhc-navy-soft );
}

.dbhc-btn--back:hover {
	box-shadow: inset 0 0 0 1px var( --dbhc-navy );
}

.dbhc-btn__total {
	font-weight: 700;
}

.dbhc-success {
	padding: 40px 24px;
	border-radius: var( --dbhc-card-radius );
	background: #fff;
	box-shadow: var( --dbhc-shadow );
	text-align: center;
}

.dbhc-success__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	margin-bottom: 16px;
	border-radius: 50%;
	background: var( --dbhc-navy );
	color: #fff;
}

.dbhc-success__icon .dbhc-icon {
	width: 28px;
	height: 28px;
}

.dbhc-success__title {
	margin: 0 0 8px;
	color: var( --dbhc-navy );
	font-size: 24px;
	font-weight: 700;
}

.dbhc-success__ref {
	margin-top: 16px;
	color: var( --dbhc-navy );
}

/* Google Places: il menu deve stare sopra header e overlay di Elementor. */
.pac-container {
	z-index: 100000 !important;
}

/* ------------------------------------------------------------------ *
 * Tabella tariffe pubblica [donbosco_tariffe]
 * ------------------------------------------------------------------ */

.dbhc-rates {
	padding: 24px;
	border-radius: var( --dbhc-card-radius );
	background: #fff;
	box-shadow: var( --dbhc-shadow );
}

.dbhc-rates__table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 16px;
	font-size: 15px;
}

.dbhc-rates__table th,
.dbhc-rates__table td {
	padding: 10px 12px;
	border-bottom: 1px solid #eef1f5;
	text-align: left;
}

.dbhc-rates__table thead th {
	background: var( --dbhc-fill );
	color: var( --dbhc-navy );
	font-weight: 600;
}

.dbhc-rates__subtitle {
	margin: 20px 0 8px;
	color: var( --dbhc-navy );
	font-size: 17px;
	font-weight: 600;
}

.dbhc-rates__list {
	margin: 0;
	padding-left: 20px;
	font-size: 15px;
	line-height: 1.6;
}

.dbhc-rates__note {
	display: block;
	color: var( --dbhc-muted );
	font-size: 14px;
}

/* ------------------------------------------------------------------ *
 * Mobile
 * ------------------------------------------------------------------ */

@media ( max-width: 640px ) {
	.dbhc--boxed {
		padding: 24px 12px;
		border-radius: 0;
	}

	.dbhc-title {
		font-size: 24px;
		margin-bottom: 24px;
	}

	.dbhc-progress {
		margin-bottom: 28px;
	}

	.dbhc-progress__num {
		width: 34px;
		height: 34px;
	}

	.dbhc-progress__item + .dbhc-progress__item::before {
		top: 17px;
	}

	.dbhc-progress__label {
		font-size: 12px;
	}

	.dbhc-tabs {
		flex-direction: column;
		gap: 8px;
	}

	.dbhc-card {
		padding: 16px;
	}

	.dbhc-grid {
		grid-template-columns: 1fr;
	}

	.dbhc-extra {
		align-items: flex-start;
	}

	.dbhc-total-row--grand .dbhc-total-row__value {
		font-size: 24px;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.dbhc * {
		transition: none !important;
	}
}

/* ------------------------------------------------------------------ *
 * Difesa dagli stili del tema (stati interattivi)
 *
 * Il tema di donboscohomecare.it dichiara, in `custom.css`:
 *
 *     button:hover { background: initial !important; }
 *
 * `initial` significa trasparente, e `!important` non si batte con la sola
 * specificità: al passaggio del mouse i nostri pulsanti perdevano lo sfondo
 * navy e restavano con il testo bianco su card chiara, cioè invisibili.
 * (Verificato sulla pagina reale il 02/08/2026 leggendo gli stili calcolati:
 * in hover `background-color` risultava `rgba(0, 0, 0, 0)`.)
 *
 * Per questo — e solo per gli stati interattivi — lo sfondo è dichiarato
 * `!important`: è l'unico modo di riprendersi la proprietà. Fra due
 * dichiarazioni `!important` decide la specificità, e la classe ripetuta ci
 * mette al sicuro anche da eventuali regole di tema più specifiche.
 *
 * Gli stati normali restano senza `!important`, così il Cliente può
 * continuare a ridefinire i colori del modulo dalle custom property.
 *
 * Nota: si dichiarano SEMPRE sfondo e colore del testo insieme. Un tema che
 * tocca solo una delle due proprietà è precisamente ciò che produce le
 * combinazioni illeggibili.
 * ------------------------------------------------------------------ */

.dbhc .dbhc-tab.dbhc-tab:hover,
.dbhc .dbhc-tab.dbhc-tab:focus,
.dbhc .dbhc-tab.dbhc-tab:focus-visible,
.dbhc .dbhc-tab.dbhc-tab:active {
	background: var( --dbhc-tab-hover ) !important;
	color: var( --dbhc-navy ) !important;
}

.dbhc .dbhc-tab.dbhc-tab.is-active:hover,
.dbhc .dbhc-tab.dbhc-tab.is-active:focus,
.dbhc .dbhc-tab.dbhc-tab.is-active:focus-visible,
.dbhc .dbhc-tab.dbhc-tab.is-active:active {
	background: var( --dbhc-navy-hover ) !important;
	color: #fff !important;
}

.dbhc .dbhc-btn--primary.dbhc-btn--primary:hover:not( :disabled ),
.dbhc .dbhc-btn--primary.dbhc-btn--primary:focus:not( :disabled ),
.dbhc .dbhc-btn--primary.dbhc-btn--primary:focus-visible:not( :disabled ),
.dbhc .dbhc-btn--primary.dbhc-btn--primary:active:not( :disabled ) {
	background: var( --dbhc-navy-hover ) !important;
	color: #fff !important;
	opacity: 1;
}

.dbhc .dbhc-btn--primary.dbhc-btn--primary:disabled {
	background: var( --dbhc-navy ) !important;
	color: #fff !important;
}

.dbhc .dbhc-btn--back.dbhc-btn--back:hover,
.dbhc .dbhc-btn--back.dbhc-btn--back:focus,
.dbhc .dbhc-btn--back.dbhc-btn--back:focus-visible,
.dbhc .dbhc-btn--back.dbhc-btn--back:active {
	background: #fff !important;
	color: var( --dbhc-navy ) !important;
	box-shadow: inset 0 0 0 1px var( --dbhc-navy );
}

.dbhc .dbhc-counter__btn.dbhc-counter__btn:hover,
.dbhc .dbhc-counter__btn.dbhc-counter__btn:focus,
.dbhc .dbhc-counter__btn.dbhc-counter__btn:focus-visible,
.dbhc .dbhc-counter__btn.dbhc-counter__btn:active {
	background: #fff !important;
	border-color: var( --dbhc-navy );
	color: var( --dbhc-navy ) !important;
}

.dbhc .dbhc-counter__btn.dbhc-counter__btn:disabled {
	background: #fff !important;
	color: var( --dbhc-muted ) !important;
}

/* Le opzioni Sì/No sono `label` + `span`: il tema non le colpisce con
   `button:hover`, ma l'effetto di passaggio va comunque dichiarato qui
   perché prima non esisteva affatto. */
.dbhc .dbhc-toggle__opt:hover span {
	background: var( --dbhc-navy-soft );
	color: var( --dbhc-navy );
}

.dbhc .dbhc-toggle__opt:hover input:checked + span {
	background: var( --dbhc-navy-hover );
	color: #fff;
}

/* Il tema azzera lo sfondo anche sui `submit`: il pulsante di invio finale
   ricade sotto la stessa regola del pulsante primario, ma lo si ridichiara
   per tipo di elemento perché alcuni reset colpiscono `[type="submit"]`
   invece di `button`. */
.dbhc button.dbhc-btn.dbhc-btn:hover,
.dbhc button.dbhc-btn.dbhc-btn:focus,
.dbhc button.dbhc-btn.dbhc-btn:active,
.dbhc [type="submit"].dbhc-btn.dbhc-btn:hover,
.dbhc [type="submit"].dbhc-btn.dbhc-btn:focus,
.dbhc [type="submit"].dbhc-btn.dbhc-btn:active {
	background-image: none !important;
	text-decoration: none;
}

/* Il focus da tastiera deve restare visibile su tutti i comandi: alcuni temi
   azzerano l'outline globalmente. */
.dbhc .dbhc-tab:focus-visible,
.dbhc .dbhc-btn:focus-visible,
.dbhc .dbhc-counter__btn:focus-visible {
	outline: 2px solid var( --dbhc-blue );
	outline-offset: 2px;
}