/* Performance Optimizations and Fallbacks */

/* GPU Acceleration for key elements */
#pay-now-btn,
.countdown-item,
.particle,
.hover-lift {
    will-change: transform, opacity;
    transform: translateZ(0);
    backface-visibility: hidden;
}

/* Reduce animations on slower devices */
@media (max-width: 768px) {
    .particle {
        display: none; /* Hide particles on mobile */
    }
    
    .animate-gradient-shift {
        animation-duration: 8s; /* Slower animations */
    }
    
    .animate-text-shimmer {
        animation: none; /* Disable complex text effects on mobile */
        background: linear-gradient(45deg, #FF0050, #00F2EA);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }
}

/* Prefers reduced motion */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    
    .particle {
        display: none;
    }
    
    .floating-particles {
        display: none;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .bg-gradient-to-r,
    .bg-gradient-to-br {
        background: #000;
        border: 2px solid #fff;
    }
    
    .text-transparent {
        color: #fff !important;
        background: none !important;
        -webkit-text-fill-color: #fff !important;
    }
}

/* Battery optimization */
@media (prefers-reduced-motion: no-preference) {
    .animate-gradient-shift {
        animation-play-state: running;
    }
}

/* CPU-intensive animation controls */
.performance-mode .animate-text-shimmer,
.performance-mode .animate-gradient-shift,
.performance-mode .particle {
    animation: none !important;
}

/* Focus management */
.hover-lift:focus {
    outline: 2px solid #00F2EA;
    outline-offset: 2px;
}

/* Print styles */
@media print {
    .floating-particles,
    .particle {
        display: none;
    }
    
    * {
        animation: none !important;
        transition: none !important;
    }
}