/* ============================================================
   TURING ERP — v2 Design System (2026 redesign)
   Stripe-warm + Linear-compact · Indigo accent · Light/Dark
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;450;500;550;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root {
  /* ---- Palette (light) ---- */
  --bg-app: #f7f7f5;        /* Stripe warm grey canvas */
  --bg-surface: #ffffff;     /* cards, table, panels */
  --bg-subtle: #faf9f7;      /* striped rows, muted fills */
  --bg-hover: #f3f2ef;
  --bg-sunken: #efeeea;

  --border: #eceae3;
  --border-strong: #d9d6cc;
  --divider: #f0efea;

  --fg-1: #0a0e27;          /* primary text */
  --fg-2: #40414b;          /* secondary text */
  --fg-3: #6b6e7a;          /* tertiary / helpers */
  --fg-4: #9a9ca6;          /* disabled / muted */
  --fg-inv: #ffffff;

  --accent: #5468ff;         /* indigo primary */
  --accent-hover: #3d5afe;
  --accent-pressed: #2b45e8;
  --accent-soft: #eef0ff;
  --accent-ring: rgba(84,104,255,.2);
  --accent-ink: #1a2dbb;

  --success: #10b981; --success-soft:#e6f7f1; --success-ink:#065f46;
  --warning: #f59e0b; --warning-soft:#fdf3e3; --warning-ink:#78350f;
  --danger:  #ef4444; --danger-soft:#fdecec;  --danger-ink:#7f1d1d;
  --info:    #0ea5e9; --info-soft:#e3f3fd;    --info-ink:#0c4a6e;

  /* Chart/stat palette (Stripe-inspired) */
  --chart-1:#5468ff; --chart-2:#10b981; --chart-3:#f59e0b;
  --chart-4:#ef4444; --chart-5:#0ea5e9; --chart-6:#8b5cf6;

  /* ---- Type ---- */
  --font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  /* Type scale */
  --fs-display: 28px; --lh-display: 1.15; --ls-display: -0.02em;
  --fs-h1: 22px;      --lh-h1: 1.2;       --ls-h1: -0.015em;
  --fs-h2: 17px;      --lh-h2: 1.25;      --ls-h2: -0.01em;
  --fs-h3: 14px;      --lh-h3: 1.3;       --ls-h3: -0.005em;
  --fs-body: 13px;    --lh-body: 1.5;
  --fs-small: 12px;   --lh-small: 1.4;
  --fs-micro: 11px;   --lh-micro: 1.3;    --ls-micro: .02em;

  /* ---- Spacing (4pt) ---- */
  --s-0:0; --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:20px;
  --s-6:24px; --s-8:32px; --s-10:40px; --s-12:48px; --s-16:64px;

  /* ---- Radii ---- */
  --r-1: 4px;  --r-2: 6px;  --r-3: 8px;  --r-4: 10px; --r-5: 12px;
  --r-pill: 999px;

  /* ---- Shadows ---- */
  --sh-xs: 0 1px 0 rgba(10,14,39,.03), 0 1px 2px rgba(10,14,39,.04);
  --sh-sm: 0 1px 2px rgba(10,14,39,.05), 0 1px 3px rgba(10,14,39,.06);
  --sh-md: 0 2px 4px rgba(10,14,39,.06), 0 4px 10px rgba(10,14,39,.06);
  --sh-lg: 0 8px 16px rgba(10,14,39,.08), 0 24px 48px rgba(10,14,39,.10);
  --sh-inset: inset 0 -1px 0 rgba(10,14,39,.04);
  --sh-ring: 0 0 0 3px var(--accent-ring);

  /* Density (compact default — 32px rows) */
  --row-h: 32px;
  --row-h-sm: 28px;
  --row-h-lg: 40px;
  --input-h: 32px;
  --input-h-lg: 40px;
  --rail-w: 52px;
  --topbar-h: 48px;
}

:root[data-theme="dark"] {
  --bg-app: #0b0c0f;
  --bg-surface: #14161c;
  --bg-subtle: #181a21;
  --bg-hover: #1f2129;
  --bg-sunken: #0f1116;

  --border: #23262f;
  --border-strong: #2e323d;
  --divider: #1c1e26;

  --fg-1: #f2f3f7;
  --fg-2: #b8bac4;
  --fg-3: #7a7e8c;
  --fg-4: #50535e;
  --fg-inv: #0a0e27;

  --accent: #7d8eff;
  --accent-hover: #9aa6ff;
  --accent-pressed: #b4bdff;
  --accent-soft: #1a1e3a;
  --accent-ring: rgba(125,142,255,.25);
  --accent-ink: #c5ccff;

  --success-soft:#0c2a1f; --warning-soft:#2a1f0a; --danger-soft:#2a1213; --info-soft:#0a1f2a;

  --sh-xs: 0 1px 0 rgba(0,0,0,.3);
  --sh-sm: 0 1px 3px rgba(0,0,0,.35);
  --sh-md: 0 2px 6px rgba(0,0,0,.4), 0 6px 12px rgba(0,0,0,.3);
  --sh-lg: 0 12px 32px rgba(0,0,0,.5);
  --sh-inset: inset 0 -1px 0 rgba(255,255,255,.03);
}

/* ---- Base ---- */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0;height:100%}
body{
  font-family:var(--font-sans);
  font-size:var(--fs-body);
  line-height:var(--lh-body);
  color:var(--fg-1);
  background:var(--bg-app);
  font-feature-settings:'cv11','ss01','ss03';
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
:focus-visible{outline:none;box-shadow:var(--sh-ring);border-radius:var(--r-2)}
.num, .mono{font-family:var(--font-mono);font-feature-settings:'tnum','zero'}
.tnum{font-variant-numeric:tabular-nums}

/* Scrollbars */
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:10px;border:2px solid var(--bg-surface)}
*::-webkit-scrollbar-track{background:transparent}

/* Type utilities */
.t-display{font-size:var(--fs-display);line-height:var(--lh-display);letter-spacing:var(--ls-display);font-weight:600}
.t-h1{font-size:var(--fs-h1);line-height:var(--lh-h1);letter-spacing:var(--ls-h1);font-weight:600}
.t-h2{font-size:var(--fs-h2);line-height:var(--lh-h2);letter-spacing:var(--ls-h2);font-weight:600}
.t-h3{font-size:var(--fs-h3);line-height:var(--lh-h3);letter-spacing:var(--ls-h3);font-weight:600}
.t-body{font-size:var(--fs-body);line-height:var(--lh-body)}
.t-small{font-size:var(--fs-small);line-height:var(--lh-small);color:var(--fg-3)}
.t-micro{font-size:var(--fs-micro);line-height:var(--lh-micro);letter-spacing:var(--ls-micro);text-transform:uppercase;color:var(--fg-3);font-weight:550}
.t-dim{color:var(--fg-3)}
.t-pos{color:var(--success-ink)} .t-neg{color:var(--danger-ink)}