/* ============================================
   HDR Enhanced Visual Effects
   HDR 增强显示效果：P3 广色域 + HDR 高动态范围
   增强发光、色彩饱和度、阴影深度
   包含低性能降级和无障碍覆盖
   设计参考: design-specs/01-color-system.md 1.8 P3广色域支持
   ============================================ */

/* P3 广色域设备 — 增强发光和色彩饱和度 */
[data-hdr="true"] {
  /* 增强发光效果 */
  .avatar-planet--cyan {
    box-shadow: 0 0 18px var(--tf-color-accent), 0 0 40px var(--tf-accent-50);
  }

  .avatar-planet--purple {
    box-shadow: 0 0 16px var(--tf-color-secondary), 0 0 36px var(--tf-secondary-50);
  }

  .avatar-planet--pink {
    box-shadow: 0 0 22px var(--tf-color-gradient-1), 0 0 44px var(--tf-gradient1-50);
  }

  /* 增强按钮发光 */
  .btn-primary:hover {
    box-shadow: 0 8px 40px var(--tf-accent-25), 0 0 30px var(--tf-accent-15);
  }

  .btn-outline:hover {
    box-shadow: 0 0 25px var(--tf-accent-30);
  }

  /* 增强卡片悬停效果 */
  .capability-card:hover .capability-icon {
    box-shadow: 0 0 25px var(--tf-accent-40);
  }

  .project-card:hover {
    filter: drop-shadow(0 20px 50px var(--tf-accent-22)) drop-shadow(0 0 45px var(--tf-accent-15));
  }

  .blog-card:hover {
    filter: drop-shadow(0 20px 50px var(--tf-accent-20)) drop-shadow(0 0 40px var(--tf-accent-12));
  }

  /* 增强分段标题装饰线发光 */
  .section-title::after {
    box-shadow: 0 0 15px var(--tf-accent-40), 0 0 30px var(--tf-accent-20);
  }

  /* 增强时间线节点发光 */
  .timeline-item::before {
    box-shadow: 0 0 20px var(--tf-accent-50), 0 0 40px var(--tf-accent-25);
  }

  /* 增强标签悬停发光 */
  .tag:hover {
    box-shadow: 0 0 15px var(--tf-accent-30);
  }

  .skill-tag:hover {
    box-shadow: 0 0 20px var(--tf-accent-40);
  }

  /* 增强图标按钮悬停发光 */
  .icon-btn:hover {
    box-shadow: 0 0 20px var(--tf-accent-40);
  }

  /* 增强社交链接悬停 */
  .social-link:hover {
    text-shadow: 0 0 20px var(--tf-accent-50), 0 0 40px var(--tf-accent-25);
  }

  /* 增强联系卡片悬停 */
  .contact-card:hover {
    filter: drop-shadow(0 0 30px var(--tf-accent-20));
  }

  /* 增强导航栏激活态 */
  .nav-link.active {
    text-shadow: 0 0 12px var(--tf-accent-30);
  }

  /* 增强返回顶部按钮 */
  .back-to-top:hover {
    box-shadow: 0 0 20px var(--tf-accent-50), 0 4px 20px var(--tf-accent-25);
  }

  /* 增强导航栏 Logo 发光 */
  .logo-symbol {
    box-shadow: 0 0 14px var(--tf-accent-50);
  }

  .logo:hover .logo-symbol {
    box-shadow: 0 0 22px var(--tf-accent-40), 0 0 35px var(--tf-accent-20);
  }

  /* 增强导航链接 */
  .nav-link:hover {
    text-shadow: 0 0 10px var(--tf-accent-30);
  }

  /* 增强筛选/排序标签激活态 */
  .filter-tag.active,
  .sort-tag.active {
    box-shadow: 0 0 18px var(--tf-accent-40), 0 0 30px var(--tf-accent-15);
  }

  .filter-tag:hover,
  .sort-tag:hover {
    box-shadow: 0 0 15px var(--tf-accent-30);
  }

  /* 增强面包屑链接 */
  .breadcrumb a:hover {
    text-shadow: 0 0 10px var(--tf-accent-30);
  }

  /* 增强代码块复制按钮 */
  [data-copy-btn]:hover {
    box-shadow: 0 0 14px var(--tf-accent-40);
  }

  /* 增强详情页操作按钮 */
  .action-btn:hover {
    box-shadow: 0 0 14px var(--tf-accent-30);
  }

  /* 增强搜索按钮和主题切换按钮 */
  .search-btn:hover,
  .theme-toggle:hover {
    box-shadow: 0 0 14px var(--tf-accent-30);
  }

  /* 增强加载更多按钮 */
  .load-more-btn:hover:not(:disabled) {
    box-shadow: 0 0 22px var(--tf-accent-35), 0 4px 20px var(--tf-accent-15);
  }

  /* 增强 Toast 通知 */
  .toast {
    box-shadow: 0 0 20px var(--tf-accent-20), 0 4px 30px var(--tf-accent-10);
  }
}

/* HDR 高动态范围设备 — 进一步增强亮度和对比度 */
@media (dynamic-range: high) {
  /* 全局增强 — P3色域内使用更亮的色值 */
  [data-hdr="true"] {
    /* 增强头像光环 */
    .avatar-ring {
      box-shadow:
        0 0 30px var(--tf-accent-30),
        0 0 60px var(--tf-accent-15),
        inset 0 0 50px var(--tf-accent-10);
    }

    /* 增强头像光晕 */
    .avatar-glow {
      opacity: 0.8;
    }

    /* HDR下增强Hero标题 — 使用 text-shadow 替代 brightness filter，性能更优 */
    .hero-title {
      text-shadow: 0 0 30px var(--tf-accent-30), 0 0 60px var(--tf-accent-10);
    }

    /* HDR下增强页面标题 — 文字发光而非暴力提亮 */
    .page-title {
      text-shadow: 0 0 25px var(--tf-accent-25), 0 0 50px var(--tf-accent-08);
    }

    /* HDR下增强分割线标题 — 仅增强发光 */
    .section-title::after {
      box-shadow: 0 0 25px var(--tf-accent-50), 0 0 50px var(--tf-accent-20);
    }

    /* 增强主按钮HDR效果 */
    .btn-primary {
      filter: brightness(1.05);
    }

    .btn-primary:hover {
      filter: brightness(1.12);
    }

    /* 增强项目卡片悬停叠加层 */
    .project-card:hover::before {
      opacity: 0.25;
    }

    /* 增强浮动粒子 */
    .floating-particle {
      box-shadow: 0 0 15px var(--tf-color-accent), 0 0 30px var(--tf-accent-40);
    }

    /* 404装饰增强 */
    .error-code {
      text-shadow: 0 0 40px var(--tf-accent-40), 0 0 80px var(--tf-accent-20);
    }

    /* 轮廓按钮HDR增强 */
    .btn-outline:hover {
      filter: brightness(1.1);
    }

    /* HDR下增强导航栏 Logo */
    .logo-symbol {
      box-shadow: 0 0 20px var(--tf-accent-50), 0 0 35px var(--tf-accent-20);
    }

    /* HDR下增强筛选/排序标签 */
    .filter-tag.active,
    .sort-tag.active {
      box-shadow: 0 0 25px var(--tf-accent-50), 0 0 40px var(--tf-accent-20);
    }

    /* HDR下增强卡片顶部渐变线 */
    .blog-card::before,
    .project-card::before {
      opacity: 0.15;
    }
  }
}

/* 低性能设备 HDR 降级 — 减少发光计算 */
[data-animation-tier="low"][data-hdr="true"] {
  .avatar-ring,
  .avatar-planet--cyan,
  .avatar-planet--purple,
  .avatar-planet--pink {
    box-shadow: none;
  }

  .project-card:hover,
  .blog-card:hover {
    filter: drop-shadow(0 10px 20px var(--tf-accent-10));
  }

  .hero-title,
  .page-title {
    text-shadow: none;
  }

  .section-title::after,
  .btn-primary,
  .btn-primary:hover,
  .btn-outline:hover {
    filter: none;
  }
}

/* 减少动画偏好时禁用HDR增强 — 避免视觉干扰 */
@media (prefers-reduced-motion: reduce) {
  [data-hdr="true"] {
    .btn-primary:hover,
    .btn-outline:hover {
      filter: none;
    }

    .hero-title,
    .page-title {
      text-shadow: none;
    }

    .filter-tag.active,
    .sort-tag.active,
    .logo-symbol {
      box-shadow: none;
    }
  }
}