/* Shared design tokens for chat, workspace and admin. Dark is the default;
   light applies with data-theme="light" or, in "auto", from the OS setting.
   Branding overrides are served after this file as /brand/theme.css. */
:root {
  color-scheme: dark;
  --font: system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --bg: #0f1115; --panel: #171a21; --line: #262b36; --fg: #e6e8ec;
  --muted: #9aa3b2; --accent: #4f8cff; --danger: #ff5c6c; --ok: #37c871;
  --user: #1e2a44; --asst: #1b2029; --user-line: #26365a;
  --inset: #0b0d11; --on-accent: #ffffff; --chart-bg: #ffffff;
  --chip: #202530; --chip-line: #333a48; --secondary: #3b4352;
  --backdrop: rgba(8, 10, 14, .62); --panel-glass: rgba(23, 26, 33, .97);
  --shadow: rgba(0, 0, 0, .3); --stripe: rgba(255, 255, 255, .015);
  --accent-soft: rgba(79, 140, 255, .06); --accent-faint: rgba(79, 140, 255, .04);
  --danger-soft: rgba(255, 92, 108, .08); --danger-mid: rgba(255, 92, 108, .14);
  --danger-line: rgba(255, 92, 108, .45); --danger-faint: rgba(255, 92, 108, .05);
  --code-key: #8bb4e8; --code-string: #d4a27a; --code-number: #9dcea6;
  --code-bool: #7eb6d8;
  --logo-height: 22px;
}

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f6f7f9; --panel: #ffffff; --line: #dde1e8; --fg: #1b1f27;
  --muted: #5d6675; --accent: #2f6fe4; --danger: #d63447; --ok: #1f9d55;
  --user: #e8effd; --asst: #ffffff; --user-line: #c9d8f6;
  --inset: #f0f2f5; --on-accent: #ffffff; --chart-bg: #ffffff;
  --chip: #eef0f4; --chip-line: #d3d8e0; --secondary: #c7cdd6;
  --backdrop: rgba(20, 24, 32, .35); --panel-glass: rgba(255, 255, 255, .97);
  --shadow: rgba(0, 0, 0, .12); --stripe: rgba(0, 0, 0, .02);
  --accent-soft: rgba(47, 111, 228, .08); --accent-faint: rgba(47, 111, 228, .05);
  --danger-soft: rgba(214, 52, 71, .08); --danger-mid: rgba(214, 52, 71, .14);
  --danger-line: rgba(214, 52, 71, .45); --danger-faint: rgba(214, 52, 71, .05);
  --code-key: #2357a8; --code-string: #a3501c; --code-number: #2d7a3e;
  --code-bool: #1d6f91;
}

@media (prefers-color-scheme: light) {
  :root[data-theme="auto"] {
    color-scheme: light;
    --bg: #f6f7f9; --panel: #ffffff; --line: #dde1e8; --fg: #1b1f27;
    --muted: #5d6675; --accent: #2f6fe4; --danger: #d63447; --ok: #1f9d55;
    --user: #e8effd; --asst: #ffffff; --user-line: #c9d8f6;
    --inset: #f0f2f5; --on-accent: #ffffff; --chart-bg: #ffffff;
    --chip: #eef0f4; --chip-line: #d3d8e0; --secondary: #c7cdd6;
    --backdrop: rgba(20, 24, 32, .35); --panel-glass: rgba(255, 255, 255, .97);
    --shadow: rgba(0, 0, 0, .12); --stripe: rgba(0, 0, 0, .02);
    --accent-soft: rgba(47, 111, 228, .08); --accent-faint: rgba(47, 111, 228, .05);
    --danger-soft: rgba(214, 52, 71, .08); --danger-mid: rgba(214, 52, 71, .14);
    --danger-line: rgba(214, 52, 71, .45); --danger-faint: rgba(214, 52, 71, .05);
    --code-key: #2357a8; --code-string: #a3501c; --code-number: #2d7a3e;
    --code-bool: #1d6f91;
  }
}

.brand-logo { height: var(--logo-height); width: auto; vertical-align: middle; }
.brand { display: inline-flex; align-items: center; gap: 8px; }
.theme-toggle { min-width: 2.2em; }
.login-logo { display: block; height: 48px; margin: 0 auto 12px; }
.ui-controls { display: inline-flex; align-items: center; gap: 4px; }
.ui-controls .active { text-decoration: underline; }
.empty .examples { margin: 4px 0 0; padding-left: 1.2em; }