/* ============================================================
   consent.css — cookie banner (assets/js/consent.js), every page.
   global.css supplies tokens and .btn; nothing here redefines them.

   The bar sits at the bottom of the viewport. On phones it sits
   ABOVE the green call bar (global.css §20) instead of covering it:
   the call button must stay tappable while the banner is open.
============================================================ */

.cc{ display:none; }
.cc.cc--open{ display:block; }

.cc-bar{
  position:fixed;
  left:50%; transform:translateX(-50%);
  bottom:16px;
  z-index:10001;
  width:min(100% - 32px, 980px);
  max-height:calc(100vh - 120px);
  overflow:auto;
  background:var(--paper-000);
  color:var(--ink-900);
  border:1px solid var(--line-200);
  border-radius:var(--radius-m);
  box-shadow:0 18px 50px rgba(14,57,94,.22);
  padding:22px 24px 20px;
  font-size:.92rem;
  line-height:1.5;
}

@media (max-width:768px){
  .cc-bar{
    bottom:calc(var(--callbar-h) + env(safe-area-inset-bottom) + 8px);
    width:calc(100% - 16px);
    max-height:calc(100vh - var(--callbar-h) - 90px);
    padding:18px 16px 16px;
  }
}

.cc-title{
  margin:0 32px 8px 0;
  font-family:var(--font-display);
  font-weight:800;
  font-size:1.05rem;
  color:var(--green-900);
}

.cc-desc p, .cc-intro, .cc-cat p{
  margin:0 0 8px;
  color:var(--ink-700);
  font-size:.88rem;
}
.cc-desc a, .cc-intro a{ color:var(--green-700); text-decoration:underline; }

.cc-x{
  position:absolute; top:10px; right:12px;
  width:36px; height:36px;
  border:0; border-radius:50%;
  background:transparent;
  color:var(--ink-700);
  font-size:26px; line-height:1;
  cursor:pointer;
}
.cc-x:hover{ background:var(--line-100); }

.cc-actions{
  display:flex; flex-wrap:wrap; justify-content:flex-end; align-items:center;
  gap:10px;
  margin-top:12px;
}
.cc-actions .btn{ padding:12px 22px; font-size:.92rem; }

.cc-links{ display:none; }

/* Phones: keep the bar short so the page's own CHIAMA button and the
   green call bar stay usable while the banner is open.
   Rifiuta and Accetta keep the same size side by side (Garante 2021:
   rejecting must be as easy as accepting); "Impostazioni cookie"
   drops to a text link underneath. */
@media (max-width:600px){
  .cc-bar{ padding:14px 14px 12px; }
  .cc-title{ font-size:.98rem; margin-bottom:6px; }
  .cc-desc .cc-more{ display:none; }
  .cc-desc p, .cc-links{ font-size:.82rem; line-height:1.4; margin-bottom:6px; }
  .cc-links{ display:block; }
  .cc-links a{ color:var(--green-700); text-decoration:underline; }
  .cc-bar .cc-actions{
    display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:8px;
  }
  .cc-bar .cc-actions .btn{
    width:100%; min-height:44px; padding:10px 8px;
    font-size:.82rem; white-space:normal; line-height:1.2;
  }
  .cc-bar .cc-actions [data-cc="reject"]{ grid-column:1; grid-row:1; }
  .cc-bar .cc-actions [data-cc="accept"]{ grid-column:2; grid-row:1; }
  .cc-bar .cc-actions [data-cc="settings"]{ grid-column:1 / -1; grid-row:2; min-height:36px; padding:4px; }
  .cc-panel .cc-actions{ flex-direction:column-reverse; align-items:stretch; }
  .cc-panel .cc-actions .btn{ width:100%; }
}

/* While the banner is open the green call bar never slides away
   (site.js §4 hides it when another CHIAMA is on screen — here that
   button may sit under the banner). */
.cc-visible .call-bar.call-bar--hidden{ transform:none; }

/* ---- settings modal ---- */
.cc-modal{
  position:fixed; inset:0;
  z-index:10002;
  background:rgba(26,27,39,.55);
  display:flex; align-items:center; justify-content:center;
  padding:16px;
}
.cc-modal[hidden]{ display:none; }

.cc-panel{
  position:relative;
  width:min(100%, 640px);
  max-height:calc(100vh - 32px);
  overflow:auto;
  background:var(--paper-000);
  border-radius:var(--radius-m);
  box-shadow:0 24px 60px rgba(0,0,0,.3);
  padding:24px;
}

.cc-cat{
  border-top:1px solid var(--line-200);
  padding:14px 0 6px;
}
.cc-cat-head{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  margin-bottom:4px;
  cursor:pointer;
}
.cc-cat-name{ font-weight:700; color:var(--ink-900); }
.cc-always{ font-size:.8rem; font-weight:700; color:var(--live-500); }

/* Toggle switch built on a real checkbox (keyboard + screen reader) */
.cc-switch{
  appearance:none; -webkit-appearance:none;
  position:relative; flex-shrink:0;
  width:44px; height:26px; margin:0;
  border-radius:999px;
  background:var(--ink-500);
  cursor:pointer;
  transition:background .15s ease;
}
.cc-switch::after{
  content:""; position:absolute; top:3px; left:3px;
  width:20px; height:20px; border-radius:50%;
  background:var(--paper-000);
  transition:transform .15s ease;
}
.cc-switch:checked{ background:var(--green-700); }
.cc-switch:checked::after{ transform:translateX(18px); }
.cc-switch:focus-visible{ outline:2px solid var(--amber-500); outline-offset:2px; }
