/* ====================================================================
   web-extra.css —— H5 兜底层（不改变 Vue 源码视觉，只做环境差异修补）
   ▶ 加载顺序：mdb.min.css → index.css(全局) → web-scoped.css(导航/页脚)
               → home-scoped.css(首页区块) → web-extra.css(本文件，最后赢)
   ▶ 原则：与 Vue 源码冲突的 hack 一律不写；源码样式在另外两个文件里
   ==================================================================== */

/* 1) MDB 变量源头压黑：防止 MDB body 默认白底从变量层渗出 */
:root {
  --mdb-body-bg-rgb: 0, 0, 0;
  --mdb-body-color-rgb: 255, 255, 255;
  --mdb-bg-opacity: 1;
}
html,
body {
  background-color: #000 !important;
  background: #000 !important;
  color: #fff !important;
}

/* 2) 全局 img 基础约束（Vue 无全局 img 规则，H5 加一层防呆，不改变常规尺寸） */
img {
  max-width: 100%;
  height: auto;
  display: inline-block;
  vertical-align: middle;
}
/* 页脚备案国徽（源码无规则，图片本身 20×20，这里锁死防放大） */
footer .copyright img {
  display: inline-block;
  vertical-align: middle;
  width: 20px;
  height: 20px;
  margin: 0 4px;
  object-fit: contain;
}

/* 3) 新闻列表 / 详情页（news.vue / newsDetail.vue scoped → 限定 .news / .detail 作用域） */
/* news.vue: .section { height:auto; padding:5rem 0; margin:auto; width:72.8% } */
body main .section.news {
  height: auto;
  padding: 5rem 0;
  margin: auto;
  width: 72.8%;
}
body main .news { opacity: 1; }

body main .news > .title {
  font-size: 1.875rem;              /* pxTorem(30) */
  padding-bottom: 1.875rem;         /* pxTorem(30) */
  letter-spacing: calc(var(--letterSpacing) * 0.3);
  border-bottom: none;              /* 源码无下划线，首条线来自第一个 li 的 border-top */
}
body main .news ul.list li {
  border-top: 1px solid #666;
  padding: 1.875rem 0 1.25rem 0;    /* pxTorem(30/20) */
}
body main .news ul.list li .date { opacity: inherit; font-size: inherit; }
body main .news ul.list li h3.news-title {
  font-size: 1.5rem;                /* pxTorem(24) */
  margin: 1.875rem 0 3.125rem 0;    /* pxTorem(30/50) */
  line-height: inherit;
  letter-spacing: inherit;
}
body main .news ul.list li a {
  color: #fff;
  display: inline-block;
}
body main .news ul.list li a img { margin-left: 0.625rem; }  /* pxTorem(10) */
body main .news .news-empty {
  padding: 0;
  color: inherit;
  text-align: inherit;
  font-size: inherit;
  opacity: inherit;
}

/* 分页：news.vue scoped（白底黑字 opacity .8 方块，当前页蓝字加粗，整体靠右） */
.news-pagination { text-align: right; }
.news-pagination > div { display: inline-block; }
.news-pagination .num {
  text-align: center;
  width: 2rem;
  height: 2rem;
  line-height: 2rem;
  font-size: 1.2rem;
  display: inline-block;
  color: #000;
  background-color: #fff;
  opacity: 0.8;
}
.news-pagination .pointer { cursor: pointer; }
.news-pagination .pointer:hover,
.news-pagination a:hover .num { color: #2a609f; }
.news-pagination .active { font-weight: bold; color: #2a609f; }

/* newsDetail.vue: .detail { padding:5rem 0; width:72.8%; margin:auto } */
body main .detail {
  padding: 5rem 0;
  width: 72.8%;
  margin: auto;
  color: #fff;
  line-height: normal;
  font-size: inherit;
  letter-spacing: normal;
  position: static;
}
body main .detail > h3 {
  font-size: inherit;
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
  font-size: 1.75rem;
}
body main .detail h3 a { color: inherit; }
body main .detail > div { margin: 1rem 0; }
body main .detail > div > span { opacity: 0.8; font-size: inherit; }
body main .detail .news-content { font-size: 1.2rem; margin: 1rem 0; }
body main .detail img { max-width: 100%; }

/* news detail 上一篇/下一篇 */
body main .detail .news-nav {
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
  margin-top: 3rem;
  padding-top: 2rem;
}
body main .detail .news-nav-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  padding: 1rem 0;
  border-radius: 4px;
  color: #fff;
  text-decoration: none;
  transition: border-color 0.2s, background 0.2s;
  min-width: 0;
}
body main .detail .news-nav-item.disabled {
  opacity: 0.35;
  pointer-events: none;
  cursor: default;
}
body main .detail .news-nav-item.prev { text-align: left; }
body main .detail .news-nav-item.next { text-align: right; }
body main .detail .news-nav-item .nav-label {
  font-size: 0.9rem;
  opacity: 0.6;
  letter-spacing: 0.1em;
}
body main .detail .news-nav-item .nav-title {
  font-size: 1.05rem;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media screen and (max-width: 768px) {
  body main .section.news { width: 100%; padding: 5rem 5%; }
  body main .detail { width: 100%; padding: 5rem 5% 0 5%; }
  body main .detail .news-nav {
    flex-direction: column;
    gap: 0.75rem;
  }
  body main .detail .news-nav-item.next { text-align: left; }
}

/* 4) 交互元素去掉浏览器默认 focus 描边 */
*:focus { outline: none !important; }

/* 5) 移动端 / PC 导航两套菜单的显隐（Vue 里由 isPc/v-if 控制，H5 用媒体查询） */
@media screen and (max-width: 767px) {
  ul.pc-nav { display: none !important; }
  ul.mobile-nav { display: flex !important; }
}
@media screen and (min-width: 768px) {
  ul.mobile-nav { display: none !important; }
  ul.pc-nav { display: flex !important; }
}