/**
 * CSS Transitions et animations modernes
 * Remplace les animations jQuery pour de meilleures performances
 */

/* Transitions pour le menu */
#headerBar {
  transition: height 0.4s ease;
}

.barreVisuel {
  transition: opacity 0.3s ease;
}

/* Animation fade pour les éléments temporaires */
.temp {
  animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* Transitions pour les boutons et liens */
a, 
.bt,
.wp-block-button__link {
  transition: all 0.3s ease;
}

a:hover,
#barreNav li a:hover {
  transition: all 0.2s ease;
}


/* Amélioration des transitions pour les articles */
.recents-post,
#articles .post {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.recents-post:hover,
#articles .post:hover {
  transform: translateY(-5px);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

/* Transitions pour le slideshow faire-part */
.indexFP {
  transition: top 1s ease, left 1s ease;
}

/* Overlay modal pour les images */
#grandBlanc {
  transition: opacity 0.3s ease;
}

#grand {
  transition: all 0.3s ease;
}

/* Animation pour le menu mobile */
#barreNav ul {
  transition: max-height 0.3s ease;
  overflow: hidden;
}

/* Responsive animations - désactiver sur mobile pour performance */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* Performance : GPU acceleration pour les animations */
.barreVisuel,
.indexFP,
#grand,
#grandBlanc {
  will-change: transform;
  backface-visibility: hidden;
}

/* Amélioration visuelle des cartes */
.livreListeUnite,
.articleRelation .articleRelation0 a,
.articleRelation .articleRelation1 a,
.articleRelation .articleRelation2 a {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.livreListeUnite:hover {
  transform: scale(1.05);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
}
