@use '@angular/material' as mat;

$light-dull-foreground: (
  base:              black,
  disabled-button:   rgba(black, 0.26),
  icon:              rgba(black, 1),
  icons:             rgba(black, 1),
  text:              rgba(black, 1),
  slider-min:        rgba(black, 1),
  slider-off:        rgba(black, 0.5),
  slider-off-active: rgba(black, 0.6),
);

$light-dull-background: (
  status-bar: map_get(mat.$grey-palette, 300),
  app-bar:    map_get(mat.$grey-palette, 100),
  background:map_get(mat.$gray-palette, 100),
  hover:      rgba(black, 0.04),
  card:       map_get(mat.$gray-palette, 100),
  dialog:     map_get(mat.$gray-palette, 100),
  disabled-button: rgba(black, 0.12),
  raised-button: map_get(mat.$grey-palette, 50),
  selected-button: map_get(mat.$grey-palette, 300),
  selected-disabled-button: map_get(mat.$grey-palette, 400),
  disabled-button-toggle: map_get(mat.$grey-palette, 200),
  unselected-chip: map_get(mat.$grey-palette, 300),
  disabled-list-option: map_get(mat.$grey-palette, 200),
);

@function create-light-dull-theme($primary, $accent, $warn: mat.define-palette(mat.$red-palette)) {
  @return (
    primary: $primary,
    accent: $accent,
    warn: $warn,
    is-dark: false,
    foreground: $light-dull-foreground,
    background: $light-dull-background
  );
}

