/* Braker Zeitung · Editorial Header V3 · 24.09.2026
   Desktop: heller Zeitungskopf + dunkelblaue Navigationszeile.
   Mobil: heller, kompakter Kopf + Kebab-Menü; keine blaue Navigationszeile.
   Der kompakte Scroll-Header wird durch bz-sticky-drawer.js erzeugt. */
:root{
  --bz-head-navy:#071b2b;
  --bz-head-navy-2:#0b2537;
  --bz-head-red:#d71920;
  --bz-head-ink:#101010;
  --bz-head-line:#dfe5e8;
  --bz-head-shell:min(calc(100% - 48px),1180px);
}

/* Topstrip freundlich/hell statt schwarzer Leiste */
.bzv7-topstrip{
  background:#fff !important;
  border-bottom:1px solid #e7ebee !important;
  color:#32424d !important;
}
.bzv7-topstrip-meta,.bzv7-topstrip-edition{
  color:#42515b !important;
}
.bzv7-topstrip-edition{color:#1d2b34 !important}
.bzv7-topstrip-divider{color:#a9b2b8 !important}
.bzv7-topstrip-button{
  color:#173142 !important;
  background:#fff !important;
  border-color:#9fb4bf !important;
}

/* Source-Header wird nicht selbst sticky. Der kompakte Scroll-Kopf übernimmt. */
.bzv7-header,
body > header#top,
body > header:not(.bzv7-header){
  position:relative !important;
  top:auto !important;
  background:#fff !important;
  color:var(--bz-head-ink) !important;
  border-bottom:1px solid var(--bz-head-line) !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

/* Wortlogo immer unverfälscht und mit sichtbarem roten Designstrich */
.bzv7-brand,
header#top .brand,
header#top a.brand{
  filter:none !important;
  opacity:1 !important;
  visibility:visible !important;
}
.bzv7-brand img,
header#top .brand-logo,
header#top .brand img{
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  object-fit:contain !important;
  object-position:left center !important;
  filter:none !important;
  opacity:1 !important;
  visibility:visible !important;
}

/* -------- DESKTOP -------- */
@media (min-width:900px){
  .bzv7-header-inner,
  header#top .wrap.head,
  header#top .head{
    width:var(--bz-head-shell) !important;
    max-width:none !important;
    margin:0 auto !important;
    padding:0 !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-rows:94px 54px !important;
    gap:0 !important;
    align-items:center !important;
    min-height:148px !important;
    height:auto !important;
  }

  .bzv7-brand,
  header#top .brand{
    grid-column:1 !important;
    grid-row:1 !important;
    justify-self:start !important;
    align-self:center !important;
    width:360px !important;
    max-width:42vw !important;
    flex:0 0 auto !important;
    margin:0 !important;
    padding:0 !important;
  }
  .bzv7-brand img,
  header#top .brand-logo{
    width:360px !important;
    max-width:100% !important;
    max-height:78px !important;
  }

  .bzv7-header-actions,
  header#top .header-actions{
    grid-column:2 !important;
    grid-row:1 !important;
  }
  .bzv7-menu-btn,
  header#top button.menu{
    display:none !important;
  }

  /* dunkelblaue Menüzeile als Full-Bleed-Band unter dem Wortlogo */
  .bzv7-nav,
  header#top .desktop-nav{
    grid-column:1 / -1 !important;
    grid-row:2 !important;
    position:relative !important;
    isolation:isolate !important;
    width:100% !important;
    min-height:54px !important;
    height:54px !important;
    margin:0 !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:27px !important;
    background:transparent !important;
    color:rgba(255,255,255,.88) !important;
    font-family:Arial,Helvetica,sans-serif !important;
    font-size:12px !important;
    font-weight:850 !important;
  }
  .bzv7-nav::before,
  header#top .desktop-nav::before{
    content:"" !important;
    position:absolute !important;
    z-index:-1 !important;
    top:0 !important;
    bottom:0 !important;
    left:50% !important;
    width:100vw !important;
    transform:translateX(-50%) !important;
    background:linear-gradient(90deg,#071b2b 0%,#0a2537 100%) !important;
    border-top:1px solid #0e3148 !important;
    border-bottom:1px solid #0e3148 !important;
  }
  .bzv7-nav > a,
  .bzv7-nav > .bzv7-nav-more > summary,
  header#top .desktop-nav > a,
  header#top .desktop-nav > .bz-nav-more > summary{
    min-height:54px !important;
    height:54px !important;
    display:inline-flex !important;
    align-items:center !important;
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
    border-bottom:3px solid transparent !important;
    color:rgba(255,255,255,.88) !important;
    -webkit-text-fill-color:rgba(255,255,255,.88) !important;
    background:transparent !important;
    white-space:nowrap !important;
  }
  .bzv7-nav > a:hover,
  .bzv7-nav > a:focus-visible,
  .bzv7-nav > a.active,
  .bzv7-nav > a[aria-current="page"],
  .bzv7-nav > .bzv7-nav-more > summary:hover,
  header#top .desktop-nav > a:hover,
  header#top .desktop-nav > a:focus-visible,
  header#top .desktop-nav > a.active,
  header#top .desktop-nav > a[aria-current="page"],
  header#top .desktop-nav > .bz-nav-more > summary:hover{
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    border-bottom-color:var(--bz-head-red) !important;
  }
  .bzv7-nav-more-panel,
  header#top .bz-nav-more-panel{
    background:#fff !important;
    color:#152631 !important;
    border:1px solid #d7e0e4 !important;
    box-shadow:0 18px 44px rgba(7,27,43,.18) !important;
  }
  .bzv7-nav-more-panel a,
  header#top .bz-nav-more-panel a{
    color:#243743 !important;
    -webkit-text-fill-color:#243743 !important;
  }
}

/* -------- MOBILE / TABLET -------- */
@media (max-width:899px){
  .bzv7-topstrip{display:none !important}

  .bzv7-header-inner,
  header#top .wrap.head,
  header#top .head{
    width:100% !important;
    max-width:none !important;
    min-height:68px !important;
    height:68px !important;
    padding:0 max(14px,env(safe-area-inset-left)) 0 max(14px,env(safe-area-inset-right)) !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    background:#fff !important;
  }
  .bzv7-brand,
  header#top .brand{
    width:min(68vw,265px) !important;
    max-width:calc(100% - 62px) !important;
    flex:0 1 auto !important;
    margin:0 !important;
  }
  .bzv7-brand img,
  header#top .brand-logo{
    width:100% !important;
    max-height:50px !important;
  }

  /* keine blaue Menüleiste mobil */
  .bzv7-nav,
  header#top .desktop-nav{display:none !important}

  /* Kebab-Menü statt gequetschter Navigation */
  .bzv7-header .bzv7-menu-btn,
  header#top button.menu{
    display:inline-grid !important;
    place-items:center !important;
    width:44px !important;
    min-width:44px !important;
    height:44px !important;
    min-height:44px !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid #d8dfe3 !important;
    border-radius:12px !important;
    background:#fff !important;
    color:transparent !important;
    -webkit-text-fill-color:transparent !important;
    font-size:0 !important;
    line-height:0 !important;
    box-shadow:none !important;
    overflow:hidden !important;
  }
  .bzv7-header .bzv7-menu-btn::before,
  header#top button.menu::before{
    content:"⋮" !important;
    display:block !important;
    width:auto !important;
    height:auto !important;
    margin:0 !important;
    background:none !important;
    color:#071b2b !important;
    -webkit-text-fill-color:#071b2b !important;
    font:900 28px/1 Arial,Helvetica,sans-serif !important;
    transform:translateY(-1px) !important;
  }
  .bzv7-header .bzv7-menu-btn[aria-expanded="true"]::before,
  header#top button.menu[aria-expanded="true"]::before{
    content:"×" !important;
    font:500 27px/1 Arial,Helvetica,sans-serif !important;
  }
}

@media (max-width:430px){
  .bzv7-header-inner,
  header#top .wrap.head,
  header#top .head{height:64px !important;min-height:64px !important}
  .bzv7-brand,
  header#top .brand{width:min(66vw,235px) !important}
  .bzv7-brand img,
  header#top .brand-logo{max-height:46px !important}
}

/* ===== V4 Korrektur · 24.09.2026 =====
   Ziel: Wortlogo wirklich schwarz/rot auf hellem Kopf, exaktes BZ-Favicon,
   lesbarer Polizei-Ticker, Desktop-Navigation dunkelblau, Mobilkopf hell. */

/* Alte Header-Styles arbeiten mit hochspezifischem invert()-Filter.
   Diese Selektoren sind absichtlich mindestens genauso spezifisch. */
html body .bzv7-header .bzv7-brand,
html body header#top .brand,
html body header#top a.brand{
  filter:none !important;
  opacity:1 !important;
  visibility:visible !important;
  mix-blend-mode:normal !important;
}
html body .bzv7-header .bzv7-brand img,
html body header#top .brand img,
html body header#top img.brand-logo,
html body header#top img[src*="brakerzeitung-wordmark-20260924-v4"]{
  filter:none !important;
  -webkit-filter:none !important;
  opacity:1 !important;
  visibility:visible !important;
  mix-blend-mode:normal !important;
  background:transparent !important;
}

/* Wortmarke: genug Raum, aber kein leerer Weißblock. */
@media (min-width:900px){
  html body .bzv7-header .bzv7-header-inner,
  html body header#top .wrap.head,
  html body header#top .head{
    grid-template-rows:88px 52px !important;
    min-height:140px !important;
  }
  html body .bzv7-header .bzv7-brand,
  html body header#top .brand{
    width:390px !important;
    max-width:44vw !important;
    min-width:0 !important;
  }
  html body .bzv7-header .bzv7-brand img,
  html body header#top .brand-logo,
  html body header#top .brand img{
    width:390px !important;
    max-width:100% !important;
    max-height:72px !important;
    height:auto !important;
  }
  html body .bzv7-header .bzv7-nav,
  html body header#top .desktop-nav{
    min-height:52px !important;
    height:52px !important;
  }
  html body .bzv7-header .bzv7-nav > a,
  html body .bzv7-header .bzv7-nav > .bzv7-nav-more > summary,
  html body header#top .desktop-nav > a,
  html body header#top .desktop-nav > .bz-nav-more > summary{
    min-height:52px !important;
    height:52px !important;
  }
}

/* Der Desktop-Polizeiticker ist bewusst hell. Titel, Link und Meldungen müssen
   auf weißem Grund dunkel bleiben – unabhängig von älteren Header-Regeln. */
@media (min-width:1000px){
  html body .desktop-police-ticker{
    background:#fff !important;
    color:#0a1c2b !important;
    border-color:#dbe2e5 !important;
  }
  html body .desktop-police-ticker > header.desktop-police-head{
    position:static !important;
    top:auto !important;
    z-index:auto !important;
    display:flex !important;
    background:#fff !important;
    color:#0a1c2b !important;
    border-bottom:1px solid #dbe2e5 !important;
    box-shadow:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }
  html body .desktop-police-ticker > header.desktop-police-head strong{
    color:#0a1c2b !important;
    -webkit-text-fill-color:#0a1c2b !important;
    opacity:1 !important;
    visibility:visible !important;
  }
  html body .desktop-police-ticker > header.desktop-police-head a{
    color:#315766 !important;
    -webkit-text-fill-color:#315766 !important;
    opacity:1 !important;
    visibility:visible !important;
  }
  html body .desktop-police-ticker .desktop-police-dot{
    background:#e51b3e !important;
    box-shadow:0 0 0 5px rgba(229,27,62,.13) !important;
  }
  html body .desktop-police-ticker .desktop-police-viewport,
  html body .desktop-police-ticker .desktop-police-item{
    background:#fff !important;
    color:#0a1c2b !important;
  }
  html body .desktop-police-ticker .desktop-police-item strong{
    color:#0a1c2b !important;
    -webkit-text-fill-color:#0a1c2b !important;
    opacity:1 !important;
  }
  html body .desktop-police-ticker .desktop-police-meta{
    color:#77858d !important;
    -webkit-text-fill-color:#77858d !important;
  }
  html body .desktop-police-ticker .desktop-police-item b,
  html body .desktop-police-ticker .desktop-police-footer{
    color:#315766 !important;
    -webkit-text-fill-color:#315766 !important;
  }
  html body .desktop-police-ticker .desktop-police-footer{
    background:#f6f8f9 !important;
    border-top:1px solid #dbe2e5 !important;
  }
}

/* Startseiten-Polizeiticker anderer Template-Generation ebenfalls absichern. */
html body .bzv7-police--home{
  background:#fff !important;
  color:#0a1c2b !important;
  border-color:#dbe2e5 !important;
}
html body .bzv7-police--home > header{
  position:static !important;
  background:#fff !important;
  color:#0a1c2b !important;
  border-bottom:1px solid #dbe2e5 !important;
  box-shadow:none !important;
}
html body .bzv7-police--home > header span,
html body .bzv7-police--home > header strong{
  color:#0a1c2b !important;
  -webkit-text-fill-color:#0a1c2b !important;
}
html body .bzv7-police--home > header a{
  color:#315766 !important;
  -webkit-text-fill-color:#315766 !important;
}
html body .bzv7-police--home .bzv7-police-list a{
  background:#fff !important;
  color:#0a1c2b !important;
  border-bottom-color:#e0e6e9 !important;
}
html body .bzv7-police--home .bzv7-police-list strong{
  color:#0a1c2b !important;
  -webkit-text-fill-color:#0a1c2b !important;
}
html body .bzv7-police--home .bzv7-police-list time{
  color:#77858d !important;
  -webkit-text-fill-color:#77858d !important;
}
html body .bzv7-police--home .bzv7-police-list small,
html body .bzv7-police--home .bzv7-police-list b,
html body .bzv7-police--home .bzv7-police-all span{
  color:#315766 !important;
  -webkit-text-fill-color:#315766 !important;
}
html body .bzv7-police--home .bzv7-police-all{
  background:#f6f8f9 !important;
  color:#0a1c2b !important;
  -webkit-text-fill-color:#0a1c2b !important;
  border-top:1px solid #dbe2e5 !important;
}

/* Mobil: kein dunkelblauer Sticky-Balken. Wortlogo + Kebab auf Weiß. */
@media (max-width:899px){
  html body .bz-sticky{
    background:rgba(255,255,255,.985) !important;
    color:#071b2b !important;
    border-bottom:1px solid #dfe5e8 !important;
    box-shadow:0 8px 24px rgba(7,27,43,.12) !important;
  }
  html body .bz-sticky .bz-sticky__wordmark-img{
    display:block !important;
    filter:none !important;
    -webkit-filter:none !important;
    width:min(62vw,225px) !important;
    max-height:42px !important;
    height:auto !important;
    object-fit:contain !important;
    object-position:left center !important;
  }
  html body .bz-sticky .bz-sticky__wordmark-text{display:none !important}
  html body .bz-sticky .bz-sticky__button{
    background:#fff !important;
    color:#071b2b !important;
    -webkit-text-fill-color:#071b2b !important;
    border-color:#d8dfe3 !important;
  }
  html body .bz-sticky .bz-sticky__dots{
    display:block !important;
    color:#071b2b !important;
    -webkit-text-fill-color:#071b2b !important;
    font:900 28px/1 Arial,Helvetica,sans-serif !important;
  }
  html body .bz-sticky .bz-sticky__hamburger{display:none !important}
}

/* ===== V5 Kontrast-Hotfix · 24.09.2026 =====
   Letzte Kaskadenstufe für die aktive V7-Startseiten-Navigation und den
   hellen Desktop-Polizeiticker. Absichtlich hochspezifisch, damit ältere
   Header-/Brand-Regeln die Schriftfarben nicht wieder überschreiben. */
@media (min-width:900px){
  html body .bzv7-header nav.bzv7-nav{
    color:#f7fbfd !important;
    -webkit-text-fill-color:#f7fbfd !important;
    filter:none !important;
    mix-blend-mode:normal !important;
  }
  html body .bzv7-header nav.bzv7-nav > a:not([href="/widerruf"]),
  html body .bzv7-header nav.bzv7-nav > details.bzv7-nav-more > summary{
    color:#f7fbfd !important;
    -webkit-text-fill-color:#f7fbfd !important;
    text-shadow:none !important;
    filter:none !important;
    mix-blend-mode:normal !important;
  }
  html body .bzv7-header nav.bzv7-nav > a:not([href="/widerruf"]):hover,
  html body .bzv7-header nav.bzv7-nav > a:not([href="/widerruf"]):focus-visible,
  html body .bzv7-header nav.bzv7-nav > a:not([href="/widerruf"]).active,
  html body .bzv7-header nav.bzv7-nav > a:not([href="/widerruf"])[aria-current="page"],
  html body .bzv7-header nav.bzv7-nav > details.bzv7-nav-more > summary:hover,
  html body .bzv7-header nav.bzv7-nav > details.bzv7-nav-more[open] > summary{
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
  }
}

@media (min-width:1000px){
  html body .desktop-police-ticker > header.desktop-police-head{
    background:#fff !important;
    color:#0a1c2b !important;
    border-bottom:1px solid #dbe2e5 !important;
  }
  html body .desktop-police-ticker > header.desktop-police-head > div,
  html body .desktop-police-ticker > header.desktop-police-head > div > strong,
  html body .desktop-police-ticker > header.desktop-police-head > a{
    visibility:visible !important;
    filter:none !important;
    mix-blend-mode:normal !important;
  }
  html body .desktop-police-ticker > header.desktop-police-head > div > strong{
    display:inline !important;
    color:#0a1c2b !important;
    -webkit-text-fill-color:#0a1c2b !important;
  }
  html body .desktop-police-ticker > header.desktop-police-head > a{
    display:inline-flex !important;
    color:#315766 !important;
    -webkit-text-fill-color:#315766 !important;
  }
}