/* Assure que le corps prend toute la hauteur disponible */
body, html {
  height: 100%;
  margin: 0;
}
/* Wrapper pour le contenu et le footer */
.wrapper {
  min-height: 83vh;
  display: flex;
  flex-direction: column;
}
.content {
  flex: 1; /* Ceci prend l'espace disponible, poussant le footer vers le bas */
}
footer {
  margin-top: auto; /* Pousse le footer vers le bas de la page si le contenu est insuffisant */
}

.min-vh-50 {
  min-height: 50vh; /* Hauteur minimale de 50% de la hauteur de l'écran */
}

.btn-primaire {
  background-color: #3737c8 !important; /* Couleur de fond du bouton */
  color: white !important; /* Couleur du texte du bouton */
  border-color: #3737c8 !important; /* Couleur de la bordure du bouton */
}

.btn-primaire:hover {
  background-color: #00d4aa !important; /* Couleur de fond au survol */
  border-color: #00d4aa !important; /* Couleur de la bordure au survol */
  color: black !important; /* Couleur du texte au survol */
}

.btn-primaire:active {
  background-color: #00d4aa !important; /* Couleur de fond lors du clic */
  border-color: #00d4aa !important; /* Couleur de la bordure lors du clic */
  color: black !important; /* Couleur du texte lors du clic */
  box-shadow: inset 0 0 0.2rem rgba(0, 0, 0, 0.2); /* Ombre pour effet de pression */
}

.btn-primaire:focus, .btn-primaire.focus {
  box-shadow: 0 0 0 0.2rem rgba(0, 0, 0, 0.2); /* Ombre de mise au point */
}

.btn-secondaire {
  background-color: #00d4aa !important; /* Couleur de fond du bouton */
  color: #060628 !important; /* Couleur du texte du bouton */
  border-color: #00d4aa !important; /* Couleur de la bordure du bouton */
}

.btn-secondaire:hover {
  color: #fff !important;
  background-color: #3737c8 !important;
  border-color: #3737c8 !important;
}


/* Texte */

.display-1-bold {
  font-size: 60pt; /* Taille de police équivalente à display-1 */
  font-weight: 900; /* Poids de la police très épais */
}

.fw-black {
  font-weight: 900; /* Poids de police très épais */
}

.text-primaire {
  color:#3737c8;
}
.text-secondaire {
  color:#00d4aa;
}
.text-compv1 {
  color:#50ddc6; /* Complément vert #1 */
} 
.text-compv2 {
  color:#9fe6e3; /* Complément vert #2 */
}
.text-clair {
  color:#efefff;
}
.text-compb1 {
  color: #16165d; /* Complément bleu #1 */
}
.text-compb2 {
  color:#272793; /* Complément bleu #2 */
}
.text-accentb {
  color: #266bbe; /* Accent bleu */
}
.text-accentv {
  color:#12a0b4; /* Accent vert */
}
.text-fonce {
  color: #060628;
}
.text-neutre1 {
  color:#545470; /* Neutre foncé */
}
.text-neutre2 {
  color:#a1a1b7; /* Neutre clair */
}
.text-h1 {
  font-Size: 4rem;
}
.text-h4 {
  font-Size: 1.5rem;
}
.ml-05 { 
  margin-left:0.5rem;
}
.ml-1 { 
  margin-left:1rem;
}
.me-2 {
  margin: 0.5rem; /* Ajuste la valeur si nécessaire */
}

.bg-primaire {
  background-color:#3737c8 !important;
}
.bg-secondaire {
  background-color:#00d4aa !important;
}
.bg-compv1 {
  background-color:#50ddc6 !important; /* Complément vert #1 */
} 
.bg-compv2 {
  background-color:#9fe6e3 !important; /* Complément vert #2 */
}
.bg-clair {
  background-color:#efefff !important;
}
.bg-compb1 {
  background-color: #16165d !important; /* Complément bleu #1 */
}
.bg-compb2 {
  background-color:#272793 !important; /* Complément bleu #2 */
}
.bg-accentb {
  background-color: #266bbe !important; /* Accent bleu */
}
.bg-accentv {
  background-color:#12a0b4 !important; /* Accent vert */
}
.bg-fonce {
  background-color: #060628 !important;
}
.bg-neutre1 {
  background-color:#545470 !important; /* Neutre foncé */
}
.bg-neutre2 {
  background-color:#a1a1b7 !important; /* Neutre clair */
}

.bg-mobile {
  background: linear-gradient(to bottom, 
  #ffffff 0%,    /* Début du blanc en haut */
  #d5d5ff 20%,   /* Blanc jusqu'à 40% */
  #8787de 60%,   /* Transition vers le bleu foncé de 40% à 60% */
  #00d4aa 100%); /* Transition vers le cyan de 60% à 100% */
padding: 20px; /* Ajouter un espacement interne si nécessaire */
border-radius: 10px; /* Coins arrondis si souhaité */
width: 100%; /* La largeur peut être ajustée selon vos besoins */
    min-height: 100vh;
}

/* Menu */

.nav-link-primaire {
  display: block; /* Assure que le lien occupe tout l'espace disponible */
  color: #060628; /* Couleur du texte */
  border-radius: 0.25rem; /* Coins arrondis */
  padding: 0.5rem 1rem; /* Espacement intérieur */
  text-decoration: none; /* Enlève la décoration par défaut des liens */
  transition: background-color 0.2s ease-in-out; /* Transition douce pour le fond */
}

.nav-link-primaire:hover,
.nav-link-primaire:focus {
  color: #3737c8; /* Couleur du texte au survol */
  font-weight:bold;
  text-decoration: none; /* Évite les soulignements au survol */
}

.nav-link-primaire.active,
.nav-link-primaire:active {
  color: #00d4aa; /* Couleur du texte au survol */
  font-weight:bold;
  text-decoration: none; /* Évite les soulignements au survol */
}


.dropdown-menu-primaire {
  background-color: #00d4aa !important; /* Couleur primaire pour le fond */
  border-color: rgba(0, 0, 0, 0.15); /* Bordure avec transparence */
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.175); /* Ombre portée */
}

.dropdown-menu-primaire .dropdown-item {
  color: #060628; /* Couleur du texte */
}

.dropdown-menu-primaire .dropdown-item:hover,
.dropdown-menu-primaire .dropdown-item:focus {
  background-color: #3737c8; /* Couleur primaire pour le fond */
  color: #e9ecef; /* Couleur du texte au survol */
}

.dropdown-menu-primaire .dropdown-item.active,
.dropdown-menu-primaire .dropdown-item:active {
  background-color: #060628; /* Couleur primaire pour le fond */
  color: #fff; /* Couleur du texte actif */
}

.dropdown-menu-primaire .dropdown-divider {
  height: 1px;
  margin: 0.5rem 0;
  overflow: hidden;
  background-color: rgba(255, 255, 255, 0.15); /* Couleur du séparateur */
}

/* Fonts */
.roboto-thin {
    font-family: "Roboto", sans-serif;
    font-weight: 100;
    font-style: normal;
  }
  
  .roboto-light {
    font-family: "Roboto", sans-serif;
    font-weight: 300;
    font-style: normal;
  }
  
  .roboto-regular {
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    font-style: normal;
  }
  
  .roboto-medium {
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    font-style: normal;
  }
  
  .roboto-bold {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-style: normal;
  }
  
  .roboto-black {
    font-family: "Roboto", sans-serif;
    font-weight: 900;
    font-style: normal;
  }
  
  .roboto-thin-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 100;
    font-style: italic;
  }
  
  .roboto-light-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 300;
    font-style: italic;
  }
  
  .roboto-regular-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    font-style: italic;
  }
  
  .roboto-medium-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    font-style: italic;
  }
  
  .roboto-bold-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-style: italic;
  }
  
  .roboto-black-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 900;
    font-style: italic;
  }