/* v2 页共享 PC 框架 —— 由 layout.html 引入(晚于各页 _anime.css)；仅 min-width:1024px。
   仅做「底栏→左侧栏 + 内容避让」，各页内容 reflow 在各自 _pc.css。改后 bump ?v=。 */
@media (min-width: 1024px) {
  /* 底部 tab 栏 → 左侧 88px 窄竖栏（贴设计稿:与首页一致的堆叠式——图标上/文字下、居中）。
     详情页 .bottom-nav 为 display:none，本规则自然不渲染。 */
  html.app-dark .bottom-nav {
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    top: 0 !important;
    bottom: auto !important;
    left: 0 !important;
    transform: none !important;
    width: 88px !important;
    max-width: 88px !important;
    height: 100vh !important;
    padding: 16px 0 !important;
    box-shadow: 2px 0 12px rgba(0,0,0,.12) !important;
    gap: 6px;
  }
  html.app-dark .bottom-nav .nav-item {
    flex: 0 0 auto !important;
    flex-direction: column !important;       /* 图标上 / 文字下(贴设计稿,原 row 是横排,故完全不一样) */
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    width: 72px !important;
    height: 62px !important;
    margin: 0 auto !important;          /* 与首页一致(原 0 7.5px 会和首页错位) */
    padding: 0 !important;
    border-radius: 14px !important;
    box-sizing: border-box;
  }
  /* ↓ 与首页 index_pc.css:368-369 完全对齐(字号/图标尺寸统一,切页不跳/不变字) */
  html.app-dark .bottom-nav .nav-item .nav-icon { width: 24px !important; height: 24px !important; margin: 0 !important; }
  html.app-dark .bottom-nav .nav-label { font-size: 11px !important; line-height: 1 !important; margin: 0 !important; }

  /* 侧栏顶部 LOGO 贴片(与首页一致):站点 G 品牌图标,用 ::before 免改模板。
     修复:v2 页原来左栏顶部没这个 G(首页在 index_pc.css 里加了,v2 页漏了)。 */
  html.app-dark .bottom-nav::before {
    content: "" !important; display: block !important; flex: 0 0 auto !important;
    width: 48px !important; height: 48px !important; margin: 4px auto 18px !important;
    background: url('/themes/simpleboot3/mobilepublic/assets/images/common/nav_g_icon.png') no-repeat center / contain !important;
    border-radius: 0 !important; box-shadow: none !important;
  }
  /* 顶栏 logo 裁掉 G 图标(只留"姬游社"),侧栏已有 G 品牌,顶栏不重复(与首页一致)。 */
  html.app-dark .header_logo { overflow: hidden !important; width: 90px !important; }
  html.app-dark .header_logo img { margin-left: -38px !important; max-width: none !important; }

  /* 分隔线(贴原型,与首页 index_pc.css:592-593 一致): 侧栏↔内容 右竖线 + 顶栏(logo+搜索)↔内容 下横线。
     顶栏包裹在 v2 页是 #headerTitle(首页是 .mainHeader)。 */
  html.app-dark .bottom-nav { border-right: 1px solid rgba(255, 255, 255, 0.07) !important; }
  html.app-dark #headerTitle { border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important; padding-bottom: 12px !important; }

  /* 选中态(贴设计稿·像素级取色) —— 全站 5 个 tab 统一: 深酒红圆角高亮块 + 纯白图标 + 白字。
     取色: 块底 #461E33(≈rgba 粉 0.22 叠在 #180A14 侧栏底上) / 图标 #FFFFFF / 文字 #FFFFFF。
     nav-item 本竖排(图标上/文字下)、圆角14、透明底(72×62);只给激活项加块底 + 图标转白 + 文字白。 */
  html.app-dark body .bottom-nav .nav-item.active {
    background: rgba(240, 106, 166, 0.22) !important;
    border-radius: 14px !important;
  }
  html.app-dark body .bottom-nav .nav-item.active .nav-icon {
    background: none !important;
    width: auto !important;
    height: auto !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
    -webkit-mask: none !important;
    mask: none !important;
    filter: none !important;
  }
  html.app-dark body .bottom-nav .nav-item.active .nav-icon img {
    display: inline-block !important;
    width: 26px !important;
    height: 26px !important;
    filter: brightness(0) invert(1) !important;   /* 纯白图标(贴设计稿取色 #FFFFFF) */
    opacity: 1 !important;
  }
  html.app-dark body .bottom-nav .nav-item.active .nav-label {
    color: #FFFFFF !important;
    text-shadow: none !important;
  }

  /* 解除 public.css 的全站 body{max-width:500px} 宽度锁（否则各页 _pc 的加宽都被压在 ≤500px 容器内，
     多列/两栏塌成窄条）；同时内容整体避开左侧栏，.main-container 仍 margin:0 auto 在右侧区域居中。 */
  html.app-dark body { max-width: none !important; box-shadow: none !important; padding-left: 88px !important; }

  /* VIP 开通弹层 .vipm 是 position:fixed（left:0/right:0/margin:0 auto 在整屏居中），不吃 body 的
     padding-left，会比「侧栏右侧居中的内容列」偏左约半个侧栏宽。给它 left:200px（配合原
     right:0/margin:0 auto）→ 在侧栏右侧区域居中，与内容列对齐。仅有侧栏的页命中；
     详情页无侧栏，在 game-detail_pc 里改回 left:0。 */
  html.app-dark .vipm { left: 88px !important; }

  /* VIP 弹层返回键 → 关闭 ×（#vipmClose 本就是关闭；PC 下作对话框，图标应为 ×）。
     ‹ 是文本字符，font-size:0 隐藏它 + ::after 放 ×。此为 ≥1024 独立页(我的/速玩)场景。 */
  html.app-dark .vipm-back { font-size: 0 !important; }
  html.app-dark .vipm-back::after { content: "×"; font-size: 22px; line-height: 32px; }

  /* 顶栏(logo+搜索)与首页一致：header_menu.html 内联样式给 padding-left:16、搜索满宽；
     首页 index_pc 覆盖成 padding-left:8 + 搜索限宽 560，各 v2 页却没覆盖 → 顶栏左间距/搜索宽度和首页不一致。
     这里补上同款覆盖(与 index_pc 一致)，让分类/速玩等页顶栏 logo 左边缘与首页齐平。 */
  html.app-dark .header_menu {
    gap: 20px !important;
    padding: 10px 8px !important;
  }
  html.app-dark .header_menu .header_search {
    flex: 1 1 auto !important;
    max-width: 560px !important;
  }
}

/* 详情/搜索对话框(iframe，html.pc-modal，宽<1024 不触发上面的 @media)里也把 VIP 返回键→× */
html.pc-modal .vipm-back { font-size: 0 !important; }
html.pc-modal .vipm-back::after { content: "×"; font-size: 22px; line-height: 32px; }

/* ===== 宽屏重设计·近黑紫扁平直角 导航/顶栏同步(与 index_pc.css 末段完全一致,两套导航栈必须同步) 2026-07-25 ===== */
@media (min-width: 1024px) {
  html.app-dark .bottom-nav {
    background: #120C1E !important;
    border-right: 1px solid #241B36 !important;
    box-shadow: none !important;
  }
  html.app-dark .bottom-nav .nav-item { border-radius: 0 !important; }
  html.app-dark .bottom-nav .nav-label { color: #7E718F !important; }
  html.app-dark body .bottom-nav .nav-item.active {
    background: #1F1233 !important;
    border-radius: 0 !important;
    border-left: 3px solid #7C3AED !important;
  }
  html.app-dark body .bottom-nav .nav-item.active .nav-label { color: #F2EEFA !important; }
  html.app-dark #headerTitle { border-bottom-color: #241B36 !important; }
  html.app-dark .header_menu .header_search {
    background: #1A1228 !important;
    border: 1px solid #2C2140 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  html.app-dark .header_menu .header_search input { color: #F2EEFA !important; }
  html.app-dark .header_menu .header_search input::placeholder { color: #7E718F !important; }
}

/* 2026-07-25 顶栏搜索图标归一(与 index_pc 同款):玫红爱心放大镜 → 中性灰紫 */
@media (min-width: 1024px) {
  html.app-dark .header_menu .header_search .search-icon {
    filter: grayscale(1) brightness(1.7) !important;
    opacity: .55 !important;
  }
}
