/* ═══════════════════════════════════════════════════════════════════════════
   vc-rechtsdoku.css — EIN Kopf für alle Rechtsdokumente (und Seiten mit derselben Leiste)

   BETREIBER-AUFTRAG 17.09.2026 (Bild AVV-Kopf):
   „man kann die Schrift nicht ordentlich lesen; die Sachen oben sind nicht fix an einer
    Stelle — wechselt man das Dokument, sind Knöpfe an anderen Positionen, manchmal
    verschwinden welche. Es soll wie im Bild sein, die Knöpfe normal anklickbar, zum
    Dokument kommen, alles ohne Fehler, professionell — nur Schrift und unterstrichen."

   GEMESSEN vorher (kopfloses Chrome, 1440 px, hell + dunkel):
     • 6 Dokumente (AGB, Verkäuferbedingungen, AVV, Vollmacht, DSA, Barrierefreiheit):
       Kopf zur Laufzeit durchsichtig (vc-schlicht) auf hellgrauem Grund, weiße Schrift
       → Kontrast 1,5:1; kein Farbthema gesetzt → im Dunkelmodus hell.
     • Widerruf / Kündigung: dunkel richtig, hell ebenso 1,5:1.
     • Impressum, Datenschutz, Cookies, Nutzungsbedingungen: ANDERER Kopf (großes Logo,
       „Zurück" mittig, EUR/Flagge, kein Titel, kein Drucken) — im Hellmodus Reiter weiß
       auf weiß (unsichtbar).
     • Reiterleiste 794 px breit für 1232 px Inhalt → „Barrierefreiheit" abgeschnitten.
   JETZT: alle Seiten tragen dasselbe Kopf-Markup (Logo · Titel | Drucken · Zurück, darunter
   die 12 Reiter); diese Datei legt Maße, Lage und Farben verbindlich fest (!important —
   jede Seite bringt eigene Kopf-Regeln mit). Kopf in Seitenfarbe (kein Balken, keine
   Linie), Reiter nur Schrift, das gewählte Dokument unterstrichen, alle 12 sichtbar
   (Umbruch statt Abschneiden). `data-vcsl-nie` am Kopf hält vc-schlicht fern.
   Zurück: <link> entfernen. Nur Darstellung — Verweise und Drucken unverändert.
   ═══════════════════════════════════════════════════════════════════════════ */
html{--vrd-text:#0F1722;--vrd-mut:#3D4A5C;--vrd-blau:#1B56CC;--vrd-linie:rgba(15,23,34,.2)}
html[data-theme="dark"]{--vrd-text:#F3F4F6;--vrd-mut:#A9B3C2;--vrd-blau:#5B9BF8;--vrd-linie:rgba(255,255,255,.16)}

/* ── Kopfzeile ── */
html body > .toolbar{
  position:sticky!important;top:0!important;z-index:60!important;
  display:flex!important;align-items:center!important;justify-content:space-between!important;gap:1rem!important;
  height:58px!important;min-height:58px!important;margin:0!important;padding:0 28px!important;box-sizing:border-box!important;
  background-color:inherit!important;background-image:none!important;border:0 none!important;box-shadow:none!important;
  font-family:'Manrope',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif!important;
}
html body > .toolbar .tb-left{display:flex!important;align-items:center!important;gap:1rem!important;min-width:0!important;flex:1 1 auto!important}
html body > .toolbar .tb-logo{font-size:1.05rem!important;font-weight:800!important;letter-spacing:-.02em!important;line-height:1!important;color:var(--vrd-text)!important;white-space:nowrap!important;text-decoration:none!important;flex:none!important}
html body > .toolbar .tb-logo span{color:var(--vrd-blau)!important}
html body > .toolbar .tb-title{font-size:.84rem!important;font-weight:500!important;line-height:1!important;color:var(--vrd-mut)!important;
  border-left:1px solid var(--vrd-linie)!important;padding:0 0 0 1rem!important;margin:0!important;
  white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;min-width:0!important;display:block!important}
html body > .toolbar .tb-right{display:flex!important;align-items:center!important;gap:1.4rem!important;flex:none!important;flex-wrap:nowrap!important}
html body > .toolbar .tb-btn{display:inline-flex!important;align-items:center!important;gap:.45rem!important;font-family:inherit!important;
  font-size:.84rem!important;font-weight:600!important;line-height:1!important;white-space:nowrap!important;cursor:pointer!important;
  text-decoration:none!important;transform:none!important;margin:0!important}
/* „Drucken / Als PDF speichern" — blaue Pille wie im Bild */
html body > .toolbar .tb-btn-primary{background:#1B56CC!important;color:#fff!important;border:0 none!important;border-radius:999px!important;
  padding:.62rem 1.15rem!important;box-shadow:none!important;height:auto!important;min-height:0!important}
html body > .toolbar .tb-btn-primary:hover{background:#1447B0!important}
/* „Zurück" — nur Schrift */
html body > .toolbar .tb-btn-secondary{background:none!important;border:0 none!important;border-radius:0!important;box-shadow:none!important;
  padding:.62rem 0!important;color:var(--vrd-mut)!important}
html body > .toolbar .tb-btn-secondary:hover{color:var(--vrd-text)!important;text-decoration:underline!important;text-underline-offset:3px!important}
html body > .toolbar .tb-btn:focus-visible{outline:2px solid var(--vrd-blau)!important;outline-offset:3px!important}
html body > .toolbar .tb-btn svg{flex:none!important;width:14px!important;height:14px!important}

/* ── Reiter der Dokumente ── */
html body > .legal-nav{background:transparent!important;background-image:none!important;border:0 none!important;box-shadow:none!important;
  margin:0 0 .4rem!important;padding:0!important;overflow:visible!important;position:static!important}
html body > .legal-nav .ln-in{max-width:1240px!important;margin:0 auto!important;padding:0 28px!important;box-sizing:border-box!important;
  display:flex!important;flex-wrap:wrap!important;justify-content:center!important;gap:0 .2rem!important}
html body > .legal-nav .ln-a{display:inline-block!important;font-family:'Manrope',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif!important;
  font-size:.82rem!important;font-weight:500!important;line-height:1.2!important;color:var(--vrd-mut)!important;
  padding:.62rem .8rem!important;margin:0!important;background:none!important;border:0 none!important;
  border-bottom:2px solid transparent!important;border-radius:0!important;box-shadow:none!important;
  text-decoration:none!important;white-space:nowrap!important;flex:none!important}
html body > .legal-nav .ln-a:hover{color:var(--vrd-text)!important}
/* gleiche Schriftstärke wie die anderen Reiter — sonst verschiebt sich die zentrierte Reihe je Dokument um 1–2 px */
html body > .legal-nav .ln-a.on{color:var(--vrd-text)!important;font-weight:500!important;border-bottom-color:var(--vrd-blau)!important}
html body > .legal-nav .ln-a:focus-visible{outline:2px solid var(--vrd-blau)!important;outline-offset:-2px!important}

/* ── Schmale Fenster: Titel weg, Reiter waagrecht wischbar statt umbrechend ── */
@media (max-width:760px){
  html body > .toolbar{padding:0 16px!important;height:54px!important;min-height:54px!important;flex-wrap:nowrap!important}
  /* Handy-Ebene: die eigene Kopfzeile (vc-handy) trägt schon „←“ und den Titel — „Zurück“ hier nicht doppelt */
  html body > .toolbar .tb-btn-secondary{display:none!important}
  html body > .toolbar .tb-left{flex:1 1 auto!important}
  html body > .toolbar .tb-title{display:none!important}
  html body > .toolbar .tb-right{gap:1rem!important}
  html body > .toolbar .tb-btn-primary{padding:.5rem .85rem!important;font-size:.76rem!important}
  html body > .legal-nav{overflow-x:auto!important;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  html body > .legal-nav::-webkit-scrollbar{display:none}
  html body > .legal-nav .ln-in{flex-wrap:nowrap!important;justify-content:flex-start!important;padding:0 8px!important;max-width:none!important}
}
@media print{html body > .toolbar,html body > .legal-nav{display:none!important}}

/* ── Dunkelmodus für die Papier-Dokumente (.doc) — Werte 1:1 aus widerruf.html,
      dort gemessen und bewährt; die sechs Seiten ohne eigene Dunkel-Regeln erben sie. ── */
html[data-theme="dark"] body:has(> .doc-wrap){background:#0f0f12!important}
html[data-theme="dark"] .doc{background:#17171c!important;color:#e5e7eb!important;box-shadow:0 10px 40px rgba(0,0,0,.55)!important}
html[data-theme="dark"] .doc-brand{color:#f3f4f6!important}
html[data-theme="dark"] .doc-brand span{color:#5B9BF8!important}
html[data-theme="dark"] .doc-head{border-bottom-color:#2f5fb0!important}
html[data-theme="dark"] .doc-title,html[data-theme="dark"] .doc h2,html[data-theme="dark"] .doc h3,html[data-theme="dark"] .doc-meta strong{color:#f3f4f6!important}
html[data-theme="dark"] .doc-meta,html[data-theme="dark"] .doc-subtitle,html[data-theme="dark"] .doc-foot{color:#98a6bd!important}
html[data-theme="dark"] .doc p,html[data-theme="dark"] .doc li,html[data-theme="dark"] .doc td,html[data-theme="dark"] .doc dd{color:#c9d2df!important}
html[data-theme="dark"] .doc th,html[data-theme="dark"] .doc dt,html[data-theme="dark"] .doc strong,html[data-theme="dark"] .doc b{color:#e8edf5!important}
html[data-theme="dark"] .doc-title-block,html[data-theme="dark"] .doc h2,html[data-theme="dark"] .doc-foot,
html[data-theme="dark"] .doc table,html[data-theme="dark"] .doc th,html[data-theme="dark"] .doc td{border-color:#28282e!important}
html[data-theme="dark"] .doc a{color:#7FA7F2!important}
/* Sprachhinweis „Verbindlich ist die deutsche Fassung." — außerhalb von .doc (Impressum, Datenschutz,
   Cookies, Nutzungsbedingungen) blieb die Hervorhebung dunkelblau auf Schwarz (gemessen 1,5:1). */
html[data-theme="dark"] .doc-langnote strong{color:#E8EDF5!important}
