/**
 * Floating Icons Pro - Animaciones
 * Contiene: Todas las animaciones y keyframes del plugin
 */

/* ===================================
   Animaciones de Iconos
   =================================== */
/* Pulse */
.fip-animation-pulse {
    animation: fip-pulse 2s infinite;
}

@keyframes fip-pulse {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.7);
    }
    50% {
        transform: scale(1.05);
    }
    70% {
        box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
    }
    100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    }
}

/* Bounce */
.fip-animation-bounce {
    animation: fip-bounce 2s infinite;
}

@keyframes fip-bounce {
    0%, 20%, 50%, 80%, 100% { 
        transform: translateY(0); 
    }
    40% { 
        transform: translateY(-20px); 
    }
    60% { 
        transform: translateY(-10px); 
    }
}

/* Shake */
.fip-animation-shake {
    animation: fip-shake 3s infinite;
}

@keyframes fip-shake {
    0%, 100% { 
        transform: translateX(0); 
    }
    10%, 30%, 50%, 70%, 90% { 
        transform: translateX(-5px); 
    }
    20%, 40%, 60%, 80% { 
        transform: translateX(5px); 
    }
}

/* Rotate */
.fip-animation-rotate {
    animation: fip-rotate 3s linear infinite;
}

@keyframes fip-rotate {
    from { 
        transform: rotate(0deg); 
    }
    to { 
        transform: rotate(360deg); 
    }
}

/* Zoom */
.fip-animation-zoom {
    animation: fip-zoom 2s ease-in-out infinite;
}

@keyframes fip-zoom {
    0%, 100% { 
        transform: scale(1); 
    }
    50% { 
        transform: scale(1.2); 
    }
}

/* Swing */
.fip-animation-swing {
    animation: fip-swing 2s ease-in-out infinite;
    transform-origin: top center;
}

@keyframes fip-swing {
    0%, 100% { 
        transform: rotate(0deg); 
    }
    20% { 
        transform: rotate(15deg); 
    }
    40% { 
        transform: rotate(-10deg); 
    }
    60% { 
        transform: rotate(5deg); 
    }
    80% { 
        transform: rotate(-5deg); 
    }
}

/* Tada */
.fip-animation-tada {
    animation: fip-tada 3s infinite;
}

@keyframes fip-tada {
    0% { 
        transform: scale(1) rotate(0deg); 
    }
    10%, 20% { 
        transform: scale(0.9) rotate(-3deg); 
    }
    30%, 50%, 70%, 90% { 
        transform: scale(1.1) rotate(3deg); 
    }
    40%, 60%, 80% { 
        transform: scale(1.1) rotate(-3deg); 
    }
    100% { 
        transform: scale(1) rotate(0deg); 
    }
}

/* Heartbeat */
.fip-animation-heartbeat {
    animation: fip-heartbeat 1.5s ease-in-out infinite;
}

@keyframes fip-heartbeat {
    0% { 
        transform: scale(1); 
    }
    14% { 
        transform: scale(1.15); 
    }
    28% { 
        transform: scale(1); 
    }
    42% { 
        transform: scale(1.15); 
    }
    70% { 
        transform: scale(1); 
    }
}

/* ===================================
   Animaciones de Transición
   =================================== */
/* Fade In */
@keyframes fip-fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Fade Out */
@keyframes fip-fadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

/* Slide In Left */
@keyframes fip-slideInLeft {
    from {
        transform: translateX(-100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* Slide In Right */
@keyframes fip-slideInRight {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* Scale In */
@keyframes fip-scaleIn {
    from {
        transform: scale(0);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

/* Scale Out */
@keyframes fip-scaleOut {
    from {
        transform: scale(1);
        opacity: 1;
    }
    to {
        transform: scale(0);
        opacity: 0;
    }
}

/* ===================================
   Clases de utilidad para animaciones
   =================================== */
.fip-animated {
    animation-duration: 1s;
    animation-fill-mode: both;
}

.fip-animated.fip-infinite {
    animation-iteration-count: infinite;
}

.fip-animated.fip-delay-1s {
    animation-delay: 1s;
}

.fip-animated.fip-delay-2s {
    animation-delay: 2s;
}

.fip-animated.fip-fast {
    animation-duration: 0.5s;
}

.fip-animated.fip-slow {
    animation-duration: 2s;
}

/* ===================================
   Pausar animaciones en hover
   =================================== */
.fip-animation-pause-hover:hover {
    animation-play-state: paused;
}

/* ===================================
   Animaciones reducidas
   =================================== */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}