/* ==========================================================================
   THEME – hier wird der Stil angepasst.
   Nur Variablen. Farben, Schrift, Rundungen und Abstände für die ganze App.
   Vorbild: martinahautau.de (Bordeaux, zartes Rosa, Dunkelblau, Arial).
   Nach einer Änderung reicht ein Neuladen der Seite.
   ========================================================================== */

:root {
  /* Markenfarben */
  --farbe-primaer: #650133;          /* Bordeaux: Buttons, Links, Akzente */
  --farbe-primaer-hover: #4d0127;
  --farbe-primaer-text: #ffffff;     /* Schrift auf Primärfarbe */
  --farbe-sekundaer: #2d3c55;        /* Dunkelblau: Kopfzeile Admin, Überschriften-Akzent */
  --farbe-zart: #fbeff5;             /* zartes Rosa: Flächen, eigene Nachrichten */
  --farbe-zart-rand: #f1d6e4;

  /* Neutrale Farben */
  --farbe-hintergrund: #ffffff;
  --farbe-flaeche: #f7f7f8;          /* Seitenleiste, Karten */
  --farbe-text: rgba(10, 10, 10, 0.85);
  --farbe-text-stark: #0a0a0a;
  --farbe-text-leise: #545262;
  --farbe-rand: #e6e6e6;

  /* Zustände */
  --farbe-ok: #2f7d4f;
  --farbe-ok-flaeche: #e9f5ee;
  --farbe-fehler: #a3122a;
  --farbe-fehler-flaeche: #fdecef;
  --farbe-warnung: #8a5a00;
  --farbe-warnung-flaeche: #fff5e0;

  /* Schrift */
  --schrift: Arial, Helvetica, sans-serif;
  --schrift-groesse: 17px;
  --zeilenhoehe: 1.65;
  --buchstabenabstand: 0.3px;
  --schrift-gewicht-ueberschrift: 600;

  /* Formen */
  --rundung-klein: 6px;
  --rundung: 10px;                   /* Buttons, Eingabefelder */
  --rundung-gross: 22px;             /* Chatblasen, Karten */
  --schatten: 0 2px 14px rgba(45, 60, 85, 0.08);

  /* Abstände und Maße */
  --abstand: 16px;
  --seitenleiste-breite: 280px;
  --inhalt-max: 820px;
}

/* Dunkler Modus: nur aktiv, wenn das Gerät ihn verlangt. Zum Abschalten den Block löschen. */
@media (prefers-color-scheme: dark) {
  :root {
    --farbe-primaer: #b5487d;
    --farbe-primaer-hover: #c95e92;
    --farbe-sekundaer: #1d2738;
    --farbe-zart: #3a2230;
    --farbe-zart-rand: #55303f;
    --farbe-hintergrund: #15161a;
    --farbe-flaeche: #1e2026;
    --farbe-text: rgba(240, 240, 240, 0.88);
    --farbe-text-stark: #f5f5f5;
    --farbe-text-leise: #a8a6b5;
    --farbe-rand: #33353d;
    --farbe-ok-flaeche: #17301f;
    --farbe-fehler-flaeche: #3a1820;
    --farbe-warnung-flaeche: #3a2e12;
    --farbe-ok: #7fd3a0;
    --farbe-fehler: #ff8a9b;
    --farbe-warnung: #f0c060;
  }
}