/* Housecarl web UI. Plain CSS, light and dark themes (the same as Jarl's and
   Steward's). For now only the colors and the brand: the pages come later. */
:root {
  --bg: #f6f7f9;
  --panel: #ffffff;
  --text: #1d2330;
  --muted: #5f6b7d;
  --hatch: rgba(95, 107, 125, 0.13);
  --border: #d9dee6;
  --accent: #2f5fb3;
  --accent-text: #ffffff;
  --accent-soft: #e5edfa;
  --ok: #1e7a46;
  --ok-soft: #e3f4ea;
  --warn: #8a5a00;
  --warn-soft: #fdf2d9;
  --err: #b3261e;
  --err-soft: #fbe7e5;
  --info-soft: #eef1f6;
  --code-bg: #f0f2f5;
  --add: #e6f6ea;
  --add-text: #135c2c;
  --del: #fde8e7;
  --del-text: #8c1d18;
  --hunk: #e8eefb;
  --shadow: 0 1px 2px rgba(20, 30, 50, 0.08);
  --radius: 6px;
  --vc-green: #3d8160; --vc-teal: #2f7c80; --vc-purple: #7a5ba8; --vc-pink: #a8557f;
  --vc-orange: #a8652f; --vc-yellow: #8a7424; --vc-red: #b0534c; --vc-grey: #6b7280;
  --mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #14171c;
    --panel: #1c2027;
    --text: #e3e7ee;
    --muted: #9aa5b5;
    --hatch: rgba(154, 165, 181, 0.12);
    --border: #2f3540;
    --accent: #6d9be8;
    --accent-text: #0f1520;
    --accent-soft: #23314a;
    --ok: #59c287;
    --ok-soft: #173326;
    --warn: #e5b450;
    --warn-soft: #3a2f15;
    --err: #f08077;
    --err-soft: #3c1f1d;
    --info-soft: #232833;
    --code-bg: #242933;
    --add: #183a25;
    --add-text: #9fe3b5;
    --del: #43201e;
    --del-text: #f7b2ac;
    --hunk: #23314a;
    --shadow: none;
    --vc-green: #8fcfa9; --vc-teal: #87cdd0; --vc-purple: #bca6e6; --vc-pink: #e6a6c6;
    --vc-orange: #ebbb8f; --vc-yellow: #e3d08e; --vc-red: #eba29c; --vc-grey: #aab2bf;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #14171c; --panel: #1c2027; --text: #e3e7ee; --muted: #9aa5b5; --border: #2f3540; --hatch: rgba(154, 165, 181, 0.12);
  --accent: #6d9be8; --accent-text: #0f1520; --accent-soft: #23314a; --ok: #59c287; --ok-soft: #173326;
  --warn: #e5b450; --warn-soft: #3a2f15; --err: #f08077; --err-soft: #3c1f1d; --info-soft: #232833;
  --code-bg: #242933; --add: #183a25; --add-text: #9fe3b5; --del: #43201e; --del-text: #f7b2ac; --hunk: #23314a;

/* The logo's own blue (artwork/logo.svg), lighter on dark backgrounds. */
:root { --logo: #1d5287; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --logo: #6d9be8; } }
:root[data-theme="dark"] { --logo: #6d9be8; }
.logo-mark { fill: var(--logo); }

.wordmark { display: block; width: 220px; height: auto; margin: 0 auto; color: var(--text); }
.wordmark-rule .fill { fill: var(--accent); }
.wordmark-rule .line { fill: none; stroke: var(--accent); stroke-width: 2.6; }
.wordmark-rule .tag { fill: var(--accent); font: 700 17px system-ui, sans-serif; letter-spacing: 0.5px; }
.login .wordmark { width: 290px; }