/**
 * Design tokens — one palette for all three frontends.
 *
 * The services already shared a design language (warm parchment, ink #211D18,
 * terracotta accent #E07B30, Inter + JetBrains Mono) but each carried its own
 * copy of the palette under its own variable names, and the copies had
 * drifted: three creams (#F7F2E9 / #F6F1E8 / #F6F1E7), three border tones, two
 * dark themes. assistent's stylesheet still opened with the comment
 * "Personal Monitoring — warm atelier", which is where it was copied from.
 *
 * This file defines only the canonical --sc-* values. Each app also links one
 * `compat/<app>.css`, which maps the names its own stylesheets already use
 * onto these — so ~10 000 lines of component CSS keep working untouched. The
 * compat layers are separate files rather than one because the same name means
 * different things in different apps: `--text` is the primary ink in
 * Personal Monitoring and assistent, and the *secondary* tone in Library.
 *
 * Values are Personal Monitoring's light theme and the dark theme that
 * assistent and Personal Monitoring already shared. Library shifts by a few
 * points in both.
 */

:root {
  /* ── Surfaces ───────────────────────────────────────────── */
  --sc-bg: #F7F2E9;
  --sc-bg-alt: #FBF8F2;
  --sc-surface: #FCFAF6;
  --sc-surface-elevated: #FFFFFF;
  --sc-surface-muted: #F3EEE3;
  --sc-input-bg: #FFFFFF;

  /* ── Lines ──────────────────────────────────────────────── */
  --sc-border: #E8DFCC;
  --sc-border-subtle: #F2EDE2;
  --sc-border-strong: #D4C6A8;
  --sc-grid-line: #E0D5BC;

  /* ── Ink and text ───────────────────────────────────────── */
  --sc-ink: #211D18;
  --sc-ink-hover: #100E0B;
  --sc-ink-rgb: 33, 29, 24;
  --sc-text: #241F19;
  --sc-text-secondary: #4A4133;
  --sc-text-muted: #7A7160;
  --sc-text-inverse: #FFFFFF;

  /* ── Accent ─────────────────────────────────────────────── */
  --sc-accent: #E07B30;
  --sc-accent-hover: #C7661F;
  --sc-accent-muted: rgba(224, 123, 48, 0.14);
  --sc-accent-rgb: 224, 123, 48;

  /* ── Status ─────────────────────────────────────────────── */
  --sc-critical: #D06A3A;
  --sc-critical-hover: #B8562A;
  --sc-critical-muted: #FBF0E8;
  --sc-critical-border: #EBC4A8;
  --sc-success: #2D6A4F;
  --sc-success-muted: #E6F2EC;
  --sc-warning: #B8860B;
  --sc-warning-muted: #FBF3E0;

  /* ── Disabled controls ──────────────────────────────────── */
  --sc-disabled-bg: #F0EAD9;
  --sc-disabled-text: #A79A80;
  --sc-disabled-border: #E7DDC9;

  /* ── Sidebar ────────────────────────────────────────────── */
  --sc-sidebar-bg: #211D18;
  --sc-sidebar-border: #322A1E;
  --sc-sidebar-text: #F5F0E6;
  --sc-sidebar-text-muted: #B3A48C;
  --sc-sidebar-active-bg: #322A1E;
  --sc-sidebar-active-text: #FFFFFF;
  --sc-sidebar-hover-bg: rgba(224, 123, 48, 0.16);

  /* ── Typography ─────────────────────────────────────────── */
  --sc-font-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --sc-font-mono: "JetBrains Mono", ui-monospace, "Cascadia Code", Consolas, monospace;

  /* ── Radius ─────────────────────────────────────────────── */
  --sc-radius-sm: 8px;
  --sc-radius-md: 12px;
  --sc-radius-lg: 16px;
  --sc-radius-xl: 22px;
  --sc-radius-full: 9999px;

  /* ── Shadows ────────────────────────────────────────────── */
  --sc-shadow-xs: 0 1px 2px rgba(33, 29, 24, 0.05);
  --sc-shadow-sm: 0 1px 3px rgba(33, 29, 24, 0.08), 0 1px 2px rgba(33, 29, 24, 0.05);
  --sc-shadow-md: 0 4px 12px rgba(33, 29, 24, 0.1);
  --sc-shadow-lg: 0 8px 24px rgba(33, 29, 24, 0.14);

  /* ── Motion ─────────────────────────────────────────────── */
  --sc-transition-fast: 120ms ease;
  --sc-transition-base: 180ms ease;

  color-scheme: light;
}

[data-theme="dark"] {
  --sc-bg: #1B1712;
  --sc-bg-alt: #221D16;
  --sc-surface: #221D16;
  --sc-surface-elevated: #2A2319;
  --sc-surface-muted: #2A2319;
  --sc-input-bg: #2A2319;

  --sc-border: #453A29;
  --sc-border-subtle: #322A1E;
  --sc-border-strong: #5C4C34;
  --sc-grid-line: #453A29;

  --sc-ink: #E9E2D3;
  --sc-ink-hover: #FFFFFF;
  --sc-ink-rgb: 233, 226, 211;
  --sc-text: #F5F0E6;
  --sc-text-secondary: #D9CFBC;
  --sc-text-muted: #A99A82;
  --sc-text-inverse: #211D18;

  --sc-accent: #E8823C;
  --sc-accent-hover: #F2954F;
  --sc-accent-muted: rgba(232, 130, 60, 0.18);
  --sc-accent-rgb: 232, 130, 60;

  --sc-critical: #E88A55;
  --sc-critical-hover: #F09A68;
  --sc-critical-muted: rgba(232, 138, 85, 0.16);
  --sc-critical-border: rgba(232, 138, 85, 0.35);
  --sc-success: #5FB98A;
  --sc-success-muted: rgba(95, 185, 138, 0.15);
  --sc-warning: #E6B84D;
  --sc-warning-muted: rgba(230, 184, 77, 0.12);

  --sc-disabled-bg: #2A2319;
  --sc-disabled-text: #7A6C56;
  --sc-disabled-border: #453A29;

  --sc-sidebar-bg: #17130E;
  --sc-sidebar-border: #322A1E;
  --sc-sidebar-text: #F5F0E6;
  --sc-sidebar-text-muted: #A99A82;
  --sc-sidebar-active-bg: #322A1E;
  --sc-sidebar-active-text: #FFFFFF;
  --sc-sidebar-hover-bg: rgba(232, 130, 60, 0.12);

  --sc-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.3);
  --sc-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.35), 0 1px 2px rgba(0, 0, 0, 0.2);
  --sc-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
  --sc-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.5);

  color-scheme: dark;
}
