/*
 * Color system.
 * Define your app's color palette here.
 * Reference: https://oklch.com/
 */
:root {
    /* LCH color primitives - raw OKLCH values without oklch() wrapper */

    --lch-blue-darkest: 26% 0.126 264;
    --lch-blue-dark: 57% 0.1895 260;
    --lch-blue: 66% 0.196 258;
    --lch-blue-light: 84% 0.0719 255;
    --lch-blue-lightest: 96% 0.016 252;

    --lch-dark: 0% 0 0;
    --lch-background: 96.67% 0.0222 221.82;

    /* Named colors - semantic colors built from LCH primitives */

    --color-success: oklch(var(--lch-green-dark));
    --color-warning: oklch(var(--lch-yellow-dark));
    --color-error: oklch(var(--lch-red-dark));
    --color-info: oklch(var(--lch-blue-dark));

    /* Abstractions - semantic purpose-based colors */

    --color-text: oklch(var(--lch-dark));
    --color-text-secondary: oklch(...);
    --color-background: oklch(var(--lch-background));
    --color-border: oklch(...);
    --color-link: oklch(var(--lch-blue-dark));

    /* Component-specific colors */

    --color-button-bg: oklch(var(--lch-blue-dark));
    --color-input-border: oklch(var(--lch-gray-light));
}