/* Performance Optimizations for Faster Loading */

/* Critical CSS optimizations */
html {
    scroll-behavior: smooth;
}

/* Optimize font loading */
@font-face {
    font-display: swap;
}

/* Reduce paint and layout thrashing */
* {
    will-change: auto;
}

/* Optimize animations for performance */
.animate-optimized {
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000;
    perspective: 1000;
}

/* Optimize transitions */
.transition-optimized {
    transition-property: transform, opacity;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

/* Lazy loading optimization */
img[loading="lazy"] {
    opacity: 0;
    transition: opacity 0.3s;
}

img[loading="lazy"].loaded {
    opacity: 1;
}

/* Optimize scroll performance */
.scroll-container {
    -webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
}

/* Reduce repaints */
.gpu-accelerated {
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
}

/* Optimize button interactions */
.btn-optimized {
    transform: translateZ(0);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.btn-optimized:hover {
    transform: translateY(-2px) translateZ(0);
}

.btn-optimized:active {
    transform: translateY(0) translateZ(0);
}

/* Optimize card hover effects */
.card-optimized {
    transform: translateZ(0);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card-optimized:hover {
    transform: translateY(-5px) translateZ(0);
}

/* Optimize loading states */
.skeleton-loader {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: loading 1.5s infinite;
}

@keyframes loading {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

/* Optimize modal animations */
.modal-optimized {
    transform: translateZ(0);
}

.modal-optimized .modal-dialog {
    transform: translate3d(0, -50px, 0);
    transition: transform 0.3s ease;
}

.modal-optimized.show .modal-dialog {
    transform: translate3d(0, 0, 0);
}

/* Optimize dropdown animations */
.dropdown-optimized {
    transform: translateZ(0);
}

.dropdown-menu-optimized {
    transform: translateY(-10px);
    opacity: 0;
    transition: transform 0.2s ease, opacity 0.2s ease;
    pointer-events: none;
}

.dropdown-optimized.show .dropdown-menu-optimized {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
}

/* Optimize form animations */
.form-group-optimized {
    position: relative;
}

.form-control-optimized {
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.form-control-optimized:focus {
    transform: translateZ(0);
}

/* Optimize navigation animations */
.nav-optimized {
    transform: translateZ(0);
}

.nav-link-optimized {
    transition: color 0.2s ease, background-color 0.2s ease;
}

/* Optimize hero section animations */
.hero-optimized {
    transform: translateZ(0);
}

.hero-content-optimized {
    transform: translateY(20px);
    opacity: 0;
    animation: fadeInUp 0.8s ease forwards;
}

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

/* Optimize search animations */
.search-optimized {
    transform: translateZ(0);
}

.search-input-optimized {
    transition: width 0.3s ease, box-shadow 0.3s ease;
}

.search-input-optimized:focus {
    transform: translateZ(0);
}

/* Optimize footer animations */
.footer-optimized {
    transform: translateZ(0);
}

/* Reduce motion for users who prefer it */
@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 high refresh rate displays */
@media (min-resolution: 120dpi) {
    .high-dpi-optimized {
        transform: translateZ(0);
    }
}

/* Critical path CSS for above-the-fold content */
.critical-content {
    contain: layout style paint;
}

/* Optimize background images */
.bg-optimized {
    background-attachment: scroll;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* Optimize table performance */
.table-optimized {
    table-layout: fixed;
}

/* Optimize list performance */
.list-optimized {
    contain: layout;
}

/* Optimize grid performance */
.grid-optimized {
    contain: layout;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
}

/* Optimize flexbox performance */
.flex-optimized {
    contain: layout;
    display: flex;
    flex-wrap: wrap;
}

/* Memory optimization */
.memory-optimized {
    contain: strict;
}