/* Charlie Fresh design tokens (Pass 5A, docs/design/PLAN.md section 2).
   Colour pairs used together are listed with their contrast in the plan.
   The portal is light-only; dark mode is planned for Pass 5B. */

/* Self-hosted fonts (SIL Open Font License; see fonts/OFL-*.txt).
   Instrument Sans is variable: weight 400-700, width 75-100%. */
@font-face {
  font-family: "Instrument Sans";
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 75% 100%;
  font-display: swap;
  src: url("fonts/instrument-sans-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Instrument Sans";
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 75% 100%;
  font-display: swap;
  src: url("fonts/instrument-sans-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
    U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Instrument Serif";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/instrument-serif-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Instrument Serif";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/instrument-serif-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
    U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  color-scheme: light;

  /* Six named colours */
  --paper: #F6F5EF;        /* page background */
  --ink: #1A1D19;          /* text: 15.58:1 on paper, 17.02:1 on surface */
  --leaf: #1D5A38;         /* primary actions, links, selected unit, focus ring: white on leaf 8.17:1 */
  --amber: #8F5200;        /* cut-off warnings only: 5.46:1 on amber-tint */
  --line: #E2E0D6;         /* dividers (decorative, never a control's only boundary) */
  --red: #B42318;          /* errors only: 6.57:1 on surface */

  /* Derived steps of the six */
  --surface: #FFFFFF;      /* rows, cards, sticky bar, drawer */
  --ink-soft: #5A6158;     /* secondary text: 5.85:1 on paper, 6.39:1 on surface */
  --line-strong: #878C83;  /* control borders: 3.44:1 on surface, 3.15:1 on paper */
  --ink-faint: #8C9189;    /* placeholder quantities only: 3.22:1 on surface */
  --leaf-tint: #E4EFE6;    /* selected chip, row with a quantity: leaf on it 6.92:1 */
  --amber-tint: #FCEFD4;   /* cut-off strip, warning state: ink on it 14.94:1 */
  --red-tint: #FCEBE9;     /* error banner: red on it 5.70:1 */

  /* Type: Instrument Sans for working screens, Instrument Serif on login and the receipt only
     (it has no tabular figures, so it never sets numbers). */
  --font-sans: "Instrument Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Instrument Serif", Georgia, "Times New Roman", serif;
  --text-xs: 13px;  --lh-xs: 18px;
  --text-sm: 15px;  --lh-sm: 22px;
  --text-md: 17px;  --lh-md: 24px;
  --text-lg: 21px;  --lh-lg: 28px;
  --text-xl: clamp(28px, 4vw + 12px, 44px);  --lh-xl: 1.15;

  /* Spacing (4 px base) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --gutter: 16px;

  /* Shape and depth: one shadow, only for layers that float over content */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-full: 999px;
  --shadow: 0 2px 12px rgb(26 29 25 / .10);

  /* Targets */
  --tap: 48px;        /* primary actions */
  --tap-step: 44px;   /* stepper buttons and field */

  /* Motion: transform/opacity only, inside prefers-reduced-motion: no-preference */
  --dur-fast: 150ms;
  --dur-base: 200ms;
  --dur-slow: 250ms;
  --ease-out: cubic-bezier(.2, .8, .2, 1);

  /* Layout */
  --content: 720px;
  --rail: 320px;
  --bar-height: 140px;  /* sticky bottom bar on phones, used for scroll-padding-bottom */
}

@media (min-width: 768px) {
  :root { --gutter: 24px; }
}