@use '@angular/material' as mat;
@use '../orange/orange' as *;
@use '../neutral/neutral' as *;
@use '../red/red' as *;

$neutral: (
  50: $neutral-100,
  100: $neutral-100,
  200: $neutral-200,
  300: $neutral-300,
  400: $neutral-400,
  500: $neutral-400,
  600: $neutral-400,
  700: $neutral-400,
  800: $neutral-400,
  900: $neutral-400,
  contrast: (),
);

$primary: (
  50: $orange-50,
  100: $orange-100,
  200: $orange-200,
  300: $orange-300,
  400: $orange-400,
  500: $orange-500,
  600: $orange-600,
  700: $orange-700,
  800: $orange-800,
  900: $orange-900,
  contrast: (),
);

$red: (
  50: $red-50,
  100: $red-100,
  200: $red-200,
  300: $red-300,
  400: $red-400,
  500: $red-500,
  600: $red-600,
  700: $red-700,
  800: $red-800,
  900: $red-900,
  contrast: (),
);

$primary-palette: mat.m2-define-palette($primary);
$neutral-palette: mat.m2-define-palette($neutral);
$red-palette: mat.m2-define-palette($red);

$theme-light: mat.m2-define-light-theme(
  (
    color: (
      primary: $primary-palette,
      accent: $neutral-palette,
      warn: $red-palette,
    ),
  )
);

$theme-dark: mat.m2-define-dark-theme(
  (
    color: (
      primary: $primary-palette,
      accent: $neutral-palette,
      warn: $red-palette,
    ),
  )
);

@mixin apply-component-colors-light {
  @include mat.all-component-colors($theme-light);
}

@mixin apply-component-colors-dark {
  @include mat.all-component-colors($theme-dark);
}