/* ===== 手机端收尾修复 =====
   ① 飞儿映像图片查看弹窗错乱：查看器内部有个 <div class="top">，
      被我给后台顶栏写的 .top{position:sticky;height:54px;z-index:90} 抢走了样式 ✗
      ⇒ 页码/下载/删除/关闭全被塞进 23px 宽的一格里，按钮飞出屏幕 ✗
   ② 每个页面那条灰色横线 = 表格容器的横向滚动条（手机上也画出来）✗ 隐藏掉
*/

/* ---------- ① 后台顶栏规则只作用于 #app 的直接子元素 ---------- */
#app > .top {
  position: sticky !important;
  top: 0 !important;
  z-index: 90 !important;
}

/* 图片查看器：默认必须隐藏，只有带 .on（真正打开时）才显示
   —— 之前这里漏了条件，导致任何页面一打开都顶着黑遮罩 ✗ */
#g-lb { display: none !important; }
#g-lb.on {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  gap: 0 !important;
  background: rgba(8, 10, 16, .92) !important;
}

#g-lb .top {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  z-index: 10001 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  padding: 12px 12px !important;
  background: linear-gradient(180deg, rgba(0, 0, 0, .55), rgba(0, 0, 0, 0)) !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

#g-lb .top > * { flex: 0 0 auto !important; }
#g-lb .top .cnt,
#g-lb .top .idx,
#g-lb .top #g-cnt {
  margin-right: auto !important;
  color: #fff !important;
  font-size: 13px !important;
  font-variant-numeric: tabular-nums;
  opacity: .9;
}

#g-lb img#g-img,
#g-lb img {
  max-width: 100vw !important;
  max-height: 68vh !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  margin: 0 !important;
  border-radius: 10px !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .55) !important;
}

/* 左右翻页按钮：贴边、垂直居中、够大好点 */
#g-lb .nav {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 10002 !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
  background: rgba(255, 255, 255, .18) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, .3) !important;
  font-size: 20px !important;
  line-height: 1 !important;
}
#g-lb .nav.prev { left: 10px !important; }
#g-lb .nav.next { right: 10px !important; }

/* 弹窗里的按钮（下载/删除/关闭）保持可见、可点 */
#g-lb .top button,
#g-lb .top .btn,
#g-lb .top a {
  min-height: 30px !important;
  padding: 0 10px !important;
  font-size: 12.5px !important;
  border-radius: 8px !important;
  white-space: nowrap !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
}

/* ---------- ② 干掉横向滚动条（手机端那条灰线） ---------- */
#app .tw-scroll,
#app .scroll,
#fin-wrap .tw-scroll,
#ev-wrap .tw-scroll,
#p-wrap .tw-scroll,
#s-wrap .tw-scroll,
.hz-xscroll {
  scrollbar-width: none !important;          /* Firefox */
  -ms-overflow-style: none !important;       /* 旧 Edge */
  overflow-x: auto !important;
}
#app .tw-scroll::-webkit-scrollbar,
#app .scroll::-webkit-scrollbar,
#fin-wrap .tw-scroll::-webkit-scrollbar,
#ev-wrap .tw-scroll::-webkit-scrollbar,
#p-wrap .tw-scroll::-webkit-scrollbar,
#s-wrap .tw-scroll::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

/* 手机端也去掉标签栏底部那条分隔细线（看着像多出来一根灰杠） */
@media (max-width: 680px) {
  .tabs::after { display: none !important; }
}
