/*
 * Job-Union BMS – Designtokens
 * Quelle: Job-Union_BMS_Designrichtlinien.md (Stand 05.10.2026)
 *
 * Das ist die einzige Stelle, an der Farb- und Maßwerte als Hex bzw. Pixel stehen. Seiten-CSS und
 * Komponenten verwenden nur Variablen. Die bisherigen --ju-color-* in components.css werden hier
 * zentral auf diese Werte abgebildet (Tabelle in docs/ui-components.md).
 *
 * Wird zusammen mit components.css global geladen (LCM\UI\Components::enqueueStyles()) und kann von
 * Seitenleiste und Kopfzeile allein verwendet werden.
 */
:root {
  --brand-500: #55bac4;
  --brand-600: #559fa8;
  --sidebar-top: #000000;
  --sidebar-bottom: var(--brand-500);
  --sidebar-active: rgba(255, 255, 255, 0.14);
  --sidebar-footer-bg: rgba(0, 0, 0, 0.4);
  --petrol-900: #0f3b45;
  --petrol-800: #174b56;
  --petrol-700: #1d5561;
  --petrol-600: #1f6f7a;
  --petrol-650: #14525b;
  --petrol-100: #e2f1f3;
  --petrol-50: #eef7f8;
  --orange-500: #ffb400;
  --orange-600: #e6a200;
  --on-orange: #0f3b45;
  --ink: #1c2a30;
  --ink-secondary: #3d4f56;
  --ink-muted: #5f7178;
  --surface-page: #f5f7f7;
  --surface-card: #ffffff;
  --surface-muted: #f7f9f9;
  --surface-tag: #eef1f2;
  --border: #e3e8ea;
  --border-input: #d6dee1;
  --border-strong: #c7d3d7;
  --sidebar-text: #dbe9ec;
  --sidebar-muted: #9fc3ca;
  --sidebar-divider: rgba(255, 255, 255, 0.16);
  --success-bg: #e3f4e7;
  --success-fg: #1e6b33;
  --success-dot: #2e8b47;
  --danger-bg: #fdecea;
  --danger-fg: #b3261e;
  --note-bg: #fff8ea;
  --note-border: #f3dfb2;
  --note-chip-border: #e6cf97;
  --note-fg: #5c4a1f;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 10px;
  --radius-xl: 14px;
  --radius-pill: 999px;
  --control-height: 40px;
  --header-height: 56px;
  --sidebar-width: 232px;
  --list-width: 320px;
  --border-width: 1px;
  --sidebar-gradient: linear-gradient(180deg, #000000 0%, #55bac4 100%);
  --font-sans: Poppins, system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Ergänzungen, die der Entwurf nicht benennt, aber die Bausteine brauchen */
  --disabled-fg: #8a999f;
  --success-border: #b9e3c6;
  --danger-border: #f5c2bd;
  --focus-ring: rgba(31, 111, 122, 0.18);
  --danger-ring: rgba(179, 38, 30, 0.18);
  --overlay: rgba(15, 59, 69, 0.5);
  --shadow-popover: 0 8px 24px rgba(15, 59, 69, 0.12);
}

/*
 * Schrift: Poppins, lokal ausgeliefert (kein Google-Fonts-Link, Datenschutz).
 * Nur Latin-Teilmenge (enthält ä, ö, ü, ß). Lizenz: SIL Open Font License 1.1, siehe assets/fonts/README.md.
 */
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/poppins-latin-400-normal.woff2") format("woff2");
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/poppins-latin-500-normal.woff2") format("woff2");
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/poppins-latin-600-normal.woff2") format("woff2");
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/poppins-latin-700-normal.woff2") format("woff2");
}