@use '@angular/material' as mat;
@use './../../lib/components/alert/alert-theme';
@use './../../lib/components/badge/badge-theme';
@use './../../lib/components/drawer/drawer-theme';
@use './../../lib/components/grid/grid-theme';
@use './../../lib/components/popover/popover-theme';
@use './../../lib/components/kpi-card/kpi-card-theme';

// Create a theme.
@mixin all-component-themes($theme) {
  @include alert-theme.theme($theme);
  @include badge-theme.theme($theme);
  @include drawer-theme.theme($theme);
  @include grid-theme.theme($theme);
  @include popover-theme.theme($theme);
  @include kpi-card-theme.theme($theme);
}

@mixin all-component-bases($theme) {
  @include alert-theme.base($theme);
  @include badge-theme.base($theme);
  @include drawer-theme.base($theme);
  @include grid-theme.base($theme);
  @include popover-theme.base($theme);
  @include kpi-card-theme.base($theme);
}

// Custom component overrides for all themes
@mixin custom-component-overrides {
  @include mat.checkbox-overrides(
    (
      selected-icon-color: var(--acp-theme-primary-color),
      selected-checkmark-color: white,
      selected-focus-icon-color: var(--acp-theme-primary-color),
      selected-hover-icon-color: var(--acp-theme-primary-color),
      selected-focus-state-layer-color: var(--acp-theme-primary-color),
      selected-hover-state-layer-color: var(--acp-theme-primary-color),
    )
  );

  @include mat.fab-overrides(
    (
      container-color: var(--acp-theme-primary-color),
      foreground-color: white,
    )
  );

  @include mat.radio-overrides(
    (
      selected-icon-color: var(--acp-theme-primary-color),
      selected-focus-icon-color: var(--acp-theme-primary-color),
      selected-hover-icon-color: var(--acp-theme-primary-color),
      selected-pressed-icon-color: var(--acp-theme-primary-color),
      checked-ripple-color: var(--acp-theme-primary-color),
    )
  );
}
