/* ============================================================
   TeamFlow — Design Tokens
   Source: DESIGN-linear.app.md (Linear design language)
   Dark is the primary theme; light derives from inverse tokens.
   ============================================================ */

:root {
  /* Brand & accent (theme-invariant) — N-RELAY fire palette */
  --primary: #ff5a1f;
  --primary-hover: #ff7a3d;
  --primary-focus: #e8481a;
  --on-primary: #ffffff;
  --brand-secure: #c2703f;

  /* Semantic */
  --success: #27a644;
  --warning: #f59e0b;
  --danger: #ef4444;
  --overlay: rgba(0, 0, 0, 0.6);

  /* Product tag palette (in-product only, never marketing chrome) */
  --tag-red: #eb5757;
  --tag-orange: #f2994a;
  --tag-yellow: #f2c94c;
  --tag-green: #27a644;
  --tag-blue: #4ea7fc;
  --tag-purple: #9b8afb;

  /* Radius scale */
  --r-xs: 4px;
  --r-sm: 6px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-xl: 16px;
  --r-xxl: 24px;
  --r-pill: 9999px;

  /* Spacing (4px base) */
  --s-xxs: 4px;
  --s-xs: 8px;
  --s-sm: 12px;
  --s-md: 16px;
  --s-lg: 24px;
  --s-xl: 32px;
  --s-xxl: 48px;
  --s-section: 96px;

  /* Type — Inter substitutes Linear Display/Text; JetBrains Mono for Linear Mono */
  --font-display: "Inter", "SF Pro Display", -apple-system, system-ui, "Segoe UI", Roboto, sans-serif;
  --font-text: "Inter", "SF Pro Text", -apple-system, system-ui, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* Motion */
  --ease: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --t-fast: 120ms;
  --t-med: 200ms;
  --t-slow: 320ms;

  /* Layout */
  --topnav-h: 56px;
  --sidebar-w: 244px;
  --rightpanel-w: 300px;
  --content-max: 1280px;
}

/* ---------- Dark (default — Linear canonical) ---------- */
:root,
[data-theme="dark"] {
  --canvas: #010102;
  --surface-1: #0f1011;
  --surface-2: #141516;
  --surface-3: #18191a;
  --surface-4: #191a1b;
  --hairline: #23252a;
  --hairline-strong: #34343a;
  --hairline-tertiary: #3e3e44;

  --ink: #f7f8f8;
  --ink-muted: #d0d6e0;
  --ink-subtle: #8a8f98;
  --ink-tertiary: #62666d;

  --edge-highlight: rgba(255, 255, 255, 0.06); /* top-edge "pixel rendered" line */
  --scrim: rgba(0, 0, 0, 0.65);
  --skeleton-a: #141516;
  --skeleton-b: #1d1e20;
  color-scheme: dark;
}

/* ---------- Light (derived from inverse tokens) ---------- */
[data-theme="light"] {
  --canvas: #ffffff;
  --surface-1: #f5f6f6;
  --surface-2: #f6f7f7;
  --surface-3: #eef0f1;
  --surface-4: #e9ebec;
  --hairline: #e3e4e8;
  --hairline-strong: #d0d2d8;
  --hairline-tertiary: #bfc1c8;

  --ink: #0f1011;
  --ink-muted: #3c4149;
  --ink-subtle: #6f7580;
  --ink-tertiary: #9a9ea7;

  --edge-highlight: rgba(255, 255, 255, 0.9);
  --scrim: rgba(15, 16, 17, 0.4);
  --skeleton-a: #eef0f1;
  --skeleton-b: #e4e6e9;
  color-scheme: light;
}