/**
 * 首涂46 首页深色主题优化样式
 * 颜色统一引用 dark-theme-enhanced.css 中定义的 CSS 变量,
 * 避免与基础调色板割裂。仅在该文件内补充首页专属的渐变和透明 RGBA。
 */

:root {
  --dark-accent-rgb: 255, 77, 94;
}

/* ============================================
   首页头部导航深色优化
   ============================================ */

.theme2 .head,
.theme2 .header_nav {
  background: linear-gradient(135deg, var(--dark-bg-secondary) 0%, #1f2431 100%);
  border-bottom: 1px solid rgba(var(--dark-accent-rgb), 0.2);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

.theme2 .head-nav {
  color: var(--dark-text-primary);
}

.theme2 .head-nav a {
  color: var(--dark-text-secondary);
  padding: 12px 18px;
  border-radius: 6px;
  transition: all 0.3s ease;
  position: relative;
}

.theme2 .head-nav a:hover {
  color: var(--dark-accent);
  background-color: rgba(var(--dark-accent-rgb), 0.1);
  text-shadow: 0 0 8px rgba(var(--dark-accent-rgb), 0.3);
}

.theme2 .head-nav a.current,
.theme2 .head-nav a.cor6 {
  color: var(--dark-accent);
  background: linear-gradient(135deg, rgba(var(--dark-accent-rgb), 0.2), rgba(var(--dark-accent-rgb), 0.1));
  border-bottom: 2px solid var(--dark-accent);
  font-weight: 600;
  text-shadow: 0 0 12px rgba(var(--dark-accent-rgb), 0.4);
}

/* 导航图标 */
.theme2 .head-nav .fa {
  color: inherit;
  margin-right: 6px;
  transition: all 0.2s ease;
}

.theme2 .head-nav a:hover .fa,
.theme2 .head-nav a.current .fa {
  transform: scale(1.1);
}

/* Logo */
.theme2 .logo {
  transition: all 0.3s ease;
}

.theme2 .logo:hover {
  transform: scale(1.02);
}

/* 下拉菜单 */
.theme2 .head-more {
  background-color: #1f2431;
  border: 1px solid var(--dark-border-light);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}

.theme2 .head-more .nav-link {
  color: var(--dark-text-secondary);
  padding: 10px 16px;
  border-radius: 6px;
  transition: all 0.2s ease;
  border-left: 3px solid transparent;
}

.theme2 .head-more .nav-link:hover {
  color: var(--dark-accent);
  background-color: rgba(var(--dark-accent-rgb), 0.1);
  border-left-color: var(--dark-accent);
  padding-left: 14px;
}

.theme2 .head-more .nav-link.current,
.theme2 .head-more .nav-link.cor6 {
  color: var(--dark-accent);
  background: linear-gradient(90deg, rgba(var(--dark-accent-rgb), 0.2), transparent);
  border-left-color: var(--dark-accent);
  font-weight: 600;
}

/* ============================================
   首页轮播图深色优化
   ============================================ */

.theme2 .swiper-container,
.theme2 .swiper,
.theme2 .slide-box {
  background-color: var(--dark-bg-primary);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}

.theme2 .slide-box .swiper-slide,
.theme2 .swiper-container .swiper-slide {
  position: relative;
}

.theme2 .slide-box .swiper-slide::before,
.theme2 .swiper-container .swiper-slide::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.4));
  z-index: 1;
  pointer-events: none;
}

.theme2 .slide-box .swiper-slide img,
.theme2 .swiper-container .swiper-slide img {
  filter: brightness(0.85);
  transition: filter 0.3s ease;
}

.theme2 .slide-box .swiper-slide:hover img,
.theme2 .swiper-container .swiper-slide:hover img {
  filter: brightness(0.9);
}

/* 分页点 */
.theme2 .swiper-pagination-bullet {
  background-color: rgba(255, 255, 255, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.1);
  width: 10px;
  height: 10px;
  opacity: 0.7;
  transition: all 0.3s ease;
}

.theme2 .swiper-pagination-bullet-active {
  background: var(--dark-gradient-accent);
  border-color: var(--dark-accent);
  width: 28px;
  border-radius: 6px;
  opacity: 1;
  box-shadow: 0 0 12px rgba(var(--dark-accent-rgb), 0.4);
}

/* 轮播导航按钮 */
.theme2 .swiper-button-prev,
.theme2 .swiper-button-next {
  background-color: rgba(0, 0, 0, 0.4);
  color: rgba(255, 255, 255, 0.7);
  border-radius: 50%;
  width: 48px;
  height: 48px;
  transition: all 0.3s ease;
}

.theme2 .swiper-button-prev:hover,
.theme2 .swiper-button-next:hover {
  background-color: var(--dark-accent);
  color: #fff;
  box-shadow: 0 6px 18px rgba(var(--dark-accent-rgb), 0.4);
  transform: scale(1.05);
}

/* ============================================
   内容卡片深色优化
   ============================================ */

.theme2 .content-box,
.theme2 .item-box,
.theme2 .vod-box,
.theme2 .article-box {
  background-color: var(--dark-bg-secondary);
  border: 1px solid var(--dark-border-light);
  border-radius: 12px;
  transition: all 0.3s ease;
  overflow: hidden;
}

.theme2 .content-box:hover,
.theme2 .item-box:hover,
.theme2 .vod-box:hover,
.theme2 .article-box:hover {
  background-color: var(--dark-bg-tertiary);
  border-color: var(--dark-accent);
  box-shadow: 0 12px 32px rgba(var(--dark-accent-rgb), 0.2);
  transform: translateY(-4px);
}

/* 卡片图片 */
.theme2 .box-img,
.theme2 .item-image,
.theme2 .card-image {
  position: relative;
  overflow: hidden;
  background-color: var(--dark-bg-primary);
}

.theme2 .box-img::after,
.theme2 .item-image::after,
.theme2 .card-image::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(135deg, rgba(var(--dark-accent-rgb), 0.1), transparent);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 2;
}

.theme2 .content-box:hover .box-img::after,
.theme2 .item-box:hover .item-image::after,
.theme2 .content-box:hover .card-image::after {
  opacity: 1;
}

.theme2 .box-img img,
.theme2 .item-image img,
.theme2 .card-image img {
  filter: brightness(0.9);
  transition: all 0.3s ease;
}

.theme2 .content-box:hover .box-img img,
.theme2 .item-box:hover .item-image img,
.theme2 .content-box:hover .card-image img {
  filter: brightness(1);
  transform: scale(1.05);
}

/* 卡片标题 */
.theme2 .box-title,
.theme2 .item-title,
.theme2 .card-title {
  color: var(--dark-text-primary);
  font-weight: 600;
  line-height: 1.4;
  transition: color 0.2s ease;
}

.theme2 .content-box:hover .box-title,
.theme2 .item-box:hover .item-title,
.theme2 .content-box:hover .card-title {
  color: var(--dark-accent);
}

/* 卡片描述 */
.theme2 .box-desc,
.theme2 .item-desc,
.theme2 .card-desc {
  color: var(--dark-text-tertiary);
  font-size: 13px;
  line-height: 1.6;
}

/* 卡片标签 */
.theme2 .box-tag,
.theme2 .item-tag,
.theme2 .card-tag {
  display: inline-block;
  background-color: rgba(var(--dark-accent-rgb), 0.15);
  color: var(--dark-accent);
  padding: 4px 12px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
  margin: 2px 4px;
  transition: all 0.2s ease;
}

.theme2 .box-tag:hover,
.theme2 .item-tag:hover,
.theme2 .card-tag:hover {
  background-color: var(--dark-accent);
  color: #fff;
  box-shadow: 0 4px 12px rgba(var(--dark-accent-rgb), 0.3);
}

/* ============================================
   侧边栏深色优化
   ============================================ */

.theme2 .side-box,
.theme2 .sidebar,
.theme2 .widget {
  background-color: var(--dark-bg-secondary);
  border: 1px solid var(--dark-border-light);
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 20px;
}

.theme2 .side-box-title,
.theme2 .widget-title {
  color: var(--dark-text-primary);
  border-bottom: 2px solid var(--dark-accent);
  padding-bottom: 12px;
  margin-bottom: 16px;
  font-weight: 700;
  font-size: 16px;
}

.theme2 .side-box ul li,
.theme2 .widget ul li {
  border-color: var(--dark-border-light);
  padding: 10px 0;
}

.theme2 .side-box ul li a,
.theme2 .widget ul li a {
  color: var(--dark-text-secondary);
  transition: all 0.2s ease;
}

.theme2 .side-box ul li a:hover,
.theme2 .widget ul li a:hover {
  color: var(--dark-accent);
  padding-left: 6px;
  text-shadow: 0 0 8px rgba(var(--dark-accent-rgb), 0.3);
}

/* ============================================
   分类选择深色优化
   ============================================ */

.theme2 .select-tab,
.theme2 .filter-group,
.theme2 .category-tabs {
  background-color: var(--dark-bg-secondary);
  border: 1px solid var(--dark-border-light);
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 20px;
}

.theme2 .select-tab a,
.theme2 .filter-group a,
.theme2 .category-tabs a {
  color: var(--dark-text-secondary);
  padding: 8px 16px;
  border-radius: 6px;
  transition: all 0.2s ease;
  display: inline-block;
  margin: 4px;
}

.theme2 .select-tab a:hover,
.theme2 .filter-group a:hover,
.theme2 .category-tabs a:hover {
  color: var(--dark-accent);
  background-color: rgba(var(--dark-accent-rgb), 0.1);
}

.theme2 .select-tab a.active,
.theme2 .filter-group a.active,
.theme2 .category-tabs a.active,
.theme2 .select-tab a.cur {
  color: #fff;
  background: var(--dark-gradient-accent);
  box-shadow: 0 4px 12px rgba(var(--dark-accent-rgb), 0.3);
}

/* ============================================
   搜索框深色优化
   ============================================ */

.theme2 .head-search,
.theme2 .search-box {
  background-color: var(--dark-bg-tertiary);
  border: 1px solid var(--dark-border-light);
  border-radius: 8px;
  padding: 12px 16px;
  transition: all 0.3s ease;
}

.theme2 .head-search:hover,
.theme2 .head-search:focus,
.theme2 .search-box:hover,
.theme2 .search-box:focus {
  border-color: var(--dark-accent);
  background-color: var(--dark-bg-hover);
  box-shadow: 0 0 12px rgba(var(--dark-accent-rgb), 0.2);
}

.theme2 .head-search input,
.theme2 .search-box input {
  color: var(--dark-text-primary);
  background-color: transparent;
}

.theme2 .head-search input::placeholder,
.theme2 .search-box input::placeholder {
  color: var(--dark-text-tertiary);
}

.theme2 .search-btn {
  background: var(--dark-gradient-accent);
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 8px 16px;
  transition: all 0.2s ease;
}

.theme2 .search-btn:hover {
  box-shadow: 0 4px 12px rgba(var(--dark-accent-rgb), 0.3);
  transform: translateY(-2px);
}

/* ============================================
   页脚深色优化
   ============================================ */

.theme2 .foot,
.theme2 footer {
  background: linear-gradient(180deg, var(--dark-bg-secondary) 0%, var(--dark-bg-primary) 100%);
  border-top: 1px solid var(--dark-border-light);
  color: var(--dark-text-secondary);
}

.theme2 .foot h3,
.theme2 footer h3 {
  color: var(--dark-text-primary);
  border-bottom: 2px solid var(--dark-accent);
  padding-bottom: 10px;
  margin-bottom: 16px;
}

.theme2 .foot a,
.theme2 footer a {
  color: var(--dark-text-secondary);
  transition: all 0.2s ease;
}

.theme2 .foot a:hover,
.theme2 footer a:hover {
  color: var(--dark-accent);
  text-decoration: underline;
  text-shadow: 0 0 8px rgba(var(--dark-accent-rgb), 0.2);
}

.theme2 .foot-link,
.theme2 footer .link-group {
  border-color: var(--dark-border-light);
}

/* ============================================
   加载动画深色优化
   ============================================ */

.theme2 .gen-loading,
.theme2 .loading-box {
  background: linear-gradient(
    135deg,
    rgba(15, 20, 25, 0.95),
    rgba(26, 31, 46, 0.95)
  );
  backdrop-filter: blur(10px);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
}

.theme2 .loading1,
.theme2 .loading2 {
  filter: brightness(0.9) drop-shadow(0 0 8px rgba(var(--dark-accent-rgb), 0.3));
}

/* ============================================
   响应式优化
   ============================================ */

@media (max-width: 768px) {
  .theme2 .head {
    padding: 12px 0;
  }

  .theme2 .head-nav a {
    padding: 8px 12px;
    font-size: 13px;
  }

  .theme2 .content-box,
  .theme2 .item-box {
    border-radius: 8px;
  }

  .theme2 .side-box {
    padding: 16px;
  }
}

@media (max-width: 480px) {
  .theme2 .head {
    flex-direction: column;
  }

  .theme2 .head-nav {
    margin-top: 8px;
  }

  .theme2 .head-nav a {
    padding: 6px 10px;
    font-size: 12px;
  }

  .theme2 .swiper-button-prev,
  .theme2 .swiper-button-next {
    width: 40px;
    height: 40px;
  }
}

/* ============================================
   头部导航：nav-row / nav-item 扁平化布局
   说明：head.html 已抛弃 swiper class，这里只补几条 flex 规则
   ============================================ */
.head .head-nav .nav-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  list-style: none;
  margin: 0;
  padding: 0;
}

/* nav-row 下所有直接 li（含主导航项 .nav-item 和"更多"li.head-more-a）
   都用同一组 flex 规则，否则没匹配到的那个会被默认 flex: 0 1 auto 压缩，
   导致 "更多" 文字被截成 "多"。
   注意：common.css 第 3228 行给 li 加了 margin-left:36px，必须覆盖，
   否则 8 项就吃掉 ~280px 横向空间，导致主导航项放不下被挤掉。 */
.head .head-nav .nav-row > li {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  padding: 0 clamp(8px, 0.85vw, 18px);
  margin: 0 clamp(2px, 0.25vw, 6px) 0 0;
  line-height: 90px;
  white-space: nowrap;
}

.head .head-nav .nav-row > li:last-child {
  margin-right: 0;
}

.head .head-nav .nav-row > li a {
  white-space: nowrap;
  padding: 0;
  font-size: clamp(14px, 0.95vw, 19px);
  font-weight: 600;
  letter-spacing: 0.3px;
}

/* common.css 老规则 .head-nav .swiper-slide .fa 失效后，这里补一条 */
.head .head-nav .nav-row > li .fa {
  margin-right: clamp(4px, 0.4vw, 8px);
  font-size: clamp(15px, 1vw, 19px);
}

/* head 整体颜色：扁平 #141c2b */
html.theme2 .head,
html.theme2 .head.bj,
html.theme2 .head.header_nav,
html.theme2 .head.transition {
  background: #141c2b;
  background-image: none;
}

/* 文字 / 高亮态 */
html.theme2 .head .head-nav .nav-row > li a {
  color: #fff;
  background: transparent;
}

html.theme2 .head .head-nav .nav-row > li a:hover {
  color: var(--dark-accent);
  background-color: rgba(255, 77, 94, 0.12);
}

html.theme2 .head .head-nav .nav-row > li a.current,
html.theme2 .head .head-nav .nav-row > li a.cor6 {
  color: var(--dark-accent);
}

/* 导航中的图标 / 图片不应被全局图片滤镜变暗 */
.head .head-nav .nav-row > li img {
  filter: none;
}

/* 顶栏右侧图标按钮统一透明 */
html.theme2 .head .gen-search a,
html.theme2 .head .gen-history a,
html.theme2 .head .gen-left-list a,
html.theme2 .head .qiAnDao_bnt a {
  background-color: transparent;
}

/* 加载遮罩不应吃事件 */
.gen-loading {
  pointer-events: none;
}

/* 下拉菜单背景：与导航栏一致 */
.head-more {
  background: #141c2b;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

/* 布局：left 自适应剩余宽度，right 固定 */
.head .left { min-width: 0; flex: 1 1 auto; }
.head .right { flex: 0 0 auto; }
.head .head-nav { min-width: 0; }

/* 更多下拉框：响应式宽度 + 靠右对齐。
   common.css 给了固定 width:700px，这里改成根据视口自适应宽度，
   避免在窗口右侧时被截断溢出屏幕。 */
.head-nav .head-more-a .head-more {
  width: auto;
  min-width: 240px;
  max-width: min(700px, calc(100vw - 24px));
  left: auto;
  right: 12px;
  white-space: normal;
}

/* 下拉里的链接：响应式 padding，按视口宽度自适应 */
.head-nav .head-more-a .head-more .nav-link {
  padding: 10px clamp(10px, 1.2vw, 18px);
  font-size: clamp(13px, 0.95vw, 15px);
}

/* 移动端：贴右边再窄一点 */
@media (max-width: 768px) {
  .head-nav .head-more-a .head-more {
    max-width: calc(100vw - 20px);
    right: 10px;
  }
}

/* 项目较多 + 屏幕较窄时，clamp() 已经把 padding/字号自动收缩到下限,
   这里只保留"隐藏图标 / 隐藏次要功能"等结构性断点。 */

/* 窄桌面：隐藏导航图标和右侧次要图标释放空间 */
@media (max-width: 1366px) {
  .head .head-nav .nav-row > li .fa {
    display: none;
  }
  .head .right .gen-history,
  .head .right .gen-left-list {
    display: none;
  }
}

/* 1200 以下：隐藏 APP 下载按钮，让位给导航 */
@media (max-width: 1199px) {
  .head .right .gen-btn-container {
    display: none;
  }
}

/* 小屏：隐藏主导航项，只留 "更多" 入口（移动端有左侧抽屉兜底） */
@media (max-width: 992px) {
  .head .head-nav .nav-item {
    display: none;
  }
}

/* 桌面端（≥993px）：覆盖 common.css 在 993-1329 区间强制显示
   .head-more .none2 的兜底规则。.none2 是 nav_b 项在"更多"下拉里的
   重复副本，旧 swiper 布局挤不下时才兜底显示；现在 flex 主导航已
   能完整显示所有 nav_b 项，这层兜底就变成"重复显示"。 */
@media (min-width: 993px) {
  .head-more .none2 {
    display: none !important;
  }

  /* 桌面端: 当 nav_a (更多导航) 为空时,head.html 给 li.head-more-a 加 no-extra 标记,
     此时下拉里只剩纯 .none2 兜底项 (桌面端已被上面规则隐藏),整个"更多"按钮无意义,直接隐藏。
     移动端 (≤992) 因为 nav_b 主导航已被隐藏,需要 .none2 + 更多按钮兜底,这里不能影响。 */
  .head .head-nav .nav-row > li.head-more-a.no-extra {
    display: none !important;
  }
}