/* Mode clair (par défaut) */
.background-white {
    background-color: white !important;
    color: black !important;
}

/* Mode sombre */
.background-black {
    background-color: black !important;
    color: white !important;
}

.background-white *:not(#CV_bas):not(#lien a):not(video):not(.video):not(.loader):not(.fond_loader):not(#form #main-nav):not(#main-nav):not(#form):not(#contenu_contact):not(.barreau):not(#identite):not(#ident1):not(#ident2):not(.downOfCarouselImage):not(.annee h3):not(.barreTitreProjet):not(#projets):not(#grandsProjets):not(#programmation):not(#langage):not(#titreCarousel):not(#main-nav .sousbarre):not(header):not(#color):not(#page .fleche):not(#page #fin):not(#page #lien):not(#page .tete):not(#page #contenu1):not(#page #contenu2):not(#page #contenu3):not(#page #contenu4):not(#page):not(.active):not(#ligne1Pourcentage div span):not(#ligne2Pourcentage div span):not(#ligne3Pourcentage div span):not(#contenu #moi):not(#contenu):not(div.mt-4.text-center a):not(div.mt-4.text-center):not(#contenu_contact .title):not(#form button):not(.scroll-progress):not(.conteneurProjets .descProjet):not(.conteneurProjets .descProjet li):not(.navbar-toggler):not(.navbar-toggler div),
.background-black *:not(#CV_bas):not(#lien a):not(video):not(.video):not(.loader):not(.fond_loader):not(#form #main-nav):not(#main-nav):not(#form):not(#contenu_contact):not(.barreau):not(#identite):not(#ident1):not(#ident2):not(.downOfCarouselImage):not(.annee h3):not(.barreTitreProjet):not(#projets):not(#grandsProjets):not(#programmation):not(#langage):not(#titreCarousel):not(#main-nav .sousbarre):not(header):not(#color):not(#page .fleche):not(#page #fin):not(#page #lien):not(#page .tete):not(#page #contenu1):not(#page #contenu2):not(#page #contenu3):not(#page #contenu4):not(#page):not(.active):not(#ligne1Pourcentage div span):not(#ligne2Pourcentage div span):not(#ligne3Pourcentage div span):not(#contenu #moi):not(#contenu):not(div.mt-4.text-center a):not(div.mt-4.text-center):not(#contenu_contact .title):not(#form button):not(.scroll-progress):not(.conteneurProjets .descProjet):not(.conteneurProjets .descProjet li):not(.navbar-toggler):not(.navbar-toggler div){
    background-color: inherit !important;
    color: inherit !important;
}

div.mt-4.text-center, #page {
    background-color: transparent !important;
}
/* Priorité de la classe active */
.active {
    background-color: #505050 !important;
    color: white !important;
}

/* Bouton switch */
#color {
    position: fixed;
    bottom: 1%;
    right: 1%;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.4);
    cursor: pointer;
}

/* Mode clair - Bouton switch */
.background-white  {
    background-color: black !important;
}



/* Mode clair - Projets */
.background-white #projet2025 > h3, 
.background-white #projet2024 > h3 {
    background-color: black !important;
    color: white !important;
}

/* Mode sombre - Projets */
.background-black #projet2025 > h3, 
.background-black #projet2024 > h3 {
    background-color: white !important;
    color: black !important;
}


#contenu #moi {
    background-color: #f5f5f5f5;
}
#page > div.retour > div {
    background-color: gray !important;
    color: inherit !important;
    border-radius: 10%;
}

#page {
    background-color: transparent !important;
}

.background-white video,
.background-white .video,
.background-black #color,
.background-black .loader,
.background-white .fond_loader,
.background-white header,
.background-white #form,
.background-white #form #main-nav,
.background-white #contenu_contact,
.background-black .barreau,
.background-white #identite,
.background-white .annee h3,
.background-black .barreTitreProjet,
.background-white #projets,
.background-white #grandsProjets,
.background-white #langage,
.background-white #programmation,
.background-black #main-nav .sousbarre,
.background-white #titreCarousel,
.background-white > #page .tete,
.background-white > #page .video,
.background-white > #page #contenu1,
.background-white > #page #contenu2,
.background-white > #page #contenu3,
.background-white > #page #contenu4,
.background-white > #page #lien,
.background-white > #page #fin,
.background-white #contenu #moi, 
.background-white > #contenu_propos,
.background-black > .scroll-progress,
.background-black #form button,
.background-black div.mt-4.text-center a
{
    color: black;
    background-color: #f5f5f5f5 !important;
    box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.4);
}
.background-black video,
.background-black .video,
.background-white #color,
.background-white .loader,
.background-black .fond_loader,
.background-black header,
.background-black #form,
.background-black #form #main-nav,
.background-black #contenu_contact,
.background-white .barreau,
.background-black #identite,
.background-white .barreTitreProjet,
.background-black .annee h3,
.background-black #projets,
.background-black #grandsProjets,
.background-black #langage,
.background-black #programmation,
.background-white #main-nav .sousbarre,
.background-black #titreCarousel,
.background-black > #page .tete,
.background-black > #page .video,
.background-black > #page #contenu1,
.background-black > #page #contenu2,
.background-black > #page #contenu3,
.background-black > #page #contenu4,
.background-black > #page #lien,
.background-black > #page #fin,
.background-black #contenu #moi,
.background-black > #contenu_propos,
.background-white > .scroll-progress,
.background-white #form button,
.background-white div.mt-4.text-center a
{
    color: white;
    background-color: black !important;
    box-shadow: 0px 4px 15px rgba(255, 255, 255, 0.4);
}


.background-black  .navbar-toggler div,    
.background-white  .navbar-toggler{
    background-color: #f5f5f5f5 !important;
}
.background-white  .navbar-toggler div,
.background-black  .navbar-toggler{
    background-color: black !important;
}



/* Mode clair - Fond d'écran */
.background-white {
    background-image: url('../image/fond_ecran_blanc.jpg') !important;
    background-size: contain !important;
    background-repeat: repeat !important;
}

/* Mode sombre - Fond d'écran */
.background-black {
    background-image: url('../image/fond_ecran_noir.jpeg') !important;
    background-size: contain !important;
    background-repeat: repeat !important;
}


/* Tous les éléments span dans #ligne1Pourcentage */
.background-white #ligne1Pourcentage > div > span,
.background-white #ligne2Pourcentage > div > span,
.background-white #ligne3Pourcentage > div > span {
    color: black !important;
}

.background-black #ligne1Pourcentage > div > span,
.background-black #ligne2Pourcentage > div > span,
.background-black #ligne3Pourcentage > div > span {
    color: black !important;
}

/* Boutons du carousel */
.background-white #carouselExampleControls > button.carousel-control-prev > div > span.carousel-control-prev-icon,
.background-white #carouselExampleControls > button.carousel-control-next > div > span.carousel-control-next-icon,
.background-black #carouselExampleControls > button.carousel-control-prev > div > span.carousel-control-prev-icon,
.background-black #carouselExampleControls > button.carousel-control-next > div > span.carousel-control-next-icon {
    background-color: black !important;
}

/* Mode clair - .barreau en noir */
.background-white .barreau {
    background-color: black !important;
    color: white !important;
}

/* Mode sombre - .barreau en blanc */
.background-black .barreau {
    background-color: white !important;
    color: black !important;
}

/* Empêcher la règle générale d'affecter .barreau */
.background-white .barreau *:not(.active),
.background-black .barreau *:not(.active) {
    background-color: inherit !important;
    color: inherit !important;
}

#ligne1Pourcentage > div > span,
#ligne2Pourcentage > div > span,
#ligne3Pourcentage > div > span,
#contenu,
#CV_bas{
    background-color: transparent !important;
    color: inherit !important;
}

.background-white > #ident1 > div > p {
    background-color: transparent !important;
}