/**
 * Colour tokens — single source of truth.
 * Design concept "Kreidewerkstatt": dark chalkboard (Tafel) as the lead motif,
 * warm workshop cream below it, red as the brand colour, ochre as chalk accent.
 *
 * Tier 1: raw values (--color-<name>). Only this file uses them.
 * Tier 2: semantic aliases. Components consume these, never raw values.
 */
:root {
    /* ---- Tier 1: raw ---- */
    --color-red: #d0121f;
    --color-red-light: #e2061d;
    --color-red-dark: #9d0d17;
    --color-chalkboard: #1f2320;
    --color-chalk: #f5f2e9;
    --color-cream: #fbf7ef;
    --color-cream-deep: #f3ede1;
    --color-ochre: #c98f2e;
    --color-ochre-dark: #8a6a1e;   /* ochre as TEXT on light ground: 4.7:1 on cream. The design's #a8761d fails AA (3.7:1). */
    --color-ochre-light: #e8b355;  /* ochre as TEXT on the chalkboard */
    --color-sand: #e3dbcb;
    --color-sand-light: #ece5d8;
    --color-ink: #20201d;
    --color-stone: #67635a;
    --color-stone-light: #b7b3a7;
    --color-white: #ffffff;
    --color-green: #2b7444;        /* status colour: 4.9:1 on cream-deep, 5.3:1 on cream */

    /* ---- Tier 2: semantic ---- */
    --color-primary: var(--color-red);
    --color-primary-hover: var(--color-red-light);
    --color-primary-active: var(--color-red-dark);
    --color-primary-contrast: var(--color-white);

    --color-accent: var(--color-ochre);             /* surfaces, chalk strokes, dots — not body text */
    --color-accent-text: var(--color-ochre-dark);
    --color-accent-on-dark: var(--color-ochre-light);

    --color-text: var(--color-ink);
    --color-text-muted: var(--color-stone);
    --color-text-inverse: var(--color-chalk);
    --color-text-inverse-muted: var(--color-stone-light);

    --color-link: var(--color-primary);
    --color-link-hover: var(--color-primary-active);

    --color-background: var(--color-cream);
    --color-background-alt: var(--color-cream-deep);
    --color-surface: var(--color-white);
    --color-dark: var(--color-chalkboard);

    --color-border: var(--color-sand);
    --color-border-soft: var(--color-sand-light);
    --color-border-on-dark: rgba(245, 242, 233, .18);

    --color-success: var(--color-green);

    --color-focus: var(--color-primary);
    --color-focus-on-dark: var(--color-chalk);
}