/*!
 * SPDX-FileCopyrightText: 2017-2024 Enedis
 *
 * SPDX-License-Identifier: Apache-2.0
 *
 */

@mixin baseButton($text-color, $background-color, $border-color) {
    font-family: 'Montserrat';
    font-weight: bold;
    cursor: pointer;
    border: solid 2px $border-color !important;
    padding: 9px 20px 9px 20px;
    color: $text-color;
    text-transform: uppercase;
    border: 0;
    background-color: $background-color;

    span {
        margin-right: 8px;
    }
}

@mixin hoverButton($text-color, $border-color, $background-color) {
    &:hover {
        background-color: $background-color;
        border-color: $border-color !important;
        color: $text-color;
    }
}

@mixin disabledButton($text-color, $border-color, $background-color) {
    &:disabled {
        background-color: $background-color;
        border-color: $border-color !important;
        color: $text-color;
        cursor: not-allowed;
    }
}

.first {
    @include baseButton(var(--bs-light), var(--bs-success), var(--bs-success));
    @include hoverButton(var(--bs-light), var(--bs-primary), var(--bs-primary));
    @include disabledButton(var(--bs-white), var(--bs-dark), var(--bs-dark));
}

.second {
    @include baseButton(var(--bs-info), var(--bs-white), var(--bs-primary));
    @include hoverButton(var(--bs-primary), var(--bs-primary), var(--bs-white));
}
