/* CSS personnalisé pour positionner les flèches au milieu des images */
.carousel-control-prev, .carousel-control-next {
    width: 5%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.carousel-control-prev-icon, .carousel-control-next-icon {
    background-image: none; /* Supprime l'icône par défaut */
}
.carousel-control-prev-icon::before, .carousel-control-next-icon::before {
    content: '';
    display: inline-block;
    width: 30px;
    height: 30px;
    background-size: contain;
    background-repeat: no-repeat;
}
.carousel-control-prev-icon::before {
    background-image: url('img/chevron-left.png');
}
.carousel-control-next-icon::before {
    background-image: url('img/chevron-right.png');
}
.carousel-item img {
    width: 100%;
    height: auto;
}
body, html {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}
.navbar {
    margin-bottom: 0;
}

/* Styles pour les indicateurs du carousel */
.carousel-indicators li {
    background-color: #000000; /* Couleur de fond par défaut des indicateurs */
}

.carousel-indicators .active {
    background-color: #6800ee; /* Couleur de fond des indicateurs actifs */
}


/* CSS pour les légendes du carousel */
.carousel-caption {
    color: #000000; /* Couleur de texte noire */
}