/* ============================================================
   CONSENTEMENT COOKIES — Pizza Napoli
   Bannière + panneau de préférences (conforme CNIL).
   Style aux couleurs du site ; variables avec valeurs de repli
   afin de fonctionner aussi sur les pages qui ne définissent pas
   le thème (chaque page inclut tout de même ses variables).
   ============================================================ */
.cc-banner,
.cc-modal{
  --cc-panna:#f5eddc;
  --cc-espresso:#2a211a;
  --cc-tomato:#b5402f;
  --cc-tomato-d:#93301f;
  --cc-gold:#c2932f;
  --cc-line:rgba(42,33,26,.16);
  font-family:var(--sans,"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif);
}
.cc-hidden{display:none !important}

/* ---- Bannière ---- */
.cc-banner{
  position:fixed;inset-inline:0;bottom:0;z-index:1000;
  background:rgba(245,237,220,.97);color:var(--cc-espresso);
  border-top:1px solid var(--cc-line);
  box-shadow:0 -12px 34px rgba(42,33,26,.16);
  backdrop-filter:saturate(140%) blur(8px);
}
.cc-banner__tri{
  height:4px;width:100%;
  background:linear-gradient(90deg,#3f6b3a 0 33.33%,#faf6ee 33.33% 66.66%,var(--cc-tomato) 66.66% 100%);
}
.cc-banner__inner{
  max-width:1120px;margin:0 auto;padding:18px 22px;
  display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;
}
.cc-banner__text{
  flex:1 1 340px;min-width:260px;font-size:.92rem;line-height:1.55;color:rgba(42,33,26,.85);margin:0;
}
.cc-banner__text a{color:var(--cc-tomato);font-weight:700;text-decoration:underline;text-underline-offset:3px}

/* ---- Boutons ---- */
.cc-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.cc-btn{
  font-family:inherit;font-weight:700;font-size:.92rem;cursor:pointer;white-space:nowrap;
  border-radius:999px;padding:.7em 1.25em;border:2px solid transparent;
  transition:transform .15s ease, background .2s ease;
}
.cc-btn:hover{transform:translateY(-2px)}
.cc-btn:active{transform:translateY(0)}
.cc-btn:focus-visible{outline:3px solid var(--cc-gold);outline-offset:2px}
/* « Tout refuser » et « Tout accepter » ont strictement le MÊME poids visuel
   (exigence CNIL : pas de dark pattern). */
.cc-btn--primary{background:var(--cc-tomato);color:var(--cc-panna)}
.cc-btn--primary:hover{background:var(--cc-tomato-d)}
.cc-btn--ghost{background:transparent;color:var(--cc-espresso);border-color:var(--cc-gold)}
.cc-btn--ghost:hover{background:rgba(194,147,47,.14)}

/* ---- Modale préférences ---- */
.cc-modal{
  position:fixed;inset:0;z-index:1001;display:flex;align-items:center;justify-content:center;
  padding:18px;background:rgba(42,33,26,.55);backdrop-filter:blur(3px);
}
.cc-modal__panel{
  position:relative;width:100%;max-width:600px;max-height:90vh;overflow-y:auto;
  background:var(--cc-panna);color:var(--cc-espresso);
  border-radius:16px;border:1px solid var(--cc-line);
  box-shadow:0 24px 60px rgba(0,0,0,.35);padding:26px 26px 24px;
}
.cc-modal__title{
  font-family:var(--serif,"Fraunces",Georgia,"Times New Roman",serif);
  font-size:1.5rem;color:var(--cc-tomato);margin:0 0 .4rem;
}
.cc-modal__intro{font-size:.92rem;color:rgba(42,33,26,.78);margin:0 0 1.2rem;line-height:1.55}
.cc-modal__close{
  position:absolute;top:10px;right:14px;background:none;border:0;
  font-size:1.7rem;line-height:1;color:rgba(42,33,26,.5);cursor:pointer;padding:4px 8px;
}
.cc-modal__close:hover{color:var(--cc-tomato)}

.cc-cat{
  display:flex;gap:14px;align-items:flex-start;justify-content:space-between;
  background:#fbf6ea;border:1px solid var(--cc-line);border-radius:12px;
  padding:14px 16px;margin-bottom:12px;
}
.cc-cat__title{font-weight:700;font-size:.98rem;margin:0 0 .25rem}
.cc-cat__desc{font-size:.86rem;color:rgba(42,33,26,.72);line-height:1.5;margin:0}
.cc-switch{flex:0 0 auto;margin-top:2px}
.cc-switch input{width:20px;height:20px;cursor:pointer;accent-color:var(--cc-tomato)}
.cc-switch input:disabled{cursor:not-allowed;opacity:.55}

.cc-modal__actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}

@media (max-width:560px){
  .cc-banner__inner{padding:16px}
  .cc-actions{width:100%}
  .cc-actions .cc-btn{flex:1 1 auto;justify-content:center;text-align:center}
  .cc-modal__actions .cc-btn{flex:1 1 auto;text-align:center}
}
@media (prefers-reduced-motion:reduce){
  .cc-btn{transition:none}
  .cc-btn:hover{transform:none}
}
