/* Declares the cascade order for every stylesheet of the application. */
@layer tokens, base, layouts, components;

@layer tokens {
  :root {
    color-scheme: dark;

    --hm-color-bg: #12151a;
    --hm-color-surface: #1b2027;
    --hm-color-surface-hover: #232a33;
    --hm-color-border: #313a45;
    --hm-color-text: #e6eaf0;
    --hm-color-text-muted: #a0abb8;

    --hm-color-primary: #7cb7ff;
    --hm-color-on-primary: #0d1b2c;

    --hm-color-success: #6fd08c;
    --hm-color-success-bg: #1c3a28;
    --hm-color-warning: #f2c063;
    --hm-color-warning-bg: #40321a;
    --hm-color-danger: #ff9a93;
    --hm-color-danger-bg: #472523;
    --hm-color-neutral: #b6c0cc;
    --hm-color-neutral-bg: #2b333d;

    --hm-font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --hm-font-size-sm: 0.875rem;
    --hm-font-size-md: 1rem;
    --hm-font-size-lg: 1.5rem;

    --hm-space-xs: 0.25rem;
    --hm-space-sm: 0.5rem;
    --hm-space-md: 1rem;
    --hm-space-lg: 1.5rem;

    --hm-radius-md: 0.5rem;
    --hm-radius-pill: 999px;
  }
}