/* ============================================================
   BDO-Infopool — Reskin-Theme (Schmittel-IT)
   Geladen NACH mini.css. Header/Navigation 1:1 aus dem Mockup
   übernommen. DOM-IDs (#brand-logo, #navLinks, #modalSearchButton,
   #mobile-demo) bleiben erhalten → init.js / navigation.js intakt.
   ============================================================ */
:root{
  --bdo-blue:#009fe3; --bdo-navy:#014b7c; --bdo-dark:#001928;
  --bdo-light:#e8f5fb; --bdo-mid:#96d7f3; --bdo-line:#dde6ec; --bdo-bg:#f2f6f9;
}

body#docbody{ background:var(--bdo-bg)!important; }
/* Flackerfreie Seitenwechsel (auch in der Verbands-iFrame-Einbettung):
   1) html bekommt dieselbe App-Hintergrundfarbe -> der kurze Repaint-Gap beim
      Navigieren zeigt das BDO-Grau statt Weiss (greift in ALLEN Browsern, inkl. Firefox).
   2) Cross-Document View Transitions blenden alte->neue Seite weich ueber (Chromium);
      Browser ohne Support navigieren unveraendert wie bisher (kein Bruch, kein JS).
   Volles No-Reload (pjax) ginge nur mit Refactoring jedes Seiten-Skripts (Top-Level
   const/let + DOMContentLoaded-Init sind nicht re-entrant) -> separat, hier bewusst nicht. */
html{ background:var(--bdo-bg); }
/* pjax-Wrapper (Issue #10) MUSS layout-transparent sein: #pjax-root darf das Seitenlayout
   nicht verändern, sonst bricht u. a. das Sticky-Footer-Layout der Login-Seite
   (body#docbody = Flex-Column; Bus/Admin-Login kleben über den margin-top:auto-Fluss am
   Footer). display:contents = kein eigenes Box-Modell -> Kinder sind wieder direkte
   Flex-Kinder von body; der pjax-Swap (innerHTML/getElementById) bleibt unberührt. */
#pjax-root{ display:contents; }
@view-transition{ navigation:auto; }
@media (prefers-reduced-motion: reduce){
  ::view-transition-old(root), ::view-transition-new(root){ animation:none!important; }
}
#cookieconsent{ display:none!important; }

/* Scrollbalken-Rinne immer reservieren -> kein Breiten-Sprung/Flackern beim Navigieren
   zwischen Seiten mit/ohne vertikalem Scrollbalken (zentrierte Kopfzeile springt sonst). */
html{ overflow-y:scroll; }

/* Sanfter Cross-Fade bei vollen Seitenwechseln (Cross-Document View Transitions, Chromium/Edge);
   Browser ohne Support ignorieren es. Der Header bekommt einen eigenen Transition-Namen ->
   bleibt beim Wechsel stabil stehen statt mitzufaden (der "leichte Sprung" verschwindet). */
@view-transition{ navigation:auto; }
.bdohead{ view-transition-name:bdo-header; }

/* ====================== BDO-HEADER (Mockup 1:1) ====================== */
.bdohead{
  background:linear-gradient(180deg,#0b6cab 0%,#024c7d 100%)!important;
  display:flex!important; align-items:center; gap:22px; padding:0 30px!important;
  min-height:78px; box-shadow:0 2px 10px rgba(1,75,124,.18); position:relative; z-index:3; }
#brand-logo.brand-logo{
  background-image:url('/images/bdo-logo-white.svg')!important;
  background-size:contain!important; background-repeat:no-repeat!important;
  background-position:left center!important;
  position:static!important; transform:none!important; left:auto!important; top:auto!important;
  margin:0!important; height:78px!important; width:430px!important; max-width:54vw!important;
  cursor:pointer; }

/* Header-Suche (= #modalSearchButton, öffnet weiterhin das Such-Modal).
   Kein Balken/keine Pille mehr: nur Lupe + Text als weißer Klick-Link, rechts. */
a#modalSearchButton.hsearch{
  position:static!important; margin-left:auto!important; right:auto!important; bottom:auto!important;
  display:inline-flex!important; align-items:center; gap:9px; width:auto!important; max-width:none!important;
  height:auto!important; padding:6px 2px!important; border-radius:0!important;
  background:transparent!important; border:0!important; border-bottom:2px solid transparent!important;
  box-shadow:none!important; line-height:1!important; }
a#modalSearchButton.hsearch:hover{ border-bottom-color:rgba(255,255,255,.7)!important; background:transparent!important; }
a#modalSearchButton.hsearch #modalSearchIcon{ color:#fff!important; font-size:21px!important; }
.hsearch-text{ color:#fff!important; font-size:16px; }
.bdo-burger{ display:none!important; }

/* Header-Werkzeuge rechts: KI-Assistent + Suche gruppiert (KI links neben der Suche). */
.headtools{ margin-left:auto!important; display:inline-flex!important; align-items:center; gap:20px; }
.headtools a#modalSearchButton.hsearch{ margin-left:0!important; }
.hki{ display:inline-flex!important; align-items:center; gap:9px; color:#fff!important; text-decoration:none;
  padding:6px 2px; border-bottom:2px solid transparent; line-height:1; cursor:pointer; }
.hki:hover{ border-bottom-color:rgba(255,255,255,.7); }
.hki .material-icons{ color:#fff!important; font-size:21px!important; }
/* Mobil: nur Icons, damit der Header nicht überläuft. */
@media(max-width:680px){ .headtools .hsearch-text{ display:none; } .headtools{ gap:14px; } }

/* ====================== APP-NAVIGATION (weiße Leiste) ====================== */
.subnav{ background:#fff; border-bottom:1px solid var(--bdo-line); display:flex; align-items:center;
  padding:8px 26px; flex-wrap:wrap; position:relative; z-index:3; }
ul#navLinks.navrow{ display:flex!important; flex-wrap:nowrap; align-items:center; gap:3px;
  float:none!important; margin:0!important; padding:0!important; list-style:none!important;
  flex:1 1 auto; min-width:0; width:auto; }
ul#navLinks.navrow li.navitem{ display:inline-block!important; float:none!important; line-height:normal!important; margin:0; }
ul#navLinks.navrow li.navitem a{
  display:inline-flex!important; align-items:center; gap:8px; padding:9px 14px!important;
  border-radius:9px!important; height:auto!important; line-height:1.2!important;
  color:var(--bdo-navy)!important; }
ul#navLinks.navrow li.navitem a .material-icons{ color:var(--bdo-navy)!important; font-size:21px!important; }
ul#navLinks.navrow li.navitem .navlabel{ color:var(--bdo-navy)!important; font-weight:600; font-size:15px; }
ul#navLinks.navrow li.navitem a:hover{ background:var(--bdo-light)!important; }
/* aktive Seite (falls Link-Klasse gesetzt) hervorheben */
ul#navLinks.navrow li.navitem.active a, ul#navLinks.navrow li.navitem.current a{
  background:var(--bdo-blue)!important; }
ul#navLinks.navrow li.navitem.active a *, ul#navLinks.navrow li.navitem.current a *{ color:#fff!important; }

/* (Leere Fachbereiche werden jetzt über die Admin-Einstellungen/Konfig gesteuert,
   nicht mehr per Interim-CSS — siehe /adminsettings + showUserDB.) */

/* Benutzername + Logout als GETRENNTE Gruppe ganz rechts (Admin u.a. bleiben links).
   margin-left:auto auf das erste Element der rechten Gruppe schiebt sie ans Ende;
   funktioniert, weil ul#navLinks jetzt die volle Breite hat (flex:1). */
ul#navLinks.navrow li.navitem.usernameItem{ margin-left:auto!important; }
/* Fallback: falls kein Benutzername da ist, Logout selbst nach rechts; sonst zurücksetzen */
ul#navLinks.navrow li.navitem.logoutLink{ margin-left:auto!important; }
ul#navLinks.navrow li.navitem.usernameItem ~ li.navitem.logoutLink{ margin-left:0!important; }
/* dezenter Trenner links der rechten Gruppe */
ul#navLinks.navrow li.navitem.usernameItem{ border-left:1px solid var(--bdo-line); padding-left:6px; margin-left:auto!important; }
/* Benutzername = reine Anzeige, nicht klickbar */
ul#navLinks.navrow li.navitem.usernameItem a{ pointer-events:none; cursor:default; }
ul#navLinks.navrow li.navitem.usernameItem .navlabel{ color:#5b6b76!important; }
ul#navLinks.navrow li.navitem.usernameItem a .material-icons{ color:var(--bdo-blue)!important; }

/* Mobile-Sidenav */
.sidenav .menuhead{ background:linear-gradient(180deg,#0b6cab,#024c7d); color:#fff; padding:14px 18px; }
.sidenav .menuhead h5{ color:#fff!important; padding:0; }
.sidenav li>a{ color:var(--bdo-navy)!important; font-weight:600; }
.sidenav li>a .material-icons{ color:var(--bdo-blue)!important; }
@media(max-width:992px){ .bdo-burger{ display:flex!important; align-items:center; color:#fff; } }
/* ... unter 992px uebernimmt der Burger + die Sidenav: Desktop-Navrow ausblenden
   (sonst doppelte Navigation). */
@media(max-width:992px){ ul#navLinks.navrow{ display:none!important; } }
/* Und den Rahmen gleich mit: Ohne die Navigationszeile blieb .subnav als leerer, 17px
   hoher weisser Streifen unter der Kopfleiste stehen — der "komische" Balken oben auf dem
   Handy. Nur ausblenden, NICHT entfernen: pjax tauscht #navLinks bei jedem Seitenwechsel
   aus und init.js haengt Klick-Behandler daran. */
@media(max-width:992px){ .subnav{ display:none!important; } }

/* Unter 640px gab es zeitweise eine feste Tab-Leiste am unteren Rand (#48). Sie ist
   wieder entfallen: Auf Wunsch des PO laeuft die Navigation auf dem Handy vollstaendig
   ueber den Burger in der Kopfleiste — eine Leiste, die dauerhaft Platz belegt, weniger
   Punkte fasst als das Menue und den Daumenbereich blockiert, war der schlechtere Tausch.
   Der Burger ist damit ab 992px abwaerts durchgehend zustaendig (Regel weiter oben). */

/* ====================== Buttons ====================== */
/* GLOBAL: Materialize faerbt JEDEN <button>:focus/:active tuerkis (#2ab7a9 / rgba(43,161,150)).
   Einmal zentral abschalten -> Buttons behalten ihre eigene Hintergrundfarbe. Farbige
   Button-Klassen stellen ihren Hintergrund unten per :focus/:active selbst wieder her. */
button:focus, button:active{ background-color:transparent; }
.btn, button.btn, .btn-large{ background-color:var(--bdo-blue)!important; border-radius:9px!important;
  text-transform:none!important; font-weight:600!important; box-shadow:0 2px 8px rgba(0,159,227,.25)!important; }
.btn:hover, button.btn:hover{ background-color:#0089c4!important; }
.btn-white, a.btn-white, button.btn-white{ display:inline-flex; align-items:center; justify-content:center; gap:6px;
  background:#fff!important; color:var(--bdo-navy)!important; border:1px solid var(--bdo-line)!important;
  border-radius:9px!important; box-shadow:none!important; text-transform:none!important; }
.btn-white .material-icons{ font-size:18px; }
.btn-white:hover{ background:var(--bdo-light)!important; border-color:var(--bdo-blue)!important; color:var(--bdo-blue)!important; }
.btn-flat{ text-transform:none!important; color:var(--bdo-navy)!important; }
/* Farbige App-Buttons behalten bei :focus/:active ihre eigene Farbe (statt Materialize-Tuerkis). */
.ua-btn:focus, .ua-btn:active{ background-color:#fff; }
.ua-btn-primary:focus, .ua-btn-primary:active{ background-color:var(--bdo-blue); }
.ua-btn-danger:focus, .ua-btn-danger:active{ background-color:#fff; }
.ua-pill:focus, .ua-pill:active{ background-color:#fff; }
.ua-pill.on:focus, .ua-pill.on:active{ background-color:var(--bdo-light); }
.ua-tab:focus, .ua-tab:active{ background-color:transparent; }
.ua-tab.on:focus, .ua-tab.on:active{ background-color:var(--bdo-blue); }
.ua-seg-i:focus, .ua-seg-i:active{ background-color:transparent; }
.ua-seg-i.on:focus, .ua-seg-i.on:active{ background-color:var(--bdo-blue); }

/* ====================== Such-Modal ====================== */
.modalSearchScreen .tabs .tab a{ color:var(--bdo-navy)!important; }
.modalSearchScreen .tabs .tab a.active{ color:var(--bdo-blue)!important; }
.modalSearchScreen .tabs .indicator{ background-color:var(--bdo-blue)!important; }
.searchmodal-content{ border-radius:14px; }
input[type=search]:focus, input[type=text]:focus, input:focus{
  border-bottom:1px solid var(--bdo-blue)!important; box-shadow:0 1px 0 0 var(--bdo-blue)!important; }
.input-field label.active, .searchlable{ color:var(--bdo-navy)!important; }

/* ====================== Inhaltsbereich ====================== */
#startcontainer.container{ width:92%!important; max-width:1280px!important; }
/* Start-Seite: keine leere Kopfzeile mehr (message/title leer → Blöcke entfallen),
   darum Section-Polster oben knapp halten, damit die Suche nicht im Leerraum schwebt */
#startcontainer .section{ padding-top:2px!important; padding-bottom:6px!important; }
#startcontainer .row{ margin-bottom:0!important; }
#redirect.white.fill, #startcontainer .white.fill{ background:#fff!important; border-radius:16px!important;
  box-shadow:0 8px 26px rgba(1,75,124,.07)!important; padding:18px 6px 24px!important; }
.welcometitle, #startcontainer h1, #startcontainer h2{ color:var(--bdo-navy)!important; }
.welcome p{ color:var(--bdo-navy)!important; }
#startContent a, #pagecontent a, .item-paragraph a, footer a{ color:var(--bdo-blue)!important; }

.tabs .tab a{ color:var(--bdo-navy)!important; }
.tabs .tab a.active{ color:#fff!important; background:var(--bdo-navy)!important; border-radius:8px; }
.tabs .indicator{ background-color:var(--bdo-blue)!important; }

/* ====================== Footer ====================== */
footer.page-footer, .page-footer{ background:#fff!important; border-top:1px solid var(--bdo-line)!important; }
.page-footer .bdo-bullits{ display:flex; flex-wrap:wrap; justify-content:center; gap:6px 22px; padding:4px 0; list-style:none; }
.page-footer .bdo-bullits li{ list-style:none; }
.page-footer .footer-logo{ display:none!important; }
/* Sticky-Footer: hängt am unteren Rand, kein grauer Streifen darunter */
body#docbody{ display:flex!important; flex-direction:column; min-height:100vh; }
/* Kompakter Footer (weniger Leerraum unter den Links); position:relative für den
   rechtsbündigen Textgröße-Regler. */
footer.page-footer{ margin:auto 0 0 0!important; padding:12px 0 12px!important; box-shadow:none!important;
  background:#fff!important; position:relative; }
/* Symmetrischer Abstand um die Footer-Links: Materialize-.row-margin (20px unten)
   und ul-Default-Margins rausnehmen — oben/unten zaehlt nur noch das Footer-Padding. */
footer.page-footer .row{ margin-bottom:0!important; }
footer.page-footer .bdo-bullits{ margin:0; }

/* Akzente */
.blue, .blue-text{ color:var(--bdo-blue)!important; }
.material-icons.icon-blue, .icon-blue-nav{ color:var(--bdo-blue)!important; }

/* ====================== STARTSEITE-INHALT (Mockup-Look) ====================== */
/* Weniger Luft ueber UND unter dem Start-Inhalt (mini.css setzt 3rem oben / 5rem unten) — User-Wunsch 5px. */
#startContent{ text-align:left; padding-top:5px!important; padding-bottom:5px!important; }
#startContent .welcometitle, .welcometitle{ text-align:left; }
#startContent .collapsibleStart{ list-style:none!important; margin:0 0 12px!important; padding:0!important; }
#startContent .collapsibleStart li{ list-style:none!important; }

/* Sektions-Karten (Letzte Änderungen / Länder / Corona / …) */
#startContent .startcontentBox{
  display:flex!important; align-items:center; gap:16px;
  background:#fff!important; border:1px solid var(--bdo-line)!important; border-radius:12px!important;
  padding:15px 20px!important; margin:0 0 12px 0!important; cursor:pointer; transition:.12s;
  box-shadow:0 2px 8px rgba(1,75,124,.04)!important; }
#startContent .startcontentBox:hover{ border-color:var(--bdo-blue)!important;
  box-shadow:0 8px 20px rgba(0,159,227,.14)!important; transform:translateY(-1px); }
#startContent .startcontentBox > .spacer:first-child{ flex:0 0 auto; width:46px; height:46px;
  border-radius:12px; background:var(--bdo-light); display:flex!important; align-items:center; justify-content:center; }
#startContent .startcontentBox .spacer-m{ flex:1; text-align:left!important; font-size:17px;
  font-weight:600; color:var(--bdo-navy)!important; }
#startContent .startcontentBox > .spacer:last-child{ flex:0 0 auto; width:auto; }
#startContent .startcontentBox > .spacer:last-child::after{ content:"\203A"; color:var(--bdo-mid); font-size:26px; line-height:1; }
#startContent .startIcon{ width:24px!important; height:24px!important; }
#startContent .startIconfill, #startContent .iconNN, #startContent .iconLL, #startContent .iconCC,
#startContent .iconRR, #startContent .iconKK, #startContent .iconEE{ fill:var(--bdo-blue)!important; }

/* „Letzte Änderungen“-Liste */
#startContent .collapsible-news{ background:transparent; }
#startContent #nn_lastChangeslist{ list-style:none; margin:4px 0 12px; padding:0; }
#startContent .lastChangeslink-li{ display:flex; align-items:center; gap:14px; padding:10px 16px;
  background:#fff; border:1px solid var(--bdo-line); border-radius:10px; margin-bottom:8px; }
#startContent .listedDate{ color:#5b6b76; font-size:13px; min-width:92px; }
#startContent .listedIcon svg{ width:20px; height:20px; }
#startContent .lastChangesLink{ color:var(--bdo-navy)!important; font-weight:600; text-decoration:none; }
#startContent .lastChangesLink:hover{ color:var(--bdo-blue)!important; }

/* Verbands-Logo-Raster mit Überschrift */
#startContent #verbandslogos{ display:grid!important; gap:14px!important; margin-top:8px;
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); }
#startContent #verbandslogos::before{ content:"Unsere Landesverbände"; grid-column:1 / -1;
  font-family:'Montserrat-Bold',sans-serif; font-size:18px; font-weight:800; color:var(--bdo-navy);
  margin:12px 0 2px; }
#startContent .verbandslogo{ background:#fff!important; border:1px solid var(--bdo-line)!important;
  border-radius:12px!important; height:96px; display:flex!important; align-items:center; justify-content:center;
  padding:14px!important; margin:0!important; transition:.15s; }
#startContent .verbandslogo:hover{ border-color:var(--bdo-mid)!important; box-shadow:0 6px 16px rgba(1,75,124,.1)!important; }
#startContent .verbandslogo img{ max-width:100%!important; max-height:62px!important; width:auto!important;
  height:auto!important; object-fit:contain; }

/* ====================== SCHRIFTART: Roboto (von bdo.org, self-hosted) ====================== */
@font-face{font-family:'Roboto';src:url('/fonts/roboto-300.woff2') format('woff2');font-weight:300;font-style:normal;font-display:swap;}
@font-face{font-family:'Roboto';src:url('/fonts/roboto-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Roboto';src:url('/fonts/roboto-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:'Roboto';src:url('/fonts/roboto-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:'Roboto Slab';src:url('/fonts/robotoslab-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap;}
html, body, body#docbody{ font-family:'Roboto','Segoe UI',Helvetica,Arial,sans-serif!important; }
input, button, select, textarea, .btn, .nav-item, .navlabel{ font-family:'Roboto','Segoe UI',Helvetica,Arial,sans-serif!important; }
h1, h2, h3, .welcometitle, #startContent .panel h3, .start-verb h3{ font-family:'Roboto Slab','Roboto',serif!important; }
/* material-icons NICHT umstellen (sonst brechen die Icons) */

/* ====================== STARTSEITE KONZEPT A (Aktuelles-Cockpit) ====================== */
#startContent{ text-align:left; }
.start-search{ display:flex; align-items:center; gap:12px; background:#fff; border:2px solid var(--bdo-mid);
  border-radius:13px; padding:15px 20px; margin-bottom:18px; cursor:pointer; transition:.12s; }
.start-search:hover{ border-color:var(--bdo-blue); }
.start-search svg{ width:22px; height:22px; stroke:var(--bdo-blue); fill:none; stroke-width:2.2; }
.start-search span{ color:#8aa0ad; font-size:17px; }
.start-grid{ display:grid; grid-template-columns:1fr 340px; gap:20px; align-items:start; }
@media(max-width:900px){ .start-grid{ grid-template-columns:1fr; } }
#startContent .panel{ background:#fff; border:1px solid var(--bdo-line); border-radius:14px; padding:18px 20px; }
#startContent .panel h3{ font-size:17px; color:var(--bdo-navy); margin-bottom:10px; display:flex; align-items:center; gap:10px; }
#startContent .panel h3 .startIcon{ font-size:21px!important; color:var(--bdo-blue)!important; width:auto!important; height:auto!important; }
#startContent .startIconfill{ fill:var(--bdo-blue)!important; }
/* Feste Spalten: Kategorie | Flagge | Land | Titel | Datum — alle Zeilen bündig (interne "Tabelle") */
.feed-item{ display:grid; grid-template-columns:6.5rem 24px 9.5rem minmax(0,1fr) auto; align-items:center; column-gap:14px; padding:11px 6px; border-bottom:1px solid var(--bdo-line); color:var(--bdo-dark); }
.feed-item:last-child{ border-bottom:none; }
.feed-item:hover{ background:var(--bdo-light); border-radius:8px; }
.feed-chip{ justify-self:start; font-size:10.5px; font-weight:700; padding:3px 9px; border-radius:20px; background:var(--bdo-light); color:var(--bdo-navy); white-space:nowrap; }
.feed-chip.corona{ background:#fde9e0; color:#b85c39; } .feed-chip.recht{ background:#e7eef6; color:#27557e; }
.feed-chip.komm{ background:#e6f6ee; color:#1f7a52; } .feed-chip.eco{ background:#fef3d9; color:#9a7400; }
.feed-flag-cell{ display:flex; align-items:center; justify-content:center; }
.feed-flag{ width:24px; height:18px; object-fit:cover; border-radius:2px; box-shadow:0 0 0 1px rgba(0,0,0,.10); display:block; }
.feed-land{ font-size:14px; font-weight:700; color:var(--bdo-dark); line-height:1.2; }
.feed-title{ min-width:0; font-size:14.5px; font-weight:600; color:var(--bdo-navy); }
.feed-date{ justify-self:end; font-size:12.5px; color:#5b6b76; white-space:nowrap; }
.feed-empty{ color:#8aa0ad; padding:12px 4px; }
@media (max-width:768px){
  .feed-item{ grid-template-columns:24px auto minmax(0,1fr) auto; column-gap:9px; }
  .feed-chip{ display:none; }
}
.qtiles{ display:flex; flex-direction:column; gap:10px; }
.qtile{ display:flex; align-items:center; gap:13px; padding:13px 14px; border:1px solid var(--bdo-line); border-radius:11px; background:#fff; transition:.12s; }
.qtile:hover{ border-color:var(--bdo-blue); box-shadow:0 6px 16px rgba(0,159,227,.13); transform:translateY(-1px); }
.qtile .qic{ width:44px; height:44px; border-radius:11px; background:var(--bdo-light);
  display:grid!important; place-items:center!important; flex:none; }
.qtile .qic .startIcon{ font-size:24px!important; color:var(--bdo-blue)!important; width:auto!important; height:auto!important; }
.qtile .qic svg{ width:22px!important; height:22px!important; display:block; }
.qtile .qn{ font-size:15px; font-weight:600; color:var(--bdo-navy); }
.qtile .qs{ font-size:12px; color:#5b6b76; }
.start-verb{ margin-top:24px; }
.start-verb h3{ font-size:18px; color:var(--bdo-navy); margin-bottom:12px; }
.verbgrid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(118px,1fr)); gap:12px; }
.verbcard{ background:#fff; border:1px solid var(--bdo-line); border-radius:12px; padding:12px 10px 9px;
  display:flex; flex-direction:column; align-items:center; gap:8px; transition:.12s; }
.verblogo{ height:56px; display:flex; align-items:center; justify-content:center; }
.verblogo img{ max-width:100%; max-height:56px; width:auto; height:auto; object-fit:contain; }
.verbk{ font-size:13px; font-weight:700; color:var(--bdo-navy); letter-spacing:.3px; }

/* ====================== LÄNDER-SEITE (Feinschliff, additiv) ====================== */
.btn-laender, .btn.btn-laender{ background:#fff!important; color:var(--bdo-navy)!important;
  border:1px solid var(--bdo-line)!important; border-radius:9px!important; box-shadow:none!important;
  text-transform:none!important; font-weight:600!important; }
.btn-laender:hover{ background:var(--bdo-light)!important; border-color:var(--bdo-blue)!important; }
.new.badge.topicbadge.blue{ background-color:var(--bdo-blue)!important; }
.new.badge.topicbadge{ border-radius:12px!important; }
.laenderInfoName{ color:var(--bdo-navy)!important; font-weight:700; }
.laenderInfoButton, .laenderInfoIcon .material-icons{ color:var(--bdo-blue)!important; }
.lastChangeslink-li{ display:flex; align-items:center; gap:12px; padding:10px 14px; background:#fff;
  border:1px solid var(--bdo-line); border-radius:10px; margin-bottom:8px; }
.lastChangesLink{ color:var(--bdo-navy)!important; font-weight:600; }
.lastChangesLink:hover{ color:var(--bdo-blue)!important; }
.svgframe, #mapframe{ border-radius:12px; }

/* ====================== LÄNDER-SEITE (Neuaufbau, Mockup-Stil) ====================== */
.ll-container{ width:92%; max-width:1280px; margin:0 auto; padding-top:8px; padding-bottom:52px; }

.ll-pagetitle{ font-size:28px; color:var(--bdo-navy); margin:6px 0 2px; padding-top:5px; }
.ll-pagelead{ color:#5b6b76; font-size:15px; margin-bottom:16px; }
/* Liste/Karte-Umschalter */
.ll-tabs{ display:flex; gap:6px; margin:4px 0 16px; border-bottom:2px solid var(--bdo-line); }
.ll-tab{ display:inline-flex; align-items:center; gap:7px; background:none; border:none; cursor:pointer;
  font:inherit; font-size:15px; font-weight:600; color:#5b6b76; padding:9px 16px; border-radius:9px 9px 0 0;
  margin-bottom:-2px; border-bottom:2px solid transparent; }
.ll-tab .material-icons{ font-size:19px; }
.ll-tab:hover{ color:var(--bdo-blue); }
.ll-tab.on{ color:var(--bdo-navy); border-bottom-color:var(--bdo-blue); }
/* Materialize-Erbe: button:focus -> grün. Für die Umschalter unterdrücken. */
.ll-tab:focus,.ll-tab:active{ background:none!important; outline:none; }

/* Fachbereich-Schlagwörter: Tag-Wolke + Trefferliste */
.cp-tagview{ padding:2px 0 8px; }
.cp-cloud{ display:flex; flex-wrap:wrap; gap:9px; margin:2px 0 20px; }
.cp-tag{ display:inline-flex; align-items:center; gap:7px; cursor:pointer; font:inherit; font-size:14px; font-weight:600;
  color:var(--bdo-navy); background:var(--bdo-light); border:1px solid var(--bdo-line); border-radius:16px; padding:6px 13px; }
.cp-tag:hover{ border-color:var(--bdo-mid); }
.cp-tag:focus,.cp-tag:active{ outline:none; }
.cp-tag.on{ background:var(--bdo-blue); border-color:var(--bdo-blue); color:#fff; }
.cp-tagc{ font-size:12px; font-weight:700; opacity:.7; background:rgba(0,0,0,.06); border-radius:9px; padding:0 7px; }
.cp-tag.on .cp-tagc{ background:rgba(255,255,255,.22); opacity:1; }
.cp-hint{ color:#5b6b76; font-size:14.5px; margin:6px 2px; }
/* Schlagwörter-Zeile am Artikel (klickbare Chips -> springen in die Schlagwörter-Ansicht). */
.cp-arttags{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:26px 0 4px; padding-top:16px; border-top:1px solid var(--bdo-line); }
.cp-arttags-l{ display:inline-flex; align-items:center; gap:6px; color:#90a0ad; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; margin-right:4px; }
.cp-arttags-l .material-icons{ font-size:18px; }
.cp-arttag{ cursor:pointer; font:inherit; font-size:13.5px; font-weight:600; color:var(--bdo-navy); background:var(--bdo-light);
  border:1px solid transparent; border-radius:999px; padding:5px 13px; transition:background .12s ease, border-color .12s ease; }
.cp-arttag:hover{ background:var(--bdo-mid); border-color:var(--bdo-blue); }
.cp-arttag:focus,.cp-arttag:active{ outline:none; }
.cp-reslbl{ font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:#90a0ad; margin:4px 2px 10px; }
.cp-results{ list-style:none; margin:0; padding:0; max-width:760px; }
.cp-results li{ display:flex; flex-direction:column; gap:2px; padding:11px 14px; border:1px solid var(--bdo-line);
  border-radius:10px; background:#fff; margin-bottom:8px; cursor:pointer; }
.cp-results li:hover{ border-color:var(--bdo-blue); background:var(--bdo-light); }
.cp-rtitle{ font-weight:600; color:var(--bdo-blue); }
.cp-rpath{ font-size:12.5px; color:#8a98a4; }

/* ===== Länder-Karte (laender-map.js, world.svg / Natural Earth 1:50m, Mercator) ===== */
/* Randlos (full-bleed) über die volle Fensterbreite; Ozean als heller Verlauf. */
.ll-mapwrap{ position:relative; width:100vw; margin-left:calc(50% - 50vw);
  background:linear-gradient(180deg,#eef7fc 0%, var(--bdo-light) 100%);
  border-top:1px solid var(--bdo-line); border-bottom:1px solid var(--bdo-line); }

/* Toolbar schwebt über der Karte: Suche links, Europa/Welt + EU-Chip rechts. */
.ll-map-toolbar{ position:absolute; top:14px; left:16px; right:16px; z-index:20;
  display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:12px; pointer-events:none; }
.ll-map-toolbar > *{ pointer-events:auto; }
/* Linke Gruppe: Suchleiste + direkt daneben der „Europa/EU"-Chip. */
.ll-map-left{ display:flex; align-items:flex-start; gap:10px; flex:1 1 auto; min-width:0; }
.ll-map-searchwrap{ position:relative; flex:1 1 280px; min-width:200px; max-width:430px; }
.ll-map-search{ margin-bottom:0!important; background:#fff!important; box-shadow:0 3px 12px rgba(1,75,124,.14); }
.ll-map-controls{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.ll-map-seg{ display:flex; gap:3px; background:#fff; border:1px solid var(--bdo-line); border-radius:9px; padding:3px; box-shadow:0 3px 12px rgba(1,75,124,.14); }
.ll-map-seg-i{ padding:7px 16px; border:0; border-radius:7px; font:inherit; font-size:13.5px; font-weight:600;
  color:var(--bdo-navy); background:transparent; cursor:pointer; }
.ll-map-seg-i:hover{ background:var(--bdo-light); }
.ll-map-seg-i.on{ background:var(--bdo-blue); color:#fff; }
.ll-map-seg-i:focus,.ll-map-seg-i:active{ outline:none; }
.ll-map-seg-i.on:focus,.ll-map-seg-i.on:active{ background:var(--bdo-blue)!important; }
.ll-map-euchip{ display:inline-flex; align-items:center; gap:7px; background:#fff; border:1px solid var(--bdo-line);
  border-radius:20px; padding:7px 14px 7px 11px; font:inherit; font-size:13.5px; font-weight:600; color:var(--bdo-navy); cursor:pointer; box-shadow:0 3px 12px rgba(1,75,124,.14); }
.ll-map-euchip .material-icons{ font-size:18px; color:var(--bdo-blue); }
.ll-map-euchip img{ width:22px; height:16px; object-fit:cover; border-radius:3px; box-shadow:0 0 0 1px rgba(0,0,0,.12); flex:none; }
.ll-map-euchip:hover{ border-color:var(--bdo-blue); color:var(--bdo-blue); }
.ll-map-euchip:focus,.ll-map-euchip:active{ outline:none; }
.ll-map-euchip.selected{ background:var(--bdo-navy); border-color:var(--bdo-navy); color:#fff; }
.ll-map-euchip.selected .material-icons{ color:#fff; }

/* Trefferliste der Suche (über der Karte schwebend). */
.ll-map-results{ position:absolute; left:0; right:0; top:calc(100% + 4px); z-index:40; list-style:none; margin:0; padding:6px;
  background:#fff; border:1px solid var(--bdo-line); border-radius:10px; box-shadow:0 10px 28px rgba(1,75,124,.16); max-height:320px; overflow:auto; }
.ll-map-results li{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 11px; border-radius:8px;
  cursor:pointer; color:var(--bdo-navy); font-size:14.5px; }
.ll-map-results li:hover{ background:var(--bdo-light); }
.ll-map-rname{ font-weight:600; }
.ll-map-rcount{ font-size:12px; color:#8a98a4; }
.ll-map-nohit{ color:#8aa0ad; cursor:default; }
.ll-map-nohit:hover{ background:none; }

/* Die Karte selbst — füllt die Bühne (75vh), Zoom/Pan via viewBox. */
.ll-map-stage{ position:relative; height:75vh; min-height:440px; max-height:860px; overflow:hidden; cursor:grab; touch-action:none; }
.ll-map-stage.grabbing{ cursor:grabbing; }
.ll-map{ display:block; width:100%; height:100%; }
.ll-map .ll-map-countries path{ stroke:#fff; stroke-width:0.4; stroke-linejoin:round; }
.ll-map-no{ fill:#cdd9e2; }
/* Inhalts-Länder im sanften Hellblau (wie die alte Karte); Punkte (s.u.) im
   gesättigten Blau, damit sie sich klar abheben. Hover -> gesättigt. */
.ll-map-has{ fill:var(--bdo-mid); cursor:pointer; transition:fill .12s, filter .12s; }
.ll-map-has:hover{ fill:var(--bdo-blue); }
.ll-map-has:focus{ outline:none; filter:drop-shadow(0 0 2px rgba(1,75,124,.55)); }
.ll-map-has.selected, .ll-map-has.selected:hover{ fill:var(--bdo-navy); stroke:#fff; stroke-width:1.2; }
/* Mikro-Staaten-Punkte (Andorra, Monaco, Vatikan …). Default versteckt; nur Inhalts-Länder „on". */
.ll-map-dots circle{ display:none; }
.ll-map-dots circle.ll-map-dot-on{ display:inline; fill:var(--bdo-blue); stroke:#fff; stroke-width:2; vector-effect:non-scaling-stroke; cursor:pointer; transition:fill .12s; }
.ll-map-dots circle.ll-map-dot-on:hover{ fill:var(--bdo-navy); }
.ll-map-dots circle.ll-map-dot-on:focus{ outline:none; }
.ll-map-dots circle.ll-map-dot-on.selected{ fill:var(--bdo-navy); stroke:#fff; }
/* Mikro-Staat ohne Inhalt: dauerhaft sichtbar, grau, nicht klickbar (wie graue Länder). */
.ll-map-dots circle.ll-map-dot-on.ll-map-dot-none{ fill:#aab6c0; stroke:#fff; stroke-width:1.6; cursor:default; }
.ll-maphint{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); color:#5b6b76; font-size:14px; }
.ll-map-err{ color:#5b6b76; font-size:14px; text-align:center; padding:28px 10px; }

/* Schwebende Zoom-Steuerung (unten rechts). */
.ll-map-zoom{ position:absolute; right:16px; bottom:16px; z-index:18; display:flex; flex-direction:column; gap:6px; }
.ll-map-zoom button{ width:40px; height:40px; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--bdo-line); background:#fff; border-radius:10px; cursor:pointer;
  font-size:22px; font-weight:700; line-height:1; color:var(--bdo-navy); box-shadow:0 3px 12px rgba(1,75,124,.16); }
.ll-map-zoom button:hover{ background:var(--bdo-light); border-color:var(--bdo-blue); color:var(--bdo-blue); }
.ll-map-zoom button:focus,.ll-map-zoom button:active{ outline:none; }
.ll-map-zoom .material-icons{ font-size:20px; }

/* Legende (schwebt unten links). */
.ll-map-legend{ position:absolute; left:16px; bottom:16px; z-index:16;
  display:flex; flex-wrap:wrap; gap:14px; align-items:center;
  background:rgba(255,255,255,.9); border:1px solid var(--bdo-line); border-radius:20px; padding:6px 14px;
  color:#5b6b76; font-size:12.5px; box-shadow:0 3px 12px rgba(1,75,124,.1); }
.ll-map-legend span{ display:inline-flex; align-items:center; gap:7px; }
.ll-map-key{ width:14px; height:14px; border-radius:3px; display:inline-block; }
.ll-map-key.has{ background:var(--bdo-mid); }
.ll-map-key.no{ background:#cdd9e2; }

/* Chip-Leiste für Inhalts-Länder ohne eigene Kartenfläche (schwebt unten mittig). */
.ll-offbar{ position:absolute; left:50%; bottom:16px; transform:translateX(-50%); z-index:16; max-width:56%;
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px; padding:8px 13px;
  background:rgba(255,255,255,.92); border:1px solid var(--bdo-line); border-radius:14px; box-shadow:0 3px 12px rgba(1,75,124,.12); }
.ll-offlbl{ color:#5b6b76; font-size:13px; font-weight:600; }
.ll-offchip{ display:inline-flex; align-items:center; gap:7px; background:#fff; border:1px solid var(--bdo-line);
  border-radius:20px; padding:5px 12px 5px 7px; font:inherit; font-size:13.5px; font-weight:600; color:var(--bdo-navy); cursor:pointer; }
.ll-offchip:hover{ border-color:var(--bdo-blue); color:var(--bdo-blue); }
.ll-offchip img{ width:20px; height:15px; object-fit:cover; border-radius:2px; box-shadow:0 0 0 1px rgba(0,0,0,.1); }
.ll-offchip.selected{ background:var(--bdo-navy); border-color:var(--bdo-navy); color:#fff; }
.ll-offchip.selected:hover{ color:#fff; }

/* Sammel-Leiste der Mehrfachauswahl (sticky am unteren Rand) -> „Vergleich öffnen". */
.ll-selbar{ position:sticky; bottom:14px; z-index:30; margin-top:18px; display:flex; align-items:center; gap:14px;
  background:#fff; border:1px solid var(--bdo-line); border-top:2px solid var(--bdo-blue); border-radius:12px;
  box-shadow:0 8px 26px rgba(1,75,124,.16); padding:10px 14px; }
.ll-sellbl{ font-weight:700; color:var(--bdo-navy); font-size:13px; flex:none; }
.ll-selchips{ display:flex; flex-wrap:wrap; gap:7px; flex:1; min-width:0; }
.ll-selchip{ display:inline-flex; align-items:center; gap:7px; background:var(--bdo-light); border:1px solid var(--bdo-mid);
  border-radius:16px; padding:4px 6px 4px 8px; font-size:13px; font-weight:600; color:var(--bdo-navy); }
.ll-selflag{ width:20px; height:15px; object-fit:cover; border-radius:2px; box-shadow:0 0 0 1px rgba(0,0,0,.1); }
.ll-selx{ font-size:16px; cursor:pointer; color:#7c8a96; }
.ll-selx:hover{ color:#b00; }
.ll-selbtn{ flex:none; display:inline-flex; align-items:center; gap:6px; background:var(--bdo-blue); color:#fff; border:none;
  border-radius:9px; padding:9px 16px; font:inherit; font-size:14px; font-weight:700; cursor:pointer; }
.ll-selbtn .material-icons{ font-size:19px; }
.ll-selbtn:hover{ background:var(--bdo-navy); }
.ll-selbtn:focus,.ll-selbtn:active{ background:var(--bdo-navy)!important; outline:none; }
.ll-selclear{ flex:none; display:inline-flex; align-items:center; gap:6px; background:#fff; color:var(--bdo-navy);
  border:1px solid var(--bdo-line); border-radius:9px; padding:9px 14px; font:inherit; font-size:13.5px; font-weight:600; cursor:pointer; }
.ll-selclear .material-icons{ font-size:18px; }
.ll-selclear:hover{ border-color:#b00; color:#b00; }
.ll-selclear:focus,.ll-selclear:active{ outline:none; }

@media(max-width:640px){
  /* Mobile entrümpeln: Untertitel raus, Titel kleiner/enger, weniger Polster oben */
  .ll-pagelead{ display:none; }
  .ll-pagetitle{ font-size:21px; padding-top:2px; margin:2px 0 0; }
  .ll-container{ padding-top:4px; }
  .ll-map-toolbar{ display:none; }   /* Suche + Europa-Pill + Europa/Welt auf Mobile raus */
  .ll-map-stage{ height:62vh; min-height:360px; }
  .ll-offbar{ left:16px; right:16px; max-width:none; transform:none; justify-content:flex-start; }
  .ll-map-legend{ display:none; }
  .ll-selbar{ flex-wrap:wrap; row-gap:10px; }
  .ll-sellbl{ order:1; }
  .ll-selclear{ order:2; margin-left:auto; padding:8px 10px; }
  .ll-selclear .ll-btntext{ display:none; }   /* Mobile: „Auswahl aufheben" nur als Icon */
  .ll-selchips{ order:3; flex:1 1 100%; }       /* Länder-Chips volle Breite, eigene Zeile */
  .ll-selbtn{ order:4; width:100%; justify-content:center; }
  /* Themen-Sidebar mobil einklappbar (Kopf tippen) */
  .ll-side .cc-sidetitle, .ll-side .ll-ctry{ cursor:pointer; }
  .ll-side .cc-sidetitle{ display:flex; align-items:center; }
  .cc-chev{ display:inline-flex; margin-left:auto; color:var(--bdo-mid); transition:transform .15s; }
  .ll-side-collapsed .cc-chev{ transform:rotate(-90deg); }
  .ll-side-collapsed .ll-topiclist{ display:none; }
}
/* Chevron der Themen-Sidebar nur auf Mobile (im Media-Block oben eingeblendet) */
.cc-chev{ display:none; }

/* Vergleichsansicht (mehrere Länder, ein Thema) */
.ll-cmp-top{ display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin-bottom:14px; }
/* `.ll-back` traegt margin-bottom:16px — noetig in der Seitenleiste, wo der Link UEBER dem
   Laendernamen steht. In dieser waagerechten Zeile verschiebt derselbe Rand ihn gegen die
   Laender-Pille nach oben; align-items:center rechnet den Rand naemlich mit. Deshalb hier
   ausdruecklich zuruecknehmen statt global zu aendern. */
.ll-cmp-top .ll-back{ margin-bottom:0; }
.ll-cmp-chips{ display:flex; flex-wrap:wrap; gap:7px; }
.ll-cmp-chip{ display:inline-flex; align-items:center; gap:7px; background:var(--bdo-light); border:1px solid var(--bdo-mid);
  border-radius:16px; padding:4px 6px 4px 8px; font-size:13px; font-weight:600; color:var(--bdo-navy); }
.ll-cmp-chip img{ width:20px; height:15px; object-fit:cover; border-radius:2px; box-shadow:0 0 0 1px rgba(0,0,0,.1); }
.ll-cmp-x{ font-size:16px; cursor:pointer; color:#7c8a96; }
.ll-cmp-x:hover{ color:#b00; }
/* Der Vergleich nimmt die GANZE Fensterbreite (#69, Rueckmeldung „viel breiter").
   Der Seitenrahmen (.container) deckelt bei 1280px und die frueher linke Themen-Leiste nahm
   weitere 290px — fuer zwei Spalten blieben 454px je Land. Das ist zum Vergleichen von
   Fliesstext zu wenig.
   Der Ausbruch aus dem Rahmen laeuft ueber die Fensterbreite: 100vw plus negative Verschiebung
   auf die Fenstermitte. `box-sizing` und der eigene Innenabstand halten den Text vom Rand weg;
   ohne overflow-x:clip am Rumpf wuerde 100vw bei sichtbarem Scrollbalken quer scrollen. */
.ll-cmp-wide{ width:100vw; max-width:100vw; margin-left:calc(50% - 50vw);
  padding:0 clamp(16px, 3vw, 48px); box-sizing:border-box; }

/* Themen als waagerechte Leiste statt Seitenleiste: Sie brauchen die Hoehe nicht, und links
   kosteten sie 290px Breite, die der Vergleich besser gebrauchen kann. Bei vielen Themen
   scrollt die Leiste waagerecht. */
.ll-cmp-themen{ display:flex; gap:8px; overflow-x:auto; padding:4px 0 12px;
  border-bottom:1px solid var(--bdo-line); margin-bottom:14px; scrollbar-width:thin; }
.ll-cmp-tchip{ flex:none; border:1px solid var(--bdo-line); background:#fff; border-radius:999px;
  padding:7px 15px; font:inherit; font-size:13.5px; color:#33586e; cursor:pointer;
  white-space:nowrap; transition:border-color .12s, background .12s; }
.ll-cmp-tchip:hover{ border-color:var(--bdo-blue); }
.ll-cmp-tchip.on{ background:var(--bdo-navy); border-color:var(--bdo-navy); color:#fff; font-weight:600; }
.ll-cmp-h2{ margin:0 0 4px; }

/* Vergleich NEBENEINANDER, nicht untereinander (#69, Vorgabe bdo): Untereinander muss man
   scrollen und im Kopf behalten, was oben stand — das ist kein Vergleich.
   Zwei Spalten gleicher Breite; die Auswahl ist auf zwei Laender begrenzt (laender.js).
   `align-items:start` haelt die Kaecheln oben ausgerichtet, damit die Ueberschriften auf
   einer Linie liegen, auch wenn ein Land deutlich mehr Text hat. */
.ll-cmp-stack{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr));
  align-items:start; gap:16px; margin-top:14px; }
/* Ein einzelnes Land bekommt die ganze Breite — sonst stuende der Text in einer halben
   Spalte neben einer leeren Flaeche. */
.ll-cmp-stack:has(> .ll-cmp-block:only-child){ grid-template-columns:minmax(0, 1fr); }
/* Schmale Schirme: untereinander. Zwei Spalten a 200px sind unlesbar. */
@media(max-width:860px){
  .ll-cmp-stack{ grid-template-columns:minmax(0, 1fr); }
}

/* HINWEIS ZU FARBIGEN LINKEN KANTEN: Am 31.08.2026 vom Auftraggeber verworfen — „diese
   Streifen schreien nach KI". Entfernt an Laenderbloecken, EU-Kacheln, allen Hinweiskaesten,
   Meldungen und Erklaertexten. Neue Elemente bitte ohne. */

/* --- Laender: Themen verwalten (#70, neu gestaltet in #73) --- */
/* Einstieg E2: eine Reihe, aber abgesetzt. Trennlinie und die Beschriftung „Struktur" sagen,
   dass „Themen" etwas anderes verwaltet als Karte und Liste — nicht eine dritte Ansicht
   derselben Sache, sondern die Struktur ueber allen Laendern. */
.al-tabsrow{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.al-tabtrenner{ width:1px; align-self:stretch; min-height:24px; background:var(--bdo-line);
  margin:0 4px; }
.al-tablabel{ font-size:11px; font-weight:700; letter-spacing:.09em; text-transform:uppercase;
  color:#8aa0ad; }

/* Erklaerung links, Anlegen rechts — eine Zeile, damit der Knopf nicht ueber dem Text
   klebt (vorher mit negativem Rand hochgezogen, was bei Umbruch zerfiel). */
.al-thkopf{ display:flex; align-items:flex-start; justify-content:space-between; gap:18px;
  flex-wrap:wrap; margin-top:14px; }
.al-thlead{ margin:0; font-size:14px; line-height:1.5; color:#5d7382; max-width:70ch; flex:1 1 320px; }
.al-thkopf .al-thneu{ flex:none; }
.al-thmsg{ margin:12px 0 0; }

/* Zwei Spalten: links waehlen, rechts bearbeiten. 69 Themen brauchen eine Liste mit Suche,
   keine 69 Zeilen mit je vier Bedienelementen. */
.al-th{ display:grid; grid-template-columns:minmax(240px,320px) 1fr; gap:18px; margin-top:16px;
  align-items:start; }
.al-thspalte, .al-thdetail{ background:#fff; border:1px solid var(--bdo-line); border-radius:12px;
  overflow:hidden; }

.al-thschalter{ display:flex; border-bottom:1px solid var(--bdo-line); background:#fbfdfe; }
.al-thre{ flex:1; display:flex; align-items:center; justify-content:center; gap:6px;
  padding:11px 8px; border:0; background:transparent; cursor:pointer;
  font:600 13px/1 inherit; color:#5d7382; border-bottom:2px solid transparent; }
.al-thre i{ font-size:16px; }
.al-thre:hover{ color:var(--bdo-navy); background:var(--bdo-light); }
.al-thre.on{ color:var(--bdo-navy); border-bottom-color:var(--bdo-blue); background:#fff; }
.al-thn{ font-size:12px; font-weight:500; color:#8aa0ad; }

.al-thsuchezeile{ padding:10px 12px; border-bottom:1px solid var(--bdo-line); }
.al-thsuche{ width:100%; }
/* Spaltenueberschrift: Die Zahl „33/69" ist fuer den, der sie gebaut hat, selbsterklaerend —
   fuer alle anderen nicht. Sie einmal zu beschriften ist ehrlicher, als sie 40 Mal
   auszuschreiben. */
.al-thspalten{ display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:8px 14px; border-bottom:1px solid var(--bdo-line); background:#fbfdfe;
  font-size:11px; font-weight:700; letter-spacing:.07em; text-transform:uppercase;
  color:#8aa0ad; }
.al-thliste{ max-height:min(62vh,620px); overflow-y:auto; }
.al-thzeile{ display:flex; align-items:center; gap:9px; width:100%; text-align:left;
  padding:10px 14px; border:0; border-bottom:1px solid #eef2f5;
  background:#fff; cursor:pointer;
  font:inherit; font-size:14px; color:var(--bdo-dark); }
.al-thzeile:last-child{ border-bottom:0; }
.al-thzeile:hover{ background:#f7fafc; }
/* Auswahl ohne Kante: Hintergrund und Fettung tragen sie bereits. Der Hintergrund ist
   dafuer etwas kraeftiger als der bisherige, sonst traegt er allein zu wenig. */
.al-thzeile.on{ background:#dbeefb; font-weight:600; color:var(--bdo-navy); }
.al-thzname{ flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis;
  white-space:nowrap; }
/* Die Zahl der betroffenen Laender steht IMMER dabei: Eine Aktion, die auf vierzig Eintraege
   wirkt, darf nicht aussehen wie eine auf einen. */
.al-thzzahl{ flex:none; font-size:12px; color:#8aa0ad; font-variant-numeric:tabular-nums; }
.al-thzzahl.knapp{ color:#8a2f2f; font-weight:700; }
/* Deckung „ausgefuellt/angelegt": die Gesamtzahl tritt zurueck, die ausgefuellten stehen
   vorn. Eine Luecke wird eingefaerbt, damit man sie beim Durchsehen findet. */
.al-thzzahl.teil{ color:var(--bdo-navy); font-weight:700; }
.al-thvon{ color:#a8bcc7; font-weight:400; }
.al-thzms{ font-size:17px; color:#8aa0ad; }
.al-thpunkt{ flex:none; width:7px; height:7px; border-radius:50%; background:var(--bdo-blue); }
.al-thpunkt.aus{ background:#c9d6de; }
.al-thleer{ padding:24px 16px; text-align:center; }

.al-thd{ padding:20px 22px; }
.al-thdkopf{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.al-thdkopf h3{ margin:0; font-family:'Roboto Slab',Georgia,serif; font-size:20px;
  color:var(--bdo-navy); }
.al-thmarke{ font-size:11.5px; font-weight:700; padding:3px 9px; border-radius:999px; }
.al-thmarke.gut{ background:#eaf7ef; color:#1f7a41; }
.al-thmarke.aus{ background:#f1f3f4; color:#5d7382; }
.al-thmarke.knapp{ background:#fff6f6; color:#8a2f2f; }
.al-thdkennung{ margin:6px 0 0; font-size:13px; color:#8aa0ad;
  font-variant-numeric:tabular-nums; }
.al-thblock{ margin-top:22px; padding-top:18px; border-top:1px solid var(--bdo-line); }
.al-thblock h4{ margin:0 0 12px; font-size:13px; font-weight:700; letter-spacing:.04em;
  text-transform:uppercase; color:var(--bdo-navy); }
.al-thblock.gefahr h4{ color:#8a2f2f; }
.al-thfeldzeile{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.al-thfeldzeile .al-thname{ flex:1 1 220px; min-width:0; }
.al-thnotiz{ margin-top:10px; font-size:13px; line-height:1.5; color:#5d7382; }
.al-thnotiz.gefahr{ margin:0 0 12px; color:#8a2f2f; }
.al-thbalken{ height:7px; border-radius:4px; background:#eef3f6; overflow:hidden; }
.al-thbalken span{ display:block; height:100%; border-radius:4px; background:var(--bdo-blue); }
.al-thplatz{ display:flex; flex-direction:column; align-items:center; gap:10px;
  padding:60px 20px; color:#8aa0ad; font-size:14px; }
.al-thplatz i{ font-size:30px; color:#c9d6de; }

@media (max-width:900px){
  .al-th{ grid-template-columns:1fr; }
  .al-thliste{ max-height:340px; }
}

/* Richtungs-Umschalter vor den Pillen: zwei aneinanderliegende Schaltflaechen, damit sofort
   erkennbar ist, dass es genau zwei sich ausschliessende Lesarten gibt. */
.ua-richtung{ display:inline-flex; border:1px solid var(--bdo-line); border-radius:999px;
  overflow:hidden; background:#fff; }
.ua-richtbtn{ border:0; background:transparent; padding:6px 12px; cursor:pointer;
  font:inherit; font-size:12.5px; font-weight:600; color:#5d7382; white-space:nowrap; }
.ua-richtbtn + .ua-richtbtn{ border-left:1px solid var(--bdo-line); }
.ua-richtbtn:hover{ background:var(--bdo-light); color:var(--bdo-navy); }
.ua-richtbtn.on{ background:var(--bdo-navy); color:#fff; }
.ua-richtbtn:focus-visible{ outline:2px solid var(--bdo-blue); outline-offset:-2px; }

/* Erklaert den aktiven Inaktivitaets-Filter dort, wo man das Ergebnis sieht. */
.ua-filterhinweis{ margin:0 0 12px; padding:9px 12px;
  background:var(--bdo-light); border-radius:8px; font-size:13px; line-height:1.5;
  color:#3d5c70; }

/* Verweis auf die Verbands-Verwaltung im Einladungs-Dialog (#65). */
.ua-verbhint{ margin:-6px 0 12px; }
.ua-linkbtn{ border:0; background:none; padding:0; font:inherit; color:var(--bdo-blue);
  text-decoration:underline; text-underline-offset:2px; cursor:pointer; }
.ua-linkbtn:hover{ color:#014b7c; }

/* --- „Letzte Änderungen": Seitennavigation (#71) --- */
/* Schmal und rechtsbuendig. Blaettern ist eine Nebenhandlung — Knoepfe ueber die volle Breite
   behaupten ein Gewicht, das sie nicht hat. Die Auswahl „Pro Seite" ist entfallen: Es sind
   immer zehn Eintraege, genau deshalb gibt es den Seitenwechsel. */
.feed-pager{ display:flex; align-items:center; flex-wrap:wrap; gap:14px; margin-top:10px;
  padding-top:12px; border-top:1px solid var(--bdo-line); font-size:13px; color:#8aa0ad; }
.feed-pcount{ margin-right:auto; font-variant-numeric:tabular-nums; }
.feed-nav{ display:inline-flex; align-items:center; gap:4px; }
.feed-seite{ min-width:10ch; text-align:center; color:#5b6b76; font-variant-numeric:tabular-nums; }
.feed-pbtn{ width:32px; height:32px; padding:0; display:inline-flex; align-items:center;
  justify-content:center; border:1px solid var(--bdo-line); border-radius:8px; background:#fff;
  color:var(--bdo-navy); font:inherit; font-size:18px; line-height:1; cursor:pointer; }
.feed-pbtn:hover:not(:disabled){ background:var(--bdo-light); border-color:var(--bdo-mid); }
.feed-pbtn:disabled{ opacity:.35; cursor:not-allowed; }
.feed-pbtn:focus-visible{ outline:2px solid var(--bdo-blue); outline-offset:2px; }
/* Der Weg zu aelteren Eintraegen ist eine Textschaltflaeche, kein Knopf: Er erscheint nur auf
   der letzten Seite und soll das Blaettern nicht ueberstrahlen. */
.feed-link{ border:0; background:none; padding:0; font:inherit; font-size:13px;
  color:var(--bdo-navy); text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
.feed-link:hover{ color:var(--bdo-blue); }
.feed-link:focus-visible{ outline:2px solid var(--bdo-blue); outline-offset:2px; border-radius:4px; }
@media (max-width:560px){
  .feed-pager{ gap:10px; }
  .feed-pcount{ margin-right:0; width:100%; }
}

/* Hinweis in der Auswahl-Leiste, wenn ein drittes Land angetippt wird. */
.ll-selhint{ flex-basis:100%; margin-top:6px; font-size:12.5px; color:#8a6416;
  background:#fff4e0; border:1px solid #f0d8ac; border-radius:8px; padding:6px 10px; }
.ll-cmp-block{ border:1px solid var(--bdo-line); border-radius:10px; padding:14px 18px; background:#fff; }
.ll-cmp-block.is-empty{ background:var(--bdo-bg); }
.ll-cmp-h{ display:flex; align-items:center; gap:10px; margin-bottom:8px; padding-bottom:8px; border-bottom:1px solid var(--bdo-line); cursor:pointer; }
/* Einklappbare Länder-Kachel: Kopf klickbar, Body via .collapsed verbergen, Caret drehen */
.ll-cmp-caret{ color:var(--bdo-mid); transition:transform .15s; flex:none; }
.ll-cmp-block.collapsed > :not(.ll-cmp-h){ display:none; }
.ll-cmp-block.collapsed .ll-cmp-h{ margin-bottom:0; padding-bottom:0; border-bottom:none; }
.ll-cmp-block.collapsed .ll-cmp-caret{ transform:rotate(-90deg); }
.ll-cmp-h .ll-flag{ width:30px; height:22px; }
.ll-cmp-nm{ font-weight:700; color:var(--bdo-navy); font-size:16px; }
.ll-cmp-date{ margin-left:auto; font-size:12px; color:#8a98a4; }
.ll-cmp-none{ color:#5b6b76; font-style:italic; margin:4px 0; }

.ll-toolbar{ margin-bottom:16px; }
.ll-search{ display:flex; align-items:center; gap:10px; background:#fff; border:1.5px solid var(--bdo-line);
  border-radius:10px; padding:10px 16px; margin-bottom:16px; width:100%; }
.ll-search:focus-within{ border-color:var(--bdo-blue); }
.ll-search svg{ width:18px; height:18px; stroke:var(--bdo-blue); fill:none; stroke-width:2.2; }
.ll-search input, .ll-search input[type=search], .ll-search input[type=text]{
  border:none!important; border-bottom:none!important; outline:none; font-size:15px; flex:1;
  background:transparent; color:var(--bdo-dark);
  height:auto!important; min-height:0!important; margin:0!important; padding:0!important;
  box-shadow:none!important; line-height:1.4; }
.ll-az{ display:flex; gap:6px; flex-wrap:wrap; }
.ll-az span{ min-width:30px; height:30px; padding:0 8px; border-radius:7px; background:#fff; border:1px solid var(--bdo-line);
  color:var(--bdo-navy); font-weight:700; font-size:13px; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.ll-az span:hover{ border-color:var(--bdo-blue); color:var(--bdo-blue); }
.ll-az span.act{ background:var(--bdo-blue); color:#fff; border-color:var(--bdo-blue); }
.ll-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(262px,1fr)); gap:13px; }
.ll-ccard{ background:#fff; border:1px solid var(--bdo-line); border-radius:12px; padding:15px 17px;
  display:flex; align-items:center; gap:15px; cursor:pointer; transition:.12s; }
.ll-ccard:hover{ border-color:var(--bdo-blue); box-shadow:0 6px 16px rgba(0,159,227,.15); transform:translateY(-1px); }
.ll-flag{ width:44px; height:33px; border-radius:4px; border:1px solid rgba(0,0,0,.10); object-fit:cover; flex:none; background:#eef3f6; }
.ll-ccard-tx{ flex:1; min-width:0; }
.ll-nm{ font-size:17px; font-weight:600; color:var(--bdo-dark); }
.ll-sub{ font-size:13px; color:#5b6b76; }
/* Region-Eintrag (z. B. „Europa"/EU) klar von Ländern abheben */
.ll-ccard-region{ border-color:var(--bdo-mid); }
.ll-region-badge{ display:inline-block; margin-left:8px; padding:1px 8px; border-radius:10px;
  background:var(--bdo-light); border:1px solid var(--bdo-mid); color:var(--bdo-navy);
  font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.3px; vertical-align:middle; }
.ll-arr{ color:var(--bdo-mid); font-size:20px; }
.ll-empty{ color:#8aa0ad; padding:14px; }
.ll-detail{ display:flex; flex-wrap:wrap; background:#fff; border:1px solid var(--bdo-line); border-radius:14px; overflow:hidden; }
.ll-side{ width:290px; flex:none; border-right:1px solid var(--bdo-line); padding:22px 16px; background:#fafcfe; }
@media(max-width:820px){ .ll-side{ width:100%; border-right:none; border-bottom:1px solid var(--bdo-line); } }
.ll-back{ color:var(--bdo-blue); font-size:13px; font-weight:600; cursor:pointer; margin-bottom:16px; display:inline-block; }
.ll-ctry{ display:flex; align-items:center; gap:11px; margin-bottom:14px; }
.ll-ctry .ll-flag{ width:40px; height:27px; }
.ll-ctry-nm{ font-size:20px; font-weight:800; color:var(--bdo-navy); }
.ll-topiclist{ list-style:none; margin:0; padding:0; }
.ll-topiclist li{ padding:11px 13px; border-radius:9px; font-size:14.5px; color:var(--bdo-dark);
  display:flex; align-items:center; gap:10px; margin-bottom:2px; cursor:pointer; }
.ll-topiclist li:hover{ background:var(--bdo-light); }
.ll-dot{ width:8px; height:8px; border-radius:50%; background:var(--bdo-mid); flex:none; }
.ll-topiclist li.on{ background:var(--bdo-light); color:var(--bdo-navy); font-weight:700; }
.ll-topiclist li.on .ll-dot{ background:var(--bdo-blue); }
.ll-main{ flex:1; min-width:320px; padding:26px 32px; }
.ll-bc{ color:#5b6b76; font-size:12.5px; margin-bottom:8px; }
.ll-h2{ font-size:25px; color:var(--bdo-navy); margin:0; }
.ll-meta{ color:#5b6b76; font-size:13px; margin:8px 0 18px; }
.ll-article{ font-size:15.5px; line-height:1.7; color:#33424c; }
.ll-article h3{ color:var(--bdo-navy); } .ll-article a{ color:var(--bdo-blue); }

/* Inhalts-Artikel (Nutzer-generiertes HTML aus dem Editor): darf den Viewport NIE
   sprengen. Bilder/Videos skalieren mit, lange Woerter/URLs umbrechen, und breite
   Tabellen werden INNERHALB des Artikels horizontal scrollbar (statt abgeschnitten
   vom umgebenden overflow:hidden oder die ganze Seite breiter als das Handy zu machen).
   Gilt fuer Laender- (.ll-article) UND Baum-/Custom-Inhalte (.item-paragraph). */
.ll-article, .item-paragraph{ overflow-wrap:break-word; }
.ll-article img, .ll-article video, .ll-article iframe,
.item-paragraph img, .item-paragraph video, .item-paragraph iframe{ max-width:100%; height:auto; }
.ll-article table, .item-paragraph table{ display:block; max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.ll-article pre, .item-paragraph pre{ max-width:100%; overflow-x:auto; }

/* Corona-Seite: Baum-Sidebar (nutzt .ll-detail/.ll-side/.ll-main) */
.cc-sidetitle{ display:flex; align-items:center; gap:8px; font-weight:700; color:var(--bdo-navy); font-size:13px;
  text-transform:uppercase; letter-spacing:.5px; padding:0 6px 12px; border-bottom:1px solid var(--bdo-line); margin-bottom:8px; }
.cc-sidetitle .material-icons{ color:var(--bdo-blue); font-size:20px; }
.cc-tree{ list-style:none; margin:0; padding:0; }
.cc-tnode{ display:flex; align-items:center; gap:8px; cursor:pointer; padding:8px 8px; border-radius:8px;
  font-size:14px; color:var(--bdo-dark); line-height:1.25; padding-left:calc(8px + var(--d,0) * 15px); }
.cc-tnode:hover{ background:var(--bdo-light); }
.cc-tnode.on{ background:var(--bdo-blue); color:#fff; }
.cc-tnode.on .cc-tic{ color:#fff; }
.cc-tic{ font-size:18px; color:var(--bdo-blue); flex:none; }
.cc-tlabel{ min-width:0; }
.cc-sublist{ list-style:none; margin:0; padding:0; }
.cc-sublist li{ display:flex; align-items:center; gap:7px; padding:12px 6px; border-bottom:1px solid var(--bdo-line);
  cursor:pointer; color:var(--bdo-navy); font-weight:600; font-size:15px; }
.cc-sublist li:last-child{ border-bottom:none; }
.cc-sublist li:hover{ background:var(--bdo-light); }
.cc-sublist .material-icons{ color:var(--bdo-blue); }
.cc-empty{ color:#8aa0ad; padding:12px 4px; }

/* ===== Admin: Nutzer-Accounts (Redesign v2, BDO-Stil) ===== */
.ua-wrap{ max-width:1520px; margin:0 auto; padding:6px 4px 48px; }
.ua-head{ display:flex; align-items:center; gap:14px; margin:6px 0 18px; }
.ua-title{ font-size:24px; color:var(--bdo-navy); margin:0; }
.ua-head .ua-btn{ margin-left:auto; }
.ua-btn{ display:inline-flex; align-items:center; justify-content:center; gap:7px; background:#fff; border:1px solid var(--bdo-line);
  border-radius:9px; padding:0 15px; min-height:40px; box-sizing:border-box; font:inherit; font-size:14px; font-weight:600; color:var(--bdo-navy); cursor:pointer; }
.ua-btn .material-icons{ font-size:19px; }
.ua-btn:hover{ border-color:var(--bdo-blue); color:var(--bdo-blue); }
.ua-btn-primary{ background:var(--bdo-blue); border-color:var(--bdo-blue); color:#fff; }
.ua-btn-primary:hover{ background:var(--bdo-navy); border-color:var(--bdo-navy); color:#fff; }
.ua-btn[disabled]{ opacity:.55; cursor:default; }

.ua-panel{ background:var(--bdo-light); border:1px solid var(--bdo-line); border-radius:12px; padding:16px 18px; margin-bottom:18px; }
.ua-panel-h{ font-size:16px; color:var(--bdo-navy); margin:0 0 12px; }
.ua-form{ display:flex; flex-wrap:wrap; align-items:flex-end; gap:14px; }
.ua-field{ display:flex; flex-direction:column; gap:5px; font-size:13px; font-weight:600; color:#5b6b76; flex:1 1 180px; }
.ua-field-sm{ flex:0 0 90px; }
.ua-field-ro .ua-ro-val{ font-weight:400; font-size:13px; color:#5b6b76; line-height:1.45;
  background:var(--bdo-bg); border:1px solid var(--bdo-line); border-radius:8px; padding:9px 11px; }
.ua-field-ro .ua-ro-val strong{ color:var(--bdo-navy); }
.ua-hint{ font-weight:400; color:#8aa0ad; }
.ua-field input, .ua-select{ font:inherit; font-size:14px; color:var(--bdo-dark); background:#fff;
  border:1px solid var(--bdo-line); border-radius:8px; padding:8px 11px; height:38px; }
/* Materialize setzt select{display:none} (erwartet sein eigenes JS-Widget) — unsere nativen Selects wieder einblenden */
select.ua-select{ display:inline-block; -webkit-appearance:auto; -moz-appearance:auto; appearance:auto; }
.ua-field input:focus, .ua-select:focus{ outline:none; border-color:var(--bdo-blue); }
.ua-createout{ margin-top:14px; }
.ua-created-h{ font-weight:600; color:var(--bdo-navy); margin:6px 0 10px; }
.ua-created{ background:#fff; border:1px solid var(--bdo-line); border-radius:9px; padding:10px 12px; margin-bottom:8px; }
.ua-linkrow{ display:flex; gap:8px; margin-top:7px; }
.ua-link{ flex:1; font:inherit; font-size:13px; border:1px solid var(--bdo-line); border-radius:7px; padding:7px 10px; background:var(--bdo-bg); color:#33424c; }

.ua-toolbar{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:14px; }
.ua-search{ flex:1 1 280px; display:flex; align-items:center; gap:9px; background:#fff; border:1px solid var(--bdo-line);
  border-radius:9px; padding:0 13px; min-height:40px; box-sizing:border-box; }
.ua-search:focus-within{ border-color:var(--bdo-blue); }
.ua-search .material-icons{ color:var(--bdo-blue); font-size:19px; }
.ua-search input{ flex:1; border:none; outline:none; font:inherit; font-size:14.5px; background:transparent; color:var(--bdo-dark); }
.ua-toolbar .ua-select{ height:40px; }

/* ---- v3: Kopf-Aktionen, Tabs (Rolle), Pills (Status), Segment ---- */
.ua-head-actions{ margin-left:auto; display:flex; gap:8px; flex-wrap:wrap; }
.ua-head-actions .ua-btn{ margin-left:0; }
.ua-tabs{ display:flex; gap:3px; background:#fff; border:1px solid var(--bdo-line); border-radius:11px; padding:4px; margin:0 0 12px; flex-wrap:wrap; }
.ua-tab{ display:inline-flex; align-items:center; gap:7px; padding:8px 15px; border:0; border-radius:8px; font:inherit;
  font-size:14px; font-weight:600; color:var(--bdo-navy); background:transparent; cursor:pointer; }
.ua-tab:hover{ background:var(--bdo-light); }
.ua-tab.on{ background:var(--bdo-blue); color:#fff; }
.ua-tabcnt{ font-size:11px; background:var(--bdo-line); color:#5b6b77; border-radius:20px; padding:1px 7px; font-weight:700; }
.ua-tab.on .ua-tabcnt{ background:rgba(255,255,255,.25); color:#fff; }
.ua-pills{ display:flex; gap:8px; flex-wrap:wrap; }
.ua-pill{ display:inline-flex; align-items:center; gap:6px; padding:0 16px; min-height:40px; box-sizing:border-box;
  border-radius:30px; font:inherit; font-size:13px;
  font-weight:600; border:1.5px solid var(--bdo-line); background:#fff; color:var(--bdo-navy); cursor:pointer; }
.ua-pill:hover{ border-color:var(--bdo-blue); }
.ua-pill.on{ background:var(--bdo-light); border-color:var(--bdo-blue); }
.ua-pill.on::before{ content:"✓"; font-size:11px; color:var(--bdo-blue); font-weight:800; }
.ua-seg{ display:flex; gap:3px; background:var(--bdo-bg); border:1px solid var(--bdo-line); border-radius:9px; padding:3px; }
.ua-seg-i{ flex:1; text-align:center; padding:7px 8px; border:0; border-radius:7px; font:inherit; font-size:12.5px;
  font-weight:600; color:var(--bdo-navy); background:transparent; cursor:pointer; }
.ua-seg-i.on{ background:var(--bdo-blue); color:#fff; }
/* !important nötig: Materialize stylt `input[type=text]` (Element+Attribut) höher als die
   Einzelklasse .ua-input und würde sonst den Materialize-Unterstrich durchdrücken. */
.ua-input{ font:inherit; font-size:14px; color:var(--bdo-dark); background:#fff!important; border:1px solid var(--bdo-line)!important;
  border-radius:8px!important; padding:0 12px!important; height:40px!important; box-sizing:border-box!important; box-shadow:none!important; }
.ua-input:focus{ outline:none; border-color:var(--bdo-blue)!important; box-shadow:0 0 0 3px rgba(0,159,227,.15)!important; }
.ua-note{ background:var(--bdo-light); border-radius:8px; padding:10px 13px;
  font-size:12.5px; color:var(--bdo-navy); margin-top:12px; }
.ua-note-info{ margin:14px 0; }
.ua-ok{ background:#e9f7ef; border:1px solid #b6e3c8; border-radius:8px; padding:9px 12px; font-size:13px; color:#1f8a4c; font-weight:600; margin-bottom:12px; }

/* ---- v3: API-Ergebnis ---- */
.ua-cred{ display:flex; align-items:center; gap:10px; background:#0d2238; border-radius:8px; padding:9px 12px; margin-bottom:7px; }
.ua-credl{ font-size:11px; text-transform:uppercase; letter-spacing:.4px; color:#9fb3c0; font-weight:700; width:90px; flex:none; }
.ua-credv{ flex:1; font-family:ui-monospace,Menlo,monospace; font-size:12.5px; color:#7fe3b0; word-break:break-all; }
.ua-cred .ua-icbtn{ color:#fff; }
.ua-apiact{ display:flex; gap:8px; margin:12px 0; flex-wrap:wrap; }
.ua-apiact .ua-input{ flex:1 1 200px; }
.ua-apilinks{ display:flex; gap:8px; flex-wrap:wrap; }

/* ---- v3: Verbände-Verwaltung ---- */
.ua-vadd{ display:flex; gap:8px; margin-bottom:12px; }
.ua-vadd .ua-input{ flex:1; }
.ua-vlist{ display:flex; flex-direction:column; gap:7px; }
.ua-vrow{ display:flex; align-items:center; gap:6px; }
.ua-vrow .ua-vname{ flex:1; }
.ua-vinactive .ua-vname{ opacity:.5; text-decoration:line-through; }

/* ---- v3: Cleanup ---- */
.ua-cleanpills{ margin:10px 0 14px; }
.ua-cleansum{ background:var(--bdo-bg); border-radius:9px; padding:11px 14px; font-size:14px; color:var(--bdo-navy); margin-bottom:10px; }
.ua-cleansum strong{ color:#d98318; font-size:17px; }
.ua-cleantable td{ padding:7px 10px; font-size:12.5px; }
.ua-cleanmore{ padding:7px 2px; font-size:12px; }

/* ===== Einbindungs-Doku (öffentlich) ===== */
.doc-page{ display:flex; justify-content:center; padding:40px 16px 64px; }
.doc-card{ width:100%; max-width:760px; background:#fff; border:1px solid var(--bdo-line); border-radius:16px;
  box-shadow:0 10px 30px rgba(1,75,124,.10); padding:34px 40px 40px; }
.doc-h{ font-family:'Roboto Slab',Georgia,serif; color:var(--bdo-navy); font-size:26px; margin:0 0 6px; }
.doc-card::after{}
.doc-intro{ color:#33424c; font-size:15px; line-height:1.6; margin:14px 0; }
.doc-note{ background:var(--bdo-light); border-radius:8px; padding:12px 15px;
  font-size:13.5px; color:var(--bdo-navy); margin:0 0 22px; }
.doc-steps{ counter-reset:ds; list-style:none; padding:0; margin:0 0 22px; }
.doc-steps li{ counter-increment:ds; position:relative; padding:0 0 18px 46px; }
.doc-steps li::before{ content:counter(ds); position:absolute; left:0; top:0; width:30px; height:30px; border-radius:50%;
  background:var(--bdo-blue); color:#fff; font-weight:700; display:flex; align-items:center; justify-content:center; }
.doc-step-h{ color:var(--bdo-navy); font-size:16px; margin:2px 0 5px; }
.doc-step-t{ color:#33424c; font-size:14px; line-height:1.6; margin:0; word-break:break-word; }
.doc-sec-h{ color:var(--bdo-navy); font-size:16px; margin:0 0 6px; }
.doc-actions{ margin:22px 0 14px; }
.doc-btn{ display:inline-flex; align-items:center; gap:8px; background:var(--bdo-blue); color:#fff; border-radius:9px;
  padding:11px 18px; font-weight:700; font-size:14px; text-decoration:none; }
.doc-btn:hover{ background:var(--bdo-navy); }
.doc-foot{ color:#8aa0ad; font-size:12.5px; margin:14px 0 0; }

/* Status-/Erfolgsmeldungen als BDO-Benachrichtigung (getöntes Feld + Akzentkante),
   statt nacktem Text. JS setzt textContent + className 'ua-msg ua-msg-<ok|err|info>'. */
.ua-msg{ font-size:13.5px; margin:0 0 14px; }
.ua-msg:empty{ display:none; }
.ua-msg:not(:empty){ display:flex; align-items:center; gap:8px; padding:10px 14px;
  border-radius:10px; font-weight:600; }
.ua-msg-ok{ color:#1f7a52; background:#e9f7ef; }
.ua-msg-err{ color:#b00; background:#fdecec; }
.ua-msg-info{ color:#41606f; background:var(--bdo-light); }
.ua-loading{ color:#8aa0ad; padding:18px 4px; }
.ua-count{ color:#5b6b76; font-size:13px; margin-bottom:8px; }

.ua-tablewrap{ overflow-x:auto; }
.ua-table{ width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--bdo-line);
  border-radius:12px; overflow:hidden; font-size:14px; }
.ua-table th{ text-align:left; background:var(--bdo-light); color:var(--bdo-navy); font-weight:700;
  font-size:12.5px; text-transform:uppercase; letter-spacing:.4px; padding:11px 12px; white-space:nowrap; }
.ua-table td{ padding:10px 12px; border-top:1px solid var(--bdo-line); color:#33424c; vertical-align:middle; }
.ua-table tbody tr:hover{ background:#f6fafd; }
.ua-mono{ font-family:ui-monospace,Menlo,Consolas,monospace; font-size:13px; }
.ua-muted{ color:#9aa9b3; }
.ua-actc{ text-align:right; white-space:nowrap; }

.ua-badge{ display:inline-block; font-size:11.5px; font-weight:700; padding:3px 9px; border-radius:20px; white-space:nowrap; }
.ua-admin{ background:#e7eef6; color:#27557e; }
.ua-verband{ background:#e6f6ee; color:#1f7a52; }
.ua-user{ background:var(--bdo-light); color:var(--bdo-navy); }
.ua-apiaccess{ background:#fef3d9; color:#9a7400; }
.ua-status{ font-size:12px; font-weight:600; }
.ua-status.ua-on{ color:#1f7a52; } .ua-status.ua-pending{ color:#b07a14; }

.ua-icbtn{ background:none; border:none; cursor:pointer; padding:5px; border-radius:7px; color:var(--bdo-navy); vertical-align:middle; }
.ua-icbtn .material-icons{ font-size:19px; }
.ua-icbtn:hover{ background:var(--bdo-light); color:var(--bdo-blue); }
.ua-icbtn.ua-danger:hover{ background:#fde9e9; color:#c0392b; }

.ua-editrow td{ background:var(--bdo-light)!important; }
.ua-edit{ display:flex; flex-wrap:wrap; align-items:flex-end; gap:12px; padding:6px 2px; }
.ua-edit label{ display:flex; flex-direction:column; gap:5px; font-size:12.5px; font-weight:600; color:#5b6b76; }
.ua-edit input{ font:inherit; font-size:14px; border:1px solid var(--bdo-line); border-radius:8px; padding:7px 10px; height:38px; }

/* --- Accounts v2: Chips, Bulk, Pager, Checkboxen, Drawer --- */
.ua-btn-danger{ background:#fff; border-color:#e3b4b4; color:#c0392b; }
.ua-btn-danger:hover{ background:#fde9e9; border-color:#c0392b; color:#c0392b; }

.ua-chips{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 12px; }
.ua-chip{ display:inline-flex; align-items:center; gap:6px; background:var(--bdo-light); color:var(--bdo-navy);
  border:1px solid var(--bdo-mid); border-radius:20px; padding:4px 6px 4px 12px; font-size:13px; font-weight:600; }
.ua-chip button{ border:none; background:rgba(0,0,0,.08); color:var(--bdo-navy); width:18px; height:18px; border-radius:50%; cursor:pointer; font-size:13px; line-height:1; }
.ua-chip button:hover{ background:var(--bdo-blue); color:#fff; }
.ua-chip-clear{ border:none; background:none; color:#5b6b76; font:inherit; font-size:13px; text-decoration:underline; cursor:pointer; }

.ua-bulkbar{ display:flex; align-items:center; gap:10px; background:var(--bdo-navy); color:#fff; border-radius:10px; padding:9px 14px; margin-bottom:12px; }
.ua-bulkbar[hidden]{ display:none; }
.ua-bulkcount{ font-weight:700; font-size:14px; }
.ua-bulkspacer{ flex:1; }
.ua-bulkbar .ua-btn{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.3); color:#fff; }
.ua-bulkbar .ua-btn:hover{ background:rgba(255,255,255,.22); color:#fff; }
.ua-bulkbar .ua-btn-danger{ background:#fff; border-color:#fff; color:#c0392b; }

/* Filter „Letzter Login" als Pillen (#72): abgesetzt von den Status-Pillen durch eine Linie,
   mit vorangestellter Beschriftung — sonst waeren es zwei Reihen gleicher Knoepfe ohne
   erkennbaren Unterschied. */
.ua-inaktivpills{ padding-left:12px; border-left:1px solid var(--bdo-line); }
.ua-pillslabel{ align-self:center; margin-right:4px; font-size:12px; color:#8aa0ad; white-space:nowrap; }

/* ECHTE Auswahlkaestchen sichtbar machen.
   Materialize versteckt JEDES native [type=checkbox] (position:absolute; opacity:0;
   pointer-events:none) und erwartet daneben ein selbstgebautes Ersatz-Element — so machen es
   die Schalter in den Einstellungen (.set-slider). Wo ein echtes Kaestchen gewollt ist, muss
   die Regel ausdruecklich zurueckgenommen werden.

   DAS HAT DREI STEUERELEMENTE UNSICHTBAR GEMACHT: die Mehrfachauswahl der Konten-Tabelle
   (#64 — gebaut, geprueft und unsichtbar, weil ich die Logik getestet habe und nicht die
   Sichtbarkeit), „nur Verwaiste" in der Dateiverwaltung und den Schalter im Bereich Nutzung.
   Die beiden letzten waren schon vorher blind. */
input[type="checkbox"].bdo-check{
  position:static!important; opacity:1!important; pointer-events:auto!important;
  width:18px; height:18px; margin:0; vertical-align:middle;
  accent-color:var(--bdo-blue); cursor:pointer; }
input[type="checkbox"].bdo-check:disabled{ cursor:default; opacity:.5!important; }

.ua-cbcol{ width:40px; text-align:center; }
.ua-cbcol input{ width:16px; height:16px; cursor:pointer; accent-color:var(--bdo-blue); }
.ua-table tbody tr.ua-selrow{ background:var(--bdo-light); }
.ua-table .ua-actc .ua-icbtn{ opacity:.55; transition:opacity .12s; }
.ua-table tbody tr:hover .ua-actc .ua-icbtn,
.ua-table .ua-actc .ua-icbtn:hover{ opacity:1; }
@media(hover:none){ .ua-table .ua-actc .ua-icbtn{ opacity:1; } }

.ua-pager{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; margin-top:14px; }
.ua-pinfo{ color:#5b6b76; font-size:13px; }
.ua-pctrl{ display:flex; align-items:center; gap:10px; }
.ua-psize{ display:flex; align-items:center; gap:6px; font-size:13px; color:#5b6b76; }
.ua-psize select{ font:inherit; font-size:13px; border:1px solid var(--bdo-line); border-radius:7px; padding:5px 8px; }
.ua-ppage{ font-size:13.5px; color:var(--bdo-navy); font-weight:600; min-width:96px; text-align:center; }
.ua-icbtn[disabled]{ opacity:.35; cursor:default; }

/* Drawer */
.ua-backdrop{ position:fixed; inset:0; background:rgba(0,25,40,.38); z-index:1200; }
.ua-drawer{ position:fixed; top:0; right:0; height:100vh; width:420px; max-width:92vw; background:#fff; z-index:1201;
  box-shadow:-8px 0 28px rgba(0,0,0,.18); display:flex; flex-direction:column; transform:translateX(100%); transition:transform .2s ease; }
.ua-drawer.open{ transform:translateX(0); }
.ua-drawer-head{ display:flex; align-items:center; gap:10px; padding:16px 18px; border-bottom:1px solid var(--bdo-line); }
.ua-drawer-head h3{ margin:0; font-size:18px; color:var(--bdo-navy); flex:1; }
.ua-drawer-body{ padding:18px; overflow-y:auto; display:flex; flex-direction:column; gap:14px; }
.ua-drawer-body .ua-field{ flex:none; }
.ua-drawer-body input, .ua-drawer-body select, .ua-drawer-body textarea{ font:inherit; font-size:14px; color:var(--bdo-dark);
  background:#fff; border:1px solid var(--bdo-line); border-radius:8px; padding:8px 11px; width:100%; }
.ua-drawer-body textarea{ resize:vertical; }
.ua-d-meta{ display:flex; align-items:center; gap:8px; padding-bottom:6px; border-bottom:1px solid var(--bdo-line); }
.ua-d-act{ background:var(--bdo-light); border-radius:9px; padding:10px 12px; font-size:13px; }
.ua-d-foot{ display:flex; gap:10px; margin-top:6px; padding-top:14px; border-top:1px solid var(--bdo-line); }
.ua-d-foot .ua-btn-primary{ flex:1; justify-content:center; }

/* ===== Admin-Sub-Navigation: gleiches Stilsystem wie das Hauptmenü, aber abgesetzt =====
   Voller, links-bündiger Streifen (wie .subnav), nur heller + kleiner = klar untergeordnet.
   Tab-Logik (adminTabNavigation.js) bleibt unberührt; nur Optik überschrieben. */
/* Admin-Zeile auf volle Breite zwingen: body#docbody ist Flex-Column (Sticky-Footer),
   dadurch schrumpfte die .row auf die Breite des aktiven Panels und zentrierte sich
   → Sub-Nav „sprang". align-self:stretch + width:100% hält die Leiste konstant.
   Editor-Inhalt bleibt durch sein inneres .container mittig. */
.admin-shell{ align-self:stretch!important; width:100%!important; max-width:100%!important; margin:0!important; }
#admintabs.col{ padding:0!important; }
#admintabs{ background:var(--bdo-bg); border-bottom:1px solid var(--bdo-line); margin:0 0 18px; }
/* 26px-Padding wie .subnav -> Items starten auf gleicher linker Kante wie die Haupt-Nav. */
#admintabs ul.admnav{ display:flex!important; flex-wrap:wrap; justify-content:flex-start; align-items:center;
  height:auto!important; background:transparent!important; border:none!important; gap:4px; padding:7px 26px!important; margin:0!important;
  overflow:visible!important; list-style:none!important; }
#admintabs ul.admnav .tab{ flex:0 0 auto!important; height:auto!important; line-height:normal!important; text-transform:none!important; margin:0; padding:0; list-style:none!important; }
#admintabs ul.admnav .tab::marker{ content:""; }
#admintabs ul.admnav .tab a{ display:inline-flex!important; align-items:center; gap:7px; height:auto!important;
  padding:7px 13px!important; color:var(--bdo-navy)!important; background:transparent!important; text-transform:none!important;
  font-weight:600; font-size:13.5px; border:none!important; border-radius:8px!important; line-height:1.2!important; letter-spacing:normal; }
#admintabs ul.admnav .tab a .material-icons{ font-size:18px; color:var(--bdo-blue); }
#admintabs ul.admnav .tab a:hover{ background:var(--bdo-light)!important; color:var(--bdo-navy)!important; }
#admintabs ul.admnav .tab a.active{ background:var(--bdo-blue)!important; color:#fff!important; }
#admintabs ul.admnav .tab a.active .material-icons{ color:#fff!important; }
/* Klicks auf Icon/Label sollen den <a> treffen (adminTabNavigation liest e.target.id) */
#admintabs ul.admnav .tab a > *{ pointer-events:none; }
#admintabs ul.admnav .indicator{ display:none!important; }
/* inaktive Fachbereiche im Admin dezent ausgrauen (weiterhin klickbar/befüllbar) */
#admintabs ul.admnav .tab a.inactive{ opacity:.45; }
#admintabs ul.admnav .tab a.inactive.active{ opacity:1; }

/* Trenner Inhalt | System in der Sub-Nav */
#admintabs ul.admnav .adm-sep{ flex:0 0 auto; width:1px; align-self:stretch; min-height:22px; background:var(--bdo-line); margin:4px 9px; padding:0!important; }

/* Fachbereiche-Aufklappmenü */
#admintabs ul.admnav .fb-dd{ position:relative; }
#admintabs ul.admnav .fb-trigger .fb-caret{ margin-left:-2px; transition:transform .15s ease; }
#admintabs ul.admnav .fb-dd.open .fb-trigger .fb-caret{ transform:rotate(180deg); }
#admintabs ul.admnav .fb-menu{ display:none; position:absolute; top:calc(100% + 5px); left:0; z-index:60;
  min-width:212px; background:#fff; border:1px solid var(--bdo-line); border-radius:10px; box-shadow:0 10px 28px rgba(20,40,70,.16);
  padding:6px; margin:0; list-style:none; flex-direction:column; gap:1px; }
#admintabs ul.admnav .fb-dd.open .fb-menu{ display:flex; }
/* Menü-Einträge als volle Zeilen (nicht als Pillen) */
#admintabs ul.admnav .fb-menu li{ list-style:none; margin:0; padding:0; }
#admintabs ul.admnav .fb-menu li::marker{ content:""; }
#admintabs ul.admnav .fb-menu a{ display:flex!important; align-items:center; gap:9px; width:100%; box-sizing:border-box;
  padding:9px 12px!important; border-radius:7px!important; font-size:13.5px; font-weight:600; color:var(--bdo-navy)!important; white-space:nowrap; }
#admintabs ul.admnav .fb-menu a .material-icons{ font-size:18px; color:var(--bdo-blue); }
#admintabs ul.admnav .fb-menu a:hover{ background:var(--bdo-light)!important; }
#admintabs ul.admnav .fb-menu a.active{ background:var(--bdo-blue)!important; color:#fff!important; }
#admintabs ul.admnav .fb-menu a.active .material-icons{ color:#fff!important; }
#admintabs ul.admnav .fb-menu a.inactive{ opacity:.45; }
#admintabs ul.admnav .fb-menu a.inactive.active{ opacity:1; }

/* Mobile-Trigger der Admin-Sub-Nav (nur am Handy sichtbar, sonst aus) */
.admnav-mobtrigger{ display:none; }

/* Admin-Sub-Nav am Handy: KEIN endloser Swipe-Streifen, sondern ein echtes
   Dropdown. Ein Button zeigt den aktiven Bereich; Tippen klappt das vertikale
   Menue aller Bereiche auf. Das Fachbereiche-Untermenue wird dabei aufgeloest
   (Eintraege als normale Zeilen). Tab-Wechsel laeuft unveraendert ueber die
   tabNav-IDs; Auf-/Zuklappen + Label-Sync in admin-subnav.js. */
@media(max-width:640px){
  #admintabs{ position:relative; }
  .admnav-mobtrigger{ display:flex; align-items:center; gap:9px; width:100%; box-sizing:border-box;
    padding:11px 18px; margin:0; border:none; background:#fff; border-bottom:1px solid var(--bdo-line);
    font:inherit; font-weight:700; font-size:15px; color:var(--bdo-navy)!important; cursor:pointer; text-align:left; }
  .admnav-mobtrigger .admnav-mobicon{ color:var(--bdo-blue); font-size:20px; }
  .admnav-mobtrigger .admnav-mobcur{ flex:1; }
  .admnav-mobtrigger .admnav-mobcaret{ color:var(--bdo-blue); transition:transform .15s ease; }
  #admintabs.mob-open .admnav-mobtrigger .admnav-mobcaret{ transform:rotate(180deg); }

  /* Liste standardmaessig zu; offen = vertikales Panel unter dem Trigger */
  #admintabs ul.admnav{ display:none!important; }
  #admintabs.mob-open ul.admnav{ display:flex!important; flex-direction:column; flex-wrap:nowrap;
    align-items:stretch; gap:2px; padding:6px!important; margin:0!important;
    position:absolute; left:0; right:0; top:100%; z-index:60; overflow:auto; max-height:72vh;
    /* !important noetig: Basis `ul.admnav` setzt background/border per !important -> sonst durchsichtiges Menue */
    background:#fff!important; border:1px solid var(--bdo-line)!important; border-top:none!important;
    border-radius:0 0 12px 12px; box-shadow:0 14px 30px rgba(20,40,70,.18); }
  #admintabs.mob-open ul.admnav .tab{ width:100%; }
  #admintabs.mob-open ul.admnav .tab a{ width:100%; box-sizing:border-box; justify-content:flex-start;
    padding:12px 14px!important; border-radius:8px!important; font-size:15px; white-space:nowrap; }
  /* Fachbereiche-Untermenue aufloesen -> Eintraege als normale Zeilen */
  #admintabs.mob-open ul.admnav .fb-dd{ display:contents; }
  /* hoehere Spezifitaet noetig: .fb-dd traegt auch .tab -> sonst gewinnt `.tab a` */
  #admintabs.mob-open ul.admnav .fb-dd a.fb-trigger{ display:none!important; }
  #admintabs.mob-open ul.admnav .fb-menu{ display:contents!important; position:static; min-width:0;
    background:none; border:none; box-shadow:none; padding:0; margin:0; }
  #admintabs.mob-open ul.admnav .fb-menu a{ display:flex!important; width:100%; box-sizing:border-box;
    justify-content:flex-start; padding:12px 14px!important; border-radius:8px!important; font-size:15px; }
  /* Trenner Inhalt|System als horizontale Linie statt vertikalem Strich */
  #admintabs.mob-open ul.admnav .adm-sep{ width:auto; height:1px; min-height:0; align-self:stretch; margin:5px 8px; }
}

/* Admin-Einstellungen: Bereichs-Schalter */
.set-lead{ color:#5b6b76; font-size:14.5px; max-width:760px; margin:0 0 18px; }
.set-areas{ max-width:560px; display:flex; flex-direction:column; gap:10px; }
.set-row{ display:flex; align-items:center; gap:14px; background:#fff; border:1px solid var(--bdo-line); border-radius:12px; padding:12px 16px; margin-bottom:10px; }
.set-row.on{ border-color:var(--bdo-mid); }
.set-ic{ color:var(--bdo-blue); font-size:24px; flex:none; }
.set-info{ flex:1; min-width:0; }
.set-name{ font-weight:700; color:var(--bdo-navy); font-size:15.5px; }
.set-sub{ color:#5b6b76; font-size:13px; }
.set-switch{ position:relative; display:inline-block; width:46px; height:26px; flex:none; }
.set-switch input{ opacity:0; width:0; height:0; position:absolute; }
.set-slider{ position:absolute; inset:0; background:#c9d4dc; border-radius:26px; transition:.18s; cursor:pointer; }
/* Materialize zeichnet auf jedem [type=checkbox]+span eine eigene Checkbox/Häkchen (::before/::after) — hier komplett abschalten */
.set-switch input[type=checkbox] + .set-slider::before,
.set-switch input[type=checkbox] + .set-slider::after{ display:none !important; }
.set-knob{ position:absolute; height:20px; width:20px; left:3px; top:3px; background:#fff; border-radius:50%; box-shadow:0 1px 2px rgba(0,0,0,.3); transition:.18s; }
.set-switch input:checked + .set-slider{ background:var(--bdo-blue); }
.set-switch input:checked + .set-slider .set-knob{ left:auto; right:3px; transform:none; }
.set-switch.set-locked .set-slider{ background:var(--bdo-mid); cursor:default; opacity:.7; }

/* Länder-Artikel: „Hinweis/Korrektur melden" */
.ll-report{ margin-top:26px; padding-top:16px; border-top:1px solid var(--bdo-line); }
.ll-report-toggle{ display:inline-flex; align-items:center; gap:7px; background:none; border:1px solid var(--bdo-line);
  border-radius:9px; padding:8px 14px; font:inherit; font-size:13.5px; font-weight:600; color:#5b6b76; cursor:pointer; }
.ll-report-toggle .material-icons{ font-size:18px; color:var(--bdo-blue); }
.ll-report-toggle:hover{ border-color:var(--bdo-blue); color:var(--bdo-blue); }
.ll-report-box{ margin-top:12px; max-width:600px; }
.ll-report-box textarea{ width:100%; font:inherit; font-size:14px; border:1px solid var(--bdo-line); border-radius:9px; padding:10px 12px; resize:vertical; }
.ll-report-box textarea:focus{ outline:none; border-color:var(--bdo-blue); }
.ll-report-row{ display:flex; align-items:center; gap:10px; margin-top:8px; }
.ll-report-send{ display:inline-flex; align-items:center; gap:6px; background:var(--bdo-blue); border:none; color:#fff;
  border-radius:8px; padding:8px 14px; font:inherit; font-size:13.5px; font-weight:600; cursor:pointer; }
.ll-report-send .material-icons{ font-size:17px; }
.ll-report-send:hover{ background:var(--bdo-navy); }
.ll-report-cancel{ background:none; border:none; color:#5b6b76; font:inherit; font-size:13.5px; cursor:pointer; }
.ll-report-out{ font-size:13px; }
.ll-report-out.ok{ color:#1f7a52; } .ll-report-out.err{ color:#b00; }

/* Admin: Nutzer-Kommentare */
.uc-tabs{ max-width:860px; }
/* Kommentare mittig statt links am Rand: Die Karten bleiben auf 860px begrenzt (laengere
   Zeilen liest niemand gern), der Bereich ist aber 1520px breit — ohne Zentrierung sitzt
   alles linksbuendig und wirkt verrutscht. */
.uc-mitte{ max-width:860px; margin:0 auto; }
.uc-list{ display:flex; flex-direction:column; gap:10px; }
/* OHNE farbige linke Kante. Sie war hier scheinbar bedeutungstragend (Status), tatsaechlich
   aber eine Dopplung: Im Kopf jeder Karte steht bereits die Status-Pille mit farbigem Punkt
   UND dem Status als Wort — das ist die bessere Anzeige, weil sie ohne Farbwissen lesbar ist.
   Die Klassen uc-st-* bleiben am Element: Sie sind auch Zustandskennung fuer Skript und
   Tests, nicht nur Optik. */
.uc-card{ background:#fff; border:1px solid var(--bdo-line); border-radius:12px; padding:14px 18px; box-shadow:0 1px 4px rgba(1,75,124,.05); }
.uc-head{ display:flex; align-items:center; gap:9px; margin-bottom:7px; }
.uc-flag{ width:22px; height:16px; object-fit:cover; border-radius:2px; box-shadow:0 0 0 1px rgba(0,0,0,.1); }
.uc-where{ font-weight:700; color:var(--bdo-navy); font-size:14.5px; flex:1; min-width:0; }
.uc-link{ display:inline-flex; align-items:center; gap:5px; text-decoration:none; cursor:pointer; }
.uc-link:hover{ color:var(--bdo-blue); text-decoration:underline; }
.uc-link .material-icons{ font-size:15px; opacity:.6; }
.uc-link:hover .material-icons{ opacity:1; }
/* Status als farbige Pill mit eingebettetem Select (Klick -> Auswahl). Farbe je Status. */
.uc-pill{ display:inline-flex; align-items:center; gap:7px; padding:0 8px 0 12px; height:32px; border-radius:30px;
  font-size:12.5px; font-weight:700; white-space:nowrap; border:1.5px solid var(--ucc,#1c6aa0); background:var(--ucl,#e7f3fb); color:var(--ucc,#1c6aa0); }
.uc-pill .uc-dot{ width:8px; height:8px; border-radius:50%; background:var(--ucc,#1c6aa0); flex:none; }
.uc-pillsel{ display:inline-block; border:0; background:transparent; font:inherit; font-weight:700; color:inherit; cursor:pointer;
  -webkit-appearance:none; -moz-appearance:none; appearance:none; padding:0 18px 0 0; height:100%; width:auto;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='3'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat:no-repeat; background-position:right center; }
.uc-pillsel:focus{ outline:0; }
.uc-p-offen{ --ucc:#1c6aa0; --ucl:#e7f3fb; }
.uc-p-todo{ --ucc:#9a7400; --ucl:#fef3d9; }
.uc-p-erledigt{ --ucc:#1f7a52; --ucl:#e6f6ee; }
.uc-p-gelesen{ --ucc:#5b6b76; --ucl:#eef2f5; }
.uc-msg{ color:#33424c; font-size:14.5px; line-height:1.55; white-space:pre-wrap; word-break:break-word; }
.uc-foot{ display:flex; align-items:center; gap:12px; margin-top:12px; }
.uc-meta{ color:#8aa0ad; font-size:12.5px; flex:1; min-width:0; }
.uc-del{ width:36px; height:36px; border-radius:9px; border:1px solid var(--bdo-line); background:#fff; color:#c0392b;
  display:inline-flex; align-items:center; justify-content:center; cursor:pointer; flex:none; }
.uc-del:hover{ background:#fde9e9; border-color:#c0392b; }
.uc-del .material-icons{ font-size:19px; }
.uc-audit{ margin-top:9px; padding-top:8px; border-top:1px dashed var(--bdo-line); color:#8aa0ad; font-size:12px; }
.uc-audit b{ color:#5b6b76; }
.uc-histtoggle{ background:none; border:none; color:var(--bdo-blue); font:inherit; font-size:12px; cursor:pointer; text-decoration:underline; padding:0 0 0 6px; }
.uc-hist{ list-style:none; margin:8px 0 0; padding:8px 12px; background:var(--bdo-bg); border-radius:8px; font-size:12.5px; color:#5b6b76; }
.uc-hist li{ padding:3px 0; }
.uc-hist .uc-h-st{ font-weight:700; color:var(--bdo-navy); }

/* ===== Generischer Admin-Content-Editor (admin-content.js) ===== */
/* ac-wrap/al-wrap erben jetzt die einheitliche .ua-wrap-Breite (1180), damit ALLE
   Admin-Panel-Titel auf gleicher linker Kante wie die Sub-Nav sitzen. */
.ac-layout{ display:flex; gap:18px; align-items:flex-start; }
.ac-side{ width:300px; flex:none; background:#fff; border:1px solid var(--bdo-line); border-radius:12px; padding:12px; max-height:78vh; overflow:auto; }
.ac-side-h{ display:flex; align-items:center; justify-content:space-between; font-size:12px; text-transform:uppercase; letter-spacing:.5px; color:#90a0ad; font-weight:700; padding:2px 6px 10px; border-bottom:1px solid var(--bdo-line); margin-bottom:6px; }
.ac-addbtn{ background:var(--bdo-blue); border:none; color:#fff; width:26px; height:26px; border-radius:7px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; }
.ac-addbtn .material-icons{ font-size:18px; }
.ac-addbtn:hover{ background:var(--bdo-navy); }
.ac-toolbar2{ display:flex; align-items:center; gap:4px; margin-bottom:14px; flex-wrap:wrap; }
.ac-tbtn{ background:#fff; border:1px solid var(--bdo-line); color:var(--bdo-navy); width:34px; height:34px; border-radius:8px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; }
.ac-tbtn .material-icons{ font-size:18px; }
.ac-tbtn:hover{ border-color:var(--bdo-blue); color:var(--bdo-blue); background:var(--bdo-light); }
.ac-tbtn.ac-danger:hover{ border-color:#c0392b; color:#c0392b; background:#fde9e9; }
.ac-tsep{ width:1px; height:24px; background:var(--bdo-line); margin:0 4px; }
.ua-btn-pub{ background:#1f9d57; border-color:#1f9d57; color:#fff; }
.ua-btn-pub:hover{ background:#177a43; border-color:#177a43; color:#fff; }
.ac-tree{ list-style:none; margin:0; padding:0; }
.ac-tnode{ display:flex; align-items:center; gap:7px; cursor:pointer; padding:7px 8px; border-radius:8px; font-size:13.5px; color:var(--bdo-dark); padding-left:calc(8px + var(--d,0) * 14px); }
.ac-tnode:hover{ background:var(--bdo-light); }
.ac-tnode.on{ background:var(--bdo-blue); color:#fff; }
.ac-tnode.on .ac-tic{ color:#fff; }
.ac-tic{ font-size:17px; color:var(--bdo-blue); flex:none; }
.ac-tlabel{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ac-tdot{ width:8px; height:8px; border-radius:50%; flex:none; }
.ac-tdot.pub{ background:#1f9d57; } .ac-tdot.edit{ background:#e0a400; }
.ac-empty{ color:#8aa0ad; padding:12px 6px; list-style:none; }
.ac-main{ flex:1; min-width:0; background:#fff; border:1px solid var(--bdo-line); border-radius:12px; padding:18px 20px; }
.ac-placeholder{ color:#9aa9b3; text-align:center; padding:60px 20px; }
.ac-placeholder .material-icons{ font-size:42px; display:block; margin-bottom:10px; color:var(--bdo-mid); }
.ac-ed-head{ display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.ac-ed-bc{ flex:1; color:#5b6b76; font-size:13px; }
.ac-ed-status{ font-size:11.5px; font-weight:700; padding:3px 10px; border-radius:20px; }
.ac-ed-status.pub{ background:#e6f6ee; color:#1f7a52; } .ac-ed-status.edit{ background:#fef3d9; color:#9a7400; }
.ac-field{ display:block; font-size:13px; font-weight:600; color:#5b6b76; margin-bottom:12px; }
.ac-field input{ display:block; width:100%; margin-top:5px; font:inherit; font-size:14.5px; color:var(--bdo-dark); border:1px solid var(--bdo-line); border-radius:8px; padding:9px 12px; }
.ac-field input:focus{ outline:none; border-color:var(--bdo-blue); }
.ac-hint{ font-weight:400; color:#9aa9b3; }
.ac-ed-foot{ display:flex; align-items:center; gap:14px; margin-top:14px; }
.ac-savehint{ color:#9aa9b3; font-size:12.5px; }
.ac-msg{ font-size:13.5px; margin:0 0 10px; min-height:18px; }
.ac-msg-ok{ color:#1f7a52; } .ac-msg-err{ color:#b00; } .ac-msg-info{ color:#5b6b76; }
@media(max-width:820px){ .ac-layout{ flex-direction:column; } .ac-side{ width:100%; max-height:none; } }
/* --- Zentrale Schlagwort-Verwaltung (Admin-Content) --- */
.ac-tabs{ margin-top:4px; }
.ac-tagmgr{ background:#fff; border:1px solid var(--bdo-line); border-radius:12px; padding:18px 18px 22px; }
.ac-tag-head{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.ac-tag-head .ac-tag-new{ flex:1 1 240px; min-width:0; }
.ac-tag-info{ font-size:12.5px; color:#7a8a95; margin:12px 0 16px; }
.ac-tag-load{ color:#9aa9b3; font-size:13.5px; }
.ac-tag-empty{ color:#9aa9b3; font-size:14px; }
.ac-tag-list{ display:flex; flex-wrap:wrap; gap:10px; }
.ac-tag{ display:inline-flex; align-items:center; gap:4px; background:var(--bdo-light); border:1px solid var(--bdo-line);
  border-radius:20px; padding:5px 6px 5px 14px; font-size:14px; font-weight:600; color:var(--bdo-dark); }
.ac-tag-lbl{ line-height:1.2; }
.ac-tag-edit,.ac-tag-del,.ac-tag-ok,.ac-tag-cancel{ display:inline-flex; align-items:center; justify-content:center;
  width:24px; height:24px; padding:0; border:none; background:none; cursor:pointer; color:#90a0ad; border-radius:50%; }
.ac-tag-edit .material-icons,.ac-tag-del .material-icons,.ac-tag-ok .material-icons,.ac-tag-cancel .material-icons{ font-size:17px; }
.ac-tag-edit:hover,.ac-tag-ok:hover{ color:var(--bdo-blue); background:rgba(0,159,227,.12); }
.ac-tag-del:hover,.ac-tag-cancel:hover{ color:#c0392b; background:#fde9e9; }
.ac-tag .ac-tag-rename{ width:150px; padding:4px 10px!important; font-size:14px; }
/* Mehrfachauswahl im Artikel-Editor */
.ac-tagsel{ display:flex; flex-wrap:wrap; gap:8px; margin:5px 0 12px; }
.ac-tagsel-load,.ac-tagsel-hint{ font-size:13px; color:#9aa9b3; font-weight:400; }
.ac-tagchip{ display:inline-flex; align-items:center; cursor:pointer; font:inherit; font-size:13.5px; font-weight:600;
  border:1px solid var(--bdo-line); background:#fff; color:var(--bdo-dark); border-radius:18px; padding:5px 13px; }
.ac-tagchip:hover{ border-color:var(--bdo-mid); }
.ac-tagchip:focus,.ac-tagchip:active{ outline:none; }
.ac-tagchip.on{ background:var(--bdo-blue); border-color:var(--bdo-blue); color:#fff; }
.ll-ctry .ll-flag{ width:46px!important; height:34px!important; }
.ll-topiclist li{ font-size:15px; }
.ll-ticon{ font-size:21px!important; color:#5b6b76; width:24px; flex:none; text-align:center; line-height:1; }
.ll-topiclist li.on .ll-ticon{ color:var(--bdo-blue); }
.ll-tt{ flex:1; }

/* ====================== Länder-Admin (admin-laender.js) ====================== */
/* al-wrap: siehe ac-wrap — erbt .ua-wrap-Breite (1180) für einheitliche Titel-Kante. */
.al-msg{ font-size:13.5px; margin:0 0 10px; min-height:18px; }
.al-back{ margin-bottom:14px; }
.al-backlink{ display:inline-flex; align-items:center; gap:4px; cursor:pointer; color:var(--bdo-blue); font-size:13.5px; font-weight:600; }
.al-backlink:hover{ color:var(--bdo-navy); text-decoration:underline; }
.al-ctry{ display:flex; align-items:center; gap:11px; margin-bottom:16px; padding-bottom:14px; border-bottom:1px solid var(--bdo-line); }
.al-ctry .ll-flag{ width:46px; height:34px; }
.al-ctry-nm{ font-size:18px; font-weight:700; color:var(--bdo-dark); }
.al-tnode .ac-tlabel{ font-size:14px; }

/* Länder-Admin: Karte mit Status (veröffentlicht=blau, Entwurf=amber, klickbar; ohne Daten=grau) */
.al-map path.al-pub{ fill:var(--bdo-mid); cursor:pointer; transition:fill .12s; }
.al-map path.al-pub:hover{ fill:var(--bdo-blue); }
.al-map path.al-draft{ fill:#f1c97a; cursor:pointer; transition:fill .12s; }
.al-map path.al-draft:hover{ fill:#e0a400; }
.al-map .al-dot{ stroke:#fff; stroke-width:1.6; cursor:pointer; transition:fill .12s; }
.al-map .al-dot.al-pub{ fill:var(--bdo-blue); } .al-map .al-dot.al-pub:hover{ fill:var(--bdo-navy); }
.al-map .al-dot.al-draft{ fill:#e0a400; } .al-map .al-dot.al-draft:hover{ fill:#b88600; }
.al-offchip.al-draft-chip{ border-color:#e7c66a; }
.al-offchip .al-cdot{ width:8px; height:8px; border-radius:50%; flex:none; }
.al-offchip .al-cdot.al-pub{ background:var(--bdo-blue); } .al-offchip .al-cdot.al-draft{ background:#e0a400; }
.al-legend{ display:flex; flex-wrap:wrap; gap:16px; justify-content:center; margin-top:10px; color:#5b6b76; font-size:12.5px; }
.al-legend span{ display:inline-flex; align-items:center; gap:6px; }
.al-legend i{ width:12px; height:12px; border-radius:3px; display:inline-block; }
.al-legend i.lg-pub{ background:var(--bdo-mid); } .al-legend i.lg-draft{ background:#f1c97a; } .al-legend i.lg-no{ background:#cdd9e1; }
/* Status-Punkt auf den Flaggen-Cards im Listen-Raster */
.al-ccard{ position:relative; }
/* Status-Anzeige Länder-Liste (Konzept C): farbiger linker Balken + Label statt Punkt */
.al-ccard{ position:relative; overflow:hidden; padding-left:20px; }
.al-ccard::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:6px; }
.al-ccard.al-pub::before{ background:#1b8a4b; }
.al-ccard.al-draft::before{ background:#d99100; }
.al-cardlbl{ font:700 10.5px/1 'Roboto','Segoe UI',Arial,sans-serif; letter-spacing:.04em; text-transform:uppercase; margin-top:4px; }
.al-ccard.al-pub .al-cardlbl{ color:#1b8a4b; }
.al-ccard.al-draft .al-cardlbl{ color:#9a6a00; }
.al-ccard.al-none::before{ background:#b9c7d2; }
.al-ccard.al-none .al-cardlbl{ color:#8a98a4; }
/* Nicht veröffentlichte Länder (Entwurf + kein Inhalt) ausgegraut — klickbar, „nicht aktiv".
   Hover stellt volle Farbe her (signalisiert Interaktivität). */
.al-ccard.al-draft, .al-ccard.al-none{ opacity:.55; filter:grayscale(.55); transition:opacity .12s, filter .12s; }
.al-ccard.al-draft:hover, .al-ccard.al-none:hover{ opacity:1; filter:none; }

/* Admin-Länder v2: Kontinent-Tabs (Default Europa) */
.al-az-sep{ font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; color:#8aa0ad; margin:18px 2px 10px; }
.al-conttabs{ display:flex; flex-wrap:wrap; gap:6px; margin:0 0 14px; }
.al-conttab{ padding:7px 14px; border:1px solid var(--bdo-line); background:#fff; border-radius:8px; font:inherit; font-size:13.5px; font-weight:600; color:var(--bdo-navy); cursor:pointer; }
.al-conttab:hover{ border-color:var(--bdo-blue); }
.al-conttab.on{ background:var(--bdo-blue); color:#fff; border-color:var(--bdo-blue); }
.al-conttab:focus,.al-conttab:active{ outline:none; }

/* Admin-Karte = gemeinsame LLMap, Status-Einfärbung (Länder hell, Punkte gesättigt) */
.ll-map .ll-map-countries path.al-pub{ fill:var(--bdo-mid); cursor:pointer; }
.ll-map .ll-map-countries path.al-pub:hover{ fill:var(--bdo-blue); }
.ll-map .ll-map-countries path.al-draft{ fill:#f1c97a; cursor:pointer; }
.ll-map .ll-map-countries path.al-draft:hover{ fill:#e0a400; }
.ll-map .ll-map-countries path.al-none{ fill:#cdd9e2; cursor:pointer; }
.ll-map .ll-map-countries path.al-none:hover{ fill:#b9c7d2; }
.ll-map-dots circle.ll-map-dot-on.al-pub{ fill:var(--bdo-blue); }
.ll-map-dots circle.ll-map-dot-on.al-pub:hover{ fill:var(--bdo-navy); }
.ll-map-dots circle.ll-map-dot-on.al-draft{ fill:#e0a400; }
.ll-map-dots circle.ll-map-dot-on.al-draft:hover{ fill:#b88600; }
.ll-map-dots circle.ll-map-dot-on.al-none{ fill:#9aa9b5; }
.ll-map-key.al-lg-pub{ background:var(--bdo-mid); }
.ll-map-key.al-lg-draft{ background:#f1c97a; }
.ll-map-key.al-lg-none{ background:#cdd9e1; }

/* „Thema hinzufügen"-Button + Picker-Overlay */
.al-addtopic{ display:inline-flex; align-items:center; gap:6px; margin-top:14px; width:100%; justify-content:center; background:var(--bdo-light); border:1px dashed var(--bdo-mid); color:var(--bdo-navy); border-radius:9px; padding:10px 14px; font:inherit; font-size:14px; font-weight:600; cursor:pointer; }
.al-addtopic:hover{ border-color:var(--bdo-blue); color:var(--bdo-blue); background:#fff; }
.al-addtopic .material-icons{ font-size:19px; }
.al-tpick-ov{ position:fixed; inset:0; z-index:2000; background:rgba(1,25,40,.45); display:flex; align-items:center; justify-content:center; padding:20px; }
.al-tpick{ background:#fff; border-radius:14px; box-shadow:0 18px 50px rgba(0,0,0,.3); width:540px; max-width:100%; max-height:80vh; display:flex; flex-direction:column; overflow:hidden; }
.al-tpick-head{ display:flex; align-items:center; justify-content:space-between; padding:14px 18px; border-bottom:1px solid var(--bdo-line); font-weight:700; color:var(--bdo-navy); }
.al-tpick-x{ cursor:pointer; color:#7c8a96; } .al-tpick-x:hover{ color:#b00; }
.al-tpick-list{ display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:16px 18px; overflow:auto; }
.al-tpick-item{ display:flex; align-items:center; justify-content:space-between; gap:8px; text-align:left; background:var(--bdo-light); border:1px solid var(--bdo-line); border-radius:9px; padding:11px 13px; font:inherit; font-size:14px; font-weight:600; color:var(--bdo-navy); cursor:pointer; }
.al-tpick-item:hover{ border-color:var(--bdo-blue); background:#fff; }
.al-tpick-item.used{ opacity:.55; cursor:default; }
.al-tpick-used{ font-size:11px; font-weight:600; color:#8a98a4; background:#fff; border-radius:10px; padding:2px 7px; }
@media(max-width:560px){ .al-tpick-list{ grid-template-columns:1fr; } }

/* Edit-Präsenz (weiche Sperre) — admin-presence.js */
.ac-presence{ display:flex; align-items:center; gap:9px; background:#fef3d9; border:1px solid #e7c66a;
  color:#8a6d00; border-radius:10px; padding:10px 14px; margin:0 0 16px; font-size:13.5px; line-height:1.4; }
.ac-presence .material-icons{ font-size:19px; flex:none; color:#b08900; }
.ac-presence strong{ font-weight:700; }

/* (Textgrößen-/Zoom-Regler entfernt — Nutzer verwenden den Browser-Zoom.) */

/* ====================== GLOBALE SUCHE (Overlay) ====================== */
.bdo-search-ov{ position:fixed; inset:0; z-index:2000; background:rgba(1,25,40,.45);
  display:none; align-items:flex-start; justify-content:center; padding:8vh 16px; }
.bdo-search-ov.open{ display:flex; }
.bs-box{ width:100%; max-width:720px; background:#fff; border-radius:16px; overflow:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,.32); display:flex; flex-direction:column; max-height:80vh; }
.bs-inputrow{ display:flex; align-items:center; gap:12px; padding:16px 20px; border-bottom:1px solid var(--bdo-line); }
.bs-inputrow svg{ width:22px; height:22px; stroke:var(--bdo-blue); fill:none; stroke-width:2.2; flex:none; }
.bs-inputrow input{ flex:1; border:none!important; border-bottom:none!important; outline:none; font-size:18px;
  color:var(--bdo-dark); font-family:'Roboto',sans-serif; background:transparent;
  height:auto!important; min-height:0!important; margin:0!important; padding:0!important; box-shadow:none!important; }
.bs-inputrow #bsClose{ border:none; background:transparent; font-size:17px; color:#8aa0ad; cursor:pointer;
  width:34px; height:34px; border-radius:50%; flex:none; }
.bs-inputrow #bsClose:hover{ background:var(--bdo-light); color:var(--bdo-navy); }
.bs-results{ overflow:auto; padding:8px; }
.bs-hint{ color:#8aa0ad; font-size:14px; padding:18px 14px; }
.bs-count{ color:var(--bdo-navy); font-size:13px; font-weight:600; padding:10px 14px 6px; }
.bs-item{ display:flex; gap:13px; padding:12px 14px; border-radius:10px; text-decoration:none; align-items:flex-start; }
.bs-item:hover{ background:var(--bdo-light); }
.bs-flag{ width:34px; height:25px; border-radius:3px; border:1px solid rgba(0,0,0,.1); object-fit:cover; flex:none; margin-top:2px; }
.bs-title{ font-weight:600; color:var(--bdo-navy); font-size:15px; }
.bs-snip{ font-size:13px; color:#5b6b76; margin-top:3px; line-height:1.55; }
.bs-snip mark, .bs-title mark{ background:#fff3cd; color:inherit; padding:0 1px; border-radius:2px; }

/* ====================== LOGIN-SEITE (BDO, Konzept A) ====================== */
.bdo-login{ display:flex; flex-direction:column; align-items:center; padding:48px 16px 64px; }
.bdo-login-card{ width:100%; max-width:380px; background:#fff; border-radius:16px;
  box-shadow:0 10px 30px rgba(1,75,124,.12); overflow:hidden; }
.bdo-login-accent{ height:5px; background:linear-gradient(90deg,var(--bdo-blue),var(--bdo-navy)); }
.bdo-login-body{ padding:30px 34px 34px; }
/* "bdo" als Inline-Logo in Texthöhe */
.bdo-word{ height:0.82em; width:auto; vertical-align:-0.06em; }
.bdo-login-logo{ display:block; height:46px; width:auto; max-width:90%; margin:6px auto 22px; }
/* Benutzerdaten: zwei Karten nebeneinander mit Trennstrich; schmale Schirme -> untereinander. */
.ud-grid{ display:flex; align-items:stretch; justify-content:center; width:100%; flex-wrap:wrap; }
.ud-grid .bdo-login-box{ flex:1 1 360px; max-width:460px; margin:0; }
.ud-sep{ flex:none; width:1px; align-self:stretch; background:var(--bdo-line); margin:0 30px; }
@media(max-width:860px){
  .ud-grid{ flex-direction:column; align-items:center; }
  .ud-grid .bdo-login-box{ flex:1 1 auto; width:100%; }
  .ud-sep{ width:auto; height:1px; align-self:stretch; max-width:460px; margin:24px 0; }
}
/* Einzel-Kachel: zentriert, feste Breite */
.bdo-login-box{ width:100%; max-width:420px; background:#fff; border:1px solid var(--bdo-line); border-radius:16px;
  box-shadow:0 10px 30px rgba(1,75,124,.12); overflow:hidden; display:flex; flex-direction:column; }
.bdo-login-box::before{ content:""; display:block; height:5px; background:linear-gradient(90deg,var(--bdo-blue),var(--bdo-navy)); }
.bdo-login-boxbody{ padding:26px 28px 28px; display:flex; flex-direction:column; flex:1; }
.bdo-login-box .bdo-login-title{ font-size:18px; line-height:1.25; }
.bdo-login-box .bdo-login-form{ display:flex; flex-direction:column; flex:1; }
.bdo-login-box .bdo-login-btn{ margin-top:auto; }
.bdo-login-err{ max-width:420px; margin:14px auto 0; }
/* Admin-Hinweis (kein Fehler): freundlicher Info-Kasten, zentriert über der Kachelbreite. */
.bdo-login-notice{ max-width:420px; margin:0 auto 18px; background:var(--bdo-light);
  border:1px solid var(--bdo-mid); border-radius:10px; padding:11px 14px; color:var(--bdo-navy);
  font-size:13.5px; text-align:center; }
.bdo-login-notice[hidden]{ display:none; }
.bdo-login{ position:relative; }
/* Sticky-Footer-Layout NUR auf den Login-Seiten (body-Klasse via JS): Inhalt füllt die
   Höhe, der Footer bleibt unten — rein im Fluss, also zoom-fest. */
body.bdo-login-page{ display:flex; flex-direction:column; min-height:100vh; min-height:100dvh; }
body.bdo-login-page .bdo-login{ flex:1 1 auto; }
/* Titel + Untertitel der Anmelde-Kachel zentriert (#87) — nur auf den Login-Seiten, die
   Kachel wird auch bei den Benutzerdaten verwendet. */
body.bdo-login-page .bdo-login-title, body.bdo-login-page .bdo-login-sub{ text-align:center; }
.bdo-login-btn:focus, .bdo-login-btn:active{ background-color:var(--bdo-blue) !important; }
.bdo-collapsed{ display:none !important; }
/* Wechsel zwischen Mitglieder- und Mitarbeiter-Anmeldung (#87): grauer Trennstrich, darunter
   eine eigene, kleinere Karte mit Button. Ein Textlink war zu unauffaellig. */
.bdo-login-sep{ width:100%; max-width:420px; height:1px; background:#c3ccd4; margin:30px 0; border:0; }
.bdo-login-box.bdo-login-switchbox .bdo-login-boxbody{ padding:20px 28px 22px; }
.bdo-login-switchbox .bdo-login-title{ font-size:17px; }
.bdo-login-switchbox .bdo-login-sub{ margin-bottom:16px; }
.bdo-login-switchbtn{ display:flex; align-items:center; justify-content:center; gap:8px; width:100%; box-sizing:border-box;
  border:1.5px solid var(--bdo-navy); border-radius:10px; padding:11px; font-weight:700; font-size:14px;
  color:var(--bdo-navy); background:#fff; text-decoration:none; transition:background .15s ease, color .15s ease; }
.bdo-login-switchbtn:hover, .bdo-login-switchbtn:focus{ background:var(--bdo-navy); color:#fff; }
.bdo-login-switchbtn .material-icons{ font-size:18px; }
.bdo-login-title{ font-family:'Roboto Slab',Georgia,serif; font-weight:700; color:var(--bdo-navy);
  font-size:23px; line-height:1.2; margin:0 0 4px; }
.bdo-login-sub{ color:#5b6b77; font-size:14px; margin:0 0 22px; }
.bdo-login-form{ display:block; }
.bdo-field{ display:flex; align-items:center; gap:10px; border:1.5px solid var(--bdo-line);
  border-radius:10px; background:#fff; padding:0 13px; margin-bottom:14px;
  transition:border-color .15s ease, box-shadow .15s ease; }
.bdo-field:focus-within{ border-color:var(--bdo-blue); box-shadow:0 0 0 3px rgba(0,159,227,.15); }
.bdo-field .material-icons{ color:var(--bdo-blue); font-size:20px; flex:none; }
.bdo-field input{ flex:1 1 auto; border:0!important; outline:none; background:transparent;
  padding:12px 0!important; margin:0!important; height:auto!important; box-shadow:none!important;
  font-size:15px; color:var(--bdo-dark); }
.bdo-field input::placeholder{ color:#9aa7b1; }
.bdo-login-forgot{ text-align:right; margin:-2px 0 18px; }
.bdo-login-forgot a{ color:var(--bdo-blue); font-size:13px; }
.bdo-login-forgot a:hover{ text-decoration:underline; }
.bdo-login-btn{ display:flex; align-items:center; justify-content:center; gap:8px; width:100%;
  background:var(--bdo-blue); color:#fff; font-weight:700; font-size:15px; border:0;
  border-radius:10px; padding:13px; cursor:pointer; transition:background .15s ease; }
.bdo-login-btn:hover{ background:#0089c4; }
.bdo-login-btn .material-icons{ font-size:19px; }
.bdo-login .errormessage{ color:#c0392b; font-size:13.5px; text-align:center; margin-top:16px; }
.bdo-login .errormessage:empty{ display:none; }
.bdo-login .successmessage{ color:#1f9d57; font-size:13.5px; text-align:center; margin-top:16px; display:block; }
.bdo-login .errors{ margin-top:16px; }
.bdo-login .errors ul{ margin:0; padding:0; list-style:none; }
.bdo-login .errors li{ font-size:13.5px; }
.bdo-login-or{ display:flex; align-items:center; gap:12px; color:#9aa7b1; font-size:12.5px; margin:20px 0 14px; }
.bdo-login-or::before, .bdo-login-or::after{ content:""; flex:1; height:1px; background:var(--bdo-line); }
.bdo-login-m365{ display:flex; align-items:center; justify-content:center; gap:10px; width:100%; box-sizing:border-box;
  border:1.5px solid var(--bdo-line); border-radius:10px; padding:11px; font-weight:600; font-size:14px;
  color:var(--bdo-dark); background:#fff; text-decoration:none; transition:border-color .15s ease, background .15s ease; }
.bdo-login-m365:hover{ border-color:var(--bdo-blue); background:var(--bdo-light); }

/* ====================== M365-Umstiegs-Hinweis (modaler Dialog auf /start) ====================== */
.m365-modal{ position:fixed; inset:0; z-index:120; display:flex; align-items:center; justify-content:center; padding:18px; }
.m365-modal-bg{ position:absolute; inset:0; background:rgba(2,30,52,.5); }
.m365-modal-card{ position:relative; width:100%; max-width:440px; background:#fff; border-radius:16px; overflow:hidden;
  box-shadow:0 18px 50px rgba(1,75,124,.28); }
.m365-modal-accent{ height:5px; background:linear-gradient(90deg,var(--bdo-blue),var(--bdo-navy)); }
.m365-modal-body{ padding:26px 30px 28px; }
.m365-modal-title{ font-family:'Roboto Slab',Georgia,serif; font-weight:700; color:var(--bdo-navy); font-size:20px; margin:0 0 12px; }
.m365-modal-text{ color:var(--bdo-dark); font-size:14.5px; line-height:1.55; margin:0 0 18px; }
.m365-modal-btnpreview{ display:flex; align-items:center; justify-content:center; gap:10px; width:100%; box-sizing:border-box;
  border:1.5px solid var(--bdo-line); border-radius:10px; padding:11px; font-weight:600; font-size:14px;
  color:var(--bdo-dark); background:#fff; margin:0 0 22px; }
.m365-modal-ok{ width:100%; }

/* ====================== 404-SEITE (Bus, Konzept A) ====================== */
.nf-page{ padding:0 0 64px; text-align:center; }
/* Volle Seitenbreite: der Bus fährt über die ganze Seite */
.nf-stage{ position:relative; width:100%; height:210px; overflow:hidden; margin:0 0 30px;
  background:linear-gradient(180deg,#eaf6fd 0%,var(--bdo-bg) 75%); border-bottom:1px solid var(--bdo-line); }
.nf-wrap{ max-width:680px; margin:0 auto; padding:0 16px; }
.nf-big{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-family:'Roboto Slab',Georgia,serif; font-weight:800; font-size:110px; color:var(--bdo-navy); opacity:.10;
  letter-spacing:8px; text-indent:8px; /* text-indent kompensiert den letter-spacing-Trailing -> optisch mittig */ }
.nf-road{ position:absolute; left:0; right:0; bottom:34px; height:3px; background:#9fb3c0; }
.nf-road::after{ content:""; position:absolute; left:0; right:0; top:1px; height:2px;
  background:repeating-linear-gradient(90deg,#fff 0 18px,transparent 18px 36px); animation:nf-dash 1.9s linear infinite; }
@keyframes nf-dash{ to{ background-position:-36px 0; } }
/* gemächlicheres Tempo: 11s statt 6.5s */
.nf-bus{ position:absolute; bottom:40px; width:132px; height:50px; left:-150px; animation:nf-drive 11s linear infinite; }
@keyframes nf-drive{ 0%{ left:-150px; } 100%{ left:calc(100% + 40px); } }
.nf-body{ position:absolute; inset:0; background:linear-gradient(180deg,#11a7e8,#0177b8);
  border-radius:11px 13px 8px 8px; box-shadow:0 4px 10px rgba(1,75,124,.25); }
.nf-stripe{ position:absolute; left:0; right:0; top:28px; height:4px; background:var(--bdo-navy); opacity:.5; }
.nf-win{ position:absolute; top:7px; left:11px; width:14px; height:14px; background:#dff1fb; border-radius:3px;
  box-shadow:16px 0 0 #dff1fb, 32px 0 0 #dff1fb, 48px 0 0 #dff1fb; }
.nf-door{ position:absolute; top:7px; right:9px; width:15px; height:33px; background:#cfe9f8; border-radius:3px; }
.nf-light{ position:absolute; right:-2px; top:9px; width:6px; height:24px; background:#ffd23f; border-radius:3px; }
.nf-wheel{ position:absolute; bottom:-8px; width:18px; height:18px; background:#1b2733; border-radius:50%;
  border:3px solid #51606e; animation:nf-spin .8s linear infinite; }
.nf-wheel::after{ content:""; position:absolute; inset:5px; background:#9aa7b1; border-radius:50%; }
.nf-rear{ left:16px; } .nf-front{ right:16px; }
@keyframes nf-spin{ to{ transform:rotate(360deg); } }
.nf-title{ font-family:'Roboto Slab',Georgia,serif; font-weight:700; color:var(--bdo-navy); font-size:26px; margin:26px 0 6px; }
.nf-sub{ color:#5b6b77; font-size:15px; margin:0 0 24px; text-align:center; }
.nf-btn{ display:inline-flex; align-items:center; gap:8px; background:var(--bdo-blue); color:#fff;
  font-weight:700; font-size:15px; border-radius:10px; padding:12px 22px; text-decoration:none; transition:background .15s ease; }
.nf-btn:hover{ background:#0089c4; }
@media (prefers-reduced-motion: reduce){
  .nf-bus{ animation:none; left:50%; transform:translateX(-50%); }
  .nf-wheel, .nf-road::after{ animation:none; }
}
/* Login-Bus: steht links, Räder auf der Footer-Oberkante (bottom via JS = Footer-Höhe),
   Räder drehen, leichtes Motor-Idle-Schaukeln. width/height = 68% des 404-Busses. */
.login-bus{ position:absolute; bottom:6px; left:18px; width:90px; height:34px; z-index:1;
  transform-origin:bottom center;
  animation:login-bus-idle 2.8s ease-in-out infinite; }
@keyframes login-bus-idle{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-3px); }
}
.login-bus .nf-wheel{ width:13px; height:13px; border-width:2px; bottom:-6px;
  animation:nf-spin 1.4s linear infinite; }
.login-bus .nf-rear{ left:11px; } .login-bus .nf-front{ right:11px; }
.login-bus .nf-win{ width:10px; height:10px; box-shadow:11px 0 0 #dff1fb, 22px 0 0 #dff1fb, 33px 0 0 #dff1fb; }
@media (prefers-reduced-motion: reduce){
  .login-bus{ animation:none; }
  .login-bus .nf-wheel{ animation:none; }
}

/* KI-Bus: dritte Groessenstufe (116x44 = 88% des 404-Busses). Aufbau und Teile stammen
   unveraendert vom 404-Bus; wie bei .login-bus werden nur die Masse nachgezogen, weil die
   Teile in festen Pixeln gesetzt sind und nicht mitskalieren.
   Er steht — deshalb das Leerlauf-Schaukeln der Anmeldeseite, nicht die Fahrt der 404. */
.ki-bus{ position:relative; width:116px; height:44px; margin:0 auto 20px;
  transform-origin:bottom center; animation:login-bus-idle 2.8s ease-in-out infinite; }
.ki-bus .nf-stripe{ top:25px; }
.ki-bus .nf-win{ top:6px; left:10px; width:12px; height:12px;
  box-shadow:14px 0 0 #dff1fb, 28px 0 0 #dff1fb, 42px 0 0 #dff1fb; }
.ki-bus .nf-door{ top:6px; right:8px; width:13px; height:29px; }
.ki-bus .nf-light{ top:8px; width:5px; height:21px; }
.ki-bus .nf-wheel{ width:16px; height:16px; border-width:3px; bottom:-7px;
  animation:nf-spin 1.4s linear infinite; }
.ki-bus .nf-rear{ left:14px; } .ki-bus .nf-front{ right:14px; }
@media (prefers-reduced-motion: reduce){
  .ki-bus, .ki-bus .nf-wheel{ animation:none; }
}

/* ============== SETTINGS-FRAMEWORK (gruppierte Nav + Karten, BDO-Blau) ============== */
/* Nur der INHALT der Einstellungen ist auf 980 begrenzt (max-width an .set-layout
   statt am äußeren Wrapper) -> Einstellungen-Titel liegt auf gleicher linker Kante
   wie alle anderen Admin-Panels (.ua-wrap, 1180). */
/* Gerahmte Shell-Karte: Nav-Leiste (weiß) + Inhaltspanel (hell abgesetzt) in EINEM
   gebundenen Container — die Nav „schwebt" nicht mehr im leeren grauen Raum. */
/* FESTE Höhe (nur von der Fenstergröße abhängig, NICHT vom gewählten Abschnitt) ->
   die Karte ändert ihre Größe beim Menüwechsel nicht mehr, der Footer bleibt stehen.
   Hohe Abschnitte (z. B. KI-Suche) scrollen INTERN im Panel (s. .set-panel). */
/* ===== SaaS-Settings-Look (2026-06-28): horizontale Tabs + zweispaltige Reihen ===== */
.set-wrap{ position:relative; }
.set-pagehead{ max-width:1180px; margin:0 0 6px; }
.set-pagehead .ua-title{ margin-bottom:4px; }
.set-pagedesc{ color:#5b6b77; font-size:14.5px; margin:0 0 16px; }

/* Horizontale Tab-Leiste; aktiver Tab = BDO-blauer Unterstrich */
.set-tabs{ list-style:none; display:flex; flex-wrap:wrap; gap:2px; margin:0 0 4px; padding:0;
  border-bottom:1px solid var(--bdo-line); }
.set-tab{ display:inline-flex; align-items:center; gap:7px; padding:11px 14px; cursor:pointer;
  color:#5b6b77; font-size:14px; font-weight:600; border-bottom:2px solid transparent; margin-bottom:-1px; white-space:nowrap; }
.set-tab .material-icons{ font-size:18px; color:#9aa7b1; }
.set-tab:hover{ color:var(--bdo-navy); }
.set-tab.on{ color:var(--bdo-blue); border-bottom-color:var(--bdo-blue); }
.set-tab.on .material-icons{ color:var(--bdo-blue); }

.set-panel{ min-width:0; }
/* Zweispaltige Abschnitts-Reihe: links Label+Beschreibung, rechts Felder, Trennlinie oben.
   Jeder Abschnitt liegt in einem .set-secslot; die Reihen werden so über alle Abschnitte
   eines Tabs hinweg gleichmäßig durch Linien getrennt. Nur die ALLERERSTE Reihe ohne Linie. */
.set-srow{ display:flex; gap:48px; align-items:flex-start; padding:26px 0; border-top:1px solid var(--bdo-line); max-width:1180px; }
.set-panel > .set-secslot:first-child > .set-srow:first-child,
.set-panel > .set-srow:first-child{ border-top:none; }
.set-sleft{ flex:0 0 280px; max-width:280px; }
.set-sright{ flex:1 1 auto; min-width:0; max-width:680px; }
.set-title{ font-family:'Roboto Slab',Georgia,serif; color:var(--bdo-navy); margin:0 0 6px; font-size:18px; }
.set-desc{ color:#5b6b77; font-size:13.5px; line-height:1.55; margin:0; }

/* Mobiler Trigger (Dropdown statt Tab-Leiste), Muster wie die Admin-Navigation */
.set-mobtrigger{ display:none; }
.set-field{ display:block; margin:0 0 14px; }
.set-field:last-child{ margin-bottom:0; }
.set-flabel{ display:block; font-size:12px; color:#5b6b77; margin:0 0 4px; }
.set-input{ width:100%; box-sizing:border-box!important; border:1.5px solid var(--bdo-line)!important; border-radius:9px!important;
  padding:11px 13px!important; min-height:0!important; height:auto!important; line-height:1.4!important;
  /* MIT !important, wie alles andere in dieser Regel: Ohne es setzt Materialize das
     Eingabefeld auf 16px und das mehrzeilige Feld auf 12px — GEMESSEN, beide mit derselben
     Klasse. In „Hero-Text" standen Ueberschrift und Unterzeile dadurch in verschiedenen
     Schriftgroessen, obwohl es dieselbe Einstellung ist. */
  font-size:14.5px!important;
  background:#fff!important; margin:0!important; box-shadow:none!important; color:var(--bdo-dark); }
textarea.set-input{ resize:vertical; }
.set-input:focus{ border-color:var(--bdo-blue)!important; box-shadow:0 0 0 3px rgba(0,159,227,.15)!important; }
/* set-frow: Felder oben ausgerichtet; der Inline-Toggle wird per margin-top auf die
   Höhe des Eingabefeldes (unter dem Label) geschoben und dort mittig zentriert,
   sodass „Verschlüsselt" mittig zum Port-Input sitzt. */
.set-frow{ display:flex; gap:16px; align-items:flex-start; flex-wrap:wrap; }
.set-frow .set-field{ flex:1 1 120px; margin-bottom:14px; }
.set-field-inline{ display:flex; align-items:center; gap:10px; flex:0 0 auto; margin-bottom:14px; white-space:nowrap; }
.set-field-inline .set-flabel{ margin:0; }
/* Label-Höhe (~21px) als margin-top, Input-Höhe (~46px) als min-height -> vertikal mittig zum Input. */
.set-frow .set-field-inline{ margin-top:21px; min-height:46px; align-items:center; }
.set-save{ margin-top:6px; }
/* Tablet: Reihen stapeln (Label/Beschreibung über den Feldern) */
@media(max-width:860px){ .set-srow{ flex-direction:column; gap:14px; padding:20px 0; }
  .set-sleft, .set-sright{ flex:none; max-width:none; width:100%; } }
/* Handy: Tab-Leiste -> Dropdown (Trigger zeigt aktiven Abschnitt) */
@media(max-width:640px){
  .set-mobtrigger{ display:flex; align-items:center; gap:9px; width:100%; box-sizing:border-box;
    padding:11px 16px; margin:0 0 16px; border:1px solid var(--bdo-line); border-radius:10px; background:#fff;
    font:inherit; font-weight:700; font-size:15px; color:var(--bdo-navy); cursor:pointer; text-align:left; }
  .set-mobtrigger .set-mobicon{ color:var(--bdo-blue); font-size:20px; }
  .set-mobtrigger .set-mobcur{ flex:1; }
  .set-mobtrigger .set-mobcaret{ color:var(--bdo-blue); transition:transform .15s ease; }
  .set-wrap.mob-open .set-mobtrigger .set-mobcaret{ transform:rotate(180deg); }
  .set-tabs{ display:none; }
  .set-wrap.mob-open .set-tabs{ display:flex; flex-direction:column; flex-wrap:nowrap; gap:2px;
    border:1px solid var(--bdo-line); border-radius:12px; padding:6px; margin:-8px 0 16px; background:#fff;
    box-shadow:0 12px 28px rgba(20,40,70,.16); }
  .set-wrap.mob-open .set-tabs .set-tab{ width:100%; box-sizing:border-box; border-bottom:none; border-radius:8px;
    margin-bottom:0; padding:12px 14px; }
  .set-wrap.mob-open .set-tabs .set-tab.on{ background:var(--bdo-light); }
}

/* Wartungs-Banner (oben auf allen Seiten) */
.maint-banner{ display:flex; align-items:center; gap:10px; justify-content:center; background:#fff3cd;
  color:#7a5b00; border-bottom:1px solid #f0d98a; padding:9px 16px; font-size:14px; font-weight:500; }
.maint-banner .material-icons{ font-size:19px; }

/* Audit-Log (Settings-Abschnitt) — Tabelle darf volle Panel-Breite nutzen */
.set-panel > .aud-filter, .set-panel > .aud-table, .set-panel > .aud-pager{ max-width:none; }
.aud-filter{ display:flex; gap:10px; margin:0 0 12px; flex-wrap:wrap; }
.aud-sel{ width:auto!important; min-width:170px; }
.aud-search{ width:auto!important; flex:1; min-width:180px; max-width:320px; }
.aud-table{ width:100%; border-collapse:collapse; font-size:13.5px; }
.aud-table th{ text-align:left; color:#5b6b77; font-weight:600; font-size:12px; text-transform:uppercase; letter-spacing:.03em; padding:8px 10px; border-bottom:2px solid var(--bdo-line); }
.aud-table td{ padding:9px 10px; border-bottom:1px solid var(--bdo-line); color:var(--bdo-dark); vertical-align:top; }
.aud-ts{ white-space:nowrap; color:#5b6b77; }
.aud-empty{ text-align:center; color:#9aa7b1; padding:18px!important; }
.aud-cat{ display:inline-block; font-size:11px; font-weight:700; border-radius:999px; padding:2px 9px; }
.aud-content{ background:#e3f5ea; color:#1b8a4b; }
.aud-settings{ background:#e8f1fb; color:#0b6cab; }
.aud-account{ background:#fdf0d6; color:#9a6a00; }
.aud-file{ background:#efe7fb; color:#6b3fa0; }
.aud-pager{ display:flex; align-items:center; gap:10px; margin-top:14px; }
.aud-count{ color:#5b6b77; font-size:13px; margin-right:auto; }
.aud-pg[disabled]{ opacity:.5; pointer-events:none; }

/* KI-Auswertung (Content-Lücken) */
.aig-err{ background:#fdecea; border:1px solid #f3c1ba; color:#a33a2f; border-radius:9px; padding:9px 12px; font-size:13px; margin:0 0 12px; }
.aig-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin:4px 0 14px; flex-wrap:wrap; }
.aig-h-title{ display:inline-flex; align-items:center; gap:7px; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; color:#8aa0ad; }
.aig-h-title .material-icons{ font-size:17px; line-height:1; color:#f0a23a; }
.aig-seg{ display:inline-flex; gap:4px; background:#eef4f8; border:1px solid var(--bdo-line); border-radius:9px; padding:3px; }
.aig-segopt{ padding:4px 11px; border-radius:7px; color:#5b6b76; font-size:12.5px; font-weight:600; cursor:pointer; user-select:none; }
.aig-segopt.on{ background:#fff; color:var(--bdo-navy); box-shadow:0 1px 3px rgba(1,75,124,.14); }
.aig-layout{ display:flex; gap:18px; align-items:flex-start; }
.aig-main{ flex:2; min-width:0; }
.aig-side{ flex:1; min-width:210px; max-width:300px; }
.aig-gaps{ list-style:none; margin:0; padding:0; }
.aig-gap{ display:flex; align-items:center; gap:10px; background:#fff; border:1px solid var(--bdo-line); border-radius:9px; padding:10px 12px; margin-bottom:8px; }
.aig-q{ flex:1; min-width:0; font-size:14px; color:var(--bdo-dark); word-break:break-word; }
.aig-cnt{ font-size:12px; font-weight:700; color:var(--bdo-navy); background:var(--bdo-light); border:1px solid var(--bdo-mid); border-radius:10px; padding:2px 9px; white-space:nowrap; }
/* Pro-Frage-Abdeckung (0..100 %): gruen=hoch, amber=mittel, rot=niedrig */
.aig-cov{ flex:none; font-size:12px; font-weight:800; border-radius:10px; padding:3px 9px; white-space:nowrap; min-width:48px; text-align:center; }
.aig-cov-hi{ color:#1d7a3a; background:#e7f6ec; border:1px solid #a9dcb9; }
.aig-cov-mid{ color:#a86400; background:#fff4e6; border:1px solid #ffd9a8; }
.aig-cov-lo{ color:#b3261e; background:#fdeceb; border:1px solid #f3b9b5; }
.aig-done{ display:inline-flex; align-items:center; gap:5px; background:#fff; border:1px solid var(--bdo-line); color:var(--bdo-navy); border-radius:8px; padding:5px 11px; font-size:12.5px; font-weight:600; cursor:pointer; white-space:nowrap; }
.aig-done:hover{ background:var(--bdo-light); border-color:var(--bdo-mid); }
.aig-done .material-icons{ font-size:16px; line-height:1; color:#1b8a4b; }
.aig-empty{ text-align:center; color:#7c8a94; background:var(--bdo-bg); border:1px dashed var(--bdo-line); border-radius:10px; padding:26px 18px; font-size:14px; }
.aig-empty-sm{ color:#9aa7b1; font-size:12.5px; padding:6px 2px; }
.aig-stat{ background:#fff; border:1px solid var(--bdo-line); border-radius:11px; padding:11px 13px; margin-bottom:9px; }
.aig-stat.accent{ background:linear-gradient(135deg,var(--bdo-navy),var(--bdo-blue)); border:none; }
.aig-stat .aig-v{ font-size:23px; font-weight:800; color:var(--bdo-navy); line-height:1.1; }
.aig-stat .aig-l{ font-size:10.5px; color:#7a8a96; text-transform:uppercase; letter-spacing:.3px; margin-top:2px; }
.aig-stat.accent .aig-v, .aig-stat.accent .aig-l{ color:#fff; }
.aig-side-lbl{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; color:#8aa0ad; margin:14px 0 9px; }
/* #105 Stufe 2: Verlinkte Quellen */
.aig-views{ margin:0 0 18px; }
.aig-st{ min-width:118px; text-align:center; flex:none; }
.aig-st-ok{ color:#1b7a3d; background:#e8f6ec; border:1px solid #b9e2c6; }
.aig-st-err{ color:#b3261e; background:#fdeceb; border:1px solid #f3b9b5; }
.aig-st-warn{ color:#8a5a00; background:#fff4e0; border:1px solid #f3d9a4; }
.aig-st-grey{ color:#5b6b76; background:#eef1f4; border:1px solid #d6dde3; }
.aig-src{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.aig-src-t{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.aig-src-u{ font-size:12.5px; color:#7a8a96; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.aig-src-u a{ color:#7a8a96; } .aig-src-u a:hover{ color:var(--bdo-blue); }
.aig-src-u b, .aig-src-u a + b{ font-weight:500; color:var(--bdo-navy); }
.aig-src-why{ font-size:12.5px; color:#5b6b76; }
.aig-src-w{ font-size:13px; color:#5b6b76; white-space:nowrap; margin-left:auto; }
.aig-runinfo{ font-size:13.5px; line-height:1.6; color:var(--bdo-ink, #001928); margin-bottom:10px; }
.aig-run{ display:flex; align-items:center; gap:6px; font-size:13.5px; color:var(--bdo-navy); }
.aig-run .material-icons{ font-size:18px; }
.aig-runbtn{ display:inline-flex; align-items:center; gap:6px; margin-bottom:6px; }
.aig-rcpt{ width:100%; box-sizing:border-box; resize:vertical; min-height:58px; margin-bottom:8px; }
.aig-rcpt-out{ font-size:12.5px; color:#7a8a96; margin-bottom:6px; }
.aig-rcpt-out.ok{ color:#1b7a3d; } .aig-rcpt-out.err{ color:#b3261e; }
@media (max-width: 720px){ .aig-src-w{ display:none; } .aig-st{ min-width:0; } .aig-gap:has(.aig-src){ flex-wrap:wrap; } .aig-src{ order:3; flex:1 1 100%; } .aig-gap:has(.aig-src) .aig-done{ margin-left:auto; } }
.aig-bars{ display:flex; flex-direction:column; gap:7px; }
.aig-bar{ display:flex; align-items:center; gap:8px; font-size:12.5px; }
.aig-bar-nm{ width:88px; flex:none; color:var(--bdo-navy); font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.aig-bar-track{ flex:1; height:8px; background:#e3edf3; border-radius:4px; overflow:hidden; }
.aig-bar-fill{ display:block; height:100%; background:var(--bdo-blue); border-radius:4px; }
.aig-bar-n{ width:26px; flex:none; text-align:right; color:#5b7186; }
@media (max-width:780px){ .aig-layout{ flex-direction:column; } .aig-main, .aig-side{ max-width:none; width:100%; } }

/* Nutzungs-Auswertung (Admin-Tab "Nutzung") */
.usg-head-r{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.usg-toggle{ display:inline-flex; align-items:center; gap:7px; font-size:13px; color:var(--bdo-navy); cursor:pointer; user-select:none; }
.usg-toggle input{ width:16px; height:16px; accent-color:var(--bdo-blue); cursor:pointer; }
.usg-channels{ display:flex; gap:16px; flex-wrap:wrap; margin-bottom:18px; }
.usg-ch{ flex:1 1 320px; background:var(--bdo-bg); border:1px solid var(--bdo-line); border-radius:13px; padding:13px 14px; }
.usg-ch-h{ font-size:13px; font-weight:700; color:var(--bdo-navy); margin-bottom:10px; }
.usg-ch-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:9px; }
.usg-ch-grid .aig-stat{ margin-bottom:0; }
.usg-layout{ margin-top:6px; }
.usg-table{ width:100%; }
.usg-table th, .usg-table td{ text-align:left; }
.usg-table td:nth-child(3), .usg-table td:nth-child(4), .usg-table td:nth-child(5),
.usg-table th:nth-child(3), .usg-table th:nth-child(4), .usg-table th:nth-child(5){ text-align:right; }
@media (max-width:780px){ .usg-channels{ flex-direction:column; } }

/* Dateiverwaltung */
.fa-name{ font-weight:500; color:var(--bdo-dark); word-break:break-all; }
.fa-pub{ background:#e3f5ea; color:#1b8a4b; }
.fa-gated{ background:#e8f1fb; color:#0b6cab; }
.fa-orphan{ color:#9a6a00; font-weight:600; font-size:12.5px; }
.fa-ref{ color:var(--bdo-blue); font-weight:600; font-size:12.5px; cursor:pointer; text-decoration:underline; }
.fa-actions{ display:flex; gap:6px; justify-content:flex-end; white-space:nowrap; }
.fa-act{ font-size:12px!important; padding:0 12px!important; height:30px!important; line-height:30px!important; }
.fa-act[disabled]{ opacity:.45; pointer-events:none; }
/* „nur Verwaiste" als erkennbarer Toggle-Chip. Materialize versteckt die native Checkbox
   unzuverlässig (offsetWidth 0 trotz opacity-Override) -> native Box ganz ausblenden und einen
   eigenen CSS-Indikator (::before) zeigen, der an/aus via :has(input:checked) umschaltet. */
.fa-orphanchk{ display:inline-flex; align-items:center; gap:8px; font-size:13.5px; color:var(--bdo-navy); white-space:nowrap;
  border:1.5px solid var(--bdo-line); border-radius:9px; padding:0 14px; height:46px; background:#fff; cursor:pointer; user-select:none; }
.fa-orphanchk:hover{ border-color:var(--bdo-blue); }
.fa-orphanchk::before{ content:"check"; font-family:'Material Icons'; font-size:15px; line-height:1; flex:none;
  width:18px; height:18px; display:inline-flex; align-items:center; justify-content:center;
  border:1.5px solid var(--bdo-line); border-radius:5px; color:transparent; background:#fff; transition:all .12s ease; }
.fa-orphanchk:has(input:checked){ background:var(--bdo-light); border-color:var(--bdo-blue); }
.fa-orphanchk:has(input:checked)::before{ background:var(--bdo-blue); border-color:var(--bdo-blue); color:#fff; }
.fa-orphanchk input[type=checkbox]{ position:absolute!important; opacity:0!important; width:1px!important; height:1px!important;
  margin:0!important; pointer-events:none!important; }
.fa-usage{ margin:12px 0; padding:12px 14px; background:var(--bdo-bg); border:1px solid var(--bdo-line); border-radius:10px; font-size:13.5px; }
.fa-usage-h{ font-weight:600; color:var(--bdo-navy); margin-bottom:6px; }
.fa-usage ul{ margin:0; padding-left:18px; }
.fa-usage-dom{ color:#9aa7b1; }
.fa-usage-none{ color:#9aa7b1; }

/* Footer-Links-Editor */
/* Footer-Editor: breitere Bezeichnungs-/URL-Felder (sonst abgeschnitten) — Karten-
   Breite bleibt aber für ALLE Abschnitte gleich (kein Springen beim Menü-Wechsel). */
.ft-row{ display:flex; gap:10px; align-items:center; margin-bottom:10px; }
.ft-row .set-input{ min-width:0; }
.ft-row .ft-label{ flex:1 1 180px; }
/* URLs sind laenger als Bezeichnungen, also bekommen sie mehr vom verfuegbaren Platz. */
.ft-row .ft-url{ flex:3 1 300px; }
/* Laeuft der Wert trotzdem ueber, endet er mit „…" statt mitten im Zeichen abgeschnitten zu
   werden. Wirkt nur ausserhalb des Fokus — beim Bearbeiten scrollt das Feld wie gewohnt.
   Der volle Wert steht zusaetzlich im title (siehe admin-settings.js). */
.ft-row .set-input{ text-overflow:ellipsis; }
.ft-ext{ display:inline-flex; align-items:center; gap:5px; font-size:12.5px; color:#5b6b77; white-space:nowrap; }
/* Pfeil-/Lösch-Buttons als saubere, gleich große Icon-Quadrate */
.ft-mini{ width:40px; height:40px; padding:0!important; border-radius:9px!important; display:inline-flex!important;
  align-items:center; justify-content:center; flex:none; line-height:1!important; }
.ft-mini .material-icons{ font-size:19px; }
.ft-rm{ color:#c0392b!important; }
.ft-add{ margin:6px 0 16px; height:40px; }
.ft-add .material-icons{ font-size:18px; vertical-align:middle; }
@media(max-width:600px){ .ft-row{ flex-wrap:wrap; } }

/* Floating-Toast (Einstellungen speichern/Fehler) — schwebt unten rechts, auffällig,
   blendet automatisch aus. Ersetzt den alten breiten Inline-Balken (.ua-msg). */
.set-toast{ position:fixed; right:24px; bottom:24px; z-index:1200; max-width:400px;
  display:flex; align-items:center; gap:10px; padding:14px 18px 14px 16px; border-radius:12px;
  color:#fff; font-size:14px; font-weight:600; line-height:1.35; box-shadow:0 14px 36px rgba(1,58,94,.28);
  transform:translateY(18px); opacity:0; pointer-events:none;
  transition:transform .25s ease, opacity .25s ease; }
.set-toast.show{ transform:translateY(0); opacity:1; }
.set-toast::before{ font-family:'Material Icons'; font-weight:normal; font-size:21px; flex:none; }
.set-toast-ok{ background:linear-gradient(135deg,#22a35e,#178049); }
.set-toast-ok::before{ content:'check_circle'; }
.set-toast-err{ background:linear-gradient(135deg,#e0453f,#c0322d); }
.set-toast-err::before{ content:'error'; }
.set-toast-info{ background:linear-gradient(135deg,var(--bdo-blue),var(--bdo-navy)); }
.set-toast-info::before{ content:'info'; }
@media(max-width:600px){ .set-toast{ left:16px; right:16px; bottom:16px; max-width:none; } }

/* ===== Icon-Picker (grafische Auswahl statt Icon-Name) ===== */
.ip-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(46px, 1fr)); gap:8px; margin:4px 0 16px; }
.ip-cell{ aspect-ratio:1; display:flex; align-items:center; justify-content:center; border:1.5px solid var(--bdo-line);
  border-radius:10px; cursor:pointer; color:var(--bdo-navy); background:#fff; transition:border-color .12s, background .12s; }
.ip-cell .material-icons{ font-size:23px; }
.ip-cell:hover{ border-color:var(--bdo-blue); background:var(--bdo-light); }
.ip-cell.on{ border-color:var(--bdo-blue); background:var(--bdo-blue); color:#fff; }
.ip-cell:focus, .ip-cell:active{ background-color:#fff; } /* Materialize-Tuerkis off */
.ip-cell.on:focus, .ip-cell.on:active{ background-color:var(--bdo-blue); }

/* Bereiche verwalten (dynamische Domänen) */
.dm-row{ display:flex; align-items:center; gap:12px; padding:12px 0; border-bottom:1px solid var(--bdo-line); flex-wrap:wrap; }
.dm-ic{ color:var(--bdo-blue); }
.dm-info{ flex:1; min-width:0; }
.dm-name{ font-weight:600; color:var(--bdo-dark); font-size:15px; }
.dm-key{ font-size:12px; color:#9aa7b1; }
.dm-empty{ color:#9aa7b1; padding:8px 0; }
/* Edit-/Lösch-Icon-Buttons je Zeile (gleiche Optik wie ft-mini) */
.dm-mini{ width:40px; height:40px; border-radius:9px; border:1px solid var(--bdo-line); background:#fff; color:var(--bdo-navy);
  display:inline-flex; align-items:center; justify-content:center; cursor:pointer; flex:none; }
.dm-mini:hover{ border-color:var(--bdo-blue); color:var(--bdo-blue); }
.dm-mini .material-icons{ font-size:19px; }
.dm-danger{ color:#c0392b; }
.dm-danger:hover{ border-color:#c0392b; color:#c0392b; background:#fde9e9; }
.dm-editor{ flex:1 1 100%; background:var(--bdo-bg); border-radius:10px; padding:14px 16px; margin:4px 0 6px; }
.dm-edfoot{ display:flex; gap:10px; margin-top:6px; }
.dm-new{ margin-top:18px; padding-top:16px; border-top:1px solid var(--bdo-line); }
.dm-new .set-field{ margin-bottom:10px; }
/* Vereinte Bereiche-Liste: Zwischenüberschriften + gesperrte (Länder-)Zeile */
.set-sublabel{ font-size:12px; text-transform:uppercase; letter-spacing:.5px; color:#90a0ad; font-weight:700; margin:0 0 8px; }
.mail-seg{ max-width:360px; margin:6px 0 18px; }
.mail-test .ua-vadd{ margin-top:8px; }
.dm-mini.dm-spacer{ visibility:hidden; border:0; background:none; }
.dm-locked .dm-name{ color:#5b6b77; }

/* KI-Assistent (RAG) — Cockpit-Erstzustand -> Chat-Verlauf, Quellen-Kacheln */
.ki-wrap{ max-width:820px; margin-top:8px; margin-bottom:48px; }
.ki-app{ display:flex; flex-direction:column; }
.ki-hero{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:18px; }
.ki-app.is-chat .ki-hero{ margin-bottom:12px; }
.ki-new{ flex:none; display:inline-flex; align-items:center; gap:6px; background:#fff; border:1px solid var(--bdo-line);
  color:var(--bdo-navy); border-radius:9px; padding:7px 12px; font-size:13px; font-weight:600; cursor:pointer; transition:border-color .12s, color .12s; }
.ki-new:hover{ border-color:var(--bdo-blue); color:var(--bdo-blue); }
.ki-new:focus{ background:#fff!important; }
.ki-new .material-icons{ font-size:17px; }
/* „Neuer Chat" nur im Gespräch zeigen (im leeren Erstzustand sinnlos) */
/* Blau-Shimmer-Animationen (nur Blautöne — navy -> blau -> hellblau) */
@keyframes ki-shimmer{ to{ background-position:200% center; } }
@keyframes ki-glow{ 0%,100%{ box-shadow:0 2px 10px rgba(0,159,227,.25); } 50%{ box-shadow:0 0 18px 3px rgba(0,159,227,.45); } }
.ki-title{ font-size:26px; font-weight:800; margin:0 0 6px; padding-top:5px;
  background:linear-gradient(90deg,var(--bdo-navy),var(--bdo-blue),#7fd3f5,var(--bdo-blue),var(--bdo-navy));
  background-size:200% auto; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
  animation:ki-shimmer 5s linear infinite; }
.ki-lead{ color:var(--bdo-dark); margin:0; }

/* Erstzustand: Cockpit sichtbar, Verlauf aus. Chat-Zustand: umgekehrt. */
.ki-thread{ display:none; }
.ki-app.is-chat .ki-thread{ display:block; max-height:calc(100vh - 320px); min-height:200px; overflow-y:auto; padding:4px 2px; }
.ki-app.is-chat .ki-cockpit{ display:none; }

.ki-cockpit{ margin-bottom:16px; }
.ki-section-label{ color:#8aa0ad; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; margin:14px 2px 8px; }
.ki-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.ki-chip{ background:#fff; border:1px solid var(--bdo-line); border-radius:16px; padding:7px 13px; font-size:13.5px;
  color:#33586e; cursor:pointer; transition:border-color .12s, background .12s; }
.ki-chip:hover{ border-color:var(--bdo-blue); background:var(--bdo-bg); }
.ki-topic{ background:#eaf3f9; border:1px solid #cfe3f0; border-radius:9px; padding:8px 13px; font-size:13.5px;
  color:var(--bdo-navy); font-weight:600; cursor:pointer; transition:border-color .12s;
  display:inline-flex; align-items:center; gap:6px; }
.ki-topic:hover{ border-color:var(--bdo-blue); }
/* Symbol statt des frueheren Text-Pfeils (#60): auf einen Blick erkennbar, wofuer das Thema
   steht — und es kostet weniger Breite als das angehaengte "›". */
.ki-topic .material-icons{ font-size:17px; line-height:1; color:var(--bdo-blue); flex:none; }

/* Chat-Blasen */
.ki-msg{ margin:0 0 12px; max-width:88%; }
.ki-msg-user{ margin-left:auto; background:var(--bdo-navy); color:#fff; border-radius:14px 14px 4px 14px;
  padding:9px 13px; font-size:14.5px; line-height:1.45; white-space:pre-wrap; word-wrap:break-word; }
.ki-msg-ai{ margin-right:auto; border:2px solid transparent; border-radius:4px 14px 14px 14px; padding:13px 15px;
  background:linear-gradient(#fff,#fff) padding-box,
    linear-gradient(120deg,var(--bdo-navy),var(--bdo-blue),#96d7f3) border-box;
  box-shadow:0 2px 12px rgba(0,159,227,.10); }

/* Lade-Indikator "Route/Haltestellen": Punkte fahren entlang einer Linie zum Ziel-Pin
   (Reise-Metapher, passend zum Omnibus-Kontext) + schimmernder Text. Nur Blautöne. */
@keyframes ki-hop{ 0%,80%,100%{ transform:scale(.7); opacity:.4; } 40%{ transform:scale(1.15); opacity:1; } }
.ki-loading{ display:inline-flex; align-items:center; gap:10px; }
.ki-route{ display:inline-flex; align-items:center; }
.ki-route .ki-dot{ width:11px; height:11px; border-radius:50%; background:var(--bdo-blue); animation:ki-hop 1.3s ease-in-out infinite; }
.ki-route .ki-dot:nth-child(3){ animation-delay:.2s; }
.ki-route .ki-dot:nth-child(5){ animation-delay:.4s; }
.ki-route .ki-line{ width:14px; height:3px; background:#bcd9ea; }
.ki-pin{ color:var(--bdo-navy); font-size:20px; margin-left:2px; }
.ki-loading-txt{ font-weight:700;
  background:linear-gradient(90deg,var(--bdo-navy),#9bd9f5,var(--bdo-blue),var(--bdo-navy));
  background-size:200% auto; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
  animation:ki-shimmer 1.6s linear infinite; }
.ki-text{ color:var(--bdo-dark); line-height:1.6; }
.ki-text strong{ color:var(--bdo-navy); font-weight:700; }
.ki-ul{ margin:8px 0; padding-left:22px; list-style:disc; }
.ki-ul li{ margin:2px 0; }
.ki-err{ color:#c0392b; font-weight:600; }

/* Quellen als Kacheln */
.ki-srctitle{ margin-top:14px; padding-top:11px; border-top:1px solid var(--bdo-line);
  color:var(--bdo-navy); font-weight:700; font-size:12px; text-transform:uppercase; letter-spacing:.5px; margin-bottom:8px; }
.ki-src{ display:flex; flex-wrap:wrap; gap:8px; }
.ki-srctile{ display:flex; align-items:flex-start; gap:8px; flex:1 1 220px; max-width:100%;
  background:var(--bdo-bg); border:1px solid var(--bdo-line); border-radius:9px; padding:8px 10px;
  text-decoration:none!important; transition:border-color .12s, box-shadow .12s; }
.ki-srctile:hover{ border-color:var(--bdo-blue); box-shadow:0 4px 12px rgba(1,75,124,.08); }
.ki-srcnum{ flex:none; width:20px; height:20px; border-radius:50%; background:var(--bdo-blue); color:#fff;
  font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.ki-srcttl{ color:var(--bdo-navy)!important; font-weight:600; font-size:13px; line-height:1.35; }
.ki-sec{ display:block; color:#5b7186; font-weight:400; font-size:12px; }

/* Eingabe-Leiste (klebt unten beim Scrollen des Verlaufs) */
.ki-bar{ display:flex; align-items:center; gap:8px; background:#fff; border:1px solid var(--bdo-line);
  border-radius:24px; padding:6px 6px 6px 16px; box-shadow:0 4px 16px rgba(1,75,124,.07);
  position:sticky; bottom:16px; margin-top:8px; transition:border-color .12s, box-shadow .12s; }
.ki-bar:focus-within{ border-color:var(--bdo-blue); box-shadow:0 4px 18px rgba(0,159,227,.20); }
.ki-bar textarea#kiQ{ flex:1; box-sizing:border-box; resize:none; max-height:140px; margin:0; border:none!important;
  background:transparent; padding:8px 0; font-size:15px; color:var(--bdo-dark); box-shadow:none!important; outline:none; }
.ki-bar textarea#kiQ:focus{ border:none!important; box-shadow:none!important; outline:none; }
.ki-send{ flex:none; width:40px; height:40px; border:none; border-radius:50%; color:#fff;
  background:linear-gradient(135deg,var(--bdo-navy),var(--bdo-blue))!important;
  display:inline-flex; align-items:center; justify-content:center; cursor:pointer;
  animation:ki-glow 2.6s ease-in-out infinite; transition:filter .12s; }
.ki-send:hover{ filter:brightness(1.1); }
/* Materialize faerbt button:focus gruen — explizit mit dem Blau-Verlauf ueberschreiben */
.ki-send:focus{ background:linear-gradient(135deg,var(--bdo-navy),var(--bdo-blue))!important; }
.ki-send:disabled{ opacity:.5; cursor:default; }
.ki-send .material-icons{ font-size:22px; }
.ki-notice{ display:flex; gap:11px; align-items:flex-start; margin:14px 0 0;
  padding:13px 16px; background:var(--bdo-light); border:1px solid var(--bdo-line);
  border-radius:11px; }
.ki-notice-ic{ color:var(--bdo-blue); font-size:19px; flex:none; margin-top:1px; }
.ki-notice-body{ min-width:0; }
.ki-notice-line{ color:#41525e; font-size:12.8px; line-height:1.5; margin:0;
  hyphens:manual; -webkit-hyphens:manual; overflow-wrap:break-word; text-wrap:pretty; }
.ki-notice-sep{ margin-top:6px; padding-top:6px; border-top:1px solid #cfe4f0; }

/* Ohne Tab-Leiste sitzen die unteren sticky-Elemente wieder direkt am Rand — nur der
   Sicherheitsabstand des Geraets (Home-Indikator) bleibt noetig. */
@media(max-width:640px){
  .ll-selbar{ bottom: calc(8px + env(safe-area-inset-bottom)); }
  .ki-bar{ bottom: calc(8px + env(safe-area-inset-bottom)); }
}

/* Quellen-Stil C: End-Tag-Pill mit Quellenname direkt an der Aussage */
.ki-cite{ display:inline-flex; align-items:center; gap:4px; margin-left:6px; padding:1px 8px; border-radius:11px;
  background:var(--bdo-bg); border:1px solid var(--bdo-line); font-size:11px; font-weight:600; color:var(--bdo-navy)!important;
  text-decoration:none!important; vertical-align:middle; max-width:220px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.ki-cite:hover{ border-color:var(--bdo-blue); }
.ki-cite .material-icons{ font-size:12px; color:var(--bdo-blue); flex:none; }

/* Routen-Modus: Timeline (Stationen in Durchreise-Reihenfolge) */
.ki-intro{ margin-bottom:18px; }
.ki-tl{ position:relative; padding-left:30px; --rail:11px; }
.ki-tl::before{ content:""; position:absolute; left:var(--rail); transform:translateX(-50%);
  top:9px; bottom:26px; width:3px; background:linear-gradient(180deg,var(--bdo-blue),#bcd9ea); border-radius:2px; }
.ki-stop{ position:relative; margin-bottom:26px; }
.ki-stop:last-child{ margin-bottom:6px; }
.ki-stop::before{ content:""; position:absolute; left:calc(var(--rail) - 30px); transform:translateX(-50%);
  top:3px; width:15px; height:15px; border-radius:50%; background:var(--bdo-blue); border:2px solid #fff; box-shadow:0 0 0 2px var(--bdo-blue); }
.ki-stop.dest::before{ background:var(--bdo-navy); box-shadow:0 0 0 2px var(--bdo-navy); }
.ki-stop.gap::before{ background:#f0a23a; box-shadow:0 0 0 2px #f0a23a; }
.ki-stopname{ font-weight:700; color:var(--bdo-navy); font-size:15px; display:flex; align-items:center; gap:9px; margin-bottom:6px; }
.ki-badge{ font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; padding:2px 8px; border-radius:9px; }
.ki-b-transit{ background:#eaf3f9; color:var(--bdo-navy); border:1px solid #cfe3f0; }
.ki-b-dest{ background:linear-gradient(135deg,var(--bdo-navy),var(--bdo-blue)); color:#fff; }
.ki-b-gap{ background:#fff4e6; color:#a86400; border:1px solid #ffd9a8; }
.ki-gaptext{ font-size:13px; color:#a86400; font-style:italic; }

/* ===== Startseite: KI-Hero (Blau-Shimmer, konsistent zur KI-Seite) ===== */
.start-hero{ position:relative; overflow:hidden; border-radius:14px; margin:18px 0 16px;
  padding:34px 24px 30px; color:#fff;
  background:linear-gradient(120deg,var(--bdo-navy) 0%,#0078b4 45%,var(--bdo-blue) 100%); }
.start-hero::after{ content:''; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(600px 200px at 80% -10%, rgba(150,215,243,.45), transparent 70%); }
.start-hero-inner{ position:relative; z-index:1; max-width:720px; margin:0 auto; text-align:center; }
.start-hero-eyebrow{ font-size:12px; letter-spacing:1.5px; text-transform:uppercase; opacity:.85; }
.start-hero-title{ font-family:'Roboto Slab',serif; font-size:30px; line-height:1.15; margin:8px 0 6px; color:#fff; }
.start-hero-sub{ font-size:15px; opacity:.92; margin:0 0 18px; }
.start-hero-field{ display:flex; align-items:center; gap:10px; background:#fff; border-radius:30px;
  padding:8px 8px 8px 20px; box-shadow:0 8px 28px rgba(0,0,0,.18); }
.start-hero-field input{ flex:1; border:0; outline:0; background:transparent; font-size:15px; color:#2a3942; height:36px; }
.start-hero-go{ border:0; cursor:pointer; color:#fff; font-weight:600; font-size:14px; border-radius:22px;
  padding:10px 22px; background:linear-gradient(120deg,var(--bdo-blue),var(--bdo-navy));
  box-shadow:0 0 14px rgba(0,159,227,.7); }
.start-hero-go:hover{ filter:brightness(1.05); }
.start-hero-ex{ margin-top:14px; display:flex; gap:8px; flex-wrap:wrap; justify-content:center; }
.start-hero-chip{ cursor:pointer; color:#fff; font-size:13px; border-radius:18px; padding:6px 13px;
  background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.28); }
.start-hero-chip:hover{ background:rgba(255,255,255,.28); }

/* ===== Startseite: Zwei-Spalten unter dem Hero ===== */
.start-grid{ display:flex; gap:16px; align-items:flex-start; }
.start-grid .start-feed{ flex:1.7; }
.start-grid .start-verb{ flex:1; }
.start-sec-title{ font-family:'Roboto Slab',serif; font-size:16px; color:var(--bdo-navy);
  display:flex; align-items:center; gap:8px; margin:0 0 12px; }
.start-sec-title .material-icons{ color:var(--bdo-blue); }
@media (max-width:900px){
  .start-grid{ flex-direction:column; }
  .start-hero-title{ font-size:24px; }
}
.set-sub{ font-family:'Roboto Slab',serif; font-size:14px; color:var(--bdo-navy); margin:18px 0 8px; }
.set-sub:first-child{ margin-top:0; }

/* ===== Startseite Hero/Layout-Politur (2026-06-26) ===== */
/* Mehr Fensterbreite nutzen (schlaegt #startcontainer.container{...!important} weiter oben). */
/* margin:auto erzwingen: mini.css setzt am Handy `.container{margin:5px}` (feste Raender) —
   zusammen mit der hier ueberschriebenen Breite saesse der Container links statt mittig
   (gesamter Rest-Platz rechts -> „nach links gerutscht"). Auto zentriert auf allen Breiten. */
#startcontainer.container{ width:min(1680px,94vw)!important; max-width:none!important; margin-left:auto!important; margin-right:auto!important; }

/* Gestapeltes Layout: KI-Hero -> Letzte Aenderungen -> Landesverbaende (volle Breite). */
.start-grid{ display:block; }
/* Hero bleibt voll breit; Feed + Verbaende schmaler + zentriert (ca. 9 Verbaende/Reihe). */
.start-feed, .start-verb{ width:auto; max-width:1200px; margin:0 auto 16px; }

/* Titel WEISS (gegen `#startcontainer h1{color:var(--bdo-navy)!important}` weiter oben). */
#startcontainer .start-hero-title, .start-hero-title{ color:#fff!important; }

/* Eyebrow: weisses bdo-Logo + Sparkle, sauber zentriert. KI-ASSISTENT in Logo-Groesse. */
.start-hero-eyebrow{ display:inline-flex; align-items:center; gap:10px; justify-content:center;
  font-size:24px; line-height:1; letter-spacing:1px; opacity:1; }
/* bdo-infopool.svg ist blau -> per Filter komplett weiss faerben (auf blauem Hero). */
.start-hero-logo{ height:40px; width:auto; vertical-align:middle; filter:brightness(0) invert(1); }
.start-hero-eyebrow .material-icons{ font-size:26px; }
.start-hero-dot{ opacity:.6; }

/* Eingabefeld: Materialize-Unterstrich killen + KI-Sparkle als Leitsymbol im Feld. */
.start-hero-field input{ border:none!important; box-shadow:none!important; background:transparent; margin:0!important; height:auto; }
.start-hero-ficon{ color:var(--bdo-blue); font-size:24px; flex:0 0 auto; }
.start-hero-go{ display:inline-flex; align-items:center; gap:6px; }
.start-hero-go .material-icons{ font-size:18px; }

/* ===== Admin: Startseite-Panel Sub-Tabs + Verbands-Logo-Thumbnail ===== */
.st-tabs{ display:flex; gap:4px; border-bottom:1px solid var(--bdo-line); margin-bottom:16px; }
.st-tab{ background:none; border:0; padding:9px 16px; cursor:pointer; font-size:13px; color:#5b6b76;
  border-bottom:2px solid transparent; }
.st-tab:hover{ color:var(--bdo-navy); }
.st-tab.active{ color:var(--bdo-navy); border-bottom-color:var(--bdo-blue); font-weight:600; }
.st-vb-row{ align-items:center; }
.st-vb-thumb{ width:46px; height:32px; object-fit:contain; background:#fff;
  border:1px solid var(--bdo-line); border-radius:5px; flex:0 0 auto; padding:2px; }
.st-vb-row .st-vb-file{ max-width:230px; }
.st-vb-uplabel{ cursor:pointer; display:inline-flex; align-items:center; }

/* ===== Admin Accounts: Nutzungs-Statistik-Kacheln ===== */
.ua-stats{ display:flex; flex-wrap:wrap; gap:18px 32px; margin:6px 0 18px; }
.ua-statgrp{ flex:1 1 480px; min-width:320px; }
.ua-statgrp-t{ font-size:12px; font-weight:600; letter-spacing:.4px; text-transform:uppercase;
  color:#5b6b76; margin:0 2px 8px; }
.ua-statrow{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.ua-stat{ background:#fff; border:1px solid var(--bdo-line); border-radius:12px; padding:12px 10px;
  text-align:center; position:relative; }
.ua-stat .material-icons{ color:var(--bdo-blue); font-size:20px; }
.ua-stat-v{ font-family:'Roboto Slab',serif; font-size:26px; font-weight:700; color:var(--bdo-navy); line-height:1.1; margin-top:2px; }
.ua-stat-l{ font-size:11px; color:#7a8a96; margin-top:2px; }
@media (max-width:560px){ .ua-statrow{ grid-template-columns:repeat(2,1fr); } }

/* --- E-Mail-Vorlagen (Admin -> Einstellungen -> Zugang & Mail) --- */
.mt-seg { flex-wrap: wrap; margin-bottom: 14px; }
.mt-dot { color: #009fe3; font-size: 11px; vertical-align: 2px; }
.mt-body { font-family: Consolas, Menlo, monospace; font-size: 13px; line-height: 1.5; resize: vertical; }
.mt-ph {
  font-family: Consolas, Menlo, monospace; font-size: 12px;
  background: #eef3f7; color: #014b7c; padding: 1px 6px; border-radius: 4px; margin-right: 4px;
}
.mt-preview { margin-top: 16px; border: 1px solid #dde5ea; border-radius: 10px; overflow: hidden; }
.mt-prev-sub { padding: 10px 14px; background: #f5f8fa; border-bottom: 1px solid #dde5ea; font-size: 14px; }
/* Die Mail bringt eigene Styles mit -> im iframe rendern, sonst faerben sie die
   Admin-Oberflaeche mit ein. */
.mt-prev-frame { display: block; width: 100%; height: 460px; border: 0; background: #fff; }

/* --- Kennzeichnung geschuetzter Einstellungen (Superadmin) --- */
.set-superbadge {
  display: inline-flex; align-items: center; gap: 5px;
  margin: 18px 0 -6px 0; padding: 3px 10px 3px 7px;
  background: #eef3f7; color: #014b7c; border-radius: 20px;
  font-size: 12px; font-weight: 600; letter-spacing: .2px;
}
.set-superbadge .material-icons { font-size: 15px; }
.set-superhint { margin-bottom: 18px; }

/* --- Einstellungen: Suche ueber alle Kategorien (#49) --- */
.set-suche{ position:relative; max-width:400px; margin:0 0 16px; }
/* !important, weil Materialize `input` mit hoeherer Spezifitaet setzt: Ohne das blieb der
   Innenabstand bei 13px und die Lupe lag MITTEN IM Platzhaltertext („Einstellung suchen").
   Dieselbe Falle wie bei den Auswahlfeldern (browser-default) und den Kaestchen. */
.set-suche input.set-input{ width:100%; box-sizing:border-box; padding-left:42px!important; }
.set-suchicon{ position:absolute; left:12px; top:11px; color:#8aa0ad; font-size:20px; }
.set-suchliste{ position:absolute; left:0; right:0; top:46px; z-index:6; background:#fff;
  border:1px solid #dde5ea; border-radius:10px; overflow:hidden;
  box-shadow:0 8px 24px rgba(1,75,124,.14); }
.set-suchtreffer{ display:flex; align-items:baseline; gap:8px; width:100%; text-align:left;
  border:0; border-top:1px solid #eef2f5; background:#fff; padding:11px 14px; cursor:pointer;
  font:inherit; font-size:14px; color:var(--bdo-navy); }
.set-suchtreffer:first-child{ border-top:0; }
.set-suchtreffer:hover{ background:#eaf3f9; }
.set-suchtreffer span{ color:#8aa0ad; font-size:12.5px; }
.set-suchleer{ padding:11px 14px; color:#8aa0ad; font-size:13.5px; }

/* --- Einstellungen: Rueckmeldung des automatischen Speicherns (#49) --- */
/* Steht am Abschnitt, nicht am einzelnen Feld: Bei 87 Feldern waere ein Hinweis je Feld
   Laerm. Der Erfolg blendet sich nach kurzer Zeit aus, der Fehler bleibt stehen. */
.set-stand{ display:flex; align-items:center; gap:6px; min-height:20px; margin-top:10px;
  font-size:12.5px; color:transparent; transition:color .15s; }
.set-stand .material-icons{ font-size:16px; }
.set-stand-lauf{ color:#8aa0ad; }
.set-stand-ok{ color:#2e9e5b; }
.set-stand-err{ color:#8a2f2f; font-weight:600; }

/* Blocksatz in einer 230px-Spalte reisst bei deutschen Wortlaengen Loecher in den Text —
   sichtbar bei „Titel im Browser-Tab. Unterseiten erscheinen als …". */
.set-sleft .set-desc, .set-sleft p{ text-align:left; }

/* Feldbreite nach Inhalt statt einheitlich 680px: Ein Seitentitel mit zwoelf Zeichen
   brauchte dieselbe Breite wie ein Satz mit 106 — und der wurde trotzdem abgeschnitten. */
.set-input.set-kurz{ max-width:340px; }
textarea.set-input{ width:100%; min-height:70px; padding:10px 14px; resize:vertical;
  font:inherit; line-height:1.45; }

/* Kennzeichen an Abschnitten, die nur die technische Betreuung sieht. Es erscheint
   ausschliesslich dort, wo der Abschnitt ueberhaupt gerendert wird — also nur beim
   Superadmin. Normale Admins sehen den Abschnitt gar nicht, also auch kein Kennzeichen. */
.set-superbadge{ display:inline-flex; align-items:center; gap:5px; margin-left:10px;
  padding:2px 9px; border-radius:11px; background:#fff4e0; border:1px solid #f0d8ac;
  color:#8a6416; font-size:11px; font-weight:700; letter-spacing:.03em;
  text-transform:uppercase; vertical-align:3px; }
.set-superbadge .material-icons{ font-size:13px; }

/* --- Vorher/Nachher eines Artikels (Audit-Log) --- */
.aud-objbtn {
  border: 0; background: none; padding: 0; font: inherit; color: var(--bdo-blue);
  text-align: left; cursor: pointer; text-decoration: underline; text-underline-offset: 2px;
}
.aud-objbtn:hover { color: #014b7c; }
/* Der Eintrag, dessen Vergleich gerade rechts steht. */
.aud-objbtn.on { color: #014b7c; font-weight: 600; text-decoration-thickness: 2px; }
.aud-diff { margin: 18px 0; border: 1px solid #dde5ea; border-radius: 10px; overflow: hidden; background: #fff; }

/* Tabelle links, Vergleich rechts (#55). Unterhalb der Tabelle war er bei langen Listen
   ausserhalb des Sichtbereichs: die Seite verschob sich leicht, aber nicht erkennbar
   genug, um zu verstehen, dass der Klick etwas bewirkt hat. */
.aud-split { display: flex; gap: 18px; align-items: flex-start; }
/* min-width:0 ist der Punkt, an dem es sonst kippt: ein Flex-Kind schrumpft per Vorgabe
   nicht unter seine Inhaltsbreite, und die Tabelle waere breit genug, den Vergleich
   herauszudruecken. */
.aud-main { flex: 1 1 auto; min-width: 0; }
.aud-split > .aud-diff {
  flex: 0 0 clamp(320px, 34%, 520px); margin: 0;
  position: sticky; top: 12px; max-height: calc(100vh - 140px); overflow: auto;
}
/* Schmale Schirme: wieder gestapelt — nebeneinander bliebe fuer beides zu wenig Breite.
   Der Umbruchpunkt steht auch in admin-audit.js (gestapelt()); dort entscheidet er,
   ob nach dem Klick zum Vergleich gescrollt wird. */
@media(max-width:992px) {
  .aud-split { display: block; }
  .aud-split > .aud-diff { position: static; max-height: none; margin: 18px 0; }
}
.aud-diff-head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 14px; background: #f5f8fa; border-bottom: 1px solid #dde5ea;
}
.aud-diff-x { padding: 4px 12px; }
.aud-revlist { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px 14px; border-bottom: 1px solid #eef2f5; }
.aud-rev {
  border: 1px solid #dde5ea; background: #fff; border-radius: 20px; padding: 4px 12px;
  font-size: 12.5px; cursor: pointer; color: #33454f;
}
.aud-rev.on { background: var(--bdo-blue); border-color: var(--bdo-blue); color: #fff; }
.aud-rev.on em { color: #e6f4fb; }
.aud-diff-meta { margin: 12px 14px; }
.aud-diff-pane { padding: 14px; max-height: 460px; overflow: auto; line-height: 1.6; }
/* Ein- und Ausgefuegtes zusaetzlich ueber Form kennzeichnen, nicht nur ueber Farbe —
   sonst ist der Vergleich fuer farbfehlsichtige Nutzer wertlos. */
.aud-diff-words ins { background: #d9f2e0; text-decoration: none; border-bottom: 2px solid #2e9e5b; }
.aud-diff-words del { background: #fbe0e0; text-decoration: line-through; color: #8a2f2f; }
.aud-diff-words { white-space: pre-wrap; font-size: 14.5px; }

/* --- Admin: Bereiche bis zur Tab-Initialisierung ausblenden ---
   Alle Admin-Bereiche liegen gleichzeitig im Markup. Ohne diese Regel malt der Browser
   sie ALLE uebereinander, bis admin-subnav.js den aktiven per Inline-Style sichtbar macht —
   ein bis zwei Sekunden lang sah die Oberflaeche dadurch kaputt aus.
   Der aktive Bereich gewinnt, weil ein Inline-Style diese Regel schlaegt. Welcher das ist,
   entscheidet der gemerkte Tab aus dem Browserspeicher — deshalb laesst sich hier keiner
   fest vorwaehlen, ohne dass kurz der falsche aufblitzt. */
.admin-pane { display: none; }

/* --- Spracheingabe + Vorlesen (KI-Assistent) --- */
.ki-mic {
  flex: 0 0 auto; width: 44px; height: 44px; border: 0; border-radius: 50%;
  background: #eef3f7; color: #014b7c; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background .15s, color .15s;
}
.ki-mic:hover { background: #dce8f0; }
.ki-mic .material-icons { font-size: 22px; }
/* Aufnahme laeuft: deutlich sichtbar, zusaetzlich pulsierend — auf einem Handy im
   Sonnenlicht ist Farbe allein zu wenig. */
.ki-mic.rec { background: #c8102e; color: #fff; animation: ki-mic-puls 1.2s ease-in-out infinite; }
.ki-mic.busy { background: #dce8f0; color: #6b7f8c; cursor: default; }
@keyframes ki-mic-puls {
  0%, 100% { box-shadow: 0 0 0 0 rgba(200, 16, 46, .45); }
  50%      { box-shadow: 0 0 0 8px rgba(200, 16, 46, 0); }
}
@media (prefers-reduced-motion: reduce) { .ki-mic.rec { animation: none; } }
.ki-voicemsg {
  flex: 1 1 100%; order: -1; margin: 0 0 8px 0; padding: 8px 12px;
  background: #fdf3f3; color: #8a2f2f; border-radius: 8px; font-size: 13.5px;
}
.ki-speak {
  display: inline-flex; align-items: center; justify-content: center;
  margin-top: 10px; width: 34px; height: 34px; border: 1px solid #dde5ea;
  background: #fff; border-radius: 50%; color: #6b7f8c; cursor: pointer;
}
.ki-speak:hover { color: #014b7c; border-color: #b9cdd9; }
.ki-speak.on { background: var(--bdo-blue); border-color: var(--bdo-blue); color: #fff; }
/* Der Ton wird noch geholt. Ohne diese Anzeige sieht Warten genauso aus wie Sprechen —
   und der Nutzer tippt ein zweites Mal, weil scheinbar nichts passiert (#59). */
.ki-speak.laedt { animation: ki-warte 1s ease-in-out infinite; }
@keyframes ki-warte { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }
@media (prefers-reduced-motion: reduce) { .ki-speak.laedt { animation: none; opacity: .6; } }
.ki-speak .material-icons { font-size: 19px; }
/* Am Handy Daumen-freundlich: Mikrofon groesser als am Schreibtisch. */
@media (max-width: 640px) {
  .ki-mic { width: 48px; height: 48px; }
  .ki-mic .material-icons { font-size: 25px; }
}

/* ============ Eingabefelder auf Mobilgeraeten: mindestens 16px ============
   iOS-Safari zoomt beim Antippen in JEDES Eingabefeld hinein, dessen Schrift kleiner als
   16px ist. Der Zoom macht die Seite breiter als das Fenster — der Inhalt rutscht nach
   rechts, Absendeknopf und Navigation verschwinden am Rand. Es sieht nach einem
   Layout-Fehler aus, ist aber erzwungenes Verhalten des Systems.

   Der naheliegende Ausweg waere `maximum-scale=1` im Viewport-Meta. Das unterbindet
   zugleich das Zoomen von Hand und ist damit eine Barriere fuer alle, die vergroessern
   muessen — deshalb ausdruecklich NICHT gewaehlt.

   `!important` ist hier noetig und kein Versehen: Die betroffenen Regeln adressieren die
   Felder ueber IDs (z. B. `.ki-bar textarea#kiQ`). Ohne `!important` verliert diese Regel
   trotz Media Query gegen die hoehere Spezifitaet.

   Betroffen sind nur Felder, in die getippt wird. Kontrollkaestchen und Schalter loesen
   keinen Zoom aus und behalten ihre Groesse. */
@media (max-width: 900px) {
  input[type="text"], input[type="search"], input[type="email"], input[type="password"],
  input[type="number"], input[type="tel"], input[type="url"], input[type="date"],
  input:not([type]), textarea, select {
    font-size: 16px !important;
  }
}

/* ====================== Rueckfragen im Stil der Anwendung (#56) ====================== */
.bdo-dlg-back{ position:fixed; inset:0; z-index:10000; background:rgba(10,30,45,.45);
  display:flex; align-items:center; justify-content:center; padding:20px;
  animation:bdoDlgIn .12s ease-out; }
@keyframes bdoDlgIn{ from{ opacity:0 } to{ opacity:1 } }
.bdo-dlg{ background:#fff; border-radius:14px; box-shadow:0 18px 50px rgba(10,30,45,.28);
  width:100%; max-width:440px; padding:22px 24px 18px; box-sizing:border-box; }
.bdo-dlg-title{ font-family:'Roboto Slab',Georgia,serif; font-weight:700; font-size:17px;
  color:var(--bdo-navy); margin-bottom:8px; }
/* pre-line: Die Texte enthalten teils Zeilenumbrueche als Zusatzhinweis
   ("Es wird aus ALLEN Artikeln entfernt"). Ohne das stuende alles in einer Zeile. */
.bdo-dlg-text{ font-size:14.5px; line-height:1.5; color:var(--bdo-dark); white-space:pre-line;
  word-break:break-word; }
.bdo-dlg-actions{ display:flex; gap:10px; justify-content:flex-end; margin-top:20px; }
.bdo-dlg-btn{ font:inherit; font-size:14.5px; font-weight:600; border-radius:9px;
  padding:9px 16px; cursor:pointer; border:1px solid transparent; }
.bdo-dlg-cancel{ background:#fff; color:var(--bdo-navy); border-color:var(--bdo-line); }
.bdo-dlg-cancel:hover{ background:var(--bdo-light); }
.bdo-dlg-ok{ background:linear-gradient(135deg,var(--bdo-navy),var(--bdo-blue)); color:#fff; }
.bdo-dlg.danger .bdo-dlg-ok{ background:linear-gradient(135deg,#b4232a,#d93b34); }
.bdo-dlg-btn:focus-visible{ outline:2px solid var(--bdo-blue); outline-offset:2px; }
/* Ein gesperrter Knopf muss gesperrt AUSSEHEN — sonst klickt man ins Leere und haelt den
   Dialog fuer kaputt. */
.bdo-dlg-btn:disabled{ opacity:.45; cursor:not-allowed; }
.bdo-dlg.danger .bdo-dlg-ok:disabled{ background:#c9a3a3; }
/* Tipp-Bestaetigung: die verlangte Bezeichnung steht zum Abgleich darueber. */
.bdo-dlg-pruefwort{ margin-top:14px; font-family:'Roboto Slab',Georgia,serif; font-weight:700;
  font-size:16px; color:var(--bdo-navy); word-break:break-word; }
.bdo-dlg-pruef{ display:block; width:100%; box-sizing:border-box; margin-top:10px;
  font:inherit; font-size:14.5px; padding:9px 12px !important; height:auto !important;
  border:1px solid var(--bdo-line) !important; border-radius:9px; background:#fff;
  color:var(--bdo-dark); }
.bdo-dlg-pruef:focus{ outline:none; border-color:var(--bdo-blue) !important;
  box-shadow:0 0 0 3px rgba(0,159,227,.15); }
@media (max-width:520px){
  .bdo-dlg-actions{ flex-direction:column-reverse; }
  .bdo-dlg-btn{ width:100%; }
}

/* ============ Mobile Ansicht: Footer aus, Blattinhalt ergaenzt (#48) ============
   Der Footer nimmt auf dem Handy Platz weg, den der Inhalt braucht. Er wird deshalb
   ausgeblendet — aber NICHT entfernt: Er bleibt im Dokument, damit das Burger-Menue seine
   Links von dort lesen kann. Impressum und Datenschutz muessen von jeder Seite aus
   erreichbar bleiben; sie wandern ins Menue statt ersatzlos zu verschwinden. */
@media(max-width:640px){
  .page-footer, footer.page-footer{ display:none!important; }
  /* Ohne Footer und ohne Tab-Leiste braucht der Inhalt unten nur noch den
     Sicherheitsabstand des Geraets. */
  body{ padding-bottom:env(safe-area-inset-bottom); }
}
/* Zwischenueberschrift vor den uebernommenen Footer-Links im Burger-Menue. Bewusst OHNE
   Media Query: Die Sidenav ist ab 992px abwaerts der Navigationsweg, nicht erst ab 640px. */
.bdo-menu-sep{ list-style:none; margin:14px 0 4px; padding:8px 16px 0;
  border-top:1px solid var(--bdo-line); font-size:11px; font-weight:700;
  letter-spacing:.4px; text-transform:uppercase; color:#8aa0ad; }
/* Zweitrangig: Die Pflichtangaben muessen erreichbar sein, nicht auffallen. */
.bdo-menu-small a{ font-size:13px!important; color:#5b6b76!important;
  padding:7px 16px!important; line-height:1.4!important; height:auto!important; }

/* ============ KI-Seite auf dem Handy entschlacken (#60) ============
   Ausgangslage: Titel, Untertitel, fuenf Beispiel-Fragen, Themen, Eingabefeld und ein
   langer Hinweisblock. Die Beispiel-Fragen allein fuellten die halbe Seite und schoben
   das Eingabefeld an den unteren Rand — auf einer Seite, deren einziger Zweck das
   Eingabefeld ist.

   Was bleibt: Eingabefeld, Themen als Einstieg, Hinweis (gestrafft).
   Was geht: Beispiel-Fragen, Untertitel, ein Teil des Weissraums. */
@media(max-width:640px){
  /* Beispiel-Fragen nur am Rechner — dort ist der Platz da und sie helfen beim Einstieg. */
  .ki-examples{ display:none; }

  /* Der Untertitel wiederholt, was der Platzhalter im Eingabefeld ohnehin sagt. */
  .ki-lead{ display:none; }
  .ki-title{ font-size:21px; padding-top:0; margin-bottom:0; }
  .ki-hero{ margin-bottom:10px; }
  .ki-wrap{ padding-top:8px; }

  /* Themen ruecken direkt unter den Titel. */
  .ki-cockpit{ margin-bottom:10px; }
  .ki-section-label{ margin:8px 2px 6px; }

  /* Hinweis bleibt vollstaendig lesbar — er sagt, dass Antworten falsch sein koennen, und
     das darf nicht weggeklappt werden. Aber er braucht nicht die Schriftgroesse des
     Inhalts. */
  .ki-notice{ margin-top:10px; padding:9px 11px; gap:8px; }
  .ki-notice-line{ font-size:12px; line-height:1.45; }
  .ki-notice-ic{ font-size:17px; }
}

/* Die Begruessung mit dem Bus gibt es NUR auf dem Handy. Am Rechner stehen dort Titel,
   Untertitel und Beispiel-Fragen — eine zusaetzliche Begruessung waere dort doppelt.
   Grundregel ausserhalb der Media Query, die mobile Regel schaltet sie wieder an. */
.ki-welcome{ display:none; }

/* ============ KI-Seite mobil: ruhiger Einstieg (#60) ============
   Vorbild war die Chat-App: kaum Rahmen, viel Ruhe statt Angeboten, das Eingabefeld als
   Hauptdarsteller in Daumenreichweite. Uebernommen wird das Prinzip, nicht das Aussehen —
   die Seite bleibt erkennbar bdo. */

/* Kopfleiste auf dem Handy schlanker. 78px sind auf einem Telefonbildschirm ein Fuenftel
   der Hoehe, dauerhaft belegt von einem Logo. Gilt auf allen Seiten, nicht nur hier. */
@media(max-width:640px){
  .bdohead{ min-height:56px; padding:0 16px!important; gap:12px; }
  /* Das min-height allein brachte nichts: Das Logo ist ein 78px hohes Element (die Grafik
     liegt als Hintergrund darin), und das hielt die Leiste auf ihren 78px fest — gemessen
     waren es weiter 78 statt der beabsichtigten 56. Also das Logo mitverkleinern; die
     Grafik skaliert ueber background-size:contain von selbst mit. */
  #brand-logo.brand-logo{ height:36px!important; width:210px!important; }
  /* Faehrt beim Scrollen nach unten ein und kommt beim Scrollen nach oben zurueck
     (Klasse setzt navigation.hbs). Beim Lesen einer langen Antwort wird die Leiste
     nicht gebraucht; beim Zurueckscrollen will man sie sofort wieder haben. */
  .bdohead{ position:sticky; top:0; transition:transform .18s ease-out; will-change:transform; }
  body.kopf-weg .bdohead{ transform:translateY(-100%); }
}

@media(max-width:640px){
  /* ---- Das Eingabefeld steht OBEN, nicht unten ----
     Vier Anlaeufe, ein am unteren Rand klebendes Feld mit der Bildschirmtastatur zu
     versoehnen, sind gescheitert — nachzulesen in #60. Der Reihe nach: Ruckeln, weisse
     Flaeche, Feld hinter der Tastatur, Feld hinter Safaris eigener Leiste. Jede Behebung
     erzeugte den naechsten Fehler, weil alle am selben Punkt ansetzten: Etwas soll unten
     kleben, und unten gehoert dem Browser.

     Also gehoert es nicht mehr unten hin. Die Tastatur kommt von unten und kann etwas im
     oberen Drittel nicht verdecken; Safaris Leiste liegt ueber leerem Raum. Es gibt nichts
     mehr, was schiefgehen kann — und die ganze Mechanik dahinter (feste Flaeche, svh,
     visualViewport, Scroll-Korrekturen) ist ersatzlos entfallen.

     Reihenfolge: Bus und Begruessung, Eingabefeld, Gespraech, Themen, Hinweis.
     Am Rechner bleibt alles wie es war — dort gibt es das Problem nicht. */
  .ki-app{ display:flex; flex-direction:column; }
  .ki-welcome{ order:1; }
  .ki-bar{ order:2; }
  .ki-thread{ order:3; }
  .ki-cockpit{ order:4; }

  /* Bus und Begruessung kompakt oben statt mittig im leeren Raum: Sie leiten die Seite ein,
     sie fuellen sie nicht mehr. */
  .ki-app.is-empty .ki-welcome{ display:flex; flex-direction:column; align-items:center;
    text-align:center; gap:2px; padding:6px 0 14px; }
  /* Im Gespraech ist die Begruessung fehl am Platz — dort zaehlt die Antwort. */
  .ki-app.is-chat .ki-welcome{ display:none; }

  .ki-welcome-greet{ font-family:'Roboto Slab',Georgia,serif; font-size:23px; font-weight:700;
    color:var(--bdo-navy); margin:0; }
  .ki-welcome-sub{ font-size:14.5px; color:#5b6b76; margin:4px 0 0; }

  /* Titel entfaellt im Leerzustand — die Begruessung sagt dasselbe waermer, und die
     Tab-Leiste bzw. der Kopf sagen ohnehin, wo man ist. */
  .ki-app.is-empty .ki-title{ display:none; }
  .ki-app.is-empty .ki-hero{ margin:0; }

  /* NICHT MEHR sticky: Ein Feld, das am unteren Rand klebt, ist genau das, was hier
     aufgegeben wurde. Es steht im Fluss, direkt unter der Begruessung. */
  .ki-bar{ position:static; margin:0 0 12px; }

  /* Der Verlauf waechst nach unten und scrollt mit der Seite — keine eigene Hoehe, kein
     eigener Scrollbereich. Das Feld bleibt beim Lesen oben stehen, ohne zu kleben. */
  .ki-app.is-chat .ki-thread{ max-height:none; min-height:0; overflow:visible; }

  /* Themen als dezente Zeile direkt ueber dem Eingabefeld statt als Kacheln mit Ueberschrift. */
  .ki-app.is-empty .ki-cockpit .ki-section-label{ display:none; }
  .ki-topics{ justify-content:center; gap:6px; }
  .ki-topic{ font-size:12.5px!important; padding:5px 11px!important; border-radius:999px!important;
    background:transparent!important; border:1px solid var(--bdo-line)!important; color:#5b6b76!important; }
  /* Die Zeile steht mobil zu dritt nebeneinander — das Symbol muss mit schrumpfen, sonst
     bricht sie um und die Themen belegen zwei Zeilen ueber dem Eingabefeld. */
  .ki-topic .material-icons{ font-size:15px; }

  /* Der eingeklappte Hinweis: eine unaufdringliche Zeile, jederzeit aufklappbar. */
  .ki-notice-toggle{ display:inline-flex; align-items:center; gap:6px; margin:10px auto 0;
    background:none; border:none; color:#8aa0ad; font:inherit; font-size:12px; cursor:pointer;
    padding:4px 8px; }
  .ki-notice-toggle .material-icons{ font-size:15px; }
  .ki-notice-toggle[aria-expanded="true"]{ color:var(--bdo-blue); }
  /* Der Hinweis steht am Ende — er wird gelesen, wenn jemand ihn sucht, nicht beim Tippen. */
  .ki-notice-toggle{ align-self:center; order:98; }
  .ki-notice{ order:99; }
  /* Eingeklappt gilt NUR hier. Am Rechner bleibt der Hinweis stehen, dort gibt es keinen
     Knopf, ihn wieder zu oeffnen. */
  .ki-notice.ist-eingeklappt{ display:none; }
}
/* Am Rechner gibt es den Knopf nicht — der Hinweis steht dort dauerhaft. */
@media(min-width:641px){ .ki-notice-toggle{ display:none!important; } }

/* #89: Kacheln sind reine Anzeige, nur die Ueberschrift verlinkt. #90: Label vor den Beispielfragen. */
.start-sec-link{ color:inherit; text-decoration:underline; text-underline-offset:3px; display:inline-flex; align-items:center; gap:4px; }
.start-sec-link .material-icons{ font-size:16px; color:inherit; }
.start-hero-exlabel{ align-self:center; font-size:13px; font-weight:700; color:#fff; }

/* #91: KI steht als Reiter neben "Laender"; der Kopf-Link bleibt nur auf dem Handy (#48). */
@media (min-width: 993px){ .headtools .hki{ display:none!important; } }

/* #96: Datum rechtsbuendig neben dem Titel */
.ll-headrow{ display:flex; align-items:baseline; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:18px; }
.ll-headrow .ll-h2{ margin:0; }
.ll-headrow .ll-meta{ margin:0; }

/* #97: Feed im Laender-Reiter — ohne Bereichs-Chip, Spalten Flagge/Land/Titel/Datum */
.ll-feedpanel{ margin-top:18px; }
.ll-feedpanel .feed-item{ grid-template-columns:28px minmax(120px,200px) 1fr auto; }

/* #102: „Einstellungen" oben, die einzelnen Fachbereiche darunter eingerueckt */
#admintabs ul.admnav .fb-menu .fb-settings a{ font-weight:700; }
#admintabs ul.admnav .fb-menu li:not(.fb-settings) a{ padding-left:36px!important; font-size:13px; }

/* #99: Zaehler neuer Kommentare */
.uc-badge{ display:inline-block; min-width:18px; margin-left:6px; padding:0 6px; border-radius:9px; background:#d32f2f; color:#fff; font-size:12px; font-weight:700; line-height:18px; text-align:center; }

/* #94: Links in KI-Antworten */
.ki-text a.ki-link{ color:var(--bdo-blue); text-decoration:underline; }

/* #95: Sprungziel aus einer KI-Quelle kurz hervorheben */
.bdo-jump{ background:var(--bdo-light); box-shadow:0 0 0 8px var(--bdo-light); border-radius:4px; transition:background .6s, box-shadow .6s; }

/* #98: Datum je Abschnitt rechts neben der Zwischenueberschrift */
.ll-article .ll-sechead{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.ll-secdate{ flex:none; font:400 12.5px Roboto,sans-serif; font-style:normal; color:#5b6b76; }

/* #92: Zurueck-Schaltflaeche unter der Navigation */
.bdo-backbar{ display:flex; justify-content:flex-start; align-self:stretch; width:100%; margin:14px 0 0; padding:0 16px; box-sizing:border-box; }
.bdo-backbar[hidden]{ display:none; }
.bdo-backbtn{ display:inline-flex; align-items:center; gap:6px; padding:7px 16px 7px 12px; border:1px solid var(--bdo-navy); border-radius:8px;
  background:#fff; color:var(--bdo-navy); font:500 14px Roboto,sans-serif; cursor:pointer; }
.bdo-backbtn:hover{ background:var(--bdo-light); }
.bdo-backbtn .material-icons{ font-size:18px; }

/* #90: Logo ist nach Wegfall von „KI-Assistent" allein im Hero — groesser, mobil etwas kleiner */
@media (max-width: 640px){ .start-hero-logo{ height:30px; } }

/* #101: feste Spaltenbreiten — sonst springt die Tabelle beim Filterwechsel (Bilder/Dokumente/Alle) */
.fa-table{ table-layout:fixed; }
.fa-table th:nth-child(1){ width:auto; }
.fa-table th:nth-child(2){ width:100px; }
.fa-table th:nth-child(3){ width:90px; }
.fa-table th:nth-child(4){ width:110px; }
.fa-table th:nth-child(5){ width:90px; }
.fa-table th:nth-child(6){ width:200px; }
.fa-table td.fa-name{ overflow-wrap:anywhere; }

/* #109: Gespraechsliste links wie bei Claude (Prototyp abgenommen 04.11.2026) */
/* Breiter (Wunsch TZ 04.11.): Fensterbreite nutzen wie die Startseite, Chat-Spalte bis 1100 px */
@media (min-width: 993px){ .ki-wrap.container{ width:min(1500px,94vw)!important; max-width:none!important; margin-left:auto!important; margin-right:auto!important; } }
.ki-layout{ display:flex; gap:32px; align-items:flex-start; }
.ki-layout > .ki-app{ flex:1; min-width:0; max-width:1100px; }
.ki-side{ flex:none; width:280px; position:sticky; top:16px; max-height:calc(100vh - 32px); overflow-y:auto;
  background:#f7f9fb; border:1px solid var(--bdo-line); border-radius:12px; padding:14px 10px; box-sizing:border-box; }
.ki-side-new{ display:flex; align-items:center; gap:8px; width:100%; padding:10px 12px; border:1px solid var(--bdo-line); border-radius:8px;
  background:#fff; color:var(--bdo-navy); font:500 14px Roboto,sans-serif; cursor:pointer; }
.ki-side-new:hover{ border-color:var(--bdo-blue); color:var(--bdo-blue); }
.ki-side-new .material-icons{ font-size:18px; }
.ki-side-h{ margin:18px 4px 4px; font:700 11px Roboto,sans-serif; letter-spacing:.06em; text-transform:uppercase; color:#5b6b76; }
.ki-chats-g{ margin:10px 4px 2px; font:600 11px Roboto,sans-serif; color:#8a98a3; }
.ki-chats-list{ list-style:none; margin:0; padding:0; }
.ki-chats-list li{ display:flex; align-items:center; border-radius:6px; }
.ki-chats-list li:hover, .ki-chats-list li.on{ background:var(--bdo-light); }
.ki-chats-list li.on .ki-chat-open{ font-weight:500; }
.ki-chat-open{ flex:1; min-width:0; padding:8px 10px; background:none; border:0; text-align:left; cursor:pointer; color:var(--bdo-dark);
  font:14px Roboto,sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ki-chat-del{ flex:none; visibility:hidden; background:none; border:0; color:#8a98a3; cursor:pointer; padding:4px 6px; border-radius:6px; }
.ki-chats-list li:hover .ki-chat-del, .ki-chat-del:focus{ visibility:visible; }
.ki-chat-del:hover{ color:#c62828; }
.ki-chat-del .material-icons{ font-size:18px; }
.ki-chats-leer{ padding:8px 6px; color:#5b6b76; font-size:13px; }
.ki-side-foot{ margin:14px 4px 0; font-size:12px; color:#8a98a3; }
.ki-sidebtn{ display:none!important; }
/* Handy: Liste eingeklappt, Knopf „Gespräche" klappt sie als Ebene auf */
@media (max-width: 992px){
  .ki-layout{ display:block; }
  .ki-side{ display:none; position:fixed; top:0; left:0; bottom:0; width:85vw; max-width:320px; max-height:none; border-radius:0; z-index:1000; box-shadow:0 0 0 100vmax rgba(0,25,40,.35); }
  .ki-layout.ki-side-open .ki-side{ display:block; }
  .ki-sidebtn{ display:inline-flex!important; }
  .ki-chat-del{ visibility:visible; }
}
/* Quellen-Chips: lange Abschnittsnamen mit „…" kuerzen (Text in eigenem span) */
.ki-cite{ max-width:280px; }
.ki-cite-t{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }