/* Style personnalisé pour la photo de profil */
#sideNav .navbar-brand .img-profile {
  max-width: 120px;
  max-height: 120px;
  border: 0.25rem solid rgba(63, 81, 181, 0.5); /* Couleur principale du site */
  border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%; /* Forme organique */
  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.2);
  transition: all 0.4s ease-in-out;
  cursor: pointer;
}

#sideNav .navbar-brand .img-profile:hover {
  transform: scale(1.05);
  border-color: #00FF41; /* Couleur matrix verte */
  border-radius: 60% 40% 40% 60% / 60% 30% 70% 40%; /* Changement de forme au survol */
  box-shadow: 0 8px 20px rgba(0, 255, 65, 0.25);
}

/* Effet lors du clic sur la photo */
.photo-click-effect {
  transform: scale(0.95) !important;
  border-color: #3F51B5 !important;
  box-shadow: 0 0 15px rgba(63, 81, 181, 0.6) !important;
  border-radius: 50% !important;
  transition: all 0.2s ease-out !important;
}

/* Animation subtile de rotation de la bordure */
@keyframes morphing {
  0% { border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%; }
  25% { border-radius: 40% 60% 60% 40% / 50% 40% 60% 50%; }
  50% { border-radius: 60% 40% 30% 70% / 40% 50% 50% 60%; }
  75% { border-radius: 40% 60% 70% 30% / 60% 30% 70% 40%; }
  100% { border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%; }
}

#sideNav .navbar-brand .img-profile.morphing-active {
  animation: morphing 5s infinite alternate;
}

/* Style pour les écrans plus grands */
@media (min-width: 992px) {
  #sideNav .navbar-brand .img-profile {
    max-width: 160px;
    max-height: 160px;
    margin-bottom: 0.5rem;
  }
}