/* page-paginate-v1.css — 全站分页条对齐修正
   覆盖范围：产品 / 产品分类 / 客户案例 / 解决方案 / 新闻 / 博客 —— 所有列表页的分页条。
   它们用的是同一个 .news-pagination 组件：
     · 产品 / 案例 / 解决方案 由 paginate-dom-v1.js 包裹在 .pg-bar-wrap 里；
     · 新闻 / 博客 由前端 bundle 直接渲染，没有包裹层。
   所以修正规则必须作用于 .news-pagination 本身，而不是只作用于 .pg-bar-wrap。

   问题根因：站点原生样式 .news-pagination button{width:38px;height:38px} 是按「纯数字页码」
   设计的方形按钮，而同一个组件里的「上一页 / 下一页」是 3 个汉字的文字按钮
   （约 36px 宽 + 浏览器默认 6px 左右内边距），38px 方框塞不下 →
   文字溢出错位；页数多时甚至被压成「上 / 一 / 页」竖排。
   修正：文字按钮宽度自适应 + 左右等距内边距；数字页码继续用正方形。
   选择器统一加 body 前缀，确保优先级高于 index-Cjxn8EJo.css 里的 .news-pagination button。 */

/* ---------- 1. 文字按钮：上一页 / 下一页（宽度自适应，文字严格居中） ---------- */
body .news-pagination > button {
  width: auto;
  min-width: 38px;
  padding: 0 12px;
  box-sizing: border-box;
  white-space: nowrap;
}

/* ---------- 2. 数字页码：沿用站点方框（桌面 38px / 窄屏 34px），只清掉浏览器默认内边距 ---------- */
body .news-pagination .news-page-numbers > button {
  padding: 0;
}

/* ---------- 3. 当前页 hover 保持选中外观 ----------
   站点原有 button:hover:not(:disabled) 优先级高于 .active，鼠标停在当前页上会把它变回
   白底描边、看起来像「没选中」→ 误以为点击无效。这里把选中态提权。 */
body .news-pagination button.active:hover:not(:disabled) {
  border-color: #0879ea;
  color: #fff;
  background: #0879ea;
}

/* ---------- 4. 说明文字：与按钮同高、垂直居中、不换行 ---------- */
body .news-pagination .pg-info {
  display: inline-flex;
  align-items: center;
  align-self: center;
  margin-left: 8px;
  color: #8aa0b4;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}

/* ---------- 5. 宽屏统一元素顺序：上一页 · 页码 · 下一页 · 说明 ----------
   bundle 渲染的新闻 / 博客分页条把「说明」插在了「下一页」之前，
   与产品 / 案例 / 解决方案的排布不一致；用 flex order 对齐。
   只在宽屏（>680px）生效：窄屏站点原本会把页码换到第二行，保持原样不动。 */
@media (min-width: 681px) {
  body .news-pagination > button:first-of-type { order: 1; }
  body .news-pagination .news-page-numbers { order: 2; }
  body .news-pagination > button:last-of-type { order: 3; }
  body .news-pagination .pg-info { order: 4; }
}

/* ---------- 6. 分页条容器（paginate-dom-v1.js 注入的包裹层）：水平居中 ---------- */
.pg-bar-wrap {
  display: flex;
  justify-content: center;
  margin-top: 46px;
}
.pg-bar-wrap .news-pagination {
  margin-top: 0;
  align-items: center;
}
