/* Colours of the platform: light (default) and dark. html[data-theme] is set before the page is drawn by the theme
   switch in layouts/_app.blade.php (Mein Konto → Darstellung: System / Hell / Dunkel, kept per device). Pages use these
   variables instead of fixed colours; PDF and e-mail templates keep fixed colours. */
:root {
    color-scheme: light;
    --bg: #f4f6f8; --surface: #fff; --surface-rgb: 255, 255, 255; --soft: #f0f4f8; --soft-2: #f5f7fa; --track: #e4e7eb;
    --text: #1f2933; --muted: #616e7c; --muted-2: #7b8794; --border: #d9e2ec; --border-soft: #eef1f4;
    --primary: #1f6feb; --primary-text: #fff; --danger: #c62828; --ok: #2e7d32;
    --warn-bg: #fff4e5; --warn-text: #8a4b00; --info-bg: #e7f0fe; --danger-bg: #fdecea; --ok-bg: #e8f5e9;
}
html[data-theme="dark"] {
    /* true black (OLED phones), cards a shade lighter so they stand out; neutral greys */
    color-scheme: dark;
    --bg: #000; --surface: #121212; --surface-rgb: 18, 18, 18; --soft: #1c1c1c; --soft-2: #171717; --track: #2b2b2b;
    --text: #ececec; --muted: #a9a9a9; --muted-2: #8a8a8a; --border: #2a2a2a; --border-soft: #1f1f1f;
    --primary: #5b9cff; --primary-text: #fff; --danger: #ff7b72; --ok: #5fd38a;
    --warn-bg: #2e2208; --warn-text: #f2c179; --info-bg: #0f2340; --danger-bg: #331414; --ok-bg: #102818;
}
html[data-theme="dark"] body { background: var(--bg); color: var(--text); }
html[data-theme="dark"] input, html[data-theme="dark"] select, html[data-theme="dark"] textarea { color: var(--text); }
html[data-theme="dark"] input::placeholder, html[data-theme="dark"] textarea::placeholder { color: var(--muted-2); }
/* the map: tiles darkened (colours turned, hues kept), controls, popups and tooltips in the dark surfaces */
html[data-theme="dark"] .leaflet-container { background: #1f1f1f; }
html[data-theme="dark"] .leaflet-tile-pane { filter: invert(1) hue-rotate(180deg) brightness(1.3) contrast(.78) saturate(.85); }
html[data-theme="dark"] #map.map-grey .leaflet-tile-pane { filter: invert(1) grayscale(1) brightness(1.3) contrast(.75); }
html[data-theme="dark"] .leaflet-bar a, html[data-theme="dark"] .leaflet-bar a:hover { background: var(--surface); color: var(--text); border-bottom-color: var(--border); }
html[data-theme="dark"] .leaflet-bar { border-color: var(--border); }
html[data-theme="dark"] .leaflet-popup-content-wrapper, html[data-theme="dark"] .leaflet-popup-tip { background: var(--surface); color: var(--text); }
html[data-theme="dark"] .leaflet-tooltip { background: var(--surface); color: var(--text); border-color: var(--border); }
html[data-theme="dark"] .leaflet-tooltip-top::before { border-top-color: var(--surface); }
html[data-theme="dark"] .leaflet-tooltip-bottom::before { border-bottom-color: var(--surface); }
html[data-theme="dark"] .leaflet-control-attribution { background: rgba(18, 18, 18, .8) !important; color: var(--muted); }
html[data-theme="dark"] .leaflet-control-attribution a { color: var(--primary); }
html[data-theme="dark"] .leaflet-control-layers, html[data-theme="dark"] .leaflet-control-scale-line { background: var(--surface); color: var(--text); border-color: var(--border); }
html[data-theme="dark"] dialog { background: var(--surface); color: var(--text); }
/* scrollbars in the dark: Edge/Chrome on Windows keep the light system scrollbar in inner scroll areas (side menu,
   panels, tables) – set them explicitly (standard property; the -webkit- rules for Safari and older browsers) */
html[data-theme="dark"], html[data-theme="dark"] * { scrollbar-color: #3a3a3a #0b0b0b; }
html[data-theme="dark"] ::-webkit-scrollbar { width: 12px; height: 12px; background: #0b0b0b; }
html[data-theme="dark"] ::-webkit-scrollbar-thumb { background: #3a3a3a; border-radius: 6px; border: 3px solid #0b0b0b; }
html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #555; }
html[data-theme="dark"] ::-webkit-scrollbar-corner { background: #0b0b0b; }
/* the 3D / follow view (MapLibre draws its own light style on a canvas): darkened like the 2D tiles; vehicle marker and
   labels are separate elements and keep their colours */
html[data-theme="dark"] #map3dCanvas .maplibregl-canvas { filter: invert(1) hue-rotate(180deg) brightness(1.3) contrast(.78) saturate(.85); }
html[data-theme="dark"] .maplibregl-ctrl-group { background: var(--surface); }
html[data-theme="dark"] .maplibregl-ctrl-group button + button { border-top-color: var(--border); }
html[data-theme="dark"] .maplibregl-ctrl-group button .maplibregl-ctrl-icon { filter: invert(1); }
html[data-theme="dark"] .maplibregl-ctrl-attrib { background: rgba(18, 18, 18, .8); color: var(--muted); }
html[data-theme="dark"] .maplibregl-ctrl-attrib a { color: var(--primary); }
/* statistics pages define their own light chart colours on .viz-root (white cards, near-black text) – in the dark they
   follow the dark surfaces, otherwise the grey sub-lines (var(--muted), light in the dark) stand on white cards */
html[data-theme="dark"] .viz-root { --surface-1: var(--surface); --text-primary: #f2f2f2; --text-secondary: #c4c4c4; --text-muted: #9a9a9a;
    --grid: #2a2a2a; --baseline: #4a4a4a; }