/* ─────────────────────────────────────────────
   MFE Cookie-Consent · DSGVO/TDDDG-konform
   Light-Luxe Look · selbst-contained (eigene Tokens)
   ───────────────────────────────────────────── */
:root{
  --cc-bg:#ffffff; --cc-bg2:#f4f8f3; --cc-ink:#0c1410;
  --cc-soft:rgba(12,20,16,.68); --cc-faint:rgba(12,20,16,.5);
  --cc-line:rgba(13,32,20,.12); --cc-green:#15924a; --cc-green2:#19a854;
  --cc-glow:rgba(21,146,74,.28);
}

.cc-root *{box-sizing:border-box}
.cc-hidden{display:none !important}

/* Overlay (sanft, blockiert nicht hart – Banner ist Karte) */
.cc-overlay{
  position:fixed; inset:0; z-index:10000;
  background:rgba(8,14,10,.28); backdrop-filter:blur(2px);
  opacity:0; transition:opacity .3s ease; pointer-events:none;
}
.cc-overlay.cc-show{opacity:1; pointer-events:auto}

/* Banner-Karte */
.cc-card{
  position:fixed; z-index:10001; left:1.25rem; bottom:1.25rem;
  width:min(440px, calc(100vw - 2.5rem));
  background:var(--cc-bg); color:var(--cc-ink);
  border:1px solid var(--cc-line); border-radius:18px;
  box-shadow:0 30px 70px -28px rgba(13,32,20,.45), 0 0 0 1px rgba(255,255,255,.6) inset;
  font-family:'Hanken Grotesk',system-ui,sans-serif; line-height:1.6;
  transform:translateY(18px); opacity:0; transition:transform .4s cubic-bezier(.22,1,.36,1), opacity .4s;
  overflow:hidden;
}
.cc-card.cc-show{transform:none; opacity:1}
.cc-card-pad{padding:1.5rem 1.5rem 1.4rem}

.cc-eyebrow{
  font-family:'JetBrains Mono',monospace; font-size:.66rem; letter-spacing:.2em;
  text-transform:uppercase; color:var(--cc-green); display:inline-flex; align-items:center; gap:.5rem; margin-bottom:.7rem;
}
.cc-eyebrow::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--cc-green);box-shadow:0 0 8px var(--cc-glow)}
.cc-title{font-family:'Fraunces',Georgia,serif; font-weight:900; font-size:1.3rem; letter-spacing:-.01em; margin-bottom:.5rem}
.cc-text{font-size:.9rem; color:var(--cc-soft); margin-bottom:1rem}
.cc-text a{color:var(--cc-green); font-weight:600; text-decoration:underline; text-underline-offset:2px}

/* Buttons – Accept & Reject gleichwertig (nebeneinander, gleiche Größe) */
.cc-actions{display:flex; gap:.6rem; flex-wrap:wrap}
.cc-btn{
  flex:1 1 0; min-width:140px; cursor:pointer; border-radius:11px;
  font-family:'Hanken Grotesk',sans-serif; font-weight:700; font-size:.9rem;
  padding:.8rem 1rem; transition:transform .2s ease, box-shadow .25s ease, background .2s, border-color .2s; text-align:center;
}
.cc-btn:focus-visible{outline:2px solid var(--cc-green2); outline-offset:2px}
.cc-accept{background:linear-gradient(180deg,var(--cc-green2),var(--cc-green)); color:#fff; border:1.5px solid var(--cc-green); box-shadow:0 10px 26px -12px var(--cc-glow)}
.cc-accept:hover{transform:translateY(-2px); box-shadow:0 16px 34px -12px var(--cc-glow)}
.cc-reject{background:var(--cc-bg); color:var(--cc-ink); border:1.5px solid var(--cc-line)}
.cc-reject:hover{transform:translateY(-2px); border-color:var(--cc-green); color:var(--cc-green)}

.cc-settings-link{
  display:block; width:100%; margin-top:.8rem; background:none; border:0; cursor:pointer;
  font-family:'JetBrains Mono',monospace; font-size:.72rem; letter-spacing:.06em; text-transform:uppercase;
  color:var(--cc-faint); text-align:center; padding:.3rem;
}
.cc-settings-link:hover{color:var(--cc-green)}

/* Detail-/Einstellungs-Panel */
.cc-details{border-top:1px solid var(--cc-line); margin-top:1.1rem; padding-top:1.1rem}
.cc-row{display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding:.7rem 0}
.cc-row+.cc-row{border-top:1px solid var(--cc-line)}
.cc-row h4{font-size:.92rem; font-weight:700; margin-bottom:.15rem}
.cc-row p{font-size:.78rem; color:var(--cc-faint); line-height:1.5}
.cc-locked{font-family:'JetBrains Mono',monospace; font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; color:var(--cc-green); white-space:nowrap; padding-top:.2rem}

/* Toggle */
.cc-switch{position:relative; width:44px; height:25px; flex-shrink:0; margin-top:.1rem}
.cc-switch input{position:absolute; opacity:0; width:100%; height:100%; margin:0; cursor:pointer}
.cc-slider{position:absolute; inset:0; background:#cfd9cd; border-radius:30px; transition:background .25s}
.cc-slider::before{content:''; position:absolute; left:3px; top:3px; width:19px; height:19px; background:#fff; border-radius:50%; transition:transform .25s; box-shadow:0 1px 3px rgba(0,0,0,.25)}
.cc-switch input:checked + .cc-slider{background:var(--cc-green)}
.cc-switch input:checked + .cc-slider::before{transform:translateX(19px)}
.cc-switch input:focus-visible + .cc-slider{outline:2px solid var(--cc-green2); outline-offset:2px}

.cc-save{margin-top:1rem; width:100%; flex:none}

/* Floating Re-Open Button */
.cc-fab{
  position:fixed; z-index:9990; left:1rem; bottom:1rem;
  width:42px; height:42px; border-radius:50%; cursor:pointer;
  background:var(--cc-bg); border:1px solid var(--cc-line); color:var(--cc-green);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 22px -10px rgba(13,32,20,.4); transition:transform .2s, box-shadow .2s;
}
.cc-fab:hover{transform:translateY(-2px) scale(1.05); box-shadow:0 12px 26px -10px var(--cc-glow)}

@media (max-width:560px){
  .cc-card{left:.75rem; right:.75rem; bottom:.75rem; width:auto}
  .cc-fab{left:.75rem; bottom:.75rem}
}
@media (prefers-reduced-motion: reduce){
  .cc-card,.cc-overlay,.cc-btn,.cc-fab{transition:none}
}