/*
 * RheinSkin intern – ALLE Farben an einer Stelle.
 *
 * 1. Hausfarben: aus Fotos des Logos gemessen. Sobald die Agentur die exakten
 *    Werte liefert, nur diese vier Zeilen ändern.
 * 2. Verwendung: welche Farbe wofür, getrennt für Hell- und Dunkelmodus.
 *    Übernommen aus dem Prototyp.
 */

:root{
  /* ---------- 1. Hausfarben ---------- */
  --haus-blau:#2B3470;
  --haus-gelb:#FBF080;
  --haus-sand:#E7DDD2;
  --haus-grau:#A9A69D;

  /* ---------- 2. Verwendung, Hellmodus ---------- */
  --bg:#F7F3EE;            /* Seitenhintergrund */
  --sand:var(--haus-sand);
  --surface:#FFFFFF;       /* Karten, Eingabefelder */
  --ink:#1B1F33;           /* Text */
  --muted:#575B68;         /* Nebentext */
  --line:#E4DBD0;          /* feine Linien */
  --line-strong:#CDBFAF;   /* Rahmen von Feldern und Buttons */
  --accent:var(--haus-blau);       /* Überschriften, Links */
  --btn:var(--haus-blau);          /* Hauptbuttons */
  --btn-hover:#1F2655;
  --on-btn:#FFFFFF;
  --accent-soft:#E8EAF4;   /* helle Fläche in Blau, z. B. „Freigegeben“ */
  --warn:#8A3D0F;          /* Warnungen, Fehler */
  --warn-soft:#F7E4D4;
  --neutral:#4A4F59;
  --neutral-soft:#EDE7E0;
  --mark-bg:var(--haus-gelb);  /* hervorgehobene Suchbegriffe */
  --mark-ink:#1B1F33;

  /* Kopfzeile: Sand mit blauem Logo, auch im Dunkelmodus */
  --header-bg:var(--haus-sand);
  --header-ink:var(--haus-blau);
  --header-sub:#4D5370;
  --header-line:#B9AA98;
  --nav-hover:#DACDBE;
  --nav-on-bg:var(--haus-blau);
  --nav-on-ink:#FFFFFF;
  --header-input-bg:#FFFFFF;
  --header-input-ink:#1B1F33;
  --stempel-bg:var(--haus-gelb);   /* Knopf Kommen/Gehen in der Kopfzeile */
  --stempel-ink:var(--haus-blau);
  --stempel-rand:#D9CC4F;
  --stempel-an:#2E8B57;    /* grüner Punkt: eingestempelt */
  --demo-bg:#8A3D0F;       /* Streifen im Demo-Portal */
  --demo-ink:#FFFFFF;

  /* Ausdruck immer schwarz auf weiß */
  --print-bg:#FFFFFF;
  --print-ink:#000000;

  color-scheme:light;
}

/* ---------- 2. Verwendung, Dunkelmodus (folgt der Einstellung des Geräts) ---------- */
@media (prefers-color-scheme: dark){
  :root{
    --bg:#111726;
    --sand:#1B2335;
    --surface:#192134;
    --ink:#EDE7DF;
    --muted:#B4AEA6;
    --line:#2B3448;
    --line-strong:#3B465D;
    --accent:#BCC2EA;
    --btn:#4350A0;
    --btn-hover:#36418A;
    --on-btn:#FFFFFF;
    --accent-soft:#252C4F;
    --warn:#F2B27E;
    --warn-soft:#3A2618;
    --neutral:#CFC9C1;
    --neutral-soft:#262E40;
    color-scheme:dark;
  }
}
