/**
 * Cookie policy generata: impaginazione del documento.
 *
 * Caricato SOLO nelle pagine che contengono lo shortcode (e nell'anteprima
 * admin). Font, colore del testo e allineamento restano quelli del tema: qui
 * non c'e' nessuna dichiarazione di font-family. I colori derivano da
 * currentColor e dall'accento del banner, quindi il documento sta bene su
 * qualunque tema, chiaro o scuro, senza configurare niente.
 *
 * Struttura: testata, riepilogo, poi due colonne (sommario sticky + corpo).
 * Le schede servizio sono <details> nativi: nessun JavaScript.
 */

.cf-cookiepolicy {
	--cfp-a: var( --cf-accent, #0a6f59 );
	--cfp-line: color-mix( in srgb, currentColor 15%, transparent );
	--cfp-line-soft: color-mix( in srgb, currentColor 9%, transparent );
	--cfp-soft: color-mix( in srgb, currentColor 4%, transparent );
	--cfp-mute: color-mix( in srgb, currentColor 62%, transparent );

	/*
	 * Font e colore restano del tema, ma mettiamo un TETTO alla dimensione:
	 * un tema con base 22px trasforma un documento lungo in un cartellone.
	 * Con min() i temi con testo piccolo restano intatti.
	 */
	font-size: min( 1em, 17px );
	line-height: 1.65;
	container-type: inline-size;
}

/* Fallback per browser senza color-mix (Safari < 16.2). */
@supports not ( color: color-mix( in srgb, red 50%, blue ) ) {
	.cf-cookiepolicy {
		--cfp-line: rgba( 128, 128, 128, .3 );
		--cfp-line-soft: rgba( 128, 128, 128, .18 );
		--cfp-soft: rgba( 128, 128, 128, .08 );
		--cfp-mute: rgba( 128, 128, 128, .95 );
	}
}

/*
 * Documento a larghezza piena: esce dalla colonna stretta del tema restando
 * centrato. Disattivabile dalle impostazioni se il tema ritaglia il contenuto.
 */
.cf-cookiepolicy.cf-cp--wide {
	position: relative;
	left: 50%;
	transform: translateX( -50% );
	width: min( 1180px, 94vw );
	max-width: none;
}

.cf-cookiepolicy p {
	margin: 0 0 1em;
}

.cf-cookiepolicy h2,
.cf-cookiepolicy h3,
.cf-cookiepolicy h4 {
	line-height: 1.25;
}

/* ----------------------------------------------------------------- testata --- */
.cf-cookiepolicy .cf-cp-hero {
	margin-bottom: 1.75em;
}

.cf-cookiepolicy .cf-cp-lead {
	font-size: 1.15em;
	line-height: 1.5;
	color: var( --cfp-mute );
	margin-bottom: .5em;
}

.cf-cookiepolicy .cf-cp-stamp {
	font-size: .85em;
	color: var( --cfp-mute );
	margin: 0;
}

/* --------------------------------------------------------------- riepilogo --- */
.cf-cookiepolicy .cf-cp-summary {
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax( 10em, 1fr ) );
	gap: 1px;
	background: var( --cfp-line-soft );
	border: 1px solid var( --cfp-line-soft );
	border-radius: 14px;
	overflow: hidden;
	margin: 0 0 2.5em;
}

.cf-cookiepolicy .cf-cp-summary__item {
	background: var( --cfp-soft );
	padding: 1.1em .9em;
	text-align: center;
}

.cf-cookiepolicy .cf-cp-summary__n {
	display: block;
	font-size: 2em;
	font-weight: 700;
	line-height: 1.1;
	color: var( --cfp-a );
	font-variant-numeric: tabular-nums;
}

.cf-cookiepolicy .cf-cp-summary__l {
	display: block;
	font-size: .82em;
	line-height: 1.35;
	color: var( --cfp-mute );
	margin-top: .3em;
	text-wrap: balance;
}

/* ------------------------------------------------------------ due colonne --- */
.cf-cookiepolicy .cf-cp-layout {
	display: block;
}

.cf-cookiepolicy .cf-cp-side {
	margin: 0 0 2em;
}

.cf-cookiepolicy .cf-cp-toc {
	border: 1px solid var( --cfp-line );
	border-radius: 14px;
	padding: 1.1em 1.3em 1.2em;
}

.cf-cookiepolicy .cf-cp-toc__title {
	margin: 0 0 .7em;
	font-weight: 700;
	font-size: .72em;
	text-transform: uppercase;
	letter-spacing: .1em;
	color: var( --cfp-mute );
}

.cf-cookiepolicy .cf-cp-toc ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: .1em;
}

.cf-cookiepolicy .cf-cp-toc li {
	margin: 0;
}

.cf-cookiepolicy .cf-cp-toc a {
	display: block;
	padding: .4em .7em;
	border-radius: 8px;
	font-size: .93em;
	text-decoration: none;
	color: inherit;
	border-left: 2px solid transparent;
}

.cf-cookiepolicy .cf-cp-toc a:hover,
.cf-cookiepolicy .cf-cp-toc a:focus-visible {
	background: var( --cfp-soft );
	border-left-color: var( --cfp-a );
	color: var( --cfp-a );
}

/*
 * Sopra i 900px di CONTENITORE (non di finestra: cosi' funziona anche dentro
 * colonne strette) il sommario passa a fianco e resta agganciato.
 */
@container ( min-width: 900px ) {
	.cf-cookiepolicy .cf-cp-layout {
		display: grid;
		grid-template-columns: 15em minmax( 0, 1fr );
		gap: 3em;
		align-items: start;
	}

	.cf-cookiepolicy .cf-cp-side {
		position: sticky;
		top: 2em;
		margin: 0;
	}

	.cf-cookiepolicy .cf-cp-toc {
		border: 0;
		border-left: 1px solid var( --cfp-line );
		border-radius: 0;
		padding: .2em 0 .2em 1em;
	}
}

/* ------------------------------------------------------------- sezioni --- */
.cf-cookiepolicy .cf-cp-section + .cf-cp-section {
	margin-top: 3em;
	padding-top: 2.4em;
	border-top: 1px solid var( --cfp-line );
}

.cf-cookiepolicy .cf-cp-h2 {
	display: flex;
	align-items: center;
	gap: .6em;
	font-size: 1.45em;
	font-weight: 700;
	margin: 0 0 .9em;
	scroll-margin-top: 1.5em;
}

.cf-cookiepolicy .cf-cp-h2__ico {
	flex: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2em;
	height: 2em;
	border-radius: 50%;
	border: 1px solid color-mix( in srgb, var( --cfp-a ) 35%, transparent );
	color: var( --cfp-a );
	background: color-mix( in srgb, var( --cfp-a ) 7%, transparent );
}

.cf-cookiepolicy .cf-cp-ico {
	width: 1.05em;
	height: 1.05em;
}

/* ---------------------------------------------------------- categorie --- */
.cf-cookiepolicy .cf-cp-cat {
	margin-top: 2.2em;
}

.cf-cookiepolicy .cf-cp-cat__title {
	display: flex;
	align-items: center;
	gap: .5em;
	font-size: 1.12em;
	font-weight: 700;
	margin: 0 0 .4em;
	color: var( --cfp-a );
}

.cf-cookiepolicy .cf-cp-cat__title .cf-cp-ico {
	width: 1.15em;
	height: 1.15em;
}

.cf-cookiepolicy .cf-cp-purpose {
	color: var( --cfp-mute );
	margin-bottom: 1.2em;
	font-size: .97em;
}

/* -------------------------------------------------- schede servizio --- */
.cf-cookiepolicy .cf-cp-service {
	border: 1px solid var( --cfp-line );
	border-radius: 14px;
	margin: 0 0 .7em;
	overflow: hidden;
	background: transparent;
	transition: border-color .15s ease;
}

.cf-cookiepolicy .cf-cp-service[open] {
	border-color: color-mix( in srgb, var( --cfp-a ) 35%, transparent );
}

.cf-cookiepolicy .cf-cp-row {
	display: flex;
	align-items: center;
	gap: .9em;
	padding: .85em 1em;
	cursor: pointer;
	list-style: none;
	user-select: none;
}

/* Via il triangolino nativo: la nostra affordance e' il + a destra. */
.cf-cookiepolicy .cf-cp-row::-webkit-details-marker {
	display: none;
}

.cf-cookiepolicy .cf-cp-row::marker {
	content: '';
}

.cf-cookiepolicy .cf-cp-row:hover {
	background: var( --cfp-soft );
}

.cf-cookiepolicy .cf-cp-logo {
	flex: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5em;
	height: 2.5em;
	border-radius: 10px;
	font-weight: 700;
	font-size: 1em;
	color: hsl( var( --cfp-hue, 160 ) 45% 32% );
	background: hsl( var( --cfp-hue, 160 ) 55% 94% );
	border: 1px solid hsl( var( --cfp-hue, 160 ) 40% 86% );
}

.cf-cookiepolicy .cf-cp-row__id {
	flex: 1 1 auto;
	min-width: 0;
}

.cf-cookiepolicy .cf-cp-row__name {
	display: block;
	font-weight: 700;
	font-size: 1em;
}

.cf-cookiepolicy .cf-cp-chips {
	display: flex;
	flex-wrap: wrap;
	gap: .3em .9em;
	margin-top: .15em;
}

.cf-cookiepolicy .cf-cp-chip {
	display: inline-flex;
	align-items: center;
	gap: .35em;
	font-size: .8em;
	color: var( --cfp-mute );
	white-space: nowrap;
}

.cf-cookiepolicy .cf-cp-chip .cf-cp-ico {
	width: 1.05em;
	height: 1.05em;
	opacity: .75;
}

.cf-cookiepolicy .cf-cp-badge {
	flex: none;
	font-size: .72em;
	font-weight: 600;
	line-height: 1;
	padding: .45em .7em;
	border-radius: 999px;
	white-space: nowrap;
	border: 1px solid var( --cfp-line );
	color: var( --cfp-mute );
}

.cf-cookiepolicy .cf-cp-badge--declared {
	color: hsl( 28 75% 33% );
	border-color: hsl( 28 70% 78% );
	background: hsl( 28 80% 96% );
}

.cf-cookiepolicy .cf-cp-badge--gated {
	color: var( --cfp-a );
	border-color: color-mix( in srgb, var( --cfp-a ) 40%, transparent );
	background: color-mix( in srgb, var( --cfp-a ) 8%, transparent );
}

/* Il "+" che diventa "−" quando la scheda e' aperta. */
.cf-cookiepolicy .cf-cp-plus {
	flex: none;
	position: relative;
	width: 1.6em;
	height: 1.6em;
	border-radius: 50%;
	border: 1px solid color-mix( in srgb, var( --cfp-a ) 40%, transparent );
	color: var( --cfp-a );
}

.cf-cookiepolicy .cf-cp-plus::before,
.cf-cookiepolicy .cf-cp-plus::after {
	content: '';
	position: absolute;
	inset: 50% 25%;
	border-top: 1.5px solid currentColor;
	transform: translateY( -50% );
}

.cf-cookiepolicy .cf-cp-plus::after {
	transform: translateY( -50% ) rotate( 90deg );
	transition: opacity .15s ease, transform .15s ease;
}

.cf-cookiepolicy .cf-cp-service[open] .cf-cp-plus::after {
	opacity: 0;
	transform: translateY( -50% ) rotate( 0deg );
}

@media ( max-width: 560px ) {
	.cf-cookiepolicy .cf-cp-row {
		flex-wrap: wrap;
		gap: .6em .8em;
	}

	.cf-cookiepolicy .cf-cp-row__id {
		flex: 1 1 60%;
	}

	.cf-cookiepolicy .cf-cp-badge {
		order: 3;
	}
}

/* ------------------------------------------------------- dettaglio --- */
.cf-cookiepolicy .cf-cp-detail {
	padding: .2em 1.2em 1.2em;
	border-top: 1px solid var( --cfp-line-soft );
	margin-top: -1px;
}

.cf-cookiepolicy .cf-cp-detail__desc {
	margin: 1em 0;
	font-size: .97em;
}

.cf-cookiepolicy .cf-cp-meta {
	display: grid;
	grid-template-columns: minmax( 8em, 12em ) 1fr;
	gap: .4em 1.4em;
	margin: 0;
	font-size: .93em;
	padding-top: .9em;
	border-top: 1px solid var( --cfp-line-soft );
}

.cf-cookiepolicy .cf-cp-meta dt {
	font-weight: 600;
	color: var( --cfp-mute );
}

.cf-cookiepolicy .cf-cp-meta dd {
	margin: 0;
}

@container ( max-width: 640px ) {
	.cf-cookiepolicy .cf-cp-meta {
		grid-template-columns: 1fr;
		gap: 0;
	}

	.cf-cookiepolicy .cf-cp-meta dt {
		font-size: .82em;
		text-transform: uppercase;
		letter-spacing: .05em;
		margin-top: .8em;
	}
}

/* --------------------------------------------------------- tabelle --- */
.cf-cookiepolicy .cf-cp-cookies {
	width: 100%;
	border-collapse: collapse;
	margin: 1.3em 0 0;
	font-size: .9em;
}

.cf-cookiepolicy .cf-cp-cookies caption {
	text-align: left;
	font-size: .8em;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .07em;
	color: var( --cfp-mute );
	padding: 0 0 .5em;
}

.cf-cookiepolicy .cf-cp-cookies th,
.cf-cookiepolicy .cf-cp-cookies td {
	text-align: left;
	padding: .45em .7em;
	border-bottom: 1px solid var( --cfp-line-soft );
	vertical-align: top;
}

.cf-cookiepolicy .cf-cp-cookies tr:last-child td {
	border-bottom: 0;
}

.cf-cookiepolicy .cf-cp-cookies thead th {
	font-size: .85em;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var( --cfp-mute );
	border-bottom-color: var( --cfp-line );
}

/* I nomi dei cookie non vanno spezzati a meta'. */
.cf-cookiepolicy .cf-cp-cookies td:first-child {
	white-space: nowrap;
	width: 1%;
}

.cf-cookiepolicy .cf-cp-cookies code {
	font-size: .92em;
	background: var( --cfp-soft );
	padding: .15em .4em;
	border-radius: 5px;
	white-space: nowrap;
}

.cf-cookiepolicy .cf-cp-scroll {
	overflow-x: auto;
}

.cf-cookiepolicy .cf-cp-cookies--wide {
	min-width: 24em;
}

.cf-cookiepolicy .cf-cp-cookies--wide td:nth-child( 2 ) {
	white-space: normal;
	min-width: 11em;
}

.cf-cookiepolicy .cf-cp-cookies--wide td:last-child {
	white-space: normal;
	min-width: 5em;
	color: var( --cfp-mute );
}

/* ----------------------------------------------------------- varie --- */
.cf-cookiepolicy .cf-cp-btn {
	display: inline-block;
	background: var( --cfp-a );
	color: #fff;
	border: 0;
	border-radius: 10px;
	padding: .8em 1.4em;
	font: inherit;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	transition: filter .15s ease;
}

.cf-cookiepolicy .cf-cp-btn:hover,
.cf-cookiepolicy .cf-cp-btn:focus-visible {
	filter: brightness( 1.12 );
}

.cf-cookiepolicy .cf-cp-links {
	margin: 0 0 1.2em;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: .5em .7em;
}

.cf-cookiepolicy .cf-cp-links li {
	margin: 0;
}

.cf-cookiepolicy .cf-cp-links a {
	display: inline-block;
	border: 1px solid var( --cfp-line );
	border-radius: 999px;
	padding: .35em .9em;
	font-size: .88em;
	text-decoration: none;
}

.cf-cookiepolicy .cf-cp-links a:hover {
	border-color: var( --cfp-a );
	color: var( --cfp-a );
}

.cf-cookiepolicy .cf-cp-controller {
	border-left: 3px solid var( --cfp-a );
	padding: .2em 0 .2em 1em;
}

.cf-cookiepolicy .cf-cp-defs {
	margin: 0;
	display: grid;
	grid-template-columns: minmax( 10em, 15em ) 1fr;
	gap: .9em 1.6em;
}

.cf-cookiepolicy .cf-cp-defs dt {
	font-weight: 700;
	font-size: .95em;
}

.cf-cookiepolicy .cf-cp-defs dd {
	margin: 0;
	color: var( --cfp-mute );
	font-size: .95em;
}

@container ( max-width: 640px ) {
	.cf-cookiepolicy .cf-cp-defs {
		grid-template-columns: 1fr;
		gap: .15em;
	}

	.cf-cookiepolicy .cf-cp-defs dd {
		margin-bottom: .9em;
	}
}

.cf-cookiepolicy .cf-cp-note {
	color: var( --cfp-mute );
	font-size: .88em;
}

/* ---------------------------------------------------------- stampa --- */
@media print {
	.cf-cookiepolicy .cf-cp-btn,
	.cf-cookiepolicy .cf-cp-side,
	.cf-cookiepolicy .cf-cp-plus {
		display: none;
	}

	/* In stampa le schede vanno tutte aperte: e' un documento, non una UI. */
	.cf-cookiepolicy .cf-cp-detail {
		display: block !important;
	}

	.cf-cookiepolicy .cf-cp-service {
		break-inside: avoid;
	}

	.cf-cookiepolicy.cf-cp--wide {
		position: static;
		left: auto;
		transform: none;
		width: auto;
	}
}