/**
 * Carrello (4A), checkout (4B) e area personale (4C).
 *
 * I template restano quelli di WooCommerce: qui c'è solo lo stile.
 */

.woocommerce-cart .entry-content,
.woocommerce-checkout .entry-content,
.woocommerce-account .entry-content {
	background: var(--ad-surface);
}

.ad-page-head--compact { padding: 30px var(--ad-gutter) 34px; }

/* ---------------------------------------------------------------------------
 * Indicatore di passaggio
 * ------------------------------------------------------------------------ */

.ad-steps {
	align-items: center;
	color: var(--ad-text-muted);
	display: flex;
	flex-wrap: wrap;
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-4xs);
	font-weight: 600;
	gap: var(--ad-gap-sm);
	letter-spacing: var(--ad-ls-caps);
	margin-bottom: var(--ad-gap-md);
	text-transform: uppercase;
}

.ad-steps__item.is-active { color: var(--ad-blue-700); }
.ad-steps__num { color: var(--ad-teal); }
.ad-steps__item.is-active .ad-steps__num { color: var(--ad-coral); }

.ad-steps__line {
	background: var(--ad-border);
	height: 1px;
	width: 32px;
}

/* ---------------------------------------------------------------------------
 * Carrello
 * ------------------------------------------------------------------------ */

.woocommerce-cart .woocommerce {
	display: grid;
	gap: 40px;
	grid-template-columns: minmax(0, 1fr) 380px;
	padding: 0 var(--ad-gutter) var(--ad-section-y);
}

/* Tutto occupa la riga intera per impostazione predefinita: WooCommerce e i
   plugin possono inserire avvisi e blocchi qui dentro, e non devono finire
   spezzati in una colonna. Solo tabella e riepilogo si affiancano davvero. */
.woocommerce-cart .woocommerce > * {
	grid-column: 1 / -1;
	min-width: 0;
}

.woocommerce-cart .woocommerce > form.woocommerce-cart-form { grid-column: 1; }
.woocommerce-cart .woocommerce > .cart-collaterals { grid-column: 2; }

/* La fascia sabbia esce dal gutter del contenitore per restare a tutta
   larghezza; il testo dentro ha il suo. */
.woocommerce-cart .woocommerce > .ad-page-head {
	margin: 0 calc(var(--ad-gutter) * -1);
}

/* Gli avvisi di carrello e checkout non stanno nel flusso: vedi la fascia
   "Avvisi in sovrimpressione" più sotto. */

@media (max-width: 1100px) {
	.woocommerce-cart .woocommerce { grid-template-columns: 1fr; }

	.woocommerce-cart .woocommerce > form.woocommerce-cart-form,
	.woocommerce-cart .woocommerce > .cart-collaterals {
		grid-column: 1;
	}
}

/* WooCommerce impila i blocchi del riepilogo con i float e larghezze al 48%:
   dentro la colonna stretta finivano affiancati e fuori bordo. */
.woocommerce-cart .cart-collaterals {
	display: flex;
	flex-direction: column;
	gap: 18px;
	position: sticky;
	top: calc(var(--ad-header-h) + var(--ad-gap-xl));
}

.woocommerce-cart .cart-collaterals > *,
.woocommerce .cart-collaterals .cart_totals {
	float: none;
	margin: 0;
	width: 100%;
}

.woocommerce-cart table.shop_table {
	background: var(--ad-surface-raised);
	border: 0;
	border-radius: var(--ad-radius-lg);
	border-collapse: separate;
	box-shadow: var(--ad-shadow-card-sm);
	overflow: hidden;
	width: 100%;
}

.woocommerce-cart table.shop_table thead { display: none; }

.woocommerce-cart table.shop_table td {
	border-top: 1px solid var(--ad-border-lightest);
	padding: 20px;
	vertical-align: middle;
}

.woocommerce-cart table.shop_table tr:first-child td { border-top: 0; }

.woocommerce-cart td.product-thumbnail img {
	border-radius: var(--ad-radius-sm);
	width: 88px;
}

.woocommerce-cart td.product-name a {
	color: var(--ad-text);
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-xs);
	font-weight: 600;
}

.woocommerce-cart td.product-name a:hover { color: var(--ad-teal); }

/* Le varianti scelte: attacco, taglia, configurazione. */
.woocommerce-cart td.product-name .variation {
	color: var(--ad-text-muted);
	font-size: var(--ad-fs-3xs);
	margin: 6px 0 0;
}

.woocommerce-cart td.product-name .variation dt,
.woocommerce-cart td.product-name .variation dd {
	display: inline;
	margin: 0;
}

.woocommerce-cart td.product-price,
.woocommerce-cart td.product-subtotal {
	color: var(--ad-blue-700);
	font-family: var(--ad-font-heading);
	font-weight: 700;
	text-align: right;
}

.woocommerce-cart td.actions { background: transparent; padding: var(--ad-gap-lg) 0 0; }

.woocommerce-cart .quantity input {
	background: #fff;
	border: 1px solid var(--ad-border-input);
	border-radius: var(--ad-radius-sm);
	padding: 10px;
	text-align: center;
	width: 64px;
}

.woocommerce-cart a.remove {
	color: var(--ad-text-faint) !important;
	font-size: 20px;
}

.woocommerce-cart a.remove:hover {
	background: transparent;
	color: var(--ad-coral) !important;
}

/* Codice sconto */
.woocommerce-cart .coupon {
	align-items: center;
	display: flex;
	gap: var(--ad-gap-xs);
}

.woocommerce-cart .coupon input[type="text"] {
	background: #fff;
	border: 1px solid var(--ad-border-input);
	border-radius: var(--ad-radius-sm);
	font-family: var(--ad-font-body);
	font-size: var(--ad-fs-2xs);
	padding: 13px 14px;
}

/* Riga sotto gli articoli: torna al negozio, svuota il carrello. */
.ad-cart-actions {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: var(--ad-gap-md);
	justify-content: space-between;
	margin-top: var(--ad-gap-lg);
}

.ad-cart-actions__back {
	border-bottom: 1.5px solid var(--ad-coral);
	color: var(--ad-blue-700);
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-2xs);
	font-weight: 600;
	line-height: 1;
	padding-bottom: 4px;
}

.ad-cart-actions__back:hover { color: var(--ad-coral); }

.ad-cart-actions__empty {
	color: var(--ad-text-faint-2);
	font-size: var(--ad-fs-2xs);
	font-weight: 500;
	text-decoration: underline;
}

.ad-cart-actions__empty:hover { color: var(--ad-coral); }

/* Riepilogo */
.woocommerce-cart .cart_totals {
	background: var(--ad-surface-raised);
	border-radius: var(--ad-radius-xl);
	box-shadow: var(--ad-shadow-card-lg);
	padding: 30px;
	width: 100%;
}

.woocommerce-cart .cart_totals h2 {
	font-size: var(--ad-fs-h3);
	font-weight: 700;
	line-height: 1.2;
	margin: 0 0 22px;
}

/* Nell'artboard il riepilogo non è una tabella ma un elenco di righe: qui la
   tabella si scioglie in blocchi e ogni riga diventa una flex, etichetta a
   sinistra e cifra a destra. Serve per due motivi: i fili di separazione vanno
   da un bordo all'altro (su una `tr` a blocco resterebbero larghi quanto la
   prima colonna) e la riga della spedizione può impilare etichetta e scelte. */
.woocommerce-cart .cart_totals table { border: 0; width: 100%; }

.woocommerce-cart .cart_totals table,
.woocommerce-cart .cart_totals table tbody { display: block; }

.woocommerce-cart .cart_totals table tr {
	align-items: baseline;
	display: flex;
	gap: var(--ad-gap-md);
	justify-content: space-between;
}

.woocommerce-cart .cart_totals table th,
.woocommerce-cart .cart_totals table td { display: block; }

/* Le voci del riepilogo sono un elenco, non una tabella a righe separate:
   nel design le divide solo lo spazio. */
/* Il riepilogo è una `table.shop_table` come quella degli articoli: senza
   ripetere qui i selettori si porta dietro i bordi di riga di quella. */
.woocommerce-cart .cart_totals table tr,
.woocommerce-cart .cart_totals table th,
.woocommerce-cart .cart_totals table td {
	border: 0;
	color: var(--ad-text-body-2);
	font-size: var(--ad-fs-sm);
	padding: 6px 0;
	vertical-align: top;
}

.woocommerce-cart .cart_totals table th {
	font-weight: 400;
	text-align: left;
}

.woocommerce-cart .cart_totals table td {
	font-family: var(--ad-font-mono);
	font-weight: 600;
	text-align: right;
}

/* La spedizione è un elenco di scelte, non una cifra: torna al font di testo. */
.woocommerce-cart .cart_totals table .shipping td {
	font-family: var(--ad-font-body);
	font-weight: 400;
}

.woocommerce-cart .cart_totals table tr.order-total {
	border-top: 1px solid var(--ad-border-lightest);
	margin-top: var(--ad-gap-lg);
	padding-top: var(--ad-gap-lg);
}

.woocommerce-cart .cart_totals table tr.order-total th,
.woocommerce-cart .cart_totals table tr.order-total td {
	font-family: var(--ad-font-heading);
	padding-top: 0;
	vertical-align: baseline;
}

.woocommerce-cart .cart_totals table tr.order-total th {
	font-size: 17px;
	font-weight: 700;
}

.woocommerce-cart .cart_totals table tr.order-total td,
.woocommerce-cart .cart_totals table tr.order-total td .amount {
	color: var(--ad-blue-700);
	font-size: var(--ad-fs-h2-sm);
	font-weight: 800;
	line-height: 1;
}

/* La nota sull'IVA inclusa resta una didascalia. */
.woocommerce-cart .cart_totals table tr.order-total td small,
.woocommerce-cart .cart_totals table tr.order-total td small .amount {
	color: var(--ad-text-faint-2);
	font-family: var(--ad-font-body);
	font-size: var(--ad-fs-3xs);
	font-weight: 400;
	line-height: var(--ad-lh-body);
}

.woocommerce-cart .cart_totals table tr.order-total td small {
	display: block;
	margin-top: 8px;
}

.woocommerce-cart .wc-proceed-to-checkout { padding: 22px 0 0; }

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
	background: var(--ad-coral);
	border-radius: var(--ad-radius-sm);
	color: #fff;
	display: block;
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-xs);
	font-weight: 700;
	letter-spacing: var(--ad-ls-button);
	padding: 20px;
	text-align: center;
	text-transform: uppercase;
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover { background: var(--ad-coral-alt-1); }

/* ---------------------------------------------------------------------------
 * Codice sconto (colonna di destra)
 * ------------------------------------------------------------------------ */

.ad-coupon {
	background: var(--ad-surface-raised);
	border-radius: var(--ad-radius-xl);
	box-shadow: var(--ad-shadow-card);
	padding: var(--ad-gap-xl);
}

.ad-coupon__label {
	display: block;
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-2xs);
	font-weight: 600;
	letter-spacing: var(--ad-ls-nav);
	line-height: 1;
}

.ad-coupon__row {
	display: flex;
	gap: 10px;
	margin-top: var(--ad-gap-sm);
}

.ad-coupon__input {
	background: #fff;
	border: 1px solid var(--ad-border-lighter);
	border-radius: var(--ad-radius-sm);
	color: var(--ad-text-body);
	flex: 1;
	font-family: var(--ad-font-body);
	font-size: var(--ad-fs-xs);
	min-width: 0;
	padding: 14px 15px;
}

button.ad-coupon__button {
	background: var(--ad-blue-700);
	border: 0;
	border-radius: var(--ad-radius-sm);
	color: var(--ad-text-on-dark);
	flex: none;
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-3xs);
	font-weight: 700;
	letter-spacing: var(--ad-ls-button);
	padding: 15px 18px;
	text-transform: uppercase;
}

button.ad-coupon__button:hover { background: var(--ad-blue-600); }

/* Il codice sconto nativo sta dentro la tabella degli articoli: nel design è
   una card a sé nella colonna di destra, quindi quello resta nascosto. */
.woocommerce-cart table.cart td.actions .coupon { display: none; }

/* ---------------------------------------------------------------------------
 * Nota di aiuto
 * ------------------------------------------------------------------------ */

.ad-help-note {
	background: var(--ad-gradient-note);
	border-radius: var(--ad-radius-xl);
	color: var(--ad-text-on-dark-2);
	padding: 26px;
}

.ad-help-note .ad-block-label {
	color: var(--ad-teal);
	margin-bottom: var(--ad-gap-sm);
}

.ad-help-note p {
	color: inherit;
	font-size: var(--ad-fs-xs);
	line-height: var(--ad-lh-relaxed);
	margin: 0;
}

.ad-help-note a { color: #fff; }
.ad-help-note a:hover { color: var(--ad-teal); }

/* ---------------------------------------------------------------------------
 * Checkout
 * ------------------------------------------------------------------------ */

/* Il modulo è un blocco: le due colonne sono su #customer_details, che
   woocommerce/checkout/form-checkout.php riempie con tutti i dati a sinistra
   e il solo riepilogo a destra, come in 4B. */
.woocommerce-checkout form.checkout {
	display: block;
	padding: var(--ad-gap-2xl) var(--ad-gutter) 64px;
}

.woocommerce-checkout .col2-set#customer_details {
	align-items: start;
	display: grid;
	gap: 40px;
	grid-template-columns: minmax(0, 1fr) 400px;
}

@media (max-width: 1100px) {
	.woocommerce-checkout .col2-set#customer_details {
		gap: var(--ad-gap-2xl);
		grid-template-columns: 1fr;
	}
}

.woocommerce-checkout #customer_details .col-1 {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

/* WooCommerce apre la colonna con `<wc-order-attribution-inputs>`, un elemento
   che porta solo campi nascosti: alto zero, ma conta come figlio della colonna
   e si prende il suo `gap`. Da lì i 18px di scarto fra la card dei dati e
   quella del riepilogo. I campi nascosti si inviano comunque. */
.woocommerce-checkout #customer_details .col-1 > wc-order-attribution-inputs { display: none; }

.woocommerce-checkout #customer_details .col-2 {
	position: sticky;
	top: calc(var(--ad-header-h) + var(--ad-gap-xl));
}

@media (max-width: 1100px) {
	.woocommerce-checkout #customer_details .col-2 { position: static; }
}

/* Ogni gruppo di campi è una card della colonna di sinistra. */
.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-shipping-fields,
.woocommerce-checkout .woocommerce-additional-fields {
	background: var(--ad-surface-raised);
	border-radius: var(--ad-radius-xl);
	box-shadow: var(--ad-shadow-card);
	margin: 0;
	padding: 30px 32px;
}

.woocommerce-checkout h3 {
	font-size: 19px;
	font-weight: 700;
	line-height: 1.2;
	margin: 0 0 var(--ad-gap-lg);
}

/* "Spedire a un indirizzo diverso" è una spunta, non un titolo di sezione. */
.woocommerce-checkout h3#ship-to-different-address {
	font-size: var(--ad-fs-xs);
	font-weight: 500;
	margin: 0;
}

.woocommerce-checkout h3#ship-to-different-address label {
	align-items: center;
	color: var(--ad-text-body);
	display: flex;
	gap: var(--ad-gap-sm);
	margin: 0;
}

.woocommerce-checkout .shipping_address { padding-top: var(--ad-gap-lg); }

.woocommerce form .form-row { margin: 0 0 var(--ad-gap-md); padding: 0; }

/* Nome e cognome, CAP e città: WooCommerce marca le coppie con `form-row-first`
   e `form-row-last` e conta sul proprio foglio — che non carichiamo — per
   affiancarle. Qui lo fa una griglia, senza i `float` dell'originale. */
.woocommerce form .form-row-first,
.woocommerce form .form-row-last {
	display: inline-block;
	vertical-align: top;
	width: calc(50% - 9px);
}

.woocommerce form .form-row-first { margin-right: 14px; }

@media (max-width: 640px) {
	.woocommerce form .form-row-first,
	.woocommerce form .form-row-last {
		margin-right: 0;
		width: 100%;
	}
}

/* Etichetta sopra il campo, campo a tutta riga: l'impianto dei moduli lo dava
   il foglio di WooCommerce, che non carichiamo (vedi inc/woocommerce.php).
   Senza, etichetta e campo restano appaiati sulla stessa riga. */
.woocommerce form .form-row label {
	color: var(--ad-text-muted);
	display: block;
	font-size: var(--ad-fs-3xs);
	font-weight: 500;
	margin-bottom: 8px;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce form .form-row .select2-container,
.woocommerce form .form-row .select2-container .select2-selection {
	background: var(--ad-surface);
	border: 1px solid var(--ad-border-input);
	border-radius: var(--ad-radius-sm);
	color: var(--ad-text-body);
	font-family: var(--ad-font-body);
	font-size: var(--ad-fs-xs);
	line-height: normal;
	padding: 13px 14px;
	width: 100%;
}

.woocommerce form .form-row .select2-container { border: 0; padding: 0; }

/* Il testo su più righe con l'interlinea dei campi a riga singola sarebbe
   illeggibile. */
.woocommerce form .form-row textarea { line-height: var(--ad-lh-body); }

/* La provincia passa da select2, che sostituisce la tendina con un suo markup
   e ci mette sopra misure fisse: riquadro alto 28px, interlinea 28px, 4px di
   margine negativo sotto e 8px di rientro sul testo. Sommate al padding dei
   nostri campi mandavano il valore fuori dal riquadro e più a destra degli
   altri campi. Qui il riquadro torna alto come gli altri e il valore si centra
   dentro: `normal` è la stessa interlinea degli input, così le due altezze
   coincidono in tutti i browser. */
.woocommerce form .form-row .select2-container .select2-selection--single {
	align-items: center;
	display: flex;
	height: auto;
	margin: 0;
}

.woocommerce form .form-row .select2-container--default .select2-selection--single .select2-selection__rendered {
	color: inherit;
	flex: 1;
	line-height: inherit;
	min-width: 0;
	padding: 0 22px 0 0;
}

/* La freccia era alta 26px in un riquadro da 28: adesso segue l'altezza vera. */
.woocommerce form .form-row .select2-container--default .select2-selection--single .select2-selection__arrow {
	bottom: 0;
	height: auto;
	right: 10px;
	top: 0;
}

/* Campo aperto: il bordo scuro dice quale tendina sta parlando. Il pannello che
   si apre è vestito in `components.css`, perché select2 lo appende a `<body>`. */
.woocommerce form .form-row .select2-container--open .select2-selection--single {
	border-color: var(--ad-blue-700);
}

/* Riga in linea, per i dati che non si compilano: etichetta e valore affiancati
   invece di uno sopra l'altro. */
.woocommerce form .form-row.ad-form-row-inline {
	align-items: baseline;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.woocommerce form .form-row.ad-form-row-inline label { margin-bottom: 0; }

/* L'asterisco su un campo che non si può cambiare non dice niente a nessuno. */
.woocommerce form .form-row.ad-form-row-inline label .required { display: none; }

/* Si vende solo in Italia (`woocommerce_specific_allowed_countries`): la
   tendina del paese ha una voce sola e non si può cambiare, quindi si legge
   come testo e non come campo. WooCommerce ha una regola sua per questo caso,
   ma sta in `woocommerce.css`, che non carichiamo: va riscritta qui. */
.woocommerce form .form-row select.country_to_state--single {
	appearance: none;
	background: none;
	border: 0;
	font-size: var(--ad-fs-xs);
	font-weight: 600;
	padding: 0;
	pointer-events: none;
	width: auto;
}

/* ---------------------------------------------------------------------------
 * Carrello vuoto (6A)
 * ------------------------------------------------------------------------ */

/* Qui non c'è niente da confrontare in tabella, solo cose da scegliere: la
   pagina si stringe a colonna di lettura. */
.ad-cart-empty {
	margin: 0 auto;
	max-width: calc(1000px + var(--ad-gutter) * 2);
	padding: 0 var(--ad-gutter) 64px;
}

/* L'intestazione è la stessa del carrello pieno e la stampa un'altra
   funzione, ma la sua fascia sabbia deve restare a tutta larghezza: si
   stringe il contenuto col padding, non il fondo con una larghezza massima,
   altrimenti la fascia si stacca dai bordi e sembra un riquadro. */
.ad-cart-empty-page .ad-page-head {
	padding-left: max(var(--ad-gutter), calc((100% - 1000px) / 2));
	padding-right: max(var(--ad-gutter), calc((100% - 1000px) / 2));
}

/* Riquadro scuro ------------------------------------------------------- */

.ad-cart-empty__hero {
	align-items: center;
	background: var(--ad-gradient-empty-cart);
	border-radius: var(--ad-radius-xl);
	color: var(--ad-text-on-dark-2);
	display: flex;
	gap: var(--ad-gap-2xl);
	justify-content: space-between;
	padding: 56px 48px;
}

.ad-cart-empty__intro { max-width: 520px; }

.ad-cart-empty__title {
	color: #fff;
	font-size: 32px;
	font-weight: 700;
	letter-spacing: -0.015em;
	line-height: 1.15;
	margin: 14px 0 0;
}

.ad-cart-empty__lead {
	color: inherit;
	font-size: var(--ad-fs-body);
	line-height: var(--ad-lh-relaxed);
	margin: 12px 0 0;
}

.ad-cart-empty__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ad-gap-sm);
	margin-top: 28px;
}

/* I due bottoni devono chiudere alla stessa altezza: il secondo ha 1.5px di
   bordo per lato, che vanno tolti dal padding verticale. */
.ad-cart-empty__actions .ad-btn--cta { padding: 17px 28px; }

.ad-cart-empty__actions .ad-btn--outline-light {
	align-items: center;
	border-color: rgba(232, 220, 200, 0.45);
	display: inline-flex;
	gap: 9px;
	padding: 15.5px 26px;
}

/* Due cerchi concentrici col contatore a zero: è l'unica cosa che dice
   "vuoto" senza scriverlo un'altra volta. */
.ad-cart-empty__dial {
	align-items: center;
	border: 1.5px dashed rgba(143, 180, 198, 0.4);
	border-radius: 50%;
	display: flex;
	flex: none;
	height: 200px;
	justify-content: center;
	width: 200px;
}

.ad-cart-empty__dial-inner {
	align-items: center;
	border: 1.5px solid rgba(143, 180, 198, 0.25);
	border-radius: 50%;
	color: #5b8299;
	display: flex;
	flex-direction: column;
	font-family: var(--ad-font-mono);
	font-size: var(--ad-fs-4xs);
	height: 132px;
	justify-content: center;
	line-height: 1.6;
	width: 132px;
}

/* Le tre note ---------------------------------------------------------- */

.ad-cart-empty__notes {
	display: grid;
	gap: var(--ad-gap-md);
	grid-template-columns: repeat(3, 1fr);
	margin-top: var(--ad-gap-lg);
}

.ad-cart-empty__note {
	background: var(--ad-surface-raised);
	border-radius: var(--ad-radius-md);
	box-shadow: var(--ad-shadow-card-sm);
	padding: 24px 26px;
}

.ad-cart-empty__note-title {
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-sm);
	font-weight: 600;
	line-height: 1.3;
}

.ad-cart-empty__note p {
	color: var(--ad-text-muted);
	font-size: var(--ad-fs-2xs);
	line-height: var(--ad-lh-body);
	margin: 6px 0 0;
}

.ad-cart-empty__note-link {
	color: var(--ad-teal);
	display: inline-block;
	font-size: var(--ad-fs-2xs);
	font-weight: 600;
	margin-top: var(--ad-gap-xs);
}

.ad-cart-empty__note-link:hover { color: var(--ad-coral); }

/* Riparti da qui · Dai tuoi preferiti ----------------------------------- */

.ad-cart-empty__block { margin-top: 48px; }

.ad-cart-empty__block-head {
	align-items: baseline;
	display: flex;
	gap: var(--ad-gap-md);
	justify-content: space-between;
}

.ad-cart-empty__block-title {
	font-size: 22px;
	font-weight: 700;
	line-height: 1.2;
	margin: 0;
}

.ad-cart-empty__block-link {
	color: var(--ad-teal);
	font-size: var(--ad-fs-2xs);
	font-weight: 600;
	white-space: nowrap;
}

.ad-cart-empty__block-link:hover { color: var(--ad-coral); }

.ad-cart-empty__block .ad-grid,
.ad-fav-grid { margin-top: var(--ad-gap-lg); }

/* La fila delle categorie qui è una scorciatoia, non una panoramica del
   catalogo: nel design la card porta il solo nome del reparto. */
.ad-cart-empty .ad-card--category .ad-card__meta { display: none; }

/* Card di un preferito -------------------------------------------------- */

.ad-fav-grid {
	display: grid;
	gap: var(--ad-gap-md);
	grid-template-columns: repeat(3, 1fr);
}

.ad-fav {
	align-items: center;
	background: var(--ad-surface-raised);
	border-radius: var(--ad-radius-md);
	box-shadow: var(--ad-shadow-card-sm);
	color: var(--ad-text);
	display: flex;
	gap: var(--ad-gap-md);
	padding: 16px;
}

.ad-fav__media {
	background: var(--ad-gradient-placeholder);
	border-radius: var(--ad-radius-ms);
	flex: none;
	height: 72px;
	overflow: hidden;
	width: 72px;
}

.ad-fav__media img {
	display: block;
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.ad-fav__text {
	display: flex;
	flex-direction: column;
	gap: 5px;
	min-width: 0;
}

.ad-fav__brand {
	color: var(--ad-text-faint-2);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: var(--ad-ls-badge);
	text-transform: uppercase;
}

.ad-fav__name {
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-sm);
	font-weight: 600;
	line-height: 1.25;
}

.ad-fav:hover .ad-fav__name { color: var(--ad-teal); }

.ad-fav__price {
	align-items: baseline;
	color: var(--ad-blue-700);
	display: flex;
	flex-wrap: wrap;
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-body);
	font-weight: 700;
	gap: var(--ad-gap-xs);
}

/* In saldo WooCommerce affianca prezzo pieno e scontato: qui il risparmio lo
   dice la percentuale, e il prezzo barrato in una card da 72px è solo rumore. */
.ad-fav__price del { display: none; }
.ad-fav__price ins { background: none; text-decoration: none; }

.ad-fav__discount {
	color: var(--ad-coral);
	font-family: var(--ad-font-body);
	font-size: var(--ad-fs-4xs);
	font-weight: 600;
}

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

@media (max-width: 900px) {
	.ad-cart-empty__hero {
		align-items: flex-start;
		flex-direction: column;
		gap: var(--ad-gap-xl);
		padding: 34px 24px;
	}

	.ad-cart-empty__dial { align-self: center; }

	.ad-cart-empty__notes,
	.ad-fav-grid { grid-template-columns: 1fr; }

	.ad-cart-empty__block { margin-top: 34px; }
}

/* ---------------------------------------------------------------------------
 * Dati fiscali: privato o azienda
 *
 * Stesse regole al checkout, in area personale e in registrazione: i campi
 * sono gli stessi, montati dallo stesso elenco (inc/fiscal-fields.php).
 * ------------------------------------------------------------------------ */

/* La tipologia è una scelta fra due, non una tendina: pillole come le varianti
   della scheda prodotto. Il pallino resta nel documento — serve alla tastiera
   e agli screen reader — ma non si vede. */
.woocommerce form .form-row.ad-customer-type .woocommerce-input-wrapper {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.woocommerce form .form-row.ad-customer-type .input-radio {
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	height: 1px;
	overflow: hidden;
	position: absolute;
	white-space: nowrap;
	width: 1px;
}

/* WooCommerce ripete l'asterisco su ogni pillola: l'obbligatorietà è già
   detta dall'etichetta del gruppo, e una scelta fra due lo è per definizione. */
.woocommerce form .form-row.ad-customer-type label.radio .required { display: none; }

.woocommerce form .form-row.ad-customer-type label.radio {
	background: transparent;
	border: 1.5px solid var(--ad-border-input);
	border-radius: var(--ad-radius-sm);
	color: var(--ad-text-body);
	cursor: pointer;
	font-family: var(--ad-font-body);
	font-size: var(--ad-fs-xs);
	font-weight: 500;
	line-height: 1;
	margin: 0;
	padding: 13px 24px;
}

.woocommerce form .form-row.ad-customer-type .input-radio:not(:checked) + label.radio:hover {
	border-color: var(--ad-blue-700);
	color: var(--ad-blue-700);
}

.woocommerce form .form-row.ad-customer-type .input-radio:checked + label.radio {
	background: var(--ad-blue-700);
	border-color: var(--ad-blue-700);
	color: var(--ad-text-on-dark);
}

/* Il pallino è invisibile: senza questo il fuoco da tastiera non si vede. */
.woocommerce form .form-row.ad-customer-type .input-radio:focus-visible + label.radio {
	outline: 2px solid var(--ad-teal);
	outline-offset: 2px;
}

/* I campi dell'altra tipologia. Il JavaScript sposta questa classe; senza
   JavaScript restano tutti a video e a fermare l'invio ci pensa PHP. */
.woocommerce form .form-row.ad-fiscal.ad-fiscal--hidden { display: none; }

.woocommerce form .form-row.ad-fiscal .description {
	color: var(--ad-text-faint-2);
	display: block;
	font-size: var(--ad-fs-4xs);
	line-height: var(--ad-lh-body);
	margin-top: 6px;
}

/* In registrazione i campi arrivano prima dell'informativa: una riga spiega
   perché li stiamo chiedendo adesso. */
.ad-register-fiscal__note {
	color: var(--ad-text-muted);
	font-size: var(--ad-fs-3xs);
	line-height: var(--ad-lh-body);
	margin: 0 0 var(--ad-gap-md);
}

/* ---------------------------------------------------------------------------
 * Riepilogo dell'ordine (colonna di destra)
 * ------------------------------------------------------------------------ */

/* Titolo, tabella, pagamento e garanzie stanno in una card sola: il
   contenitore lo aprono e chiudono due hook, qui c'è solo l'aspetto. */
.ad-order-card {
	background: var(--ad-surface-raised);
	border-radius: var(--ad-radius-xl);
	box-shadow: var(--ad-shadow-card-lg);
	padding: 30px;
}

#order_review_heading {
	font-size: var(--ad-fs-h3);
	font-weight: 700;
	line-height: 1.2;
	margin: 0 0 22px;
}

.woocommerce-checkout #order_review {
	background: none;
	border-radius: 0;
	box-shadow: none;
	padding: 0;
}

.woocommerce-checkout #order_review table.shop_table {
	border: 0;
	border-radius: 0;
	box-shadow: none;
	width: 100%;
}

/* L'intestazione "Prodotto / Subtotale" non serve: le due colonne si leggono
   da sole e nel design non c'è. */
.woocommerce-checkout #order_review table.shop_table thead { display: none; }

.woocommerce-checkout #order_review table.shop_table tr,
.woocommerce-checkout #order_review table.shop_table th,
.woocommerce-checkout #order_review table.shop_table td {
	background: none;
	border: 0;
	font-size: var(--ad-fs-sm);
	padding: 9px 0;
	vertical-align: middle;
}

/* Riga articolo: miniatura a sinistra, nome e quantità, prezzo a destra. */
.woocommerce-checkout #order_review table.shop_table td.product-name {
	color: var(--ad-text);
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-xs);
	font-weight: 600;
	line-height: 1.3;
	min-height: 64px;
	padding-left: 78px;
	position: relative;
}

.ad-review-thumb {
	left: 0;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 64px;
}

.ad-review-thumb img {
	border-radius: var(--ad-radius-sm);
	display: block;
	height: 64px;
	object-fit: cover;
	width: 64px;
}

.woocommerce-checkout #order_review table.shop_table td.product-name .product-quantity,
.woocommerce-checkout #order_review table.shop_table td.product-name .variation {
	color: var(--ad-text-faint-2);
	display: block;
	font-family: var(--ad-font-body);
	font-size: var(--ad-fs-3xs);
	font-weight: 400;
	margin: 4px 0 0;
}

.woocommerce-checkout #order_review table.shop_table td.product-total {
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-sm);
	font-weight: 700;
	text-align: right;
	white-space: nowrap;
}

/* Totali: elenco separato dagli articoli da una linea sola. */
.woocommerce-checkout #order_review table.shop_table tfoot th {
	color: var(--ad-text-body-2);
	font-weight: 400;
	text-align: left;
}

.woocommerce-checkout #order_review table.shop_table tfoot td {
	color: var(--ad-text-body-2);
	font-family: var(--ad-font-mono);
	font-weight: 600;
	text-align: right;
}

.woocommerce-checkout #order_review table.shop_table tfoot tr:first-child th,
.woocommerce-checkout #order_review table.shop_table tfoot tr:first-child td {
	border-top: 1px solid var(--ad-border-lightest);
	padding-top: var(--ad-gap-lg);
}

/* Le spedizioni sono scelte da leggere, non una cifra a destra: etichetta
   sopra e opzioni incolonnate, come le righe di consegna dell'artboard. */
.woocommerce-checkout #order_review table.shop_table tfoot tr.shipping,
.woocommerce-checkout #order_review table.shop_table tfoot tr.shipping th,
.woocommerce-checkout #order_review table.shop_table tfoot tr.shipping td {
	display: block;
	font-family: var(--ad-font-body);
	font-weight: 400;
	text-align: left;
	width: 100%;
}

.woocommerce-checkout #order_review table.shop_table tfoot tr.shipping td { padding-top: 0; }

/* Vale anche per il riepilogo del carrello, dove la stessa lista compare
   dentro `.cart_totals`: senza, restano i punti elenco del browser e le voci
   si allineano a destra come il resto della cella. */
.woocommerce-checkout #order_review #shipping_method,
.woocommerce .cart_totals #shipping_method {
	display: flex;
	flex-direction: column;
	gap: var(--ad-gap-xs);
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: left;
}

.woocommerce-checkout #order_review #shipping_method li,
.woocommerce .cart_totals #shipping_method li {
	align-items: center;
	display: flex;
	gap: 10px;
	margin: 0;
}

.woocommerce-checkout #order_review #shipping_method label,
.woocommerce .cart_totals #shipping_method label {
	color: var(--ad-text-body);
	font-size: var(--ad-fs-xs);
	margin: 0;
}

/* La spedizione non è una voce con una cifra a destra ma un blocco di scelte:
   nell'artboard 4A l'etichetta sta su una riga sua e le opzioni sotto, a tutta
   larghezza. In una tabella si ottiene sciogliendo le due celle in blocchi —
   altrimenti la parola "Spedizione" e il primo pallino si toccano. */
.woocommerce-cart .cart_totals table tr.shipping {
	display: block;
	padding: 0;
}

.woocommerce-cart .cart_totals table tr.shipping th,
.woocommerce-cart .cart_totals table tr.shipping td { padding: 0; }

.woocommerce-cart .cart_totals table tr.shipping {
	border-top: 1px solid var(--ad-border-lightest);
	margin-top: var(--ad-gap-md);
	padding-top: var(--ad-gap-md);
}

/* Etichetta di sezione, come nell'artboard: non una voce del riepilogo. */
.woocommerce-cart .cart_totals table tr.shipping th {
	color: var(--ad-text);
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-2xs);
	font-weight: 600;
	letter-spacing: var(--ad-ls-nav);
	margin-bottom: 14px;
}

/* I pallini con il colore del sito e allineati al testo — anche al checkout,
   dove la stessa lista compare nel riepilogo dell'ordine. */
.woocommerce-cart .cart_totals #shipping_method input[type="radio"],
.woocommerce-checkout #order_review #shipping_method input[type="radio"] {
	accent-color: var(--ad-blue-700);
	flex: none;
	height: 16px;
	margin: 0;
	width: 16px;
}

/* La riga "Spedizione a …" e il collegamento per cambiarla stanno sotto le
   opzioni, allineati a sinistra come loro. */
.woocommerce .cart_totals .woocommerce-shipping-destination,
.woocommerce .cart_totals .woocommerce-shipping-calculator {
	font-size: var(--ad-fs-2xs);
	margin: var(--ad-gap-sm) 0 0;
	text-align: left;
}

.woocommerce .cart_totals .woocommerce-shipping-destination {
	color: var(--ad-text-muted);
	line-height: var(--ad-lh-body);
	margin-bottom: 4px;
}

.woocommerce .cart_totals .woocommerce-shipping-destination strong {
	color: var(--ad-text);
	font-weight: 600;
}

.woocommerce .cart_totals .woocommerce-shipping-calculator { margin-top: 0; }

.woocommerce .cart_totals .shipping-calculator-button { color: var(--ad-teal); }

.woocommerce-checkout #order_review table.shop_table tr.order-total th,
.woocommerce-checkout #order_review table.shop_table tr.order-total td {
	border-top: 1px solid var(--ad-border-lightest);
	font-family: var(--ad-font-heading);
	padding-top: var(--ad-gap-lg);
	vertical-align: baseline;
}

.woocommerce-checkout #order_review table.shop_table tr.order-total th {
	font-size: 17px;
	font-weight: 700;
}

.woocommerce-checkout #order_review table.shop_table tr.order-total td,
.woocommerce-checkout #order_review table.shop_table tr.order-total td .amount {
	color: var(--ad-blue-700);
	font-size: var(--ad-fs-h2-sm);
	font-weight: 800;
	line-height: 1;
}

.woocommerce-checkout #order_review table.shop_table tr.order-total td small,
.woocommerce-checkout #order_review table.shop_table tr.order-total td small .amount {
	color: var(--ad-text-faint-2);
	font-family: var(--ad-font-body);
	font-size: var(--ad-fs-3xs);
	font-weight: 400;
}

.woocommerce-checkout #order_review table.shop_table tr.order-total td small {
	display: block;
	margin-top: 8px;
}

/* ---------------------------------------------------------------------------
 * Pagamento
 * ------------------------------------------------------------------------ */

.woocommerce-checkout #payment {
	background: transparent;
	border-radius: 0;
	margin-top: var(--ad-gap-xl);
}

.woocommerce-checkout #payment ul.payment_methods {
	border: 0;
	display: flex;
	flex-direction: column;
	gap: var(--ad-gap-sm);
	list-style: none;
	margin: 0;
	padding: 0;
}

.woocommerce-checkout #payment ul.payment_methods li {
	border: 1px solid var(--ad-border-lighter);
	border-radius: var(--ad-radius-ms);
	list-style: none;
	margin: 0;
	padding: 16px 18px;
}

/* Il metodo scelto si vede dal riquadro, non solo dal pallino. */
.woocommerce-checkout #payment ul.payment_methods li:has(input:checked) {
	background: var(--ad-surface-selected);
	border-color: var(--ad-blue-700);
}

.woocommerce-checkout #payment ul.payment_methods li label {
	color: var(--ad-text);
	display: inline;
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-sm);
	font-weight: 600;
	margin: 0;
}

.woocommerce-checkout #payment div.payment_box {
	background: none;
	color: var(--ad-text-muted);
	font-size: var(--ad-fs-2xs);
	line-height: var(--ad-lh-body);
	margin: 10px 0 0;
	padding: 0;
}

.woocommerce-checkout #payment div.payment_box::before { display: none; }

.woocommerce-checkout #payment div.form-row.place-order { padding: var(--ad-gap-xl) 0 0; }

.woocommerce-checkout #payment #place_order {
	background: var(--ad-coral);
	border: 0;
	border-radius: var(--ad-radius-sm);
	color: #fff;
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-xs);
	font-weight: 700;
	letter-spacing: var(--ad-ls-button);
	padding: 21px;
	text-transform: uppercase;
	width: 100%;
}

.woocommerce-checkout #payment #place_order:hover { background: var(--ad-coral-alt-1); }

/* Condizioni e privacy: didascalia sotto il bottone. */
.woocommerce-checkout #payment .woocommerce-privacy-policy-text p,
.woocommerce-checkout #payment .woocommerce-terms-and-conditions-wrapper {
	color: var(--ad-text-faint-2);
	font-size: var(--ad-fs-3xs);
	line-height: var(--ad-lh-body);
	margin: 0 0 var(--ad-gap-md);
	text-align: center;
}

/* ---------------------------------------------------------------------------
 * Area personale (4C)
 * ------------------------------------------------------------------------ */

/* Pagina di accesso: non c'è menu, il contenuto occupa tutta la larghezza. */
.woocommerce-account:not(.logged-in) .woocommerce {
	padding: 0 var(--ad-gutter) var(--ad-section-y);
}

/* Griglia dell'area personale come nell'artboard: menu di 260px,
   intestazione a tutta larghezza. Il selettore parte da `body` per stare
   sopra a chiunque altro disponga `.woocommerce-MyAccount`. */
body.woocommerce-account .woocommerce-MyAccount {
	display: grid;
	gap: 0;
	grid-template-columns: 260px minmax(0, 1fr);
}

.woocommerce-account .woocommerce-MyAccount > .ad-page-head { grid-column: 1 / -1; }

.woocommerce-account .woocommerce-MyAccount-navigation {
	padding: var(--ad-gap-2xl) 28px;
	width: 100%;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
	display: flex;
	flex-direction: column;
	gap: var(--ad-gap-xs);
	list-style: none;
	margin: 0;
	padding: 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation li {
	border: 0;
	margin: 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation a {
	border-radius: var(--ad-radius-sm);
	color: var(--ad-text-body-2);
	display: block;
	font-size: var(--ad-fs-xs);
	font-weight: 500;
	line-height: 1;
	padding: 14px 16px;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.woocommerce-account .woocommerce-MyAccount-navigation a:hover {
	background: var(--ad-sand);
	color: var(--ad-text);
}

.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
	background: var(--ad-blue-700);
	color: var(--ad-text-on-dark);
	font-weight: 600;
}

/* Uscire non è una destinazione come le altre: resta in secondo piano. */
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a {
	color: var(--ad-text-faint-2);
}

/* Niente `width: 100%`: la colonna è già larga quanto la cella della griglia,
   e insieme ai margini laterali delle altre schede sborderebbe. */
.woocommerce-account .woocommerce-MyAccount-content {
	background: none;
	display: flex;
	flex-direction: column;
	gap: var(--ad-gap-xl);
	min-width: 0;
	padding: var(--ad-gap-2xl) var(--ad-gutter) 64px;
}

/* WooCommerce stampa sempre il contenitore degli avvisi, anche vuoto: senza
   questo lascerebbe un salto di 24px in cima alla colonna. */
.woocommerce-account .woocommerce-notices-wrapper:empty { display: none; }

@media (max-width: 900px) {
	body.woocommerce-account .woocommerce-MyAccount { grid-template-columns: 1fr; }

	.woocommerce-account .woocommerce-MyAccount-navigation {
		padding: var(--ad-gap-lg) var(--ad-gutter) 0;
	}

	.woocommerce-account .woocommerce-MyAccount-content {
		padding: var(--ad-gap-lg) var(--ad-gutter) var(--ad-section-y);
	}
}

/* Bottoni di conferma dell'area personale: "Accedi", "Crea account", "Salva
   indirizzo", "Salva le modifiche". Sono l'azione principale della loro pagina
   e nel design l'azione principale è corallo. Solo `button` e `input`: i link
   travestiti da bottone (la tabella degli ordini, gli avvisi) hanno un aspetto
   loro, più sotto. */
.woocommerce-account .woocommerce-form-login__submit,
.woocommerce-account .woocommerce-form-register__submit,
.woocommerce-account .woocommerce-MyAccount-content button.button,
.woocommerce-account .woocommerce-MyAccount-content input.button {
	background: var(--ad-coral);
	border: 0;
	border-radius: var(--ad-radius-sm);
	color: #fff;
	cursor: pointer;
	font-family: var(--ad-font-heading);
	font-weight: 700;
	letter-spacing: var(--ad-ls-button);
	padding: 15px 26px;
	text-transform: uppercase;
}

.woocommerce-account .woocommerce-form-login__submit:hover,
.woocommerce-account .woocommerce-form-register__submit:hover,
.woocommerce-account .woocommerce-MyAccount-content button.button:hover,
.woocommerce-account .woocommerce-MyAccount-content input.button:hover {
	background: var(--ad-coral-alt-1);
}

/* ---------------------------------------------------------------------------
 * Messaggi di WooCommerce
 * ------------------------------------------------------------------------ */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	background: var(--ad-sand);
	border-radius: var(--ad-radius-sm);
	border-top: 0;
	color: var(--ad-text-body);
	font-size: var(--ad-fs-2xs);
	margin: 0 var(--ad-gutter) var(--ad-gap-lg);
	padding: 16px 20px;
}

.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before { display: none; }

.woocommerce-message { border-left: 3px solid var(--ad-in-stock); }
.woocommerce-info { border-left: 3px solid var(--ad-teal); }
.woocommerce-error { border-left: 3px solid var(--ad-coral); }

/* Alcuni avvisi (il codice sconto al checkout) arrivano già col markup a
   blocchi: stesso aspetto degli altri e stesso gutter della pagina. */
/* Il selettore parte da `body` per superare quello del blocco, che ha la
   stessa specificità ma arriva dopo. */
body.woocommerce-cart .wc-block-components-notice-banner,
body.woocommerce-checkout .wc-block-components-notice-banner {
	align-items: center;
	background: var(--ad-sand);
	border: 0;
	border-left: 3px solid var(--ad-teal);
	border-radius: var(--ad-radius-sm);
	box-shadow: none;
	color: var(--ad-text-body);
	font-size: var(--ad-fs-2xs);
	margin: 0 var(--ad-gutter) var(--ad-gap-lg);
	outline: 0;
	padding: 16px 20px;
}

/* Nel carrello il gutter ce l'ha già il contenitore. */
body.woocommerce-cart .wc-block-components-notice-banner { margin-inline: 0; }

body.woocommerce-cart .wc-block-components-notice-banner.is-error,
body.woocommerce-checkout .wc-block-components-notice-banner.is-error {
	border-left-color: var(--ad-coral);
}

body.woocommerce-cart .wc-block-components-notice-banner.is-success,
body.woocommerce-checkout .wc-block-components-notice-banner.is-success {
	border-left-color: var(--ad-in-stock);
}

body.woocommerce-cart .wc-block-components-notice-banner svg,
body.woocommerce-checkout .wc-block-components-notice-banner svg {
	fill: var(--ad-teal);
	flex-shrink: 0;
}

body.woocommerce-cart .wc-block-components-notice-banner.is-error svg,
body.woocommerce-checkout .wc-block-components-notice-banner.is-error svg {
	fill: var(--ad-coral);
}

body.woocommerce-cart .wc-block-components-notice-banner.is-success svg,
body.woocommerce-checkout .wc-block-components-notice-banner.is-success svg {
	fill: var(--ad-in-stock);
}

.woocommerce-message .button,
.woocommerce-info .button {
	background: var(--ad-blue-700);
	border-radius: var(--ad-radius-sm);
	color: var(--ad-text-on-dark);
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-3xs);
	font-weight: 700;
	letter-spacing: var(--ad-ls-button);
	padding: 10px 16px;
	text-transform: uppercase;
}


/* Bottoni della riga azioni: non sono l'azione principale del carrello, quindi
   non prendono il corallo del bottone predefinito. */
.woocommerce-cart td.actions button[name="apply_coupon"],
.woocommerce-cart td.actions button[name="update_cart"] {
	background: transparent;
	border: 1.5px solid var(--ad-border-input);
	border-radius: var(--ad-radius-sm);
	color: var(--ad-text-body);
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-3xs);
	font-weight: 700;
	letter-spacing: var(--ad-ls-button);
	padding: 13px 20px;
	text-transform: uppercase;
}

.woocommerce-cart td.actions button[name="apply_coupon"]:hover:not(:disabled),
.woocommerce-cart td.actions button[name="update_cart"]:hover:not(:disabled) {
	border-color: var(--ad-blue-700);
	color: var(--ad-blue-700);
}

.woocommerce-cart td.actions button:disabled { opacity: 0.45; }

/* La nota di aiuto è un blocco a sé sotto il riepilogo, non dentro. */

/* WooCommerce dispone fatturazione e note affiancate con i float: dentro la
   griglia del checkout finivano nella colonna del riepilogo. */
.woocommerce-checkout .woocommerce .col2-set .col-1,
.woocommerce-checkout .woocommerce .col2-set .col-2,
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 {
	float: none;
	max-width: none;
	width: 100%;
}

/* Il titolo del riepilogo è vuoto quando WooCommerce lo stampa come box a sé. */
.woocommerce-checkout #order_review_heading:empty { display: none; }

/* Il contenitore del bottone è un flex: senza questo il bottone resta della
   sua larghezza naturale invece di occupare la colonna. */
.woocommerce-cart .cart_totals .wc-proceed-to-checkout {
	display: flex;
	flex-direction: column;
}

.woocommerce-cart .cart_totals .wc-proceed-to-checkout > a.checkout-button {
	width: 100%;
}

/* Il riepilogo è una `table.shop_table` come quella degli articoli, quindi si
   prendeva anche il suo vestito: fondo, angoli tondi e ombra, cioè un riquadro
   fantasma dentro la card del riepilogo. Qui torna a essere una tabella nuda. */
.woocommerce-cart .cart_totals table,
.woocommerce-cart .cart_totals table tr,
.woocommerce-cart .cart_totals table th,
.woocommerce-cart .cart_totals table td {
	background: transparent;
}

.woocommerce-cart .cart_totals table.shop_table {
	border-radius: 0;
	box-shadow: none;
	overflow: visible;
}

/* ---------------------------------------------------------------------------
 * Metodi di pagamento nel carrello
 * ------------------------------------------------------------------------ */

.ad-payments { margin-top: var(--ad-gap-md); }

.ad-payments__list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ad-gap-xs);
	justify-content: center;
}

/* Etichette testuali e non loghi: i marchi dei circuiti hanno regole d'uso
   proprie e vanno richiesti al fornitore del servizio. */
.ad-payment {
	border: 1px solid var(--ad-border-lightest);
	border-radius: var(--ad-radius-xs);
	color: var(--ad-text-faint-2);
	font-size: var(--ad-fs-4xs);
	font-weight: 500;
	padding: 8px 10px;
	text-transform: uppercase;
}

/* ---------------------------------------------------------------------------
 * Bacheca area personale (4C)
 * ------------------------------------------------------------------------ */

.ad-account-block {
	background: var(--ad-surface-raised);
	border: 0;
	border-radius: var(--ad-radius-xl);
	box-shadow: var(--ad-shadow-card);
	box-sizing: border-box;
	margin: 0;
	padding: 30px 32px;
	text-align: left;
	width: 100%;
}

/* Le schede senza artboard proprio (ordini, indirizzi, dati account) non
   hanno un contenitore su cui appoggiare la card, e i loro contenuti sono
   tabelle e form di WooCommerce: la card la fa la colonna stessa. */
body.woocommerce-account:not(.woocommerce-dashboard) .woocommerce-MyAccount-content {
	background: var(--ad-surface-raised);
	border-radius: var(--ad-radius-xl);
	box-shadow: var(--ad-shadow-card);
	margin: var(--ad-gap-2xl) var(--ad-gutter) 64px;
	padding: 30px 32px;
}

@media (max-width: 900px) {
	body.woocommerce-account:not(.woocommerce-dashboard) .woocommerce-MyAccount-content {
		margin: var(--ad-gap-lg) var(--ad-gutter) var(--ad-section-y);
	}
}

.ad-account-block__head {
	align-items: baseline;
	display: flex;
	gap: var(--ad-gap-md);
	justify-content: space-between;
}

.ad-account-block__title {
	font-size: var(--ad-fs-h3);
	font-weight: 700;
	line-height: 1.2;
	margin: 0;
}

.ad-account-block__title--sm { font-size: var(--ad-fs-lead); }

/* Link testuale sottolineato in corallo: nel design è l'azione secondaria
   ricorrente ("Vedi tutti", "Modifica"). */
.ad-account-link {
	border-bottom: 1.5px solid var(--ad-coral);
	color: var(--ad-blue-700);
	display: inline-block;
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-2xs);
	font-weight: 600;
	line-height: 1;
	padding-bottom: 3px;
	white-space: nowrap;
}

.ad-account-link:hover { color: var(--ad-coral); }

/* ---------------------------------------------------------------------------
 * Tabella degli ordini recenti
 * ------------------------------------------------------------------------ */

/* Le celle vanno allineate per colonna anche quando il contenuto ha lunghezze
   diverse: la tabella resta tale nel markup, la griglia la dispone. */
.ad-orders {
	border-collapse: collapse;
	display: block;
	margin-top: var(--ad-gap-xl);
	width: 100%;
}

.ad-orders thead,
.ad-orders tbody { display: block; }

.ad-orders tr {
	align-items: center;
	display: grid;
	gap: var(--ad-gap-md);
	grid-template-columns: 1.1fr 1fr 1fr 1fr auto;
}

.ad-orders th {
	background: none;
	border: 0;
	color: var(--ad-text-faint-2);
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-4xs);
	font-weight: 600;
	letter-spacing: var(--ad-ls-caps);
	line-height: 1;
	padding: 0;
	text-align: left;
	text-transform: uppercase;
}

.ad-orders tbody tr {
	border-top: 1px solid var(--ad-border-lightest);
}

.ad-orders tbody tr:first-child { margin-top: 14px; }

.ad-orders td {
	background: none;
	border: 0;
	color: var(--ad-text-body);
	font-size: var(--ad-fs-sm);
	line-height: 1;
	padding: 20px 0;
	text-align: left;
}

.ad-orders__number a {
	color: inherit;
	font-weight: 600;
}

.ad-orders__number a:hover { color: var(--ad-teal); }

.ad-orders__status { font-weight: 600; }
.ad-orders__status.is-progress { color: var(--ad-teal); }
.ad-orders__status.is-done { color: var(--ad-in-stock); }
.ad-orders__status.is-returned { color: var(--ad-backorder); }

.ad-orders__total,
.ad-orders__total .amount {
	color: var(--ad-text-body);
	font-family: var(--ad-font-mono);
	font-size: var(--ad-fs-sm);
	font-weight: 400;
}

/* Ordini rimborsati: WooCommerce barra il totale originale e affianca quello
   effettivo. La sottolineatura predefinita di <ins> qui è solo rumore. */
.ad-orders__total del { color: var(--ad-text-faint); }
.ad-orders__total ins { background: none; text-decoration: none; }

.ad-orders__action { text-align: right; }

.ad-orders__action a {
	color: var(--ad-coral);
	font-size: var(--ad-fs-2xs);
	font-weight: 600;
}

.ad-orders__action a:hover { text-decoration: underline; }

@media (max-width: 640px) {
	.ad-orders thead { display: none; }

	.ad-orders tr {
		gap: 6px var(--ad-gap-md);
		grid-template-columns: 1fr auto;
	}

	.ad-orders tbody tr { padding: 14px 0; }
	.ad-orders td { padding: 0; }
	.ad-orders__action { grid-column: 2; grid-row: 1; }
	.ad-orders__total { grid-column: 2; text-align: right; }
}

.ad-account-empty {
	background: var(--ad-sand);
	border-radius: var(--ad-radius-sm);
	color: var(--ad-text-lead);
	font-size: var(--ad-fs-2xs);
	margin: var(--ad-gap-xl) 0 0;
	padding: var(--ad-gap-md);
}

/* ---------------------------------------------------------------------------
 * Indirizzi salvati
 * ------------------------------------------------------------------------ */

.ad-account-grid {
	align-items: start;
	display: grid;
	gap: var(--ad-gap-xl);
	grid-template-columns: 1fr 1fr;
}

@media (max-width: 900px) {
	.ad-account-grid { grid-template-columns: 1fr; }
}

.ad-account-address {
	color: var(--ad-text-body-2);
	font-size: var(--ad-fs-sm);
	line-height: var(--ad-lh-relaxed);
	margin: var(--ad-gap-sm) 0 0;
}

.ad-account-address--empty { color: var(--ad-text-muted); }

.ad-account-grid .ad-account-link { margin-top: var(--ad-gap-md); }

/* ---------------------------------------------------------------------------
 * Le altre schede dell'area personale
 *
 * Non hanno un artboard proprio: prendono la stessa tipografia della bacheca,
 * così passare da una all'altra non sembra cambiare sito.
 * ------------------------------------------------------------------------ */

.woocommerce-account .woocommerce-MyAccount-content > p {
	color: var(--ad-text-body);
	font-size: var(--ad-fs-sm);
	line-height: var(--ad-lh-body);
	margin: 0;
}

/* Elenco ordini */

.woocommerce-account .woocommerce-orders-table {
	border: 0;
	border-collapse: collapse;
	font-size: var(--ad-fs-sm);
	margin: 0;
	width: 100%;
}

.woocommerce-account .woocommerce-orders-table thead,
.woocommerce-account .woocommerce-orders-table tbody,
.woocommerce-account .woocommerce-orders-table tr,
.woocommerce-account .woocommerce-orders-table th,
.woocommerce-account .woocommerce-orders-table td {
	background: none;
	border: 0;
	text-align: left;
	vertical-align: middle;
}

.woocommerce-account .woocommerce-orders-table thead th {
	color: var(--ad-text-faint-2);
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-4xs);
	font-weight: 600;
	letter-spacing: var(--ad-ls-caps);
	padding: 0 var(--ad-gap-md) 14px 0;
	text-transform: uppercase;
}

/* La cella del numero d'ordine è un `th[scope=row]`: va con le celle della
   riga, non con le intestazioni di colonna. */
.woocommerce-account .woocommerce-orders-table tbody th,
.woocommerce-account .woocommerce-orders-table tbody td {
	border-top: 1px solid var(--ad-border-lightest);
	color: var(--ad-text-body);
	font-size: var(--ad-fs-sm);
	font-weight: 400;
	letter-spacing: normal;
	padding: 20px var(--ad-gap-md) 20px 0;
	text-transform: none;
}

.woocommerce-account .woocommerce-orders-table tr > :last-child {
	padding-right: 0;
	text-align: right;
}

.woocommerce-account .woocommerce-orders-table__cell-order-number a {
	color: inherit;
	font-weight: 600;
}

.woocommerce-account .woocommerce-orders-table__cell-order-number a:hover { color: var(--ad-teal); }

/* Solo la cifra è monospaziata: "per 2 articoli" è testo corrente. */
.woocommerce-account .woocommerce-orders-table__cell-order-total .amount {
	font-family: var(--ad-font-mono);
}

/* Le azioni sono link, non bottoni: nel design il corallo pieno è riservato
   alle CTA d'acquisto. */
.woocommerce-account .woocommerce-orders-table a.button {
	background: none;
	border: 0;
	border-radius: 0;
	color: var(--ad-coral);
	font-family: var(--ad-font-body);
	font-size: var(--ad-fs-2xs);
	font-weight: 600;
	letter-spacing: normal;
	padding: 0;
	text-transform: none;
}

.woocommerce-account .woocommerce-orders-table a.button:hover {
	background: none;
	color: var(--ad-coral);
	text-decoration: underline;
}

/* Un ordine da pagare ne ha più di una — "Pagamento", "Visualizza",
   "Annulla" — e senza spazio si leggono come una parola sola. */
.woocommerce-account .woocommerce-orders-table__cell-order-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ad-gap-md);
	justify-content: flex-end;
}

/* Indirizzi salvati */

.woocommerce-account .woocommerce-Addresses {
	display: grid;
	gap: var(--ad-gap-2xl);
	grid-template-columns: 1fr 1fr;
	margin: 0;
}

.woocommerce-account .woocommerce-Addresses .woocommerce-Address {
	border: 0;
	float: none;
	padding: 0;
	text-align: left;
	width: 100%;
}

@media (max-width: 900px) {
	.woocommerce-account .woocommerce-Addresses { grid-template-columns: 1fr; }
}

/* WooCommerce mette il link di modifica accanto al titolo; nel design sta in
   fondo alla card. `display: contents` scioglie il contenitore del titolo e
   lascia ordinare i tre pezzi. */
.woocommerce-account .woocommerce-Address { display: flex; flex-direction: column; }
.woocommerce-account .woocommerce-Address-title { display: contents; }

.woocommerce-account .woocommerce-Address-title h2 {
	font-size: var(--ad-fs-lead);
	font-weight: 700;
	line-height: 1.2;
	margin: 0;
	order: 1;
}

.woocommerce-account .woocommerce-Address address {
	color: var(--ad-text-body-2);
	font-size: var(--ad-fs-sm);
	font-style: normal;
	line-height: var(--ad-lh-relaxed);
	margin: var(--ad-gap-sm) 0 0;
	order: 2;
}

.woocommerce-account .woocommerce-Address-title .edit {
	align-self: flex-start;
	border-bottom: 1.5px solid var(--ad-coral);
	color: var(--ad-blue-700);
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-2xs);
	font-weight: 600;
	line-height: 1;
	margin: var(--ad-gap-md) 0 0;
	order: 3;
	padding-bottom: 3px;
}

.woocommerce-account .woocommerce-Address-title .edit:hover { color: var(--ad-coral); }

/* ---------------------------------------------------------------------------
 * Accesso e registrazione
 * ------------------------------------------------------------------------ */

/* Solo la pagina di accesso ha il gutter sul contenitore: lì la fascia sabbia
   lo compensa per restare a tutta larghezza. Carrello e checkout tengono il
   gutter sui blocchi interni, quindi la fascia è già a filo. */
.woocommerce-account:not(.logged-in) .woocommerce > .ad-page-head {
	margin-left: calc(var(--ad-gutter) * -1);
	margin-right: calc(var(--ad-gutter) * -1);
}

/* Le due colonne di WooCommerce usano i float: qui servono affiancate e
   della stessa larghezza. */
/* Le colonne partono dall'alto: senza questo la card più corta si allunga
   per pareggiare l'altra, lasciando un vuoto in fondo. */
/* Il selettore è legato a `.ad-login`: `u-columns` lo usa anche l'elenco
   degli indirizzi, che ha una griglia sua. */
.woocommerce-account .ad-login.u-columns {
	align-items: start;
	display: grid;
	gap: 56px;
	grid-template-columns: 1fr 1fr;
	padding-top: var(--ad-section-y);
}

@media (max-width: 1100px) {
	.woocommerce-account .ad-login.u-columns { gap: var(--ad-gap-2xl); grid-template-columns: 1fr; }
}

.woocommerce-account .ad-login .col-1,
.woocommerce-account .ad-login .col-2,
.woocommerce-account .ad-login .u-column1,
.woocommerce-account .ad-login .u-column2 {
	float: none;
	margin: 0;
	width: 100%;
}

.woocommerce-account .ad-login h2 {
	font-size: var(--ad-fs-h2-sm);
	font-weight: 700;
	letter-spacing: var(--ad-ls-heading);
	margin: 0 0 var(--ad-gap-lg);
}

/* WooCommerce dà alle righe del modulo margini negativi, che annullerebbero il
   padding della card mandando i campi a filo del bordo. */
.woocommerce-account .woocommerce-form-login .form-row,
.woocommerce-account .woocommerce-form-register .form-row {
	margin-left: 0;
	margin-right: 0;
	padding-left: 0;
	padding-right: 0;
	width: 100%;
}

/* Occhio "mostra password": WooCommerce lo stampa come `<span>` vuoto e conta
   sul proprio foglio — che non carichiamo — per posizionarlo e disegnarlo.
   Senza queste regole resta un quadratino grigio accanto al campo. */
.woocommerce form .password-input {
	display: block;
	position: relative;
	width: 100%;
}

.woocommerce form .password-input input.input-text { padding-right: 46px; }

.woocommerce form .show-password-input {
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236d7f8b' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.6-6.2 10-6.2S22 12 22 12s-3.6 6.2-10 6.2S2 12 2 12Z'/%3E%3Ccircle cx='12' cy='12' r='2.8'/%3E%3C/svg%3E") no-repeat center / 19px 19px;
	border: 0;
	bottom: 0;
	cursor: pointer;
	position: absolute;
	right: 0;
	top: 0;
	width: 46px;
}

.woocommerce form .show-password-input.display-password { opacity: 0.5; }

/* WooCommerce azzera il padding con #customer_login.col2-set .login: quel
   selettore usa un ID, quindi per pareggiarlo serve altrettanta specificità.
   Senza, la card di accesso resta senza margini interni. */
#customer_login.col2-set form.woocommerce-form-login,
#customer_login.col2-set form.woocommerce-form-register,
.woocommerce-account .woocommerce form.woocommerce-form-login,
.woocommerce-account .woocommerce form.woocommerce-form-register {
	background: var(--ad-surface-raised);
	border: 0;
	border-radius: var(--ad-radius-lg);
	box-shadow: var(--ad-shadow-card-sm);
	box-sizing: border-box;
	margin: 0;
	padding: 32px;
}

.woocommerce-account .woocommerce-form-login label.woocommerce-form-login__rememberme {
	align-items: center;
	color: var(--ad-text-body);
	display: flex;
	font-size: var(--ad-fs-2xs);
	gap: 8px;
	margin: var(--ad-gap-sm) 0 var(--ad-gap-lg);
}

.woocommerce-account .woocommerce-LostPassword {
	margin: var(--ad-gap-md) 0 0;
}

.woocommerce-account .woocommerce-LostPassword a {
	font-size: var(--ad-fs-2xs);
}

.woocommerce-account .woocommerce-privacy-policy-text p {
	color: var(--ad-text-muted-2);
	font-size: var(--ad-fs-3xs);
	line-height: var(--ad-lh-body);
	margin: 0 0 var(--ad-gap-md);
}

/* ---------------------------------------------------------------------------
 * Accedi o registrati — artboard 5A
 * ------------------------------------------------------------------------ */

.ad-login .ad-eyebrow { margin-bottom: 10px; }

.ad-login h2 {
	font-size: var(--ad-fs-h2-sm);
	font-weight: 700;
	letter-spacing: var(--ad-ls-heading);
	margin: 0 0 var(--ad-gap-lg);
}

/* Etichetta password e "password dimenticata" sulla stessa riga. */
.ad-login__password-head {
	align-items: baseline;
	display: flex;
	gap: var(--ad-gap-sm);
	justify-content: space-between;
}

.ad-login__password-head label { margin: 0; }

.ad-login__forgot {
	color: var(--ad-teal);
	font-size: var(--ad-fs-3xs);
	white-space: nowrap;
}

.ad-login__hint {
	color: var(--ad-text-muted);
	display: block;
	font-size: var(--ad-fs-3xs);
	margin-top: 6px;
}

.ad-login .required { color: var(--ad-coral-alt-1); }

/* Consensi: la casella non è mai preselezionata, il testo è cliccabile. */
.ad-login__consent label,
.woocommerce-form-login__rememberme {
	align-items: flex-start;
	color: var(--ad-text-body);
	cursor: pointer;
	display: flex;
	font-size: var(--ad-fs-2xs);
	gap: 10px;
	line-height: 1.5;
}

.ad-login__terms,
.ad-login__note {
	color: var(--ad-text-muted);
	font-size: var(--ad-fs-3xs);
	line-height: var(--ad-lh-body);
	margin: var(--ad-gap-md) 0 0;
}

.ad-login__note { padding: 0 4px; }

/* Vantaggi dell'account: solo funzioni che esistono davvero. */
.ad-login__benefits {
	display: flex;
	flex-direction: column;
	gap: 10px;
	list-style: none;
	margin: var(--ad-gap-lg) 0 0;
	padding: 0;
}

.ad-login__benefits li {
	color: var(--ad-text-body);
	font-size: var(--ad-fs-2xs);
	line-height: 1.5;
	padding-left: 24px;
	position: relative;
}

.ad-login__benefits li::before {
	color: var(--ad-in-stock);
	content: "\2713";
	font-weight: 700;
	left: 0;
	position: absolute;
}

/* Riga di rassicurazione in fondo. */
.ad-login__reassurance {
	border-top: 1px solid var(--ad-border-light);
	color: var(--ad-text-muted);
	display: flex;
	flex-wrap: wrap;
	font-size: var(--ad-fs-3xs);
	gap: var(--ad-gap-xl);
	justify-content: center;
	margin-top: var(--ad-section-y);
	padding-top: var(--ad-gap-lg);
}

/* Indicatore di robustezza password di WooCommerce, come barra piatta. */
.ad-login .woocommerce-password-strength {
	border-radius: var(--ad-radius-sm);
	font-size: var(--ad-fs-4xs);
	font-weight: 600;
	margin-top: 8px;
	padding: 7px 10px;
	text-align: left;
}

.ad-login .woocommerce-password-hint {
	color: var(--ad-text-muted);
	display: block;
	font-size: var(--ad-fs-3xs);
	margin-top: 6px;
}

/* ---------------------------------------------------------------------------
 * Ordine ricevuto (5D)
 * ------------------------------------------------------------------------ */

/* La conferma è una colonna centrata: qui non si compra più, si legge. */
.woocommerce-order-received .woocommerce {
	margin: 0 auto;
	max-width: calc(1000px + var(--ad-gutter) * 2);
	padding: 0 var(--ad-gutter) 64px;
}

.ad-page-head--bare {
	background: none;
	padding: 44px 0 0;
}

.ad-thankyou__intro {
	display: flex;
	gap: var(--ad-gap-lg);
	margin-top: 34px;
}

.ad-thankyou__mark {
	background: var(--ad-teal);
	border-radius: 50%;
	flex: none;
	height: 46px;
	width: 46px;
}

.ad-thankyou__title {
	font-size: 44px;
	font-weight: 800;
	letter-spacing: var(--ad-ls-hero);
	line-height: 1.08;
	margin: 0;
}

@media (max-width: 782px) {
	.ad-thankyou__title { font-size: var(--ad-fs-h1); }
	.ad-thankyou__mark { height: 32px; width: 32px; }
}

.ad-thankyou__lead {
	color: var(--ad-text-lead);
	font-size: 17px;
	line-height: var(--ad-lh-body);
	margin: 12px 0 0;
	max-width: 640px;
}

.ad-thankyou__lead b { color: var(--ad-blue-700); font-weight: 600; }

/* Riepilogo in cinque colonne: numero, data, email, totale, pagamento. */
.woocommerce-order-received ul.woocommerce-order-overview {
	background: var(--ad-surface-raised);
	border-radius: var(--ad-radius-lg);
	box-shadow: var(--ad-shadow-card);
	display: grid;
	gap: 0;
	grid-template-columns: repeat(5, 1fr);
	list-style: none;
	margin: 34px 0 0;
	overflow: hidden;
	padding: 0;
}

@media (max-width: 900px) {
	.woocommerce-order-received ul.woocommerce-order-overview { grid-template-columns: repeat(2, 1fr); }
}

.woocommerce-order-received ul.woocommerce-order-overview li {
	border: 0;
	border-right: 1px solid var(--ad-border-lightest);
	color: var(--ad-text-faint-2);
	float: none;
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-4xs);
	font-weight: 600;
	letter-spacing: var(--ad-ls-caps);
	line-height: 1;
	margin: 0;
	padding: 24px;
	text-transform: uppercase;
}

.woocommerce-order-received ul.woocommerce-order-overview li:last-child { border-right: 0; }

.woocommerce-order-received ul.woocommerce-order-overview li strong {
	color: var(--ad-text);
	display: block;
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-h3);
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1.2;
	margin-top: 10px;
	text-transform: none;
}

/* Email e metodo di pagamento sono testo, non cifre: restano più piccoli. */
.woocommerce-order-received ul.woocommerce-order-overview li.woocommerce-order-overview__email strong,
.woocommerce-order-received ul.woocommerce-order-overview li.woocommerce-order-overview__payment-method strong {
	font-family: var(--ad-font-body);
	font-size: var(--ad-fs-xs);
	font-weight: 500;
	line-height: 1.3;
}

/* Coordinate di pagamento: riquadro scuro, si nota. */
.ad-thankyou__payment {
	background: var(--ad-gradient-note);
	border-radius: var(--ad-radius-xl);
	color: var(--ad-text-on-dark-2);
	margin-top: var(--ad-gap-xl);
	padding: 34px 36px;
}

.ad-thankyou__payment .ad-eyebrow { color: var(--ad-teal); }

.ad-thankyou__payment h2,
.ad-thankyou__payment h3 {
	color: #fff;
	font-size: 26px;
	font-weight: 700;
	line-height: 1.2;
	margin: 12px 0 0;
}

.ad-thankyou__payment p { margin: 8px 0 0; }

/* Il gateway stampa l'intestatario come secondo titolo: qui è una riga. */
.ad-thankyou__payment h3,
.ad-thankyou__payment .wc-bacs-bank-details-account-name {
	color: var(--ad-text-on-dark-3);
	font-family: var(--ad-font-body);
	font-size: var(--ad-fs-sm);
	font-weight: 500;
	margin-top: 10px;
}

.ad-thankyou__payment ul {
	display: grid;
	gap: 1px;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	list-style: none;
	margin: 26px 0 0;
	padding: 0;
}

.ad-thankyou__payment ul li {
	background: var(--ad-blue-800);
	color: #fff;
	font-size: var(--ad-fs-md, 16px);
	margin: 0;
	padding: 20px 22px;
}

.ad-thankyou__payment ul li strong {
	display: block;
	font-family: var(--ad-font-mono);
	font-weight: 500;
	margin-top: 10px;
}

/* L'etichetta di ogni voce (Banca, IBAN, BIC) sta sopra il valore. */
.ad-thankyou__payment ul li {
	color: var(--ad-text-on-dark-4);
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-4xs);
	font-weight: 600;
	letter-spacing: var(--ad-ls-caps);
	text-transform: uppercase;
}

.ad-thankyou__payment ul li strong {
	color: #fff;
	font-size: var(--ad-fs-md, 16px);
	letter-spacing: 0.04em;
	text-transform: none;
}

/* Dettagli ordine e indirizzi. */
.woocommerce-order-received .woocommerce-order-details,
.woocommerce-order-received .woocommerce-customer-details {
	background: var(--ad-surface-raised);
	border-radius: var(--ad-radius-xl);
	box-shadow: var(--ad-shadow-card);
	margin-top: var(--ad-gap-xl);
	padding: 34px 36px;
}

.woocommerce-order-received .woocommerce-order-details__title,
.woocommerce-order-received .woocommerce-column__title {
	font-size: 22px;
	font-weight: 700;
	line-height: 1.2;
	margin: 0 0 26px;
}

.woocommerce-order-received table.woocommerce-table--order-details {
	border: 0;
	border-collapse: collapse;
	width: 100%;
}

.woocommerce-order-received table.woocommerce-table--order-details th,
.woocommerce-order-received table.woocommerce-table--order-details td {
	background: none;
	border: 0;
	vertical-align: top;
}

.woocommerce-order-received table.woocommerce-table--order-details thead th {
	color: var(--ad-text-faint-2);
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-4xs);
	font-weight: 600;
	letter-spacing: var(--ad-ls-caps);
	padding: 0 0 12px;
	text-align: left;
	text-transform: uppercase;
}

.woocommerce-order-received table.woocommerce-table--order-details thead th:last-child { text-align: right; }

.woocommerce-order-received table.woocommerce-table--order-details tbody td {
	border-top: 1px solid var(--ad-border-lightest);
	color: var(--ad-text);
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-md, 16px);
	font-weight: 600;
	line-height: 1.35;
	padding: 20px 0;
}

.woocommerce-order-received table.woocommerce-table--order-details tbody td.woocommerce-table__product-total {
	font-size: 17px;
	font-weight: 700;
	text-align: right;
	white-space: nowrap;
}

.woocommerce-order-received table.woocommerce-table--order-details .wc-item-meta,
.woocommerce-order-received table.woocommerce-table--order-details .variation {
	color: var(--ad-text-muted);
	font-family: var(--ad-font-body);
	font-size: var(--ad-fs-2xs);
	font-weight: 400;
	line-height: 1.5;
	list-style: none;
	margin: 5px 0 0;
	padding: 0;
}

.woocommerce-order-received table.woocommerce-table--order-details .wc-item-meta p,
.woocommerce-order-received table.woocommerce-table--order-details .wc-item-meta strong { display: inline; margin: 0; }

.woocommerce-order-received table.woocommerce-table--order-details .product-quantity {
	color: var(--ad-text-faint-2);
	font-family: var(--ad-font-body);
	font-weight: 500;
}

.woocommerce-order-received table.woocommerce-table--order-details tfoot th,
.woocommerce-order-received table.woocommerce-table--order-details tfoot td {
	border-top: 1px solid var(--ad-border-lightest);
	color: var(--ad-text-body-2);
	font-size: var(--ad-fs-sm);
	font-weight: 400;
	padding: 12px 0 0;
	text-align: right;
}

.woocommerce-order-received table.woocommerce-table--order-details tfoot td {
	font-family: var(--ad-font-mono);
	font-weight: 600;
}

.woocommerce-order-received table.woocommerce-table--order-details tfoot tr:last-child th {
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-lead);
	font-weight: 700;
	padding-top: 22px;
}

.woocommerce-order-received table.woocommerce-table--order-details tfoot tr:last-child td,
.woocommerce-order-received table.woocommerce-table--order-details tfoot tr:last-child td .amount {
	color: var(--ad-blue-700);
	font-family: var(--ad-font-heading);
	font-size: 32px;
	font-weight: 800;
	line-height: 1;
	padding-top: 22px;
}

.woocommerce-order-received table.woocommerce-table--order-details tfoot tr:last-child td small,
.woocommerce-order-received table.woocommerce-table--order-details tfoot tr:last-child td small .amount {
	color: var(--ad-text-faint-2);
	font-family: var(--ad-font-body);
	font-size: var(--ad-fs-2xs);
	font-weight: 400;
	line-height: var(--ad-lh-body);
	padding: 0;
}

.woocommerce-order-received table.woocommerce-table--order-details tfoot tr:last-child td small {
	display: block;
	margin-top: 8px;
}

/* Indirizzi affiancati: mezza colonna la fatturazione, mezza la spedizione.
   Senza prefisso di pagina, perché WooCommerce stampa lo stesso blocco nella
   conferma d'ordine e nel dettaglio dell'ordine in area personale. Le due
   colonne le costruisce `order-details-customer.php` quando l'ordine ha un
   indirizzo di spedizione (vedi inc/woocommerce-pages.php). */
.woocommerce-customer-details .woocommerce-columns--addresses {
	display: grid;
	gap: var(--ad-gap-xl);
	grid-template-columns: 1fr 1fr;
}

@media (max-width: 782px) {
	.woocommerce-customer-details .woocommerce-columns--addresses { grid-template-columns: 1fr; }
}

/* WooCommerce le dispone con i float e le divide con un bordo. */
.woocommerce-customer-details .woocommerce-column {
	border: 0;
	float: none;
	padding: 0;
	text-align: left;
	width: 100%;
}

.woocommerce-customer-details address {
	border: 0;
	color: var(--ad-text-body);
	font-size: var(--ad-fs-sm);
	font-style: normal;
	line-height: var(--ad-lh-relaxed);
	padding: 0;
	text-align: left;
}

/* Nel dettaglio dell'ordine la card la fa già la colonna dell'area personale:
   qui serve solo staccare il blocco dalla tabella e dare ai due titoli la
   tipografia degli altri titoli di sezione. */
.woocommerce-view-order .woocommerce-customer-details {
	border-top: 1px solid var(--ad-border-lightest);
	margin-top: var(--ad-gap-2xl);
	padding-top: var(--ad-gap-2xl);
}

.woocommerce-view-order .woocommerce-order-details__title,
.woocommerce-view-order .woocommerce-column__title {
	font-size: var(--ad-fs-lead);
	font-weight: 700;
	line-height: 1.2;
	margin: 0 0 var(--ad-gap-sm);
}

/* Chiusura: dove chiedere aiuto e dove andare adesso. */
.ad-thankyou__help {
	align-items: center;
	background: var(--ad-sand);
	border-radius: var(--ad-radius-xl);
	display: flex;
	flex-wrap: wrap;
	gap: 28px;
	justify-content: space-between;
	margin-top: var(--ad-gap-xl);
	padding: 30px 34px;
}

.ad-thankyou__help-title {
	font-family: var(--ad-font-heading);
	font-size: 19px;
	font-weight: 700;
	line-height: 1.3;
}

.ad-thankyou__help p {
	color: var(--ad-text-muted-2);
	font-size: var(--ad-fs-sm);
	line-height: var(--ad-lh-body);
	margin: 6px 0 0;
}

.ad-thankyou__help-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ad-gap-sm);
}

/* ---------------------------------------------------------------------------
 * Preferiti (5F)
 *
 * Il markup è quello di TI WooCommerce Wishlist, riscritto nei template
 * `woocommerce/ti-wishlist*.php`: qui si veste. I selettori partono da
 * `.ad-wishlist` per stare sopra al foglio del plugin senza `!important`.
 * ------------------------------------------------------------------------ */

/* La colonna dell'area personale è una scheda bianca per tutti gli endpoint;
   qui le schede sono due, quindi il contenitore torna trasparente. */
body.woocommerce-account.ad-wishlist-page .woocommerce-MyAccount-content {
	background: none;
	box-shadow: none;
	padding: 0;
}

.tinv-wishlist.ad-wishlist {
	display: flex;
	flex-direction: column;
	gap: var(--ad-gap-xl);
}

.ad-wishlist__card {
	background: var(--ad-surface-raised);
	border-radius: var(--ad-radius-xl);
	box-shadow: var(--ad-shadow-card);
	padding: 32px 34px 26px;
}

/* Intestazione --------------------------------------------------------- */

.ad-wishlist__head {
	align-items: baseline;
	display: flex;
	gap: var(--ad-gap-md);
	justify-content: space-between;
}

.ad-wishlist__title {
	font-size: 22px;
	font-weight: 700;
	line-height: 1.2;
	margin: 0;
}

.ad-wishlist__sub {
	color: var(--ad-text-muted);
	font-size: var(--ad-fs-xs);
	line-height: 1.5;
	margin: 6px 0 0;
}

.ad-wishlist__share {
	color: var(--ad-teal);
	font-size: var(--ad-fs-2xs);
	font-weight: 600;
	white-space: nowrap;
}

.ad-wishlist__share:hover { color: var(--ad-blue-700); }

/* Tabella --------------------------------------------------------------- */

.tinv-wishlist.ad-wishlist .ad-wishlist__table {
	border-collapse: collapse;
	margin: 0;
	table-layout: fixed;
	width: 100%;
}

.tinv-wishlist.ad-wishlist .ad-wishlist__table th,
.tinv-wishlist.ad-wishlist .ad-wishlist__table td {
	background: none;
	border: 0;
	text-align: left;
	vertical-align: middle;
}

.tinv-wishlist.ad-wishlist .ad-wishlist__table thead th {
	border-bottom: 1px solid var(--ad-border-lightest);
	color: var(--ad-text-faint-2);
	font-family: var(--ad-font-heading);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.16em;
	padding: 28px 0 14px;
	text-transform: uppercase;
}

.tinv-wishlist.ad-wishlist .ad-wishlist__table tbody td {
	border-bottom: 1px solid var(--ad-border-faint);
	padding: var(--ad-gap-md) var(--ad-gap-lg) var(--ad-gap-md) 0;
}

.tinv-wishlist.ad-wishlist .ad-wishlist__table .product-cb { width: 44px; }
.tinv-wishlist.ad-wishlist .ad-wishlist__table .product-price { width: 130px; }
.tinv-wishlist.ad-wishlist .ad-wishlist__table .product-stock { width: 165px; }
.tinv-wishlist.ad-wishlist .ad-wishlist__table .product-date { width: 115px; }
.tinv-wishlist.ad-wishlist .ad-wishlist__table .product-action { padding-right: 0; width: 200px; }

/* Le icone del plugin restano fuori: le colonne hanno gia la loro etichetta,
   e la CTA il suo testo. */
.tinv-wishlist.ad-wishlist .ftinvwl,
.tinv-wishlist.ad-wishlist .tinvwl-mobile { display: none; }

.tinv-wishlist.ad-wishlist .ad-wishlist__table input[type="checkbox"] {
	accent-color: var(--ad-blue-700);
	height: 17px;
	margin: 0;
	width: 17px;
}

.ad-wishlist__product {
	align-items: center;
	display: flex;
	gap: var(--ad-gap-md);
}

.ad-wishlist__thumb {
	background: var(--ad-surface);
	border-radius: var(--ad-radius-ms);
	display: block;
	flex: none;
	height: 72px;
	overflow: hidden;
	width: 72px;
}

.ad-wishlist__thumb img {
	display: block;
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.ad-wishlist__info {
	display: flex;
	flex-direction: column;
	gap: 5px;
	min-width: 0;
}

.ad-wishlist__brand {
	color: var(--ad-text-faint-2);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: var(--ad-ls-badge);
	text-transform: uppercase;
}

.ad-wishlist__name {
	color: var(--ad-text);
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-body);
	font-weight: 600;
	line-height: 1.3;
}

.ad-wishlist__name:hover { color: var(--ad-teal); }

.ad-wishlist__variant {
	color: var(--ad-text-faint-2);
	font-size: var(--ad-fs-3xs);
	line-height: 1.4;
}

.ad-wishlist__variant dl,
.ad-wishlist__variant p { margin: 0; }

/* WooCommerce stampa `<del>` prima di `<ins>`: il design vuole il prezzo
   corrente sopra e quello vecchio sotto, e la colonna li rovescia. */
.tinv-wishlist.ad-wishlist .ad-wishlist__price {
	color: var(--ad-blue-700);
	display: flex;
	flex-direction: column-reverse;
	font-family: var(--ad-font-heading);
	font-size: 17px;
	font-weight: 700;
	gap: 5px;
}

.tinv-wishlist.ad-wishlist .ad-wishlist__price ins {
	background: none;
	color: var(--ad-blue-700);
	text-decoration: none;
}

.tinv-wishlist.ad-wishlist .ad-wishlist__price del {
	color: var(--ad-text-faint);
	font-family: var(--ad-font-body);
	font-size: var(--ad-fs-3xs);
	font-weight: 400;
	opacity: 1;
}

.tinv-wishlist.ad-wishlist .product-stock .ad-stock { font-size: var(--ad-fs-3xs); }

.tinv-wishlist.ad-wishlist .product-date {
	color: var(--ad-text-faint-2);
	font-size: var(--ad-fs-2xs);
}

.ad-wishlist__actions {
	align-items: center;
	display: flex;
	gap: var(--ad-gap-xs);
	justify-content: flex-end;
}

.tinv-wishlist.ad-wishlist .product-action .ad-wishlist__cart {
	font-size: var(--ad-fs-3xs);
	padding: 13px 16px;
	white-space: nowrap;
}

.tinv-wishlist.ad-wishlist .tinvwl-table-manage-list .product-action .ad-wishlist__remove {
	align-items: center;
	background: none;
	border: 1px solid var(--ad-border-input);
	border-radius: var(--ad-radius-sm);
	color: var(--ad-text-faint-2);
	cursor: pointer;
	display: flex;
	flex: none;
	font-size: var(--ad-fs-sm);
	height: 38px;
	justify-content: center;
	padding: 0;
	transition: border-color 0.15s ease, color 0.15s ease;
	width: 38px;
}

.tinv-wishlist.ad-wishlist .tinvwl-table-manage-list .product-action .ad-wishlist__remove:hover {
	border-color: var(--ad-coral);
	color: var(--ad-coral);
}

/* Azioni di gruppo ------------------------------------------------------ */

.tinv-wishlist.ad-wishlist .ad-wishlist__table tfoot td {
	border: 0;
	padding: var(--ad-gap-xl) 0 0;
}

.ad-wishlist__bulk {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: var(--ad-gap-xl);
	justify-content: space-between;
}

.ad-wishlist__bulk .tinvwl-to-left,
.ad-wishlist__bulk .tinvwl-input-group {
	align-items: center;
	display: flex;
	gap: 10px;
}

.tinv-wishlist.ad-wishlist .ad-wishlist__select {
	background-color: var(--ad-surface-raised);
	border: 1px solid var(--ad-border-input);
	border-radius: var(--ad-radius-sm);
	color: var(--ad-text-body);
	font-family: var(--ad-font-body);
	font-size: var(--ad-fs-xs);
	height: auto;
	padding: 13px 16px;
	width: auto;
}

/* "Applica" è secondario, "Aggiungi tutto al carrello" è l'azione della
   colonna: nel design il primo è in filo, il secondo pieno blu. */
.tinv-wishlist.ad-wishlist .ad-wishlist__bulk button[name="tinvwl-action-product_apply"] {
	background: none;
	border: 1.5px solid var(--ad-blue-700);
	border-radius: var(--ad-radius-sm);
	color: var(--ad-blue-700);
	cursor: pointer;
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-3xs);
	font-weight: 700;
	letter-spacing: var(--ad-ls-button);
	padding: 12px 18px;
	text-transform: uppercase;
}

.tinv-wishlist.ad-wishlist .ad-wishlist__bulk button[name="tinvwl-action-product_apply"]:hover {
	background: var(--ad-blue-700);
	color: var(--ad-text-on-dark);
}

.tinv-wishlist.ad-wishlist .ad-wishlist__bulk button[name="tinvwl-action-product_all"] {
	background: var(--ad-blue-700);
	border: 0;
	border-radius: var(--ad-radius-sm);
	color: var(--ad-text-on-dark);
	cursor: pointer;
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-2xs);
	font-weight: 700;
	letter-spacing: var(--ad-ls-button);
	padding: 15px 24px;
	text-transform: uppercase;
}

.tinv-wishlist.ad-wishlist .ad-wishlist__bulk button[name="tinvwl-action-product_all"]:hover { background: var(--ad-blue-900); }

.ad-wishlist__empty-action { margin: var(--ad-gap-lg) 0 0; }

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

@media (max-width: 900px) {
	.ad-wishlist__card { padding: 22px 20px 20px; }

	.tinv-wishlist.ad-wishlist .ad-wishlist__table,
	.tinv-wishlist.ad-wishlist .ad-wishlist__table tbody,
	.tinv-wishlist.ad-wishlist .ad-wishlist__table tfoot,
	.tinv-wishlist.ad-wishlist .ad-wishlist__table tfoot tr,
	.tinv-wishlist.ad-wishlist .ad-wishlist__table tfoot td { display: block; width: auto; }

	.tinv-wishlist.ad-wishlist .ad-wishlist__table thead { display: none; }

	.tinv-wishlist.ad-wishlist .ad-wishlist__table tbody tr {
		border-bottom: 1px solid var(--ad-border-faint);
		display: grid;
		gap: var(--ad-gap-xs);
		grid-template-columns: 24px 1fr;
		padding: var(--ad-gap-md) 0;
	}

	.tinv-wishlist.ad-wishlist .ad-wishlist__table tbody td {
		border: 0;
		padding: 0;
	}

	.tinv-wishlist.ad-wishlist .ad-wishlist__table .product-cb { grid-row: span 5; width: auto; }

	.tinv-wishlist.ad-wishlist .ad-wishlist__table .product-price,
	.tinv-wishlist.ad-wishlist .ad-wishlist__table .product-stock,
	.tinv-wishlist.ad-wishlist .ad-wishlist__table .product-date,
	.tinv-wishlist.ad-wishlist .ad-wishlist__table .product-action { width: auto; }

	.tinv-wishlist.ad-wishlist .ad-wishlist__price { flex-direction: row-reverse; gap: var(--ad-gap-xs); justify-content: flex-start; }

	.ad-wishlist__actions { justify-content: flex-start; }

	.ad-wishlist__bulk { gap: var(--ad-gap-sm); }

}

/* Il footer del plugin arriva con float e larghezze in percentuale pensate
   per il suo layout: qui la riga è una flex, e le due metà tornano automatiche. */
.tinv-wishlist.ad-wishlist tfoot .tinvwl-to-left,
.tinv-wishlist.ad-wishlist tfoot .tinvwl-to-right {
	float: none;
	margin: 0;
	text-align: left;
	width: auto;
}

.tinv-wishlist.ad-wishlist tfoot .tinvwl-to-right > * { margin: 0; }

.tinv-wishlist.ad-wishlist .tinvwl-input-group-btn {
	display: inline-flex;
	width: auto;
}

.tinv-wishlist.ad-wishlist .tinvwl-to-left .tinvwl-input-group .form-control + .tinvwl-input-group-btn { padding-left: 0; }

/* Nessuna banda grigia dietro l'intestazione della tabella. */
.tinv-wishlist.ad-wishlist .ad-wishlist__table thead,
.tinv-wishlist.ad-wishlist .ad-wishlist__table tbody,
.tinv-wishlist.ad-wishlist .ad-wishlist__table tfoot,
.tinv-wishlist.ad-wishlist .ad-wishlist__table tr { background: none; }

/* ---------------------------------------------------------------------------
 * Dettaglio dell'ordine — /my-account/view-order/<id>/ e conferma d'ordine
 *
 * Non ha un'artboard propria: riusa la lingua del carrello e dell'elenco
 * ordini — riga leggera fra gli articoli, etichette in maiuscoletto, totali
 * allineati a destra. L'impianto lo dava il foglio di WooCommerce, che qui non
 * carichiamo (vedi inc/woocommerce.php), quindi va scritto per intero.
 * ------------------------------------------------------------------------ */

/* La riga di stato in cima: WooCommerce marca numero, data e stato con `mark`,
   che il browser evidenzia in giallo. Qui sono solo dati in evidenza. */
.woocommerce-account .woocommerce-MyAccount-content mark,
.woocommerce-order mark {
	background: none;
	color: var(--ad-blue-700);
	font-weight: 600;
}

.woocommerce-order-details,
.woocommerce-customer-details,
.woocommerce-order-downloads { margin: var(--ad-gap-xl) 0 0; }

.woocommerce-order-details__title,
.woocommerce-column__title,
.woocommerce-order-downloads__title {
	font-size: var(--ad-fs-lead);
	font-weight: 700;
	margin: 0 0 var(--ad-gap-md);
}

.woocommerce-table--order-details {
	border-collapse: collapse;
	font-size: var(--ad-fs-sm);
	width: 100%;
}

.woocommerce-table--order-details th,
.woocommerce-table--order-details td {
	background: none;
	border: 0;
	vertical-align: top;
}

.woocommerce-table--order-details thead th {
	color: var(--ad-text-faint-2);
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-4xs);
	font-weight: 600;
	letter-spacing: var(--ad-ls-caps);
	padding: 0 0 14px;
	text-transform: uppercase;
}

/* Il totale sta a destra, come nel riepilogo del carrello. */
.woocommerce-table--order-details th:last-child,
.woocommerce-table--order-details td:last-child {
	text-align: right;
	white-space: nowrap;
	width: 1%;
}

.woocommerce-table--order-details tbody td {
	border-top: 1px solid var(--ad-border-lightest);
	padding: 16px 0;
}

.woocommerce-table--order-details .product-name a {
	color: var(--ad-text);
	font-weight: 600;
}

.woocommerce-table--order-details .product-name a:hover { color: var(--ad-teal); }

.woocommerce-table--order-details .product-quantity {
	color: var(--ad-text-muted);
	font-weight: 400;
}

/* Varianti scelte: elenco senza punti, sotto il nome del prodotto. */
.woocommerce-table--order-details .wc-item-meta {
	color: var(--ad-text-muted);
	font-size: var(--ad-fs-3xs);
	list-style: none;
	margin: 6px 0 0;
	padding: 0;
}

.woocommerce-table--order-details .wc-item-meta li {
	align-items: baseline;
	display: flex;
	gap: 6px;
}

.woocommerce-table--order-details .wc-item-meta p { margin: 0; }

.woocommerce-table--order-details .wc-item-meta-label { font-weight: 500; }

/* Totali: stessa scala del riepilogo, con la riga finale in evidenza. */
.woocommerce-table--order-details tfoot th {
	color: var(--ad-text-muted);
	font-weight: 500;
	padding: 12px 0 0;
	text-align: left;
}

.woocommerce-table--order-details tfoot td {
	color: var(--ad-text);
	font-family: var(--ad-font-mono);
	padding: 12px 0 0;
}

.woocommerce-table--order-details tfoot tr:first-child th,
.woocommerce-table--order-details tfoot tr:first-child td {
	border-top: 1px solid var(--ad-border-lightest);
	padding-top: var(--ad-gap-md);
}

.woocommerce-table--order-details tfoot tr:last-child th,
.woocommerce-table--order-details tfoot tr:last-child td {
	border-top: 1px solid var(--ad-border-lightest);
	padding-top: var(--ad-gap-md);
}

.woocommerce-table--order-details tfoot .includes_tax {
	color: var(--ad-text-muted);
	display: block;
	font-family: var(--ad-font-body);
	font-size: var(--ad-fs-3xs);
}

/* Riga delle azioni: pagare è l'azione principale, annullare no. */
.woocommerce-table--order-details .order-actions-button + .order-actions-button { margin-left: var(--ad-gap-sm); }

.woocommerce-table--order-details .order-actions-button.cancel {
	background: transparent;
	border: 1px solid var(--ad-border-input);
	color: var(--ad-text-muted-2);
}

.woocommerce-table--order-details .order-actions-button.cancel:hover {
	background: transparent;
	border-color: var(--ad-blue-700);
	color: var(--ad-blue-700);
}

/* Indirizzi sotto l'ordine, affiancati come nella dashboard. */
.woocommerce-customer-details .woocommerce-columns--addresses {
	display: grid;
	gap: var(--ad-gap-xl);
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 782px) {
	.woocommerce-customer-details .woocommerce-columns--addresses { grid-template-columns: 1fr; }
}

.woocommerce-customer-details address {
	color: var(--ad-text-body);
	font-size: var(--ad-fs-sm);
	font-style: normal;
	line-height: var(--ad-lh-relaxed);
}

/* ---------------------------------------------------------------------------
 * Dati account — /my-account/edit-account/
 *
 * Due pezzi che WooCommerce lascia agli stili del tema e che, senza il suo
 * foglio, uscivano con il carattere sbagliato: il titoletto del gruppo
 * password (è una `legend`, che l'azzeramento riporta al carattere del corpo)
 * e la nota sotto "Nome visualizzato" (è un `em`, quindi in corsivo alla
 * misura del testo corrente).
 * ------------------------------------------------------------------------ */

.woocommerce-account .woocommerce-EditAccountForm fieldset {
	margin: var(--ad-gap-xl) 0 0;
	padding: 0;
}

.woocommerce-account .woocommerce-EditAccountForm legend {
	color: var(--ad-text);
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-lead);
	font-weight: 700;
	line-height: 1.2;
	margin-bottom: var(--ad-gap-md);
	padding: 0;
}

.woocommerce-account .woocommerce-EditAccountForm .form-row span em,
.woocommerce-account .woocommerce-EditAccountForm em {
	color: var(--ad-text-muted);
	display: block;
	font-size: var(--ad-fs-3xs);
	font-style: normal;
	line-height: var(--ad-lh-body);
	margin-top: 6px;
}

/* ---------------------------------------------------------------------------
 * Codice sconto al checkout
 *
 * È la stessa card del carrello, sotto il riepilogo: le regole del campo e del
 * bottone valgono per entrambe le pagine (vedi `.ad-coupon` più sopra). Qui
 * resta solo il modulo vuoto che le fa da destinatario, che non si deve vedere.
 * ------------------------------------------------------------------------ */

.ad-coupon-carrier { display: none; }

/* Nel carrello lo stacco dalla card sopra lo dà la colonna; al checkout la
   colonna non ha spaziatura fra i figli, quindi lo mette la card stessa. */
.woocommerce-checkout .ad-coupon { margin-top: 18px; }

/* ---------------------------------------------------------------------------
 * Sconto applicato
 *
 * Nell'artboard 4A è una riga verde nel riepilogo — "Sconto ABISSO20 · − € 141,00"
 * — e finora non aveva uno stile suo: usciva come una voce qualsiasi.
 * ------------------------------------------------------------------------ */

.woocommerce-cart .cart_totals table tr.cart-discount,
.woocommerce-cart .cart_totals table tr.cart-discount th,
.woocommerce-cart .cart_totals table tr.cart-discount td,
.woocommerce-checkout #order_review table.shop_table tr.cart-discount th,
.woocommerce-checkout #order_review table.shop_table tr.cart-discount td {
	color: var(--ad-in-stock);
}

/* Il collegamento per togliere il codice resta una nota, non un'azione in
   evidenza: chi lo cerca lo trova. */
.woocommerce-cart .cart_totals .woocommerce-remove-coupon,
.woocommerce-checkout #order_review .woocommerce-remove-coupon {
	color: var(--ad-text-muted);
	font-family: var(--ad-font-body);
	font-size: var(--ad-fs-4xs);
	font-weight: 400;
	margin-left: 6px;
	text-decoration: underline;
}

.woocommerce-cart .cart_totals .woocommerce-remove-coupon:hover,
.woocommerce-checkout #order_review .woocommerce-remove-coupon:hover { color: var(--ad-coral); }

/* ---------------------------------------------------------------------------
 * Avvisi in sovrimpressione — carrello e checkout
 *
 * WooCommerce li stampa in cima al contenuto, e un avviso che arriva sposta
 * tutta la pagina in basso: al checkout, dove si sta compilando un modulo, è
 * il momento peggiore per farlo. Qui prendono la forma del toast dei preferiti
 * (components.css) e stanno sopra la pagina, in basso a destra.
 *
 * Sono fuori dal flusso già da CSS, quindi non spostano niente nemmeno prima
 * che `assets/js/notices.js` giri; il JavaScript aggiunge solo la croce per
 * chiuderli e la sparizione da soli.
 * ------------------------------------------------------------------------ */

body.woocommerce-cart .woocommerce-notices-wrapper,
body.woocommerce-checkout .woocommerce-notices-wrapper {
	bottom: 24px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0;
	max-width: min(420px, calc(100vw - 48px));
	position: fixed;
	right: 24px;
	/* Sopra l'header appiccicato, che sta a 50. */
	z-index: 60;
}

body.woocommerce-cart .woocommerce-notices-wrapper > .woocommerce-message,
body.woocommerce-cart .woocommerce-notices-wrapper > .woocommerce-info,
body.woocommerce-cart .woocommerce-notices-wrapper > .woocommerce-error,
body.woocommerce-checkout .woocommerce-notices-wrapper > .woocommerce-message,
body.woocommerce-checkout .woocommerce-notices-wrapper > .woocommerce-info,
body.woocommerce-checkout .woocommerce-notices-wrapper > .woocommerce-error {
	align-items: flex-start;
	background: var(--ad-blue-700);
	border: 0;
	border-left: 3px solid var(--ad-teal);
	border-radius: var(--ad-radius-ms);
	box-shadow: 0 10px 26px rgba(6, 41, 60, 0.2);
	color: var(--ad-text-on-dark);
	display: flex;
	font-size: var(--ad-fs-2xs);
	gap: var(--ad-gap-md);
	line-height: var(--ad-lh-snug);
	list-style: none;
	margin: 0;
	padding: 16px 18px;
	transition: opacity 0.2s ease, transform 0.2s ease;
}

/* Il filo a sinistra dice di che avviso si tratta, come nella versione in
   flusso: verde è fatto, corallo è da rifare. */
body.woocommerce-cart .woocommerce-notices-wrapper > .woocommerce-message,
body.woocommerce-checkout .woocommerce-notices-wrapper > .woocommerce-message { border-left-color: var(--ad-in-stock); }

body.woocommerce-cart .woocommerce-notices-wrapper > .woocommerce-error,
body.woocommerce-checkout .woocommerce-notices-wrapper > .woocommerce-error { border-left-color: var(--ad-coral); }

body.woocommerce-cart .woocommerce-notices-wrapper li,
body.woocommerce-checkout .woocommerce-notices-wrapper li {
	flex: 1;
	list-style: none;
	margin: 0;
	min-width: 0;
	padding: 0;
}

body.woocommerce-cart .woocommerce-notices-wrapper a,
body.woocommerce-checkout .woocommerce-notices-wrapper a { color: var(--ad-teal); }

body.woocommerce-cart .woocommerce-notices-wrapper a:hover,
body.woocommerce-checkout .woocommerce-notices-wrapper a:hover { color: #fff; }

/* I bottoni che WooCommerce infila negli avvisi ("Visualizza carrello") sono
   collegamenti travestiti: qui tornano collegamenti. */
body.woocommerce-cart .woocommerce-notices-wrapper .button,
body.woocommerce-checkout .woocommerce-notices-wrapper .button {
	background: none;
	border: 0;
	color: var(--ad-teal);
	font-family: var(--ad-font-heading);
	font-size: var(--ad-fs-4xs);
	letter-spacing: var(--ad-ls-badge);
	padding: 0;
	white-space: nowrap;
}

body.woocommerce-cart .woocommerce-notices-wrapper .button:hover,
body.woocommerce-checkout .woocommerce-notices-wrapper .button:hover { background: none; color: #fff; }

/* WooCommerce sposta il focus sull'avviso, perché chi usa uno screen reader lo
   senta: l'anello va tenuto, ma quello turchese del sito su fondo scuro sembra
   un secondo stato d'errore. */
body.woocommerce-cart .woocommerce-notices-wrapper > *:focus-visible,
body.woocommerce-checkout .woocommerce-notices-wrapper > *:focus-visible {
	outline: 2px solid rgba(232, 220, 200, 0.5);
	outline-offset: 2px;
}

.ad-notice__close {
	background: none;
	border: 0;
	color: var(--ad-text-on-dark-4);
	cursor: pointer;
	flex: none;
	font-size: 18px;
	line-height: 1;
	padding: 0;
}

.ad-notice__close:hover { color: #fff; }

/* Uscita: la stessa del toast dei preferiti. */
body.woocommerce-cart .woocommerce-notices-wrapper > .is-leaving,
body.woocommerce-checkout .woocommerce-notices-wrapper > .is-leaving {
	opacity: 0;
	transform: translateY(8px);
}

@media (max-width: 640px) {
	body.woocommerce-cart .woocommerce-notices-wrapper,
	body.woocommerce-checkout .woocommerce-notices-wrapper {
		bottom: 16px;
		left: 16px;
		max-width: none;
		right: 16px;
	}
}