/* Styles pour le mode sombre */
.dark-mode {
  background-color: #222020;
  color: white;
}

.dark-mode .navbar {
  background-color: #222020;
}

.dark-mode .sectionAbout, .dark-mode .skillsSection{
  background-color: #27262C    ;    ;
}

.dark-mode h2{
  color: white;
}

.dark-mode h4 {
  color: #E4E2FF;
}

.dark-mode h3 {
  color: #7A72FF;
}

/*Fenêtre modale pour le formualaire de contact*/
.dark-mode .modalContact__title {
  color: #3F3D56;
}

/*section hero*/
.dark-mode .hero__contactSvgPath {
   stroke: lightgray;
   fill: lightgray;
}

.dark-mode .hero__contactSvg:hover path {
   stroke: whitesmoke;
   fill: white;
   background-color: black;
}

/*section about*/
.dark-mode .about__decorationSmall {
  background-color: hsla(243, 100%, 72%, 0.5);
}

.dark-mode .about__decorationSmaller {
  background-color: hsl(243, 100%, 72%);
}

/*section projects*/
.js-projectCard-dark  {
  background-color: #1E1E1E;
  border: 1px solid #333;
  color: #8F2CD1;
}

.js-projectName-dark {
  color: white;
}

.js-projectTechno-dark {
    color: #B896C0;
}

.dark-mode .skill_list {
  background-color: #7A72FF;
}

.dark-mode .cvSvgColor {
  stroke: lightgray;
  fill: lightgray;
}

.dark-mode .skills__cvSvg:hover > .cvSvgColor {
   stroke: white;
   fill: white;
}

.dark-mode .sectionContact__thanksText {
  color: lightgray;
}

/*footer*/
.dark-mode .footer {
  color: lightgray;
  border-top: 1px solid hsl(245, 17%, 29%);
}

.dark-mode .footer_link {
   color: whitesmoke;
}