/* Rechtstext-Popups (site-weit) - Marken-Look, in BEIDEN Farbschemata.
   ---------------------------------------------------------------------------
   ⚠️ BIS ZUM 30.08.2026 WAR DAS FENSTER IMMER HELL. Gemeldet hat es der
   Betreiber: "Wenn man aus dem Mitglieder-Bereich das Popup fuer Impressum,
   Datenschutz und Widerrufsbelehrung oeffnet, dann wird der Hell-/Dunkelmodus
   ignoriert." Die Ursache stand direkt hier: background:#fff, color:#14181F und
   ein Fließtext in #4A525E - drei feste Werte, und keine einzige
   prefers-color-scheme-Regel in der ganzen Datei.

   ⚠️ DIE --fp-TOKENS HELFEN DABEI NICHT. Sie kommen aus dem
   Customizer-CSS (docs/wp-frame-custom-css.css) und sind dort NUR fuer den
   Hellmodus definiert; im Dunkelmodus schaltet jenes CSS bloss den Grund um.
   Ein var(--fp-ink) im Dialog holte sich also weiterhin die helle Farbe.
   Deshalb eigene --fkl-Tokens mit drei Selektor-Saetzen, wie in theme.css:
   Systemdunkel (ohne data-theme), manuell dunkel, manuell hell. */
dialog.fk-legal {
  --fkl-flaeche: #FFFFFF;
  --fkl-text: #14181F;
  --fkl-weich: #4A525E;
  --fkl-linie: var(--fp-linie, #D3DAE2);
  --fkl-blau: var(--fp-blau, #0B4DA2);
  --fkl-blau-hell: var(--fp-blau-hell, #E7EFF9);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) dialog.fk-legal {
    --fkl-flaeche: #171C23;
    --fkl-text: #EEF1F4;
    --fkl-weich: #C2CBD6;
    --fkl-linie: #2A313B;
    --fkl-blau: #7FB0E6;
    --fkl-blau-hell: #16233A;
  }
}
:root[data-theme="dark"] dialog.fk-legal {
  --fkl-flaeche: #171C23;
  --fkl-text: #EEF1F4;
  --fkl-weich: #C2CBD6;
  --fkl-linie: #2A313B;
  --fkl-blau: #7FB0E6;
  --fkl-blau-hell: #16233A;
}

dialog.fk-legal{padding:0;border:1px solid var(--fkl-linie);border-radius:16px;
  width:min(720px,calc(100vw - 32px));max-height:min(86vh,920px);
  background:var(--fkl-flaeche);color:var(--fkl-text);box-shadow:0 24px 60px rgba(8,20,40,.30);overflow:hidden;
  color-scheme:light dark}
dialog.fk-legal[open]{display:flex;flex-direction:column}
dialog.fk-legal::backdrop{background:rgba(9,16,28,.55);backdrop-filter:blur(3px)}
.fk-legal-kopf{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:18px 22px;border-bottom:1px solid var(--fkl-linie)}
.fk-legal-kopf h2{margin:0;font-family:'Oswald','Arial Narrow',sans-serif;font-weight:700;font-size:1.35rem;
  color:var(--fkl-blau);text-transform:uppercase;letter-spacing:.02em}
/* Schließen-Button: vollständig selbst besitzen (Theme-Buttons zurücksetzen), quadratisch */
.fk-legal-zu{-webkit-appearance:none;appearance:none;box-sizing:border-box;flex:0 0 auto;
  width:38px !important;height:38px !important;min-width:0 !important;padding:0 !important;margin:0 !important;
  border-radius:50% !important;border:1px solid var(--fkl-linie) !important;
  background:var(--fkl-flaeche) !important;color:var(--fkl-weich) !important;cursor:pointer;line-height:1;
  display:grid;place-items:center;box-shadow:none !important;
  transition:background .16s,color .16s,border-color .16s}
.fk-legal-zu svg{width:18px;height:18px;display:block}
.fk-legal-zu:hover,.fk-legal-zu:focus-visible{background:var(--fkl-blau-hell) !important;
  color:var(--fkl-blau) !important;border-color:var(--fkl-blau) !important}
.fk-legal-koerper{flex:1 1 auto;min-height:0;overflow-y:auto;padding:10px 22px 22px}
/* ⚠️ ALLE UEBERSCHRIFTENEBENEN, NICHT NUR h3. Hier stand bis zum 30.08.2026 nur
   h3 - und die Rechtstexte tragen seit B110 (29.08.) h2, weil der Deploy sie beim
   Einbau eine Ebene anhebt. Die Folge war im Dunkelmodus messbar: bis zu fuenf
   Kontraststellen je Dialog, weil die h2 Astras --ast-global-color-2 (#1e293b)
   behielten. Eine Liste von Elementen ist derselbe Fehler wie eine Liste von
   Seiten-Nummern, nur eine Ebene tiefer. */
.fk-legal-koerper h2,
.fk-legal-koerper h3,
.fk-legal-koerper h4,
.fk-legal-koerper h5{font-family:'Oswald','Arial Narrow',sans-serif;color:var(--fkl-blau);margin:18px 0 6px}
.fk-legal-koerper h2{font-size:1.2rem}
.fk-legal-koerper p{color:var(--fkl-weich);line-height:1.6;margin:8px 0}
/* ⚠️ UNTERSTRICHEN, nicht nur eingefaerbt. axe meldete link-in-text-block: wer
   Farben nicht unterscheidet, sieht im Fliesstext keinen Link. Der Verstoss war
   in BEIDEN Schemata da und faellt erst auf, seit die Dialoge ueberhaupt
   gemessen werden - vorher hat sie kein Riegel je geoeffnet. */
.fk-legal-koerper a{color:var(--fkl-blau);text-decoration:underline;text-underline-offset:2px}
.fk-legal-koerper a:hover{text-decoration-thickness:2px}
.fk-legal-mehr{margin-top:18px;padding-top:14px;border-top:1px solid var(--fkl-linie)}
.fk-legal-mehr a{font-weight:600}
html.fk-legal-offen{overflow:hidden}
/* Zurück-Link auf den Rechtstext-Vollseiten (nicht im Popup) */
.fk-seiten-zurueck{margin:0 0 1.25rem}
.fk-zurueck-link{display:inline-flex;align-items:center;gap:.4rem;color:var(--fp-blau,#0B4DA2);
  font-weight:500;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .16s ease}
.fk-zurueck-link::before{content:"\2190";transition:transform .16s ease}
.fk-zurueck-link:hover{border-bottom-color:var(--fp-gelb,#f4c020)}
.fk-zurueck-link:hover::before{transform:translateX(-3px)}
.fk-zurueck-link:focus-visible{outline:2px solid var(--fp-blau,#0B4DA2);outline-offset:3px;border-radius:2px}
@media(prefers-reduced-motion:no-preference){
  dialog.fk-legal[open]{animation:fk-legal-auf .24s cubic-bezier(0.23,1,0.32,1)}
  @keyframes fk-legal-auf{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
}

/* ---- Der Kündigungs-Knopf nach § 312k (seit 26.08.2026) --------------------
   ZWEI Erscheinungsformen, und das ist Absicht:

   .fk-kuendigung-fusslink steht IN der Fußzeile des Themes, zwischen den
   Rechtstext-Links. Er bekommt hier bewusst fast nichts mit: seine Farbe, Größe
   und Abstände sollen die seiner Nachbarn sein, und die kommen vom Theme. Wer ihm
   eigene Werte gibt, baut den einen Link, der anders aussieht als die anderen drei.

   .fk-kuendigung-footerlink ist der ERSATZWEG unter dem Theme-Fuß - sichtbar nur,
   wenn die Fußzeile ihn nicht aufgenommen hat. Er hatte bis heute gar kein
   Stylesheet und hing als nackter Absatz linksbündig unter der Seite. Das war
   rechtlich einwandfrei und sah kaputt aus. */
.fk-kuendigung-fusslink { white-space: nowrap; }

.fk-kuendigung-footerlink {
  margin: 0;
  padding: 1rem 1.25rem 1.5rem;
  text-align: center;
  font-size: .9rem;
}
.fk-kuendigung-footerlink a { color: inherit; }
