/* Animaciones */

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}


/*  */
@keyframes animatetop {
    from {top: -300px; opacity: 0}
    to {top: 0; opacity: 1}
}


/* Efecto visual cuando cambias la cantidad */
@keyframes pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}



/* CART ANIMATIONS */

@keyframes pulse-complete {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

@keyframes pulse-active {
    0%, 100% { 
        transform: scale(1);
        box-shadow: 0 0 0 8px rgba(0, 123, 255, 0.15);
    }
    50% { 
        transform: scale(1.15);
        box-shadow: 0 0 0 12px rgba(0, 123, 255, 0.25);
    }
}


@keyframes cartFadeIn {
    from {
        opacity: 0;
        transform: scale(0.8);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}



@keyframes cartBounce {
    0%, 100% { transform: scale(1); }
    25% { transform: scale(1.2); }
    50% { transform: scale(0.95); }
    75% { transform: scale(1.05); }
}


@keyframes cartPulse {
    0%, 100% { 
        box-shadow: 0 2px 8px rgba(255, 71, 87, 0.4);
    }
    50% { 
        box-shadow: 0 2px 16px rgba(255, 71, 87, 0.8);
    }
}


/* Animación de Entrada del Modal */
@keyframes modalSlideIn {
    from {
        opacity: 0;
        transform: translateY(-30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}