/* ============================================================
   云付·客商端 · 响应式补丁
   ------------------------------------------------------------
   up.css 与高保真原型逐字节一致，是视觉基准，不做任何修改。
   原型本身在窄屏下存在少量缺陷（下面逐条注明），而「支持手机端」
   是本项目的硬性要求，因此把修复以叠加样式的形式单独放在这里，
   加载顺序在 up.css 之后。

   约定：
   · 只写媒体查询内的窄屏修复，不改动桌面端任何表现；
   · 每条修复必须注明「原型问题是什么、为什么这么改」；
   · 需要与原型比对时，临时移除本文件即可还原到原型表现。
   ============================================================ */

/* ---- 修复 1：页头操作按钮组在 ≤480 溢出屏幕 ----
   原型 up.css 给 .page-head .actions 设了 flex: 0 0 auto，
   容器宽度按 max-content 计算，三个按钮加起来约 399px；
   虽然设了 flex-wrap: wrap，但容器本身不收缩，于是整页横向滚动
   （实测 375 视口下 /workbench 内容宽 413px、/bills 385px）。
   改为占满整行并允许收缩，配合原型已有的 .btn{flex:1} 让按钮平分一行。 */
@media (max-width: 480px) {
  .page-head .actions {
    flex: 1 1 100%;
    min-width: 0;
  }
}

/* ---- 修复 2：筛选栏输入框在窄屏被写死宽度撑出 ----
   列表页的关键字输入框在模板里带 style="width:220px"，
   窄屏下与前面的下拉框并排会超出容器。让筛选栏内的控件可收缩。 */
@media (max-width: 480px) {
  .filter-bar .input,
  .filter-bar .select {
    min-width: 0;
    flex: 1 1 160px;
    width: auto !important;
  }
}

/* ---- 修复 3：凭证卡片存证机构章压住区块链哈希文字 ----
   原型演示用的是一段 140 余字符的 DER 签名串，占 6 行，末行足够高，
   绝对定位在右下角的印章只压到留白；真实数据的哈希是 64 字符（2 行），
   末行变矮，印章相对位置不变因而盖住了约 58% 的哈希文字——
   而哈希是查验页的核心信息，不能被遮挡。
   给末行单元格加下内边距把文字顶到上方，印章仍落在右下留白区，
   视觉上与原型一致，且哈希长短变化都不会再被遮住。 */
.dz-tbl tr:last-child td {
  padding-bottom: 76px;
}
@media (max-width: 680px) {
  /* 窄屏下印章已改为静态居中（原型 query.html 的媒体查询），无需留白 */
  .dz-tbl tr:last-child td { padding-bottom: 12px; }
}