/**
 * Animations CSS
 * Apenas animações e transições que não podem ser feitas com Tailwind
 * 
 * @package Qualitronix_Theme
 */

/* Animação do Menu Mobile - Slide da direita */
.mobile-menu {
  transition: transform 0.3s ease-in-out;
  transform: translateX(100%);
}

.mobile-menu.active {
  transform: translateX(0);
}

/* Animação do Hamburguer para X */
.mobile-menu-toggle span {
  transition: all 0.3s ease;
}

.mobile-menu-toggle.active span:nth-child(1) {
  transform: rotate(45deg) translate(6px, 6px);
}

.mobile-menu-toggle.active span:nth-child(2) {
  opacity: 0;
}

.mobile-menu-toggle.active span:nth-child(3) {
  transform: rotate(-45deg) translate(6px, -6px);
}

/* Overlay Menu Mobile */
.mobile-menu-overlay {
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

/* Banner Slide - Fade in/out */
.banner-slide {
  transition: opacity 0.5s ease-in-out;
}