/* Alternate palettes.
 *
 * app.css defines the default (Talio) on :root. Each block here replaces the
 * whole colour set for one palette, in both light and dark, selected by
 * data-palette on the root element.
 *
 * Palette and light/dark are orthogonal on purpose: picking a palette should
 * not decide whether your phone is in night mode, and vice versa. So every
 * palette declares all three states -- bare (light), the prefers-dark media
 * query guarded against an explicit light choice, and the explicit dark
 * attribute -- exactly as the default does.
 *
 * Only tokens change. No rule in app.css knows which palette is on, which is
 * why the semantic names are worth the rename: --olive being pink in one of
 * these would be a trap for whoever reads this next.
 *
 * Selectors are attribute-only rather than :root-anchored so the settings
 * picker can put a palette on a detached probe element and read the resolved
 * colours back out. That is what keeps the swatches honest -- they are the
 * real values from this file, not a second copy in JavaScript that drifts the
 * first time either is edited.
 *
 * ---------------------------------------------------------------------------
 * FILL versus INK
 *
 * Each hue comes in two strengths, and they are not interchangeable:
 *
 *   --accent        the fill. Button backgrounds, progress bars, dots.
 *   --accent-ink    the same hue as TEXT, darkened (or lightened, in dark
 *                   mode) until it clears 4.5:1 on paper, on surface, and on
 *                   its own --accent-soft background.
 *
 * A hue chosen to look right as a 40px button fill is almost never dark
 * enough to read as 12px type, which is how a palette ends up technically
 * pretty and practically unreadable. Every text rule uses the -ink variant;
 * every fill uses the base. tests/test_contrast.py checks all of it, so a
 * new palette cannot quietly ship failing pairs.
 * ---------------------------------------------------------------------------
 */

/* ======================================================================= */
/* Talio — the default. Olive and clay on warm paper.                     */
/*                                                                          */
/* Restated here so the picker can preview it like any other. app.css still */
/* owns what an unset root looks like; these two must move together, which  */
/* is the cost of a swatch you can trust.                                   */
/* ======================================================================= */

[data-palette="talio"] {
  --paper: #faf7f2; --surface: #ffffff; --surface-2: #f4f0e8; --surface-3: #ebe5d9;
  --ink: #2b2724; --ink-2: #5c5449; --muted: #786f65;
  --line: #e4ddd0; --line-strong: #999185;
  --on-primary: #ffffff; --on-accent: #161412;
  --primary: #4a6b4f; --primary-ink: #3f5b43; --primary-soft: #e6eee6;
  --accent: #c0674a; --accent-ink: #9d543c; --accent-soft: #f8e9e3;
  --warn: #b8860b; --warn-ink: #886308; --warn-soft: #f7eed6;
  --maybe: #7a5c8e; --maybe-ink: #7a5c8e; --maybe-soft: #f0e9f5;
  --meal: #4a5f8e; --meal-ink: #4a5f8e; --meal-soft: #e6ebf5;
}

@media (prefers-color-scheme: dark) {
  [data-palette="talio"]:not([data-theme="light"]) {
    --paper: #191713; --surface: #221f1a; --surface-2: #2b2721; --surface-3: #363029;
    --ink: #f2ede4; --ink-2: #cdc4b6; --muted: #9a9083;
    --line: #363029; --line-strong: #716c5f;
    --on-primary: #16210f; --on-accent: #161412;
    --primary: #93b998; --primary-ink: #93b998; --primary-soft: #26332a;
    --accent: #e0906e; --accent-ink: #e0906e; --accent-soft: #3a2820;
    --warn: #ddb257; --warn-ink: #ddb257; --warn-soft: #362d18;
    --maybe: #bda3cd; --maybe-ink: #bda3cd; --maybe-soft: #2e2635;
    --meal: #94a8d4; --meal-ink: #94a8d4; --meal-soft: #232a3a;
  }
}

[data-palette="talio"][data-theme="dark"] {
  --paper: #191713; --surface: #221f1a; --surface-2: #2b2721; --surface-3: #363029;
  --ink: #f2ede4; --ink-2: #cdc4b6; --muted: #9a9083;
  --line: #363029; --line-strong: #716c5f;
  --on-primary: #16210f; --on-accent: #161412;
  --primary: #93b998; --primary-ink: #93b998; --primary-soft: #26332a;
  --accent: #e0906e; --accent-ink: #e0906e; --accent-soft: #3a2820;
  --warn: #ddb257; --warn-ink: #ddb257; --warn-soft: #362d18;
  --maybe: #bda3cd; --maybe-ink: #bda3cd; --maybe-soft: #2e2635;
  --meal: #94a8d4; --meal-ink: #94a8d4; --meal-soft: #232a3a;
}

/* ======================================================================= */
/* Ink & Marigold — editorial, high contrast, warm gold.                   */
/* Reads like a well-set cookbook. The most "designed" of the four.        */
/* ======================================================================= */

[data-palette="ink"] {
  --paper: #fdfcfa; --surface: #ffffff; --surface-2: #f2f0ec; --surface-3: #e6e3dd;
  --ink: #1a1a18; --ink-2: #4a4844; --muted: #76736c;
  --line: #e2dfd8; --line-strong: #94918b;
  --on-primary: #ffffff; --on-accent: #ffffff;
  --primary: #8a6d1f; --primary-ink: #82671d; --primary-soft: #f7f0da;
  --accent: #a83232; --accent-ink: #a83232; --accent-soft: #f9e6e4;
  --warn: #9a6b12; --warn-ink: #8e6311; --warn-soft: #f6eeda;
  --maybe: #6b5b8f; --maybe-ink: #6b5b8f; --maybe-soft: #eeebf4;
  --meal: #2f5d5a; --meal-ink: #2f5d5a; --meal-soft: #e2eeed;
}

@media (prefers-color-scheme: dark) {
  [data-palette="ink"]:not([data-theme="light"]) {
    --paper: #131311; --surface: #1c1c19; --surface-2: #262622; --surface-3: #33332d;
    --ink: #f4f2ec; --ink-2: #cfccc3; --muted: #96938a;
    --line: #33332d; --line-strong: #6a6963;
    --on-primary: #201a06; --on-accent: #161412;
    --primary: #e3b64a; --primary-ink: #e3b64a; --primary-soft: #33290f;
    --accent: #e8695f; --accent-ink: #e8695f; --accent-soft: #3a1f1c;
    --warn: #ddb257; --warn-ink: #ddb257; --warn-soft: #362d18;
    --maybe: #a99ad0; --maybe-ink: #a99ad0; --maybe-soft: #26233a;
    --meal: #74b8b2; --meal-ink: #74b8b2; --meal-soft: #16302e;
  }
}

[data-palette="ink"][data-theme="dark"] {
  --paper: #131311; --surface: #1c1c19; --surface-2: #262622; --surface-3: #33332d;
  --ink: #f4f2ec; --ink-2: #cfccc3; --muted: #96938a;
  --line: #33332d; --line-strong: #6a6963;
  --on-primary: #201a06; --on-accent: #161412;
  --primary: #e3b64a; --primary-ink: #e3b64a; --primary-soft: #33290f;
  --accent: #e8695f; --accent-ink: #e8695f; --accent-soft: #3a1f1c;
  --warn: #ddb257; --warn-ink: #ddb257; --warn-soft: #362d18;
  --maybe: #a99ad0; --maybe-ink: #a99ad0; --maybe-soft: #26233a;
  --meal: #74b8b2; --meal-ink: #74b8b2; --meal-soft: #16302e;
}

/* ======================================================================= */
/* Slate & Basil — cool, crisp, modern. Blue-grey ground, fresh green.     */
/* The closest to a conventional app, if the warm ones feel too cosy.      */
/* ======================================================================= */

[data-palette="slate"] {
  --paper: #f7f9fa; --surface: #ffffff; --surface-2: #eef2f5; --surface-3: #e0e7ec;
  --ink: #1e262b; --ink-2: #4a565e; --muted: #667179;
  --line: #dde5ea; --line-strong: #8c949a;
  --on-primary: #ffffff; --on-accent: #161412;
  --primary: #2e7d5b; --primary-ink: #2b7656; --primary-soft: #e0f0e8;
  --accent: #d1584a; --accent-ink: #ae493e; --accent-soft: #fbe8e5;
  --warn: #b07a10; --warn-ink: #90640d; --warn-soft: #f8f0dc;
  --maybe: #6a63a8; --maybe-ink: #665fa1; --maybe-soft: #eaeaf6;
  --meal: #2b6a9c; --meal-ink: #2b6a9c; --meal-soft: #e3eff7;
}

@media (prefers-color-scheme: dark) {
  [data-palette="slate"]:not([data-theme="light"]) {
    --paper: #0f1518; --surface: #161e22; --surface-2: #1f292e; --surface-3: #2b373d;
    --ink: #eaf1f4; --ink-2: #b9c7cf; --muted: #86959e;
    --line: #2b373d; --line-strong: #5f6b72;
    --on-primary: #06180f; --on-accent: #161412;
    --primary: #63c295; --primary-ink: #63c295; --primary-soft: #143024;
    --accent: #f0806f; --accent-ink: #f0806f; --accent-soft: #3a1f1b;
    --warn: #e0b95e; --warn-ink: #e0b95e; --warn-soft: #332c15;
    --maybe: #9a92e0; --maybe-ink: #9a92e0; --maybe-soft: #22203c;
    --meal: #6bb0e0; --meal-ink: #6bb0e0; --meal-soft: #16283a;
  }
}

[data-palette="slate"][data-theme="dark"] {
  --paper: #0f1518; --surface: #161e22; --surface-2: #1f292e; --surface-3: #2b373d;
  --ink: #eaf1f4; --ink-2: #b9c7cf; --muted: #86959e;
  --line: #2b373d; --line-strong: #5f6b72;
  --on-primary: #06180f; --on-accent: #161412;
  --primary: #63c295; --primary-ink: #63c295; --primary-soft: #143024;
  --accent: #f0806f; --accent-ink: #f0806f; --accent-soft: #3a1f1b;
  --warn: #e0b95e; --warn-ink: #e0b95e; --warn-soft: #332c15;
  --maybe: #9a92e0; --maybe-ink: #9a92e0; --maybe-soft: #22203c;
  --meal: #6bb0e0; --meal-ink: #6bb0e0; --meal-soft: #16283a;
}

/* ======================================================================= */
/* Plum & Apricot — softer and warmer, a bit more playful.                 */
/* Note the swap: "maybe" goes green here, because the plum is the primary */
/* and a suggestion has to stay visibly distinct from a commitment.        */
/* ======================================================================= */

[data-palette="plum"] {
  --paper: #fdf8f6; --surface: #ffffff; --surface-2: #f6eeeb; --surface-3: #ede0db;
  --ink: #2c2224; --ink-2: #5b494c; --muted: #7f6c70;
  --line: #ecdfdb; --line-strong: #9f918d;
  --on-primary: #ffffff; --on-accent: #161412;
  --primary: #7d4470; --primary-ink: #7d4470; --primary-soft: #f3e8f1;
  --accent: #c96a3c; --accent-ink: #a15530; --accent-soft: #fbeade;
  --warn: #b07d1a; --warn-ink: #8d6415; --warn-soft: #f8f0da;
  --maybe: #4f7a6b; --maybe-ink: #497163; --maybe-soft: #e6f0ec;
  --meal: #4a6194; --meal-ink: #4a6194; --meal-soft: #e7ebf6;
}

@media (prefers-color-scheme: dark) {
  [data-palette="plum"]:not([data-theme="light"]) {
    --paper: #1a1416; --surface: #241c1f; --surface-2: #2e2429; --surface-3: #3a2e33;
    --ink: #f5ecef; --ink-2: #d4c2c8; --muted: #a08d93;
    --line: #3a2e33; --line-strong: #75696e;
    --on-primary: #24101f; --on-accent: #161412;
    --primary: #d79dc9; --primary-ink: #d79dc9; --primary-soft: #32202e;
    --accent: #eda06e; --accent-ink: #eda06e; --accent-soft: #3a2519;
    --warn: #ddb257; --warn-ink: #ddb257; --warn-soft: #362d18;
    --maybe: #7fb9a4; --maybe-ink: #7fb9a4; --maybe-soft: #1c322b;
    --meal: #92a8de; --meal-ink: #92a8de; --meal-soft: #23293e;
  }
}

[data-palette="plum"][data-theme="dark"] {
  --paper: #1a1416; --surface: #241c1f; --surface-2: #2e2429; --surface-3: #3a2e33;
  --ink: #f5ecef; --ink-2: #d4c2c8; --muted: #a08d93;
  --line: #3a2e33; --line-strong: #75696e;
  --on-primary: #24101f; --on-accent: #161412;
  --primary: #d79dc9; --primary-ink: #d79dc9; --primary-soft: #32202e;
  --accent: #eda06e; --accent-ink: #eda06e; --accent-soft: #3a2519;
  --warn: #ddb257; --warn-ink: #ddb257; --warn-soft: #362d18;
  --maybe: #7fb9a4; --maybe-ink: #7fb9a4; --maybe-soft: #1c322b;
  --meal: #92a8de; --meal-ink: #92a8de; --meal-soft: #23293e;
}