/* ============================================================================
 * b34-version-page.css —— 批次35 需求①: 「软件管理 → 版本管理」的**页面模式**样式
 *
 * 出处: 批次35 需求①「把软件管理里的版本管理改成页面形式的, 不要弹窗了」。
 *   页面模式由 public/b34-version.js 的 window.B34Version.mount(host, opts) 渲染;
 *   DOM 契约: mount 把 `<div class="card b34vp-card">` 整个写进 host(调用方给的是 #content),
 *   卡片内部依次是 .b34vp-head(上下文条) / .body.tight(筛选栏 + 操作行 + 表格 + 分页)。
 *
 * 边界(重要, 别越界):
 *   · 本文件**只**放页面模式新增的版式, 所有选择器一律 b34vp- 前缀, 与既有类零冲突。
 *   · 浮层模式的 .b34v-* / .mask / .modal 规则在 public/style.css(批次34 段)里,
 *     本文件**不修改、不重定义**它们; 只对页面模式自己多加的外壳类做少量覆盖
 *     (例如放开表格高度上限), 且都用两段式选择器 .b34vp-card .b34vp-xxx,
 *     保证不依赖 <link> 的加载顺序也能生效。
 *   · 表格 / 按钮 / 分页 / 标签 / 筛选控件全部复用 style.css 通用类
 *     (.card/.tblwrap/table.tbl/.tblbar/.btn/.tag/.sel/.inp/.empty), 本文件不重复定义。
 * ==========================================================================*/

/* ---- 顶部上下文条: 「当前分类：xxx」+ 刷新按钮 ---- */
.b34vp-head {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 12px 18px; border-bottom: 1px solid var(--border);
}
.b34vp-ctx { font-size: 13px; color: var(--fg-dim); }
.b34vp-ctx b { color: var(--fg); font-weight: 600; }
.b34vp-tip { font-size: 12px; color: var(--fg-dim2); }
.b34vp-head .sp { flex: 1; }        /* 把「刷新」推到右边 */

/* ---- 筛选栏 / 操作行: 页面里不需要弹窗那圈留白, 略微收紧 ---- */
.b34vp-card .b34vp-filters { margin-bottom: 12px; }
.b34vp-card .b34vp-ops { margin-bottom: 10px; }

/* ---- 表格区: 弹窗用 calc(88vh - 330px) 限高做内部滚动;
 *      页面模式改为整页滚动, 所以放开高度上限, 只留一个最小高度 ---- */
.b34vp-card .b34vp-tblwrap { max-height: none; min-height: 220px; }

/* ---- 分页条 ---- */
.b34vp-card .b34vp-pager { margin-top: 12px; flex-wrap: wrap; }

/* ---- 窄屏: 上下文条换行时按钮不挤在一起 ---- */
@media (max-width: 900px) {
  .b34vp-tip { display: none; }
}
