/* ==========================================================================
   Abteilungsfarben (v304): Jede Verwaltungsseite trägt oben die Farbe ihrer
   Hub-Kachel (HB_BEREICHE in hub.html), "sehr ruhig" – mit Schiefergrau
   gedämpft, Glas etwas blauer. Gesetzt über <html data-abt="…"> im HTML
   (Lager: glas-admin.html setzt es früh im <head> bei ?app=lager).
   NUR Farbe: Kopf, Statusleiste (App-Modus), "Neu"-Knopf und markierter Punkt
   der Seitenleiste bzw. Handy-Leiste. Mitarbeiter-Apps haben kein data-abt.
   --abt1 = hell (Verlauf oben links), --abt2 = dunkel (Verlauf, Knöpfe, Text).
   ========================================================================== */
html[data-abt="glas"]          { --abt1: #517b9f; --abt2: #214f77; --abt-txt: #9cc3e6; }
html[data-abt="kalender"]      { --abt1: #539291; --abt2: #236968; --abt-txt: #8fd0cb; }
html[data-abt="lager"]         { --abt1: #7a72b9; --abt2: #4e4694; --abt-txt: #bdb6ee; }
html[data-abt="graffiti"]      { --abt1: #a15a99; --abt2: #792b70; --abt-txt: #e2a8d6; }
html[data-abt="checkins"]      { --abt1: #549777; --abt2: #246e4b; --abt-txt: #94d3b1; }
html[data-abt="einstellungen"] { --abt1: #737d86; --abt2: #46515c; --abt-txt: #c2cbd4; }

/* Kopf (alle Seiten, auch dunkel – der Kopf war schon immer in beiden Modi gleich) */
html[data-abt] .app-header,
html[data-abt] .ci-head,
html.dark[data-abt] .ci-head { background: linear-gradient(135deg, var(--abt1) 0%, var(--abt2) 100%); }
/* Statusleiste am iPhone im App-Modus */
html.app-mode[data-abt] body::before { background: var(--abt2); }

/* Seitenleiste am Laptop: großer "Neu"-Knopf + markierter Punkt */
html[data-abt] .glas-side-neu,
html[data-abt] .gr-side-neu { background: var(--abt2); }
html[data-abt] .glas-side-nav.on,
html[data-abt] .gr-side-nav.on,
html[data-abt] .est-nav.on { background: color-mix(in srgb, var(--abt2) 11%, transparent); color: var(--abt2); }
html.dark[data-abt] .glas-side-nav.on,
html.dark[data-abt] .gr-side-nav.on,
html.dark[data-abt] .est-nav.on { background: color-mix(in srgb, var(--abt1) 22%, transparent); color: var(--abt-txt); }

/* Leiste unten am Handy: aktiver Reiter */
html[data-abt] .gr-tab.active,
html[data-abt] .glas-bottomnav .tab-btn.active { color: var(--abt2); border-bottom-color: var(--abt2); }
html.dark[data-abt] .gr-tab.active,
html.dark[data-abt] .glas-bottomnav .tab-btn.active { color: var(--abt-txt); }

/* Geöffneter Graffiti-Schein (v315): Kopf in Graffiti-Lila statt Blau – in der Verwaltung
   (graffiti.html) und bei den Mitarbeitern (mitarbeiter.html, schein.html) gleich */
html[data-abt="graffiti"] .sm-kopf { background: linear-gradient(150deg, #792b70, #a15a99); }