/* ═══════════════════════════════════════════════════════════════════════════
   Stil „Nemesis Logistik“ – Dunkelblau (Nacht auf der Autobahn) und Lkw-Orange, Fahrbahnmarkierung als Akzentlinie,
   klare Barlow-Schrift. Hell und Dunkel. Basis: stil-gemeinsam.css.
   ═══════════════════════════════════════════════════════════════════════════ */

html[data-app-stil="logistik"] {
    --st-bg: #eef2f6;
    --st-flaeche: #ffffff;
    --st-flaeche-2: #e5ebf2;
    --st-text: #13243a;
    --st-text-2: #56677c;
    --st-titel: #0b2545;
    --st-akzent: #e8731a;          /* Lkw-Orange */
    --st-akzent-2: #13315c;        /* Nemesis-Blau */
    --st-auf-akzent: #ffffff;
    --st-auf-akzent-2: #ffffff;
    --st-erfolg: #2e8540;
    --st-gefahr: #c62828;
    --st-warnung: #f2b705;         /* Warnbaken-Gelb */
    --st-info: #2f6fad;
    --st-rahmen: #c9d3df;
    --st-zebra: #f5f8fb;
    --st-kopf: #0b2545;
    --st-kopf-2: #13315c;
    --st-kopf-text: #e8eef6;
    --st-kopf-text-2: #9fb3c8;
    --st-kopf-linie: #24456f;
    --st-kopf-akzent: #f28c28;
    --st-radius: 6px;
    --st-radius-gross: 8px;
    --st-schatten: 0 1px 2px rgba(11, 37, 69, .08), 0 4px 12px rgba(11, 37, 69, .06);
    --st-font-display: "Barlow", "Segoe UI", system-ui, sans-serif;
    --st-font-text: "Barlow", "Segoe UI", system-ui, sans-serif;
    --st-titel-abstand: .01em;
    --st-reiter-schrift: uppercase;
    --st-maske: rgba(11, 37, 69, .55);
    --st-tabellenkopf: #13315c;
}

html[data-app-stil="logistik"][data-bs-theme="dark"] {
    --st-bg: #0a1626;
    --st-flaeche: #0f2035;
    --st-flaeche-2: #152a44;
    --st-text: #e3ebf5;
    --st-text-2: #9fb3c8;
    --st-titel: #f28c28;
    --st-rahmen: #24456f;
    --st-zebra: #12253d;
    --st-kopf: #061120;
    --st-kopf-2: #0b1c33;
    --st-kopf-linie: #1c3657;
    --st-knopf-hell: #1b3253;
    --st-knopf-hell-text: #e3ebf5;
    color-scheme: dark;
}

/* Fahrbahnmarkierung: gestrichelte orange Linie unter dem Kopf und über der Tab-Leiste */
html[data-app-stil="logistik"] .rz-header {
    border-bottom: 0;
    background-image: repeating-linear-gradient(90deg, var(--st-kopf-akzent) 0 28px, transparent 28px 44px);
    background-size: 100% 4px;
    background-repeat: no-repeat;
    background-position: bottom;
    padding-bottom: 4px;
}

html[data-app-stil="logistik"] .app-tab-leiste {
    border-top: 0;
    background-image: repeating-linear-gradient(90deg, var(--st-kopf-akzent) 0 28px, transparent 28px 44px);
    background-size: 100% 3px;
    background-repeat: no-repeat;
    background-position: top;
}

/* Aktiver Reiter wie ein Wechselbrücken-Schild */
html[data-app-stil="logistik"] .ribbon-menu .tabs-holder .active {
    background-color: var(--st-kopf-akzent);
    color: #0b2545;
    box-shadow: none;
    font-weight: 700;
}

/* Gruppen im Ribbon: Ladebucht – dezente Kante links */
html[data-app-stil="logistik"] .ribbon-menu .content-holder .group {
    border-left: 3px solid color-mix(in srgb, var(--st-kopf-akzent) 45%, transparent);
    margin: 2px 3px;
}

/* Bunte Icons leicht entsättigen, damit sie zum Blau passen */
html[data-app-stil="logistik"] {
    --st-icon-filter: saturate(.75) brightness(1.05);
}

/* Aktiver Tab unten: oranger Reiter */
html[data-app-stil="logistik"] .app-tab.aktiv {
    background: var(--st-kopf-akzent);
    color: #0b2545;
    border-color: var(--st-kopf-akzent);
    font-weight: 600;
}

/* Dialog-Titel mit orangem Streifen links (Warnmarkierung) */
html[data-app-stil="logistik"] :is(.rz-dialog-titlebar, .rz-dialog-side-titlebar) {
    border-left: 6px solid var(--st-kopf-akzent);
}

/* Kacheln: Kopfstreifen orange */
html[data-app-stil="logistik"] .rz-card { border-top: 3px solid var(--st-akzent); }

/* Tabellenkopf blau, Hover-Zeile orange getönt */
html[data-app-stil="logistik"] .rz-grid-table thead th .rz-column-title-content { font-weight: 700; }

/* Knöpfe kantig wie Paletten */
html[data-app-stil="logistik"] {
    --st-knopf-radius: 4px;
    --st-knopf-schrift: none;
}

/* ───────── Manometer als Tacho: Chromring, Nachtblau, weiße Skala, orange Nadel, Rundumleuchte ───────── */
html[data-app-stil="logistik"] .manometer svg { filter: drop-shadow(0 4px 10px rgba(11, 37, 69, .35)); }
html[data-app-stil="logistik"] .manometer .lg-innen { fill: #0b2545; stroke: #f28c28; stroke-width: 1.2; }
html[data-app-stil="logistik"] .manometer .manometer-blatt { fill: #0e2c50; }
html[data-app-stil="logistik"] .manometer .manometer-strich { stroke: #e8eef6; }
html[data-app-stil="logistik"] .manometer .manometer-zahl { fill: #e8eef6; font-weight: 700; }
html[data-app-stil="logistik"] .manometer .manometer-titel { fill: #f28c28; letter-spacing: .12em; }
html[data-app-stil="logistik"] .manometer .manometer-betrag { fill: #9fb3c8; }
html[data-app-stil="logistik"] .manometer .manometer-fenster { fill: #061120; stroke: #f28c28; }
html[data-app-stil="logistik"] .manometer .manometer-ziffern { fill: #ffb36b; filter: drop-shadow(0 0 3px rgba(242, 140, 40, .8)); }
html[data-app-stil="logistik"] .manometer .mano-nadel { fill: #f28c28; stroke: #8a4a0c; }
html[data-app-stil="logistik"] .manometer .mano-nadel-glanz { stroke: #ffe0bf; }
html[data-app-stil="logistik"] .manometer .mano-nabe { fill: #c9d3df; stroke: #3d4a58; }
html[data-app-stil="logistik"] .manometer .mano-nabe-kern { fill: #0b2545; }
html[data-app-stil="logistik"] .manometer .lg-sockel { fill: #3d4a58; }
html[data-app-stil="logistik"] .manometer .lg-leuchte { fill: #7a4410; }
html[data-app-stil="logistik"] .manometer.erreicht .lg-leuchte { fill: #ff9a2e; animation: lg-rundum 1s steps(2) infinite; filter: drop-shadow(0 0 6px #ff9a2e); }
html[data-app-stil="logistik"] .manometer.erreicht .manometer-erreicht-text { fill: #6fdc8c; }
html[data-app-stil="logistik"] .manometer.erreicht .manometer-ziffern { fill: #6fdc8c; filter: drop-shadow(0 0 3px rgba(111, 220, 140, .8)); }
@keyframes lg-rundum { 50% { fill: #7a4410; filter: none; } }
@media (prefers-reduced-motion: reduce) { html[data-app-stil="logistik"] .manometer.erreicht .lg-leuchte { animation: none; } }