/* ==============================================
   HEADER ANIMATION LIBRARY
   Compatible: Bootstrap 5 + C#5 MVC
   ============================================== */

/* ===== Base Animation Setup ===== */
.animate {
    animation-duration: 1s;
    animation-fill-mode: both;
}

/* ===== NONE ===== */
.none {
    animation: none !important;
}

/* ===== FADE ===== */
.fade-in {
    animation-name: fadeIn;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* ===== SLIDE DOWN ===== */
.slide-down {
    animation-name: slideDown;
}

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

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* ===== ZOOM IN ===== */
.zoom-in {
    animation-name: zoomIn;
}

@keyframes zoomIn {
    from {
        transform: scale(0.8);
        opacity: 0;
    }

    to {
        transform: scale(1);
        opacity: 1;
    }
}

/* ===== BOUNCE ===== */
.bounce {
    animation-name: bounce;
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }

    40% {
        transform: translateY(-20px);
    }

    60% {
        transform: translateY(-10px);
    }
}

/* ===== ROTATE ===== */
.rotate {
    animation-name: rotateIn;
}

@keyframes rotateIn {
    from {
        transform: rotate(-200deg);
        opacity: 0;
    }

    to {
        transform: rotate(0);
        opacity: 1;
    }
}

/* ===== PULSE ===== */
.pulse {
    animation-name: pulse;
}

@keyframes pulse {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.05);
    }

    100% {
        transform: scale(1);
    }
}