/* 系统专用的少量补充样式。design.css 原样复制自已确认设计图，不改；这里只用 design.css 里的变量。 */
a.top-user { margin-left: auto; text-decoration: none; color: var(--c-on-shell); border-radius: var(--r-full); min-height: 44px; min-width: 44px; justify-content: center; }
a.top-user:hover .who { text-decoration: underline; }
/* R8 P3-⑦：链接名称取链接里的文字（不用 aria-label）。手机上姓名不显示，但要留给读屏，写法同 .sr-only。 */
@media (max-width: 767px) { .top-user .who { display: inline; position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } }
.menu-list form { margin: 0; }
input.qty-input { width: 96px; text-align: right; }
.nowrap { white-space: nowrap; }

/* T04 动态与修改记录：没有链接的行，排版同 .todo a */
.todo .todo-row { display: grid; grid-template-columns: auto 1fr; gap: var(--s-3); align-items: center; padding: var(--s-3) var(--s-5); min-height: 56px; }

/* 多行文字避免最后一行只剩一两个字（中文孤字）。 */
p, li, td, dd, .banner div { text-wrap-style: pretty; }
/* T08：出错汇总里每条是一两行的整句，balance 让两行接近等长，避免第二行只剩两个字（中文 pretty 只防单字） */
.error-summary p, .error-summary a { text-wrap-style: balance; }

/* T05 表单内快速新增（无 JS，用 details 展开） */
.quick-add { grid-column: 1 / -1; border: 1px dashed var(--c-border); border-radius: var(--r-md); padding: var(--s-3); }
.quick-add > summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; gap: var(--s-2); font-weight: 600; }
.quick-add[open] > summary { margin-bottom: var(--s-3); }
.quick-add .form-grid { margin: 0; }

/* T06 品类明细与多规格 */
.sub, .help { text-wrap-style: balance; }  /* 规格清单、说明文字常常两三行，均分各行，避免最后一行只剩“码白”“保存。” */
.h-note { margin-left: var(--s-2); font-size: var(--fs-caption); font-weight: 400; color: var(--c-text-secondary); }
@media (max-width: 767px) {
  /* 三个按钮挤一行会把“登记入库”折成两行：换成两行排，每个按钮不折字 */
  .page-header .actions.actions-3 { flex-wrap: wrap; }
  .page-header .actions.actions-3 .btn { flex: 1 1 auto; white-space: nowrap; }
}

/* T22 重置二次验证：原生 <dialog> 用 showModal() 打开（设计图 14 的 .dialog 是静态示意，这里改成居中浮层） */
dialog.dialog { position: fixed; inset: 0; margin: auto; height: fit-content; width: calc(100% - 32px); }
dialog.dialog:not([open]) { display: none; }
dialog.dialog::backdrop { background: color-mix(in srgb, var(--c-shell) 45%, transparent); }

/* T07 单件货：脚本切换显示的区块用 hidden 属性，不让 .stack 等 display 规则把它顶出来 */
[hidden] { display: none !important; }

/* T07 货签：每件一张，二维码 + 编号；打印时只留货签 */
.label-sheet { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--s-3); }
.tag-label { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-3); background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--r-md); break-inside: avoid; }
.tag-qr svg { display: block; width: 96px; height: 96px; }
.tag-text { display: flex; flex-direction: column; min-width: 0; }
.tag-code { font-family: var(--font-mono); font-size: var(--fs-title); }
@media print {
  .rail, .topbar, .tabbar, .skip-link, .no-print { display: none !important; }
  .layout, .main, .page { display: block; padding: 0; margin: 0; max-width: none; }
  .tag-label { border-color: #000; }
}

/* T07：宽表在面板内横向滚动，不撑开页面（单件明细老板视角 7 列） */
.stack > .panel { min-width: 0; }

/* T13 销售单录入：卖法切换（无 JS，用 :has 按选中的单选框显示整批卖或拆开卖的输入） */
.sale-form:has(input[name="mode"][value="whole"]:checked) .split-only { display: none; }
.sale-form:not(:has(input[name="mode"][value="whole"]:checked)) .whole-only { display: none; }
.line-table select { width: 100%; min-width: 14rem; }

/* Impeccable 复审 T11：手机上调拨行的操作按钮占满一行，长按钮（“南宁分仓确认收货”）不被挤出卡片 */
@media (max-width: 767px) {
  table.stack-mobile td.cell-action { grid-column: 1 / -1; }
  table.stack-mobile td.cell-action .btn { width: 100%; }
}
/* T12 合 main 后 widths“出界”检查：平板宽度（768–1023）五列调拨表放不下“南宁分仓确认收货”，超出面板 12px。
   同一行“路线”已写明收货库位，所以这档宽度只把仓名从按钮上视觉隐藏，读屏仍读“南宁分仓确认收货”。 */
@media (min-width: 768px) and (max-width: 1023px) {
  td.cell-action .wh-prefix { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
}

/* Impeccable 复审 T10：付款进度里 .pay-list{margin:0}（design.css）盖掉了 .mt-4，未付合计和第一笔条款连成一句；
   合计块与明细列表之间留出间距并加一条分隔线 */
.pay-list.mt-4 { margin-top: var(--s-4); }
.pay-list.mt-2 { margin-top: var(--s-2); }  /* 冲抵余额（ADR 0025）：来源单“可冲抵余额已抵到”小标题下的列表 */
/* 分段控件选项多时（记收款页多出“用可冲抵余额抵”，ADR 0025）：整行放，选项不拆字；窄屏排成两列两行 */
.segmented-wrap label { white-space: nowrap; }
@media (max-width: 479px) {
  .segmented-wrap { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
  .segmented-wrap label { justify-content: center; padding: 0 8px; }
  .segmented-wrap label:nth-child(odd) { border-left: 0; }
  .segmented-wrap label:nth-child(n+3) { border-top: 1px solid var(--c-border-strong); }
}
.kv + .pay-list, .pay-list + .kv { padding-top: var(--s-4); border-top: 1px solid var(--c-border); }

/* Impeccable 复审 T11：库存、仓库与库位按仓库分卡，各卡表头相同；固定列宽让各卡的列上下对齐（手机上是字段列表，不受影响） */
@media (min-width: 768px) {
  table.cols-even { table-layout: fixed; width: 100%; }
  table.cols-even th:first-child { width: 30%; }
}

/* T17 库存总览：筛选下拉框按内容宽度排在搜索框后面（全局 select 是整行宽），窄屏自动换行 */
.filters select { width: auto; flex: 0 1 auto; max-width: 100%; }
/* 键盘焦点不被吸底操作条、手机底栏盖住（WCAG 2.4.11，T13 评审 P2-1）：Tab 到的控件滚进视口时底部留出这些条的高度。
   数值对应 design.css：桌面吸底操作条约 72px；手机底栏 56px + 固定操作条（合计行折一行时约 120px）。tests/browser/focus.py 逐页核对。 */
html { scroll-padding-bottom: 16px; }
html:has(.form-actions) { scroll-padding-bottom: 120px; }
@media (max-width: 767px) {
  html { scroll-padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
  html:has(.form-actions) { scroll-padding-bottom: calc(56px + 144px + env(safe-area-inset-bottom)); }
}

/* T18 库龄横幅（设计图 10）：“只看库龄关注”是提交筛选的按钮，样子同链接；横幅里几个入口排一行，窄屏换行 */
.banner .link-btn { padding: 0; border: 0; background: none; font: inherit; font-weight: 600; color: inherit; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.banner-links { display: flex; flex-wrap: wrap; gap: var(--s-1) var(--s-4); margin-top: var(--s-1); }
.banner-links a { color: inherit; font-weight: 600; }

.btn:has(.wh-prefix) { gap: 0; } /* T18：仓名和“确认收货”之间不要按钮图标间距（1440 宽看截图发现） */

/* T19 利润报表：页头的期间表单（两个日期 + 查看）。design.css 里日期框 width:100%，在页头 .actions 里会一项一行，这里改成一行排。 */
.page-header .actions.period { flex-wrap: nowrap; }
.page-header .actions.period input[type="date"] { width: 11.5rem; flex: 0 0 auto; }
.page-header .actions.period .btn { flex: 0 0 auto; white-space: nowrap; }
.page-header .actions.period label:not(.sr-only) { align-self: center; color: var(--c-text-secondary); white-space: nowrap; }
@media (max-width: 767px) {
  /* 手机：两个日期各占半行，“查看”换到下一行占满，不再被挤成“查/看”两行 */
  .page-header .actions.period { flex-wrap: wrap; }
  .page-header .actions.period input[type="date"] { width: auto; flex: 1 1 0; min-width: 0; padding-left: 8px; padding-right: 4px; }
  .page-header .actions.period .btn { flex: 1 1 100%; }
}
/* 公式只在空格（运算符两侧）处折行，不把“销售收入”拆成“销 / 售收入” */
.keep-all { word-break: keep-all; }
/* T23 附件：小图铺满 84×84 方块；文件行里的链接不套 .todo a 的整行样式；面板“上传”链接触控 44px */
.photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
a.photo { text-decoration: none; }
.todo .todo-row.file-row { grid-template-columns: auto 1fr auto; }
.todo .file-row a { display: inline; padding: 0; min-height: 0; color: var(--c-link); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.todo .file-row a.icon-btn { display: inline-grid; color: var(--c-text-secondary); text-decoration: none; }
.todo .file-row .sub { display: block; }
.panel-head a.link-btn { display: inline-flex; align-items: center; min-height: 44px; }
.photo-add svg { width: 24px; height: 24px; }
.panel-foot p { text-wrap-style: balance; }  /* 附件面板底部“这里不显示”说明两行均分，避免末行只剩“可见” */
/* T23：出错时下拉框也是红框（design.css 只管了 input）；选文件的 input 藏在方块里，红框加在方块上 */
select[aria-invalid="true"] { border-color: var(--c-critical); box-shadow: 0 0 0 1px var(--c-critical); }
.photo-add:has(input[aria-invalid="true"]) { border-color: var(--c-critical); box-shadow: 0 0 0 1px var(--c-critical); }

/* T12 盘点填写页：行内错误和结果徽章可以换行，不把表格行撑出屏幕（tests/browser/count_errors_t12.py） */
.count-table td.num .error-text { white-space: normal; text-align: left; align-items: flex-start; }
.count-table .badge { white-space: normal; }
@media (max-width: 767px) { .count-table tr > td { min-width: 0; } }

/* 利润报表（T19 复核 P3-3/P3-6）：宽屏名称列留足宽度，大额时整表横向滚动而不是把供应商名挤成两行；
   窄屏 5 个维度页签挤在一行，卡片里千亿级金额折行而不是被截掉。 */
@media (min-width: 768px) { table.profit-table td.cell-main { min-width: 18em; } }
@media (max-width: 767px) {
  .tabs.tabs-fit { flex-wrap: nowrap; gap: 0; overflow-x: auto; }
  .tabs.tabs-fit a { flex: 1 1 auto; justify-content: center; padding: 0 var(--s-2); }
  table.stack-mobile.profit-table tr { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  table.stack-mobile.profit-table td.num, table.stack-mobile.profit-table td.num .nowrap { white-space: normal; overflow-wrap: anywhere; }
}
/* T24 手机入库：步进框出错时整框红（输入框本身无边框）、相机扫码浮层、扫码就地提示、单件卡 */
.stepper:has(input[aria-invalid="true"]) { border: 2px solid var(--c-critical); }
.stepper button:focus-visible { outline: 2px solid var(--c-focus); outline-offset: -2px; }
.stepper input:focus-visible { outline: 2px solid var(--c-focus); outline-offset: -2px; }
.scan-msg:empty { display: none; }
.scan-msg p { margin: 0; }
.cam-box { position: relative; aspect-ratio: 4 / 3; border-radius: var(--r-md); overflow: hidden; background: var(--c-shell); }
.cam-box video { display: block; width: 100%; height: 100%; object-fit: cover; }
.cam-aim { position: absolute; inset: 18% 22%; border: 2px solid var(--c-on-shell); border-radius: var(--r-md); box-shadow: 0 0 0 999px color-mix(in srgb, var(--c-shell) 35%, transparent); }

.unit-hit .kv dd { overflow-wrap: anywhere; }
/* 提示条里的操作按钮单独一行，不挤在说明文字后面 */
.banner [data-retry], .banner [data-discard] { display: flex; width: fit-content; margin-top: var(--s-2); }
/* 外观三选一（T27，★ 第 103 条）：更多页“账号”里；按钮版的 .segmented，提交即生效 */
.theme-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-3); padding: var(--s-3) var(--s-4); }
.theme-label { font-weight: 600; margin-right: auto; }
.menu-list .segmented button { width: auto; min-height: var(--control-h); padding: 0 14px; font-weight: 600; color: var(--c-text); }
.segmented button + button { border-left: 1px solid var(--c-border-strong); }
.menu-list .segmented button[aria-pressed="true"] { background: var(--c-primary); color: var(--c-on-primary); }
.segmented button:focus-visible { outline: 2px solid var(--c-focus); outline-offset: -3px; }
@media (pointer: coarse) { .menu-list .segmented button { min-height: 44px; } }
/* T25：备份失败横幅里给运维的原始报错单独一行、等宽小字，长路径可在任意处折行，不撑破手机宽度 */
.banner .err-raw { display: block; margin-top: var(--s-2); font-size: var(--fs-caption); }
.banner .err-raw code { font-family: var(--font-mono); overflow-wrap: anywhere; }
