//
// Buttons
// --------------------------------------------------

// Bootstrap overwrite
// See all available Bootstrap CSS variables: @humhub/protected/vendor/twbs/bootstrap/dist/css/bootstrap.css

@if not $prev-button {
    .btn {
        --bs-btn-padding-x: 1.1rem;
        --bs-btn-padding-y: 0.5rem;
        --bs-btn-font-weight: 600;
        --bs-btn-border-radius: 3px;

        white-space: nowrap;
        transition: color 0.3s, background-color 0.3s, border-color 0.3s;

        &:not(.btn-icon-only) {
            i.fa {
                margin-right: 0.6rem;
            }
        }

        &.input {
            outline: none;
        }
    }

    .btn-sm, .btn-group-sm > .btn {
        --bs-btn-padding-x: 0.5rem;
        --bs-btn-padding-y: 0.2rem;

        &:not(.btn-icon-only) {
            i.fa {
                margin-right: 0.4rem;
            }
        }
    }

    .btn-lg, .btn-group-lg > .btn {
        --bs-btn-padding-x: 1.75rem;
        --bs-btn-padding-y: 0.9rem;
        --bs-btn-font-size: 1.1rem;

        &:not(.btn-icon-only) {
            i.fa {
                margin-right: 0.8rem;
            }
        }
    }

    .btn-group > .btn {
        --bs-btn-padding-x: 0.8rem;

        &.btn-icon-only {
            --bs-btn-padding-x: 0.4rem;
        }
    }

    .btn-group-sm > .btn {
        --bs-btn-padding-x: 0.4rem;

        &.btn-icon-only {
            --bs-btn-padding-x: 0.3rem;
        }
    }

    .btn-group-lg > .btn {
        --bs-btn-padding-x: 1.2rem;

        &.btn-icon-only {
            --bs-btn-padding-x: 0.8rem;
        }
    }

    // Outline buttons: use black color for texts if insufficient contrast relatively to background color main, as the background color is transparent
    @each $color, $value in $theme-colors {
        .btn-outline-#{$color} {
            @if contrast-ratio($background-color-main, $value) < $min-contrast-ratio {
                color: var(--text-color-highlight);
            }
        }
    }
}