/* ═══════════════════════════════════════════════════════════════════ */
/* 40 ANIMACIONES ÚNICAS DE ENTRADA PARA MENÚS DESPLEGABLES          */
/* Todas usan transform-origin:top para no empujar la barra          */
/* ═══════════════════════════════════════════════════════════════════ */

/* ──── BASE: Asegurar posicionamiento correcto ──── */
[class*="menu-format-"] .dropdown-menu {
  transform-origin: top center !important;
  will-change: transform, opacity;
}

/* 1. Default — Fade + slide suave */
@keyframes menuA01 { 0%{opacity:0;transform:translateY(-8px)} 100%{opacity:1;transform:translateY(0)} }
.menu-format-default .dropdown-menu.show,
.menu-format-default .dropdown.show .dropdown-menu { animation: menuA01 .3s ease-out both !important; }

/* 2. Plastic Rough — Rebote desde arriba */
@keyframes menuA02 { 0%{opacity:0;transform:translateY(-14px) scaleY(.92)} 70%{transform:translateY(2px) scaleY(1.01)} 100%{opacity:1;transform:translateY(0) scaleY(1)} }
.menu-format-plastic-rough .dropdown-menu.show,
.menu-format-plastic-rough .dropdown.show .dropdown-menu { animation: menuA02 .4s ease-out both !important; }

/* 3. Frosted Glass — Desenfoque progresivo */
@keyframes menuA03 { 0%{opacity:0;filter:blur(12px);transform:scaleY(.94)} 100%{opacity:1;filter:blur(0);transform:scaleY(1)} }
.menu-format-frosted-glass .dropdown-menu.show,
.menu-format-frosted-glass .dropdown.show .dropdown-menu { animation: menuA03 .35s ease-out both !important; }

/* 4. Metal Brushed — Deslizar horizontal */
@keyframes menuA04 { 0%{opacity:0;transform:translateX(-15px)} 100%{opacity:1;transform:translateX(0)} }
.menu-format-metal-brushed .dropdown-menu.show,
.menu-format-metal-brushed .dropdown.show .dropdown-menu { animation: menuA04 .3s ease-out both !important; }

/* 5. Neon Glow — Escala con resplandor */
@keyframes menuA05 { 0%{opacity:0;transform:scaleY(.7);box-shadow:0 0 0 rgba(102,126,234,0)} 50%{box-shadow:0 0 30px rgba(102,126,234,.6)} 100%{opacity:1;transform:scaleY(1)} }
.menu-format-neon-glow .dropdown-menu.show,
.menu-format-neon-glow .dropdown.show .dropdown-menu { animation: menuA05 .4s ease-out both !important; }

/* 6. Wood Textured — Puerta giratoria */
@keyframes menuA06 { 0%{opacity:0;transform:perspective(600px) rotateX(-12deg)} 100%{opacity:1;transform:perspective(600px) rotateX(0)} }
.menu-format-wood-textured .dropdown-menu.show,
.menu-format-wood-textured .dropdown.show .dropdown-menu { animation: menuA06 .35s ease-out both !important; }

/* 7. Holographic — Giro holográfico suave */
@keyframes menuA07 { 0%{opacity:0;transform:perspective(800px) rotateY(15deg);filter:hue-rotate(90deg)} 100%{opacity:1;transform:perspective(800px) rotateY(0);filter:hue-rotate(0)} }
.menu-format-holographic .dropdown-menu.show,
.menu-format-holographic .dropdown.show .dropdown-menu { animation: menuA07 .4s ease-out both !important; }

/* 8. Leather — Abrir libro desde la izquierda */
@keyframes menuA08 { 0%{opacity:0;transform:perspective(500px) rotateY(-12deg);transform-origin:top left} 100%{opacity:1;transform:perspective(500px) rotateY(0)} }
.menu-format-leather .dropdown-menu.show,
.menu-format-leather .dropdown.show .dropdown-menu { animation: menuA08 .35s ease-out both !important; transform-origin:top left !important; }

/* 9. Marble — Ascenso elegante */
@keyframes menuA09 { 0%{opacity:0;transform:translateY(10px)} 100%{opacity:1;transform:translateY(0)} }
.menu-format-marble .dropdown-menu.show,
.menu-format-marble .dropdown.show .dropdown-menu { animation: menuA09 .3s ease-out both !important; }

/* 10. Circuit — Escaneo digital línea */
@keyframes menuA10 { 0%{opacity:0;clip-path:inset(0 100% 0 0)} 100%{opacity:1;clip-path:inset(0 0 0 0)} }
.menu-format-circuit .dropdown-menu.show,
.menu-format-circuit .dropdown.show .dropdown-menu { animation: menuA10 .35s ease-out both !important; }

/* 11. Crumpled Paper — Desarrugar */
@keyframes menuA11 { 0%{opacity:0;transform:scaleY(.6) scaleX(.95);filter:blur(2px)} 60%{transform:scaleY(1.02) scaleX(1.01)} 100%{opacity:1;transform:scale(1);filter:blur(0)} }
.menu-format-crumpled-paper .dropdown-menu.show,
.menu-format-crumpled-paper .dropdown.show .dropdown-menu { animation: menuA11 .4s ease-out both !important; }

/* 12. Mirror Glass — Volteo X */
@keyframes menuA12 { 0%{opacity:0;transform:perspective(600px) rotateX(40deg)} 70%{transform:perspective(600px) rotateX(-3deg)} 100%{opacity:1;transform:perspective(600px) rotateX(0)} }
.menu-format-mirror-glass .dropdown-menu.show,
.menu-format-mirror-glass .dropdown.show .dropdown-menu { animation: menuA12 .4s ease-out both !important; }

/* 13. Satin Fabric — Cortina desplegándose */
@keyframes menuA13 { 0%{opacity:0;transform:scaleY(.2)} 60%{transform:scaleY(1.03)} 100%{opacity:1;transform:scaleY(1)} }
.menu-format-satin-fabric .dropdown-menu.show,
.menu-format-satin-fabric .dropdown.show .dropdown-menu { animation: menuA13 .35s ease-out both !important; }

/* 14. Concrete — Caída pesada */
@keyframes menuA14 { 0%{opacity:0;transform:translateY(-18px)} 65%{opacity:1;transform:translateY(2px)} 85%{transform:translateY(-1px)} 100%{transform:translateY(0)} }
.menu-format-concrete .dropdown-menu.show,
.menu-format-concrete .dropdown.show .dropdown-menu { animation: menuA14 .4s ease-out both !important; }

/* 15. Plasma — Escala energética */
@keyframes menuA15 { 0%{opacity:0;transform:scaleY(0);filter:brightness(2)} 50%{filter:brightness(1.3)} 100%{opacity:1;transform:scaleY(1);filter:brightness(1)} }
.menu-format-plasma .dropdown-menu.show,
.menu-format-plasma .dropdown.show .dropdown-menu { animation: menuA15 .4s ease-out both !important; }

/* 16. Carbon Fiber — Deslizar derecha */
@keyframes menuA16 { 0%{opacity:0;transform:translateX(15px)} 100%{opacity:1;transform:translateX(0)} }
.menu-format-carbon-fiber .dropdown-menu.show,
.menu-format-carbon-fiber .dropdown.show .dropdown-menu { animation: menuA16 .3s ease-out both !important; }

/* 17. Rainbow Border — Circulo revelado */
@keyframes menuA17 { 0%{opacity:0;clip-path:circle(0% at 50% 0)} 100%{opacity:1;clip-path:circle(150% at 50% 0)} }
.menu-format-rainbow-border .dropdown-menu.show,
.menu-format-rainbow-border .dropdown.show .dropdown-menu { animation: menuA17 .4s ease-out both !important; }

/* 18. Elastic Wave — Rebote elástico */
@keyframes menuA18 { 0%{opacity:0;transform:scaleX(.6) scaleY(.5)} 40%{transform:scaleX(1.05) scaleY(1.03)} 70%{transform:scaleX(.98) scaleY(.99)} 100%{opacity:1;transform:scale(1)} }
.menu-format-elastic-wave .dropdown-menu.show,
.menu-format-elastic-wave .dropdown.show .dropdown-menu { animation: menuA18 .5s ease-out both !important; }

/* 19. Floating Particles — Flotar arriba */
@keyframes menuA19 { 0%{opacity:0;transform:translateY(12px)} 70%{opacity:1;transform:translateY(-2px)} 100%{transform:translateY(0)} }
.menu-format-floating-particles .dropdown-menu.show,
.menu-format-floating-particles .dropdown.show .dropdown-menu { animation: menuA19 .4s ease-out both !important; }

/* 20. Spiral Rotate — Giro suave */
@keyframes menuA20 { 0%{opacity:0;transform:rotate(-8deg) scaleY(.5)} 70%{transform:rotate(1deg) scaleY(1.02)} 100%{opacity:1;transform:rotate(0) scaleY(1)} }
.menu-format-spiral-rotate .dropdown-menu.show,
.menu-format-spiral-rotate .dropdown.show .dropdown-menu { animation: menuA20 .4s ease-out both !important; }

/* 21. Energy Pulse — Pulso onda */
@keyframes menuA21 { 0%{opacity:0;transform:scaleY(.6);box-shadow:0 0 0 0 rgba(102,126,234,.5)} 50%{box-shadow:0 0 0 8px rgba(102,126,234,0)} 100%{opacity:1;transform:scaleY(1)} }
.menu-format-energy-pulse .dropdown-menu.show,
.menu-format-energy-pulse .dropdown.show .dropdown-menu { animation: menuA21 .4s ease-out both !important; }

/* 22. 3D Gradient — Volteo 3D */
@keyframes menuA22 { 0%{opacity:0;transform:perspective(800px) rotateX(-25deg)} 100%{opacity:1;transform:perspective(800px) rotateX(0)} }
.menu-format-3d-gradient .dropdown-menu.show,
.menu-format-3d-gradient .dropdown.show .dropdown-menu { animation: menuA22 .4s ease-out both !important; }

/* 23. Shockwave — Expansión brillo */
@keyframes menuA23 { 0%{opacity:0;transform:scaleY(.4);filter:brightness(1.8)} 60%{filter:brightness(1.2)} 100%{opacity:1;transform:scaleY(1);filter:brightness(1)} }
.menu-format-shockwave .dropdown-menu.show,
.menu-format-shockwave .dropdown.show .dropdown-menu { animation: menuA23 .4s ease-out both !important; }

/* 24. Cosmic Nebula — Zoom inverso */
@keyframes menuA24 { 0%{opacity:0;transform:scale(1.15);filter:blur(5px) saturate(2)} 100%{opacity:1;transform:scale(1);filter:blur(0) saturate(1)} }
.menu-format-cosmic-nebula .dropdown-menu.show,
.menu-format-cosmic-nebula .dropdown.show .dropdown-menu { animation: menuA24 .4s ease-out both !important; }

/* 25. Liquid Flow — Morph líquido */
@keyframes menuA25 { 0%{opacity:0;border-radius:40%;transform:scaleY(.3)} 60%{border-radius:16px;transform:scaleY(1.03)} 100%{opacity:1;border-radius:12px;transform:scaleY(1)} }
.menu-format-liquid-flow .dropdown-menu.show,
.menu-format-liquid-flow .dropdown.show .dropdown-menu { animation: menuA25 .45s ease-out both !important; }

/* 26. Kaleidoscope — Hue spin + escala */
@keyframes menuA26 { 0%{opacity:0;transform:scaleY(.3);filter:hue-rotate(180deg)} 60%{transform:scaleY(1.03)} 100%{opacity:1;transform:scaleY(1);filter:hue-rotate(0)} }
.menu-format-kaleidoscope .dropdown-menu.show,
.menu-format-kaleidoscope .dropdown.show .dropdown-menu { animation: menuA26 .45s ease-out both !important; }

/* 27. Magnetic Resonance — Atracción horizontal */
@keyframes menuA27 { 0%{opacity:0;transform:translateX(-20px) skewX(4deg)} 60%{transform:translateX(3px) skewX(-1deg)} 100%{opacity:1;transform:translateX(0) skewX(0)} }
.menu-format-magnetic-resonance .dropdown-menu.show,
.menu-format-magnetic-resonance .dropdown.show .dropdown-menu { animation: menuA27 .4s ease-out both !important; }

/* 28. Vortex Spiral — Rotación controlada */
@keyframes menuA28 { 0%{opacity:0;transform:rotate(-12deg) scaleY(.4)} 70%{transform:rotate(2deg) scaleY(1.02)} 100%{opacity:1;transform:rotate(0) scaleY(1)} }
.menu-format-vortex-spiral .dropdown-menu.show,
.menu-format-vortex-spiral .dropdown.show .dropdown-menu { animation: menuA28 .45s ease-out both !important; }

/* 29. Fractal Crystal — Clip-path crecimiento */
@keyframes menuA29 { 0%{opacity:0;clip-path:polygon(50% 0, 50% 0, 50% 100%, 50% 100%)} 100%{opacity:1;clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%)} }
.menu-format-fractal-crystal .dropdown-menu.show,
.menu-format-fractal-crystal .dropdown.show .dropdown-menu { animation: menuA29 .4s ease-out both !important; }

/* 30. Quantum Interference — Blur + escala */
@keyframes menuA30 { 0%{opacity:0;transform:scaleY(.2);filter:blur(10px)} 50%{filter:blur(2px)} 100%{opacity:1;transform:scaleY(1);filter:blur(0)} }
.menu-format-quantum-interference .dropdown-menu.show,
.menu-format-quantum-interference .dropdown.show .dropdown-menu { animation: menuA30 .45s ease-out both !important; }

/* 31. Relativistic Tensor — Perspectiva doble eje */
@keyframes menuA31 { 0%{opacity:0;transform:perspective(600px) rotateX(-20deg) rotateY(-8deg)} 100%{opacity:1;transform:perspective(600px) rotateX(0) rotateY(0)} }
.menu-format-relativistic-tensor .dropdown-menu.show,
.menu-format-relativistic-tensor .dropdown.show .dropdown-menu { animation: menuA31 .4s ease-out both !important; }

/* 32. Golden Ratio — Espiral dorada */
@keyframes menuA32 { 0%{opacity:0;transform:translateY(-12px) scaleY(.8)} 60%{transform:translateY(2px) scaleY(1.01)} 100%{opacity:1;transform:translateY(0) scaleY(1)} }
.menu-format-golden-ratio .dropdown-menu.show,
.menu-format-golden-ratio .dropdown.show .dropdown-menu { animation: menuA32 .4s ease-out both !important; }

/* 33. Cyberpunk Glitch — Glitch sutil */
@keyframes menuA33 { 0%{opacity:0;transform:translateX(-3px)} 15%{opacity:1;transform:translateX(3px);clip-path:inset(0 0 50% 0)} 30%{transform:translateX(-2px);clip-path:inset(40% 0 0 0)} 45%{transform:translateX(1px);clip-path:inset(0)} 100%{opacity:1;transform:translateX(0);clip-path:inset(0)} }
.menu-format-cyberpunk-glitch .dropdown-menu.show,
.menu-format-cyberpunk-glitch .dropdown.show .dropdown-menu { animation: menuA33 .4s ease-out both !important; }

/* 34. Bioluminescent Moss — Brillo orgánico */
@keyframes menuA34 { 0%{opacity:0;filter:brightness(0);transform:scaleY(.85)} 40%{filter:brightness(1.8)} 100%{opacity:1;filter:brightness(1);transform:scaleY(1)} }
.menu-format-bioluminescent-moss .dropdown-menu.show,
.menu-format-bioluminescent-moss .dropdown.show .dropdown-menu { animation: menuA34 .4s ease-out both !important; }

/* 35. Magma Flow — Ascenso de magma */
@keyframes menuA35 { 0%{opacity:0;transform:translateY(15px) scaleY(.6);filter:brightness(1.5)} 100%{opacity:1;transform:translateY(0) scaleY(1);filter:brightness(1)} }
.menu-format-magma-flow .dropdown-menu.show,
.menu-format-magma-flow .dropdown.show .dropdown-menu { animation: menuA35 .4s ease-out both !important; transform-origin:bottom center !important; }

/* 36. Crystal Prism — Refracción suave */
@keyframes menuA36 { 0%{opacity:0;transform:perspective(600px) rotateY(-12deg)} 60%{transform:perspective(600px) rotateY(3deg)} 100%{opacity:1;transform:perspective(600px) rotateY(0)} }
.menu-format-crystal-prism .dropdown-menu.show,
.menu-format-crystal-prism .dropdown.show .dropdown-menu { animation: menuA36 .4s ease-out both !important; }

/* 37. Digital Rain — Cascada cortina */
@keyframes menuA37 { 0%{opacity:0;clip-path:inset(0 0 100% 0)} 100%{opacity:1;clip-path:inset(0 0 0 0)} }
.menu-format-digital-rain .dropdown-menu.show,
.menu-format-digital-rain .dropdown.show .dropdown-menu { animation: menuA37 .35s ease-out both !important; }

/* 38. Velvet Night — Desvanecimiento suave */
@keyframes menuA38 { 0%{opacity:0;transform:scaleY(1.06);filter:blur(5px)} 100%{opacity:1;transform:scaleY(1);filter:blur(0)} }
.menu-format-velvet-night .dropdown-menu.show,
.menu-format-velvet-night .dropdown.show .dropdown-menu { animation: menuA38 .4s ease-out both !important; }

/* 39. Aurora Borealis — Onda aurora */
@keyframes menuA39 { 0%{opacity:0;transform:translateY(-10px) scaleX(.7);filter:hue-rotate(-60deg)} 60%{transform:translateY(2px) scaleX(1.02)} 100%{opacity:1;transform:translateY(0) scaleX(1);filter:hue-rotate(0)} }
.menu-format-aurora-borealis .dropdown-menu.show,
.menu-format-aurora-borealis .dropdown.show .dropdown-menu { animation: menuA39 .4s ease-out both !important; }

/* 40. Steampunk Brass — Engranaje */
@keyframes menuA40 { 0%{opacity:0;transform:rotate(-6deg) translateY(-10px)} 60%{transform:rotate(1deg) translateY(2px)} 100%{opacity:1;transform:rotate(0) translateY(0)} }
.menu-format-steampunk-brass .dropdown-menu.show,
.menu-format-steampunk-brass .dropdown.show .dropdown-menu { animation: menuA40 .4s ease-out both !important; }

/* 41. Deep Space — Zoom desde profundidad */
@keyframes menuA41 { 0%{opacity:0;transform:scale(.85);filter:brightness(.3)} 100%{opacity:1;transform:scale(1);filter:brightness(1)} }
.menu-format-deep-space .dropdown-menu.show,
.menu-format-deep-space .dropdown.show .dropdown-menu { animation: menuA41 .4s ease-out both !important; }

/* 42. Candy Gradient — Pop dulce */
@keyframes menuA42 { 0%{opacity:0;transform:scaleY(.5) scaleX(.9)} 60%{transform:scaleY(1.04) scaleX(1.02)} 100%{opacity:1;transform:scale(1)} }
.menu-format-candy-gradient .dropdown-menu.show,
.menu-format-candy-gradient .dropdown.show .dropdown-menu { animation: menuA42 .4s ease-out both !important; }

/* 43. Emerald Matrix — Escaneo terminal */
@keyframes menuA43 { 0%{opacity:0;clip-path:inset(0 0 100% 0)} 100%{opacity:1;clip-path:inset(0)} }
.menu-format-emerald-matrix .dropdown-menu.show,
.menu-format-emerald-matrix .dropdown.show .dropdown-menu { animation: menuA43 .35s ease-out both !important; }

/* 44. Sunset Horizon — Amanecer */
@keyframes menuA44 { 0%{opacity:0;transform:translateY(-12px);filter:brightness(1.5)} 100%{opacity:1;transform:translateY(0);filter:brightness(1)} }
.menu-format-sunset-horizon .dropdown-menu.show,
.menu-format-sunset-horizon .dropdown.show .dropdown-menu { animation: menuA44 .4s ease-out both !important; }

/* 45. Arctic Frost — Cristalización */
@keyframes menuA45 { 0%{opacity:0;filter:blur(15px);transform:scaleY(.9)} 100%{opacity:1;filter:blur(0);transform:scaleY(1)} }
.menu-format-arctic-frost .dropdown-menu.show,
.menu-format-arctic-frost .dropdown.show .dropdown-menu { animation: menuA45 .4s ease-out both !important; }

/* 46. Obsidian — Emerge oscuro */
@keyframes menuA46 { 0%{opacity:0;transform:translateY(-8px);filter:brightness(0)} 50%{filter:brightness(.5)} 100%{opacity:1;transform:translateY(0);filter:brightness(1)} }
.menu-format-obsidian .dropdown-menu.show,
.menu-format-obsidian .dropdown.show .dropdown-menu { animation: menuA46 .4s ease-out both !important; }

/* 47. Rose Gold — Desliz elegante */
@keyframes menuA47 { 0%{opacity:0;transform:translateX(-12px)} 100%{opacity:1;transform:translateX(0)} }
.menu-format-rose-gold .dropdown-menu.show,
.menu-format-rose-gold .dropdown.show .dropdown-menu { animation: menuA47 .35s ease-out both !important; }

/* 48. Blueprint — Dibujo técnico */
@keyframes menuA48 { 0%{opacity:0;clip-path:polygon(0 0,0 0,0 100%,0 100%)} 100%{opacity:1;clip-path:polygon(0 0,100% 0,100% 100%,0 100%)} }
.menu-format-blueprint .dropdown-menu.show,
.menu-format-blueprint .dropdown.show .dropdown-menu { animation: menuA48 .4s ease-out both !important; }

/* 49. Volcanic — Erupción */
@keyframes menuA49 { 0%{opacity:0;transform:translateY(15px) scaleY(.5);filter:brightness(2)} 100%{opacity:1;transform:translateY(0) scaleY(1);filter:brightness(1)} }
.menu-format-volcanic .dropdown-menu.show,
.menu-format-volcanic .dropdown.show .dropdown-menu { animation: menuA49 .4s ease-out both !important; transform-origin:bottom center !important; }

/* 50. Minimal White — Fade limpio */
@keyframes menuA50 { 0%{opacity:0;transform:translateY(-6px)} 100%{opacity:1;transform:translateY(0)} }
.menu-format-minimal-white .dropdown-menu.show,
.menu-format-minimal-white .dropdown.show .dropdown-menu { animation: menuA50 .25s ease-out both !important; }
