/**
 * MYP Platform - Optimierte einfache Animationen
 * Reduzierte, performante Animationen für bessere User Experience
 */

/* ===== EINFACHE FADE-IN ANIMATION ===== */
@keyframes fade-in {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.animate-fade-in {
    animation: fade-in 0.2s ease-out;
}

/* ===== EINFACHE SLIDE-UP ANIMATION ===== */
@keyframes slide-up {
    from {
        opacity: 0;
        transform: translateY(15px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-slide-up {
    animation: slide-up 0.3s ease-out;
}

.animate-slide-up-delay {
    animation: slide-up 0.3s ease-out;
    animation-delay: 0.1s;
    animation-fill-mode: both;
}

.animate-slide-up-delay-2 {
    animation: slide-up 0.3s ease-out;
    animation-delay: 0.2s;
    animation-fill-mode: both;
}

/* ===== EINFACHER HOVER-EFFEKT ===== */
.animate-hover-lift {
    transition: transform 0.2s ease;
}

.animate-hover-lift:hover {
    transform: translateY(-2px);
}

/* ===== EINFACHE SUCCESS ANIMATION ===== */
@keyframes simple-success {
    0% {
        opacity: 0;
        transform: scale(0.9);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

.animate-success {
    animation: simple-success 0.3s ease-out;
}

/* ===== EINFACHER PULSE FÜR LOADING ===== */
@keyframes simple-pulse {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.6;
    }
}

.animate-pulse-simple {
    animation: simple-pulse 2s infinite ease-in-out;
}

/* ===== EINFACHER PROGRESS BAR ===== */
.progress-fill {
    transition: width 1s ease-out;
}

/* ===== PERFORMANCE OPTIMIERUNGEN ===== */
.animate-fade-in,
.animate-slide-up,
.animate-slide-up-delay,
.animate-slide-up-delay-2 {
    will-change: transform, opacity;
}

.animate-hover-lift {
    will-change: transform;
}

/* ===== UTILITY CLASSES ===== */
.animate-smooth {
    transition: all 0.2s ease;
}

.animate-smooth-fast {
    transition: all 0.1s ease;
}

/* ===== RESPONSIVE ANPASSUNGEN ===== */
@media (max-width: 768px) {
    .animate-fade-in,
    .animate-slide-up,
    .animate-slide-up-delay,
    .animate-slide-up-delay-2 {
        animation-duration: 0.2s;
    }
}

/* ===== REDUZIERTE BEWEGUNG UNTERSTÜTZUNG ===== */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    
    .animate-hover-lift:hover {
        transform: none;
    }
}