/* ============================================================
   app.css — zentrale Zusatz-Styles (v1.1)
   ------------------------------------------------------------
   Enthält den DARK MODE für alle Seiten.
   • Wird in jeder Seite NACH dem eigenen <style> eingebunden,
     damit diese Regeln im Dunkelmodus greifen.
   • Aktiv nur bei "screen" + Systemeinstellung "dunkel":
     -> Heller Modus bleibt 1:1 wie bisher.
     -> Der Ausdruck (Druckansicht) bleibt immer weiß.
   ============================================================ */

@media screen and (prefers-color-scheme: dark) {

    /* ── Grundflächen ── */
    body { background: #14161b; color: #e8eaf0; }

    /* ── Kopfzeile (Kalender / Tag / Admin) ── */
    .header { background: #1e2129; box-shadow: 0 2px 12px rgba(0,0,0,0.45); }
    .header-title { color: #e8eaf0; }
    .header-sub  { color: #8e9aaf; }
    .btn-back, .nav-btn { background: #2a2e38; color: #6aa5e8; }

    /* Logos im Dunkeln auf hellem Chip, damit sie sichtbar bleiben */
    .header-logo, .logo img { background: #ffffff; border-radius: 6px; padding: 3px; }

    /* ── Kalender ── */
    .tag-karte { background: #1e2129; box-shadow: 0 2px 10px rgba(0,0,0,0.4); }
    .datum-zahl { color: #e8eaf0; }
    .tag-karte.heute { box-shadow: 0 0 0 2px rgba(58,123,213,0.5); }
    .tag-karte.feiertag { background: linear-gradient(135deg, #3a2630, #34201f); border-color: #7a2f2f; }
    .feiertag .datum-zahl { color: #ff8f87; }

    .pill.ok     { background: #16361f; color: #7fe0a0; }
    .pill.offen  { background: #3a1f1f; color: #ff9b91; }
    .pill.allein { background: #2a2e38; color: #9aa4b2; }

    .legende-box { background: #1e2129; box-shadow: 0 2px 10px rgba(0,0,0,0.4); }
    .legende-item { color: #c4c9d4; }

    .statistik { background: #1e2129; box-shadow: 0 2px 10px rgba(0,0,0,0.4); }
    .statistik-box.rot   { background: #2e1c1c; border-color: #5a2a2a; }
    .statistik-box.gruen { background: #16301f; border-color: #26512f; }
    .statistik-box.blau  { background: #16243a; border-color: #244a78; }
    .statistik-label { color: #c4c9d4; }

    .footer { background: #1e2129; box-shadow: 0 -2px 12px rgba(0,0,0,0.45); }
    .footer-user { color: #c4c9d4; }
    .btn-logout { background: #2a2e38; color: #c4c9d4; }

    /* ── Tagesseite (tag.php) ── */
    .datum-block { background: #1e2129; box-shadow: 0 2px 12px rgba(0,0,0,0.4); }
    .datum-block.feiertag-block { background: linear-gradient(135deg, #2a1c1f, #1e2129); border-color: #7a2f2f; }
    .datum-vollst { color: #e8eaf0; }
    .hinweis-box { background: #3a3220; border-color: #7a6320; }
    .hinweis-text { color: #f0d68a; }
    .rolle-card { background: #1e2129; box-shadow: 0 2px 12px rgba(0,0,0,0.4); }
    .rolle-titel { color: #e8eaf0; }
    .belegt-box { background: #16301f; border-color: #2e7d4f; }
    .belegt-name { color: #9fe6b8; }
    .belegt-du { background: #1f4a2f; color: #bff0cf; }
    .keiner-box { background: #2a2e38; border-color: #3a4250; }
    .keiner-text { color: #aab3c0; }
    .btn-secondary { background: #2a2e38; color: #c4c9d4; }
    .btn-danger { background: #3a1f1f; color: #ff9b91; border-color: #6a2f2f; }
    .admin-select { background: #2a2e38; color: #e8eaf0; }
    .admin-select:focus { background: #22262f; }
    .gesperrt-box { background: #2a1c1c; border-color: #5a2a2a; color: #ff9b91; }

    /* ── Admin (admin.php) ── */
    .section { background: #1e2129; box-shadow: 0 2px 12px rgba(0,0,0,0.4); }
    .section h2 { color: #e8eaf0; border-bottom-color: #2f3441; }
    .msg { background: #16301f; color: #9fe6b8; }
    .err { background: #3a1f1f; color: #ff9b91; }
    .user-item { border-bottom-color: #2f3441; }
    .user-name { color: #e8eaf0; }
    .pw-form { background: #22262f; }
    .termin-row { border-bottom-color: #2f3441; }
    .termin-datum { color: #e8eaf0; }
    .termin-info { color: #c4c9d4; }
    .leer { color: #8e9aaf; }
    .btn-neutral { background: #2a2e38; color: #c4c9d4; }

    /* ── Login & Passwort (index.php / passwort_aendern.php) ── */
    .login-card, .card { background: #1e2129; box-shadow: 0 8px 40px rgba(0,0,0,0.55); }
    .subtitle, .username, .hinweis { color: #8e9aaf; }
    .fehler { background: #3a1f1f; color: #ff9b91; border-color: #6a2f2f; }
    .erfolg { background: #16301f; color: #9fe6b8; border-color: #26512f; }

    /* ── Monats-Druckansicht: nur die Bildschirm-Leiste, NICHT das Blatt ── */
    .screen-only { background: #1e2129; box-shadow: 0 2px 12px rgba(0,0,0,0.4); }
    .screen-only h2 { color: #e8eaf0; }

    /* ── Gemeinsame Formularfelder & Texte ── */
    .card h1 { color: #e8eaf0; }
    label { color: #c4c9d4; }
    input[type="text"], input[type="password"], select, textarea {
        background: #2a2e38; color: #e8eaf0;
    }
    input:focus, select:focus, textarea:focus { background: #22262f; }
}