/* Tier — design tokens (Tastefolio). Plan-driven commerce: trustworthy blue + a warm deal accent,
   soft blue-tinted sections, generous price typography. Persian-first. */
:root {
  --canvas: #ffffff;
  --surface: #ffffff;
  --surface-2: #f3f6fd;      /* tinted sections, panel backgrounds */
  --surface-3: #e8eefb;
  --surface-ink: #0b1b4a;    /* deep navy hero, footer */
  --overlay: rgba(11, 27, 74, .5);

  --ink: #101a33;
  --ink-2: #4d5a78;
  --ink-3: #8a96b3;
  --ink-inverse: #ffffff;

  --line: #e2e8f5;
  --line-2: #cdd7ee;

  --brand: #1d5bff;          /* trust: actions, links, selected states */
  --brand-ink: #ffffff;
  --brand-soft: color-mix(in oklab, var(--brand) 10%, #fff);
  --brand-strong: color-mix(in oklab, var(--brand) 78%, #000);
  --brand-deep: color-mix(in oklab, var(--brand) 38%, #050f2e);
  --accent: #ff7a1a;         /* deals: discounts, countdowns, "best value" — never for navigation */
  --accent-ink: #ffffff;
  --accent-soft: color-mix(in oklab, var(--accent) 14%, #fff);
  --focus: color-mix(in oklab, var(--brand) 40%, transparent);

  --success: #12a150;
  --success-soft: #e4f6ec;
  --warning: #d98b00;
  --warning-soft: #fdf3dc;
  --danger: #e5383b;
  --danger-soft: #fde8e8;
  --info: var(--brand);
  --info-soft: var(--brand-soft);

  --chart-1: var(--brand);
  --chart-2: var(--accent);
  --chart-3: #12a150;
  --chart-4: #8a96b3;
  --chart-5: #7c4dff;
  --chart-6: #e5383b;
  --chart-grid: #edf1fa;
  --chart-axis: var(--ink-3);
  --chart-curve: smooth;
  --chart-stroke: 2.5;
  --chart-area: .16;
  --chart-radius: 6;
  --chart-bar-gap: .4;
  --chart-donut: 18;

  --font-sans: "Plus Jakarta Sans", "Vazirmatn", system-ui, -apple-system, sans-serif;
  --font-display: var(--font-sans);
  --font-mono: ui-monospace, "SF Mono", Menlo, "Vazirmatn", monospace;
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-md: 15px;
  --fs-lg: 17px;
  --fs-xl: 21px;
  --fs-2xl: 28px;
  --fs-3xl: 38px;
  --fs-display: clamp(30px, 4.6vw, 56px);
  --fs-price: 40px;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-bold: 700;
  --fw-display: 800;
  --lh-tight: 1.2;
  --lh-snug: 1.4;
  --lh-body: 1.7;
  --tracking-display: -.025em;
  --tracking-caps: .04em;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 48px;
  --space-9: 64px;
  --space-10: 96px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 26px;
  --radius-pill: 999px;
  --border-w: 1px;
  --shadow-1: 0 2px 6px -2px rgba(29, 64, 160, .08);
  --shadow-2: 0 14px 34px -14px rgba(29, 64, 160, .25);
  --shadow-3: 0 30px 70px -24px rgba(11, 27, 74, .35);

  --container: 1200px;
  --gutter: clamp(16px, 3.5vw, 32px);
  --control-h: 42px;
  --control-h-lg: 54px;
  --sidebar-w: 256px;

  --ease: cubic-bezier(.2, .8, .2, 1);
  --dur-1: 140ms;
  --dur-2: 240ms;
  --dur-3: 380ms;
  color-scheme: light;
}

[data-theme="dark"] {
  --canvas: #0a1126;
  --surface: #111a33;
  --surface-2: #0e1630;
  --surface-3: #1a2547;
  --surface-ink: #060c1f;
  --ink: #edf1fc;
  --ink-2: #aab5d3;
  --ink-3: #6f7ca0;
  --line: #1f2b4f;
  --line-2: #2c3a63;
  --brand: #5b8bff;
  --brand-soft: color-mix(in oklab, var(--brand) 18%, var(--surface));
  --brand-strong: color-mix(in oklab, var(--brand) 78%, #fff);
  --accent-soft: color-mix(in oklab, var(--accent) 18%, var(--surface));
  --success-soft: #0f2a1d; --warning-soft: #2c230f; --danger-soft: #2f1518;
  --chart-grid: #1a2547;
  --shadow-1: 0 2px 6px -2px rgba(0, 0, 0, .5);
  --shadow-2: 0 14px 34px -14px rgba(0, 0, 0, .7);
  color-scheme: dark;
}

:root:lang(fa) {
  --font-sans: "Vazirmatn", "Plus Jakarta Sans", Tahoma, sans-serif;
  --lh-tight: 1.5;
  --lh-snug: 1.6;
  --lh-body: 1.95;
  --tracking-display: 0;
  --tracking-caps: 0;
  --fs-price: 34px;
}