/*
    FarmOS design tokens — "cage card" direction, adopted 2026-10-09.

    The only colour values in the product. A hex literal anywhere else is a bug.
    Contrast ratios in the comments are measured, not estimated: the floor is 4.5:1 for text
    and 3:1 for control borders, and the lowest text pair here is 5.0:1, because the target
    device is a phone in direct sun.

    See specs/design/design-system.md §2 and §3.

    ---------------------------------------------------------------------------------------
    What changed, and why nothing downstream had to

    Every token name here is the one it was before. Fifty-nine component stylesheets and some
    four and a half thousand references re-skinned by editing this file and nothing else, which
    is the entire reason the rule "a hex literal anywhere else is a bug" was worth enforcing
    for the last three features.

    The direction changed, not the discipline. The old palette was steel and austere, and it
    was right about one thing and wrong about another: right that saturated colour must mean
    something, wrong that the only things worth colouring are alarms. A barn screen read with
    gloves on wants to be recognised before it is read.

    So there are now two families of colour that are neither chrome nor alarm:

      SECTION  — one hue per part of the barn, carried as a card's top edge. Wayfinding only.
      VERB     — one permanent hue and one drawn shape per action, for the life of the product.
                 Weigh is this teal on the cage screen, on the animal record, in the task list
                 and on a printed sheet. The grid is recognised before it is read.

    Colour still never carries meaning alone (§9): every tile and every chip carries its word.
    It carries it faster.

    The state meanings are untouched. Green is still settled, amber still pending, rust still
    held. Re-teaching those would have cost more than any palette is worth.
*/

:root {
    color-scheme: light dark;

    /* ---- Paper. Warm, bright, read in daylight. --------------------------------------
       The wells inside a card are white now rather than a warm grey, so a panel is told
       apart from the card behind it by its border and its corner radius. A grey fill was
       the lazy way to say "this is a panel", and it cost the screen its brightness. */
    --fo-canvas: #FFFBF3;       /* page — straw, barely */
    --fo-surface-1: #FFFFFF;    /* cards, inputs, wells */
    --fo-surface-2: #F6F0E4;    /* table stripe, quiet fills — warm, never grey */
    --fo-quiet: #F6F0E4;        /* the secondary button fill. Same value, named for its job. */
    --fo-line: #E8DFD0;         /* hairlines, dividers, card edges */
    --fo-line-input: #8A8070;   /* control borders               3.4:1, WCAG 1.4.11 */

    /* ---- Ink. Warm neutrals, so nothing on the page is colder than the paper. -------- */
    --fo-ink: #16130D;          /* headings, figures            18.1:1 on surface-1 */
    --fo-body: #332E25;         /* body text                    12.6:1 */
    --fo-secondary: #4D4638;    /* labels, table headers         8.6:1 */
    --fo-muted: #6B6253;        /* basis lines, hints            5.5:1 on white, 5.0:1 on stripe */

    /* ---- State. Meanings unchanged from the steel palette; values brightened. -------- */
    --fo-settled: #146A33;      /* green    5.9:1 — done, paid, complete */
    --fo-settled-bg: #DAF6E3;
    --fo-pending: #8A4A00;      /* amber    6.9:1 — queued, due, waiting */
    --fo-pending-bg: #FFEBD4;
    --fo-held: #9A2214;         /* rust     8.0:1 — withheld, blocked, refused */
    --fo-held-bg: #FBE8E5;
    --fo-focus: #1148B8;        /* blue     7.4:1 — focus only, never a state */
    --fo-on-accent: #FFFFFF;

    /* ---- Verb colours. One per action, for the life of the product. ------------------
       Used as: the pale tint behind a tile, the saturated value for its icon, and the fill
       of a promoted commit button. The label on a tile is --fo-ink, so the label carries the
       contrast (12:1+) and the hue only has to clear 3:1 as a graphic — which is what lets
       the tints stay bright. Every one also clears 4.5:1 under white, for the commit. */
    --fo-verb-task: #146A33;    --fo-verb-task-bg: #DAF6E3;    /* the round */
    --fo-verb-weigh: #0B6E68;   --fo-verb-weigh-bg: #D3F4F0;   /* the scale */
    --fo-verb-treat: #71209F;   --fo-verb-treat-bg: #F6E4FF;   /* the medicine cabinet */
    --fo-verb-move: #3B35B8;    --fo-verb-move-bg: #E5E3FF;    /* a change of housing */
    --fo-verb-breed: #B01355;   --fo-verb-breed-bg: #FFE4EF;   /* a pairing */
    --fo-verb-birth: #C2410C;   --fo-verb-birth-bg: #FFEBD4;   /* a kindling, a kidding */

    /* ---- Section colours. Wayfinding only — a card's top edge. ----------------------- */
    --fo-section-a: #0B6E68;
    --fo-section-b: #C2410C;
    --fo-section-c: #3B35B8;
    --fo-section-d: #B01355;

    /* ---- Type ---- */
    --fo-font-ui: "Atkinson Hyperlegible Next", "Atkinson Hyperlegible",
                  system-ui, -apple-system, "Segoe UI", sans-serif;
    --fo-font-num: "IBM Plex Mono", ui-monospace, "Cascadia Mono", monospace;

    /* 17px base. 16 is a touch small held at arm's length in daylight. */
    --fo-text-root: 17px;
    --fo-text-2xs: 0.75rem;     /* chips only */
    --fo-text-xs: 0.8125rem;    /* basis lines */
    --fo-text-sm: 0.9375rem;
    --fo-text-base: 1rem;
    --fo-text-lg: 1.125rem;
    --fo-text-xl: 1.375rem;
    --fo-text-2xl: 1.75rem;
    --fo-figure: 2.5rem;        /* live weight, lot totals */
    --fo-figure-lg: 3.25rem;    /* the amount about to be paid */

    --fo-weight-normal: 400;
    /* Thirty references across the product asked for --fo-weight-regular, which this file
       never defined, so thirty declarations silently did nothing. Defined as the alias it
       was always meant to be rather than renamed, because renaming would break them again. */
    --fo-weight-regular: 400;
    --fo-weight-medium: 500;
    --fo-weight-bold: 700;
    --fo-weight-heavy: 800;

    --fo-leading-tight: 1.2;
    --fo-leading-body: 1.55;

    /* ---- Space: 4px base ---- */
    --fo-s1: 0.25rem;
    --fo-s2: 0.5rem;
    --fo-s3: 0.75rem;
    --fo-s4: 1rem;
    --fo-s6: 1.5rem;
    --fo-s8: 2rem;
    --fo-s12: 3rem;
    --fo-s16: 4rem;

    /* ---- Shape. Rounder throughout: the corners carry most of the friendliness. ------ */
    --fo-radius-control: 16px;
    --fo-radius-card: 24px;
    --fo-radius-tile: 20px;
    --fo-radius-chip: 999px;    /* the chip vocabulary (§5) — and nothing else */
    --fo-radius-pill: 999px;
    /* Small controls: a checkbox, a swatch, a tag. Deliberately NOT --fo-radius-chip, which is
       fully round: Fluent maps its small radius here, and a fully round checkbox is a checkbox
       that looks like a radio button. */
    --fo-radius-small: 8px;
    --fo-border: 1px;
    --fo-border-heavy: 2px;     /* the ticket rule, and the edge of every white well */

    /* ---- Targets ---- */
    --fo-target-min: 48px;      /* the smallest a cold thumb reliably hits */
    --fo-target-commit: 56px;   /* capture, pay, confirm */

    /* ---- Motion ---- */
    --fo-motion-fast: 90ms;
    --fo-motion-base: 140ms;
    --fo-ease: cubic-bezier(0.2, 0, 0.1, 1);
}

/*
    Barn at night, truck at night. Warm dark rather than the old steel, so it is the same
    design after sundown rather than a second one.

    The verb hues keep their identity and swap which end of the pair carries the surface: the
    tint becomes a deep wash and the saturated value becomes the foreground, so a tile is still
    recognisably "the teal one" without glowing.

    Guarded by :not([data-theme="light"]) so an explicit light choice wins over the OS.
*/
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --fo-ink: #FAF6EF;
        --fo-body: #E4DCD0;         /* 12.5:1 on card */
        --fo-secondary: #C7BDAE;
        --fo-muted: #A0968A;        /*  6.1:1 on card */
        --fo-line: #3C352C;
        --fo-line-input: #8C8172;   /*  4.4:1 on card */
        --fo-surface-2: #2E2820;
        --fo-quiet: #2E2820;
        --fo-surface-1: #211D18;
        --fo-canvas: #16130F;

        --fo-settled: #6FD48D;      /*  9.4:1 on card */
        --fo-settled-bg: #0F2F1A;
        --fo-pending: #FFC266;      /*  9.9:1 */
        --fo-pending-bg: #3A2A10;
        --fo-held: #FF9A8A;         /*  7.9:1 */
        --fo-held-bg: #3A1813;
        --fo-focus: #7FAEFF;        /*  8.4:1 */
        --fo-on-accent: #16130F;

        --fo-verb-task: #6FD48D;    --fo-verb-task-bg: #0F2F1A;
        --fo-verb-weigh: #5FD9D0;   --fo-verb-weigh-bg: #0E3330;
        --fo-verb-treat: #D9A2F5;   --fo-verb-treat-bg: #2E1440;
        --fo-verb-move: #A5A0FF;    --fo-verb-move-bg: #1F1D45;
        --fo-verb-breed: #FF8FC0;   --fo-verb-breed-bg: #3A1326;
        --fo-verb-birth: #FFB366;   --fo-verb-birth-bg: #3A2512;

        --fo-section-a: #5FD9D0;
        --fo-section-b: #FFB366;
        --fo-section-c: #A5A0FF;
        --fo-section-d: #FF8FC0;
    }
}

/* The in-app override, for a driver who wants dark in a lit cab. */
:root[data-theme="dark"] {
    --fo-ink: #FAF6EF;
    --fo-body: #E4DCD0;
    --fo-secondary: #C7BDAE;
    --fo-muted: #A0968A;
    --fo-line: #3C352C;
    --fo-line-input: #8C8172;
    --fo-surface-2: #2E2820;
    --fo-quiet: #2E2820;
    --fo-surface-1: #211D18;
    --fo-canvas: #16130F;

    --fo-settled: #6FD48D;
    --fo-settled-bg: #0F2F1A;
    --fo-pending: #FFC266;
    --fo-pending-bg: #3A2A10;
    --fo-held: #FF9A8A;
    --fo-held-bg: #3A1813;
    --fo-focus: #7FAEFF;
    --fo-on-accent: #16130F;

    --fo-verb-task: #6FD48D;    --fo-verb-task-bg: #0F2F1A;
    --fo-verb-weigh: #5FD9D0;   --fo-verb-weigh-bg: #0E3330;
    --fo-verb-treat: #D9A2F5;   --fo-verb-treat-bg: #2E1440;
    --fo-verb-move: #A5A0FF;    --fo-verb-move-bg: #1F1D45;
    --fo-verb-breed: #FF8FC0;   --fo-verb-breed-bg: #3A1326;
    --fo-verb-birth: #FFB366;   --fo-verb-birth-bg: #3A2512;

    --fo-section-a: #5FD9D0;
    --fo-section-b: #FFB366;
    --fo-section-c: #A5A0FF;
    --fo-section-d: #FF8FC0;
}

/*
    prefers-contrast: more collapses the muted tier into body text and hardens every line.
    Design system §9.
*/
@media (prefers-contrast: more) {
    :root {
        --fo-muted: var(--fo-body);
        --fo-line: var(--fo-body);
        --fo-line-input: var(--fo-body);
    }
}
