/* Performance Optimizations for Older Devices */

/* Reduce animation complexity */
@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;
    }
}

/* Optimize for low-end devices */
@media (max-width: 768px), (max-height: 600px) {
    /* Reduce complex effects */
    .glass-effect, .blur-effect, .backdrop-blur {
        backdrop-filter: none !important;
        filter: none !important;
    }
    
    /* Simplify gradients */
    .gradient-bg {
        background: linear-gradient(45deg, #667eea, #764ba2) !important;
    }
    
    /* Reduce box shadows */
    .card, .button, .nav-btn {
        box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
    }
    
    /* Optimize images */
    img {
        image-rendering: optimizeSpeed;
        image-rendering: -moz-crisp-edges;
        image-rendering: -webkit-optimize-contrast;
        image-rendering: optimize-contrast;
    }
    
    /* Reduce font complexity */
    body {
        font-weight: 400 !important;
        text-shadow: none !important;
    }
    
    /* Simplify hover effects */
    .nav-btn:hover, .button:hover {
        transform: none !important;
        filter: none !important;
    }
}

/* Memory optimization */
.parallax, .floating, .pulse, .bounce {
    animation: none !important;
}

/* Reduce canvas operations */
canvas {
    image-rendering: pixelated;
    image-rendering: -moz-crisp-edges;
    image-rendering: crisp-edges;
}

/* Optimize store specifically */
.store-item {
    transition: none !important;
}

.store-ad {
    image-rendering: optimizeSpeed;
}

/* Reduce VHS effect complexity */
.vhs-overlay {
    opacity: 0.3 !important;
    animation: none !important;
}

/* Optimize background effects */
.background-clouds {
    animation-duration: 20s !important;
}

/* Reduce notification complexity */
.notification {
    animation-duration: 0.2s !important;
    backdrop-filter: none !important;
}

/* Optimize profile images */
.profile-image, .avatar {
    image-rendering: optimizeSpeed;
}

/* Reduce project card effects */
.project-card {
    transition: none !important;
    transform: none !important;
}

/* Optimize sidebar */
.sidebar {
    backdrop-filter: none !important;
}

/* Reduce mobile toolbar effects */
.mobile-toolbar {
    backdrop-filter: none !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
}

/* Optimize loading states */
.loading, .spinner {
    animation-duration: 0.5s !important;
}

/* Reduce form complexity */
input, textarea, select {
    transition: none !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.1) !important;
}

/* Optimize modal effects */
.modal, .popup {
    backdrop-filter: none !important;
    animation-duration: 0.2s !important;
}

/* Reduce tooltip complexity */
.tooltip {
    backdrop-filter: none !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
}

/* Optimize achievement effects */
.achievement {
    animation-duration: 0.3s !important;
    backdrop-filter: none !important;
}

/* Reduce inventory effects */
.inventory-item {
    transition: none !important;
}

/* Optimize analytics charts */
.chart-container {
    image-rendering: optimizeSpeed;
}

/* Reduce theme effects */
.theme-preview {
    transition: none !important;
    transform: none !important;
}

/* Optimize for very old devices */
@media (max-width: 480px) {
    /* Disable all animations */
    * {
        animation: none !important;
        transition: none !important;
    }
    
    /* Simplify all effects */
    .glass-effect, .blur-effect, .gradient-bg {
        background: #f0f0f0 !important;
    }
    
    /* Reduce shadows */
    * {
        box-shadow: none !important;
        text-shadow: none !important;
    }
    
    /* Optimize images */
    img {
        max-width: 100% !important;
        height: auto !important;
    }
}
