/*
 * EatRate design tokens — the only place colours, type, spacing, radii, shadows and motion are defined.
 * Web (this file), POS (pos/styles.css imports it) and mobile (mobile/lib/theme.ts mirrors it) share these values.
 */
@font-face{font-family:"Inter";font-style:normal;font-display:swap;font-weight:100 900;src:url("/fonts/inter-latin-wght-normal.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:"Inter";font-style:normal;font-display:swap;font-weight:100 900;src:url("/fonts/inter-latin-ext-wght-normal.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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Manrope";font-style:normal;font-display:swap;font-weight:200 800;src:url("/fonts/manrope-latin-wght-normal.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:"Manrope";font-style:normal;font-display:swap;font-weight:200 800;src:url("/fonts/manrope-latin-ext-wght-normal.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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  /* Brand: forest */
  --er-forest-950:#102A21;--er-forest-900:#16382B;--er-forest-800:#1C4A37;--er-forest-700:#236044;--er-forest-600:#2D7652;--er-forest-500:#388D62;--er-forest-100:#DDEFE5;--er-forest-50:#F1F8F4;
  /* Warm food accent: saffron (rewards, ratings, highlights — never long text) */
  --er-saffron-600:#D89112;--er-saffron-500:#E8A629;--er-saffron-400:#F2BC55;--er-saffron-100:#FBEAC5;--er-saffron-50:#FFF8E8;
  /* Terracotta (culinary editorial, provenance — not the error colour) */
  --er-terracotta-700:#A9472B;--er-terracotta-600:#C45B38;--er-terracotta-100:#F5DDD4;--er-terracotta-50:#FCF3EF;
  /* Neutrals */
  --er-ink-950:#151A17;--er-ink-900:#202622;--er-ink-700:#49524D;--er-ink-600:#626C66;--er-ink-500:#7A847E;
  --er-stone-300:#CDD4D0;--er-stone-200:#DFE4E1;--er-stone-100:#ECEFEC;--er-stone-50:#F5F7F5;--er-canvas:#FAFBF9;--er-white:#FFFFFF;
  /* Semantic (status only) */
  --er-success-700:#237A4B;--er-success-100:#DDF3E6;--er-warning-700:#9B650B;--er-warning-800:#85570A;--er-warning-100:#FCEBC5;--er-danger-700:#B53A3A;--er-danger-100:#F8DEDE;--er-info-700:#27678C;--er-info-100:#DDEEF7;

  /* Role aliases */
  --er-bg:var(--er-canvas);--er-surface:var(--er-white);--er-surface-muted:var(--er-stone-50);
  --er-text:var(--er-ink-950);--er-text-secondary:var(--er-ink-600);--er-text-placeholder:var(--er-ink-500);--er-text-on-brand:var(--er-white);
  --er-border:var(--er-stone-200);--er-border-strong:var(--er-stone-300);
  --er-brand:var(--er-forest-700);--er-brand-hover:var(--er-forest-800);--er-brand-tint:var(--er-forest-50);
  --er-focus-ring:0 0 0 3px rgba(35,96,68,.28);
  /* Translucent white veil for chips sitting on the dark rewards card surface. */
  --er-on-brand-veil:rgba(255,255,255,.14);
  /* The dark gradient overlay SPEC section 7 allows when text sits directly on food photography.
     Defined once here so no page invents its own scrim: forest-950 fading upward out of the image.
     Strong enough that 14px forest-50 caption text clears 4.5:1 even over a blown-out photo — at
     45% of the overlay height the composite is 0.86 forest-950 in the worst case. */
  --er-media-scrim:linear-gradient(to top,rgba(16,42,33,.94) 0%,rgba(16,42,33,.86) 45%,rgba(16,42,33,.30) 78%,rgba(16,42,33,0) 100%);
  /* Warning text on warning-100 surfaces: warning-700 measures 4.18:1 there (below AA 4.5:1), so text uses warning-800 (5.3:1). */
  --er-warning-text:var(--er-warning-800);
  /* Sidebar (admin + workspaces) */
  --er-sidebar-bg:var(--er-forest-950);--er-sidebar-text:#DDE8E1;--er-sidebar-muted:#9FB4A8;--er-sidebar-active:rgba(255,255,255,.10);

  /* Typography */
  --font-display:"Manrope","Inter",sans-serif;--font-body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --text-xs:12px;--text-sm:14px;--text-base:16px;--text-lg:18px;--text-xl:22px;--text-2xl:28px;--text-3xl:36px;--text-4xl:48px;
  --leading-tight:1.2;--leading-normal:1.5;

  /* Spacing (8-point) */
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;

  /* Shape and elevation */
  --radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--radius-pill:999px;
  --shadow-sm:0 1px 2px rgba(16,42,33,.05);--shadow-md:0 8px 24px rgba(16,42,33,.08);--shadow-lg:0 20px 50px rgba(16,42,33,.12);

  /* Layout */
  --er-sidebar-width:264px;--er-sidebar-collapsed:80px;--er-topbar-height:64px;--er-content-max:1600px;--er-reading-max:72ch;
  /* Social measure: a post card is a reading surface, so it keeps ONE width wherever it appears
     (feed, profile, creator dashboard). Both values were already the feed's de-facto column sizes
     in er-social.css; naming them stops other social surfaces stretching the same card to 940px. */
  --er-feed-measure:680px;--er-feed-rail:320px;
  --er-feed-page:calc(var(--er-feed-measure) + var(--er-feed-rail) + var(--space-6));
  /* Account measure: settings, rewards account and order admin are forms and short lists, not
     discovery. Named so the account column stops at a usable form width on wide screens instead of
     stretching every input across 1,100px of viewport. Rail carries read-only context. */
  --er-account-measure:720px;--er-account-rail:340px;--er-form-measure:560px;
  /* Operational panel measure: the 'add a table / raise a requisition / request leave' panel that
     sits inside a workspace page. Named because six kitchen and HR pages had independently
     hard-coded max-width:520px in markup. It is deliberately narrower than --er-form-measure;
     the two should probably converge, but that is a visual decision, not a refactor. */
  --er-panel-measure:520px;
  /* Touch targets. SPEC section 15 fixes these two numbers ("44x44 minimum mobile targets, 48x48
     preferred operational"), but until now every operational input that needed one hard-coded the
     pixel value in markup. Named so the accessibility floor is auditable in one place. */
  --er-touch-min:44px;--er-touch-target:48px;
  --bp-sm:640px;--bp-md:768px;--bp-lg:1024px;--bp-xl:1280px;--bp-2xl:1536px;

  /* Motion */
  --motion-fast:150ms;--motion-base:210ms;--ease-standard:cubic-bezier(.2,0,0,1);

  /* Eatrate Rewards card */
  --er-rewards-card:radial-gradient(circle at top right,rgba(242,188,85,.18),transparent 34%),linear-gradient(135deg,#102A21,#236044);
}
@media (prefers-reduced-motion:reduce){:root{--motion-fast:0ms;--motion-base:0ms}}

/* Data-visualisation series colours. Charts need hues that stay apart for a colour-blind reader,
   which the brand ramps alone cannot supply, so they are defined centrally here rather than in a
   page. The five categorical slots were checked against a white surface with the CVD validator:
   every adjacent pair clears the deuteranope, protanope and tritanope separation floors, the
   normal-vision floor and 3:1 contrast. Assign them in fixed order and never cycle — a sixth
   series folds into Other. The sequential ramp is one hue (forest), light to dark. */
:root{
  /* Categorical series — fixed order, never cycled. */
  --er-viz-1:#1E7B4D;   /* forest green   — the house series (revenue, this period) */
  --er-viz-2:#2B5FC9;   /* blue */
  --er-viz-3:#B4472A;   /* terracotta */
  --er-viz-4:#7A3FB5;   /* violet */
  --er-viz-5:#A85E00;   /* amber */
  --er-viz-other:var(--er-ink-500);  /* the "Other" bucket — deliberately not a hue */
  --er-viz-compare:var(--er-ink-500);/* the previous-period reference line */

  /* Sequential ramp — one hue, light to dark, for magnitude (heat grids). */
  --er-viz-ramp-0:#F1F8F4;--er-viz-ramp-1:#CFE9DA;--er-viz-ramp-2:#94CFB1;--er-viz-ramp-3:#4E9E75;--er-viz-ramp-4:#236044;

  /* Chart furniture — recessive by design. */
  --er-viz-grid:var(--er-stone-200);
  --er-viz-axis:var(--er-text-secondary);
  --er-viz-surface:var(--er-surface);
}

