/*
 * darkmode.css – cochems.net
 * Nur Dark-Mode-Overrides. Immer NACH cochems.css einbinden.
 */

/* ── System-Präferenz: Dark ── */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg:           #0f0e18;
    --bg2:          #171623;
    --bg3:          #1e1d2e;
    --border:       rgba(255,255,255,0.07);
    --border2:      rgba(255,255,255,0.13);
    --text:         #e4e2f0;
    --muted:        #8c89a8;
    --accent:       #a89fd8;
    --accent-light: #c4bcf0;
    --accent-faint: rgba(168,159,216,0.08);
    --danger:       #f07070;
    --success:      #4ecf8a;
  }
}

/* ── Manuell: Dark ── */
:root[data-theme="dark"] {
  --bg:           #0f0e18;
  --bg2:          #171623;
  --bg3:          #1e1d2e;
  --border:       rgba(255,255,255,0.07);
  --border2:      rgba(255,255,255,0.13);
  --text:         #e4e2f0;
  --muted:        #8c89a8;
  --accent:       #a89fd8;
  --accent-light: #c4bcf0;
  --accent-faint: rgba(168,159,216,0.08);
  --danger:       #f07070;
  --success:      #4ecf8a;
}

/* ── Manuell: Light (überschreibt System-Dark) ── */
:root[data-theme="light"] {
  --bg:           #f4f4f6;
  --bg2:          #eeeef2;
  --bg3:          #e5e5eb;
  --border:       rgba(36,31,76,0.1);
  --border2:      rgba(36,31,76,0.2);
  --text:         #1a1730;
  --muted:        #6b6880;
  --accent:       #241f4c;
  --accent-light: #3d3680;
  --accent-faint: rgba(36,31,76,0.06);
  --danger:       #900;
  --success:      #006633;
}

/* ── Navigation & Preview-Bar ── */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) nav,
  :root:not([data-theme="light"]) .preview-bar { background: rgba(15,14,24,0.94) !important; }
}
:root[data-theme="dark"] nav,
:root[data-theme="dark"] .preview-bar { background: rgba(15,14,24,0.94) !important; }

/* ── Admin-Nav (white bg) ── */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) nav.admin-nav { background: var(--bg2) !important; }
}
:root[data-theme="dark"] nav.admin-nav { background: var(--bg2) !important; }

/* ── Logo-Farben ── */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .nav-logo svg rect[style*="fill:#eeeeef"] { fill: #17162a !important; stroke: #a89fd8 !important; }
  :root:not([data-theme="light"]) .nav-logo svg rect[style*="fill:#241f4c"] { fill: #a89fd8 !important; }
  :root:not([data-theme="light"]) .nav-logo svg text  { fill: #a89fd8 !important; }
  :root:not([data-theme="light"]) .nav-logo svg path  { stroke: #a89fd8 !important; }
}
:root[data-theme="dark"] .nav-logo svg rect[style*="fill:#eeeeef"] { fill: #17162a !important; stroke: #a89fd8 !important; }
:root[data-theme="dark"] .nav-logo svg rect[style*="fill:#241f4c"] { fill: #a89fd8 !important; }
:root[data-theme="dark"] .nav-logo svg text  { fill: #a89fd8 !important; }
:root[data-theme="dark"] .nav-logo svg path  { stroke: #a89fd8 !important; }

/* ── Weiße Hintergründe auf Dark setzen ── */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .skill-card,
  :root:not([data-theme="light"]) .project-card,
  :root:not([data-theme="light"]) .card,
  :root:not([data-theme="light"]) .post-card,
  :root:not([data-theme="light"]) .post-row,
  :root:not([data-theme="light"]) .kommentar-row,
  :root:not([data-theme="light"]) .spruch-row,
  :root:not([data-theme="light"]) .add-form,
  :root:not([data-theme="light"]) .today,
  :root:not([data-theme="light"]) .stat,
  :root:not([data-theme="light"]) .kommentar,
  :root:not([data-theme="light"]) .kommentar-form,
  :root:not([data-theme="light"]) section#impressum,
  :root:not([data-theme="light"]) .chip,
  :root:not([data-theme="light"]) .box { background-color: var(--bg2) !important; }
}
:root[data-theme="dark"] .skill-card,
:root[data-theme="dark"] .project-card,
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .post-card,
:root[data-theme="dark"] .post-row,
:root[data-theme="dark"] .kommentar-row,
:root[data-theme="dark"] .spruch-row,
:root[data-theme="dark"] .add-form,
:root[data-theme="dark"] .today,
:root[data-theme="dark"] .stat,
:root[data-theme="dark"] .kommentar,
:root[data-theme="dark"] .kommentar-form,
:root[data-theme="dark"] section#impressum,
:root[data-theme="dark"] .chip,
:root[data-theme="dark"] .box { background-color: var(--bg2) !important; }