@mixin button-style(
  $background,
  $active-background,
  $hover-background,
  $color,
  $color-active,
  $border: transparent
) {
  background-color: $background;
  color: $color;
  border-color: $border;

  &:hover {
    background-color: $hover-background;
  }

  &:active:not(.disabled) {
    background-color: $active-background;
    color: $color-active;
  }

  &.button--loading:not(.button--link) {
    background-color: $active-background;
    color: transparent;

    &.disabled {
      background: $palette-neutral-100;
    }
  }
}

@mixin button-size($font-size, $height, $left-right-padding: 0) {
  font-size: $font-size;
  height: $height;
  padding: 0 $left-right-padding;
}