/* =====================================================================
   Truck VM – Theme-Schicht für Twenty 2.46 (PoC, Stand 19.10.2026)
   ---------------------------------------------------------------------
   Drei Dateien, vom Reverse Proxy vor </head> eingefügt (theme/nginx):
     1. truckvm-palette.css   GENERIERT: alle Farbskalen und Tag-Farben auf
                              Grau, warme Töne und Blau auf Terrakotta
     2. truckvm-theme.css     diese Datei: semantische Tokens (Akzent,
                              Auswahl, Gefahr, Flächen, Hinweise)
     3. truckvm-brand-fragile.css  Logo, Seitenleiste, Reiter – greift auf
                              interne Struktur zu, je Regel kommentiert

   Technischer Hintergrund (verifiziert 19.10.2026, Server 2.46.0):
   - twenty-ui definiert 1.000 Tokens auf html.light bzw. html.dark;
     twenty-front liest sie zur Laufzeit (computeThemeFromCss), Emotion-
     Styles nutzen var(--t-…). Overrides auf html.light wirken überall,
     auch in Front-Komponenten.
   - Kein Fork: Twenty, Image und Datenbank bleiben unverändert.

   Farblogik (Michel 17./19.10.2026, verschärft Christian 19.10.2026):
   - Nur Schwarz, Weiß, Silber und Terrakotta. Keine anderen Farben,
     auch nicht in Tags, Icons, Diagrammen (→ truckvm-palette.css).
   - Terrakotta trägt Primäraktion, Auswahl, Fokus, Gefahr/überfällig,
     Pflicht. Text bleibt Schwarz/Grau.
   - Schriftfamilie, Schriftgrößen, Abstände, Radien: unverändert.

   Werte aus dem PDF v2 exakt ausgelesen. CI-Werte von Michel nur hier
   in :root ändern.
   ===================================================================== */

:root {
  --tvm-black: #141413;
  --tvm-graphite: #1a1a1a;
  --tvm-graphite-hover: #2e2e2e;
  --tvm-text-secondary: #595959;
  --tvm-silver: #a6a6a6;
  --tvm-silver-medium: #b4b4b4;
  --tvm-silver-light: #e7e6e6;
  --tvm-surface: #f4f4f4;
  --tvm-surface-light: #f9f9f9;

  --tvm-lead: #a8432a;             /* Terrakotta: Knöpfe, Zahlen, Markierungen */
  --tvm-lead-hover: #8f3823;
  --tvm-lead-light: #d97757;       /* Punkte, Balken, Icons                     */
  --tvm-lead-tint: #fbeee8;        /* Badge-/Hinweisflächen                     */
  --tvm-lead-tint-strong: #f8e3dc;
  --tvm-lead-border: #f3d2c8;
  --tvm-lead-text-dark: #5c2d18;   /* Text auf Terrakotta-Fläche                */

  --tvm-logo-url: url("/truckvm-logo.png");
}

/* =====================================================================
   HELLER MODUS (Standard für Truck VM, Nutzer fest auf „Hell“)
   ===================================================================== */
html.light {
  /* Primäraktion, aktive Filter, Fokus, Häkchen, Links: Terrakotta
     (--t-color-blue selbst setzt truckvm-palette.css, hier die Begleiter) */
  --t-border-color-blue: var(--tvm-lead-light);

  /* Auswahlflächen (aktive Chips, markierte Zeilen, Hover): Terrakotta-Tints */
  --t-accent-primary: var(--tvm-lead-tint-strong);
  --t-accent-secondary: var(--tvm-lead-tint-strong);
  --t-accent-tertiary: var(--tvm-lead-tint);
  --t-accent-quaternary: #fdf5f2;
  --t-accent-accent1: #fefaf8;
  --t-accent-accent2: #fdf5f2;
  --t-accent-accent3: var(--tvm-lead-tint);
  --t-accent-accent4: var(--tvm-lead-tint-strong);
  --t-accent-accent5: var(--tvm-lead-border);
  --t-accent-accent6: #ecc0b2;
  --t-accent-accent7: #e3a994;
  --t-accent-accent8: var(--tvm-lead-light);
  --t-accent-accent9: var(--tvm-lead);
  --t-accent-accent10: var(--tvm-lead-hover);
  --t-accent-accent11: var(--tvm-lead-hover);
  --t-accent-accent12: var(--tvm-lead-text-dark);
  --t-accent-accent3570: var(--tvm-lead-light);
  --t-accent-accent4060: var(--tvm-lead-light);

  /* Gefahr / überfällig / Pflicht */
  --t-font-color-danger: var(--tvm-lead);
  --t-border-color-danger: var(--tvm-lead-border);
  --t-background-danger: var(--tvm-lead-tint);

  /* Hinweise (Snackbars): nur Terrakotta oder neutral */
  --t-snack-bar-info-color: var(--tvm-graphite);
  --t-snack-bar-info-background-color: #0000000d;
  --t-snack-bar-success-color: var(--tvm-graphite);
  --t-snack-bar-success-background-color: #0000000d;
  --t-snack-bar-warning-color: var(--tvm-lead);
  --t-snack-bar-warning-background-color: #a8432a14;
  --t-snack-bar-error-color: var(--tvm-lead);
  --t-snack-bar-error-background-color: #a8432a14;

  /* Flächen: Seitenleiste und Seitenhintergrund weiß wie im Entwurf
     (Twenty: hellgrau). Trennung übernimmt der Rahmen des Inhaltsbereichs. */
  --t-background-tertiary: #ffffff;
  --t-background-secondary: #ffffff;
  --t-border-color-light: var(--tvm-silver-light);
  --t-border-color-medium: var(--tvm-silver-light);
  --t-border-color-strong: #d6d6d6;

  /* Bewusst NICHT geändert: --t-font-family, --t-font-size-*, --t-spacing-*,
     --t-border-radius-* (Michel: „Twentys Raster bleibt“). */
}

/* =====================================================================
   DUNKLER MODUS – nicht genutzt, nur „nicht kaputt“
   ===================================================================== */
html.dark {
  --t-border-color-blue: var(--tvm-lead-light);
  --t-accent-primary: #3a241c;
  --t-accent-secondary: #3a241c;
  --t-accent-tertiary: #2b1a14;
  --t-accent-quaternary: #211612;
  --t-accent-accent1: #1c1411;
  --t-accent-accent2: #211612;
  --t-accent-accent3: #2b1a14;
  --t-accent-accent4: #3a241c;
  --t-accent-accent5: #4a2c21;
  --t-accent-accent6: #5c2d18;
  --t-accent-accent7: #8f3823;
  --t-accent-accent8: #a8432a;
  --t-accent-accent9: #d97757;
  --t-accent-accent10: #e3a994;
  --t-accent-accent11: #ecc0b2;
  --t-accent-accent12: #f3d2c8;
  --t-accent-accent3570: #a8432a;
  --t-accent-accent4060: #a8432a;
  --t-font-color-danger: var(--tvm-lead-light);
  --t-border-color-danger: #5c2d18;
  --t-background-danger: #2b1a14;
  --t-snack-bar-info-color: #e6e6e6;
  --t-snack-bar-info-background-color: #ffffff14;
  --t-snack-bar-success-color: #e6e6e6;
  --t-snack-bar-success-background-color: #ffffff14;
  --t-snack-bar-warning-color: var(--tvm-lead-light);
  --t-snack-bar-warning-background-color: #d9775724;
  --t-snack-bar-error-color: var(--tvm-lead-light);
  --t-snack-bar-error-background-color: #d9775724;
}
