/* ============================================================
   EMME — vestizione del banner cookie (CookieConsent v3).
   Mappa le variabili della libreria sui token del sito: nero, oro, crema, Oswald,
   bottoni ad angolo tagliato. Il banner deve sembrare parte del sito, non un
   widget incollato sopra.
   Va caricato DOPO assets/vendor/cookieconsent.css.
   ============================================================ */

#cc-main{
  --cc-font-family: var(--body);
  --cc-bg: var(--ink-2);
  --cc-primary-color: var(--cream);
  --cc-secondary-color: var(--cream-dim);

  --cc-btn-primary-bg: var(--gold);
  --cc-btn-primary-color: #141310;
  --cc-btn-primary-border-color: var(--gold);
  --cc-btn-primary-hover-bg: var(--gold-b);
  --cc-btn-primary-hover-color: #141310;
  --cc-btn-primary-hover-border-color: var(--gold-b);

  /* "Rifiuta" e "Scegli tu": stesso peso visivo di "Accetta" — lo impone il Garante.
     Non li smorziamo: cambia il riempimento, non l'importanza. */
  --cc-btn-secondary-bg: transparent;
  --cc-btn-secondary-color: var(--gold);
  --cc-btn-secondary-border-color: var(--gold);
  --cc-btn-secondary-hover-bg: var(--gold);
  --cc-btn-secondary-hover-color: #141310;
  --cc-btn-secondary-hover-border-color: var(--gold);

  --cc-separator-border-color: var(--line);
  --cc-cookie-category-block-bg: var(--ink);
  --cc-cookie-category-block-border: var(--line);
  --cc-cookie-category-block-hover-bg: var(--ink-3);
  --cc-cookie-category-block-hover-border: var(--line-2);
  --cc-cookie-category-expanded-block-bg: transparent;
  --cc-overlay-bg: rgba(8,8,10,.72);
  --cc-footer-bg: var(--ink);
  --cc-footer-color: var(--cream-dim);
  --cc-footer-border-color: var(--line);

  --cc-toggle-readonly-bg: #2b2a27;
  --cc-toggle-readonly-knob-bg: #6b675f;
  --cc-toggle-on-bg: var(--gold);
  --cc-toggle-on-knob-bg: #141310;
  --cc-toggle-off-bg: #3a3833;
  --cc-toggle-off-knob-bg: var(--cream);

  --cc-btn-border-radius: 0;      /* niente angoli stondati: il sito non ne ha */
  --cc-modal-border-radius: 0;
  --cc-modal-margin: 18px;
  --cc-z-index: 70;               /* sopra la grana (60) e la barra CTA mobile (45) */
}

/* riquadro */
#cc-main .cm,
#cc-main .pm{
  border:1px solid var(--line-2);
  box-shadow:0 24px 70px rgba(0,0,0,.6);
}

/* titoli in Oswald, come il resto del sito */
#cc-main .cm__title,
#cc-main .pm__title{
  font-family:var(--display);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.02em;
  font-size:23px;
  line-height:1.05;
  color:var(--cream);
}
#cc-main .cm__desc,
#cc-main .pm__section-desc{color:var(--cream-dim);font-size:14.5px;line-height:1.6}
#cc-main .cm__desc a,
#cc-main .pm__section-desc a{color:var(--gold);text-decoration:underline;text-underline-offset:2px}
#cc-main .cm__desc a:hover,
#cc-main .pm__section-desc a:hover{color:var(--gold-b)}

/* bottoni: angolo tagliato, come tutte le CTA del sito */
#cc-main .cm__btn,
#cc-main .pm__btn{
  font-family:var(--mono);
  font-weight:600;
  font-size:12px;
  letter-spacing:.1em;
  text-transform:uppercase;
  padding:14px 20px;
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
  transition:background .25s,color .25s,transform .25s var(--ease);
}
#cc-main .cm__btn:hover,
#cc-main .pm__btn:hover{transform:translateY(-2px)}
#cc-main .cm__btn:focus-visible,
#cc-main .pm__btn:focus-visible{outline:2px solid var(--cream);outline-offset:3px}

/* blocchi delle categorie */
#cc-main .pm__section--toggle .pm__section-title{
  font-family:var(--body);font-weight:600;font-size:15px;color:var(--cream);
}
#cc-main .pm__badge{
  background:rgba(194,168,120,.14);
  color:var(--gold);
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.08em;
}
#cc-main .pm__header,
#cc-main .pm__footer{border-color:var(--line)}

/* Mentre il banner e' aperto, la barra sticky "Prenota" si toglie di mezzo: su mobile
   stanno entrambi in fondo e si coprirebbero. La classe la mette cookie.js. */
body.cc-aperto .mcta{display:none}

@media (prefers-reduced-motion:reduce){
  #cc-main .cm__btn:hover,
  #cc-main .pm__btn:hover{transform:none}
}
