/* KelCommerce v2 design tokens — shared by site/, admin/, store/ (store overrides --accent per shop theme).
   Direction: calm, credible, fast. Warm paper background, near-black ink, ONE accent (deep teal), no gradients,
   no glow, no "AI" sparkle. Typography does the work; generous whitespace; 8px grid; 1px hairlines. */
:root {
  --font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-serif: "Fraunces", ui-serif, Georgia, serif;
  --font-mono: ui-monospace, "JetBrains Mono", Menlo, monospace;

  --paper: #FAFAF7;      /* page background */
  --surface: #FFFFFF;    /* cards, panels */
  --surface-2: #F3F2EE;  /* subtle fills, table header, inputs hover */
  --line: #E6E4DE;       /* hairlines */
  --line-strong: #D3D0C8;
  --ink: #1C1A17;        /* primary text */
  --ink-2: #57534B;      /* secondary text */
  --ink-3: #8A857B;      /* tertiary / placeholders */

  --accent: #0F766E;     /* deep teal: primary actions, links */
  --accent-ink: #FFFFFF;
  --accent-soft: #E3F1EF;
  --accent-strong: #0B5C56;

  --ok: #15803D;   --ok-soft: #E6F4EA;
  --warn: #B45309; --warn-soft: #FDF1E3;
  --bad: #B91C1C;  --bad-soft: #FBE9E9;
  --info: #1D4ED8; --info-soft: #E8EEFC;

  --r-sm: 6px; --r-md: 10px; --r-lg: 16px; --r-pill: 999px;
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px; --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px;
  --shadow-1: 0 1px 2px rgba(28,26,23,.06);
  --shadow-2: 0 4px 16px rgba(28,26,23,.08);
  --focus: 0 0 0 3px color-mix(in srgb, var(--accent) 35%, transparent);
  --t-fast: 120ms ease; --t: 200ms ease;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #141311; --surface: #1C1B18; --surface-2: #24221F; --line: #34312C; --line-strong: #45413A;
    --ink: #F2F0EA; --ink-2: #BDB8AD; --ink-3: #8A857B;
    --accent: #2DB3A6; --accent-ink: #0B1513; --accent-soft: #17302D; --accent-strong: #5CCFC3;
    --ok-soft: #15291C; --warn-soft: #2E2214; --bad-soft: #301818; --info-soft: #18213A;
  }
}
:root[data-theme="dark"] {
  --paper: #141311; --surface: #1C1B18; --surface-2: #24221F; --line: #34312C; --line-strong: #45413A;
  --ink: #F2F0EA; --ink-2: #BDB8AD; --ink-3: #8A857B;
  --accent: #2DB3A6; --accent-ink: #0B1513; --accent-soft: #17302D; --accent-strong: #5CCFC3;
  --ok-soft: #15291C; --warn-soft: #2E2214; --bad-soft: #301818; --info-soft: #18213A;
}