/* ==========================================================================
   Consent-Banner (DSGVO / TDDDG §25) — Krankengymnastik Wegberg
   Wird von assets/consent.js gesteuert. Marken-Tokens der Landingpage.
   ========================================================================== */

.cc-root{
  --cc-navy:#14294F;
  --cc-blue:#1E4E9C;
  --cc-ink:#131C2B;
  --cc-ink-soft:#46536B;
  --cc-hair:#E1E7F0;
  --cc-red:#D93A2B;
  --cc-red-d:#B72E21;
  font-family:'Inter', system-ui, sans-serif;
}

/* Abdunkelung: verhindert, dass die Seite weiterbedient wird, ohne dass eine
   Entscheidung getroffen wurde (keine konkludente Einwilligung). */
.cc-overlay{
  position:fixed; inset:0; z-index:2147483000;
  background:rgba(12,22,42,.55);
  -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);
  display:flex; align-items:flex-end; justify-content:center;
  padding:clamp(.75rem,3vw,2rem);
}
@media (min-width:900px){ .cc-overlay{ align-items:center; } }

.cc-panel{
  outline:none;
  background:#fff; color:var(--cc-ink);
  border-radius:18px;
  width:100%; max-width:560px;
  max-height:calc(100vh - 2rem);
  overflow-y:auto;
  padding:clamp(1.4rem,3.5vw,2rem);
  box-shadow:0 30px 70px -20px rgba(12,22,42,.55);
  line-height:1.65;
}
.cc-panel h2{
  font-family:'Fraunces', Georgia, serif; font-weight:600;
  font-size:1.3rem; line-height:1.2; color:var(--cc-ink);
  margin:0 0 .6rem;
}
.cc-panel p{ font-size:.91rem; font-weight:300; color:var(--cc-ink-soft); margin:0 0 .8rem; }
.cc-panel a{ color:var(--cc-blue); }

.cc-actions{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.1rem; }
.cc-btn{
  flex:1 1 auto; min-width:150px;
  display:inline-flex; align-items:center; justify-content:center;
  padding:.85rem 1.4rem; border-radius:999px;
  font-family:'Inter',sans-serif; font-size:.92rem; font-weight:600;
  border:0; cursor:pointer; text-decoration:none;
  transition:background-color .25s ease, border-color .25s ease, transform .25s ease;
}
.cc-btn:hover{ transform:translateY(-1px); }
.cc-btn:focus-visible{ outline:2px solid var(--cc-blue); outline-offset:3px; }
.cc-btn-accept{ background:var(--cc-red); color:#fff; }
.cc-btn-accept:hover{ background:var(--cc-red-d); }
.cc-btn-reject{ background:#fff; color:var(--cc-navy); border:1px solid #C9D3E4; }
.cc-btn-reject:hover{ border-color:var(--cc-navy); }
.cc-btn-settings{
  background:none; border:0; color:var(--cc-ink-soft);
  font-size:.86rem; font-weight:500; text-decoration:underline;
  text-underline-offset:3px; cursor:pointer;
  padding:.5rem .2rem; flex:1 1 100%; margin-top:.1rem;
}
.cc-btn-settings:hover{ color:var(--cc-navy); }

.cc-links{
  margin-top:1rem; padding-top:.9rem; border-top:1px solid var(--cc-hair);
  font-size:.8rem; color:var(--cc-ink-soft);
}
.cc-links a{ color:var(--cc-ink-soft); text-decoration:underline; text-underline-offset:2px; }
.cc-links a:hover{ color:var(--cc-navy); }

/* --- Detail-Einstellungen --- */
.cc-groups{ margin-top:1rem; display:grid; gap:.65rem; }
.cc-group{
  border:1px solid var(--cc-hair); border-radius:12px;
  padding:.9rem 1rem;
  display:grid; grid-template-columns:1fr auto; gap:.8rem; align-items:start;
}
.cc-group h3{
  font-family:'Inter',sans-serif; font-size:.93rem; font-weight:600;
  color:var(--cc-ink); margin:0 0 .2rem;
}
.cc-group p{ font-size:.83rem; margin:0; }
.cc-group-locked{ background:#F7FAFD; }

/* Schalter */
.cc-switch{ position:relative; display:inline-block; width:44px; height:25px; flex:none; }
.cc-switch input{ position:absolute; opacity:0; width:100%; height:100%; margin:0; cursor:pointer; }
.cc-slider{
  position:absolute; inset:0; border-radius:999px;
  background:#C9D3E4; transition:background-color .25s ease; pointer-events:none;
}
.cc-slider::before{
  content:""; position:absolute; top:3px; left:3px;
  width:19px; height:19px; border-radius:50%; background:#fff;
  transition:transform .25s ease; box-shadow:0 1px 3px rgba(12,22,42,.3);
}
.cc-switch input:checked + .cc-slider{ background:var(--cc-blue); }
.cc-switch input:checked + .cc-slider::before{ transform:translateX(19px); }
.cc-switch input:focus-visible + .cc-slider{ outline:2px solid var(--cc-blue); outline-offset:3px; }
.cc-switch input:disabled + .cc-slider{ background:var(--cc-blue); opacity:.45; }
.cc-switch input:disabled{ cursor:not-allowed; }

/* Fußzeilen-Link zum erneuten Öffnen */
.cc-reopen{
  background:none; border:0; padding:0;
  color:inherit; font:inherit; cursor:pointer;
  text-decoration:underline; text-underline-offset:2px;
}

@media (prefers-reduced-motion: reduce){
  .cc-btn, .cc-slider, .cc-slider::before{ transition:none; }
}