/* ============================================================
   铸牢基地平台 · 博达高校全媒体平台适配层
   说明：本文件必须在 style.css 之后引入。
   作用：
   1) 标注「博达组件位」，便于在设计模式中定位并绑定组件；
   2) 让博达组件自动生成的 HTML 结构与现有设计保持一致；
   3) 补充少量原 SPA 由 JS 内联写死的样式（现已收敛到 CSS）。
   ============================================================ */

/* ---------- 1. 博达组件位标记 ---------- */
.boda-slot{position:relative}

/* 设计模式：给 body 加 .boda-design 即可看到组件位虚线框与名称标签（上线前移除） */
body.boda-design .boda-slot{outline:1px dashed #C9A35E;outline-offset:-1px}
body.boda-design .boda-slot::before{
  content:attr(data-boda-component);
  position:absolute;top:0;left:0;z-index:99;
  background:#A61F24;color:#F6D48A;
  font-size:11px;line-height:1.6;letter-spacing:1px;
  padding:1px 8px;border-radius:0 0 4px 0;pointer-events:none;
  font-family:var(--sans);white-space:nowrap;
}

/* ---------- 2. 通知公告轮播（组件输出多个条目，由 boda.js 轮播） ----------
   原 SPA 由 app.js 内联写死了通知条的 flex 布局，此处收敛到 CSS */
.notice-panel{display:flex;align-items:center;padding:0 16px;height:40px;overflow:hidden;width:100%}
#noticeRot{flex:1;position:relative;height:40px;overflow:hidden;min-width:0}
#noticeRot .notice-item{
  position:absolute;left:0;top:0;width:100%;
  line-height:40px;font-size:14px;color:#4a3f2c;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  opacity:0;transition:opacity .3s;
}
#noticeRot .notice-item.on{opacity:1}
#noticeRot .notice-item:hover{color:var(--red)}

/* ---------- 3. 检索表单（博达「全文检索」组件的静态外壳） ---------- */
.nav-search input{font-family:var(--sans)}

/* ---------- 4. 兼容博达列表组件自动生成的常见结构 ---------- */
/* 4.1 导航组件：博达输出 <li class="..."><a ...>，确保与 .nav ul li a 一致 */
.nav ul li>a{display:block}

/* 4.2 标题列表组件：若组件直接输出 <a> 而未包 <li>，用 .lst/.mini-lst/.feat-ul 兜底 */
.lst>a,.mini-lst>a,.feat-ul>a{
  display:flex;align-items:baseline;gap:10px;
  padding:8px 18px;font-size:14.5px;line-height:1.7;
  border-bottom:1px dashed var(--line);
}
.lst>a:hover,.mini-lst>a:hover,.feat-ul>a:hover{color:var(--red)}
.lst>a .dt,.mini-lst>a .dt,.feat-ul>a .dt{margin-left:auto;color:var(--ink-3);font-size:13px;white-space:nowrap}

/* 4.3 组件输出的日期/标题若使用内联颜色，统一收敛 */
.lst li a,.list-lst li a,.feat-ul li a,.mini-lst li a{color:inherit}

/* ---------- 5. 文章正文（博达「文章内容」组件输出区） ---------- */
.art-body img{max-width:100%;height:auto}
.art-body table{width:100%;border-collapse:collapse}
.art-body table td,.art-body table th{padding:6px 10px}
/* 博达正文常见的附件区 / 上一篇下一篇 */
.art-body .attach,.art-body #attach{font-size:13.5px;color:var(--ink-2)}
.pn-nav{display:flex;flex-wrap:wrap;gap:10px 26px;margin:16px 4px 0;font-size:13.5px;color:var(--ink-2)}
.pn-nav a{color:var(--gold-deep)}
.pn-nav a:hover{color:var(--red)}

/* ---------- 6. 检索结果页（博达「检索结果」组件） ---------- */
.search-summary{padding:6px 0 4px;color:var(--ink-2);font-size:14px}
.search-summary b{color:var(--red)}

/* ---------- 7. 图片文章 / 变换图片组件 ---------- */
.pic-list{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pic-list li{background:var(--card);border:1px solid var(--line);border-radius:6px;overflow:hidden}
.pic-list img{width:100%;height:150px;object-fit:cover;display:block}
.pic-list .tt{padding:10px 12px;font-size:14px;line-height:1.6}
@media(max-width:760px){.pic-list{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.pic-list{grid-template-columns:1fr}}

/* ============================================================
   8. 组件样式与页面风格不一致：桥接与兜底
   ------------------------------------------------------------
   绑定组件后样式跑偏，只有 3 种原因，对症处理：
     (1) 组件输出的 class 与本站 CSS 选择器对不上
         → 首选：改「组件模板」，让组件直接输出本站 class（最干净）
         → 次选：用下面 8.1 的「桥接选择器」，两边类名并列写
     (2) 组件自带样式表 / 内联样式覆盖了本站样式
         → 后台组件编辑器「预览样式表」看是谁在胜出
         → 用 8.2 压制，或启用 assets/js/boda-adapt.js 直接摘掉内联样式
     (3) 组件输出的 DOM 层级与本站不同（多一层/少一层 ul、div）
         → 改组件模板；或启用 boda-adapt.js 做结构归一化

   ⚠️ 下面出现的博达类名（pagebar / news_list / v_news_content 等）是常见命名，
      不是系统固定值。请以你后台「预览代码」看到的真实类名为准，用不到的删掉。
   ============================================================ */

/* ---------- 8.1 桥接：把组件输出的类名并列进本站选择器 ---------- */
/* 分页：等价于 style.css 里的 .pager a,.pager span */
.pagebar a,.pagebar span,
.pages a,.pages span,
.epages a,.epages span,
.pagination a,.pagination span,
.pagenav a,.pagenav span{
  display:inline-block;min-width:30px;height:30px;line-height:30px;text-align:center;
  border:1px solid var(--line);background:#fff;font-size:13px;color:var(--ink);
  padding:0 6px;border-radius:3px;margin:0 4px;
}
.pagebar a:hover,.pages a:hover,.epages a:hover,.pagination a:hover,.pagenav a:hover{
  border-color:var(--red);color:var(--red);
}
.pagebar .cur,.pagebar .on,.pagebar .current,
.pages .cur,.epages .cur,
.pagination .active,.pagination .current,
.pagenav .cur{
  background:var(--red-deep);color:#fff;border-color:var(--red-deep);
}

/* 列表：把组件可能输出的容器类名桥接到 .lst / .mini-lst / .list-lst 的排版 */
.news_list li,.newslist li,.list_news li,.vsb-list li,.v_list li{
  display:flex;align-items:baseline;gap:10px;
  padding:8px 0;font-size:14.5px;line-height:1.7;
  border-bottom:1px dashed var(--line);list-style:none;
}
.news_list li>a,.newslist li>a,.list_news li>a,.vsb-list li>a,.v_list li>a{
  flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:inherit;
}
.news_list li .date,.news_list li .news_date,.newslist li .date,
.list_news li .date,.vsb-list li .date{
  margin-left:auto;color:var(--ink-3);font-size:13px;white-space:nowrap;
}

/* 正文：博达/VSB 的正文容器 id 与常见类名，统一到 .art-body 的排版 */
#vsb_content p,.v_news_content p,.article-content p,.content-main p{margin:10px 0}
#vsb_content img,.v_news_content img,.article-content img,.content-main img{
  max-width:100%;height:auto;border:1px solid var(--line);border-radius:4px;
}
#vsb_content a,.v_news_content a,.article-content a{color:var(--red);border-bottom:1px dotted var(--red)}

/* ---------- 8.2 兜底：压制组件带出的内联样式 ----------
   博达列表/分页组件常直接输出 style="color:#333;font-size:14px"，
   内联样式优先级最高，只能用 !important 压。
   注意：加了 !important 后，这条属性上的 :hover 也会失效，
        所以更推荐启用 boda-adapt.js 直接把 style 属性摘掉（无副作用）。 */
.boda-slot li[style],
.boda-slot li>a[style],
.boda-slot li>span[style]{
  color:inherit !important;
  font-family:inherit !important;
  font-size:inherit !important;
  line-height:inherit !important;
  text-decoration:none !important;
  list-style:none !important;
}
/* 导航项的内联样式同样压制（导航组件常给当前项写死背景色） */
#navMenu li[style],#navMenu li>a[style]{
  background:transparent !important;
  color:#f4e6d0 !important;
  font-size:15px !important;
}
#navMenu li.on>a[style],#navMenu li>a[style]:hover{color:#fff !important}

/* ---------- 8.3 结构归一化后的补位样式（配合 boda-adapt.js） ---------- */
/* 组件直接输出 <a> 而未包 <li> 时（8.1 已覆盖选择器情况） */
.boda-slot .list-lst>a,.boda-slot .lst>a{
  display:flex;align-items:baseline;gap:12px;
  padding:12px 4px;border-bottom:1px dashed var(--line);font-size:15.5px;
}
.boda-slot .list-lst>a .dt,.boda-slot .lst>a .dt{margin-left:auto;color:var(--ink-3);font-size:13px}