/* =============================================================================
   Espresso Code — consenso: il banner dei cookie di Complianz, la linguetta "Gestisci consenso", i
   segnaposto dei contenuti bloccati e il documento generato, vestiti con i token di espresso.css.
   Lo carica functions.php solo dove Complianz stampa qualcosa; senza banner non arriva nemmeno.
   Niente colori propri: miscela, tono (chiaro, scuro, sistema) e bancone (bar, terminale, giornale) valgono
   da soli. Come si sovrascrive Complianz:
   - le sue variabili --cmplz_* (che lui mette su :root) le ridichiaro sui suoi contenitori: vince la più vicina;
   - le regole che le variabili non coprono partono dagli id dei contenitori (#cmplz-cookiebanner-container,
     #cmplz-manage-consent, #cmplz-document): un id batte le sue catene di classi senza !important, anche se il
     suo foglio arrivasse dopo questo (Complianz lo inietta da JS quando ha più varianti di banner); dove usa
     anche lui l'id (la linguetta) c'è un elemento in più.
   Movimento ridotto: la regola globale di espresso.css ferma anche le animazioni di Complianz.
   ============================================================================= */
:root { --pillola: 999px; }
:root[data-modo="carta"] { --pillola: 0; } /* giornale: angoli vivi, come .bottone in espresso.css */
#cmplz-cookiebanner-container, #cmplz-manage-consent, .cmplz-manage-consent-container {
	--cmplz_banner_width: 34rem;
	--cmplz_banner_background_color: var(--fondo);
	--cmplz_banner_border_color: var(--linea);
	--cmplz_banner_border_width: 1px;
	--cmplz_banner_border_radius: var(--raggio);
	--cmplz_banner_margin: .6rem;
	--cmplz_title_font_size: 1.3rem;
	--cmplz_text_color: var(--inchiostro);
	--cmplz_text_font_size: .92rem;
	--cmplz_text_line_height: 1.55;
	--cmplz_hyperlink_color: var(--accento);
	--cmplz_link_font_size: .85rem;
	--cmplz_category_body_font_size: .85rem;
	--cmplz_category_header_title_font_size: .95rem;
	--cmplz_category_header_active_font_size: .68rem;
	--cmplz_category_header_always_active_color: var(--accento);
	--cmplz_button_font_size: .92rem;
	--cmplz_button_border_radius: var(--pillola);
	/* Accetta e Rifiuta uguali (stesso peso visivo, linee guida EDPB sui banner); le preferenze in contorno */
	--cmplz_button_accept_background_color: var(--accento-2);
	--cmplz_button_accept_border_color: var(--accento-2);
	--cmplz_button_accept_text_color: var(--espresso);
	--cmplz_button_deny_background_color: var(--accento-2);
	--cmplz_button_deny_border_color: var(--accento-2);
	--cmplz_button_deny_text_color: var(--espresso);
	--cmplz_button_settings_background_color: transparent;
	--cmplz_button_settings_border_color: var(--tenue);
	--cmplz_button_settings_text_color: var(--inchiostro);
	--cmplz_slider_active_color: var(--accento);
	--cmplz_slider_inactive_color: var(--tenue);
	--cmplz_slider_bullet_color: var(--fondo);
}
/* Giornale: bottoni d'inchiostro, come .bottone in espresso.css */
[data-modo="carta"] :is(#cmplz-cookiebanner-container, #cmplz-manage-consent, .cmplz-manage-consent-container) {
	--cmplz_button_accept_background_color: var(--inchiostro);
	--cmplz_button_accept_border_color: var(--inchiostro);
	--cmplz_button_accept_text_color: var(--fondo);
	--cmplz_button_deny_background_color: var(--inchiostro);
	--cmplz_button_deny_border_color: var(--inchiostro);
	--cmplz_button_deny_text_color: var(--fondo);
}

/* ---------- Banner ---------- */
/* 20 px di lato + 1 px di bordo: Complianz larga il testo a --cmplz_banner_width - 42px */
#cmplz-cookiebanner-container .cmplz-cookiebanner { padding: 18px 20px; grid-gap: .7rem; font-family: var(--testo-font); box-shadow: var(--ombra); }
@media (min-width: 769px) {
	/* In basso a destra, agli stessi margini della tazzina della lettura (che copre finché è aperto) */
	#cmplz-cookiebanner-container .cmplz-cookiebanner { right: clamp(12px, 2vw, 28px); bottom: clamp(12px, 2vw, 28px); }
}
@media (max-width: 768px) {
	/* Sotto i 769 px Complianz lo mette a tutta larghezza in fondo: un foglio che sale dal bordo */
	#cmplz-cookiebanner-container .cmplz-cookiebanner { border-width: 1px 0 0; border-radius: var(--raggio) var(--raggio) 0 0; }
}
#cmplz-cookiebanner-container .cmplz-header { display: flex; align-items: center; gap: 1rem; }
#cmplz-cookiebanner-container .cmplz-title { display: block; flex: 1; margin: 0; font: 600 var(--cmplz_title_font_size)/1.15 var(--titoli-font); letter-spacing: -.01em; }
#cmplz-cookiebanner-container .cmplz-close { display: grid; place-items: center; flex: none; width: 2.25rem; height: 2.25rem; border-radius: var(--pillola); color: var(--tenue); }
#cmplz-cookiebanner-container .cmplz-close:hover { background: var(--fondo-2); color: var(--inchiostro); }
#cmplz-cookiebanner-container .cmplz-close svg { width: 1rem; height: 1rem; }
#cmplz-cookiebanner-container .cmplz-message a { text-underline-offset: .18em; }

/* Categorie: una riga per categoria, interruttore e freccia da almeno 24 px (WCAG 2.5.8) */
#cmplz-cookiebanner-container .cmplz-category { border: 1px solid var(--linea); border-radius: calc(var(--raggio) * .75); background: var(--fondo-2); }
#cmplz-cookiebanner-container .cmplz-category-header { display: flex; align-items: center; gap: .75rem; padding: .5rem .6rem .5rem .85rem; }
#cmplz-cookiebanner-container .cmplz-category-title { flex: 1; font: 600 var(--cmplz_category_header_title_font_size)/1.3 var(--testo-font); }
#cmplz-cookiebanner-container .cmplz-always-active { font: 500 var(--cmplz_category_header_active_font_size)/1.2 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
#cmplz-cookiebanner-container .cmplz-always-active .cmplz-banner-checkbox { display: none; }
#cmplz-cookiebanner-container .cmplz-category-toggle { flex: none; width: 2rem; height: 2rem; border-radius: var(--pillola); color: var(--tenue); }
#cmplz-cookiebanner-container .cmplz-category-toggle:hover { background: var(--fondo); color: var(--inchiostro); }
#cmplz-cookiebanner-container .cmplz-icon.cmplz-open { width: 1rem; height: 1rem; transition: transform .25s; }
#cmplz-cookiebanner-container .cmplz-icon svg { display: block; width: 100%; height: 100%; fill: currentColor; } /* il path non ha fill: nero col tono scuro */
#cmplz-cookiebanner-container .cmplz-description { padding: 0 .85rem .75rem; color: var(--tenue); line-height: 1.5; }

/* Interruttore: la casella vera (trasparente) copre tutta la pista, così l'area cliccabile è 44×24 */
#cmplz-cookiebanner-container .cmplz-banner-checkbox { position: relative; flex: none; width: 2.75rem; height: 1.5rem; }
#cmplz-cookiebanner-container .cmplz-banner-checkbox input.cmplz-consent-checkbox { inset: 0; width: 100%; height: 100%; margin: 0; }
#cmplz-cookiebanner-container .cmplz-banner-checkbox .cmplz-label { position: absolute; inset: 0; padding: 0; }
#cmplz-cookiebanner-container .cmplz-banner-checkbox .cmplz-label::before { top: 0; left: 0; width: 100%; height: 100%; padding: 0; border-radius: var(--pillola); }
#cmplz-cookiebanner-container .cmplz-banner-checkbox .cmplz-label::after { top: 3px; left: 3px; width: calc(1.5rem - 6px); height: calc(1.5rem - 6px); border-radius: var(--pillola); transition: transform .2s, background-color .2s; }
#cmplz-cookiebanner-container .cmplz-banner-checkbox input.cmplz-consent-checkbox:checked + .cmplz-label::after { left: 3px; transform: translateX(1.25rem); }
#cmplz-cookiebanner-container .cmplz-banner-checkbox input.cmplz-consent-checkbox:focus + .cmplz-label::before { box-shadow: none; }
#cmplz-cookiebanner-container .cmplz-banner-checkbox input.cmplz-consent-checkbox:focus-visible + .cmplz-label::before { outline: 3px solid var(--anello, var(--accento)); outline-offset: 2px; }

/* Bottoni: pillole come .bottone; sotto i 769 px Complianz li mette in colonna */
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn {
	min-height: 2.75rem; padding: .55rem 1.1rem; font-weight: 600; line-height: 1.25; white-space: normal;
	transition: transform .2s, box-shadow .2s;
}
#cmplz-cookiebanner-container .cmplz-buttons :is(.cmplz-accept, .cmplz-deny) { box-shadow: inset 0 1px 0 rgb(255 255 255 / .3), 0 6px 18px color-mix(in oklab, var(--accento-2) 30%, transparent); }
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn:hover { transform: translateY(-2px); }
[data-modo="carta"] #cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn { box-shadow: none; }

/* Link ai documenti: righe da 24 px */
#cmplz-cookiebanner-container .cmplz-links ul { flex-wrap: wrap; gap: .2rem 1.1rem; }
#cmplz-cookiebanner-container .cmplz-links .cmplz-link { display: inline-block; padding: .2rem 0; min-height: 24px; text-underline-offset: .18em; }

/* ---------- Linguetta "Gestisci consenso": in basso a SINISTRA, a destra c'è la tazzina della lettura ---------- */
#cmplz-manage-consent button.cmplz-btn.cmplz-manage-consent { /* "button": un elemento in più delle sue regole con l'id */
	left: clamp(12px, 2vw, 28px); right: auto; bottom: clamp(12px, 2vw, 28px); z-index: 45; /* sotto la testata (50) e le sue tendine */
	min-width: 0; height: auto; min-height: 2.25rem; padding: .45rem .95rem;
	border: 1px solid var(--linea); border-radius: var(--pillola); box-shadow: var(--ombra);
	background: color-mix(in oklab, var(--fondo) 88%, transparent); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
	color: var(--inchiostro); font: 500 .7rem/1.2 var(--mono); letter-spacing: .08em; text-transform: uppercase;
	animation: none; /* niente scivolata: sempre intera e ferma */
}
#cmplz-manage-consent button.cmplz-btn.cmplz-manage-consent::before { /* il chicco del selettore della miscela */
	content: ""; display: inline-block; width: .8rem; height: .8rem; margin-right: .5em; vertical-align: -.15em; border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, var(--accento-2) 0 34%, var(--accento) 36%);
}
#cmplz-manage-consent button.cmplz-btn.cmplz-manage-consent:hover { border-color: var(--accento); }
/* Il fuoco da tastiera non finisce sotto la linguetta (WCAG 2.4.11) */
html:has(#cmplz-manage-consent .cmplz-manage-consent.cmplz-show:not(.cmplz-hidden)) { scroll-padding-bottom: calc(2.25rem + clamp(12px, 2vw, 28px) + 1rem); }

/* ---------- Segnaposto dei contenuti bloccati (embed) ---------- */
.cmplz-blocked-content-container, .cmplz-wp-video { border: 1px solid var(--linea); border-radius: var(--raggio); background-color: var(--fondo-2); box-shadow: none; }
:is(.cmplz-blocked-content-container, .cmplz-wp-video) :is(.cmplz-blocked-content-notice, .cmplz-custom-accept-btn) {
	max-width: 20rem; padding: .9rem 1.1rem; border: 0; border-radius: var(--raggio);
	background: color-mix(in oklab, var(--espresso) 92%, transparent); color: var(--crema); font: 500 .9rem/1.45 var(--testo-font);
}
:is(.cmplz-blocked-content-container, .cmplz-wp-video) .cmplz-blocked-content-notice a { color: var(--crema); }
.cmplz-blocked-content-notice .cmplz-accept-service {
	min-height: 2.25rem; margin-top: .4rem; padding: .4rem 1rem; border: 0; border-radius: var(--pillola);
	background: var(--caramello); color: var(--espresso); font-weight: 600; cursor: pointer;
}

/* ---------- Documento generato da Complianz (cookie policy): i grigi traslucidi e le celle bianche del suo
   foglio diventano i fondi del tema, leggibili anche col tono scuro ---------- */
#cmplz-document .cmplz-hidden { display: none; } /* senza banner nessuno la definisce */
#cmplz-document :is(h2, h3) { margin-top: 1.8em; } /* il suo 15px lascia il trattino dei titoli di .testo sopra il paragrafo prima */
#cmplz-document .cmplz-dropdown { border: 1px solid var(--linea); border-radius: var(--raggio); background: var(--fondo-2); }
#cmplz-document .cmplz-dropdown summary { margin: 0; padding: .6rem .9rem; background: transparent; }
#cmplz-document .cmplz-dropdown summary div::after { background: none; width: .5rem; height: .5rem; border: solid currentColor; border-width: 0 2px 2px 0; transform: rotate(45deg); }
#cmplz-document .cmplz-dropdown[open] summary div::after { transform: rotate(225deg); }
#cmplz-document .cmplz-dropdown .cookies-per-purpose { border-color: var(--linea); background-color: var(--linea); }
#cmplz-document .cmplz-dropdown .cookies-per-purpose div:nth-child(n) { background-color: var(--fondo); }
#cmplz-document .cmplz-dropdown .cookies-per-purpose div:nth-child(n):is(.name-header, .retention-header, .function-header) { background-color: var(--fondo-2); }
#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category { border: 1px solid var(--linea); border-radius: var(--raggio); background: var(--fondo-2); }
#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header { background: transparent; }
#cmplz-manage-consent-container .cmplz-icon svg { fill: currentColor; }

/* ---------- Contrasto forzato, stampa ---------- */
@media (forced-colors: active) {
	#cmplz-cookiebanner-container .cmplz-banner-checkbox .cmplz-label::before { forced-color-adjust: none; background: Canvas; border: 1px solid CanvasText; }
	#cmplz-cookiebanner-container .cmplz-banner-checkbox .cmplz-label::after { forced-color-adjust: none; background: CanvasText; }
	#cmplz-cookiebanner-container .cmplz-banner-checkbox input:checked + .cmplz-label::before { background: Highlight; }
}
@media print {
	#cmplz-cookiebanner-container, #cmplz-manage-consent { display: none; }
}
