/**
 * 性能优化样式
 * 
 * 减轻模糊效果开销，提升移动端性能
 */

/* 基础设置 - 所有设备 */
:root {
    --backdrop-filter-strength: blur(15px);
    --backdrop-opacity: 0.95;
    --animation-enabled: 1;
}

/* 移动端性能优化 */
@media (max-width: 768px) {
    :root {
        --backdrop-filter-strength: blur(8px); /* 降低模糊强度 */
        --backdrop-opacity: 0.97; /* 提高不透明度减少模糊需求 */
    }
    
    /* 减少模糊区域 - 只在关键UI元素上保留 */
    .card:not(.important-card),
    .feature-card:not(.important-feature),
    .text-with-bg:not(.important-text) {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background-color: rgba(255, 255, 255, 0.97) !important;
    }
    
    [data-theme="dark"] .card:not(.important-card),
    [data-theme="dark"] .feature-card:not(.important-feature),
    [data-theme="dark"] .text-with-bg:not(.important-text) {
        background-color: rgba(33, 33, 33, 0.97) !important;
    }
    
    /* 保留在关键元素上的模糊效果 */
    header,
    .nav-links.active,
    .important-card,
    .important-feature,
    .important-text {
        backdrop-filter: var(--backdrop-filter-strength);
        -webkit-backdrop-filter: var(--backdrop-filter-strength);
    }
    
    /* 优化动画性能 */
    .particle {
        display: none; /* 移动端完全禁用粒子效果 */
    }
    
    /* 减少动画数量 */
    .reveal-scale,
    .reveal-left,
    .reveal-right {
        /* 使用更简单的动画 */
        transform: translateY(20px);
        transition: opacity 0.5s ease, transform 0.5s ease;
    }
    
    .reveal-scale.show,
    .reveal-left.show,
    .reveal-right.show {
        transform: translateY(0);
    }
    
    /* 减少阴影复杂度 */
    .card,
    .feature-card,
    .btn {
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1) !important;
    }
}

/* 低端设备更激进的优化 */
@media (max-width: 480px) {
    :root {
        --backdrop-filter-strength: blur(5px); /* 进一步降低模糊强度 */
        --backdrop-opacity: 0.98; /* 进一步提高不透明度 */
    }
    
    /* 完全禁用大多数模糊效果 */
    .card,
    .feature-card,
    .text-with-bg {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background-color: rgba(255, 255, 255, 0.98) !important;
    }
    
    [data-theme="dark"] .card,
    [data-theme="dark"] .feature-card,
    [data-theme="dark"] .text-with-bg {
        background-color: rgba(33, 33, 33, 0.98) !important;
    }
    
    /* 只在导航栏保留模糊效果 */
    header {
        backdrop-filter: var(--backdrop-filter-strength);
        -webkit-backdrop-filter: var(--backdrop-filter-strength);
    }
    
    /* 简化动画 */
    .reveal, 
    .reveal-scale,
    .reveal-left,
    .reveal-right {
        transition: opacity 0.3s ease;
        transform: none;
    }
}

/* 用户偏好减少动画 */
@media (prefers-reduced-motion: reduce) {
    :root {
        --animation-enabled: 0;
    }
    
    /* 禁用所有非必要动画 */
    .reveal, 
    .reveal-scale,
    .reveal-left,
    .reveal-right {
        transition: opacity 0.2s ease-out !important;
        transform: none !important;
        animation: none !important;
    }
    
    /* 禁用背景动画 */
    .animated-bg,
    .particle-container,
    .wave-animation {
        display: none !important;
    }
    
    /* 禁用滚动动画 */
    html {
        scroll-behavior: auto !important;
    }
}