/* =========================================================================
   theme.css — Thorsvoll Media
   Design tokens: palette, typography, spacing, radii. Light + dark themes.
   ========================================================================= */

:root {
  /* Palette — light (default) */
  --tm-bg: #f5f3ee;
  --tm-surface: #fbfaf7;
  --tm-surface-2: #ece7dc;
  --tm-text: #1f1f1c;
  --tm-muted: #666158;
  --tm-border: #d8d2c8;
  --tm-dark: #22201c;
  --tm-green: #7b8f6a;
  --tm-amber: #b08968;
  --tm-code: #2f3b2f;

  /* Derived */
  --tm-link: #5d6f4f;
  --tm-shadow: 0 1px 2px rgba(34, 32, 28, 0.04), 0 8px 24px rgba(34, 32, 28, 0.05);
  --tm-shadow-sm: 0 1px 2px rgba(34, 32, 28, 0.05);

  /* Background thread */
  --tm-thread: #b9c1a6;
  --tm-thread-strong: #7b8f6a;
  --tm-thread-glow: rgba(123, 143, 106, 0.55);

  /* Typography */
  --tm-font-sans: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Helvetica, Arial, sans-serif;
  --tm-font-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular,
    Menlo, Consolas, monospace;

  /* Spacing scale */
  --tm-space-1: 0.25rem;
  --tm-space-2: 0.5rem;
  --tm-space-3: 0.75rem;
  --tm-space-4: 1rem;
  --tm-space-5: 1.5rem;
  --tm-space-6: 2rem;
  --tm-space-7: 3rem;
  --tm-space-8: 4.5rem;

  /* Radii */
  --tm-radius-sm: 6px;
  --tm-radius: 10px;
  --tm-radius-lg: 14px;

  /* Layout */
  --tm-topbar-h: 60px;
  --tm-sidebar-w: 240px;
  --tm-content-max: 820px;

  color-scheme: light;
}

:root[data-theme="dark"] {
  --tm-bg: #1a1916;
  --tm-surface: #211f1b;
  --tm-surface-2: #2a2823;
  --tm-text: #ece7dc;
  --tm-muted: #a39d90;
  --tm-border: #38352e;
  --tm-dark: #ece7dc;
  --tm-green: #9caf87;
  --tm-amber: #c79e7c;
  --tm-code: #c6d4b8;

  --tm-link: #a9bb93;
  --tm-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 8px 24px rgba(0, 0, 0, 0.35);
  --tm-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);

  --tm-thread: #4c5640;
  --tm-thread-strong: #9caf87;
  --tm-thread-glow: rgba(156, 175, 135, 0.5);

  color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --tm-bg: #1a1916;
    --tm-surface: #211f1b;
    --tm-surface-2: #2a2823;
    --tm-text: #ece7dc;
    --tm-muted: #a39d90;
    --tm-border: #38352e;
    --tm-dark: #ece7dc;
    --tm-green: #9caf87;
    --tm-amber: #c79e7c;
    --tm-code: #c6d4b8;

    --tm-link: #a9bb93;
    --tm-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 8px 24px rgba(0, 0, 0, 0.35);
    --tm-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);

    --tm-thread: #4c5640;
    --tm-thread-strong: #9caf87;
    --tm-thread-glow: rgba(156, 175, 135, 0.5);

    color-scheme: dark;
  }
}