/* Cocktailholdet Cookie Consent — styling */
:root{
  --chcc-bg:#ffffff;
  --chcc-fg:#1a1a1a;
  --chcc-muted:#52606d;
  --chcc-border:#e4e7eb;
  --chcc-accent:#2C3E3A;          /* accept / primær */
  --chcc-accent-fg:#ffffff;
  --chcc-radius:8px;
  --chcc-shadow:0 12px 40px rgba(0,0,0,.18);
}

#chcc-root[hidden]{display:none;}
body.chcc-open{overflow:hidden;}

.chcc-overlay{
  position:fixed;inset:0;background:rgba(28,45,41,.5);
  z-index:2147483000;
}
.chcc-banner{
  position:fixed;z-index:2147483001;
  left:50%;bottom:24px;transform:translateX(-50%);
  width:min(640px,calc(100vw - 32px));
  max-height:calc(100vh - 48px);overflow:auto;
  background:var(--chcc-bg);color:var(--chcc-fg);
  border:1px solid var(--chcc-border);border-radius:var(--chcc-radius);
  box-shadow:var(--chcc-shadow);
}
.chcc-inner{padding:24px 24px 20px;}
.chcc-title{font-size:1.25rem;line-height:1.3;margin:0 0 8px;font-weight:700;}
.chcc-desc{font-size:.95rem;line-height:1.55;color:var(--chcc-muted);margin:0 0 16px;}
.chcc-link{color:var(--chcc-accent);text-decoration:underline;}

.chcc-prefs{margin:4px 0 18px;border-top:1px solid var(--chcc-border);}
.chcc-cat{padding:14px 0;border-bottom:1px solid var(--chcc-border);}
.chcc-cat-head{display:flex;align-items:center;justify-content:space-between;gap:12px;font-weight:600;cursor:pointer;}
.chcc-cat-desc{margin:6px 0 0;font-size:.85rem;line-height:1.5;color:var(--chcc-muted);}
.chcc-always{font-size:.8rem;color:var(--chcc-accent);font-weight:600;}

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

.chcc-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;}
/* Alle knapper har BEVIDST samme udseende — "Afvis alle" skal være lige så
   fremtrædende som "Accepter alle" (Datatilsynet / ingen dark patterns). */
.chcc-btn{
  font:inherit;font-weight:600;font-size:.92rem;
  padding:11px 18px;border-radius:10px;cursor:pointer;
  background:#fff;color:var(--chcc-fg);border:1px solid var(--chcc-border);
  transition:background .12s;
}
.chcc-btn:hover{background:#f5f7fa;}
.chcc-btn:focus-visible{outline:2px solid var(--chcc-accent);outline-offset:2px;}
/* Variant-klasserne bevares for bagudkompatibilitet, men styles ens. */
.chcc-btn-ghost,
.chcc-btn-accept,
.chcc-btn-save{background:#fff;color:var(--chcc-fg);border-color:var(--chcc-border);}
.chcc-btn-ghost:hover,
.chcc-btn-accept:hover,
.chcc-btn-save:hover{background:#f5f7fa;filter:none;}

/* flydende genåbn-knap */
.chcc-reopen{
  position:fixed;left:18px;bottom:18px;z-index:2147482000;
  width:44px;height:44px;border-radius:50%;
  background:var(--chcc-bg);color:var(--chcc-fg);
  border:1px solid var(--chcc-border);box-shadow:0 4px 14px rgba(0,0,0,.16);
  display:flex;align-items:center;justify-content:center;cursor:pointer;
}
.chcc-reopen:hover{background:#f5f7fa;}
.chcc-reopen:focus-visible{outline:2px solid var(--chcc-accent);outline-offset:2px;}
.chcc-reopen[hidden]{display:none;}

/* cookie-deklaration (politik-side) */
.chcc-declaration{margin:1rem 0;}
.chcc-decl-updated{font-size:.85rem;color:var(--chcc-muted);}
.chcc-decl-table{width:100%;border-collapse:collapse;margin:.5rem 0 1.5rem;font-size:.9rem;}
.chcc-decl-table th,.chcc-decl-table td{border:1px solid var(--chcc-border);padding:8px 10px;text-align:left;vertical-align:top;}
.chcc-decl-table th{background:#f5f7fa;font-weight:600;}
.chcc-decl-table code{font-size:.85em;}

@media (max-width:520px){
  .chcc-banner{left:8px;right:8px;bottom:8px;transform:none;width:auto;}
  .chcc-actions{justify-content:stretch;}
  .chcc-btn{flex:1 1 auto;text-align:center;}
}
@media (prefers-reduced-motion:reduce){
  .chcc-slider,.chcc-slider::before,.chcc-btn{transition:none;}
}
