/* ============================================================
   LUMEN THEME — itk365
   Zusätzliches helles Farbschema (wahlbar in Einstellungen → Farbschema).
   Wirkt als CSS-Variablen-Override auf ALLE 11 Apps (Mail, Kalender,
   Kontakte, Dateien, Status, Docs, Chat, Einstellungen, Suche, Start, KI),
   ohne das Basis-Layout oder #login/.login-box anzutasten.

   Design-Sprache "BOLD BLOCK / Lumen":
   - Ein kräftiger Petrol-Anker (var(--theme-swatch)) als einzige Haupt-Akzentfarbe
   - Helle, weiße Flächen, hoher Kontrast, keine verschwommenen Grautöne
   - Dunkle Rail als Kontrast-Anker
   ============================================================ */
html[data-theme="lumen"]{
  /* Basisfarben — hell, sauber, hoher Kontrast */
  --bg:#eef1f6;          /* App-Hintergrund (helles Petrol-Lavendel) */
  --card:#ffffff;        /* Karten / Panels strahlend weiß */
  --border:#d9dee9;      /* dezente Haarlinien */
  --text:#0f172a;        /* fast-schwarz, maximaler Kontrast */
  --text2:#475569;       /* Sekundär-Text */
  --hover:#e6edf7;       /* Hover auf hellblauem Grund */

  /* EIN Haupt-Akzent: Petrol */
  --accent:#0e7490;
  --accent-dark:#0b5668;      /* dunkler Petrol */
  --accent-light:#e0f2f6;     /* heller Petrol-Lavendel für Hover/aktive */

  /* Modul-Farben (BOLD BLOCK: kräftige, gesättigte Blöcke) */
  --mail:#0e7490;        /* Petrol */
  --cal:#7c3aed;         /* Violett */
  --contact:#0f9d6c;     /* Grün */
  --file:#0b5aa0;        /* Blau */
  --wiki:#b45309;        /* Bernstein */
  --git:#334155;         /* Slate */
  --todo:#038387;        /* Petrol-Teal */
  --tow:#0e7490;         /* Petrol */

  /* App-Farben, die SEC_META als Header-Icon-Hintergrund nutzt.
     FEHLTEN BIS 2026-09-12: Chat/KI/Suche hatten dadurch ein TRANSPARENTES
     Header-Icon (var(--talk) unaufgelöst). */
  --talk:#0082c9;        /* Nextcloud-Blau (Talk) */
  --ai:#7c3aed;          /* Violett (KI-Assistent) */
  --search:#0f766e;      /* Petrol-Teal (Suche) */
  --start:#0e7490;       /* Petrol (Start) */
  --mod:var(--mail);     /* Modul-Kontext, von body[data-mod] überschrieben */

  /* Rail: dunkel als Kontrast-Anker (statt sattblau) */
  --rail:#0b2230;                /* tiefes Petrol-Dunkel */
  --rail-hover:rgba(255,255,255,.08);
  --rail-active:#12586b;         /* aktive App auf Petrol-Dunkel */

  /* Status */
  --danger:#dc2626; --danger-bg:#fee2e2;
  --ok:#0f9d6c;

  /* Schatten & Radius */
  --shadow:0 1px 2px rgba(15,20,30,.05),0 12px 34px rgba(15,20,30,.08);
  --shadow-sm:0 1px 2px rgba(15,20,30,.05),0 10px 30px rgba(15,20,30,.07);
  --radius:12px; --radius-lg:18px; --radius-pill:999px;
  --tr:.16s ease;

  /* Akzent-Vorschaupunkte im Theme-Switcher */
  --theme-swatch:#0e7490;
;--theme-swatch-line:#9ad1e0}

/* Sanfte Anpassung, damit der Petrol-Anker überall sauber sitzt
   (aktive Nav, Primary-Buttons, Links, Fokus-Ringe nutzen var(--accent)) */
html[data-theme="lumen"] .rail{background:var(--rail) !important}
html[data-theme="lumen"] .rail .app-ic.active,
html[data-theme="lumen"] .rail .nav-ic.active{background:var(--rail-active) !important}

html[data-theme="lumen"] .ds-chip.active{border-color:var(--accent);background:var(--accent-light);color:var(--accent)}

/* Theme-Auswahl-Punkt im Einstellungen-Switcher */
html[data-theme="lumen"] .theme-dot{background:var(--theme-swatch) !important;border:1px solid var(--theme-swatch-line) !important}

/* ============================================================
   LUMEN — MAIL: gesplittete Farb-Schlitze, Petrol-Anker, Kontofarben
   (nur Layout-Feinschliff; bricht keine Struktur)
   ============================================================ */
/* Aktiv/ungelesen klar unterscheidbar (Outlook-Web-Muster):
   - SEL (gerade geöffnet): SATTER, einheitlicher Akzent-Hintergrund (dominant)
   - UNREAD (ungelesen): Fettdruck, KEIN Hintergrund-Schlitz */
html[data-theme="lumen"] .mail-item.sel::before{opacity:1;background:var(--accent);width:4px;box-shadow:0 0 8px rgba(14,116,144,.4)}
html[data-theme="lumen"] .mail-item.unread::before{opacity:0}
html[data-theme="lumen"] .mail-item.sel{background:color-mix(in srgb,var(--accent) 24%,var(--card))}
html[data-theme="lumen"] .mail-item.sel:hover{background:color-mix(in srgb,var(--accent) 28%,var(--card))}
html[data-theme="lumen"] .mail-item.unread{background:color-mix(in srgb,var(--accent) 9%,var(--card))}
html[data-theme="lumen"] .mail-item.unread:hover{background:color-mix(in srgb,var(--accent) 12%,var(--card))}
html[data-theme="lumen"] .mail-item.unread .from{font-weight:700;color:var(--text)}
html[data-theme="lumen"] .mail-item.unread .subj{font-weight:700;color:var(--text)}
html[data-theme="lumen"] .mail-item.unread .time{font-weight:700;color:var(--accent)}
html[data-theme="lumen"] .mail-item.sel .from{color:var(--accent-dark);font-weight:700}
html[data-theme="lumen"] .mail-item.sel .subj{color:var(--text);font-weight:600}

/* Ordner-Aktiv als Petrol, Kontonamen kräftig */
html[data-theme="lumen"] .mt-f.active{background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent)}
html[data-theme="lumen"] .mtc-acc-txt .mtc-acc-name{color:var(--text)}
html[data-theme="lumen"] .mt-cnt.active{background:var(--accent);color:#fff}

/* Mail-Listen-Header + Quickfilters konsistent hell */
html[data-theme="lumen"] .mail-quickfilters{background:var(--card)}

/* Einladungs-/Web-Conf-Kachel im Mail-Detail: voller Farbblock links */
html[data-theme="lumen"] .ics-hb{padding:14px;border-radius:var(--radius);background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow)}

/* Kräftige Account-Avatare (Kontofarben) im Multi-Account-Tree */
html[data-theme="lumen"] .mtc-av{border-radius:8px;box-shadow:0 2px 8px rgba(14,116,144,.3)}