/* =============================================================================
   base/animations.css
   All @keyframe definitions in one place.
   Reference these in your components; never redeclare them locally.
   ============================================================================= */

@keyframes fadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

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

@keyframes scaleIn {
    0%   { transform: scale(0);   opacity: 0; }
    70%  { transform: scale(1.2); opacity: 0.7; }
    100% { transform: scale(1);   opacity: 1; }
}

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

@keyframes dotPulse {
    0%, 80%, 100% {
        opacity: 0;
        transform: scale(0.85);
    }
    40% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes paginationSlideIn {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}