/*! Kit cookie e privacy (Italia) – stile v1.0.0
 * Si personalizza solo con le variabili --cc-* (impostate da legal-config.js, sezione "theme").
 */
.cc-root{
  --cc-bg:#161019; --cc-fg:#FFF5FB; --cc-muted:#D4C3D2; --cc-border:rgba(255,255,255,.16);
  --cc-accent:#FF4DB8; --cc-accent-fg:#1A0612; --cc-focus:#45E6FF; --cc-overlay:rgba(5,3,9,.72);
  --cc-radius:20px; --cc-font:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --cc-shadow:0 24px 60px -18px rgba(0,0,0,.65), 0 0 0 1px var(--cc-border);
  font-family:var(--cc-font); font-size:16px; line-height:1.5; color:var(--cc-fg);
}
.cc-root[data-mode="light"]{--cc-shadow:0 24px 60px -24px rgba(20,12,24,.45), 0 0 0 1px var(--cc-border)}
.cc-root *, .cc-root *::before, .cc-root *::after{box-sizing:border-box}
.cc-root [hidden]{display:none !important}
.cc-root a{color:inherit; text-decoration:underline; text-underline-offset:3px}
.cc-root a:hover{color:var(--cc-accent)}
.cc-root :focus-visible{outline:3px solid var(--cc-focus); outline-offset:2px; border-radius:8px}
.cc-root :focus:not(:focus-visible){outline:none}
.cc-root :is(.cc-btn,.cc-switch):focus-visible{border-radius:999px}
.cc-root .cc-x:focus-visible{border-radius:50%}

/* ---------- primo livello ---------- */
.cc-banner{
  position:fixed; z-index:2147483000; left:12px; right:12px; bottom:12px;
  max-height:calc(100vh - 24px); overflow:auto; overscroll-behavior:contain;
  padding:20px 20px 18px; border-radius:var(--cc-radius); background:var(--cc-bg); color:var(--cc-fg);
  box-shadow:var(--cc-shadow); animation:cc-in .35s cubic-bezier(.22,1,.36,1) both;
  padding-bottom:calc(18px + env(safe-area-inset-bottom));
}
.cc-banner:focus{outline:none}
.cc-banner:focus-visible{outline:3px solid var(--cc-focus); outline-offset:2px}
@media (min-width:720px){
  .cc-root[data-pos="box-left"] .cc-banner{right:auto; left:20px; bottom:20px; width:min(440px, calc(100vw - 40px))}
  .cc-root[data-pos="center"] .cc-banner{left:50%; right:auto; bottom:auto; top:50%; width:min(560px, calc(100vw - 40px)); transform:translate(-50%,-50%); animation:none}
  .cc-root[data-pos="bar"] .cc-banner{left:20px; right:20px; bottom:20px; display:grid; grid-template-columns:1fr auto; column-gap:28px; align-items:end}
  .cc-root[data-pos="bar"] .cc-banner .cc-actions{grid-column:2; grid-row:1 / span 2}
}
.cc-title{margin:0 40px 6px 0; font-size:1.12rem; line-height:1.25; font-weight:800; letter-spacing:-.01em; color:var(--cc-fg)}
.cc-text{margin:0; font-size:.93rem; color:var(--cc-muted)}
.cc-text a{color:var(--cc-fg); font-weight:600}
.cc-x{
  position:absolute; top:10px; right:10px; display:grid; place-items:center; width:40px; height:40px;
  padding:0; border:0; border-radius:50%; background:transparent; color:var(--cc-fg); cursor:pointer;
}
.cc-x:hover{background:color-mix(in srgb, var(--cc-fg) 12%, transparent)}

/* "Accetta" e "Rifiuta" hanno la stessa classe: stessa forma, dimensione e contrasto */
.cc-actions{display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:16px}
.cc-btn{
  display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:.7em 1em;
  border:2px solid var(--cc-accent); border-radius:999px; background:var(--cc-accent); color:var(--cc-accent-fg);
  font:inherit; font-size:.95rem; font-weight:800; line-height:1.15; text-align:center; cursor:pointer;
  transition:filter .2s, transform .2s;
}
.cc-btn:hover{filter:brightness(1.08)}
.cc-btn:active{transform:scale(.98)}
.cc-btn-alt{grid-column:1 / -1; background:transparent; color:var(--cc-fg); border-color:var(--cc-border)}
.cc-btn-alt:hover{border-color:var(--cc-fg); filter:none}

/* ---------- secondo livello ---------- */
html.cc-lock{overflow:hidden}
.cc-overlay{position:fixed; inset:0; z-index:2147483001; display:grid; place-items:center; padding:12px; background:var(--cc-overlay)}
.cc-prefs{
  position:relative; display:flex; flex-direction:column; width:min(640px,100%); max-height:min(88vh, 860px);
  border-radius:var(--cc-radius); background:var(--cc-bg); color:var(--cc-fg); box-shadow:var(--cc-shadow);
  animation:cc-in .3s cubic-bezier(.22,1,.36,1) both;
}
.cc-prefs:focus{outline:none}
.cc-prefs-head{position:relative; padding:20px 20px 4px}
.cc-prefs-body{overflow:auto; overscroll-behavior:contain; padding:4px 20px 8px}
.cc-prefs .cc-actions{grid-template-columns:repeat(3,1fr); padding:14px 20px calc(18px + env(safe-area-inset-bottom)); margin:0; border-top:1px solid var(--cc-border)}
.cc-prefs .cc-btn-alt{grid-column:auto}
@media (max-width:560px){
  .cc-overlay{padding:0; place-items:end stretch}
  .cc-prefs{width:100%; max-height:92vh; border-radius:var(--cc-radius) var(--cc-radius) 0 0}
  .cc-prefs .cc-actions{grid-template-columns:1fr 1fr}
  .cc-prefs .cc-btn-alt{grid-column:1 / -1}
}
/* schermi bassi o zoom forte: il pannello scorre tutto insieme */
@media (max-height:480px){
  .cc-prefs{overflow:auto; overscroll-behavior:contain}
  .cc-prefs-body{overflow:visible}
}
.cc-cat{padding:16px 0; border-bottom:1px solid var(--cc-border)}
.cc-cat:last-child{border-bottom:0}
.cc-cat-head{display:flex; align-items:center; justify-content:space-between; gap:12px}
.cc-cat h3{margin:0; font-size:1rem; font-weight:800; color:var(--cc-fg)}
.cc-cat p{margin:6px 0 0; font-size:.9rem; color:var(--cc-muted)}
.cc-cat details{margin-top:8px; font-size:.86rem; color:var(--cc-muted)}
.cc-cat summary{cursor:pointer; font-weight:700; color:var(--cc-fg); width:fit-content}
.cc-cat ul{margin:8px 0 0; padding-left:1.1em}
.cc-cat li{margin:4px 0}
.cc-cat li b{color:var(--cc-fg)}
.cc-always{flex:none; font-size:.8rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--cc-fg); opacity:.85}

.cc-switch{
  position:relative; flex:none; width:52px; height:30px; padding:0; border:2px solid var(--cc-muted); border-radius:999px;
  background:transparent; cursor:pointer; transition:background-color .2s, border-color .2s;
}
.cc-knob{position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:50%; background:var(--cc-muted); transition:transform .2s, background-color .2s}
.cc-switch[aria-checked="true"]{background:var(--cc-accent); border-color:var(--cc-accent)}
.cc-switch[aria-checked="true"] .cc-knob{transform:translateX(22px); background:var(--cc-accent-fg)}

/* ---------- contenuti bloccati ---------- */
iframe[data-cc]:not([src]){display:none !important}
.cc-placeholder{
  display:grid; gap:8px; place-content:center; justify-items:center; min-height:200px; padding:20px; text-align:center;
  border-radius:16px; background:#141019; color:#E9DCE7; box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);
  font-family:var(--cc-font, system-ui, sans-serif); font-size:.92rem;
}
.cc-placeholder p{margin:0}
.cc-placeholder a{color:inherit}
.cc-ph-title{font-weight:800; color:#fff}
.cc-placeholder .cc-btn{width:auto; --cc-accent:#FF4DB8; --cc-accent-fg:#1A0612}

/* ---------- tabella della cookie policy ---------- */
.cc-table-wrap{overflow-x:auto; margin:16px 0 28px}
.cc-table{width:100%; border-collapse:collapse; font-size:.92rem}
.cc-table caption{text-align:left; font-weight:800; padding-bottom:8px}
.cc-table th, .cc-table td{padding:10px 12px; text-align:left; vertical-align:top; border-bottom:1px solid currentColor; border-bottom-color:color-mix(in srgb, currentColor 18%, transparent)}
.cc-table th{font-size:.78rem; letter-spacing:.08em; text-transform:uppercase}
.cc-table code{font-size:.92em; word-break:break-all}
.cc-table small{opacity:.8}
@media (max-width:720px){
  .cc-table thead{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0)}
  .cc-table, .cc-table tbody, .cc-table tr, .cc-table td{display:block; width:100%}
  .cc-table tr{padding:10px 0; border-bottom:1px solid color-mix(in srgb, currentColor 22%, transparent)}
  .cc-table td{border:0; padding:4px 0}
  .cc-table td::before{content:attr(data-label); content:attr(data-label) / ""; display:block; font-size:.72rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; opacity:.75}
}

@keyframes cc-in{from{opacity:0; transform:translateY(14px)} to{opacity:1; transform:none}}
@media (prefers-reduced-motion:reduce){
  .cc-banner, .cc-prefs{animation:none}
  .cc-btn, .cc-switch, .cc-knob{transition:none}
}
@media (forced-colors:active){
  .cc-banner, .cc-prefs{border:2px solid CanvasText}
  .cc-btn, .cc-switch{border:2px solid ButtonText}
  .cc-knob{background:ButtonText}
  .cc-switch[aria-checked="true"] .cc-knob{background:Highlight}
}
