/* PriceWrench design tokens.
 * Color + type lineage: heronaiapp.com (CSS variables + sampled paper ground).
 * Motion lineage: transitions.dev motion tokens.
 * Mirrors the tokens in the Paper file "PriceWrench — Design System". */

@font-face { font-family: 'Geist'; src: url('../fonts/geist.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }
@font-face { font-family: 'Geist Mono'; src: url('../fonts/geist-mono.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }

:root {
  /* ---- Color: surfaces ---- */
  --color-paper: #F5F5EE;        /* app canvas */
  --color-sheet: #FFFFFF;        /* quote documents, cards, inputs */
  --color-wash: #EBEBE4;         /* hover rows, chips, tab track */

  /* ---- Color: ink (contrast vs paper) ---- */
  --color-ink: #282828;          /* 13.5:1 primary text, primary button */
  --color-ink-2: #414140;        /* 9.3:1 secondary text */
  --color-ink-3: #626260;        /* 5.6:1 muted text — lightest allowed for body copy */
  --color-ink-4: #72726F;        /* 4.4:1 icons and large text only */
  --color-ink-muted: rgb(40 40 40 / .72); /* Heron's "tertiary" ink */

  /* ---- Color: lines ---- */
  --color-line: #B3B3AF;         /* 1px borders on paper */
  --color-line-soft: #DCDCD5;    /* dividers inside a sheet */
  --color-disabled: #B4B4B0;

  /* ---- Color: brand ---- */
  --color-brand: #FA3600;        /* fills, marks, the price total. As text: 18px+ bold only (3.4:1) */
  --color-brand-strong: #C42A00; /* small brand text, links, hover on brand fills (5.2:1) */
  --color-brand-tint: #FFE6DC;   /* selected row, focus halo */

  /* ---- Color: semantic ---- */
  --color-success: #2B7A4B;
  --color-warning: #8A5C00;
  --color-danger: #B42318;

  /* ---- Type ---- */
  --font-sans: 'Geist', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --text-2xs: 11px;    /* mono uppercase micro labels only */
  --text-xs: 12px;     /* mono uppercase labels */
  --text-sm: 14px;
  --text-base: 16px;
  --text-lg: 20px;
  --text-xl: 24px;
  --text-2xl: 32px;
  --text-3xl: 48px;
  --text-display: 72px;
  --tracking-tight: -0.02em;  /* headings (Heron global) */
  --tracking-normal: 0em;
  --tracking-label: 0.04em;   /* mono uppercase labels */
  --leading-none: 1;
  --leading-tight: 1.1;
  --leading-snug: 1.3;
  --leading-body: 1.5;

  /* ---- Shape ---- */
  --radius-none: 0;      /* default: square corners */
  --radius-xs: 2px;      /* checkboxes, focus rings */
  --radius-full: 999px;  /* status dots, toggles */
  --border: 1px solid var(--color-line);
  --border-soft: 1px solid var(--color-line-soft);
  --focus-ring: 0 0 0 3px var(--color-brand-tint);

  /* ---- Space (4px grid) ---- */
  --spacing-1: 4px;
  --spacing-2: 8px;
  --spacing-3: 12px;
  --spacing-4: 16px;
  --spacing-6: 24px;
  --spacing-8: 32px;
  --spacing-12: 48px;
  --spacing-16: 64px;
  --spacing-24: 96px;
  --spacing-tap: 44px;   /* minimum tap target */

  /* ---- Layout ---- */
  --container-doc: 816px;  /* printable quote, 8.5in @ 96dpi */
  --container-app: 1200px;

  /* ---- Motion (transitions.dev) ---- */
  --dur-stagger: 40ms;
  --dur-micro: 80ms;
  --dur-quick: 150ms;
  --dur-fast: 250ms;
  --dur-medium: 350ms;
  --dur-slow: 400ms;
  --dur-emphasis: 500ms;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);       /* default; ≈ Heron's (.23, 1, .32, 1) */
  --ease-pop: cubic-bezier(0.34, 1.36, 0.64, 1);    /* slight overshoot for rewards */
  --ease-in-out: ease-in-out;                       /* swaps */
  --distance-micro: 4px;
  --distance-small: 6px;
  --distance-base: 8px;
  --distance-medium: 12px;
  --distance-large: 16px;
  --scale-modal: 0.96;
  --scale-menu: 0.97;
  --blur-small: 2px;
  --blur-medium: 3px;
  --blur-large: 8px;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-stagger: 0ms; --dur-micro: 0ms; --dur-quick: 0ms; --dur-fast: 0ms;
    --dur-medium: 0ms; --dur-slow: 0ms; --dur-emphasis: 0ms;
  }
}
