/*
 * Design-Tokens der öffentlichen Seite (ADR-WEB-0008). Hier, und nur hier,
 * stehen Farben, Schriften, Größen, Abstände und Breiten; site.css benutzt
 * nur diese Namen. Wer das Aussehen abstimmt, ändert diese Datei.
 *
 * Herkunft der Farben (gemessen am 21.10.2026, Befund mvp-1-startseite):
 * Theme bones der alten Seite (_grav-alt/user/themes/bones/scss/
 * _settings.scss und css/callout.css) und das Logo. Wo eine Farbe aus
 * bones als Schrift auf Weiß zu wenig Kontrast hat (unter 4,5:1), steht
 * daneben eine dunklere Fassung derselben Farbe; der Kontrast steht im
 * Kommentar.
 */
:root {
  /* Farben aus bones */
  --farbe-primaer: #1e8cc7;        /* $primary-color; 3,7:1 auf Weiß, nur für Flächen und Linien */
  --farbe-link: #1774a6;           /* $primary-color dunkler; 5,1:1 auf Weiß */
  --farbe-link-hover: #10567c;
  --farbe-text: #1f1d0f;           /* $black; 16,9:1 */
  --farbe-text-leise: #6b6b6b;     /* zwischen $dark-gray und $black; 5,3:1 */
  --farbe-grund: #ffffff;          /* $white */
  --farbe-flaeche: #f6f6f6;        /* $light-gray, auch Hintergrund der Navigation in bones */
  --farbe-rand: #cacaca;           /* $medium-gray */

  /* Beschriftung der Beiträge, wie die Hinweiskästen in bones */
  --farbe-aktuell: #1774a6;
  --farbe-aktuell-grund: #daeff9;  /* .callout.primary */
  --farbe-event: #1e7a45;          /* $success-color dunkler; 5,4:1 */
  --farbe-event-grund: #e1faea;    /* .callout.success */

  /* Ausfall in der Terminliste */
  --farbe-ausfall: #b8321c;        /* $alert-color dunkler; 6,0:1 */
  --farbe-ausfall-grund: #fce6e2;  /* .callout.alert */
  /* In den grauen Zeilen ein dunkleres Rot, damit der Ausfall dort nicht
     untergeht (Ralf, 23.10.2026); Schrift im Ausfall dunkler, damit sie
     auf beiden Rot mindestens 4,5:1 hat. */
  --farbe-ausfall-grund-dunkel: #f6d0c8;
  --farbe-ausfall-text: #555555;   /* 6,2:1 und 5,3:1 */
  --farbe-ausfall-stark: #8f2716;  /* 7,1:1 und 6,0:1 */

  /* Der angesprungene Caller in der Caller-Tabelle: auf grauen Zeilen ein
     dunkleres Blau als --farbe-aktuell-grund (Ralf, 23.10.2026); dort der
     Verweis in --farbe-link-hover (6,7:1 und 5,7:1) und vergangene Tage
     dunkler. */
  --farbe-markiert-grund-dunkel: #bfdff0;
  --farbe-markiert-text-leise: #555555;  /* 6,3:1 und 5,3:1 */

  /* Farbe im Text, {blau}…{/blau} (ADR-REDAKTION-0022): nur Farben mit
     mindestens 4,5:1 auf Weiß; gelb und hellgrün der alten Seite nicht */
  --farbe-text-blau: var(--farbe-link);     /* 5,1:1 */
  --farbe-text-rot: var(--farbe-ausfall);   /* 6,0:1 */
  --farbe-text-gruen: var(--farbe-event);   /* 5,4:1 */

  /* Farben des Logos */
  --farbe-logo-gruen: #276f6e;
  --farbe-logo-blau: #1e3aa7;

  /* Seitenkopf und Seitenfuß */
  --farbe-kopf-grund: var(--farbe-grund);
  --farbe-kopf-linie: var(--farbe-logo-gruen);
  --farbe-fuss-grund: var(--farbe-logo-gruen);
  --farbe-fuss-text: #ffffff;      /* 6,0:1 auf dem Grün des Logos */

  /* Schrift: Systemschriften, nichts wird geladen (ADR-WEB-0009).
     bones nahm "Helvetica Neue", Helvetica, Roboto, Arial. */
  --schrift: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --schrift-zeilenhoehe: 1.6;
  --schrift-klein: 0.875rem;
  --schrift-normal: 1.0625rem;
  --schrift-h3: 1.25rem;
  --schrift-h2: 1.5rem;
  --schrift-h1: clamp(1.625rem, 1.2rem + 1.5vw, 2.125rem);
  --schrift-gewicht-titel: 700;

  /* Abstände */
  --abstand-1: 0.25rem;
  --abstand-2: 0.5rem;
  --abstand-3: 1rem;
  --abstand-4: 1.5rem;
  --abstand-5: 2rem;
  --abstand-6: 3rem;

  /* Breiten */
  --breite-seite: 66rem;           /* $global-width in bones, 1056 px */
  --breite-text: 42rem;
  --rand-seite: var(--abstand-3);  /* seitlicher Rand auf dem Telefon */
  --umbruch-breit: 50rem;          /* ab hier zwei Spalten und breite Terminliste */

  /* Formen */
  --radius: 3px;                   /* $global-radius */
  --schatten: 0 1px 3px rgb(0 0 0 / 0.12);
  --slider-hoehe: 20rem;           /* die Slider-Bilder sind 1000 × 320 */
  --dauer: 200ms;
}
