/*
 * Color system.
 * Define your app's color palette here.
 * Reference: https://oklch.com/
 */
:root {
  /* LCH color primitives - raw OKLCH values without oklch() wrapper */
  /*
  --lch-red-darkest: 26% 0.105 34;
  --lch-red-dark: 59% 0.19 38;
  --lch-red: 66% 0.204 40;
  --lch-red-light: 84% 0.0837 42;
  --lch-red-lightest: 96% 0.013 46;

  --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;
  */

  /* 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(...);
  --color-text-secondary: oklch(...);
  --color-background: oklch(...);
  --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));
  */
}
