/* ============================================================
   Boproma — Core-Default-Skin (dunkel)
   ------------------------------------------------------------
   Token-Basis aller Module. Lädt im :root und gilt damit immer,
   auch wenn das aktive Theme keine eigenen Skins anbietet.
   Theme-Skins überschreiben über [data-skin="..."]-Selektor
   selektiv einzelne Tokens; nicht überschriebene Werte fallen
   auf diese Datei zurück.
   ============================================================ */

:root {
	color-scheme: dark;

	/* ----------------------------------------------------------
	   Layout-Schienen — rem-basiert, damit Browser-Zoom skaliert.
	   Werte 1:1 von der ursprünglichen Pixel-Variante übernommen
	   (16px Default-Schrift = 1rem).
	   ---------------------------------------------------------- */
	--sl-breite:      15.625rem;  /* Seitenleiste ausgeklappt (~250px) */
	--sl-schmal:       3.75rem;   /* Seitenleiste eingeklappt (~60px) */
	--kz-hoehe:        3.5rem;    /* Mobile Kopfzeile (~56px) */
	--uebergang:      0.28s ease;
	--untermenue-max-hoehe: 37.5rem;  /* ~600px */

	/* ----------------------------------------------------------
	   Spacing-Skala — 4er-Raster, rem-basiert.
	   Faustregel: --abst-N entspricht N×4px bei Default-Schrift.
	   ---------------------------------------------------------- */
	--abst-1:   0.25rem;   /*  4px */
	--abst-2:   0.5rem;    /*  8px */
	--abst-3:   0.75rem;   /* 12px */
	--abst-4:   1rem;      /* 16px */
	--abst-5:   1.25rem;   /* 20px */
	--abst-6:   1.5rem;    /* 24px */
	--abst-8:   2rem;      /* 32px */
	--abst-10:  2.5rem;    /* 40px */
	--abst-12:  3rem;      /* 48px */
	--abst-16:  4rem;      /* 64px */

	/* ----------------------------------------------------------
	   Schrift-Skala — rem-basiert, am Browser-Default ausgerichtet.
	   ---------------------------------------------------------- */
	--text-xs:    0.75rem;    /* 12px — Hilfetexte, Footer */
	--text-sm:    0.875rem;   /* 14px — Tabellen, Sekundär-Inhalt */
	--text-base:  1rem;       /* 16px — Standard-Fließtext */
	--text-md:    1.125rem;   /* 18px — leicht hervorgehoben */
	--text-lg:    1.25rem;    /* 20px — Untertitel */
	--text-xl:    1.5rem;     /* 24px — Sektions-Überschriften */
	--text-2xl:   2rem;       /* 32px — Hauptüberschriften */

	/* ----------------------------------------------------------
	   Container-Breiten:
	     - Lese-Container in `ch` (Zeichenbreite — bestmögliche
	       Lesbarkeit, skaliert mit Schriftgröße).
	     - App-Schiene in `clamp()` für responsive Maximalbreite.
	   ---------------------------------------------------------- */
	--breite-text-eng:    50ch;    /* Login-Karten, schmale Formulare */
	--breite-text-mittel: 65ch;    /* Standard-Inhaltskarten */
	--breite-text-weit:   80ch;    /* Beiträge, lange Texte */
	--breite-app-max:     clamp(60rem, 90vw, 90rem);

	/* ----------------------------------------------------------
	   Borders, Radien, Schatten — bewusst in px.
	   Bei Hairlines verschwinden rem-Werte je nach Zoom visuell;
	   Borders sollen pixel-präzise bleiben.
	   ---------------------------------------------------------- */
	--border-fein:    1px;
	--border-mittel:  2px;
	--radius-sm:      2px;
	--radius-md:      4px;
	--radius-lg:      8px;
	--radius-xl:      12px;
	--radius-pille:   999px;
	--radius-rund:    50%;

	--f-hintergrund:  #1e1e2e;
	--f-seitenleiste: #181825;
	--f-text:         #cdd6f4;
	--f-text-schwach: #6c7086;
	--f-aktiv:        #89b4fa;
	--f-aktiv-text:   #1e1e2e;
	--f-hover:        #313244;
	--f-border:       #45475a;
	--f-untermenue:   rgba(0, 0, 0, 0.2);
	--f-tooltip-bg:   #313244;
	--f-tooltip-text: #ffffff;
	--f-status-aktiv:       #a6e3a1;
	--f-status-inaktiv:     #6c7086;
	--f-status-ausstehend:  #f9e2af;
	--f-status-neu:         #94e2d5;
	--f-status-hinweis:     #cba6f7;
	--f-meldung-info:       #a6e3a1;
	--f-meldung-warnung:    #f9e2af;
	--f-meldung-fehler:     #f38ba8;

	/* Semantik-Aliase für modulweite Status-Farben */
	--f-info:    var(--f-meldung-info);
	--f-warnung: var(--f-meldung-warnung);
	--f-fehler:  var(--f-meldung-fehler);
	--f-gefahr:  var(--f-meldung-fehler);
	--f-erfolg:  var(--f-meldung-info);
	--f-akzent:  #fab387;          /* Orange/„Hoch"-Priorität, Wiedervorlage */
	--f-gedaempt: var(--f-text-schwach);

	/* SLA-Ampel (Tickets) */
	--f-sla-gruen: #40a02b;
	--f-sla-gelb:  #df8e1d;
	--f-sla-rot:   #d20f39;
}
