@use '@angular/material' as mat;
@use 'sass:map' as map;
@use 'theme' as theme;
@use 'color-palettes' as colors;
@use 'variables' as variables;
@use '../functions' as *;
@use '../contrast-fix' as contrast-fix;
@use '../configs/root-variables' as root;

// Material Typography
$custom-typography: mat.m2-define-typography-config(
  $font-family: var(--font-family),
  $subtitle-1: mat.m2-define-typography-level(1rem, 1.75rem, bold),
  $headline-5: mat.m2-define-typography-level(1.5rem, 2rem, bold),
  $headline-6: mat.m2-define-typography-level(1.25rem, 2rem, bold),
  $body-1: mat.m2-define-typography-level(0.9375rem, 1.5rem, normal),
  $body-2: mat.m2-define-typography-level(0.875rem, 1.25rem, normal),
  $button: mat.m2-define-typography-level(default, default, normal),
);

@mixin generate-color-variables($custom-palette) {
  @each $color, $palette in $custom-palette {
    --#{$color}: #{mat.m2-get-color-from-palette($palette, 500)};
    @each $w in variables.$color-weights {
      --#{$color}-#{$w}: #{mat.m2-get-color-from-palette($palette, $w)};
    }
  }
}

@mixin theme-core($typography: $custom-typography) {
  @include mat.core;

  @content;
}

@mixin theme-colors(
  $primary: mat.m2-define-palette(theme.$app-primary),
  $accent: mat.m2-define-palette(theme.$app-accent),
  $warn: mat.m2-define-palette(theme.$app-danger),
  $primary-dark: mat.m2-define-palette(theme.$app-primary-dark),
  $accent-dark: mat.m2-define-palette(theme.$app-accent-dark),
  $warn-dark: mat.m2-define-palette(theme.$app-danger-dark),
  $typography: $custom-typography
) {
  $light-theme: mat.m2-define-light-theme(
    (
      color: (
        primary: $primary,
        accent: $accent,
        warn: $warn,
      ),
    )
  );

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

  $dark-theme: map.deep-merge(
    $dark-theme,
    (
      color: (
        foreground: colors.$dark-foreground,
        background: colors.$dark-background,
      ),
    )
  );

  @include generate-color-variables(theme.$colors);

  @include mat.all-component-typographies($typography);
  @include mat.typography-hierarchy($typography);

  @include mat.all-component-themes($light-theme);

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

@mixin theme-colors-variables(
  $primary: mat.m2-define-palette(theme.$app-primary),
  $accent: mat.m2-define-palette(theme.$app-accent),
  $warn: mat.m2-define-palette(theme.$app-danger),
  $primary-dark: mat.m2-define-palette(theme.$app-primary-dark),
  $accent-dark: mat.m2-define-palette(theme.$app-accent-dark),
  $warn-dark: mat.m2-define-palette(theme.$app-danger-dark)
) {
  @include root.produce-vars;

  @at-root html &,
    & [dark='false'] {
    @include generate-color-variables(
      (
        'primary': $primary,
        'accent': $accent,
        'warn': $warn,
      )
    );
  }
  @at-root html[dark='true'] &,
    & [dark='true'] {
    @include generate-color-variables(
      (
        'primary': $primary-dark,
        'accent': $accent-dark,
        'warn': $warn-dark,
      )
    );
  }
}