@use '@angular/material' as mat;
@use '@ng-matero/extensions' as mtx;
@use '../../gui' as gui;

@include mat.elevation-classes();
@include mat.app-background();

$my-primary: mat.m2-define-palette(mat.$m2-indigo-palette, 500);
$my-accent: mat.m2-define-palette(mat.$m2-pink-palette, A200, A100, A400);
$my-theme: mat.m2-define-light-theme(
  (
    color: (
      primary: $my-primary,
      accent: $my-accent,
    ),
    typography: mat.m2-define-typography-config(),
    density: 0,
  )
);

@include mat.all-component-themes($my-theme);
@include mtx.all-component-themes($my-theme);
// @include gui.all-control-themes($my-theme);

.dark-theme {
  color-scheme: dark;

  $dark-primary: mat.m2-define-palette(mat.$m2-blue-grey-palette);
  $dark-accent: mat.m2-define-palette(mat.$m2-amber-palette, A200, A100, A400);
  $dark-theme: mat.m2-define-dark-theme(
    (
      color: (
        primary: $dark-primary,
        accent: $dark-accent,
      ),
      typography: mat.m2-define-typography-config(),
      density: 0,
    )
  );

  @include mat.all-component-colors($dark-theme);
  @include mtx.all-component-colors($dark-theme);
  // @include gui.all-control-colors($dark-theme);
}
