/**
 * Performance Optimization Styles
 * Additional CSS optimizations for better performance
 */

/* Hardware acceleration for video */
.video-container video {
    transform: translateZ(0);
    backface-visibility: hidden;
    perspective: 1000;
    will-change: transform, opacity;
}

/* Optimize animations */
@media (prefers-reduced-motion: no-preference) {
    .fadeIn {
        animation: fadeIn 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    }
    
    .animated {
        animation-duration: 0.6s;
        animation-fill-mode: both;
    }
}

/* Reduce animations for low power devices */
@media (max-width: 768px) {
    .fadeIn {
        animation-duration: 0.3s;
    }
    
    .hero-title,
    .hero-subtitle {
        animation-duration: 0.4s;
    }
}

/* Optimize image rendering */
img {
    content-visibility: auto;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}

/* Optimize font loading */
@font-face {
    font-family: 'PerformanceFont';
    font-display: swap;
    src: local('Arial'), local('Helvetica');
}

/* Reduce paint operations */
.video-hero-section {
    contain: layout paint style;
}

/* Optimize scrolling performance */
.page-content {
    contain: content;
}

/* Reduce layout thrashing */
.hero-content {
    will-change: transform;
}

/* Optimize for mobile devices */
@media (max-width: 480px) {
    /* Reduce video quality on mobile */
    .video-container video {
        filter: brightness(0.5) contrast(1.2);
    }
    
    /* Simplify gradients */
    .video-overlay {
        background: linear-gradient(to bottom, rgba(0,0,0,0.4), rgba(0,0,0,0.8));
    }
}

/* Battery saver mode */
@media (prefers-reduced-data: reduce) {
    /* Use simpler animations */
    .fadeIn {
        animation: none;
        opacity: 1;
    }
    
    /* Reduce shadow effects */
    .hero-title,
    .hero-subtitle {
        text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
    }
    
    /* Simplify video overlay */
    .video-overlay {
        background: rgba(0, 0, 0, 0.6);
    }
}

/* Print optimizations */
@media print {
    * {
        animation: none !important;
        transition: none !important;
    }
    
    .video-hero-section {
        height: 200px;
        background: linear-gradient(135deg, #2c3e50 0%, #3498db 100%);
    }
    
    .hero-content {
        color: #333;
        text-shadow: none;
    }
}

/* Loading state optimizations */
.video-loading-indicator {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 5;
    background: rgba(0, 0, 0, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
}

.video-loading-indicator .spinner-border {
    width: 2rem;
    height: 2rem;
}

/* Performance monitoring indicator (debug only) */
.performance-indicator {
    position: fixed;
    bottom: 10px;
    right: 10px;
    background: rgba(0, 0, 0, 0.7);
    color: white;
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 0.8rem;
    z-index: 1000;
    display: none; /* Hidden by default, enable for debugging */
}

/* GPU optimization */
.gpu-accelerated {
    transform: translate3d(0, 0, 0);
}

/* Memory optimization for large pages */
.projects-list-section,
.insights-dashboard {
    content-visibility: auto;
    contain-intrinsic-size: 500px;
}

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}