.button-style(@bg-color, @border-color: transparent, @color: #fff) {
    border-color: @border-color !important;
    background-color: @bg-color !important;
    color: @color !important;
}

.button-hover(@active-bg-color, @active-color: #fff) {
    background-color: darken(@active-bg-color, 10%) !important;
    color: @active-color !important;
}

.button-clear(@color) {
    background-color: transparent !important;
    color: darken(@color, 10%) !important;
}

.button-outline(@border-color, @bg-color: transparent) {
    border-color: @border-color !important;
    background-color: @bg-color !important;
    color: @border-color !important;
}

.button-reset(@color: inherit, @bg-color: transparent) {
    padding: 0;
    margin: 0;
    border-radius: 0;
    color: @color !important;
    background: @bg-color !important;
    font-size: inherit;
    line-height: inherit;
    text-align: inherit;
    text-decoration: inherit;
    overflow: inherit;

    &:after {
        position: static;
        top: auto;
        left: auto;
        width: auto;
        height: auto;
        border: none;
        border-radius: 0;
        transform: none;
        transform-origin: 0 0;
    }
}