/* ===== 移动端适配补丁 (iPhone 17 Pro 402x874, 2026-07-11) =====
   全部规则限定在 max-width:768px 内, 桌面零影响。
   挂在 styles.css 之后, 专门覆盖后期功能在移动端造成的回归。 */

/* P0-1: 修「手机上保存按钮出屏」——
   2026-07-02 弹窗可拉伸功能 .dialog{min-width:560px}(styles.css:2163) 声明位置
   在移动断点的 max-width:100vw(1739) 之后, 且 CSS 规则 min-width 优先于 max-width,
   编辑弹窗内容被撑到 560px > 402px 视口, 保存/暂存/关闭按钮全部出屏。
   手机上禁用拉伸、放开最小宽高, 恢复全屏弹窗。 */
@media (max-width: 768px) {
  .modal .dialog { min-width: 0; min-height: 0; resize: none; }
}

/* P0-2: iPhone 灵动岛 / Home indicator 安全区 (配合 viewport-fit=cover)。
   env() 在不支持的环境下取 0, 无副作用。 */
@media (max-width: 768px) {
  /* 顶部: 内容整体避开灵动岛; topbar 吸顶时停在灵动岛下缘 */
  .main { padding-top: env(safe-area-inset-top, 0px); }
  .topbar { top: env(safe-area-inset-top, 0px); }
  .sidebar { padding-top: calc(14px + env(safe-area-inset-top, 0px)); padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px)); }
  /* 灵动岛区毛玻璃遮罩: 挡住从 topbar 上方滚过的内容 (z 在抽屉 150 之下) */
  body::before {
    content: ""; position: fixed; top: 0; left: 0; right: 0;
    height: env(safe-area-inset-top, 0px); z-index: 130; pointer-events: none;
    background: rgba(255,255,255,.72);
    -webkit-backdrop-filter: blur(10px) saturate(1.4); backdrop-filter: blur(10px) saturate(1.4);
  }
  /* 底部: tabbar / 悬浮钮 / 快捷菜单 / 弹窗底栏 抬离 Home indicator */
  .mobile-tabs { bottom: calc(10px + env(safe-area-inset-bottom, 0px)); }
  .pen-fab { bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
  .quick-add { bottom: calc(148px + env(safe-area-inset-bottom, 0px)); }
  .nav-toggle { bottom: calc(18px + env(safe-area-inset-bottom, 0px)); }
  .main { padding-bottom: calc(70px + env(safe-area-inset-bottom, 0px)); }
  .modal .dialog-foot { padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px)); }
}

/* ===== Phase B (P1): 触控目标达标 (Apple HIG 44pt, 底线 38px) ===== */
@media (max-width: 768px) {
  /* 行选择复选框 13px → 24px (潜客池/产品主表/原料成本 每页40个) */
  #dataTable input[type="checkbox"], #customView input[type="checkbox"] {
    width: 24px; height: 24px; min-width: 24px; min-height: 24px; accent-color: var(--primary);
  }
  /* 子页签(潜客池9个)/表区按钮/下拉 34px → 40px */
  .tab-bar button, #tabBar button { min-height: 40px; padding-top: 6px; padding-bottom: 6px; }
  .pager select, .pager button { min-height: 40px; min-width: 40px; }
  /* 客户样品库状态/标记小钮 29px → 38px */
  .cs-st, .cs-tg, .cs-tg-logic { min-height: 38px; }
  /* 表格内行内链接(客户名跳转等)加触控内边距 */
  #dataTable td a { display: inline-block; padding: 8px 2px; }
}

/* P1: 装箱单编辑器手机可用性 (输入框 inline width 44-62px 截断数字 + 12px 字号触发 iOS 聚焦放大) */
@media (max-width: 768px) {
  #pkTable input { min-width: 56px !important; min-height: 38px; font-size: 16px !important; }
  #pkTable input[data-k="pname"] { min-width: 92px !important; }
  #pkTable input[data-k="color_desc"] { min-width: 150px !important; }
  #pkTable input[data-k="size_desc"] { min-width: 120px !important; }
  #pkTable input[data-k="qty_per"], #pkTable input[data-k="price"] { min-width: 72px !important; }
  /* 装箱单/选款等自绘浮层: 高度封顶留出 Home indicator */
  #packOv > div { max-height: calc(100dvh - env(safe-area-inset-bottom, 0px) - 8px) !important; }
}

/* ===== Phase C (P2): 弹窗明细行卡片化 (2026-07-11) =====
   配合 mobile.js 打的 data-label。覆盖全部 line-table 变体(订单/销售/入库/盘点/调拨/报价/交货)+装箱单。 */
@media (max-width: 768px) {
  .modal .line-table thead, #pkTable thead, #pkTable tfoot { display: none; }
  .modal .line-table, .modal .line-table tbody,
  #pkTable, #pkTable tbody { display: block; width: 100%; min-width: 0 !important; }
  .modal .line-table tbody tr, #pkTable tbody tr {
    display: flex; flex-wrap: wrap; gap: 8px 10px; align-items: flex-end;
    border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; margin: 0 0 10px;
    background: var(--surface); box-shadow: 0 1px 4px rgba(0,0,0,.05);
  }
  .modal .line-table tbody td, #pkTable tbody td {
    display: flex; flex-direction: column; gap: 2px;
    border: 0 !important; padding: 0 !important; white-space: normal;
    min-width: 0;   /* flex 子项默认 min-width:auto 会被 input 固有宽撑破视口 */
  }
  .modal .line-table tbody td::before, #pkTable tbody td::before {
    content: attr(data-label); font-size: 11px; color: var(--muted); font-weight: 600;
  }
  .modal .line-table tbody td[data-label=""]::before { content: none; }
  /* 行内 input 不再用桌面 min-width 撑宽, 由卡片流式排布 */
  .modal .line-table tbody td input, .modal .line-table tbody td select {
    min-width: 0 !important; width: 100%;
  }
  /* 关键字段按语义分配宽度(data-label 驱动, 变体通吃) */
  .modal .line-table tbody td[data-label="货号"] { flex: 1 1 100%; }
  .modal .line-table tbody td[data-label="规格"] { flex: 1 1 56%; }
  .modal .line-table tbody td[data-label="分类"], .modal .line-table tbody td[data-label="形状"],
  .modal .line-table tbody td[data-label="颜色"], .modal .line-table tbody td[data-label="单位"] { flex: 1 1 34%; }
  .modal .line-table tbody td[data-label="数量"], .modal .line-table tbody td[data-label="单价"],
  .modal .line-table tbody td[data-label="金额"], .modal .line-table tbody td[data-label="当前库存"],
  .modal .line-table tbody td[data-label="账面数量"], .modal .line-table tbody td[data-label="实盘数量"],
  .modal .line-table tbody td[data-label="差异"] { flex: 1 1 28%; }
  /* 删除钮列贴卡片右上 */
  .modal .line-table tbody td:last-child { margin-left: auto; flex: 0 0 auto; flex-direction: row; }
  /* 装箱单字段宽 */
  #pkTable tbody td { flex: 1 1 30%; }
  #pkTable tbody td[data-label="COLOR"], #pkTable tbody td[data-label="SIZE"] { flex: 1 1 100%; }
  /* 卡片模式下外层不再横滚 */
  .modal .line-editor .table-wrap, .modal .table-wrap:has(.line-table) { overflow-x: visible; }
  /* 明细行序号: 卡片里当角标, 「#」与数字排一行(默认 column 会拆两行占掉一整格高度) */
  .modal .line-table tbody td.line-no {
    flex: 0 0 auto; flex-direction: row; align-items: baseline; gap: 1px;
    font-size: 13px; font-weight: 700; color: var(--text);
  }
  .modal .line-table tbody td.line-no::before { font-size: 13px; font-weight: 700; color: var(--muted); }
}