/* ==========================================================================
   IL SEGRETO DI SILVIA — CASSA (carrello + checkout) in stile "Aesop" SCURO
   Solo CSS. Markup = shortcode classici WooCommerce ([woocommerce_cart],
   [woocommerce_checkout]). Ancorato a body.isds-cassa-scura (vedi inc/cassa.php),
   cosi' lo scuro non tocca nessun'altra pagina.

   Token gia' definiti in custom.css (:root): --carta, --superficie, --inchiostro,
   --ossido, --raggio, --raggio-sm. Qui aggiungiamo solo i token "su scuro".
   ========================================================================== */

.isds-cassa-scura {
	/* Palette locale SCURA "Aesop" (inchiostro). Fondo pagina = --inchiostro,
	   IDENTICO al footer -> cassa e footer si fondono nel nero (richiesta cliente).
	   ECCEZIONE CRITICA piu' in basso (sez. 5.5): il box pagamento (#payment) resta
	   CHIARO, cosi' gli iframe carta Stripe/PayPal restano leggibili (no patina lilla). */
	--cassa-bg:        var(--inchiostro);          /* fondo pagina inchiostro (= footer) */
	--cassa-card:      #2E2C29;                    /* pannelli: inchiostro leggermente sollevato */
	--cassa-card-2:    #38352F;                    /* focus / stato attivo */
	--cassa-testo:     var(--carta);               /* testo primario carta */
	--cassa-testo-2:   rgba(241, 239, 230, 0.62);  /* secondario / placeholder */
	--cassa-testo-3:   rgba(241, 239, 230, 0.40);  /* terziario / hint */
	--cassa-linea:     rgba(241, 239, 230, 0.16);  /* hairline su scuro */
	--cassa-linea-2:   rgba(241, 239, 230, 0.32);  /* hairline marcata (focus/hover) */
	--cassa-accento:   var(--ossido);              /* ossido: solo focus/dettaglio */
}

/* --------------------------------------------------------------------------
   0. FONDO SCURO FULL-WIDTH — neutralizza i container chiari di GeneratePress
   GP usa "separate-containers": .inside-article ha sfondo var(--base-3) bianco.
   Spegniamo l'effetto card-bianca e stendiamo l'inchiostro sotto tutto il
   contenuto, da bordo a bordo, lasciando header (chiaro) e footer (gia' scuro).
   -------------------------------------------------------------------------- */
.isds-cassa-scura .site-content,
.isds-cassa-scura .content-area,
.isds-cassa-scura #primary,
.isds-cassa-scura .site-main,
.isds-cassa-scura #main {
	background-color: var(--cassa-bg);
}

.isds-cassa-scura .inside-article {
	background-color: transparent;
	box-shadow: none;
}

/* Estensione full-width: il fondo scuro copre l'intera fascia sotto l'header.
   .site-content e' il contenitore largo; usiamo un pseudo per dipingere oltre
   i margini del container senza toccare il markup. */
.isds-cassa-scura .site-content {
	position: relative;
}

/* Colore testo di base dentro l'area cassa */
.isds-cassa-scura .site-main,
.isds-cassa-scura .entry-content,
.isds-cassa-scura .woocommerce {
	color: var(--cassa-testo);
}

/* Larghezza leggibile e respiro: contenuto incolonnato e centrato */
.isds-cassa-scura .inside-article {
	padding: clamp(28px, 5vw, 64px) clamp(20px, 5vw, 56px) clamp(48px, 6vw, 80px);
}

/* --------------------------------------------------------------------------
   1. TITOLO PAGINA — "Carrello" / "Pagamento"
   -------------------------------------------------------------------------- */
.isds-cassa-scura .entry-header {
	border: 0;
	padding: 0;
	margin: 0 0 clamp(28px, 4vw, 48px);
}
.isds-cassa-scura .entry-title {
	color: var(--cassa-testo);
	font-family: 'Hanken Grotesk', sans-serif;
	font-weight: 500;
	font-size: clamp(2rem, 4.5vw, 3.1rem);
	letter-spacing: -0.01em;
	line-height: 1.05;
	margin: 0;
}

/* Titoli interni di sezione (Totale carrello, Dettagli di fatturazione, ecc.) */
.isds-cassa-scura .woocommerce h2,
.isds-cassa-scura .woocommerce h3,
.isds-cassa-scura #order_review_heading {
	color: var(--cassa-testo);
	font-family: 'Hanken Grotesk', sans-serif;
	font-weight: 500;
	letter-spacing: -0.005em;
}
.isds-cassa-scura .woocommerce h3 {
	font-size: 1.15rem;
	margin: 0 0 1.1rem;
}

/* Link generici dentro l'area cassa: color carta, sottolineatura tenue */
.isds-cassa-scura .woocommerce a {
	color: var(--cassa-testo);
	text-decoration: underline;
	text-decoration-color: var(--cassa-linea-2);
	text-underline-offset: 3px;
	transition: text-decoration-color .2s ease, opacity .2s ease;
}
.isds-cassa-scura .woocommerce a:hover,
.isds-cassa-scura .woocommerce a:focus {
	color: var(--cassa-testo);
	text-decoration-color: var(--cassa-testo);
}

/* --------------------------------------------------------------------------
   2. NOTICE WOOCOMMERCE su scuro (message / info / error)
   Niente rosso acceso: l'errore resta sobrio con un filo d'ossido.
   -------------------------------------------------------------------------- */
.isds-cassa-scura .woocommerce-notices-wrapper:empty {
	display: none;
}
.isds-cassa-scura .woocommerce-message,
.isds-cassa-scura .woocommerce-info,
.isds-cassa-scura .woocommerce-error {
	background: var(--cassa-card);
	border: 1px solid var(--cassa-linea);
	border-left-width: 2px;
	border-radius: var(--raggio-sm);
	color: var(--cassa-testo);
	padding: 1rem 1.2rem;
	margin: 0 0 1.6rem;
	list-style: none;
	font-size: 0.95rem;
}
.isds-cassa-scura .woocommerce-message { border-left-color: var(--cassa-linea-2); }
.isds-cassa-scura .woocommerce-info    { border-left-color: var(--cassa-linea-2); }
.isds-cassa-scura .woocommerce-error   { border-left-color: var(--cassa-accento); }
.isds-cassa-scura .woocommerce-error li { list-style: none; margin: 0; }
.isds-cassa-scura .woocommerce-message::before,
.isds-cassa-scura .woocommerce-info::before,
.isds-cassa-scura .woocommerce-error::before {
	display: none; /* via le icone dingbat del tema padre */
}
.isds-cassa-scura .woocommerce-message .button,
.isds-cassa-scura .woocommerce-info .button {
	background: transparent;
	border: 1px solid var(--cassa-linea-2);
	color: var(--cassa-testo);
	padding: 0.4em 1em;
	border-radius: 999px;
	float: none;
	margin-left: 1rem;
}

/* ==========================================================================
   3. CARRELLO
   ========================================================================== */

/* --- Tabella carrello: header colonne come eyebrow, righe a hairline ----- */
.isds-cassa-scura .shop_table {
	background: transparent;
	border: 0;
	border-collapse: collapse;
	width: 100%;
	margin: 0 0 2rem;
}
.isds-cassa-scura table.cart thead th {
	background: transparent;
	border: 0;
	border-bottom: 1px solid var(--cassa-linea);
	color: var(--cassa-testo-2);
	font-family: 'Hanken Grotesk', sans-serif;
	font-weight: 500;
	font-size: 12.5px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-align: left;
	padding: 0 0 0.9rem;
}
.isds-cassa-scura table.cart tbody td,
.isds-cassa-scura table.cart tbody th {
	background: transparent;
	border: 0;
	border-bottom: 1px solid var(--cassa-linea);
	color: var(--cassa-testo);
	padding: 1.4rem 0.6rem;
	vertical-align: middle;
}
.isds-cassa-scura table.cart tbody td:first-child,
.isds-cassa-scura table.cart tbody th:first-child { padding-left: 0; }
.isds-cassa-scura table.cart tbody td:last-child  { padding-right: 0; }

/* Foto prodotto: su superficie chiara con raggio (come da brief) */
.isds-cassa-scura td.product-thumbnail img {
	width: 84px;
	height: 84px;
	object-fit: cover;
	border-radius: var(--raggio-sm);
	background: var(--foto-bg);
	display: block;
}
.isds-cassa-scura td.product-thumbnail { width: 110px; }

/* Nome, prezzo, subtotale */
.isds-cassa-scura td.product-name a {
	color: var(--cassa-testo);
	text-decoration: none;
	font-weight: 500;
	font-size: 1.02rem;
}
.isds-cassa-scura td.product-name a:hover { text-decoration: underline; text-decoration-color: var(--cassa-linea-2); }
.isds-cassa-scura td.product-price,
.isds-cassa-scura td.product-subtotal {
	color: var(--cassa-testo);
	white-space: nowrap;
}
.isds-cassa-scura td.product-subtotal { font-weight: 500; }
.isds-cassa-scura .woocommerce-Price-amount { color: inherit; }
.isds-cassa-scura .woocommerce-Price-currencySymbol { opacity: 0.7; }

/* Link "rimuovi" (la x) sobrio e tondo */
.isds-cassa-scura td.product-remove a.remove {
	color: var(--cassa-testo-3) !important;
	font-size: 1.4rem;
	line-height: 1;
	width: 1.5em;
	height: 1.5em;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 999px;
	background: transparent !important;
	text-decoration: none;
	transition: color .2s ease, background .2s ease;
}
.isds-cassa-scura td.product-remove a.remove:hover {
	color: var(--cassa-testo) !important;
	background: var(--cassa-card) !important;
}

/* --- Input quantita': stepper number elegante su scuro ------------------- */
.isds-cassa-scura .quantity .qty,
.isds-cassa-scura input.qty {
	background: var(--cassa-card);
	border: 1px solid var(--cassa-linea);
	border-radius: 999px;
	color: var(--cassa-testo);
	font-family: 'Hanken Grotesk', sans-serif;
	font-size: 0.95rem;
	width: 4.6em;
	padding: 0.55em 0.7em;
	text-align: center;
	-moz-appearance: textfield;
	transition: border-color .2s ease;
}
.isds-cassa-scura .quantity .qty:focus,
.isds-cassa-scura input.qty:focus {
	outline: none;
	border-color: var(--cassa-accento);
}

/* --- Riga azioni / coupon ----------------------------------------------- */
.isds-cassa-scura td.actions {
	padding: 1.6rem 0 0.5rem;
	border: 0;
}
.isds-cassa-scura td.actions .coupon {
	display: flex;
	gap: 0.6rem;
	align-items: center;
	flex-wrap: wrap;
	float: none;
	margin: 0 0 1.2rem;
}
/* (etichetta "Applicare un codice promozionale" rimossa su richiesta: era
   ridondante col bottone "Applica codice promozionale" sottostante.) */
.isds-cassa-scura td.actions .coupon #coupon_code,
.isds-cassa-scura td.actions .coupon .input-text {
	background: var(--cassa-card-2);
	border: 1px solid var(--cassa-linea-2);
	border-radius: 999px;
	color: var(--cassa-testo);
	padding: 0.7em 1.1em;
	min-width: 16rem;
	flex: 1 1 16rem;
	max-width: 22rem;
}
.isds-cassa-scura td.actions .coupon #coupon_code::placeholder {
	color: var(--cassa-testo-2);
}
.isds-cassa-scura td.actions .coupon #coupon_code:focus {
	outline: none;
	border-color: var(--cassa-accento);
}

/* Bottone "Applica codice promozionale": pillola fantasma su scuro */
.isds-cassa-scura td.actions .coupon button[name="apply_coupon"],
.isds-cassa-scura td.actions button[name="update_cart"] {
	background: var(--cassa-card-2);
	border: 1px solid var(--cassa-linea-2);
	color: var(--cassa-testo);
	border-radius: 999px;
	padding: 0.7em 1.6em;
	font-family: 'Hanken Grotesk', sans-serif;
	font-weight: 500;
	letter-spacing: 0.01em;
	cursor: pointer;
	transition: background .2s ease, border-color .2s ease;
}
.isds-cassa-scura td.actions .coupon button[name="apply_coupon"]:hover,
.isds-cassa-scura td.actions button[name="update_cart"]:hover {
	background: var(--cassa-card);
	border-color: var(--cassa-testo-2);
	color: var(--cassa-testo);
}
/* "Aggiorna carrello" a destra, defilato */
.isds-cassa-scura td.actions button[name="update_cart"] {
	float: right;
}

/* --- cart-collaterals: cross-sells + totali ----------------------------- */
.isds-cassa-scura .cart-collaterals {
	display: flex;
	flex-wrap: wrap;
	gap: clamp(24px, 4vw, 56px);
	align-items: flex-start;
	width: 100%;
}
.isds-cassa-scura .cart-collaterals .cross-sells {
	flex: 1 1 320px;
	width: auto;
	float: none;
}
.isds-cassa-scura .cart-collaterals .cart_totals {
	flex: 1 1 340px;
	width: auto;
	float: none;
	max-width: 480px;
	margin-left: auto;
}

/* Cross-sells: griglia di card prodotto CHIARE su fondo scuro */
.isds-cassa-scura .cross-sells h2 {
	font-size: 1.1rem;
	margin-bottom: 1.2rem;
}
.isds-cassa-scura .cross-sells ul.products {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.2rem;
	margin: 0;
	padding: 0;
}
.isds-cassa-scura .cross-sells ul.products li.product {
	width: auto !important;
	margin: 0 !important;
	float: none !important;
	list-style: none;
	/* padding e text-align tolti: ereditano lo stile card prodotto globale
	   (padding 14px + testo centrato) -> coerenti col resto del sito. */
}
.isds-cassa-scura .cross-sells ul.products li.product img {
	border-radius: var(--raggio-sm);
	background: var(--foto-bg);
	margin: 0 0 0.7rem;
}
/* Le card cross-sell restano CHIARE come ogni card prodotto (custom.css:
   sfondo --superficie + testo inchiostro). NON applichiamo i colori del tema
   scuro qui: sarebbero chiaro-su-chiaro (sbiaditi) e il bottone "Aggiungi al
   carrello" diventava NERO in hover. Teniamo solo le dimensioni; il colore lo
   dà lo stile prodotto globale (testo scuro su card chiara = leggibile). */
.isds-cassa-scura .cross-sells .woocommerce-loop-product__title {
	font-size: 0.95rem;
	font-weight: 500;
	padding: 0;
}
.isds-cassa-scura .cross-sells ul.products li.product .price {
	font-size: 0.95rem;
}
.isds-cassa-scura .cross-sells ul.products li.product .button.add_to_cart_button {
	font-size: 0.85rem;
	padding: 0.5em 1.2em;
	margin-top: 0.5rem;
}

/* --- Totale carrello ----------------------------------------------------- */
.isds-cassa-scura .cart_totals h2 {
	font-size: 12.5px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--cassa-testo-2);
	font-weight: 500;
	margin: 0 0 1rem;
}
.isds-cassa-scura .cart_totals table.shop_table {
	margin: 0;
}
.isds-cassa-scura .cart_totals table th,
.isds-cassa-scura .cart_totals table td {
	background: transparent;
	border: 0;
	border-bottom: 1px solid var(--cassa-linea);
	color: var(--cassa-testo);
	padding: 1rem 0;
	text-align: left;
	font-weight: 400;
}
.isds-cassa-scura .cart_totals table th { color: var(--cassa-testo-2); font-weight: 400; }
.isds-cassa-scura .cart_totals table td { text-align: right; }

/* Subtotale prominente */
.isds-cassa-scura .cart_totals tr.cart-subtotal th,
.isds-cassa-scura .cart_totals tr.cart-subtotal td {
	font-size: 1.05rem;
	color: var(--cassa-testo);
}
/* Totale finale: enfasi */
.isds-cassa-scura .cart_totals tr.order-total th,
.isds-cassa-scura .cart_totals tr.order-total td {
	font-size: 1.3rem;
	font-weight: 500;
	color: var(--cassa-testo);
	border-bottom: 0;
	padding-top: 1.2rem;
}
.isds-cassa-scura .cart_totals tr.order-total strong { font-weight: 500; }

/* Metodi di spedizione + calcolatore */
.isds-cassa-scura .woocommerce-shipping-methods {
	list-style: none;
	margin: 0;
	padding: 0;
}
.isds-cassa-scura .woocommerce-shipping-methods li {
	margin: 0 0 0.4rem;
	display: flex;
	align-items: baseline;
	gap: 0.5rem;
}
.isds-cassa-scura .woocommerce-shipping-methods label { color: var(--cassa-testo); }
.isds-cassa-scura .woocommerce-shipping-destination,
.isds-cassa-scura .woocommerce-shipping-destination strong {
	color: var(--cassa-testo-2);
	font-size: 0.9rem;
}
.isds-cassa-scura .shipping-calculator-button {
	color: var(--cassa-testo-2);
	font-size: 0.9rem;
}

/* "Spedizione a <citta'>" nascosto sul carrello: la spedizione e' a tariffa
   unica nazionale e l'indirizzo si inserisce alla cassa. Toglie il confondente
   "Spedizione a Barletta" (e' l'indirizzo BASE del negozio, mostrato a tutti). */
.isds-cassa-scura .woocommerce-shipping-destination { display: none; }

/* --- "Procedi con l'ordine": rettangolo scuro ampio, testo carta (Aesop) - */
.isds-cassa-scura .wc-proceed-to-checkout {
	padding: 1.6rem 0 0;
}
.isds-cassa-scura .wc-proceed-to-checkout a.checkout-button {
	display: block;
	width: 100%;
	background: var(--inchiostro);
	color: var(--carta);
	border: 0;
	border-radius: var(--raggio-sm);
	padding: 1.15em 1.5em;
	text-align: center;
	font-family: 'Hanken Grotesk', sans-serif;
	font-weight: 600;
	font-size: 1.05rem;
	letter-spacing: 0.01em;
	text-decoration: none;
	transition: opacity .2s ease;
	margin: 0;
}
.isds-cassa-scura .wc-proceed-to-checkout a.checkout-button:hover,
.isds-cassa-scura .wc-proceed-to-checkout a.checkout-button:focus {
	opacity: 0.9;
	color: var(--carta);
}

/* Carrello vuoto */
.isds-cassa-scura .cart-empty,
.isds-cassa-scura .wc-empty-cart-message {
	color: var(--cassa-testo);
	font-size: 1.1rem;
}
.isds-cassa-scura .return-to-shop .button {
	display: inline-block;
	background: var(--inchiostro);
	color: var(--carta);
	border-radius: var(--raggio-sm);
	padding: 0.9em 1.6em;
	text-decoration: none;
	font-weight: 600;
}

/* ==========================================================================
   4. CHECKOUT
   ========================================================================== */

/* Link "Modifica il carrello" iniettato (modulo trust-badges/store-ux) */
.isds-cassa-scura .isds-checkout-editcart {
	margin: 0 0 1.4rem;
}
.isds-cassa-scura .isds-checkout-editcart__btn {
	background: transparent;
	border: 0;
	color: var(--cassa-testo-2);
	font-family: 'Hanken Grotesk', sans-serif;
	font-size: 0.9rem;
	letter-spacing: 0.02em;
	padding: 0;
	cursor: pointer;
	text-decoration: underline;
	text-decoration-color: var(--cassa-linea-2);
	text-underline-offset: 3px;
	transition: color .2s ease;
}
.isds-cassa-scura .isds-checkout-editcart__btn:hover {
	color: var(--cassa-testo);
}

/* Toggle coupon "Hai un codice promozionale?" */
.isds-cassa-scura .woocommerce-form-coupon-toggle .woocommerce-info {
	background: transparent;
	border: 1px dashed var(--cassa-linea);
	border-left-width: 1px;
	color: var(--cassa-testo-2);
}
.isds-cassa-scura .checkout_coupon {
	background: var(--cassa-card);
	border: 1px solid var(--cassa-linea);
	border-radius: var(--raggio);
	padding: 1.4rem;
	margin: 0 0 1.6rem;
}
.isds-cassa-scura .checkout_coupon .button {
	background: var(--inchiostro);
	color: var(--carta);
	border: 0;
	border-radius: 999px;
	padding: 0.7em 1.6em;
	font-weight: 600;
}

/* --- Due colonne dati cliente ------------------------------------------- */
.isds-cassa-scura #customer_details.col2-set {
	display: flex;
	flex-wrap: wrap;
	gap: clamp(24px, 4vw, 56px);
	margin: 0 0 2.4rem;
}
.isds-cassa-scura #customer_details .col-1,
.isds-cassa-scura #customer_details .col-2 {
	flex: 1 1 320px;
	width: auto;
	float: none;
	max-width: none;
}

/* --- Campi form: input/select/textarea su scuro ------------------------- */
.isds-cassa-scura .form-row label,
.isds-cassa-scura .woocommerce-billing-fields label,
.isds-cassa-scura .woocommerce-shipping-fields label,
.isds-cassa-scura .woocommerce-additional-fields label {
	color: var(--cassa-testo);
	font-size: 0.85rem;
	font-weight: 500;
	letter-spacing: 0.01em;
	display: block;
	margin: 0 0 0.4rem;
}
.isds-cassa-scura .form-row .optional { color: var(--cassa-testo-3); font-weight: 400; }
.isds-cassa-scura .form-row .required { color: var(--cassa-testo-2); text-decoration: none; }
.isds-cassa-scura abbr.required {
	color: var(--cassa-testo-2);
	border: 0;
	text-decoration: none;
}

.isds-cassa-scura .form-row input.input-text,
.isds-cassa-scura .form-row textarea,
.isds-cassa-scura .form-row select,
.isds-cassa-scura .woocommerce-input-wrapper input.input-text,
.isds-cassa-scura .woocommerce-input-wrapper textarea,
.isds-cassa-scura .woocommerce-input-wrapper select,
.isds-cassa-scura .select2-container .select2-selection,
.isds-cassa-scura #order_comments {
	background: var(--cassa-card);
	border: 1px solid var(--cassa-linea);
	border-radius: var(--raggio-sm);
	color: var(--cassa-testo);
	font-family: 'Hanken Grotesk', sans-serif;
	font-size: 1rem;
	padding: 0.85em 1em;
	width: 100%;
	line-height: 1.4;
	transition: border-color .2s ease, background .2s ease;
}
.isds-cassa-scura .form-row textarea,
.isds-cassa-scura #order_comments { min-height: 4.5em; resize: vertical; }

.isds-cassa-scura .form-row input.input-text::placeholder,
.isds-cassa-scura .form-row textarea::placeholder {
	color: var(--cassa-testo-3);
}

/* Focus: accento ossido sobrio */
.isds-cassa-scura .form-row input.input-text:focus,
.isds-cassa-scura .form-row textarea:focus,
.isds-cassa-scura .form-row select:focus,
.isds-cassa-scura #order_comments:focus {
	outline: none;
	border-color: var(--cassa-accento);
	background: var(--cassa-card-2);
}

/* Select native: freccia chiara su scuro */
.isds-cassa-scura .form-row select,
.isds-cassa-scura .woocommerce-input-wrapper select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23252422' stroke-width='1.4' d='M1 1.5L6 6.5L11 1.5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1em center;
	padding-right: 2.6em;
}

/* select2 (province): coerente con gli input */
.isds-cassa-scura .select2-container--default .select2-selection--single {
	height: auto;
	background: var(--cassa-card);
	border: 1px solid var(--cassa-linea);
	border-radius: var(--raggio-sm);
}
.isds-cassa-scura .select2-container--default .select2-selection--single .select2-selection__rendered {
	color: var(--cassa-testo);
	line-height: 1.6;
	padding: 0.85em 1em;
}
.isds-cassa-scura .select2-container--default .select2-selection--single .select2-selection__arrow { top: 0.7em; right: 0.6em; }
.isds-cassa-scura .select2-dropdown {
	background: var(--cassa-card-2);
	border: 1px solid var(--cassa-linea-2);
	color: var(--cassa-testo);
}
.isds-cassa-scura .select2-container--default .select2-results__option { color: var(--cassa-testo); }
.isds-cassa-scura .select2-container--default .select2-results__option--highlighted[aria-selected] {
	background: var(--cassa-accento);
	color: var(--carta);
}
.isds-cassa-scura .select2-search--dropdown .select2-search__field {
	background: var(--cassa-card);
	border: 1px solid var(--cassa-linea);
	color: var(--cassa-testo);
}

/* Coupon: campo codice promo VISIBILE SUBITO — niente "Fai clic qui" (un click
   in meno, alla Krug). Nascondiamo il toggle e mostriamo il form direttamente. */
.isds-cassa-scura .woocommerce-form-coupon-toggle { display: none !important; }
.isds-cassa-scura form.checkout_coupon { display: block !important; margin: 0 0 1.6rem; }

/* Validazione: niente rosso acceso, solo un filo d'ossido a sinistra */
.isds-cassa-scura .form-row.woocommerce-invalid input.input-text,
.isds-cassa-scura .form-row.woocommerce-invalid select {
	border-color: var(--cassa-accento);
}
.isds-cassa-scura .form-row.woocommerce-validated input.input-text {
	border-color: var(--cassa-linea-2);
}

/* Checkbox "Spedire a un indirizzo diverso?" e simili */
.isds-cassa-scura #ship-to-different-address label,
.isds-cassa-scura .woocommerce-form__label-for-checkbox {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	color: var(--cassa-testo);
	font-weight: 400;
	cursor: pointer;
}
.isds-cassa-scura input[type="checkbox"],
.isds-cassa-scura input[type="radio"] {
	accent-color: var(--cassa-accento);
	width: 1.05em;
	height: 1.05em;
	margin-top: 0.15em;
	flex: 0 0 auto;
}

/* --- Riepilogo ordine (#order_review) ----------------------------------- */
.isds-cassa-scura #order_review_heading {
	font-size: 12.5px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--cassa-testo-2);
	font-weight: 500;
	margin: 0 0 1.2rem;
}
.isds-cassa-scura #order_review {
	background: var(--cassa-card);
	border: 1px solid var(--cassa-linea);
	border-radius: var(--raggio);
	padding: clamp(20px, 3vw, 32px);
}
.isds-cassa-scura #order_review .shop_table {
	margin: 0 0 1.4rem;
}
.isds-cassa-scura #order_review .shop_table th,
.isds-cassa-scura #order_review .shop_table td {
	background: transparent;
	border: 0;
	border-bottom: 1px solid var(--cassa-linea);
	color: var(--cassa-testo);
	padding: 0.85rem 0;
	text-align: left;
}
.isds-cassa-scura #order_review .shop_table thead th {
	color: var(--cassa-testo-2);
	font-size: 12.5px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	font-weight: 500;
}
.isds-cassa-scura #order_review .shop_table td.product-total,
.isds-cassa-scura #order_review .shop_table th + td { text-align: right; }
.isds-cassa-scura #order_review .product-name { color: var(--cassa-testo); }
.isds-cassa-scura #order_review .product-quantity { color: var(--cassa-testo-2); font-weight: 400; }
.isds-cassa-scura #order_review tfoot th { color: var(--cassa-testo-2); font-weight: 400; }
.isds-cassa-scura #order_review tfoot td { text-align: right; }
.isds-cassa-scura #order_review tfoot tr.order-total th,
.isds-cassa-scura #order_review tfoot tr.order-total td {
	font-size: 1.25rem;
	font-weight: 500;
	color: var(--cassa-testo);
	border-bottom: 0;
	padding-top: 1.1rem;
}
.isds-cassa-scura #order_review tfoot tr.order-total strong { font-weight: 500; }
.isds-cassa-scura #order_review .woocommerce-shipping-methods { margin: 0; }
.isds-cassa-scura #order_review .woocommerce-shipping-methods label { display: inline; }

/* --- Metodi di pagamento (#payment) ------------------------------------- */
.isds-cassa-scura #payment {
	background: transparent;
	border: 0;
	margin-top: 1.6rem;
}
.isds-cassa-scura #payment ul.payment_methods {
	list-style: none;
	margin: 0 0 1.4rem;
	padding: 0;
	border: 0;
}
.isds-cassa-scura #payment ul.payment_methods li.wc_payment_method {
	background: var(--cassa-card-2);
	border: 1px solid var(--cassa-linea);
	border-radius: var(--raggio-sm);
	margin: 0 0 0.7rem;
	padding: 1rem 1.1rem;
}
.isds-cassa-scura #payment ul.payment_methods li.wc_payment_method > label {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	color: var(--cassa-testo);
	font-weight: 500;
	margin: 0;
}
.isds-cassa-scura #payment ul.payment_methods li.wc_payment_method > label img {
	max-height: 24px;
	width: auto;
	vertical-align: middle;
}
.isds-cassa-scura #payment .payment_box {
	background: var(--cassa-card);
	border: 0;
	border-radius: var(--raggio-sm);
	color: var(--cassa-testo-2);
	margin: 0.9rem 0 0;
	padding: 1rem 1.1rem;
	font-size: 0.92rem;
}
.isds-cassa-scura #payment .payment_box::before { display: none; } /* via la freccetta del tema */
.isds-cassa-scura #payment .payment_box p { margin: 0 0 0.5rem; }
.isds-cassa-scura #payment .payment_box p:last-child { margin-bottom: 0; }
.isds-cassa-scura #payment .wc-saved-payment-methods label,
.isds-cassa-scura #payment .payment_box label { color: var(--cassa-testo); }

/* --- Privacy + Termini e condizioni ------------------------------------- */
.isds-cassa-scura .woocommerce-privacy-policy-text p,
.isds-cassa-scura .woocommerce-privacy-policy-text {
	color: var(--cassa-testo-2);
	font-size: 0.88rem;
}
.isds-cassa-scura .woocommerce-terms-and-conditions {
	background: var(--cassa-card);
	border: 1px solid var(--cassa-linea);
	border-radius: var(--raggio-sm);
	color: var(--cassa-testo-2);
	padding: 1rem 1.2rem;
}
.isds-cassa-scura .woocommerce-terms-and-conditions h2,
.isds-cassa-scura .woocommerce-terms-and-conditions h3 { color: var(--cassa-testo); }
.isds-cassa-scura .woocommerce-terms-and-conditions-checkbox-text {
	color: var(--cassa-testo);
	font-size: 0.92rem;
}
.isds-cassa-scura .validate-required label.checkbox,
.isds-cassa-scura p.form-row.validate-required .woocommerce-form__label-for-checkbox {
	align-items: flex-start;
}

/* --- Card fiducia iniettata (.isds-checkout-trust) ---------------------- */
.isds-cassa-scura .isds-checkout-trust,
.isds-cassa-scura .isds-checkout-trust-static {
	background: var(--cassa-card);
	border: 1px solid var(--cassa-linea);
	border-left: 2px solid var(--cassa-linea-2);
	border-radius: var(--raggio-sm);
	padding: 1rem 1.2rem;
	margin: 1.4rem 0;
}
.isds-cassa-scura .isds-checkout-trust p,
.isds-cassa-scura .isds-checkout-trust-static p {
	color: var(--cassa-testo-2);
	font-size: 0.92rem;
	margin: 0;
	line-height: 1.55;
}
.isds-cassa-scura .isds-checkout-trust strong,
.isds-cassa-scura .isds-checkout-trust-static strong {
	color: var(--cassa-testo);
	font-weight: 600;
}

/* --- Bottone "Effettua ordine": rettangolo scuro ampio, testo carta ----- */
.isds-cassa-scura #place_order,
.isds-cassa-scura .place-order .button {
	display: block;
	width: 100%;
	background: var(--inchiostro);
	color: var(--carta);
	border: 0;
	border-radius: var(--raggio-sm);
	padding: 1.15em 1.5em;
	font-family: 'Hanken Grotesk', sans-serif;
	font-weight: 600;
	font-size: 1.08rem;
	letter-spacing: 0.01em;
	cursor: pointer;
	margin: 1.4rem 0 0;
	transition: opacity .2s ease;
}
.isds-cassa-scura #place_order:hover,
.isds-cassa-scura #place_order:focus {
	opacity: 0.9;
	color: var(--carta);
}
.isds-cassa-scura .place-order { border: 0; padding: 0; }

/* Bottoni PayPal/Stripe espressi: lasciamo i loro stili, solo spaziatura */
.isds-cassa-scura .ppc-button-wrapper,
.isds-cassa-scura #wc-stripe-express-checkout-element { margin-top: 1rem; }

/* ==========================================================================
   5. BADGE PAGAMENTO tenui (se presenti nel contenuto cassa)
   NB: le .isds-paybadge vere vivono nel FOOTER (gia' scuro) e non vanno
   toccate qui. Questa regola copre eventuali badge dentro l'area contenuto.
   ========================================================================== */
.isds-cassa-scura .entry-content .isds-paybadge {
	display: inline-block;
	border: 1px solid var(--cassa-linea);
	border-radius: 6px;
	color: var(--cassa-testo-2);
	font-size: 0.7rem;
	letter-spacing: 0.08em;
	padding: 0.3em 0.6em;
	margin: 0 0.3em 0.3em 0;
	background: transparent;
}

/* ==========================================================================
   5.5 FIX TEMA SCURO — ciò che su fondo inchiostro sparirebbe, + "isola di
   luce" per il box pagamento (Stripe/PayPal leggibili). Regole DOPO le
   originali: a parità di specificità vincono per ordine sorgente.
   ========================================================================== */

/* CTA sul fondo SCURO (carrello: Procedi all'ordine / Torna allo shop): erano
   inchiostro su carta -> invertite a carta su inchiostro, sennò sparirebbero.
   NB: #place_order è ESCLUSO di proposito: sta sull'ISOLA BIANCA del pagamento
   (sotto) e quindi resta scuro (inchiostro su carta). */
.isds-cassa-scura .wc-proceed-to-checkout a.checkout-button,
.isds-cassa-scura .return-to-shop .button {
	background: var(--carta);
	color: var(--inchiostro);
}
.isds-cassa-scura .wc-proceed-to-checkout a.checkout-button:hover,
.isds-cassa-scura .wc-proceed-to-checkout a.checkout-button:focus {
	/* !important obbligatorio: GeneratePress mette `a.button:hover{color:#fff;
	   background:#3f4047}` su TUTTI i bottoni -> qui il bottone è chiaro, quindi
	   testo bianco = sparisce. Forziamo fondo chiaro + testo scuro, sempre leggibile. */
	background: var(--carta) !important;
	color: var(--inchiostro) !important;
	opacity: 1;
}

/* Bottone "Applica" del coupon checkout: pillola fantasma chiara (era inchiostro).
   Metriche verticali IDENTICHE all'input accanto (padding/font/line-height/bordo
   della regola .form-row input.input-text): erano 41px vs 51px e il bottone
   "galleggiava" disallineato rispetto alla scritta nel campo (fix 02/07/2026). */
.isds-cassa-scura .checkout_coupon .button {
	background: transparent;
	border: 1px solid var(--cassa-linea-2);
	color: var(--cassa-testo);
	padding: 0.85em 1.6em;
	font-size: 1rem;
	line-height: 1.4;
}
.isds-cassa-scura .checkout_coupon .button:hover {
	background: var(--cassa-card-2);
}

/* Freccia delle <select> (province): chiara, sennò invisibile su input scuro. */
.isds-cassa-scura .form-row select,
.isds-cassa-scura .woocommerce-input-wrapper select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23F1EFE6' stroke-width='1.4' d='M1 1.5L6 6.5L11 1.5'/%3E%3C/svg%3E");
}

/* --- AREA PAGAMENTO = ISOLA DI LUCE OPACA -------------------------------
   I widget PayPal "Payment options" (Carta/Klarna APM) hanno sfondi
   SEMI-TRASPARENTI: su fondo scuro diventano un "velo viola/lilla" e il testo
   sbiadisce. Rendendo TUTTO #payment un blocco OPACO chiaro, sotto i widget
   c'è sempre chiaro (mai il nero) -> niente velo lilla; testo forzato scuro
   -> sempre leggibile. È il vero motivo per cui prima il checkout fu schiarito,
   ma qui lo confiniamo al SOLO box pagamento (il resto resta scuro "Aesop"). */
.isds-cassa-scura #payment {
	background: var(--superficie);
	border-radius: var(--raggio);
	padding: clamp(14px, 2.2vw, 22px);
	color: var(--inchiostro);
}
.isds-cassa-scura #payment ul.payment_methods,
.isds-cassa-scura #payment ul.payment_methods li.wc_payment_method,
.isds-cassa-scura #payment div.payment_box {
	background: var(--superficie);
	border-color: rgba(37, 36, 34, 0.12);
}
.isds-cassa-scura #payment .payment_box {
	color: rgba(37, 36, 34, 0.78);
}
/* Tutto il testo dentro l'area pagamento: scuro su chiaro. !important + i
   selettori ad alta specificità dei label metodo (PayPal / Payment options),
   sennò la regola originale `li.wc_payment_method > label { color: --cassa-testo }`
   (token ora CHIARO) li lascia sbiaditi/invisibili sul box chiaro. */
.isds-cassa-scura #payment label,
.isds-cassa-scura #payment ul.payment_methods li.wc_payment_method > label,
.isds-cassa-scura #payment ul.payment_methods li.wc_payment_method > label *,
.isds-cassa-scura #payment p,
.isds-cassa-scura #payment span,
.isds-cassa-scura #payment strong,
.isds-cassa-scura #payment a,
.isds-cassa-scura #payment .payment_box,
.isds-cassa-scura #payment .payment_box * {
	color: var(--inchiostro) !important;
}
/* Widget funding PayPal (Carta/Klarna/APM): niente sfondo proprio -> mostrano
   il chiaro di #payment, mai il nero della pagina (addio velo lilla). */
.isds-cassa-scura #payment [class*="ppcp"],
.isds-cassa-scura #payment [class*="apms"],
.isds-cassa-scura #payment [class*="alternative-payment"],
.isds-cassa-scura #payment [id*="ppc-button"] {
	background-color: transparent !important;
}
/* Input nativi dentro il box pagamento: bianco pieno, testo scuro. */
.isds-cassa-scura #payment .payment_box input.input-text,
.isds-cassa-scura #payment .payment_box input[type="text"],
.isds-cassa-scura #payment .payment_box input[type="email"],
.isds-cassa-scura #payment .payment_box input[type="tel"] {
	background: #FFFFFF;
	border: 1px solid rgba(37, 36, 34, 0.18);
	color: var(--inchiostro);
}
/* "Effettua ordine" ora è sull'isola CHIARA -> bottone SCURO (inchiostro/carta). */
.isds-cassa-scura #place_order,
.isds-cassa-scura .place-order .button {
	background: var(--inchiostro);
	color: var(--carta);
}
.isds-cassa-scura #place_order:hover,
.isds-cassa-scura #place_order:focus {
	/* stesso motivo: GeneratePress (button:hover) lo riempirebbe di #3f4047/bianco.
	   Qui il bottone è scuro su isola chiara: forziamo fondo scuro + testo chiaro. */
	background: var(--inchiostro) !important;
	color: var(--carta) !important;
	opacity: 1;
}

/* Trust card ("Quello che ordini resta tra noi…") è DENTRO #payment (isola
   chiara) e il suo testo è forzato scuro dalle regole dell'isola: il fondo
   scuro `--cassa-card` la rendeva SCURO-SU-SCURO = illeggibile. Qui le diamo un
   fondo CHIARO (card nella card) così il testo scuro si legge. */
.isds-cassa-scura #payment .isds-checkout-trust,
.isds-cassa-scura #payment .isds-checkout-trust-static {
	background: var(--carta);
	border-color: rgba(37, 36, 34, 0.12);
	border-left-color: rgba(37, 36, 34, 0.30);
}

/* --- Gateway PayPal "Payment options" (Carta / Klarna APM) --------------
   PayPal lo stila di suo: cornice LAVANDA + testo GRIGIO CHIARO (in parte in
   iframe). Per la massima leggibilità possibile dal nostro lato:
   - azzeriamo lo sfondo di TUTTI i contenitori <div> del gateway -> la lavanda
     sparisce e mostra il chiaro di #payment (icone img/svg/span intatte);
   - forziamo il testo SCURO su tutto il gateway (il grigio sbiadito diventa
     leggibile, la "Carta"/"Klarna" blu diventano inchiostro).
   I CAMPI CARTA interni sono iframe PayPal: restano come li disegna PayPal. */
.isds-cassa-scura #payment li.payment_method_ppcp-gateway,
.isds-cassa-scura #payment li.payment_method_ppcp-gateway div {
	background-color: transparent !important;
	border-color: rgba(37, 36, 34, 0.10) !important;
}
.isds-cassa-scura #payment li.payment_method_ppcp-gateway,
.isds-cassa-scura #payment li.payment_method_ppcp-gateway *:not(input):not(iframe) {
	color: var(--inchiostro) !important;
}

/* ==========================================================================
   6. MOBILE — impilamento pulito; tabella carrello a card
   ========================================================================== */
@media (max-width: 768px) {

	.isds-cassa-scura .inside-article {
		padding: 28px 18px 48px;
	}

	/* Colonne -> stack */
	.isds-cassa-scura .cart-collaterals,
	.isds-cassa-scura #customer_details.col2-set {
		flex-direction: column;
		gap: 28px;
	}
	.isds-cassa-scura .cart-collaterals .cart_totals { margin-left: 0; max-width: none; }

	/* Tabella carrello -> card per riga (WooCommerce shop_table_responsive) */
	.isds-cassa-scura table.cart.shop_table_responsive thead { display: none; }
	.isds-cassa-scura table.cart.shop_table_responsive tr {
		display: block;
		border: 1px solid var(--cassa-linea);
		border-radius: var(--raggio-sm);
		padding: 1rem 1.1rem;
		margin: 0 0 1rem;
	}
	.isds-cassa-scura table.cart.shop_table_responsive td {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 1rem;
		border: 0;
		border-bottom: 1px solid var(--cassa-linea);
		padding: 0.7rem 0;
		text-align: right;
	}
	.isds-cassa-scura table.cart.shop_table_responsive td:last-child { border-bottom: 0; }
	.isds-cassa-scura table.cart.shop_table_responsive td::before {
		content: attr(data-title);
		color: var(--cassa-testo-2);
		font-size: 12.5px;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		font-weight: 500;
		text-align: left;
	}
	/* product-remove e thumbnail: senza etichetta, allineati */
	.isds-cassa-scura table.cart.shop_table_responsive td.product-remove { justify-content: flex-end; }
	.isds-cassa-scura table.cart.shop_table_responsive td.product-remove::before { content: ""; }
	.isds-cassa-scura table.cart.shop_table_responsive td.product-thumbnail::before { content: ""; }
	.isds-cassa-scura table.cart.shop_table_responsive td.product-thumbnail { justify-content: center; }
	.isds-cassa-scura td.product-thumbnail img { width: 96px; height: 96px; }

	/* Riga azioni (coupon + "Aggiorna carrello"): la regola generica delle card
	   responsive (`table.cart.shop_table_responsive td { display:flex }`) ha
	   specificita' MAGGIORE di `td.actions` e lo teneva in flex -> input e
	   bottoni diventavano "pillole" altissime e accavallate su mobile. Qui usiamo
	   lo stesso prefisso forte per vincere e impilare tutto pulito a piena larghezza. */
	.isds-cassa-scura table.cart.shop_table_responsive td.actions {
		display: block;
		padding: 1.2rem 0 0;
		text-align: left;
	}
	.isds-cassa-scura table.cart.shop_table_responsive td.actions::before {
		content: "";
		display: none;
	}
	.isds-cassa-scura td.actions .coupon { flex-direction: column; align-items: stretch; gap: 0.6rem; }
	/* In colonna il main-axis e' verticale: il `flex: 1 1 16rem` della regola
	   base diventerebbe ALTEZZA 16rem -> input gigante sopra il bottone
	   (visto da Nico, fix 02/07/2026). Basis auto = altezza naturale. */
	.isds-cassa-scura td.actions .coupon #coupon_code,
	.isds-cassa-scura td.actions .coupon .input-text { max-width: none; min-width: 0; width: 100%; flex: 0 0 auto; }
	.isds-cassa-scura td.actions .coupon button[name="apply_coupon"],
	.isds-cassa-scura td.actions button[name="update_cart"] { width: 100%; float: none; margin-top: 0; }

	/* Coupon del CHECKOUT: form-row-first/last di Woo restavano affiancati
	   e stretti (bottone a capo su 3 righe, disallineato dal campo — visto
	   da Nico, fix 02/07/2026). Su mobile: impilati a piena larghezza. */
	.isds-cassa-scura form.checkout_coupon .form-row-first,
	.isds-cassa-scura form.checkout_coupon .form-row-last {
		width: 100%;
		float: none;
	}
	.isds-cassa-scura form.checkout_coupon .button { width: 100%; }

	/* Cross-sells a una colonna su mobile */
	.isds-cassa-scura .cross-sells ul.products { grid-template-columns: 1fr; }
}