button, a{
  &.btn-theme{
    background-color: $themeColor;
    color: $themeWhite;
    border: $border solid $themeColor;
    padding: $sizeSmall $sizeMedium;
    @include media-breakpoint-up(sm){
      padding: $sizeSmall/2 $sizeMedium;
    }
    &.disabled{
      background-color: $themeDarkGray !important;
      border-color: $themeDarkGray !important;
      pointer-events: auto !important;
      color: $themeWhite !important;
      &:hover{
        background-color: $themeDarkGray !important;
        border-color: $themeDarkGray !important;
      }
    }
    &.danger{
      background-color: $themeDanger;
      border-color: $themeDanger;
      &:hover{
        background-color: $themeWhite;
        color: $themeDanger;
        border-color: $themeDanger;
      }
      &.inverse{
        color: $themeDanger;
        background-color: $themeWhite;
        border-color: $themeDanger;
        &:hover{
          color: $themeWhite;
          background-color: $themeDanger;
        }
        &:focus{
          color: $themeDanger;
          background-color: $themeWhite;
        }
      }
    }
    &.secondary{
      background-color: $themeColor2;
      border-color: $themeColor2;
      &:hover{
        background-color: $themeColor;
        color: $themeWhite;
        border-color: $themeColor;
      }
    }
    &.inverse{
      color: $themeColor;
      background-color: $themeWhite;
      &:hover{
        color: $themeWhite;
        border-color: $themeWhite;
        background-color: $themeColor;
      }
      &:focus{
        color: $themeColor;
      }
    }
    border-radius: $borderRadius;
    width: auto;
    &.btn-full{
      width: 100%;
      padding-left: 0;
      padding-right: 0;
      display: block;
    }
    box-shadow: none;
    font-size: 1.2em;
    text-align: center;
    text-transform: uppercase;

    &:focus{
      outline: none;
      box-shadow: none;
      color: $themeWhite;
    }
    &:hover, &:active{
      color: $themeWhite;
      background-color: $themeColorDark;
      border-color: $themeColorDark;
    }
    &.large{
      padding-top: $sizeSmall;
      padding-bottom: $sizeSmall;
    }
    &.smaller{
      font-size: .8em;
      line-height: .8em;
      padding: $sizeSmall/2 $sizeMedium/2;
    }
    &.btn-payment{
      background-color: #28a745;
      border-color: #28a745;
      &:hover{
        background-color: #218239;
        border-color: #218239;
      }
    }
  }
}

.button-full{
  button{
    width: 100%;
  }
}

.button-group{
  @include flexbox;
  @include justify-content(flex-end);
  margin-top: $sizeSmall;
  .btn{
    margin-left: $sizeSmall;
  }
}

.button-group-vertical{
  .btn{
    &:first-child{
      margin-top: $sizeMedium;
    }
    margin-top: $sizeSmall;
  }
}

.button-right{
  float: right;
}

button {
  -webkit-appearance: none !important;
  &:focus {
    outline: none !important;
  }
  &:active {
    box-shadow: none !important;
  }
}

a, a:hover {
  text-decoration: none;
}