@use 'node_modules/@angular/material' as material;
@use '../../theme';
@use 'sass:map';
@use './wdk-palette';
@use './wdk-typography';

// Set Material Color Overrides
$wdk-teal: material.define-palette(wdk-palette.$teal-palette);
$wdk-red: material.define-palette(wdk-palette.$red-palette);
$wdk-black: material.define-palette(wdk-palette.$black-palette);

$wdk-theme: material.define-light-theme(
    (
      color: (
        primary: $wdk-teal,
        accent: $wdk-red,
        warn: $wdk-red,
      ),
      typography: wdk-typography.$wdk-typography,
      density: -1
    )
);

$wdk-red-black-theme: material.define-light-theme(
    (
      color: (
        primary: $wdk-red,
        accent: $wdk-black,
        warn: $wdk-red,
      ),
      typography: wdk-typography.$wdk-typography,
    )
);

$wdk-black-red-theme: material.define-light-theme(
    (
      color: (
        primary: $wdk-black,
        accent: $wdk-red,
        warn: $wdk-red,
      ),
      typography: wdk-typography.$wdk-typography,
    )
);

$wdk-red-black-teal-theme: material.define-light-theme(
    (
      color: (
        primary: $wdk-red,
        accent: $wdk-black,
        warn: $wdk-teal
      ),
      typography: wdk-typography.$wdk-typography,
    )
);