@mixin button-variant($font-color, $bg-color) {
  color: $font-color;
  background-color: $bg-color;

  &:hover,
  &:focus,
  &:active {
    color: $font-color;
    background-color: lighten($bg-color, 5%);
  }

  &[disabled] {
    &:hover,
    &:focus,
    &:active {
      color: $font-color;
      background-color: $bg-color;
    }
  }
}

@mixin button-flat-variant($font-color, $bg-color-hover) {
  &.mui-btn--flat {
    color: $font-color;
    background-color: transparent;

    &:hover,
    &:focus,
    &:active {
      color: $font-color;
      background-color: $bg-color-hover;
    }

    &[disabled] {
      &:hover,
      &:focus,
      &:active {
        color: $font-color;
        background-color: transparent;
      }
    }
  }
}