// main: global.scss
@mixin active {
    &:active,
    &.active {
        @content;
    }
}

@mixin hover-focus {
    &:focus,
    &.focus,
    &:hover {
        @content;
    }
}

@mixin disabled {
    &.disabled,
    &[disabled],
    fieldset[disabled] & {
        @content;
    }
}

@mixin dropdown-open {
    .open > &.dropdown-toggle { @content }
}

@mixin btn-special {
    /**
     * This mixin applies content if the button is in at least one of the
     * following states:
     *
     * - hovered,
     * - focused,
     * - actived,
     * - is responsible of an opened dropdown.
     *
     * Where possible, state is checked from class attribute and
     * :pseudo-classes.
     *
     * ## Bootstrap compatibility
     *
     * If content defines 'color', 'background-color' and 'border', it is safe
     * to use this mixin with Bootstrap buttons as it will overrides all
     * Bootstrap color defaults of the previous cases.
     * To be precise, this covers all special important-like cases of the
     * Bootstrap mixin 'button-variant' (except the 'disabled' case).
     *
     */
    @include hover-focus { @content }

    @include active {
        @content;
        @include hover-focus { @content }
    }

    @include dropdown-open {
        @content;
        @include hover-focus { @content }
    }
}

@mixin button-variant-2modes($color, $background-base, $background-special, $border) {
    /**
     * This mixins allows defining color-related properties of buttons.
     *
     * It sets the following properties:
     *   color: $color, except for disabled-like buttons.
     *   border-color: $border.
     *   background-color: Depending on button state:
     *     - Default, disabled:
     *         $background-base
     *     - Hovered, focused, actived, responsible of an opened dropdown:
     *         (one is sufficent)
     *         $background-special
     *
     * ## Bootstrap compatibility
     *
     * This mixin can be used to replace colors behaviors of Bootstrap buttons.
     * Indeed, this mixin aims to replace each definition done by the
     * 'button-variant' Bootstrap mixin.
     *
     */
    color: $color;
    background-color: $background-base;
    border-color: $border;

    @include btn-special {
        color: $color;
        background-color: $background-special;
        border-color: $border;
    }

    @include disabled {
        @include hover-focus {
            background-color: $background-base;
            border-color: $border;
        }
    }

    .badge {
        color: $background-base;
        background-color: $color;
    }
}

.btn-primary {
    @include button-variant-2modes($btn-font-color, $btn-bg-base, $btn-bg-special, $btn-border);
}

form#filter_form {
    .form-group {
        padding-right:20px;
    }

    ul.form-control {
        background-color: transparent;
        border: none;
        box-shadow: none;
    }
}