.btn-orange {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--color-orange), var(--bs-bg-opacity));
    color: rgb(var(--text-color-light));
    border-color: rgba(var(--color-orange), var(--bs-bg-opacity));
}

.btn-orange:hover {
    background-color: rgba(var(--color-orange), var(--bs-bg-opacity));
    color: rgb(var(--text-color-light));
    border-color: rgba(var(--color-orange), var(--bs-bg-opacity));
}

.btn-outline-orange {
    --bs-bg-opacity: 1;
    color: rgba(var(--color-orange), var(--bs-bg-opacity));
    background-color: transparent;
    background-image: none;
    border-color: rgba(var(--color-orange), var(--bs-bg-opacity));
}

.btn-outline-orange:hover {
    color: rgb(var(--text-color-light));
    background-color: rgba(var(--color-orange), var(--bs-bg-opacity));
}
.btn-outline-orange:hover i.fa, .btn-outline-orange:hover i.fab,
.btn-outline-orange:hover i.far, .btn-outline-orange:hover i.fas {
    background-color: rgb(var(--text-color-light));
}

.btn-orange-vif {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--color-orange-vif), var(--bs-bg-opacity));
    color: rgb(var(--text-color-light));
    border-color: rgba(var(--color-orange-vif), var(--bs-bg-opacity));
}

.btn-orange-vif:hover {
    background-color: rgba(var(--color-orange-vif), var(--bs-bg-opacity));
    color: rgb(var(--text-color-light));
    border-color: rgba(var(--color-orange-vif), var(--bs-bg-opacity));
}

.btn-outline-orange-vif {
    --bs-bg-opacity: 1;
    color: rgba(var(--color-orange-vif), var(--bs-bg-opacity));
    background-color: transparent;
    background-image: none;
    border-color: rgba(var(--color-orange-vif), var(--bs-bg-opacity));
}
.btn-outline-orange-vif:hover i.fa, .btn-outline-orange-vif:hover i.fab,
.btn-outline-orange-vif:hover i.far, .btn-outline-orange-vif:hover i.fas {
    background-color: rgb(var(--text-color-light));
}

.btn-outline-orange-vif:hover {
    color: rgb(var(--text-color-light));
    background-color: rgba(var(--color-orange-vif), var(--bs-bg-opacity));
}
.btn-outline-orange-vif:hover i.fa, .btn-outline-orange-vif:hover i.fab,
.btn-outline-orange-vif:hover i.far, .btn-outline-orange-vif:hover i.fas {
    background-color: rgb(var(--text-color-light));
}

.btn-rose {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--color-rose), var(--bs-bg-opacity));
    color: rgb(var(--text-color-light));
    border-color: rgba(var(--color-rose), var(--bs-bg-opacity));
}

.btn-rose:hover {
    background-color: rgba(var(--color-rose-clair), var(--bs-bg-opacity));
    border-color: rgba(var(--color-rose-clair), var(--bs-bg-opacity));
}

.btn-outline-rose {
    --bs-bg-opacity: 1;
    color: rgba(var(--color-rose), var(--bs-bg-opacity));
    background-color: transparent;
    background-image: none;
    border-color: rgba(var(--color-rose), var(--bs-bg-opacity));
}

.btn-outline-rose:hover {
    color: rgb(var(--text-color-light));
    background-color: rgba(var(--color-rose), var(--bs-bg-opacity));
}
.btn-outline-rose:hover i.fa, .btn-outline-rose:hover i.fab,
.btn-outline-rose:hover i.far, .btn-outline-rose:hover i.fas {
    background-color: rgb(var(--text-color-light));
}

.btn-poivre {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--color-poivre), var(--bs-bg-opacity));
    color: rgb(var(--text-color-light));
    border-color: rgba(var(--color-poivre), var(--bs-bg-opacity));
}

.btn-poivre:hover {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--color-poivre-clair), var(--bs-bg-opacity));
    color: rgb(var(--text-color-light));
    border-color: rgba(var(--color-poivre-clair), var(--bs-bg-opacity));
}

.btn-outline-poivre {
    --bs-bg-opacity: 1;
    color: rgba(var(--color-poivre), var(--bs-bg-opacity));
    background-color: transparent;
    background-image: none;
    border-color: rgba(var(--color-poivre), var(--bs-bg-opacity));
}
.btn-outline-poivre:hover {
    --bs-bg-opacity: 1;
    color: rgb(var(--text-color-light));
    background-color: rgba(var(--color-poivre), var(--bs-bg-opacity));
}
.btn-outline-poivre:hover i.fa, .btn-outline-poivre:hover i.fab,
.btn-outline-poivre:hover i.far, .btn-outline-poivre:hover i.fas {
    background-color: rgb(var(--text-color-light));
}

.btn-white {
    --bs-bg-opacity: 1;
    background-color: white;
    color: rgba(var(--color-poivre), var(--bs-bg-opacity));
    border: 2px solid white;
    font-weight: 600;
    transition: all 0.3s ease;
}

.btn-white:hover {
    background-color: transparent;
    color: white !important;
    border-color: white;
    transform: translateY(-2px);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}
.btn-white:hover i.fa, .btn-white:hover i.fab,
.btn-white:hover i.far, .btn-white:hover i.fas {
    background-color: rgb(var(--text-color-light));
}

.btn-outline-light:hover {
    transform: translateY(-2px);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}
.btn-outline-light:hover i.fa, .btn-outline-light:hover i.fab,
.btn-outline-light:hover i.far, .btn-outline-light:hover i.fas {
    background-color: rgb(var(--text-color-light));
}