@import '~bootstrap/scss/mixins/buttons';

//
// Base styles
//

@mixin button-variant($background,
    $border,
    $color: color-contrast($background),
    $hover-background: if($color, shade-color($primary, $btn-hover-bg-shade-amount), tint-color($background, $btn-hover-bg-tint-amount)),
    $hover-border: color-contrast($hover-background),
    $hover-color: color-contrast($hover-background),
    $active-background: if($color==$color-contrast-light, shade-color($background, $btn-active-bg-shade-amount), tint-color($background, $btn-active-bg-tint-amount)),
    $active-border: if($color==$color-contrast-light, shade-color($border, $btn-active-border-shade-amount), tint-color($border, $btn-active-border-tint-amount)),
    $active-color: color-contrast($active-background),
    $disabled-background: $background,
    $disabled-border: $border,
    $disabled-color: color-contrast($disabled-background)) {
    color: $color;
    @include gradient-bg($background);
    border-color: $border;
    border-radius: 10px;
    @include box-shadow($btn-box-shadow);

    &:hover {
        color: $hover-color;
        @include gradient-bg($primary);
        border-color: $hover-border;
        text-decoration: none;
    }

    .btn-check:focus+&,
    &:focus {
        color: $hover-color;
        @include gradient-bg($primary );
        border-color: $hover-border;


        @if $enable-shadows {
            @include box-shadow($btn-box-shadow, 0 0 0 $btn-focus-width rgba(mix($color, $border, 15%), .5));
        }

        @else {
            // Avoid using mixin so we can pass custom focus shadow properly
            box-shadow: 0 0 0 $btn-focus-width rgba(mix($color, $border, 15%), .5);
        }
    }

    .btn-check:checked+&,
    .btn-check:active+&,
    &:active,
    &.active,
    .show>&.dropdown-toggle {
        color: $active-color;
        background-color: $active-background;
        // Remove CSS gradients if they're enabled
        background-image: if($enable-gradients, none, null);
        border-color: $active-border;

        &:focus {
            @if $enable-shadows {
                @include box-shadow($btn-active-box-shadow, 0 0 0 $btn-focus-width rgba(mix($color, $border, 15%), .5));
            }

            @else {
                // Avoid using mixin so we can pass custom focus shadow properly
                box-shadow: 0 0 0 $btn-focus-width rgba(mix($color, $border, 15%), .5);
            }
        }
    }

    &:disabled,
    &.disabled {
        color: $disabled-color;
        background-color: $disabled-background;
        // Remove CSS gradients if they're enabled
        background-image: if($enable-gradients, none, null);
        border-color: $disabled-border;
    }
}

// scss-docs-end btn-variant-mixin

// scss-docs-start btn-outline-variant-mixin
@mixin button-outline-variant($color,
    $color-hover: color-contrast($color),
    $active-background: $color,
    $active-border: $color,
    $active-color: color-contrast($active-background)) {
    color: $color;
    border-color: $color;
    border-radius: 10px;

    &:hover {
        color: $color-hover;
        background-color: $active-background;
        border-color: $active-border;
    }

    .btn-check:focus+&,
    &:focus {
        box-shadow: 0 0 0 $btn-focus-width rgba($color, .5);
    }

    .btn-check:checked+&,
    .btn-check:active+&,
    &:active,
    &.active,
    &.dropdown-toggle.show {
        color: $active-color;
        background-color: $active-background;
        border-color: $active-border;

        &:focus {
            @if $enable-shadows {
                @include box-shadow($btn-active-box-shadow, 0 0 0 $btn-focus-width rgba($color, .5));
            }

            @else {
                // Avoid using mixin so we can pass custom focus shadow properly
                box-shadow: 0 0 0 $btn-focus-width rgba($color, .5);
            }
        }
    }

    &:disabled,
    &.disabled {
        color: $color;
        background-color: transparent;
    }
}

// scss-docs-end btn-outline-variant-mixin

// scss-docs-start btn-size-mixin
@mixin button-size($padding-y, $padding-x, $font-size, $border-radius) {
    padding: $padding-y $padding-x;
    @include font-size($font-size);
    // Manually declare to provide an override to the browser default
    @include border-radius($border-radius, 0);
}

// scss-docs-end btn-size-mixin
