@mixin buttonVariation($background-color, $text-color, $border-color) {
  &.ui-state-default {
    background-color: $background-color;
    border-color: $border-color;
  }

  & .ui-button-text {
    color: $text-color;
  }

  &:hover {
    background-color: darken($background-color, 15%);
  }

  &:focus {
    background-color: darken($background-color, 15%);
    border-color: #22dce6;
  }

  &:active:not(:disabled) {
    background-color: darken($background-color, 20%);
    border-color: darken($background-color, 20%);
  }
}