@mixin hover {
    &:hover { @content }
}

@mixin hover-focus {
    @if $enable-hover-media-query {
        &:focus { @content }
        @include hover { @content }
    } @else {
        &:focus,
        &:hover {
            @content
        }
    }
}

@mixin clearfix() {
    &::after {
        display: block;
        content: "";
        clear: both;
    }
}

@mixin ellipsis($text-overflow: ellipsis) {
    & {
        overflow: hidden;
        text-overflow: $text-overflow;
        white-space: nowrap;
    }
}

@mixin transition($time: .15s) {
    transition: background $time, color $time, border-color $time;
}

@mixin link {
    @include transition;

    color: $link-color;
    font-size: inherit;
    text-decoration: $link-decoration;

    @include hover-focus {
        //color: $link-hover-color;
        text-decoration: $link-hover-decoration;
    }
}

@mixin btn {
    @include transition;

    display: block;
    width: 100%;
    min-height: 30px;
    line-height: initial;

    border: 0;
    border-radius: 3px;
    padding: 7px 15px;

    font-size: 18px;

    text-align: center;

    @include hover-focus {
        text-decoration: none;
        cursor: pointer;
    }
}

@mixin btn-primary {
    background: $brand-primary;
    color: $white;

    @include hover-focus {
        background: darken($brand-primary, 5%);
        color: $white;
    }
}

@mixin btn-success {
    background: $brand-success;
    color: $white;

    @include hover-focus {
        background: darken($brand-success, 15%);
        color: $white;
    }
}

@mixin btn-danger {
    background: $brand-danger;
    color: $white;

    @include hover-focus {
        background: darken($brand-danger, 15%);
        color: $white;
    }
}

@mixin btn-sm {
    min-height: auto;
    padding: 4px 7px;
    font-size: 12px;
}