/* ==========================================================
   Design-Tokens — alle Farben, Maße und Schriften an einer
   Stelle. Wer eine Farbe ändern will, ändert sie hier, nicht
   in app.css.

   Zwei bewusst getrennte Farbwelten (übernommen aus pt-studio):

   1. PT-Chrome (--pt-*)
      Die Werkzeug-Oberfläche: Hintergrund, Text, Linien,
      Bedienelemente. Neutral und zurückhaltend, damit sie bei
      jedem Kunden funktioniert.

   2. Kunden-CI (--lb-*, --np-* …)
      Die Marke des Kunden. Nur als Akzent — aktiver Menüpunkt,
      kritischer Status. NIE flächig in der Oberfläche. Sonst
      streitet die Kundenfarbe mit dem Inhalt, und bei jedem
      neuen Mandanten müsste die halbe Oberfläche umgefärbt
      werden.
   ========================================================== */

/* DM Sans — Variable Font, lokal (kein CDN) */
@font-face {
  font-family: "DM Sans";
  src: url("../assets/fonts/DMSans.ttf") format("truetype");
  font-weight: 100 1000;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DM Sans";
  src: url("../assets/fonts/DMSans-Italic.ttf") format("truetype");
  font-weight: 100 1000;
  font-style: italic;
  font-display: swap;
}

:root {
  /* ---------- PT-Chrome (Oberfläche) ---------- */
  --pt-bg: #e8eaef;
  --pt-surface: #ffffff;
  --pt-text: #2d333f;
  --pt-text-soft: #75767a;
  --pt-line: #d0d1d3;
  --pt-line-strong: #b9babd;

  /* ---------- Kühle Grau-Rampe ---------- */
  --pt-cool-50:  #f4f5f8;
  --pt-cool-100: #edeff3;
  --pt-cool-200: #e2e5ec;
  --pt-cool-300: #d2d7e0;
  --pt-cool-400: #b3bac8;
  --pt-cool-500: #8b93a4;
  --pt-cool-600: #6b7383;
  --pt-cool-700: #4b525f;
  --pt-cool-800: #2d333f;

  /* ---------- Kunden-CI Ladenburger ---------- */
  --lb-red: #cc0c0f;
  --lb-dark: #181716;
  --lb-white: #ffffff;
  --lb-paper: #f3efe9;
  --lb-text-soft: #5d5955;
  --lb-orange: #e8620e;

  /* ---------- Status ---------- */
  --st-ok: #3f8f5d;
  --st-warn: #c98a17;
  --st-crit: var(--lb-red);
  --st-idle: var(--pt-cool-500);

  /* ---------- Action ---------- */
  --pt-action:       var(--pt-cool-800);
  --pt-action-hover: var(--pt-cool-700);

  /* ---------- Radien ---------- */
  --pt-radius-sm: 8px;
  --pt-radius-md: 12px;
  --pt-radius-lg: 20px;
  --pt-radius-full: 9999px;

  /* ---------- Schatten (sparsam) ---------- */
  --pt-shadow-card: 0 1px 3px rgba(45,51,63,0.06), 0 1px 2px rgba(45,51,63,0.04);

  /* ---------- Typografie ---------- */
  --font-sans: "DM Sans", system-ui, -apple-system, sans-serif;

  /* ---------- Layout ---------- */
  --sidebar-w: 244px;
  --page-max: 1180px;
}