/*
 * Il banner dei cookie (25/10/2026). Lo stesso del Box Office
 * (`CookieBanner.tsx`) e di Studio (`sito.css`, `.sito-cookie`): stesse misure,
 * stessi tasti. Sul computer un riquadro in basso a sinistra largo 400 px, sul
 * telefono una fascia in fondo.
 */
.cm-cookie {
	position: fixed; left: 20px; bottom: 20px; z-index: 1300; box-sizing: border-box; width: 400px;
	display: flex; flex-direction: column; gap: 16px; padding: 22px 22px 18px;
	border: 1px solid var(--cm-linea); border-radius: 15px; background: var(--cm-grafite);
	box-shadow: 0 20px 50px rgba(0, 0, 0, .55); color: rgba(255, 255, 255, .86); font: 16px/1.5 var(--cm-font);
}
.cm-cookie p { margin: 0; padding-right: 30px; }
.cm-cookie a, .cm-cookie-link { color: var(--cm-rosa); text-decoration: underline; text-underline-offset: 3px; }
.cm-cookie-x {
	position: absolute; top: 4px; right: 4px; display: grid; place-items: center; width: 44px; height: 44px; padding: 0;
	border: 0; border-radius: 50%; background: transparent; color: rgba(255, 255, 255, .86); cursor: pointer;
}
.cm-cookie-x:hover { background: rgba(255, 255, 255, .06); color: var(--cm-bianco); }
/* «Accetta» e «Personalizza» affiancati, «Rifiuta» sotto a tutta larghezza (utente, 25/10/2026). */
.cm-cookie-tasti { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.cm-cookie-tasto {
	box-sizing: border-box; height: 50px; padding: 0 16px; border: 2px solid var(--cm-bordeaux); border-radius: 15px;
	background: transparent; color: var(--cm-bianco); font: 700 15px/1 var(--cm-font); letter-spacing: .14em;
	text-transform: uppercase; cursor: pointer; transition: background .2s var(--cm-curva);
}
.cm-cookie-tasto:hover { background: var(--cm-bordeaux); }
.cm-cookie-pieno { background: var(--cm-bordeaux); }
.cm-cookie-pieno:hover { background: var(--cm-bordeaux-scuro); border-color: var(--cm-bordeaux-scuro); }
.cm-cookie-largo { grid-column: 1 / -1; }

.cm-cookie-velo {
	position: fixed; inset: 0; z-index: 1400; display: grid; place-items: center; padding: 16px;
	background: rgba(0, 0, 0, .6); font-family: var(--cm-font);
}
.cm-cookie-preferenze {
	position: relative; box-sizing: border-box; width: 100%; max-width: 600px; max-height: calc(100dvh - 32px); overflow-y: auto;
	border: 1px solid var(--cm-linea); border-radius: 15px; background: var(--cm-grafite); color: var(--cm-bianco); outline: none;
}
.cm-cookie-testa { display: flex; align-items: center; justify-content: space-between; padding: 14px 12px 14px 24px; border-bottom: 1px solid var(--cm-linea); }
.cm-cookie-testa h2 { margin: 0; font-size: 22px; font-weight: 700; line-height: 1.2; text-transform: none; letter-spacing: 0; }
.cm-cookie-testa .cm-cookie-x { position: static; }
.cm-cookie-voci { padding: 4px 24px; }
.cm-cookie-voci section { padding: 18px 0; }
.cm-cookie-voci section + section { border-top: 1px solid var(--cm-linea); }
.cm-cookie-voci p { margin: 6px 0 0; color: var(--cm-tenue); font-size: 15px; line-height: 1.5; }
.cm-cookie-riga { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.cm-cookie-tenue { flex-shrink: 0; color: var(--cm-tenue); font-size: 15px; }
.cm-cookie-azioni { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 24px; border-top: 1px solid var(--cm-linea); }
.cm-cookie-switch {
	position: relative; flex-shrink: 0; width: 52px; height: 30px; padding: 0; border: 0; border-radius: 15px;
	background: rgba(255, 255, 255, .22); cursor: pointer; transition: background .2s var(--cm-curva);
}
.cm-cookie-switch span {
	position: absolute; top: 4px; left: 4px; width: 22px; height: 22px; border-radius: 50%; background: var(--cm-bianco);
	transition: transform .2s var(--cm-curva);
}
.cm-cookie-switch.acceso { background: var(--cm-bordeaux); }
.cm-cookie-switch.acceso span { transform: translateX(22px); }

@media (max-width: 900px) {
	.cm-cookie { left: 8px; right: 8px; bottom: 8px; width: auto; max-height: 70dvh; overflow-y: auto; }
}