/* Reimers Data Core – Theme.
   Die einzige Stelle mit festen Werten für Farben, Schriften, Abstände, Rundungen und Schatten.
   Regeln und Palette: DESIGN.md. Ein anderer Händler bekommt eine andere Theme-Datei. */
:root {
    /* ---- Farben: Flächen und Text */
    --farbe-grund: #f4f5f7;
    --farbe-flaeche: #ffffff;
    --farbe-flaeche-leise: #eef1f5;
    --farbe-flaeche-zart: #f8f9fb;
    --farbe-text: #1c2430;
    --farbe-text-leise: #5b6676;
    --farbe-text-auf-farbe: #ffffff;
    --farbe-linie: #d9dde3;
    --farbe-linie-eingabe: #b8bfc9;
    --farbe-link: #1a5a96;
    --farbe-akzent: #f0a500;

    /* ---- Farben: Meldungen und Zustände */
    --farbe-rot: #c0392b;
    --farbe-rot-hell: #fdecea;
    --farbe-gelb: #b7791f;
    --farbe-gelb-hell: #fff6e0;
    --farbe-gelb-dunkel: #8a5a00;
    --farbe-gruen: #2f7d4f;
    --farbe-gruen-hell: #e8f5ee;
    --farbe-blau-hell: #eef4fb;
    --farbe-blau-linie: #b9d2ec;
    --farbe-ansicht-balken: #fff1c2;

    /* ---- Farben: Menü links */
    --farbe-menue: #1f2733;
    --farbe-menue-hervor: #2c3644;
    --farbe-menue-text: #e6eaf0;
    --farbe-menue-text-leise: #9aa5b5;

    /* ---- Farben: Bereiche (Bereichsumschalter, Menü, Kacheln) */
    --farbe-bereich-standard: #4a5a6a;
    --farbe-bereich-verkauf: #1f6fb2;
    --farbe-bereich-service: #0f8a7e;
    --farbe-bereich-werkstatt: #c2571a;
    --farbe-bereich-planung: #7a4fb5;
    --farbe-bereich-wagenpflege: #2e8b3d;
    --farbe-bereich-lager: #8a6d1a;
    --farbe-bereich-vermietung: #b03a6b;
    --farbe-bereich-verwaltung: #4a5a6a;
    --farbe-bereich-fahrer: #34718f;
    /* Farbe des gerade gezeigten Bereichs; wird unten je Bereich gesetzt. */
    --bereich: var(--farbe-bereich-standard);

    /* ---- Schrift */
    --schrift-familie: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --schrift-basis: 16px;
    --schrift-070: .7rem;
    --schrift-078: .78rem;
    --schrift-080: .8rem;
    --schrift-082: .82rem;
    --schrift-085: .85rem;
    --schrift-088: .88rem;
    --schrift-090: .9rem;
    --schrift-092: .92rem;
    --schrift-095: .95rem;
    --schrift-100: 1rem;
    --schrift-115: 1.15rem;
    --schrift-120: 1.2rem;
    --schrift-140: 1.4rem;
    --schrift-160: 1.6rem;
    --schrift-200: 2rem;
    --schrift-halbfett: 600;
    --schrift-fett: 700;

    /* ---- Abstände (Zahl = Hundertstel rem, z. B. 050 = 0,5 rem) */
    --abstand-010: .1rem;
    --abstand-015: .15rem;
    --abstand-020: .2rem;
    --abstand-025: .25rem;
    --abstand-030: .3rem;
    --abstand-040: .4rem;
    --abstand-050: .5rem;
    --abstand-055: .55rem;
    --abstand-060: .6rem;
    --abstand-070: .7rem;
    --abstand-080: .8rem;
    --abstand-090: .9rem;
    --abstand-100: 1rem;
    --abstand-120: 1.2rem;
    --abstand-140: 1.4rem;
    --abstand-150: 1.5rem;
    --abstand-160: 1.6rem;
    --abstand-200: 2rem;
    --abstand-600: 6rem;
    --abstand-700: 7rem;

    /* ---- Rundungen */
    --rundung-xs: 4px;
    --rundung-s: 6px;
    --rundung-m: 8px;
    --rundung-l: 10px;
    --rundung-xl: 12px;
    --rundung-rund: 50%;

    /* ---- Schatten */
    --schatten-s: 0 4px 14px rgba(0,0,0,.1);
    --schatten-m: 0 4px 16px rgba(0,0,0,.18);
    --schatten-l: 0 8px 24px rgba(0,0,0,.15);
    --schatten-xl: 0 10px 34px rgba(0,0,0,.25);

    /* ---- Maße des Rahmens */
    --menue-breite: 250px;
}

/* Farbe je Bereich. Der Rahmen bekommt die Klasse "bereich-<name>". */
.bereich-verkauf { --bereich: var(--farbe-bereich-verkauf); }
.bereich-service { --bereich: var(--farbe-bereich-service); }
.bereich-werkstatt { --bereich: var(--farbe-bereich-werkstatt); }
.bereich-planung { --bereich: var(--farbe-bereich-planung); }
.bereich-wagenpflege { --bereich: var(--farbe-bereich-wagenpflege); }
.bereich-lager { --bereich: var(--farbe-bereich-lager); }
.bereich-vermietung { --bereich: var(--farbe-bereich-vermietung); }
.bereich-verwaltung { --bereich: var(--farbe-bereich-verwaltung); }
.bereich-fahrer { --bereich: var(--farbe-bereich-fahrer); }