/*
  Blaulicht Rheinland – Cookie Banner (Bild.de-like)
  - Klar, seriös, kontrastreich (weiß + schwarz + rot)
  - Fokus auf Lesbarkeit & saubere Buttons
*/

:root{
  --blr-red:#d10000;
  --blr-black:#111;
  --blr-gray:#666;
  --blr-border:rgba(0,0,0,.12);
  --blr-shadow:0 18px 45px rgba(0,0,0,.35);
}

.blr-consent{ position:fixed; inset:0; z-index:999999; font-family:Arial, system-ui, -apple-system, Segoe UI, Roboto, sans-serif; }
.blr-consent[hidden]{ display:none !important; }

.blr-consent__backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.55); }

.blr-consent__banner{
  position:absolute; left:50%; bottom:18px; transform:translateX(-50%);
  width:min(980px, calc(100% - 24px));
  background:#fff; color:var(--blr-black);
  border-radius:10px;
  box-shadow:var(--blr-shadow);
  border:1px solid rgba(0,0,0,.10);
  overflow:hidden;
}

@media (max-width: 720px){
  .blr-consent__banner{ bottom:12px; border-radius:10px; }
}

/* Header: dünner roter Balken + Titelzeile wie News-UI */
.blr-consent__header{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 14px;
  background:#fff;
  color:var(--blr-black);
  border-bottom:1px solid rgba(0,0,0,.10);
}
.blr-consent__header::before{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height:4px;
  background:var(--blr-red);
}

.blr-consent__brand{ display:flex; gap:10px; align-items:center; }
#blr-consent-title{ font-size:16px; font-weight:900; letter-spacing:-.2px; }

.blr-consent__badge{
  font-size:12px;
  padding:4px 8px;
  border-radius:999px;
  background:rgba(0,0,0,.04);
  border:1px solid rgba(0,0,0,.10);
  color:#111;
}

.blr-consent__x{
  appearance:none;
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
  color:#111;
  width:38px;
  height:34px;
  border-radius:8px;
  font-size:22px;
  line-height:1;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}
.blr-consent__x:hover{ background:rgba(0,0,0,.04); }

.blr-consent__body{ padding:14px; }

.blr-consent__text{ margin:0 0 10px 0; font-size:14px; line-height:1.55; color:#111; }
.blr-consent__links{ margin:0 0 12px 0; font-size:13px; color:var(--blr-gray); }
.blr-consent__links a{ color:#111; text-decoration:underline; text-underline-offset:3px; }
.blr-consent__links a:hover{ color:var(--blr-red); }

/* Buttons: seriös, gleich hoch, klarer Fokus */
.blr-consent__actions{ display:flex; flex-wrap:wrap; gap:10px; margin:12px 0 6px; }

.blr-btn{
  appearance:none;
  border-radius:8px;
  border:1px solid rgba(0,0,0,.14);
  padding:11px 14px;
  cursor:pointer;
  font-weight:900;
  font-size:14px;
  background:#fff;
  color:#111;
  line-height:1;
}
.blr-btn:hover{ background:rgba(0,0,0,.04); }

/* Bild.de-ähnlich: Primär = rot */
.blr-btn--primary{ background:var(--blr-red); border-color:var(--blr-red); color:#fff; }
.blr-btn--primary:hover{ filter:brightness(.95); }

/* Secondary = schwarz */
.blr-btn--secondary{ background:#111; border-color:#111; color:#fff; }
.blr-btn--secondary:hover{ filter:brightness(.95); }

/* Ghost = hell */
.blr-btn--ghost{ background:#f4f5f7; border-color:#e6e7ea; }

/* Settings Box */
.blr-consent__settings{
  margin-top:12px;
  padding:12px;
  background:#fafafa;
  border:1px solid rgba(0,0,0,.10);
  border-radius:10px;
}

.blr-consent__row{ display:flex; gap:12px; align-items:flex-start; padding:10px 8px; }
.blr-consent__row + .blr-consent__row{ border-top:1px solid rgba(0,0,0,.07); }
.blr-consent__desc strong{ font-weight:900; }
.blr-consent__muted{ font-size:13px; color:#444; line-height:1.45; }

/* Switch */
.blr-switch{ display:inline-flex; align-items:center; }
.blr-switch input{ position:absolute; opacity:0; pointer-events:none; }
.blr-switch__ui{ width:46px; height:26px; border-radius:999px; background:#cfd6de; position:relative; box-shadow: inset 0 0 0 1px rgba(0,0,0,.10); }
.blr-switch__ui::after{ content:""; position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:50%; background:#fff; box-shadow:0 4px 10px rgba(0,0,0,.18); transition: transform .18s ease; }
.blr-switch input:checked + .blr-switch__ui{ background:var(--blr-red); }
.blr-switch input:checked + .blr-switch__ui::after{ transform: translateX(20px); }

.blr-consent__fineprint{ margin:10px 0 0; font-size:12.5px; color:#444; }

.blr-linklike{ appearance:none; border:none; background:transparent; padding:0; color:#111; text-decoration:underline; text-underline-offset:3px; cursor:pointer; font:inherit; }
.blr-linklike:hover{ color:var(--blr-red); }