/* ─────────────────────────────────────────────────────────────────────────
   TIER 1 — PRIMITIVES
   Raw values. Never referenced by a component, never overridden by an app.
   See specs/design-system.md §3.2.

   This file also declares the cascade-layer order for the whole product.
   It must therefore be the FIRST stylesheet loaded on every page.
   ───────────────────────────────────────────────────────────────────────── */

@layer reset, tokens, base, components, apps, utilities;

@layer tokens {
  :root {
    /* ── Brand ramps ───────────────────────────────────────────────────
       Promoted from web/view/static/view/css/shared.css so the CRM and the
       public site finally share one palette. --olive-600 is what the CRM
       called --accent; --green-900 is what it called --text. */
    --olive-50:  #f5f6e8;
    --olive-100: #eef0d5;
    --olive-200: #e0e2b8;
    --olive-300: #cdd095;
    --olive-400: #b8bb78;
    --olive-500: #a8ab5d;
    --olive-600: #989B4B;
    --olive-700: #6f7433;
    --olive-800: #565a24;
    --olive-900: #3d4118;
    --olive-950: #2a2c0e;

    --green-50:  #eef7f5;
    --green-100: #ddeee9;
    --green-200: #beddd6;
    --green-300: #96c5bb;
    --green-400: #6faa9e;
    --green-500: #4f8e80;
    --green-600: #3d7366;
    --green-700: #2f5a4f;
    --green-800: #234139;
    --green-900: #192F2B;
    --green-950: #0b1614;

    --cream: #F6F7EE;
    --white: #ffffff;
    --black: #000000;

    /* ── Neutral ramp ──────────────────────────────────────────────────
       The product's greys are warm, not green. They get their own ramp so
       that semantic neutrals (surfaces, borders, muted text) keep the exact
       colours they have today instead of being pulled toward --green-*. */
    --stone-50:  #fafaf8;
    --stone-100: #f5f5f5;
    --stone-150: #f0eeea;
    --stone-200: #e8e6e1;
    --stone-300: #b5b5b0;
    --stone-400: #9d9d98;
    --stone-500: #8a8a85;
    --stone-600: #6f6f6a;
    --stone-700: #4a4a46;
    --stone-800: #3a3a36;
    --stone-900: #2c2c2c;

    /* ── Status hues ───────────────────────────────────────────────────
       Deliberately outside the brand ramps: danger/success/warning must not
       follow an app accent or a red app would have invisible errors. */
    --red-50:  #ffebee;
    --red-100: #ffcdd2;
    --red-200: #f5bcbc;
    --red-500: #e57373;
    --red-600: #d32f2f;
    --red-700: #c62828;
    --red-800: #b71c1c;

    --moss-50:  #e8f5e9;
    --moss-100: #c8e6c9;
    --moss-700: #2e7d32;

    --amber-50:  #fff3e0;
    --amber-400: #f59e0b;
    --amber-500: #ff9800;
    --amber-600: #f57c00;
    --amber-700: #f57f17;
    --amber-900: #e65100;

    --orange-500: #F84C01;

    /* ── App accent hues ───────────────────────────────────────────────
       Ramps an app theme draws its accent pair from (tokens/apps.css).
       Coherence's teal is lifted from the real brand system in
       metis_apps/coherence/templates/iris/cards/the-coherence-company/. */
    --teal-100: #D6F6F6;
    --teal-300: #9DECEC;
    --teal-500: #4BDBDB;
    --teal-700: #2BB8B8;

    /* ── Categorical hues ──────────────────────────────────────────────
       Identity colours for holon types, note types and interest tags. They
       encode *which thing this is*, not *what state it is in*, so they are
       chosen for mutual distinguishability and never derived from an accent.
       Referenced only from tier 3. */
    --cat-sage-100:   #d4e5d0;
    --cat-rose-100:   #ffe4e6;
    --cat-rose-800:   #9f1239;
    --cat-lime-100:   #ecfccb;
    --cat-lime-700:   #4d7c0f;
    --cat-mint-300:   #6ee7b7;
    --cat-mint-900:   #064e3b;
    --cat-jade-300:   #86efac;
    --cat-jade-900:   #14532d;
    --cat-violet-300: #c4b5fd;
    --cat-violet-950: #1e1b4b;
    --cat-pink-200:   #fbcfe8;
    --cat-pink-900:   #831843;
    --cat-blue-100:   #dbeafe;
    --cat-blue-900:   #1e3a8a;
    --cat-indigo-100: #e0e7ff;
    --cat-indigo-900: #312e81;
    --cat-sky-100:    #e3f2fd;
    --cat-sky-200:    #bbdefb;
    --cat-sky-800:    #1565c0;
    --cat-teal-600:   #109367;
    --cat-fern-600:   #3F925B;
    --cat-steel-600:  #347A9D;
    --cat-emerald-100: #dcfce7;
    --cat-emerald-800: #166534;
    --cat-blush-50:   #fce4ec;

    /* ── Non-colour scales ─────────────────────────────────────────────
       This is where perceived polish comes from. Do not add steps. */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-6: 24px;
    --space-8: 32px;
    --space-12: 48px;
    --space-16: 64px;

    /* Seven steps, replacing 103 ad-hoc font sizes. Sized against the CRM's
       14px root: 9.6 / 10.5 / 11.4 / 12.3 / 14 / 17.5 / 21px. */
    --text-xs:   0.6875rem;
    --text-sm:   0.75rem;
    --text-base: 0.8125rem;
    --text-md:   0.875rem;
    --text-lg:   1rem;
    --text-xl:   1.25rem;
    --text-2xl:  1.5rem;

    --radius-sm:   4px;
    --radius-md:   8px;
    --radius-lg:   14px;
    --radius-full: 999px;

    --elev-0: none;
    --elev-1: 0 1px 2px rgb(25 47 43 / .06);
    --elev-2: 0 2px 8px -2px rgb(25 47 43 / .10);
    --elev-3: 0 8px 24px -8px rgb(25 47 43 / .18);

    --ease-out:    cubic-bezier(.2, .8, .2, 1);
    --ease-in-out: cubic-bezier(.4, 0, .2, 1);
    --dur-fast: 120ms;
    --dur-base: 200ms;
    --dur-slow: 320ms;

    /* Typefaces. --font-ui and --font-mono are platform-locked and may never
       be themed; only --font-display (tier 2) varies per app. */
    --font-ui:    "Red Hat Display", system-ui, sans-serif;
    --font-body:  "Red Hat Text", "Red Hat Display", system-ui, sans-serif;
    --font-mono:  "Red Hat Mono", ui-monospace, monospace;
    --font-serif: "Newsreader", Georgia, serif;
  }
}