/* ===================================================================
   Consent-Banner – Gestaltung
   Gehört zu /js/consent.js. Wiederverwendbar über Projekte hinweg:
   alle Farben greifen auf die Marken-Variablen zu und haben einen
   Rückfallwert, falls das Projekt diese Variablen nicht setzt.
   =================================================================== */

.cc-overlay{position:fixed;inset:0;z-index:9998;background:rgba(31,39,51,.55);
  opacity:0;transition:opacity var(--dur-base,240ms) ease;}
.cc-overlay.cc-an{opacity:1;}

.cc-box{position:fixed;z-index:9999;left:50%;bottom:0;transform:translate(-50%,20px);
  width:min(560px,100%);max-height:92vh;overflow-y:auto;-webkit-overflow-scrolling:touch;
  background:var(--surface,#fff);color:var(--ink,#1F2733);
  border-radius:var(--radius-lg,22px) var(--radius-lg,22px) 0 0;
  box-shadow:0 -20px 60px -20px rgba(31,39,51,.45);
  padding:26px 24px calc(24px + env(safe-area-inset-bottom));
  opacity:0;transition:opacity var(--dur-base,240ms) ease,transform var(--dur-base,240ms) var(--ease,cubic-bezier(.16,1,.3,1));}
.cc-box.cc-an{opacity:1;transform:translate(-50%,0);}
@media(min-width:700px){
  .cc-box{bottom:28px;border-radius:var(--radius-lg,22px);
    box-shadow:0 30px 60px -30px rgba(31,39,51,.5);}
}

.cc-box h2{font-size:19px;font-weight:800;line-height:1.25;margin:0 0 10px;
  color:var(--ink,#1F2733);letter-spacing:-.01em;}
.cc-box p{font-size:14.5px;line-height:1.55;color:var(--ink-soft,#5F6B72);margin:0 0 14px;}

/* Schaltflächen – „Alle akzeptieren“ und „Nur notwendige“ gleich groß und
   gleich prominent. Das ist die rechtliche Vorgabe, keine Gestaltungsfrage. */
.cc-aktionen{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;}
.cc-aktionen button{flex:1 1 190px;min-height:52px;padding:14px 20px;border-radius:var(--radius,14px);
  font-family:inherit;font-size:16px;font-weight:800;cursor:pointer;
  transition:background var(--dur-fast,180ms) ease,transform var(--dur-fast,180ms) ease,border-color var(--dur-fast,180ms) ease;}
.cc-aktionen button:hover{transform:translateY(-1px);}
.cc-aktionen button:active{transform:translateY(0);}
.cc-ja{background:var(--brand,#7FB14E);color:#fff;border:2px solid var(--brand,#7FB14E);}
.cc-ja:hover{background:var(--brand-accent,#4C9A2A);border-color:var(--brand-accent,#4C9A2A);}
.cc-nein{background:#fff;color:var(--ink,#1F2733);border:2px solid var(--line,#E6EBE0);}
.cc-nein:hover{border-color:var(--ink-soft,#5F6B72);}
.cc-speichern{background:var(--surface-deep,#F1F8E7);color:var(--brand-deep,#2E7D32);
  border:2px solid var(--brand-light,#BCDC9B);}
.cc-speichern:hover{border-color:var(--brand,#7FB14E);}

.cc-links{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;margin-top:16px;
  font-size:13.5px;}
.cc-links a,.cc-links button{color:var(--ink-soft,#5F6B72);text-decoration:underline;
  text-underline-offset:3px;background:none;border:none;padding:0;cursor:pointer;
  font-family:inherit;font-size:13.5px;}
.cc-links a:hover,.cc-links button:hover{color:var(--ink,#1F2733);}

/* Zweite Ebene: Kategorien */
.cc-kats{margin:6px 0 0;border-top:1px solid var(--line,#E6EBE0);}
.cc-kat{padding:16px 0;border-bottom:1px solid var(--line,#E6EBE0);}
.cc-kat-kopf{display:flex;align-items:center;justify-content:space-between;gap:16px;}
.cc-kat-titel{font-weight:800;font-size:15.5px;color:var(--ink,#1F2733);}
.cc-kat-text{font-size:13.5px;line-height:1.5;color:var(--ink-soft,#5F6B72);margin:6px 0 0;}
.cc-kat-fest{font-size:13px;font-weight:700;color:var(--brand-deep,#2E7D32);white-space:nowrap;}

/* Schalter */
.cc-schalter{position:relative;display:inline-flex;align-items:center;flex:0 0 auto;cursor:pointer;}
.cc-schalter input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer;}
.cc-track{width:52px;height:30px;border-radius:999px;background:#CBD3DA;
  transition:background var(--dur-fast,180ms) ease;display:block;}
.cc-knopf{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;
  background:#fff;box-shadow:0 1px 3px rgba(31,39,51,.35);
  transition:transform var(--dur-fast,180ms) var(--ease,cubic-bezier(.16,1,.3,1));}
.cc-schalter input:checked + .cc-track{background:var(--brand,#7FB14E);}
.cc-schalter input:checked ~ .cc-knopf{transform:translateX(22px);}
.cc-schalter input:focus-visible + .cc-track{outline:3px solid var(--brand-deep,#2E7D32);outline-offset:3px;}

/* Tastaturbedienung sichtbar halten */
.cc-box :focus-visible{outline:3px solid var(--brand-deep,#2E7D32);outline-offset:2px;border-radius:6px;}

.cc-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* Fußzeilen-Link „Cookie-Einstellungen“ */
.cc-fusslink{background:none;border:none;padding:0;font:inherit;color:#cfd6de;
  text-decoration:underline;cursor:pointer;}

@media(prefers-reduced-motion:reduce){
  .cc-overlay,.cc-box,.cc-track,.cc-knopf,.cc-aktionen button{transition-duration:.01ms!important;}
  .cc-box{transform:translate(-50%,0);}
}