/**
 * Stili minimi. Volutamente neutri: ereditano tipografia e colori dal tema.
 * Se serve personalizzare, farlo dal child theme, non qui.
 */
.spa-addons {
	margin: 1.5em 0;
}

.spa-section {
	border: 1px solid rgba( 0, 0, 0, .12 );
	border-radius: 4px;
	padding: .9em 1.1em;
	margin: 0 0 1em;
}

.spa-section-title {
	font-weight: 600;
	padding: 0 .4em;
	font-size: .95em;
}

.spa-group + .spa-group {
	margin-top: .5em;
	padding-top: .5em;
	border-top: 1px solid rgba( 0, 0, 0, .07 );
}

.spa-option-row {
	display: flex;
	align-items: center;
	gap: .55em;
	padding: .35em 0;
	cursor: pointer;
}

.spa-option-row input {
	margin: 0;
	flex: 0 0 auto;
}

.spa-option-label {
	flex: 1 1 auto;
}

.spa-option-amount {
	flex: 0 0 auto;
	font-variant-numeric: tabular-nums;
	opacity: .75;
	font-size: .9em;
}

/**
 * Totale con le opzioni.
 *
 * Colore: l'arancione di sistampa, #fa9122.
 * Per cambiarlo senza toccare il plugin, ridefinire la variabile dal child
 * theme:  .spa-total { --spa-total-color: #xxxxxx; }
 */
.spa-total {
	--spa-total-color: #fa9122;

	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: .5em;
	margin-top: 1em;
	padding-top: .8em;
	border-top: 1px solid rgba( 0, 0, 0, .1 );
}

.spa-total-label {
	font-size: 1em;
	font-weight: 500;
	opacity: .8;
}

.spa-total-value {
	font-size: 40px;
	font-weight: 700;
	line-height: 1.15;
	font-variant-numeric: tabular-nums;
	color: var( --spa-total-color );
}

.spa-total-value .woocommerce-Price-currencySymbol {
	font-size: .78em;
	font-weight: 600;
	margin-left: .04em;
}

.spa-total-suffix {
	font-size: .34em;
	font-weight: 600;
	margin-left: .35em;
	letter-spacing: .01em;
	white-space: nowrap;
}

@media ( max-width: 480px ) {
	.spa-total-value {
		font-size: 32px;
	}
}