.btn-primary {
    color: #fff;
    background-color: $primary;
    border-color: $primary;
    border-radius: 3px !important;
    font-size: 14px;
    &.search-icon {
        border-top-left-radius: 0 !important;
        border-bottom-left-radius: 0 !important;
    }
}

.btn-primary:hover {
    color: #fff;
    background-color: $primary;
    filter: brightness(90%);
    border-color: $primary;
}

.btn-primary:focus, .btn-primary.focus {
    color: #fff;
    background-color: $primary;
    filter: brightness(90%);
    border-color: $primary;
}

.btn-primary.disabled, .btn-primary:disabled {
    color: $graytext !important;
    background-color: #ced4da;
    border-color: #ced4da;
    pointer-events: none !important;
    cursor: default !important;
}

.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
    color: #fff;
    background-color: $primary;
    border-color: $primary;
}

.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgba(51, 130, 201, 0.5);
}

.btn-secondary {
    color: #fff !important;
    background-color: $secondary;
    border-color: $secondary;
    border-radius: 3px !important;
    font-size: 14px;
}
.btn-link:not(.p-0) {
    padding: .5rem !important;
}
.btn-link:not(.block-add, .add-sections, .activity-add), .page-link:hover {
    color: $primary !important;
}
.btn.add-section {
    color: #FFFFFF;
}
.btn-secondary:hover {
    color: #fff !important;
    background-color: $secondary;
    filter: brightness(90%);
    border-color: $secondary;
}

.btn-secondary:focus, .btn-secondary.focus {
    color: #fff !important;
    background-color: $secondary;
    filter: brightness(90%);
    border-color: $secondary;
}

.btn-secondary.disabled, .btn-secondary:disabled {
    color: $graytext !important;
    background-color: #ced4da;
    border-color: #ced4da;
    pointer-events: none !important;
    cursor: default !important;
}

.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle {
    color: #fff;
    background-color: $secondary;
    border-color: $secondary;
}

.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus,
.show > .btn-secondary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgba(179, 185, 191, 0.5);
}

.btn.btn-outline-secondary {
    border-color: transparent;
    border-radius: 4px;
    color: $secondary;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.06);
    font-size: 14px;
    &:active,
    &:hover {
        background-color: $grayhover !important;
        color: $secondary !important;
        border-color: transparent !important;
    }
    &:focus {
        border-color: $secondary;
        background-color: white;
        color: $secondary;
    }
}

.btn.btn-outline-secondary.dropdown-toggle{
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.06) !important;
}

.btn.btn-primary.dropdown-toggle{
    color: #fff !important;
}
.btn.btn-primary.dropdown-toggle {
    &:hover,
    &:focus {
        color: $primary !important;
        background: #f5f5f8 !important;
    }
}

.btn.btn-primary.dropdown-toggle:focus{
    border-color: $primary !important;
}

.btn.btn-secondary.dropdown-toggle {
    &:hover,
    &:focus {
        color: $secondary !important;
        background: #f5f5f8 !important;
    }
}

.btn.dropdown-toggle{
    &:hover,
    &:focus{
        background-color: transparent !important;
        border-color: transparent !important;
    }
    box-shadow: none !important;
}
.btn-danger {
    color: #fff !important;
    background-color: $alert-danger;
    border-color: $alert-danger;
    border-radius: 3px !important;
    font-size: 14px;
}

body.theme-fresk.path-course {
    .btn.dropdown-toggle.btn-subtle-success {
        color: #1b3d19 !important;
        display: flex;
        align-items: center;
        gap: 2px;
        &:hover,
        &:focus {
            color: $secondary !important;
            background: #f5f5f8 !important;
        }
    }
}
button.block-button.btn {
    color: $primary;
    background-color: transparent;
    font-weight: 600;
    font-size: 12px;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
    &:hover{
        background-color: rgba($primary, 0.08);
    }
    &:active {
        color: color-mix(in oklab, $primary 96%, black);
        background-color: rgba($primary, 0.08);
    }
}