/* ==========================================================================
   OneList design tokens, shared by the app (styles.css) and the site (landing-styles.css).
   Every colour comes from here so both themes resolve.

   The neutrals are warm (charcoal and paper rather than blue-grey) and the
   primary action is "ink": the text colour turned into a button. Blue is kept
   for links and focus rings only, so the five task colours are the colour.
   ========================================================================== */

:root,
:root[data-theme="dark"] {
    color-scheme: dark;

    --ground: #121110;
    --surface: #1A1917;
    --raised: #22201D;
    --sunk: #0C0B0A;
    --hover: #262421;
    --line: #2A2825;
    --line-strong: #3B3833;
    --text: #EFECE6;
    --muted: #B0ABA2;
    --faint: #8E8980;   /* text-safe: >= 4.5:1 on surface */
    --ghost: #6D6860;   /* icons at rest: >= 3:1 on surface */
    --ink: #F2EFE9;
    --on-ink: #15130F;
    --brand: #7E9EFF;
    --on-brand: #0D0F1A;
    --danger: #F06060;
    --star: #F2C14E;
    --overlay: rgba(8, 7, 6, 0.7);
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
    --shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 10px 30px rgba(0, 0, 0, 0.32);
    --shadow-lg: 0 2px 6px rgba(0, 0, 0, 0.35), 0 24px 60px rgba(0, 0, 0, 0.5);

    /* Task colours. Stored as hex in the database, drawn per theme. */
    --tag-rose: #F2557F;       --tag-rose-on: #16070C;
    --tag-tangerine: #F78A43;  --tag-tangerine-on: #170B03;
    --tag-blue: #6B93FF;       --tag-blue-on: #0A0F1F;
    --tag-violet: #A07BFF;     --tag-violet-on: #110A21;
    --tag-sun: #F2C14E;        --tag-sun-on: #1A1405;
}

:root[data-theme="light"] {
    color-scheme: light;

    --ground: #F5F3EE;
    --surface: #FFFFFF;
    --raised: #FFFFFF;
    --sunk: #ECE9E2;
    --hover: #F4F1EB;
    --line: #E6E2DA;
    --line-strong: #D3CEC4;
    --text: #1B1917;
    --muted: #5B5751;
    --faint: #75706A;
    --ghost: #9A958D;
    --ink: #1B1917;
    --on-ink: #F7F5F0;
    --brand: #2F63E8;
    --on-brand: #FFFFFF;
    --danger: #D23B3B;
    --star: #C99300;
    --overlay: rgba(40, 36, 30, 0.4);
    --shadow-sm: 0 1px 2px rgba(40, 36, 30, 0.06);
    --shadow: 0 1px 2px rgba(40, 36, 30, 0.06), 0 8px 24px rgba(40, 36, 30, 0.08);
    --shadow-lg: 0 2px 6px rgba(40, 36, 30, 0.08), 0 24px 60px rgba(40, 36, 30, 0.16);

    --tag-rose: #D8386A;       --tag-rose-on: #FFFFFF;
    --tag-tangerine: #D9651C;  --tag-tangerine-on: #1A0C02;
    --tag-blue: #2F63E8;       --tag-blue-on: #FFFFFF;
    --tag-violet: #7A4DE8;     --tag-violet-on: #FFFFFF;
    --tag-sun: #B8890A;        --tag-sun-on: #1A1405;
}

:root {
    --font-display: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
    --font-body: "Onest", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
    --radius-row: 12px;
    --radius-card: 16px;
    --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
    --task-color: var(--tag-blue);
    --task-on: var(--tag-blue-on);
}