/* CSS Custom Properties from SCSS Tokens */
/* Converts SCSS variables to CSS custom properties for runtime usage */

@use 'tokens' as *;

:root {
  /* Colors */
  --color-primary-50: #{$color-primary-50};
  --color-primary-100: #{$color-primary-100};
  --color-primary-200: #{$color-primary-200};
  --color-primary-300: #{$color-primary-300};
  --color-primary-400: #{$color-primary-400};
  --color-primary-500: #{$color-primary-500};
  --color-primary-600: #{$color-primary-600};
  --color-primary-700: #{$color-primary-700};
  --color-primary-800: #{$color-primary-800};
  --color-primary-900: #{$color-primary-900};
  --color-primary-950: #{$color-primary-950};

  --color-neutral-50: #{$color-neutral-50};
  --color-neutral-100: #{$color-neutral-100};
  --color-neutral-200: #{$color-neutral-200};
  --color-neutral-300: #{$color-neutral-300};
  --color-neutral-400: #{$color-neutral-400};
  --color-neutral-500: #{$color-neutral-500};
  --color-neutral-600: #{$color-neutral-600};
  --color-neutral-700: #{$color-neutral-700};
  --color-neutral-800: #{$color-neutral-800};
  --color-neutral-900: #{$color-neutral-900};
  --color-neutral-950: #{$color-neutral-950};

  --color-success-500: #{$color-success-500};
  --color-warning-500: #{$color-warning-500};
  --color-error-500: #{$color-error-500};

  // Spacing
  --spacing-0: #{$spacing-0};
  --spacing-1: #{$spacing-1};
  --spacing-2: #{$spacing-2};
  --spacing-3: #{$spacing-3};
  --spacing-4: #{$spacing-4};
  --spacing-5: #{$spacing-5};
  --spacing-6: #{$spacing-6};
  --spacing-8: #{$spacing-8};
  --spacing-10: #{$spacing-10};
  --spacing-12: #{$spacing-12};
  --spacing-16: #{$spacing-16};
  --spacing-20: #{$spacing-20};
  --spacing-24: #{$spacing-24};

  // Border Radius
  --radius-none: #{$radius-none};
  --radius-sm: #{$radius-sm};
  --radius-default: #{$radius-default};
  --radius-md: #{$radius-md};
  --radius-lg: #{$radius-lg};
  --radius-xl: #{$radius-xl};
  --radius-2xl: #{$radius-2xl};
  --radius-3xl: #{$radius-3xl};
  --radius-full: #{$radius-full};

  // Typography
  --font-family-sans: #{$font-family-sans};
  --font-family-mono: #{$font-family-mono};
}