/* ── Spirit base theme ─────────────────────────────────────────────────────
   Light by default. Dark when system prefers it, or when [data-theme="dark"].
   Manual override stored in localStorage key "spirit-theme": "light" | "dark".
   ───────────────────────────────────────────────────────────────────────── */

:root {
  --bg:          #f5f5f5;
  --surface:     #ffffff;
  --surface-2:   #ebebeb;
  --border:      #d8d8d8;
  --text:        #1a1a1a;
  --text-muted:  #6b6b6b;
  --accent:      #2563eb;
  --accent-text: #ffffff;
  --header-bg:   #1e293b;
  --header-text: #ffffff;
  --danger:      #dc2626;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg:          #111111;
    --surface:     #1e1e1e;
    --surface-2:   #2a2a2a;
    --border:      #333333;
    --text:        #e8e8e8;
    --text-muted:  #888888;
    --accent:      #3b82f6;
    --accent-text: #ffffff;
    --header-bg:   #0d1117;
    --header-text: #ffffff;
    --danger:      #ef4444;
  }
}

:root[data-theme="dark"] {
  --bg:          #111111;
  --surface:     #1e1e1e;
  --surface-2:   #2a2a2a;
  --border:      #333333;
  --text:        #e8e8e8;
  --text-muted:  #888888;
  --accent:      #3b82f6;
  --accent-text: #ffffff;
  --header-bg:   #0d1117;
  --header-text: #ffffff;
  --danger:      #ef4444;
}

/* ── Theme toggle button ────────────────────────────────────────────────── */
.theme-toggle {
  background: none;
  border: 1px solid rgba(255,255,255,0.25);
  border-radius: 5px;
  color: rgba(255,255,255,0.7);
  cursor: pointer;
  font-size: 14px;
  line-height: 1;
  padding: 4px 7px;
  transition: border-color 0.15s, color 0.15s;
  flex-shrink: 0;
}
.theme-toggle:hover {
  border-color: rgba(255,255,255,0.6);
  color: #fff;
}