/*
 * Abello Restyling — banner del consenso ai cookie (2026-10-10, inc/consenso.php e js/consenso.js).
 * Riquadro carta in basso, non blocca la pagina; "Rifiuta" e "Accetta tutto" identici (linee guida del Garante).
 * Solo variabili di tokens.css.
 */

.abello-consenso {
	position: fixed;
	inset-inline: var(--ab-gutter);
	bottom: var(--ab-gutter);
	z-index: var(--ab-z-overlay);
	display: flex;
	justify-content: center;
	pointer-events: none;
}
.abello-consenso[hidden],
.abello-consenso__livello[hidden] { display: none; }

.abello-consenso__box {
	position: relative;
	width: 100%;
	max-width: var(--ab-width-text);
	max-height: calc(var(--ab-vh) - 2 * var(--ab-gutter));
	overflow-y: auto;
	padding: var(--ab-space-5) var(--ab-space-5) var(--ab-space-5);
	border: var(--ab-border-hair) solid var(--ab-color-border-strong);
	border-top: var(--ab-border-rule) solid var(--ab-color-action);
	border-radius: var(--ab-radius-2);
	background: var(--ab-color-surface);
	box-shadow: var(--ab-shadow-2);
	color: var(--ab-color-text);
	font-family: var(--ab-font-text);
	font-size: var(--ab-text-sm);
	line-height: var(--ab-leading-text);
	pointer-events: auto;
}

.abello-consenso__titolo {
	margin: 0 var(--ab-tap) var(--ab-space-2) 0;
	font-family: var(--ab-font-text);
	font-size: var(--ab-text-lg);
	font-weight: var(--ab-weight-semibold);
	line-height: var(--ab-leading-snug);
	color: var(--ab-color-text);
}
.abello-consenso__titolo:focus { outline: none; }
.abello-consenso__titolo:focus-visible { outline: var(--ab-focus-ring) solid var(--ab-color-focus); outline-offset: var(--ab-focus-offset); }

.abello-consenso__testo,
.abello-consenso__descrizione,
.abello-consenso__nota { margin: 0; max-width: var(--ab-measure); }
.abello-consenso a {
	color: var(--ab-color-link);
	text-decoration: underline;
	text-underline-offset: var(--ab-underline-offset);
}
.abello-consenso a:hover { color: var(--ab-color-link-hover); }

/* ---------------------------------------------------------------- Pulsanti */
.abello-consenso__azioni {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--ab-space-3);
	margin-top: var(--ab-space-4);
}
.abello-consenso__pulsante {
	flex: 1 1 auto;
	min-height: var(--ab-tap);
	padding: var(--ab-space-2) var(--ab-space-5);
	border: var(--ab-border-hair) solid var(--ab-color-action);
	border-radius: var(--ab-radius-1);
	background: var(--ab-color-action);
	color: var(--ab-color-on-action);
	font-family: var(--ab-font-text);
	font-size: var(--ab-text-ui);
	font-weight: var(--ab-weight-semibold);
	line-height: var(--ab-leading-snug);
	cursor: pointer;
	transition: background-color var(--ab-duration-fast) var(--ab-ease), border-color var(--ab-duration-fast) var(--ab-ease);
}
.abello-consenso__pulsante:hover { background: var(--ab-color-action-hover); border-color: var(--ab-color-action-hover); }
.abello-consenso__link {
	min-height: var(--ab-tap);
	padding: var(--ab-space-2) var(--ab-space-1);
	border: 0;
	background: transparent;
	color: var(--ab-color-link);
	font-family: var(--ab-font-text);
	font-size: var(--ab-text-ui);
	text-decoration: underline;
	text-underline-offset: var(--ab-underline-offset);
	cursor: pointer;
}
.abello-consenso__link:hover { color: var(--ab-color-link-hover); }
.abello-consenso__pulsante:focus-visible,
.abello-consenso__link:focus-visible,
.abello-consenso__chiudi:focus-visible,
.abello-consenso a:focus-visible,
.abello-consenso__interruttore:focus-visible {
	outline: var(--ab-focus-ring) solid var(--ab-color-focus);
	outline-offset: var(--ab-focus-offset);
}

.abello-consenso__chiudi {
	position: absolute;
	top: var(--ab-space-2);
	right: var(--ab-space-2);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--ab-tap);
	height: var(--ab-tap);
	padding: 0;
	border: 0;
	border-radius: var(--ab-radius-1);
	background: transparent;
	color: var(--ab-color-text-muted);
	cursor: pointer;
}
.abello-consenso__chiudi:hover { color: var(--ab-color-text); }
.abello-consenso__chiudi svg {
	width: var(--ab-icon);
	height: var(--ab-icon);
	fill: none;
	stroke: currentColor;
	stroke-width: var(--ab-border-rule);
	stroke-linecap: round;
}

/* ---------------------------------------------------------------- Preferenze */
.abello-consenso__categorie { margin: var(--ab-space-3) 0 0; padding: 0; list-style: none; }
.abello-consenso__categoria { padding: var(--ab-space-3) 0; border-top: var(--ab-border-hair) solid var(--ab-color-border); }
.abello-consenso__categoria:last-child { border-bottom: var(--ab-border-hair) solid var(--ab-color-border); }
.abello-consenso__voce {
	display: flex;
	align-items: center;
	gap: var(--ab-space-3);
	min-height: var(--ab-tap);
	font-size: var(--ab-text-ui);
	font-weight: var(--ab-weight-semibold);
	cursor: pointer;
}
.abello-consenso__voce input {
	flex: none;
	width: var(--ab-check);
	height: var(--ab-check);
	margin: 0;
	accent-color: var(--ab-color-action);
	cursor: pointer;
}
.abello-consenso__voce input:disabled { cursor: default; }
.abello-consenso__stato { font-weight: var(--ab-weight-regular); color: var(--ab-color-text-muted); }
.abello-consenso__descrizione { padding-left: calc(var(--ab-check) + var(--ab-space-3)); color: var(--ab-color-text-muted); }
.abello-consenso__nota { margin-top: var(--ab-space-3); }

/* il pulsante WhatsApp del tema non deve coprire il banner */
body:has(.abello-consenso:not([hidden])) .logo-whats-app { visibility: hidden; }

@media (max-width: 560px) {
	.abello-consenso { inset-inline: 0; bottom: 0; }
	.abello-consenso__box { border-radius: var(--ab-radius-0); border-inline: 0; border-bottom: 0; padding: var(--ab-space-4) var(--ab-gutter); }
	.abello-consenso__pulsante { flex-basis: 100%; min-height: var(--ab-tap-lg); }
	.abello-consenso__link { margin-inline: auto; }
}

/* ---------------------------------------------------------------- "Preferenze cookie" nel footer, come i link accanto */
.abello-footer__preferenze {
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--ab-color-on-dark-muted);
	font: inherit;
	text-decoration: underline;
	text-decoration-color: color-mix(in srgb, var(--ab-color-accent-on-dark) 60%, transparent);
	text-underline-offset: var(--ab-underline-offset);
	cursor: pointer;
}
.abello-footer__preferenze:hover,
.abello-footer__preferenze:focus-visible { color: var(--ab-color-on-dark); text-decoration-color: currentColor; }