/* ===================================================================
   INDENANT BROKER - TRANSICIONES Y MODALES
   Archivo de transiciones Alpine.js y efectos de modales
   Extraído de home.php para mejor modularización
   =================================================================== */

/* ===================================================================
   1. TRANSICIONES ALPINE.JS PARA MODALES
   =================================================================== */
.modal-transition-enter {
  opacity: 0;
  transform: translateY(20px) scale(0.95);
}

.modal-transition-enter-active {
  transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

.modal-transition-enter-to {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.modal-transition-leave {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.modal-transition-leave-active {
  transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1);
}

.modal-transition-leave-to {
  opacity: 0;
  transform: translateY(20px) scale(0.95);
}

/* ===================================================================
   2. TRANSICIONES PARA MENÚS DROPDOWN
   =================================================================== */
.menu-transition-enter {
  opacity: 0;
  transform: translateY(-1rem) scaleY(0.9);
  transform-origin: top;
}

.menu-transition-enter-active {
  transition: all 250ms cubic-bezier(0.4, 0, 0.2, 1);
}

.menu-transition-enter-to {
  opacity: 1;
  transform: translateY(0) scaleY(1);
}

.menu-transition-leave {
  opacity: 1;
  transform: translateY(0) scaleY(1);
}

.menu-transition-leave-active {
  transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1);
  transform-origin: top;
}

.menu-transition-leave-to {
  opacity: 0;
  transform: translateY(-1rem) scaleY(0.9);
}