.btn, .btn:focus-visible {
    background-color: var(--color) !important;
    --bs-btn-border-color: var(--border-color) !important;
    color: var(--text-color, black);
}

.btn:hover {
    background-color: var(--color-hover) !important;
    border-color: var(--border-color-hover) !important;
    color: var(--text-color, black) !important;
}

.btn-primary {
    --color: var(--primary-500);
    --color-hover: var(--primary-600);
    --text-color: var(--white);
}

.btn-secondary {
    --color: var(--secondary-500);
    --color-hover: var(--secondary-600);
    --text-color: var(--white);
}

.btn-success {
    --color: var(--success-500);
    --color-hover: var(--success-600);
    --text-color: var(--white);
}

.btn-warning {
    --color: var(--warning-500);
    --color-hover: var(--warning-600);
    --text-color: var(--white);
}

.btn-danger {
    --color: var(--danger-500);
    --color-hover: var(--danger-600);
    --text-color: var(--white);
}

.btn-info {
    --color: var(--info-500);
    --color-hover: var(--info-600);
    --text-color: var(--white);
}

.btn-outline {
    --color : transparent;
    --text-color: var(--white);
}

.btn-outline-black {
    --color : transparent;
    --text-color: var(--black);
}

.btn-white{
    --color: var(--white);
    --color-hover: var(--gray-100);
    --text-color: var(--black);
}

.btn-light-blue {
    --color: var(--blue-100);
    --color-hover: var(--blue-200);
    --text-color: var(--black);
}

.btn-blue {
    --color: var(--blue-500);
    --color-hover: var(--blue-600);
    --text-color: var(--white);
}

.btn-yellow {
    --color: var(--yellow-500);
    --color-hover: var(--yellow-600);
    --text-color: var(--white);
}

.btn-orange {
    --color: var(--orange-500);
    --color-hover: var(--orange-600);
    --text-color: var(--white);
}

.btn-green {
    --color: var(--green-500);
    --color-hover: var(--green-600);
    --text-color: var(--white);
}

.btn-light-green {
    --color: var(--green-100);
    --color-hover: var(--green-200);
    --text-color: var(--black);
}

.btn-red {
    --color: var(--red-500);
    --color-hover: var(--red-600);
    --text-color: var(--white);
}

.btn-cyan {
    --color: var(--cyan-500);
    --color-hover: var(--cyan-600);
    --text-color: var(--white);
}

.btn-bordeaux {
    --color: var(--bordeaux-500);
    --color-hover: var(--bordeaux-600);
    --text-color: var(--white);
}

.btn-dark-gray {
    --color: var(--gray-700);
    --color-hover: var(--gray-800);
    --text-color: var(--white);
}

.btn-light-gray{
    --color: var(--gray-100);
    --color-hover: var(--gray-200);
    --text-color: var(--black);
}

button.close {
    background-color: transparent;
    border: none;
}



.btn-primary {
    --bs-btn-bg: var(--cibor-blue);
    --bs-btn-border-color: var(--cibor-blue);
    --bs-btn-hover-bg: var(--cibor-blue-hover);
    --bs-btn-hover-border-color: var(--cibor-blue-hover);
    --bs-btn-active-bg: var(--cibor-blue-hover);
    --bs-btn-active-border-color: var(--cibor-blue-hover);
    --bs-btn-disabled-bg: var(--cibor-blue);
    --bs-btn-disabled-border-color: var(--cibor-blue);
}


.btn-outline-primary {
    --bs-btn-color: var(--cibor-blue);
    --bs-btn-border-color: var(--cibor-blue);
}

.btn-outline-primary:hover {
    color: white !important;
    --bs-btn-hover-bg: var(--cibor-blue-hover);
    --bs-btn-hover-border-color: var(--cibor-blue-hover);
}

.btn-exactonline {
    color: white !important;
    --bs-btn-bg: var(--exact-online-color);
    --bs-btn-border-color: var(--exact-online-color);
}

.btn-exactonline:hover {
    color: white !important;
    background-color: var(--exact-online-color) !important;
    border-color: var(--exact-online-color) !important;
    filter: brightness(120%);
}

.btn-exactonline {
    --bs-btn-color: var(--exact-online-color);
    --bs-btn-border-color: var(--exact-online-color);
}

.btn-exactonline:hover {
    color: white !important;
    background-color: var(--exact-online-color) !important;
    border-color: var(--exact-online-color) !important;
}

.btn-light-blue {
    color: var(--cibor-gray-dark);
    --bs-btn-bg: var(--cibor-light-blue);
    --bs-btn-border-color: var(--cibor-light-blue);
}

.btn-light-blue:hover {
    background-color: var(--cibor-light-blue) !important;
    border-color: var(--cibor-light-blue) !important;
    filter: brightness(85%);
}

.btn-outline-light-green {
    --bs-btn-color: var(--cibor-light-green);
    --bs-btn-border-color: var(--cibor-light-green);
}

.btn-outline-light-green:hover {
    color: white !important;
    background-color: var(--cibor-light-green) !important;
    border-color: var(--cibor-light-green) !important;
}


.btn-cibor-light {
    color: var(--black) !important;
    background-color: var(--cibor-light);
}

.btn-cibor-white {
    color: var(--black) !important;
    background-color: var(--white);
}


.btn-cibor-crm-entity {
    color: white !important;
    background-color: var(--cibor-crm-entity);
}

.btn-cibor-crm-entity:hover {
    color: white !important;
    background-color: var(--cibor-crm-entity-hover);
}

.btn-cibor-contact {
    color: white !important;
    background-color: var(--cibor-contact);
}

.btn-cibor-contact:hover {
    color: white !important;
    background-color: var(--cibor-contact-hover) !important;
}

.btn-cibor-dossier {
    color: white !important;
    background-color: var(--cibor-dossier);
}

.btn-cibor-dossier:hover {
    color: white !important;
    background-color: var(--cibor-dossier-hover) !important;
}

.btn-cibor-red {
    color: white !important;
    background-color: var(--cibor-red);
}

.btn-cibor-red:hover {
    color: white !important;
    background-color: var(--cibor-red-hover) !important;
}

.btn-cibor-green {
    color: white !important;
    background-color: var(--cibor-green);
}

.btn-cibor-green:hover {
    color: white !important;
    background-color: var(--cibor-green-hover) !important;
}

.btn-cibor-minimal {
    color: var(--cibor-gray-dark) !important;
    background-color: var(--white);
    border: 1px solid var(--cibor-gray-lighter);
}

.btn-cibor-minimal:hover {
    border: 1px solid var(--cibor-gray-extra-light);
}

.btn.btn-xs {
    --bs-btn-padding-y: 0.08rem;
    --bs-btn-padding-x: 0.25rem;
    font-size: 0.875rem !important;
}

.btn-cibor-priority-score {
    padding: 3px 5px 3px 5px;
    /**padding: 0;**/
    color: var(--cibor-gray-dark) !important;
    border: 1px solid var(--cibor-gray);

    .progress {
        --bs-progress-bg: var(--cibor-gray-extra-light);
    !important
    }
}

.btn-cibor-priority-score:hover {
    border: 1px solid var(--cibor-gray-dark);
}

.btn-inherit {
    color: inherit;
}

.btn-in-badge {
    --bs-btn-padding-x: 0;
    --bs-btn-padding-y: 0;
    --bs-btn-font-size: 1em;
    --bs-btn-line-height: 0;
}


.btn-cibor-lavender {
    color: black !important;
    background-color: var(--lavender-mist);
}

.btn-cibor-lavender:hover {
    background-color: var(--cibor-alice-blue) !important;
}


.btn-delete, .btn-delete:focus-visible {
    color: white !important;
    background-color: var(--orioles-orange);
}

.btn-delete:hover {
    color: white !important;
    background-color: var(--giants-orange) !important;
}

.btn-dossier-mail, .btn-dossier-mail:focus-visible {
    color: white !important;
    background-color: var(--medium-persian-blue);
}

.btn-dossier-mail:hover {
    color: white !important;
    background-color: var(--cibor-french-blue) !important;
}

.btn-navigation, .btn-navigation:focus-visible {
    color: var(--dark-silver);
    background-color: var(--lavender-mist);
}

.btn-navigation:hover {
    color: var(--dark-silver);
    background-color: var(--cibor-alice-blue);
}

.btn-crm-entity, .btn-crm-entity:focus-visible {
    color: black !important;
    background-color: var(--platinum);
}

.btn-crm-entity:hover {
    color: black !important;
    background-color: var(--white-smoke) !important;
}

.btn-priority-score, .btn-priority-score:focus-visible {
    color: white !important;
    background-color: var(--medium-persian-blue);
}

.btn-priority-score:hover {
    color: white !important;
    background-color: var(--cibor-french-blue) !important;
}

.btn-dossier-problem, .btn-dossier-problem:focus-visible {
    position: relative;
    color: white !important;
}

.btn-dossier-problem svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: var(--orioles-orange);
}

.btn-dossier-problem svg:hover {
    color: var(--giants-orange) !important;
}



.btn-google-maps,
.btn-google-maps:focus-visible {
    color: white !important;
    background-color: var(--raisin-black);

    &.btn-hollow {
        background-color: transparent;
    }

    &:hover {
        &:not(.btn-hollow) {
            background-color: var(--black-olive) !important;
        }
    }
}


.btn-icon {
    padding: 0;
    margin: 0;
}

.btn-label, .btn-label:focus-visible, .btn-label:hover {
    cursor: default !important;
    border: none !important;
}
