/* =====================================================================
   Cookie Consent — stile self-hosted, senza dipendenze
   Tema chiaro/scuro automatico. Accent allineato al sito (teal).
   ===================================================================== */
#cc-root{
  --cc-bg:#ffffff; --cc-fg:#1a1a2e; --cc-muted:#55607a;
  --cc-accent:#0a6b74; --cc-accent-fg:#ffffff;
  --cc-border:#d9dee4; --cc-shadow:0 10px 40px rgba(10,20,40,.18);
  --cc-radius:12px;
}
@media (prefers-color-scheme: dark){
  #cc-root{
    --cc-bg:#161a22; --cc-fg:#eef1f5; --cc-muted:#a6b0c0;
    --cc-accent:#3bb4bd; --cc-accent-fg:#06222a;
    --cc-border:#2a3140; --cc-shadow:0 10px 40px rgba(0,0,0,.5);
  }
}

#cc-root, #cc-root *{ box-sizing:border-box; }
#cc-root button{ font:inherit; }

/* --- Banner in basso --- */
.cc-banner{
  position:fixed; left:0; right:0; bottom:0; z-index:2147483000;
  display:flex; justify-content:center; padding:16px;
  animation:cc-up .28s ease-out;
}
@media (prefers-reduced-motion: reduce){ .cc-banner{ animation:none; } }
@keyframes cc-up{ from{ transform:translateY(16px); opacity:0 } to{ transform:none; opacity:1 } }

.cc-banner__box{
  width:100%; max-width:820px; background:var(--cc-bg); color:var(--cc-fg);
  border:1px solid var(--cc-border); border-radius:var(--cc-radius);
  box-shadow:var(--cc-shadow); padding:20px 22px;
}

/* --- Modale preferenze --- */
.cc-modal{ position:fixed; inset:0; z-index:2147483000; display:flex;
  align-items:center; justify-content:center; padding:16px; }
.cc-modal__backdrop{ position:absolute; inset:0; background:rgba(10,15,25,.55); }
.cc-modal__box{
  position:relative; width:100%; max-width:560px; max-height:90vh; overflow:auto;
  background:var(--cc-bg); color:var(--cc-fg); border:1px solid var(--cc-border);
  border-radius:var(--cc-radius); box-shadow:var(--cc-shadow); padding:24px;
  animation:cc-in .2s ease-out;
}
@media (prefers-reduced-motion: reduce){ .cc-modal__box{ animation:none; } }
@keyframes cc-in{ from{ transform:scale(.98); opacity:0 } to{ transform:none; opacity:1 } }

/* --- Testi --- */
.cc-h{ margin:0 0 8px; font-size:1.15rem; line-height:1.3; font-weight:700; }
.cc-p{ margin:0 0 14px; font-size:.94rem; line-height:1.55; color:var(--cc-fg); }
.cc-muted{ color:var(--cc-muted); }
.cc-links a{ color:var(--cc-accent); text-decoration:underline; }
.cc-links{ font-size:.88rem; }

/* --- Pulsanti (Accetta e Rifiuta con pari evidenza) --- */
.cc-actions{ display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; justify-content:flex-end; }
.cc-btn{
  cursor:pointer; border-radius:8px; padding:10px 18px; font-size:.92rem; font-weight:600;
  border:1.5px solid transparent; transition:filter .15s, background .15s, border-color .15s;
}
.cc-btn:focus-visible{ outline:3px solid var(--cc-accent); outline-offset:2px; }
.cc-btn--solid{ background:var(--cc-accent); color:var(--cc-accent-fg); }
.cc-btn--solid:hover{ filter:brightness(1.08); }
.cc-btn--ghost{ background:transparent; color:var(--cc-fg); border-color:var(--cc-border); }
.cc-btn--ghost:hover{ border-color:var(--cc-accent); color:var(--cc-accent); }

/* Su mobile i pulsanti occupano tutta la larghezza, pari dimensione */
@media (max-width:560px){
  .cc-actions{ justify-content:stretch; }
  .cc-btn{ flex:1 1 100%; padding:12px; }
}

/* --- Categorie --- */
.cc-cat{ padding:14px 0; border-top:1px solid var(--cc-border); }
.cc-cat:first-of-type{ border-top:none; }
.cc-cat__row{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.cc-cat__name{ font-weight:700; font-size:.98rem; }
.cc-cat__desc{ margin:6px 0 0; font-size:.86rem; line-height:1.5; color:var(--cc-muted); }
.cc-badge{ font-size:.72rem; font-weight:700; letter-spacing:.02em; text-transform:uppercase;
  color:var(--cc-accent); border:1px solid var(--cc-accent); border-radius:999px; padding:3px 10px; }

/* --- Interruttore --- */
.cc-switch{ position:relative; display:inline-block; width:46px; height:26px; flex:0 0 auto; }
.cc-switch input{ position:absolute; opacity:0; width:100%; height:100%; margin:0; cursor:pointer; }
.cc-slider{ position:absolute; inset:0; background:var(--cc-border); border-radius:999px; transition:background .18s; }
.cc-slider::before{ content:""; position:absolute; height:20px; width:20px; left:3px; top:3px;
  background:#fff; border-radius:50%; transition:transform .18s; box-shadow:0 1px 3px rgba(0,0,0,.3); }
.cc-switch input:checked + .cc-slider{ background:var(--cc-accent); }
.cc-switch input:checked + .cc-slider::before{ transform:translateX(20px); }
.cc-switch input:focus-visible + .cc-slider{ outline:3px solid var(--cc-accent); outline-offset:2px; }