.#{$pui}button {
    padding: $button-padding;
    display: inline-block;
    border-width: 1px;
    border-style: solid;
    border-radius: $border-radius;
    cursor: pointer;
    transition-property: border-color, background-color, color;
    vertical-align: middle;

    &[disabled] {
        background-color: $color-border-gray;
        opacity: $disabled-opacity;
    }

    @include control;
    @include sizes;
    @include ui-colors($hover: true);
    @include transitions;

    &.is-link {
        background-color: transparent;
        border-color: transparent;
        color: $color-black;

        &:hover:not([disabled]) {
            background-color: $color-dark-gray-bg;
            border-color: transparent;
        }

        @each $name, $color in $color-schema {
            &.is-#{$name} {
                color: $color;

                &:hover:not([disabled]) {
                    background-color: rgba($color, $color-lt-hover-ammount);
                }
            }
        }
    }
}