/*
 * DDG Preventivatori: UN solo foglio di stile per gli 8 preventivatori
 * (fase 4, mockup approvato il 29/09/2026: docs/mockup/).
 *
 * - Colori solo qui, come variabili CSS.
 * - Tutte le classi hanno il prefisso ddg-, e il contenitore
 *   .ddg-preventivatore isola gli stili dal tema WordPress.
 * - Sempre chiaro: color-scheme: light only e nessuna regola per il tema scuro; sulle pagine
 *   con uno shortcode anche il meta «color-scheme: light only» (08/10/2026).
 * - Mobile first: una colonna, poi più colonne da 640 px.
 * - Ogni dichiarazione ha !important (staging del 30/09/2026): i temi con
 *   regole più specifiche (es. ".entry-content h2" serif e grande) non
 *   devono cambiare font, dimensioni e margini degli elementi del widget.
 *   Tra regole !important vince la più specifica, e a parità l'ultima:
 *   il reset sta in cima, i componenti dopo.
 */

.ddg-preventivatore,
.ddg-guida-radice {
	/* Prima di tutto: nessuna regola del tema passa dentro. Le variabili
	   CSS non sono toccate da "all". La guida "Dove lo trovo?" sta in un
	   contenitore suo, appeso al <body> (.ddg-guida-radice), con gli stessi
	   colori e lo stesso isolamento. */
	all: initial !important;

	/* ---- Colori: l'unico punto da cambiare ---- */
	--ddg-accent: #C81F24;         /* bottoni, link, bordi attivi, icone */
	--ddg-accent-scuro: #A3181C;   /* hover dei bottoni */
	--ddg-sfondo: #FFFFFF;
	--ddg-barra: #100A06;          /* barre dei titoli delle sezioni */
	--ddg-barra-testo: #FFFFFF;
	--ddg-testo: #100A06;
	--ddg-testo-secondario: #5A534E;
	--ddg-avviso-sfondo: #FFF4E5;  /* avvisi «da controllare» (01/10/2026) */
	--ddg-avviso-testo: #7A4100;
	--ddg-avviso-bordo: #B26A00;
	--ddg-avviso-campo: #FFF8EC;   /* sfondo del campo da controllare */
	--ddg-errore: #C81F24;         /* errori che bloccano */
	--ddg-badge: #6B6B6B;          /* «dalla bolletta» */
	--ddg-badge-scuro: #3A3A3A;    /* «corretto a mano» */
	--ddg-bordo: #E3DEDA;
	--ddg-campo: #FFFFFF;
	--ddg-riquadro: #F7F5F3;       /* aiuti e riepiloghi, grigio caldo chiarissimo */
	--ddg-verde: #1E7A3C;          /* positivo: risparmio (barra e cifra) e riquadro promozioni e vantaggi (Diego, 19/10/2026) */
	--ddg-verde-chiaro: #EAF5EE;
	--ddg-neutro: #4A4440;         /* "in linea con il mercato": né verde né rosso */
	--ddg-neutro-chiaro: #F2F0EE;

	/* ---- Misure ---- */
	--ddg-raggio: 10px;
	--ddg-spazio: 16px;
	--ddg-font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

	color-scheme: light only !important;
	box-sizing: border-box !important;
	color: var(--ddg-testo) !important;
	font-family: var(--ddg-font) !important;
	font-size: 16px !important;
	line-height: 1.5 !important;
	-webkit-text-size-adjust: 100% !important;
}
.ddg-preventivatore {
	display: block !important;
	max-width: 960px !important;
	margin: 0 auto !important;
	background: var(--ddg-sfondo) !important;
}
.ddg-guida-radice { display: block !important; }
/* L'attributo hidden vince sempre, anche sul display del contenitore. */
.ddg-preventivatore[hidden],
.ddg-preventivatore [hidden],
.ddg-guida-radice [hidden] { display: none !important; }

.ddg-preventivatore *,
.ddg-preventivatore *::before,
.ddg-preventivatore *::after,
.ddg-guida-radice *,
.ddg-guida-radice *::before,
.ddg-guida-radice *::after {
	box-sizing: border-box !important;
	font-family: inherit !important;
	font-size: inherit !important;            /* il tema non cambia le dimensioni (es. p con font-size 19px) */
	font-weight: inherit !important;
	font-style: normal !important;
	line-height: inherit !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	text-shadow: none !important;
	text-decoration: none !important;
	color: inherit !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	float: none !important;
	height: auto !important;
	min-height: 0 !important;
}

/* ---- Intestazione: leggera, nessun box nero ---- */
.ddg-intestazione {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	padding: var(--ddg-spazio) 0 !important;
	border-bottom: 3px solid var(--ddg-accent) !important;
	margin-bottom: var(--ddg-spazio) !important;
}
.ddg-icona {
	flex: none !important;
	width: 36px !important;
	height: 36px !important;
	color: var(--ddg-accent) !important;
}
.ddg-titolo { font-size: 22px !important; font-weight: 700 !important; line-height: 1.2 !important; }
.ddg-sottotitolo { font-size: 14px !important; color: var(--ddg-testo-secondario) !important; }

/* ---- Segmento (richiesta di Diego dopo la 0.12.1): stessi colori, nessuna palette nuova ----
   PMI (.ddg--pmi, gas e luce, pubblico e completo): striscia sottile in alto,
   nota piccola con il link al domestico, icona con la valigetta. Domestico:
   solo la nota piccola con il link al PMI. */
/* ---- Avvisi, errori e badge (Diego, 01/10/2026), uguali nei 4 preventivatori ----
   - «Da controllare» (prezzo insolito, somma delle fasce, bolletta vecchia,
     consumo da confermare…): ambra, icona ⚠; il campo ha bordo ambra e sfondo chiaro.
   - Errori che bloccano (campo obbligatorio vuoto, formato non valido): rossi,
     in grassetto, icona ✕.
   - «dalla bolletta»: grigio neutro; «corretto a mano»: grigio scuro.
   Contrasto AA: #7A4100 su #FFF4E5 circa 8:1; #6B6B6B su bianco 5,3:1. */
.ddg-avviso-campo { margin: 6px 0 0 !important; padding: 8px 10px 8px 12px !important; border-radius: 6px !important; border-left: 4px solid var(--ddg-avviso-bordo) !important; background: var(--ddg-avviso-sfondo) !important; color: var(--ddg-avviso-testo) !important; font-size: 14px !important; font-weight: 600 !important; line-height: 1.4 !important; }
.ddg-avviso-campo::before, p.ddg-avviso::before, .ddg-avviso-titolo::before { content: "⚠\FE0E  " !important; font-weight: 700 !important; }
.ddg-avviso-campo[hidden] { display: none !important; }
.ddg-campo.ddg-campo-avviso input[type="text"], .ddg-campo.ddg-campo-avviso input[type="tel"] { border: 2px solid var(--ddg-avviso-bordo) !important; background: var(--ddg-avviso-campo) !important; }
/* Accesso come … · Esci (01/10/2026): in cima ai completi, mobile first. Su
   smartphone il nome va a capo se è lungo; «Esci» resta un bersaglio di 44 px. */
.ddg-account { display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: flex-end !important; gap: 0 6px !important; margin: 0 0 8px !important; font-size: 13px !important; line-height: 1.4 !important; color: var(--ddg-testo-secondario) !important; text-align: right !important; }
.ddg-account-nome { min-width: 0 !important; overflow-wrap: anywhere !important; }
.ddg-account-nome strong { color: var(--ddg-testo) !important; font-weight: 600 !important; }
.ddg-account-esci, .ddg-account-agenti, .ddg-esci { display: inline-flex !important; align-items: center !important; min-height: 44px !important; padding: 0 4px !important; color: var(--ddg-accent) !important; font-weight: 600 !important; text-decoration: underline !important; }
.ddg-account-esci:hover, .ddg-account-agenti:hover, .ddg-esci:hover { color: var(--ddg-accent-scuro) !important; }
@media (min-width: 640px) { .ddg-account-esci, .ddg-account-agenti { min-height: 0 !important; } }
.ddg-nota-segmento { margin: 0 0 4px !important; font-size: 13px !important; line-height: 1.4 !important; color: var(--ddg-testo-secondario) !important; }
.ddg--pmi .ddg-badge-pmi {
	display: block !important;
	margin: 0 0 6px !important;
	padding: 4px 8px !important;
	border-radius: 4px !important;
	background: var(--ddg-barra) !important;
	color: var(--ddg-barra-testo) !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	line-height: 1.35 !important;
	letter-spacing: .03em !important;
	text-transform: uppercase !important;
}
.ddg--pmi .ddg-intestazione { padding-top: 10px !important; }
.ddg--pmi .ddg-sottotitolo + .ddg-sottotitolo { margin-top: 2px !important; }
/* Smartphone stretti (360 px): la striscia resta su una riga; a 320 px va a capo, sempre bassa. */
@media (max-width: 380px) {
	.ddg--pmi .ddg-badge-pmi { font-size: 10.5px !important; letter-spacing: .02em !important; }
}

/* ---- Sezioni con barra del titolo ---- */
.ddg-sezione {
	border: 1px solid var(--ddg-bordo) !important;
	border-radius: var(--ddg-raggio) !important;
	overflow: hidden !important;
	margin-bottom: var(--ddg-spazio) !important;
	background: var(--ddg-sfondo) !important;
}
.ddg-sezione-titolo {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	background: var(--ddg-barra) !important;
	color: var(--ddg-barra-testo) !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	padding: 10px var(--ddg-spazio) !important;
}
.ddg-sezione-numero {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 24px !important;
	height: 24px !important;
	border-radius: 50% !important;
	background: var(--ddg-accent) !important;
	color: #FFFFFF !important;
	font-size: 13px !important;
}
.ddg-sezione-corpo { padding: var(--ddg-spazio) !important; }
.ddg-nota { font-size: 14px !important; color: var(--ddg-testo-secondario) !important; margin-bottom: 12px !important; }

/* ---- Campi ---- */
.ddg-campi { display: grid !important; gap: 14px !important; grid-template-columns: 1fr !important; }
.ddg-campo label { display: block !important; font-weight: 600 !important; font-size: 15px !important; margin-bottom: 6px !important; }
.ddg-obbligatorio { color: var(--ddg-accent) !important; }
.ddg-campo input[type="text"],
.ddg-campo input[type="tel"],
.ddg-campo select {
	width: 100% !important;
	min-height: 48px !important;              /* tocco comodo su smartphone */
	padding: 10px 12px !important;
	font-size: 17px !important;               /* niente zoom automatico su iOS */
	border: 1.5px solid var(--ddg-bordo) !important;
	border-radius: 8px !important;
	background: var(--ddg-campo) !important;
	color: var(--ddg-testo) !important;
}
.ddg-campo input[type="text"]:focus,
.ddg-campo input[type="tel"]:focus,
.ddg-campo select:focus {
	outline: none !important;
	border-color: var(--ddg-accent) !important;
	box-shadow: 0 0 0 3px rgba(200, 31, 36, .15) !important;
}
.ddg-campo-letto input[type="text"] { border-left: 4px solid var(--ddg-badge) !important; }
.ddg-etichetta-letto {
	display: inline-block !important;
	margin-left: 6px !important;
	padding: 1px 8px !important;
	border-radius: 999px !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	color: var(--ddg-badge) !important;
	border: 1px solid var(--ddg-badge) !important;
	background: #fff !important;
	vertical-align: middle !important;
}
.ddg-etichetta-letto.ddg-etichetta-corretto { color: var(--ddg-badge-scuro) !important; border-color: var(--ddg-badge-scuro) !important; }
.ddg-aiuto { margin-top: 6px !important; font-size: 14px !important; }
.ddg-aiuto summary { cursor: pointer !important; color: var(--ddg-accent) !important; font-weight: 600 !important; list-style: none !important; }
.ddg-aiuto summary::-webkit-details-marker { display: none !important; }
.ddg-aiuto summary::before { content: "? " !important; font-weight: 700 !important; }
.ddg-aiuto p {
	margin-top: 6px !important;
	padding: 10px 12px !important;
	background: var(--ddg-riquadro) !important;
	border-radius: 8px !important;
	color: var(--ddg-testo-secondario) !important;
}

/* ---- Consensi e caricamento ---- */
.ddg-consenso { display: flex !important; gap: 10px !important; align-items: flex-start !important; font-size: 15px !important; margin-bottom: 10px !important; }
.ddg-consenso input { flex: none !important; width: 22px !important; height: 22px !important; margin-top: 1px !important; accent-color: var(--ddg-accent) !important; }
/* Nuova pratica in admin (02/10/2026): forms.css di WordPress toglie l'aspetto nativo alle caselle. */
.ddg-consenso input[type="checkbox"] { -webkit-appearance: checkbox !important; appearance: auto !important; }
/* Fase B: «La tua offerta è a prezzo variabile?» (02/10/2026). */
.ddg-variabile { margin: 14px 0 6px !important; }
/* Campi luce sotto la griglia (potenza, tensione, fasce): stesso stacco della domanda sul variabile. */
.ddg-campo[data-campo="potenza"], .ddg-campo[data-campo="tensione"], .ddg-campo.ddg-fasce { margin-top: 14px !important; }
.ddg-facoltativo { font-weight: 400 !important; font-size: 14px !important; color: var(--ddg-testo-secondario) !important; }
.ddg-nota-campo { margin-top: 6px !important; font-size: 14px !important; color: var(--ddg-testo-secondario) !important; }
.ddg-campo-errore select { border: 2px solid var(--ddg-errore) !important; }
/* Intestatario: «La bolletta è intestata a te?» Sì / No (01/10/2026). */
.ddg-intestatario { margin: 6px 0 12px !important; }
.ddg-scelte { border: 0 !important; margin: 0 !important; padding: 0 !important; min-width: 0 !important; }
.ddg-scelte legend { padding: 0 !important; margin-bottom: 8px !important; font-weight: 700 !important; font-size: 16px !important; color: var(--ddg-testo) !important; }
/* Luce PMI (4.4): consumi per fascia F1/F2/F3. Su smartphone una fascia per
   riga (etichetta a sinistra, numeri interi leggibili), da 480 px tre affiancate. */
.ddg-fasce { border: 0 !important; margin: 0 !important; padding: 0 !important; min-width: 0 !important; }
.ddg-fasce legend { padding: 0 !important; margin-bottom: 8px !important; font-weight: 700 !important; font-size: 16px !important; color: var(--ddg-testo) !important; }
.ddg-fasce-campi { display: grid !important; grid-template-columns: 1fr !important; gap: 8px !important; }
.ddg-fasce .ddg-fascia { display: grid !important; grid-template-columns: 2.5em minmax(0, 1fr) !important; align-items: center !important; column-gap: 8px !important; margin: 0 !important; }
.ddg-fasce .ddg-fascia label { font-weight: 700 !important; margin: 0 !important; }
.ddg-fasce .ddg-fascia input { min-width: 0 !important; width: 100% !important; }
.ddg-fasce .ddg-fascia .ddg-errore-campo { grid-column: 1 / -1 !important; }
@media (min-width: 480px) {
	.ddg-fasce-campi { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
.ddg-campo .ddg-scelta { display: inline-flex !important; align-items: center !important; gap: 8px !important; min-height: 44px !important; padding: 8px 18px !important; margin: 0 8px 0 0 !important; border: 2px solid var(--ddg-bordo) !important; border-radius: 999px !important; cursor: pointer !important; font-size: 16px !important; font-weight: 600 !important; }
.ddg-campo .ddg-scelta input { width: 20px !important; height: 20px !important; margin: 0 !important; accent-color: var(--ddg-accent) !important; }
.ddg-campo .ddg-scelta:has(input:checked) { border-color: var(--ddg-accent) !important; background: #FDF1F1 !important; }
.ddg-campo-errore .ddg-scelta { border-color: var(--ddg-errore) !important; }
.ddg-intestatario-altro { margin-bottom: 12px !important; }
/* Compagnia della bolletta (10/10/2026): suggerimenti sotto la casella, mai l'elenco intero. */
.ddg-compagnia { position: relative !important; margin-bottom: 12px !important; }
.ddg-compagnie { list-style: none !important; margin: 4px 0 0 !important; padding: 4px !important; max-height: 264px !important; overflow-y: auto !important; border: 1px solid var(--ddg-bordo) !important; border-radius: 6px !important; background: var(--ddg-campo) !important; box-shadow: 0 6px 18px rgba(16, 10, 6, .12) !important; }
.ddg-compagnie[hidden] { display: none !important; }
.ddg-compagnie li { margin: 0 !important; padding: 11px 10px !important; border-radius: 4px !important; cursor: pointer !important; color: var(--ddg-testo) !important; font-size: 15px !important; line-height: 1.3 !important; }
.ddg-compagnie li:hover, .ddg-compagnie li.ddg-compagnie-attiva { background: var(--ddg-riquadro) !important; }
.ddg-compagnie li.ddg-compagnie-altra { color: var(--ddg-testo-secondario) !important; font-size: 14px !important; border-top: 1px solid var(--ddg-bordo) !important; margin-top: 4px !important; }
.ddg-caricamento {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	gap: 6px !important;
	text-align: center !important;
	padding: 22px var(--ddg-spazio) !important;
	border: 2px dashed var(--ddg-accent) !important;
	border-radius: var(--ddg-raggio) !important;
	background: var(--ddg-sfondo) !important;
	color: var(--ddg-testo) !important;
	cursor: pointer !important;
}
.ddg-caricamento svg { width: 32px !important; height: 32px !important; color: var(--ddg-accent) !important; }
.ddg-caricamento-titolo { font-weight: 700 !important; }
/* Nome del file scelto: va a capo anche senza spazi. */
.ddg-caricamento-titolo { max-width: 100% !important; overflow-wrap: anywhere !important; }
.ddg-caricamento-nota { font-size: 13px !important; color: var(--ddg-testo-secondario) !important; }

/* ---- Messaggi di stato ---- */
.ddg-stato { margin-top: 12px !important; padding: 10px 12px !important; border-radius: 8px !important; font-size: 15px !important; }
.ddg-stato-ok { background: var(--ddg-riquadro) !important; color: var(--ddg-testo) !important; }
.ddg-stato-errore { background: #FDF1F1 !important; color: var(--ddg-errore) !important; border-left: 4px solid var(--ddg-errore) !important; font-weight: 700 !important; }
.ddg-stato-errore::before { content: "✕  " !important; font-weight: 700 !important; }

/* ---- Bottoni e link ---- */
.ddg-bottone {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	text-align: center !important;
	gap: 8px !important;
	width: 100% !important;
	min-height: 50px !important;
	padding: 12px 20px !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: var(--ddg-accent) !important;
	color: #FFFFFF !important;
	font-size: 17px !important;
	font-weight: 700 !important;
	cursor: pointer !important;
	margin-top: var(--ddg-spazio) !important;
}
.ddg-bottone:hover { background: var(--ddg-accent-scuro) !important; }
.ddg-bottone-secondario { background: var(--ddg-sfondo) !important; color: var(--ddg-accent) !important; border: 2px solid var(--ddg-accent) !important; }
.ddg-bottone-secondario:hover { background: #FDF1F1 !important; }
.ddg-preventivatore a,
.ddg-guida-radice a { color: var(--ddg-accent) !important; font-weight: 600 !important; text-decoration: underline !important; }
.ddg-preventivatore a.ddg-bottone { color: #FFFFFF !important; text-decoration: none !important; }
.ddg-preventivatore a.ddg-bottone-secondario { color: var(--ddg-accent) !important; }
.ddg-bottone[disabled] { opacity: .6 !important; cursor: progress !important; }
.ddg-caricamento:focus-visible,
.ddg-bottone:focus-visible { outline: 3px solid rgba(200, 31, 36, .35) !important; outline-offset: 2px !important; }
.ddg-caricamento[aria-busy="true"] { opacity: .7 !important; cursor: progress !important; }

/* ---- Errori sui campi: il testo non numerico non diventa mai zero ---- */
.ddg-campo-errore input[type="text"], .ddg-campo-errore input[type="tel"] { border: 2px solid var(--ddg-errore) !important; background: #fff !important; }
.ddg-errore-campo { margin-top: 4px !important; font-size: 14px !important; font-weight: 700 !important; color: var(--ddg-errore) !important; }
.ddg-errore-campo:not(:empty)::before { content: "✕ " !important; }
/* Segnaposto sempre grigio chiaro: non deve sembrare un valore (staging del 01/10/2026). */
.ddg-preventivatore input::placeholder { color: #9A938E !important; opacity: 1 !important; font-style: normal !important; }

/* ---- Risultato del pubblico ---- */
.ddg-risultato { border-radius: var(--ddg-raggio) !important; padding: 18px var(--ddg-spazio) !important; text-align: center !important; }
.ddg-risparmio { background: var(--ddg-verde-chiaro) !important; border-top: 6px solid var(--ddg-verde) !important; }
.ddg-risparmio-etichetta { font-size: 15px !important; font-weight: 600 !important; color: var(--ddg-verde) !important; }
.ddg-risparmio-cifra { font-size: 40px !important; font-weight: 800 !important; line-height: 1.1 !important; color: var(--ddg-verde) !important; }
.ddg-risparmio-cifra small { font-size: 18px !important; font-weight: 700 !important; }
.ddg-risparmio-pct { font-weight: 700 !important; color: var(--ddg-verde) !important; }
.ddg-in-linea { background: var(--ddg-neutro-chiaro) !important; border-top: 6px solid var(--ddg-neutro) !important; color: var(--ddg-neutro) !important; }
.ddg-in-linea-frase { font-size: 22px !important; font-weight: 700 !important; color: var(--ddg-neutro) !important; }
.ddg-risultato-nota { margin-top: 8px !important; font-size: 14px !important; color: var(--ddg-testo-secondario) !important; }
/* Invito al completo (Diego, 07/10/2026): due pulsanti, rosso «Iscriviti gratis…» e bianco «accedi». */
.ddg-invito-completo { margin: var(--ddg-spazio) 0 0 !important; padding: 14px 16px !important; border: 1px solid var(--ddg-bordo) !important; border-radius: 12px !important; }
.ddg-invito-completo-testo { margin: 0 0 12px !important; font-size: 16px !important; line-height: 1.45 !important; }
.ddg-invito-completo .ddg-bottone { width: 100% !important; min-width: 0 !important; margin-top: 10px !important; }
.ddg-invito-completo .ddg-accesso-bottoni .ddg-bottone { margin-top: 0 !important; }
.ddg-invito-completo strong { font-weight: 700 !important; }
.ddg-invito-completo-nota { margin: 10px 0 0 !important; font-size: 14px !important; }
/* Con il risultato in vista c'è già l'invito del risultato: il riquadro si nasconde. */
.ddg-sezione[data-ddg="risultato"]:not([hidden]) ~ .ddg-invito-completo { display: none !important; }
.ddg-invito { margin-top: 16px !important; padding-top: 16px !important; border-top: 1px solid var(--ddg-bordo) !important; text-align: center !important; }
.ddg-invito-titolo { margin: 0 !important; font-size: 18px !important; font-weight: 700 !important; line-height: 1.3 !important; color: var(--ddg-testo) !important; }
.ddg-invito-pulsanti { display: flex !important; flex-wrap: wrap !important; justify-content: center !important; gap: 10px !important; margin-top: 12px !important; }
.ddg-invito-pulsanti .ddg-bottone { margin-top: 0 !important; width: 100% !important; min-width: 0 !important; }
.ddg-invito-nota { margin: 10px 0 0 !important; font-size: 14px !important; color: var(--ddg-testo-secondario) !important; }
@media (min-width: 640px) {
	.ddg-invito-pulsanti .ddg-bottone { width: auto !important; }
}

/* ---- Confronto del completo ---- */
.ddg-riepilogo { padding: 10px 12px !important; background: var(--ddg-riquadro) !important; border-radius: 8px !important; font-size: 15px !important; margin-bottom: 14px !important; }
.ddg-offerte { display: grid !important; gap: 14px !important; grid-template-columns: 1fr !important; }
.ddg-offerta { border: 1px solid var(--ddg-bordo) !important; border-radius: var(--ddg-raggio) !important; overflow: hidden !important; }
.ddg-offerta-barra { height: 6px !important; background: var(--ddg-verde) !important; }
.ddg-offerta-corpo { padding: 14px !important; }
.ddg-offerta-tipo { font-size: 13px !important; font-weight: 700 !important; letter-spacing: .04em !important; text-transform: uppercase !important; color: var(--ddg-accent) !important; }
.ddg-offerta-nome { font-size: 18px !important; font-weight: 700 !important; margin: 2px 0 10px !important; }
/* Promozione del fornitore (02/10/2026): badge «Promo» e testo, va a capo sugli smartphone (il verde resta solo al risparmio). */
.ddg-offerta-promo { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 6px 8px !important; margin: -4px 0 10px !important; padding: 0 !important; font-size: 14px !important; font-weight: 600 !important; color: var(--ddg-accent) !important; line-height: 1.35 !important; }
.ddg-badge-promo { display: inline-block !important; padding: 2px 8px !important; border-radius: 999px !important; background: var(--ddg-accent) !important; color: #fff !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: .04em !important; text-transform: uppercase !important; }
/* Promozioni (08/10/2026): nota della promo, riquadri «Con la promo risparmieresti…» (completo) e frase del pubblico. */
.ddg-offerta-promo-nota { margin: -4px 0 10px !important; font-size: 13px !important; color: var(--ddg-testo-secondario) !important; line-height: 1.35 !important; }
.ddg-promo-extra { display: grid !important; gap: 12px !important; margin: 16px 0 !important; }
.ddg-promo-extra[hidden] { display: none !important; }
.ddg-promo-riquadro { border: 2px solid var(--ddg-accent) !important; border-radius: 12px !important; padding: 14px 16px !important; background: #fff !important; }
.ddg-promo-riquadro .ddg-offerta-promo { margin: 0 0 8px !important; }
.ddg-promo-frase { margin: 0 0 6px !important; font-size: 18px !important; font-weight: 700 !important; line-height: 1.3 !important; color: var(--ddg-testo, #1d2327) !important; }
.ddg-promo-dopo { margin: 0 0 6px !important; font-size: 14px !important; font-weight: 600 !important; line-height: 1.4 !important; color: var(--ddg-testo, #1d2327) !important; }
.ddg-promo-riquadro .ddg-offerta-promo-nota { margin: 0 !important; }
.ddg-nota-promo { font-weight: 600 !important; }
.ddg-promo-pubblico { margin: 16px 0 0 !important; text-align: center !important; }
.ddg-promo-pubblico .ddg-offerta-promo { justify-content: center !important; }
.ddg-promo-pubblico .ddg-promo-frase { font-size: 22px !important; color: var(--ddg-accent) !important; }
.ddg-promo-riquadro[hidden] { display: none !important; }
/* Vantaggi e varianti (19/10/2026): colori neutri (il verde è solo del risparmio, il rosso di promo ed errori). */
.ddg-vantaggi-inclusi { display: flex !important; flex-wrap: wrap !important; align-items: flex-start !important; gap: 6px 8px !important; margin: -4px 0 12px !important; padding: 0 !important; }
.ddg-badge-vantaggio { display: inline-block !important; flex: none !important; padding: 2px 8px !important; border-radius: 999px !important; background: var(--ddg-neutro) !important; color: #fff !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: .04em !important; text-transform: uppercase !important; line-height: 1.5 !important; }
.ddg-vantaggi-elenco { flex: 1 1 200px !important; margin: 0 !important; padding: 0 !important; list-style: none !important; }
.ddg-vantaggi-elenco li { margin: 0 0 4px !important; padding: 0 !important; font-size: 14px !important; font-weight: 600 !important; line-height: 1.4 !important; color: var(--ddg-testo) !important; }
.ddg-varianti { margin: 14px 0 0 !important; padding: 12px 14px !important; border: 1px solid var(--ddg-bordo) !important; border-radius: var(--ddg-raggio) !important; background: var(--ddg-riquadro) !important; }
.ddg-varianti-titolo { margin: 0 0 2px !important; font-size: 16px !important; font-weight: 700 !important; line-height: 1.3 !important; color: var(--ddg-testo) !important; }
.ddg-varianti-nota { margin: 0 0 8px !important; font-size: 13px !important; line-height: 1.4 !important; color: var(--ddg-testo-secondario) !important; }
.ddg-varianti-elenco { margin: 0 !important; padding: 0 !important; list-style: none !important; }
.ddg-variante { display: flex !important; justify-content: space-between !important; align-items: baseline !important; gap: 12px !important; margin: 0 !important; padding: 8px 0 !important; border-top: 1px solid var(--ddg-bordo) !important; }
.ddg-variante-testo { display: grid !important; gap: 4px !important; font-size: 14px !important; line-height: 1.4 !important; color: var(--ddg-testo) !important; }
.ddg-variante-vantaggio { display: block !important; }
.ddg-variante-prezzo { flex: none !important; font-size: 15px !important; font-weight: 700 !important; white-space: nowrap !important; font-variant-numeric: tabular-nums !important; color: var(--ddg-testo) !important; }
/* Telefono stretto: la differenza di prezzo sopra, il vantaggio sotto a tutta larghezza. */
@media (max-width: 479.98px) {
	.ddg-variante { flex-direction: column !important; align-items: flex-start !important; gap: 2px !important; }
	.ddg-variante-prezzo { order: -1 !important; }
}
/* «Promozioni e vantaggi che possiamo attivarti» (0.29.22), pubblico e completo, con
   qualsiasi esito: bordo e punti rossi come le altre promo (il rosso è delle promo,
   il verde solo del risparmio), testo nero, allineato a sinistra anche dentro i
   messaggi centrati («in linea»). I contatti sotto, se il messaggio non li ha già. */
.ddg-promozioni { display: block !important; margin: 16px 0 !important; padding: 14px 16px !important; border: 2px solid var(--ddg-verde) !important; border-radius: 12px !important; background: var(--ddg-sfondo) !important; text-align: left !important; }
.ddg-promozioni[hidden] { display: none !important; }
.ddg-promozioni-titolo { margin: 0 0 10px !important; font-size: 18px !important; font-weight: 700 !important; line-height: 1.3 !important; color: var(--ddg-accent) !important; }
.ddg-promozioni-elenco { margin: 0 !important; padding: 0 !important; list-style: none !important; }
.ddg-promozioni-voce { position: relative !important; margin: 0 0 8px !important; padding: 0 0 0 20px !important; font-size: 15px !important; font-weight: 600 !important; line-height: 1.4 !important; color: var(--ddg-testo) !important; overflow-wrap: anywhere !important; }
.ddg-promozioni-voce::before { content: "" !important; position: absolute !important; left: 2px !important; top: .5em !important; width: 8px !important; height: 8px !important; border-radius: 50% !important; background: var(--ddg-verde) !important; }
.ddg-promozioni-chiusura { margin: 10px 0 0 !important; padding: 10px 0 0 !important; border-top: 1px solid var(--ddg-bordo) !important; font-size: 14px !important; line-height: 1.4 !important; color: var(--ddg-testo) !important; }
.ddg-promozioni .ddg-contatti { margin-top: 12px !important; }
.ddg-offerta-dati { display: grid !important; gap: 6px !important; font-size: 15px !important; }
/* Riga etichetta/valore: affiancati, oppure uno sotto l'altro sotto i 400 px (vedi in fondo). */
.ddg-offerta-dati > div { display: flex !important; flex-wrap: wrap !important; justify-content: space-between !important; align-items: baseline !important; gap: 12px !important; row-gap: 0 !important; }
/* L'etichetta non va mai a capo; se non c'è spazio il valore scende, sempre a destra. */
.ddg-offerta-dati dt { color: var(--ddg-testo-secondario) !important; white-space: nowrap !important; }
.ddg-offerta-dati dd { margin-left: auto !important; text-align: right !important; font-weight: 600 !important; font-variant-numeric: tabular-nums !important; }
/* Riga con nota (prezzo variabile, 02/10/2026): valore in grassetto, nota sotto su una riga a parte. */
.ddg-offerta-dati .ddg-riga-con-nota { column-gap: 8px !important; }
.ddg-offerta-dati .ddg-valore-risparmio { color: var(--ddg-verde) !important; font-weight: 700 !important; }
.ddg-offerta-dati .ddg-valore-forte { font-weight: 700 !important; white-space: nowrap !important; }
.ddg-offerta-dati .ddg-nota-riga { flex-basis: 100% !important; font-size: 13px !important; font-weight: 400 !important; color: var(--ddg-testo-secondario) !important; line-height: 1.35 !important; }
/* Risparmio: etichetta su una riga, cifra grande sotto, percentuale sotto ancora. */
.ddg-offerta-risparmio { margin-top: 12px !important; padding: 10px 12px !important; border-radius: 8px !important; background: var(--ddg-verde-chiaro) !important; color: var(--ddg-verde) !important; display: flex !important; flex-direction: column !important; gap: 2px !important; }
.ddg-offerta-risparmio-etichetta { font-size: 14px !important; font-weight: 700 !important; }
.ddg-offerta-risparmio-cifra { font-size: 28px !important; font-weight: 800 !important; line-height: 1.15 !important; }
.ddg-offerta-risparmio-pct { font-size: 14px !important; font-weight: 600 !important; }
.ddg-offerta-vuota { padding: 14px !important; color: var(--ddg-neutro) !important; background: var(--ddg-neutro-chiaro) !important; }

/* ---- Avvisi da controllare (consumo di meno di 12 mesi, bolletta vecchia, …): ambra (01/10/2026) ---- */
.ddg-avviso { margin-top: 8px !important; padding: 10px 12px !important; border-radius: 8px !important; background: var(--ddg-avviso-sfondo) !important; border-left: 4px solid var(--ddg-avviso-bordo) !important; color: var(--ddg-avviso-testo) !important; font-size: 14px !important; }
.ddg-avviso a { color: var(--ddg-avviso-testo) !important; text-decoration: underline !important; font-weight: 700 !important; }
.ddg-avviso p + p { margin-top: 6px !important; }
/* Bolletta di più di 6 mesi: avviso in evidenza, il calcolo si fa comunque (01/10/2026). */
.ddg-avviso-vecchia { font-weight: 600 !important; }
[data-ddg="avviso-vecchia-risultato"] { margin: 0 0 12px !important; }
.ddg-avviso-titolo { font-weight: 700 !important; }
.ddg-bottone-piccolo { min-height: 40px !important; padding: 8px 16px !important; font-size: 15px !important; margin-top: 10px !important; width: auto !important; min-width: 0 !important; }

/* ---- Accesso (completo non collegato) ---- */
.ddg-accesso { text-align: center !important; }
.ddg-nota-iscriviti { margin-top: 12px !important; }

/* ---- Sotto i 400 px: righe etichetta/valore una sotto l'altra ---- */
@media (max-width: 399.98px) {
	.ddg-offerta-dati > div { flex-direction: column !important; flex-wrap: nowrap !important; align-items: flex-start !important; gap: 0 !important; }
	.ddg-offerta-dati dd { margin-left: 0 !important; text-align: left !important; }
	.ddg-offerta-dati .ddg-nota-riga { flex-basis: auto !important; }
}

/* ---- Da 640 px: più colonne ---- */
@media (min-width: 640px) {
	.ddg-preventivatore { font-size: 16px !important; }
	.ddg-campi-3 { grid-template-columns: repeat(3, 1fr) !important; }
	.ddg-campi-2 { grid-template-columns: repeat(2, 1fr) !important; }
	.ddg-offerte { grid-template-columns: 1fr 1fr !important; }
	.ddg-bottone { width: auto !important; min-width: 280px !important; }
	.ddg-bottone-piccolo { min-width: 0 !important; }
	.ddg-azioni { text-align: right !important; }
}

/* ---- Offerte in aggiornamento (30/09/2026): neutro, come "in linea" ---- */
.ddg-nota-aggiornamento { margin: 12px 0 0 !important; text-align: center !important; }
.ddg-offerta-vuota + .ddg-offerta-vuota { padding-top: 0 !important; }

/* ---- Area riservata: Accedi e Iscriviti gratis, uguali (30/09/2026) ---- */
.ddg-accesso-bottoni { display: grid !important; gap: 12px !important; grid-template-columns: 1fr !important; margin-top: var(--ddg-spazio) !important; }
.ddg-accesso-bottoni .ddg-bottone { width: 100% !important; min-width: 0 !important; margin-top: 0 !important; }
.ddg-avviso-admin { margin-bottom: var(--ddg-spazio) !important; }
@media (min-width: 400px) {
	.ddg-accesso-bottoni { grid-template-columns: 1fr 1fr !important; }
}

/* ---- Guida "Dove lo trovo in bolletta?" per fornitore (30/09/2026) ----
   Il pannello sta in .ddg-guida-radice, appeso direttamente al <body>: fisso
   sopra tutto (footer, barra admin, menu del tema), con lo sfondo scuro.
   Smartphone: dal basso (bottom sheet) con la maniglia; da 640 px: finestra
   centrata, larga al massimo 640 px. Scorre dentro, la pagina resta ferma. */
.ddg-guida-sfondo { position: fixed !important; inset: 0 !important; background: rgba(16, 10, 6, .55) !important; z-index: 2147483000 !important; }
.ddg-guida {
	position: fixed !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	top: auto !important;
	z-index: 2147483001 !important;
	max-height: 85vh !important;
	overflow-y: auto !important;
	overscroll-behavior: contain !important;
	-webkit-overflow-scrolling: touch !important;
	background: var(--ddg-sfondo) !important;
	border-radius: 16px 16px 0 0 !important;
	box-shadow: 0 -8px 30px rgba(16, 10, 6, .3) !important;
	padding: 6px var(--ddg-spazio) 20px !important;
	font-size: 15px !important;
	text-align: left !important;
}
.ddg-guida-maniglia { display: block !important; width: 100% !important; height: 28px !important; cursor: pointer !important; position: relative !important; }
.ddg-guida-maniglia::before { content: "" !important; position: absolute !important; left: 50% !important; top: 10px !important; width: 44px !important; height: 5px !important; margin-left: -22px !important; border-radius: 3px !important; background: var(--ddg-bordo) !important; }
.ddg-guida-testa { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; margin-bottom: 10px !important; }
.ddg-guida-titolo { font-size: 17px !important; font-weight: 700 !important; }
.ddg-guida-chiudi { flex: none !important; width: 40px !important; height: 40px !important; border-radius: 50% !important; background: var(--ddg-riquadro) !important; color: var(--ddg-testo) !important; font-size: 22px !important; line-height: 40px !important; text-align: center !important; cursor: pointer !important; }
.ddg-guida-etichetta { display: block !important; font-weight: 600 !important; margin-bottom: 6px !important; }
.ddg-guida-cerca { position: relative !important; }
.ddg-guida-cerca input[type="text"] { width: 100% !important; min-height: 46px !important; padding: 10px 12px !important; font-size: 17px !important; border: 1.5px solid var(--ddg-bordo) !important; border-radius: 8px !important; background: var(--ddg-campo) !important; color: var(--ddg-testo) !important; }
.ddg-guida-cerca input[type="text"]:focus { outline: none !important; border-color: var(--ddg-accent) !important; box-shadow: 0 0 0 3px rgba(200, 31, 36, .15) !important; }
.ddg-guida-elenco { display: block !important; margin-top: 4px !important; border: 1px solid var(--ddg-bordo) !important; border-radius: 8px !important; background: var(--ddg-sfondo) !important; overflow: hidden !important; }
.ddg-guida-elenco[hidden] { display: none !important; }
/* I fornitori scorrono; «Non trovo il mio fornitore» resta fisso sotto, sempre visibile. */
.ddg-guida-elenco-scorre { display: block !important; list-style: none !important; max-height: 240px !important; overflow-y: auto !important; }
.ddg-guida-elenco-fisso { display: block !important; list-style: none !important; border-top: 2px solid var(--ddg-bordo) !important; background: var(--ddg-riquadro) !important; }
.ddg-guida-elenco li { padding: 11px 12px !important; cursor: pointer !important; border-bottom: 1px solid var(--ddg-bordo) !important; }
.ddg-guida-elenco-scorre li:last-child,
.ddg-guida-elenco-fisso li { border-bottom: 0 !important; }
.ddg-guida-elenco li[aria-selected="true"] { background: #FDF1F1 !important; color: var(--ddg-accent) !important; }
/* Solo con il mouse: sugli schermi touch l'hover resterebbe sulla voce sotto il dito. */
@media (hover: hover) {
	.ddg-guida-elenco li:hover { background: #FDF1F1 !important; color: var(--ddg-accent) !important; }
}
.ddg-guida-altro { font-style: italic !important; }
/* Fornitore già scelto, quando si riapre l'elenco per cambiarlo. */
.ddg-guida-elenco li.ddg-guida-scelto { font-weight: 700 !important; color: var(--ddg-accent) !important; }
.ddg-guida-formati { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; margin-top: 10px !important; }
.ddg-guida-formato { padding: 6px 12px !important; border: 1.5px solid var(--ddg-accent) !important; border-radius: 999px !important; color: var(--ddg-accent) !important; font-size: 14px !important; font-weight: 600 !important; cursor: pointer !important; }
.ddg-guida-formato[aria-pressed="true"] { background: var(--ddg-accent) !important; color: #FFFFFF !important; }
.ddg-guida-corpo { margin-top: 12px !important; }
.ddg-guida-corpo img { display: block !important; width: 100% !important; height: auto !important; border: 1px solid var(--ddg-bordo) !important; border-radius: 8px !important; }
.ddg-guida-corpo p { margin-top: 8px !important; }
.ddg-guida-nota { color: var(--ddg-testo-secondario) !important; font-size: 14px !important; }
.ddg-guida-zoom { display: inline-block !important; margin-top: 4px !important; font-size: 13px !important; }
/* Esempio "Bolletta standard ARERA" per i fornitori senza guida illustrata (30/09/2026). */
.ddg-guida-corpo p.ddg-guida-arera-titolo { margin: 0 0 10px !important; font-weight: 700 !important; }
.ddg-guida-aiuto { margin-top: 16px !important; padding-top: 14px !important; border-top: 1px solid var(--ddg-bordo) !important; }
.ddg-guida-corpo p.ddg-guida-aiuto-testo { margin-top: 0 !important; font-weight: 600 !important; }
@media (min-width: 640px) {
	.ddg-guida { left: 50% !important; right: auto !important; top: 50% !important; bottom: auto !important; transform: translate(-50%, -50%) !important; width: 640px !important; max-width: calc(100vw - 32px) !important; border-radius: 12px !important; padding: 20px 24px 24px !important; box-shadow: 0 20px 60px rgba(16, 10, 6, .35) !important; }
	.ddg-guida-maniglia { display: none !important; }
}

/* ---- Contatti nei messaggi senza offerta (30/09/2026): email, telefono con
   orario, WhatsApp. Smartphone: uno sotto l'altro, bottoni grandi; da 640 px
   in fila. Colore del marchio, mai il verde (riservato al risparmio). ---- */
.ddg-contatti { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; margin-top: 12px !important; text-align: left !important; }
.ddg-preventivatore a.ddg-contatto,
.ddg-guida-radice a.ddg-contatto {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	min-height: 52px !important;
	padding: 10px 14px !important;
	border: 2px solid var(--ddg-accent) !important;
	border-radius: 12px !important;
	background: var(--ddg-sfondo) !important;
	color: var(--ddg-accent) !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	text-decoration: none !important;
	overflow-wrap: anywhere !important;
}
.ddg-preventivatore a.ddg-contatto:hover,
.ddg-guida-radice a.ddg-contatto:hover { background: #FDF1F1 !important; }
.ddg-contatto svg { flex: none !important; width: 24px !important; height: 24px !important; }
.ddg-contatto span { display: flex !important; flex-direction: column !important; }
.ddg-contatto span { min-width: 0 !important; }
/* Riga sotto il titolo rosso (indirizzo email, orario): piccola e grigia. */
.ddg-contatto-riga { font-size: 13px !important; font-weight: 400 !important; color: var(--ddg-testo-secondario) !important; }
/* L'email sta sempre su una riga (dopo la 0.14.0). Nel bottone email l'indirizzo
   va sotto icona e titolo, su tutta la larghezza; il carattere è di 13 px, più
   piccolo solo se il bottone è stretto (--ddg-car = lettere dell'indirizzo,
   0,57 em la larghezza media di una lettera). */
.ddg-preventivatore a.ddg-contatto-email { display: grid !important; grid-template-columns: 24px minmax(0, 1fr) !important; column-gap: 10px !important; row-gap: 2px !important; container-type: inline-size !important; }
.ddg-preventivatore a.ddg-contatto-email > span { display: contents !important; }
.ddg-contatto-email .ddg-contatto-riga { grid-column: 1 / -1 !important; }
.ddg-contatto-riga .ddg-email { display: block !important; white-space: nowrap !important; overflow-wrap: normal !important; word-break: normal !important; font-size: min(13px, calc(100cqi / (var(--ddg-car, 25) * 0.57))) !important; }
@media (min-width: 640px) {
	.ddg-contatti { grid-template-columns: repeat(3, 1fr) !important; }
	/* Con l'email: email su una riga intera, telefono e WhatsApp affiancati sotto. */
	.ddg-contatti:has(.ddg-contatto-email) { grid-template-columns: repeat(2, 1fr) !important; }
	.ddg-contatti .ddg-contatto-email { grid-column: 1 / -1 !important; }
	/* Guida: WhatsApp, telefono e «Iscriviti / Accedi» o «Carica la bolletta», in fila se c'è posto. */
	.ddg-guida-contatti { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)) !important; }
}
.ddg-contatti-indirizzo { margin-top: 10px !important; font-size: 13px !important; color: var(--ddg-testo-secondario) !important; text-align: center !important; }

/* ---- «Ti serve un altro calcolatore?» (Diego, 07/10/2026) ----
   Schede in fondo verso gli altri tre preventivatori. Colori della palette:
   rosso solo per icona, freccia e bordo al passaggio del mouse. */
.ddg-altri {
	display: block !important;
	margin: calc(var(--ddg-spazio) * 2) 0 var(--ddg-spazio) !important;
	padding: var(--ddg-spazio) !important;
	background: var(--ddg-riquadro) !important;
	border-radius: var(--ddg-raggio) !important;
}
.ddg-altri-titolo { margin: 0 !important; font-size: 18px !important; font-weight: 700 !important; line-height: 1.3 !important; color: var(--ddg-testo) !important; }
.ddg-altri-sotto { margin: 2px 0 12px !important; font-size: 14px !important; color: var(--ddg-testo-secondario) !important; }
.ddg-altri-schede {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
	gap: 10px !important;
}
.ddg-preventivatore a.ddg-altro,
a.ddg-altro {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	min-height: 64px !important;
	padding: 12px 14px !important;
	background: var(--ddg-sfondo) !important;
	border: 1px solid var(--ddg-bordo) !important;
	border-radius: var(--ddg-raggio) !important;
	color: var(--ddg-testo) !important;
	text-decoration: none !important;
	box-shadow: 0 1px 2px rgba(16, 10, 6, 0.05) !important;
	transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease !important;
}
a.ddg-altro:hover,
a.ddg-altro:focus-visible {
	border-color: var(--ddg-accent) !important;
	box-shadow: 0 4px 12px rgba(16, 10, 6, 0.10) !important;
	transform: translateY(-1px) !important;
	outline: none !important;
}
a.ddg-altro .ddg-icona { width: 32px !important; height: 32px !important; }
.ddg-altro-testi { display: flex !important; flex-direction: column !important; flex: 1 1 auto !important; min-width: 0 !important; }
.ddg-altro-nome { font-size: 16px !important; font-weight: 700 !important; line-height: 1.25 !important; }
.ddg-altro-per { font-size: 13px !important; line-height: 1.3 !important; color: var(--ddg-testo-secondario) !important; }
.ddg-altro-freccia { flex: none !important; font-size: 20px !important; color: var(--ddg-accent) !important; transition: transform .15s ease !important; }
a.ddg-altro:hover .ddg-altro-freccia { transform: translateX(3px) !important; }
@media (prefers-reduced-motion: reduce) {
	a.ddg-altro, .ddg-altro-freccia { transition: none !important; }
	a.ddg-altro:hover, a.ddg-altro:hover .ddg-altro-freccia { transform: none !important; }
}

/* ---- App installabile [ddg_app] (Diego, 10/10/2026) ----
   Pagina iniziale dell'app: icona, titolo, le quattro schede (stesso stile
   di «Ti serve un altro calcolatore?»), accesso e «Metti l'app sul telefono». */
.ddg-app { max-width: 560px !important; margin: 0 auto !important; }
.ddg-app-testa { text-align: center !important; margin-bottom: calc(var(--ddg-spazio) * 1.5) !important; }
.ddg-app-icona { display: block !important; width: 64px !important; height: 64px !important; margin: 0 auto 10px !important; border-radius: 14px !important; box-shadow: 0 1px 4px rgba(16, 10, 6, 0.15) !important; }
.ddg-app-titolo { margin: 0 0 6px !important; font-size: 24px !important; font-weight: 800 !important; line-height: 1.25 !important; color: var(--ddg-testo) !important; }
.ddg-app-sotto { margin: 0 !important; font-size: 16px !important; line-height: 1.45 !important; color: var(--ddg-testo-secondario) !important; }
.ddg-app-schede { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; }
.ddg-app-schede a.ddg-altro { min-height: 72px !important; }
.ddg-app-accesso { margin-top: calc(var(--ddg-spazio) * 1.5) !important; padding: var(--ddg-spazio) !important; background: var(--ddg-riquadro) !important; border-radius: var(--ddg-raggio) !important; }
.ddg-app-accesso-testo { margin: 0 0 10px !important; font-size: 15px !important; line-height: 1.45 !important; color: var(--ddg-testo) !important; text-align: center !important; }
.ddg-app > .ddg-app-accesso-testo { margin-top: calc(var(--ddg-spazio) * 1.5) !important; }
.ddg-app-installa { margin-top: calc(var(--ddg-spazio) * 1.5) !important; padding: var(--ddg-spazio) !important; border: 2px dashed var(--ddg-bordo) !important; border-radius: var(--ddg-raggio) !important; }
.ddg-app-installa[hidden], .ddg-app-installa [hidden] { display: none !important; }
.ddg-app-installa-titolo { margin: 0 0 4px !important; font-size: 18px !important; font-weight: 700 !important; color: var(--ddg-testo) !important; }
.ddg-app-installa-testo { margin: 0 0 10px !important; font-size: 15px !important; line-height: 1.45 !important; color: var(--ddg-testo) !important; }
.ddg-app-installa .ddg-bottone { width: 100% !important; min-height: 52px !important; }
.ddg-app-passi { margin: 0 0 10px 1.3em !important; padding: 0 !important; font-size: 15px !important; line-height: 1.5 !important; color: var(--ddg-testo) !important; }
.ddg-app-passi li { margin-bottom: 6px !important; }
.ddg-app-installa-nota { margin: 0 !important; font-size: 13px !important; color: var(--ddg-testo-secondario) !important; }
/* Barra «‹ Tutti i calcolatori» dentro l'app installata (le altre pagine). */
a.ddg-app-indietro {
	display: block !important; position: sticky !important; top: 0 !important; z-index: 99999 !important;
	padding: calc(10px + env(safe-area-inset-top, 0px)) 16px 10px !important;
	background: #FFFFFF !important; border-bottom: 1px solid #E3DEDA !important;
	color: #C81F24 !important; font: 700 16px/1.3 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif !important; text-decoration: none !important;
}
/* Testi per Google in fondo alla pagina dell'app (blocco «Dettagli» della pagina con la classe
   ddg-app-seo, oppure quelli del plugin con seo="si"): voce apribile con il segno + / −,
   nascosta dentro l'app installata. */
.ddg-app-seo { max-width: 560px !important; margin: calc(var(--ddg-spazio, 16px) * 2) auto 0 !important; border-top: 1px solid #E3DEDA !important; padding-top: 16px !important; font-size: 15px !important; line-height: 1.55 !important; color: #100A06 !important; }
.ddg-app-seo > summary { display: flex !important; align-items: center !important; gap: 10px !important; min-height: 48px !important; cursor: pointer !important; list-style: none !important; font-size: 15px !important; font-weight: 700 !important; color: #C81F24 !important; }
.ddg-app-seo > summary::-webkit-details-marker { display: none !important; }
.ddg-app-seo > summary::before { content: "+" !important; flex: none !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 28px !important; height: 28px !important; border: 2px solid #C81F24 !important; border-radius: 50% !important; font-size: 18px !important; line-height: 1 !important; }
.ddg-app-seo[open] > summary::before { content: "−" !important; }
.ddg-app-seo-segno { display: none !important; }
.ddg-app-seo h2 { font-size: 20px !important; line-height: 1.3 !important; margin: 12px 0 8px !important; }
.ddg-app-seo h3 { font-size: 17px !important; line-height: 1.3 !important; margin: 16px 0 6px !important; }
.ddg-app-seo p, .ddg-app-seo ul, .ddg-app-seo ol { margin: 0 0 10px !important; }
.ddg-app-seo ul, .ddg-app-seo ol { padding-left: 1.3em !important; }
.ddg-app-seo a { color: #C81F24 !important; }
.ddg-app-seo img { display: block !important; width: 96px !important; height: 96px !important; margin: 8px 0 12px !important; border-radius: 18px !important; }
@media (display-mode: standalone) { .ddg-app-seo { display: none !important; } }

/* Protezione (0.29.0): © DDG.Solutions e condizioni d'uso in fondo ai calcolatori e all'app. */
.ddg-copyright { margin: calc(var(--ddg-spazio) * 1.5) 0 0 !important; font-size: 12px !important; line-height: 1.4 !important; color: var(--ddg-testo-secondario) !important; text-align: center !important; }
.ddg-copyright a { color: inherit !important; text-decoration: underline !important; }
