/* ===== 手机端响应式总修 v3（在 fix2 / fix3 之后加载，最后一层兜底） =====
   本轮实拍定位的真问题：
   A. 6 个标签总宽 444px > 屏幕 346px ⇒「内容与帮助」被裁到屏幕外
   B. 搜索栏的「共 N 条」宽度被撑到 348px ⇒ 逼着整行换行、按钮挤到左边
   C. 工具条是无 class 的 div ⇒ 按钮和三个下拉各自为政，「50 条/页」单独一行
*/

@media (max-width: 1024px) {
  /* ---------- A. 标签栏：允许换行，两行铺满，全部可见 ---------- */
  .tabs {
    flex-wrap: wrap !important;
    row-gap: 6px !important;
    column-gap: 7px !important;
  }
  .tabs .tab {
    flex: 0 0 auto !important;
    font-size: 14px !important;
    padding: 7px 12px !important;
    white-space: nowrap !important;
  }

  /* ---------- B. 「共 N 条」独占一行并右对齐 ---------- */
  #cnt {
    flex: 1 1 100% !important;
    width: auto !important;
    text-align: right !important;
    font-size: 12.5px !important;
    margin: 2px 0 0 !important;
    display: block !important;
  }
}

@media (max-width: 680px) {
  /* 搜索栏：输入框独占一行，搜索/清除各占一半 */
  #app .bar input.in {
    flex: 1 1 100% !important;
    height: 40px !important;
    font-size: 15px !important;
  }
  #app .bar button,
  #app .bar .btn {
    flex: 1 1 calc(50% - 4px) !important;
    height: 38px !important;
  }
  #app .bar > div:empty { display: none !important; }

  /* ---------- C. 工具条：两列网格，整齐不孤立 ---------- */
  .hz-tools {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    padding: 10px !important;
    margin: 0 0 10px !important;
    background: #fff !important;
    border-radius: 14px !important;
    box-sizing: border-box !important;
  }
  .hz-tools > button,
  .hz-tools > .btn,
  .hz-tools > a.btn {
    flex: 1 1 calc(50% - 4px) !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 10px !important;
    font-size: 13px !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
  }
  .hz-tools > select,
  .hz-tools > input {
    flex: 1 1 calc(50% - 4px) !important;
    height: 38px !important;
    min-width: 0 !important;
    font-size: 13px !important;
    box-sizing: border-box !important;
  }
  /* 三个下拉时：前两个并排，最后一个（每页条数）独占一行，视觉收尾 */
  .hz-tools > select:nth-of-type(3) {
    flex: 1 1 100% !important;
  }

  /* 分页按钮居中、够大好点 */
  .pager {
    justify-content: center !important;
    gap: 12px !important;
    margin: 14px 0 6px !important;
  }
  .pager .btn { min-height: 38px !important; }
}
