// Applies a property to an mat-button element for each of the supported palettes.
@mixin _mat-button-theme-property($theme, $property, $hue) {
    $primary: map-get($theme, accent);
    $accent: map-get($theme, primary);
    $warn: map-get($theme, warn);
    $background: map-get($theme, background);
    $foreground: map-get($theme, foreground);
  
    &.mat-primary {
      #{$property}: mat-color($primary, $hue);
    }
    &.mat-accent {
      #{$property}: mat-color($accent, $hue);
    }
    &.mat-warn {
      #{$property}: mat-color($warn, $hue);
    }
  
    &.mat-primary, &.mat-accent, &.mat-warn, &[disabled] {
      &[disabled] {
        $palette: if($property == 'color', $foreground, $background);
        #{$property}: mat-color($palette, disabled-button);
        border: 1px solid  mat-color($palette, disabled-button);
      }
    }
  }

  @mixin mat-button-theme($theme) {
    $primary: map-get($theme, accent);
    $accent: map-get($theme, primary);
    $warn: map-get($theme, warn);
    $background: map-get($theme, background);
    $foreground: map-get($theme, foreground);
  
    .mat-button, .mat-icon-button, .mat-stroked-button {
      // Buttons without a background color should inherit the font color. This is necessary to
      // ensure that the button is readable on custom background colors. It's wrong to always assume
      // that those buttons are always placed inside of containers with the default background
      // color of the theme (e.g. themed toolbars).
      color: inherit;
      background: transparent;
  
      @include _mat-button-theme-property($theme, 'color', text);
      @include _mat-button-focus-overlay-color($theme);
  
      // Setup the ripple color to be based on the text color. This ensures that the ripples
      // are matching with the current theme palette and are in contrast to the background color
      // (e.g in themed toolbars).
      .mat-ripple-element {
        opacity: $_mat-button-ripple-opacity;
        background-color: currentColor;
      }
    }
  
    .mat-button-focus-overlay {
      background: map_get($foreground, base);
    }
  
    // Note: this needs a bit extra specificity, because we're not guaranteed the inclusion
    // order of the theme styles and the button reset may end up resetting this as well.
    .mat-stroked-button:not([disabled]) {
      border-color: mat-color($foreground, divider);
    }
  
    .mat-flat-button, .mat-raised-button, .mat-fab, .mat-mini-fab {
      // Default font and background color when not using any color palette.
      color: mat-color($foreground, text);
      background-color: mat-color($background, raised-button);
  
      @include _mat-button-theme-property($theme, 'color', default-contrast);
      @include _mat-button-theme-property($theme, 'background-color', default);
      @include _mat-button-ripple-color($theme, default-contrast);
    }
  
    .mat-stroked-button, .mat-flat-button {
      @include _mat-theme-overridable-elevation(0, $theme);
    }
  
    .mat-raised-button {
      @include _mat-theme-overridable-elevation(2, $theme);
  
      &:not([disabled]):active {
        @include _mat-theme-overridable-elevation(8, $theme);
      }
  
      &[disabled] {
        @include _mat-theme-overridable-elevation(0, $theme);
      }
    }
  
    .mat-fab, .mat-mini-fab {
      @include _mat-theme-overridable-elevation(6, $theme);
  
      &:not([disabled]):active {
        @include _mat-theme-overridable-elevation(12, $theme);
      }
  
      &[disabled] {
        @include _mat-theme-overridable-elevation(0, $theme);
      }
    }
  }