/* The Maine Operations Hub — design tokens.
 *
 * THIS IS THE ONLY FILE THAT MAY CONTAIN A LITERAL COLOUR VALUE.
 *
 * SOURCE OF TRUTH: the Daily Sales dashboard (`../maine-dashboard`), sampled
 * from its inline literals — see research/APP-daily-sales.md §1.4. That app is
 * the house style and every page here matches it.
 *
 * The ONLY deviation from Daily Sales is shape: all corners are squared, which
 * is the one thing borrowed from the Chef's Cookbook.
 *
 * The Cookbook contributes nothing else except the login page's treatment. It
 * is a third-party app and is never restyled.
 */

:root {
  /* ---- Grounds and surfaces: a warm bone/oat ramp. Never white, never grey. */
  --ground: 236 231 220;        /* #ECE7DC oat — page background            */
  --bone: 244 239 229;          /* #F4EFE5 header bg; also text on dark     */
  --card: 252 250 245;          /* #FCFAF5 cards, panels, popovers, inputs  */
  --white: 255 255 255;         /* #FFFFFF secondary-button hover only      */
  --dark: 22 20 15;             /* #16140F ink black — brand dark surfaces  */
  --dark-hover: 42 38 32;       /* #2A2620 hover for every dark button      */

  /* ---- Text ink ramp, four warm steps. */
  --ink: 14 14 12;              /* #0E0E0C primary — body, headings, numbers */
  --ink-2: 58 55 47;            /* #3A372F secondary — modal copy, labels    */
  --ink-3: 110 106 94;          /* #6E6A5E muted — eyebrows, row labels      */
  --ink-4: 154 149 138;         /* #9A958A faintest — units, table heads     */
  --ink-disabled: 200 194 177;  /* #C8C2B1 disabled                          */
  --chart-neutral: 138 133 118; /* #8A8576 "last year" bars only             */

  /* ---- Brand accents. Gold is the colour that says "The Maine". */
  --gold: 193 154 91;           /* #C19A5B house accent                     */
  --gold-bright: 215 162 59;    /* #D7A23B Oyster accent; login button hover */
  --gold-pale: 224 198 145;     /* #E0C691 Street accent                    */

  /* ---- Outlet identity. Straight from the dashboard's META block. */
  --outlet-oyster: 20 42 75;        /* #142A4B deep navy  */
  --outlet-oyster-accent: 215 162 59;
  --outlet-land: 28 58 42;          /* #1C3A2A forest     */
  --outlet-land-accent: 193 154 91;
  --outlet-street: 161 42 22;       /* #A12A16 rust red   */
  --outlet-street-accent: 224 198 145;
  --outlet-group: 22 20 15;         /* #16140F ink black  */
  --outlet-group-accent: 193 154 91;
  /* Palm has no dashboard entry yet; ink black until the owner assigns one. */
  --outlet-palm: 22 20 15;
  --outlet-palm-accent: 193 154 91;

  /* ---- Semantic. Two variants because the dashboard uses different values
   *      on light grounds and on the dark identity band. */
  --pos: 46 125 91;             /* #2E7D5B on light  */
  --neg: 179 36 43;             /* #B3242B on light  */
  --pos-on-dark: 116 216 162;   /* #74D8A2           */
  --neg-on-dark: 255 142 140;   /* #FF8E8C           */
  --err-text: 142 43 34;        /* #8E2B22           */
  --err-on-dark: 255 157 153;   /* #FF9D99           */
  --warn: 178 106 0;            /* #B26A00 amber     */

  /* ---- Hairlines are never grey: always ink at low alpha, so they
   *      warm-shift over the oat ground. Alphas from the dashboard. */
  --a-hover: 0.03;
  --a-track: 0.05;
  --a-grid: 0.07;
  --a-sep: 0.08;
  --a-ring: 0.10;
  --a-border: 0.12;   /* the default card border */
  --a-rule: 0.14;
  --a-control: 0.16;
  --a-strong: 0.22;
  --a-dashed: 0.30;

  /* ---- Type. DM Sans is the only face the dashboard actually renders;
   *      it also loads Playfair Display and never uses it, so we do not. */
  --font-body: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: var(--font-body);

  --t-band: 30px;    /* identity-band title */
  --t-h1: 26px;
  --t-h2: 20px;
  --t-kpi: 28px;     /* KPI figure */
  --t-body: 14px;
  --t-small: 13px;
  --t-label: 11px;   /* uppercase eyebrow */
  --t-legal: 10px;

  --track-label: 1.4px;
  --track-eyebrow: 2.2px;
  --track-legal: 1.2px;

  --lh-tight: 1.2;
  --lh-body: 1.5;

  /* ---- Shape. THE ONE CHANGE FROM DAILY SALES: everything is squared.
   *      The dashboard uses 8px cards / 6px controls; the owner wants no
   *      rounded corners anywhere, so every radius token is 0.
   *      --radius-round stays for genuinely circular marks (the seal, the
   *      spinner, the calendar availability dot). */
  --radius: 0px;
  --radius-card: 0px;
  --radius-control: 0px;
  --radius-float: 0px;
  --radius-round: 50%;

  --border: 1px;

  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-7: 32px;
  --sp-8: 48px;
  --sp-9: 64px;

  --page-max: 1280px;
  --measure: 68ch;

  /* ---- Shadows: large, heavily negative spread — the dashboard's signature. */
  --shadow-band: 0 10px 30px -16px rgb(var(--ink) / 0.5);
  --shadow-card: 0 14px 34px -18px rgb(var(--ink) / 0.35);
  --shadow-float: 0 16px 36px -12px rgb(var(--ink) / 0.45);

  --focus-ring: 2px solid rgb(var(--gold));
  --focus-offset: 2px;

  --speed: 140ms;
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
}

/* The dashboard is a single light theme. There is no dark mode in the house
 * style, so we do not invent one — the only dark surfaces are the identity
 * band, the login page and primary buttons, which are dark by design. */

@media (prefers-reduced-motion: reduce) {
  :root { --speed: 0ms; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}