/* ============================================================
   CRM Meta Leads V2 — Animations
   Animaciones de entrada y utilidades de movimiento.
   Aplicación: añadir clase .anim-* a cualquier elemento.
   El stagger se aplica automáticamente a hijos de .anim-stagger.
   ============================================================ */

/* ---- Entradas ---- */

.anim-fade-up {
    animation: fade-up 480ms cubic-bezier(.22, .9, .35, 1) both;
}

.anim-fade-in {
    animation: fade-in 420ms ease both;
}

.anim-scale-in {
    animation: scale-in 380ms cubic-bezier(.34, 1.56, .64, 1) both;
}

.anim-slide-right {
    animation: slide-right 420ms cubic-bezier(.22, .9, .35, 1) both;
}

@keyframes fade-up {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes fade-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes scale-in {
    from { opacity: 0; transform: scale(.94); }
    to   { opacity: 1; transform: scale(1); }
}

@keyframes slide-right {
    from { opacity: 0; transform: translateX(-16px); }
    to   { opacity: 1; transform: translateX(0); }
}

/* ---- Stagger automático: hijos directos entran en cascada ---- */

.anim-stagger > * {
    animation: fade-up 480ms cubic-bezier(.22, .9, .35, 1) both;
}

.anim-stagger > *:nth-child(1)  { animation-delay: 40ms; }
.anim-stagger > *:nth-child(2)  { animation-delay: 90ms; }
.anim-stagger > *:nth-child(3)  { animation-delay: 140ms; }
.anim-stagger > *:nth-child(4)  { animation-delay: 190ms; }
.anim-stagger > *:nth-child(5)  { animation-delay: 240ms; }
.anim-stagger > *:nth-child(6)  { animation-delay: 290ms; }
.anim-stagger > *:nth-child(7)  { animation-delay: 340ms; }
.anim-stagger > *:nth-child(8)  { animation-delay: 390ms; }
.anim-stagger > *:nth-child(9)  { animation-delay: 440ms; }
.anim-stagger > *:nth-child(10) { animation-delay: 490ms; }
.anim-stagger > *:nth-child(n+11) { animation-delay: 530ms; }

/* Filas de tabla en cascada (más rápido, hasta 15 filas) */
.anim-rows tbody tr {
    animation: fade-up 360ms ease both;
}

.anim-rows tbody tr:nth-child(1)  { animation-delay: 30ms; }
.anim-rows tbody tr:nth-child(2)  { animation-delay: 60ms; }
.anim-rows tbody tr:nth-child(3)  { animation-delay: 90ms; }
.anim-rows tbody tr:nth-child(4)  { animation-delay: 120ms; }
.anim-rows tbody tr:nth-child(5)  { animation-delay: 150ms; }
.anim-rows tbody tr:nth-child(6)  { animation-delay: 180ms; }
.anim-rows tbody tr:nth-child(7)  { animation-delay: 210ms; }
.anim-rows tbody tr:nth-child(8)  { animation-delay: 240ms; }
.anim-rows tbody tr:nth-child(9)  { animation-delay: 270ms; }
.anim-rows tbody tr:nth-child(10) { animation-delay: 300ms; }
.anim-rows tbody tr:nth-child(11) { animation-delay: 330ms; }
.anim-rows tbody tr:nth-child(12) { animation-delay: 360ms; }
.anim-rows tbody tr:nth-child(13) { animation-delay: 390ms; }
.anim-rows tbody tr:nth-child(14) { animation-delay: 420ms; }
.anim-rows tbody tr:nth-child(n+15) { animation-delay: 450ms; }

/* ---- Microinteracciones ---- */

.hover-lift {
    transition: transform var(--transition-slow), box-shadow var(--transition-slow);
}

.hover-lift:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-lg);
}

.hover-grow {
    transition: transform var(--transition);
}

.hover-grow:hover {
    transform: scale(1.04);
}

/* Pulso de atención (alertas, badges urgentes) */
.pulse-attention {
    animation: pulse-attention 2s ease-in-out infinite;
}

@keyframes pulse-attention {
    0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, .45); }
    50%      { box-shadow: 0 0 0 8px rgba(239, 68, 68, 0); }
}

/* Spinner inline */
.spin {
    animation: spin 900ms linear infinite;
    display: inline-block;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* ---- Accesibilidad: respetar reduced motion ---- */

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}