/* ==========================================================================
   Meister Flink — Design Tokens
   Farben aus dem Firmenlogo abgeleitet (Blatt = grün, Haus = blau).
   Werden nach Erhalt der Original-Logodatei feinjustiert.
   ========================================================================== */

:root {
  /* --- Marke ----------------------------------------------------------- */
  --mf-gruen:        #487319;
  --mf-gruen-dunkel: #375913;
  --mf-gruen-hell:   #EDF2E4;
  --mf-blau:         #004AAD;
  --mf-blau-dunkel:  #003A87;
  --mf-blau-hell:    #E6EEF9;

  /* --- Neutrale Töne ---------------------------------------------------- */
  --n-000: #FFFFFF;
  --n-025: #FAFBFC;
  --n-050: #F4F6F8;
  --n-100: #EAEDF1;
  --n-200: #DCE1E7;
  --n-300: #C3CAD3;
  --n-400: #98A2AE;
  --n-500: #6B7683;
  --n-600: #4E5865;
  --n-700: #39424D;
  --n-800: #262D36;
  --n-900: #161B21;

  /* --- Status ----------------------------------------------------------- */
  --st-erfolg:  #1E8E4A;
  --st-warnung: #B77400;
  --st-fehler:  #C0392B;
  --st-info:    var(--mf-blau);

  /* --- Typografie ------------------------------------------------------- */
  --ff-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
           "Helvetica Neue", Arial, sans-serif;
  /* Beleg-Schrift bewusst websicher: muss im Browser UND in Dompdf
     identisch aussehen. Wird in Phase 5 durch eine eingebettete TTF ersetzt. */
  --ff-beleg: Arial, "Helvetica Neue", Helvetica, "DejaVu Sans", sans-serif;

  --fs-xs:  10.5px;
  --fs-sm:  12px;
  --fs-md:  13px;
  --fs-lg:  15px;
  --fs-xl:  18px;
  --fs-2xl: 24px;

  /* --- Abstände (4px-Raster) -------------------------------------------- */
  /* Bewusst dicht gehalten: der Editor soll ohne langes Scrollen
     ueberblickbar bleiben. */
  --sp-1: 3px;
  --sp-2: 6px;
  --sp-3: 9px;
  --sp-4: 12px;
  --sp-5: 16px;
  --sp-6: 24px;
  --sp-7: 32px;

  /* --- Radien & Schatten ------------------------------------------------ */
  --r-sm: 4px;
  --r-md: 7px;
  --r-lg: 12px;
  --sh-1: 0 1px 2px rgba(22, 27, 33, .08), 0 1px 3px rgba(22, 27, 33, .06);
  --sh-2: 0 2px 6px rgba(22, 27, 33, .08), 0 6px 16px rgba(22, 27, 33, .08);
  --sh-3: 0 8px 28px rgba(22, 27, 33, .14);

  /* --- Layout ------------------------------------------------------------ */
  --seitenleiste: 206px;
  --kopfleiste:   46px;
}