/**
 * CSS Animations & Keyframes
 * Centralized animation definitions for use across all components
 */

@keyframes spinPulse {
    0% {
        transform: rotate(0deg) scale(1);
    }
    50% {
        transform: rotate(180deg) scale(1.1);
    }
    100% {
        transform: rotate(360deg) scale(1);
    }
}

@keyframes successSettle {
    0% {
        transform: scale(0.85);
        opacity: 0;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

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

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

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

@keyframes shake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-5px); }
    75% { transform: translateX(5px); }
}

@keyframes btnPulse {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(0.95);
    }
}

@keyframes cellFadeIn {
    from {
        opacity: 0;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes badgePop {
    0% {
        transform: scale(0);
        opacity: 0;
    }
    60% {
        transform: scale(1.2);
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

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

@keyframes dropdownFadeIn {
    from {
        opacity: 0;
        transform: translateY(-6px) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes badgePulse {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.4);
    }
    50% {
        box-shadow: 0 0 0 8px rgba(220, 53, 69, 0);
    }
}

@keyframes checkBounce {
    0% {
        transform: scale(0) rotate(-180deg);
    }
    60% {
        transform: scale(1.2) rotate(10deg);
    }
    100% {
        transform: scale(1) rotate(0deg);
    }
}

@keyframes floatAnimation {
    0%, 100% {
        transform: translateY(0) rotate(0deg);
    }
    50% {
        transform: translateY(-20px) rotate(2deg);
    }
}

@keyframes successFadeIn {
    from {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

/* ========================================
   Animate.css compatibility shim
   Replaces the animate.css CDN dependency.
   Only the classes actually used in templates are included.
   ======================================== */

.animate__animated {
    animation-duration: 0.8s;
    animation-fill-mode: both;
}

@media (prefers-reduced-motion: reduce) {
    .animate__animated {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
}

.animate__fadeIn {
    animation-name: fadeIn;
}

@keyframes pulse-border {
    0%   { box-shadow: 0 0 0 0 rgba(var(--pulse-rgb), 0.6); }
    70%  { box-shadow: 0 0 0 10px rgba(var(--pulse-rgb), 0); }
    100% { box-shadow: 0 0 0 0 rgba(var(--pulse-rgb), 0); }
}

.pulse-border {
    animation: pulse-border 2s ease-out infinite;
    border: 2px solid rgba(var(--pulse-rgb), 0.8) !important;
}

.pulse-primary   { --pulse-rgb: var(--bs-primary-rgb); }
.pulse-secondary { --pulse-rgb: var(--bs-secondary-rgb); }
.pulse-success   { --pulse-rgb: var(--bs-success-rgb); }
.pulse-danger    { --pulse-rgb: var(--bs-danger-rgb); }
.pulse-warning   { --pulse-rgb: var(--bs-warning-rgb); }
.pulse-info      { --pulse-rgb: var(--bs-info-rgb); }

.pulse-border:nth-child(1) { animation-delay: 0s; }
.pulse-border:nth-child(2) { animation-delay: 0.3s; }
.pulse-border:nth-child(3) { animation-delay: 0.6s; }
.pulse-border:nth-child(4) { animation-delay: 0.9s; }