/* ===========================================================================
   MARKE — die zentrale Farb- und Schriftdatei
   ===========================================================================

   Grundgesetz aus MD Personal/01_DESIGNSYSTEM.md: kein Modul schreibt Hex-Werte
   in seine eigenen Dateien. Alles kommt von hier.

   Die Werte sind nicht neu erfunden, sondern aus den bestehenden Dateien
   uebernommen:
     - Markenfarben und Schriften aus public/css/site.css (:root)
     - Ampel und Flaechen aus public/css/admin.css (:root)

   Warum eine eigene Datei und nicht einfach site.css mitladen: site.css bringt
   1200 Zeilen Landingpage-Gestaltung mit, die im Mitarbeiter-Bereich nichts
   verloren haben. Hier stehen nur die Tokens.

   Wer Farben aendert, aendert sie HIER — und nirgends sonst.
   =========================================================================== */

:root {
  /* --- Nachtflaechen: Nachthimmel und Schattenpartien des Wappens --------- */
  --nacht:         #0d2c52;
  --tanne-tief:    #123a68;
  --tanne:         #143f74;
  --tanne-hell:    #1d5fa5;

  /* --- Marken-Akzente: Kupfer der Ornamente, Petrol der Bogenfuellung ----- */
  --bordeaux:      #1a6aa8;
  --bordeaux-hell: #2a86c8;
  --bordeaux-tief: #114b7c;
  --gold:          #2ec2d7;
  --gold-hell:     #dcf0f8;
  --gold-tief:     #1a9cb4;
  --petrol:        #1f4a70;
  --petrol-hell:   #2f6798;

  /* --- Helle Flaechen: das Cremeweiss des Spruchbands --------------------- */
  --creme:         #f2f7fc;
  --creme-tief:    #e4eef8;
  --weiss:         #ffffff;

  /* --- Text --------------------------------------------------------------- */
  --text:          #0f1620;
  --text-leise:    #6d7d8e;
  --text-hell:     #eef4fa;

  /* --- Linien und Flaechen ------------------------------------------------ */
  --flaeche:       #f2f7fc;
  --karte:         #ffffff;
  --linie:         #e7eef5;
  --linie-satt:    #d2dfeb;

  /* --- AMPEL (Design-System Abschnitt 3) ----------------------------------
     Gruen  = alles gut / erledigt / genug Personal / anwesend
     Gelb   = Achtung / fehlt noch etwas / knapp
     Rot    = Problem / fehlt / unterbesetzt / niemand da
     Immer zusammen mit Symbol UND Wort verwenden, nie Farbe allein.        */
  --gruen:         #17a67b;
  --gruen-flaeche: #ddf5ea;
  --gruen-tief:    #0f8a66;
  --gelb:          #c08415;
  --gelb-flaeche:  #fdf3de;
  --gelb-tief:     #8a5f10;
  --rot:           #c0453d;
  --rot-flaeche:   #fde9e7;
  --rot-tief:      #a83a33;
  --info:          #1e7bc4;
  --info-flaeche:  #e9f3fb;

  /* --- Schrift ------------------------------------------------------------
     Dieselben Schriften wie im uebrigen Backend (`public/css/admin.css`).
     Die Marken-Schriften der oeffentlichen Seite (Foremost/Jost) sind hier
     bewusst NICHT im Einsatz: das Personalmodul ist Verwaltung, kein
     Aushaengeschild, und soll sich fuer die Marktleitung anfuehlen wie die
     Buchhaltung nebenan. Wer die Werte aendert, aendert sie in beiden Dateien. */
  /*
     Jost — dieselbe geometrische Grotesk wie in der Verwaltung seit dem Umbau
     vom 16.08.2026. Georgia als Titelschrift ist damit hinfaellig: die Vorlage
     kennt keine Serifen. Die Schriftdateien liegen lokal, eingebunden ueber
     public/css/fonts.css.
  */
  --display: 'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --sans: 'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --mono: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;

  /* --- Groessen ------------------------------------------------------------
     Grundschrift mind. 16px, im Mitarbeiter-Bereich 18px (Abschnitt 4).     */
  --schrift-klein:  15px;
  --schrift-normal: 17px;
  --schrift-gross:  19px;
  --schrift-titel:  26px;
  --schrift-riesig: 34px;

  /* --- Abstaende: luftig, nichts gedraengt (Abschnitt 4) ------------------ */
  --luft-1: 6px;
  --luft-2: 12px;
  --luft-3: 20px;
  --luft-4: 32px;
  --luft-5: 48px;

  /* --- Rundungen und Schatten ---------------------------------------------
     Buttons ragen sichtbar aus der Seite heraus (Abschnitt 2).             */
  --rund:       14px;
  --rund-gross: 22px;
  --rund-voll:  999px;
  --schatten:        0 2px 6px rgba(16, 42, 74, 0.08), 0 8px 24px rgba(16, 42, 74, 0.06);
  --schatten-knopf:  0 4px 0 rgba(0, 0, 0, 0.16), 0 8px 20px rgba(16, 42, 74, 0.18);
  --schatten-tief:   0 24px 60px rgba(0, 0, 0, 0.45);

  /* --- Tippflaechen: mind. 56px hoch auf dem Handy (Abschnitt 2) ---------- */
  --knopf-hoehe:       56px;
  --knopf-hoehe-gross: 72px;

  --breite-inhalt: 620px;   /* Mitarbeiter-Bereich, eine Spalte */
  --breite-cockpit: 1180px; /* Admin */
}
