/* The palette — every colour this product uses, by what it is for.
 *
 * Its own file rather than part of the tailwind build, because the build only
 * reaches pages that load projectspace.css: bare_base and the two nav bases.
 * base.html does not, so /signin/ and everything else extending it directly had
 * no palette at all, and fell through to f4django's maroon. Loading it here
 * means every page has the colours, whether or not it has tailwind.
 *
 * tailwind.css imports this too, so there is one source and `@theme inline`
 * keeps mapping these into the utility namespace.
 *
 * ⚠️ THIS file is the source. `source/static/palette.css` is a COPY — that directory
 * is STATIC_ROOT, gitignored, written by collectstatic. Editing it changes nothing in
 * development (the app-directories finder serves this one) and is overwritten on the
 * next collect. Cost one confused round of screenshots on 2026-09-04.
 *
 * **The base is C, cool-professional, since 2026-09-04.** It used to be A,
 * warm-editorial — which mattered more than it looks, because the picker keeps its
 * choice in localStorage and defaults to whatever the bare `:root` block is. Nobody
 * who had not found the palette button had ever seen anything but A, including the
 * people whose opinion decides this.
 *
 * Still four positions and still switchable: A now lives in `[data-palette='warm']`
 * like the other two, so nothing was thrown away and reconsidering is one edit here
 * plus one constant in `templates/palette_picker.html`. See docs/style-directions.md.
 */
:root {
    --ground: #F5F6F8;    /* page behind everything */
    --surface: #FFFFFF;   /* cards, panels, message bodies */
    --panel: #ECEEF2;     /* recessed: side panels, hover fills */
    --ink: #1A1F2B;       /* body text */
    --muted: #667085;     /* secondary text, timestamps, hints */
    --hair: #DCE0E8;      /* borders and rules */
    --current: #4338CA;   /* the accent: links, active state, primary buttons */
    --forest: #312E81;    /* accent, deeper — hover on primary */
    --gold: #B45309;      /* per-person and status accents … */
    --clay: #9F1239;
    --under: #0F766E;
    --sel: #E7E7FB;       /* selected rows */
    --display-font: -apple-system, 'SF Pro Display', system-ui, 'Segoe UI', Roboto, sans-serif;
    /* The body font for LEGACY pages. general_controls.css sets `body { font-family:
     * var(--main-font) }`, and the only thing that ever defined that name was
     * f4django's roboto.css — which also declares seven @font-face rules pointing at
     * .ttf files. Loading that stylesheet is therefore what made the whole application
     * download a webfont: 5,309 requests and 0.4 GB served between March and August.
     *
     * Named here instead, as the same system stack System B already renders in. Roboto
     * stays in the list as a NAME, which is all System B ever meant by it — it resolves
     * to a locally installed copy on Android and ChromeOS and downloads nothing. On a
     * Mac this is SF Pro, which is what the tailwind surfaces have been using all along,
     * so the two halves of the app finally agree about what they look like.
     */
    --main-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, Roboto,
                 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji',
                 'Segoe UI Emoji';
    --shadow: 0 1px 2px rgba(16,24,40,.06), 0 8px 24px rgba(16,24,40,.08);
}

@media (prefers-color-scheme: dark) {
    :root {
        --ground: #0F1218; --surface: #171B23; --panel: #141821;
        --ink: #E7EAF0; --muted: #9AA3B5; --hair: #262C38;
        --current: #A5A0F5; --forest: #C7C4FA; --gold: #E8A33D;
        --clay: #F2718C; --under: #5EEAD4;
        --sel: #232445;
        /* The shadow is a property of the SCHEME, not of the palette — a soft
           coloured shadow is invisible on a near-black ground whichever direction
           is chosen. None of the [data-palette] blocks below redefine it. */
        --shadow: 0 1px 2px rgba(0,0,0,.3), 0 10px 30px rgba(0,0,0,.35);
    }
}

/* ---- the other three directions (temporary) --------------------------
   Four committed positions on the real product, switched from the nav bar.
   C is the base above; A, B and D are here. Swapping which one is the base is
   moving one block up and one block down, plus the constant in the picker.
   Lifted out of TalkPanel's scoped styles on 2026-08-05: scoped there, they
   only ever restyled Talk, so three of the four could not be judged on the
   pages where a palette actually fails — dense tables, long forms, files.
   At :root they reach every surface, including legacy pages, because the
   whole palette is custom properties.
   Delete the losers, and this block, once the direction is chosen.
   See docs/style-directions.md. */

/* A. warm-editorial — the original direction, and the base until 2026-09-04.
   Its serif display face is the thing no other direction has, and the reason to
   keep it reachable rather than delete it. */
:root[data-palette='warm'] {
    --ground: #F4F1E8; --surface: #FBFAF3; --panel: #EDE9DA;
    --ink: #23291F; --muted: #6E7263; --hair: #DED9C8;
    --current: #1F6F5C; --forest: #223A2E; --gold: #B98F3E;
    --clay: #A9673C; --under: #43596A;
    --sel: #E3EDE8;
    --display-font: 'Iowan Old Style', 'Palatino Linotype', Palatino, 'Book Antiqua', Georgia, serif;
    --shadow: 0 1px 2px rgba(34,58,46,.06), 0 8px 24px rgba(34,58,46,.07);
}

/* B. quiet-neutral — the UI has no opinions; content supplies the colour. */
:root[data-palette='quiet'] {
    --ground: #F6F6F5; --surface: #FFFFFF; --panel: #EDEDEB;
    --ink: #1B1C1A; --muted: #6F716C; --hair: #E1E1DE;
    --current: #3F5D74; --forest: #2E4657; --gold: #8A7A4E;
    --clay: #8A6A55; --under: #5A6570;
    --sel: #E9EEF2;
    --display-font: -apple-system, 'SF Pro Text', system-ui, 'Segoe UI', Roboto, sans-serif;
    --shadow: 0 1px 2px rgba(0,0,0,.05), 0 8px 24px rgba(0,0,0,.05);
}

/* C. cool-professional is the base at the top of this file, so it has no block —
   selecting it is the ABSENCE of the attribute. `palette_picker.html` knows that. */

/* D. high-contrast — legibility and structure first, for people who live
   in tables all day. */
:root[data-palette='contrast'] {
    --ground: #FFFFFF; --surface: #FFFFFF; --panel: #F1F1F1;
    --ink: #0A0A0A; --muted: #565656; --hair: #C4C4C4;
    --current: #0B57D0; --forest: #06357A; --gold: #8A5A00;
    --clay: #A3000F; --under: #00625B;
    --sel: #DCE7FB;
    --display-font: -apple-system, 'SF Pro Text', system-ui, 'Segoe UI', Roboto, sans-serif;
    --shadow: none;
}

@media (prefers-color-scheme: dark) {
    :root[data-palette='warm'] {
        --ground: #12160F; --surface: #1A2016; --panel: #171C13;
        --ink: #E9EBE0; --muted: #9BA08C; --hair: #2C3427;
        --current: #54B79C; --forest: #8FC7B2; --gold: #D9B25F;
        --clay: #D0925F; --under: #9FB6C4;
        --sel: #1E2C25;
    }
    :root[data-palette='quiet'] {
        --ground: #131413; --surface: #1B1C1A; --panel: #181917;
        --ink: #E8E9E5; --muted: #94968F; --hair: #2B2D29;
        --current: #86A8C0; --forest: #A8C2D2; --gold: #C9B77E;
        --clay: #C29A82; --under: #A3AEB8;
        --sel: #232B31;
    }
    :root[data-palette='contrast'] {
        --ground: #000000; --surface: #0D0D0D; --panel: #161616;
        --ink: #FAFAFA; --muted: #A6A6A6; --hair: #3C3C3C;
        --current: #8AB4F8; --forest: #AECBFA; --gold: #FDD663;
        --clay: #F28B82; --under: #78D9D1;
        --sel: #17253D;
    }
}
