/* =========================================================
   UI修复样式 —— Fix overlapping fonts & uneven distribution
   Inject into all pages. Do NOT alter the visual theme.
   ========================================================= */

/* ---------- 1. 全局表格溢出修复 ---------- */
/* 防止固定宽度列内的文本互相遮盖 */
/* 仅在设置了固定宽度的单元格上启用省略号 */
table td[width],
table th[width],
table td[style*="width"],
table th[style*="width"] {
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 0;
}

/* 让没有宽度属性的列正常显示 */
table td:not([width]):not([style*="width"]),
table th:not([width]):not([style*="width"]),
.sp-table td:not([width]):not([style*="width"]),
.gt-table td:not([width]):not([style*="width"]),
.goods-table td:not([width]):not([style*="width"]),
.lp-table td:not([width]):not([style*="width"]),
.data-table td:not([width]):not([style*="width"]) {
  max-width: none;
  overflow: visible;
}

/* lp-table (左侧列表) 确保所有列窄列不溢出 */
.lp-table td,
.lp-table th {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 左侧列表lp-table 防止数字裂开（需将word-break设为keep-all且不拆词） */
.lp-table td {
  word-break: keep-all;
}

/* 客户名称需要可截断+提示 */
.lp-table td {
  max-width: 0;
}

/* ---------- 2. 窄列最小宽度修复 ---------- */
/* 采购单/销售单的商品表格窄列 */
.goods-table th[style*="width:50px"],
.goods-table td[style*="width:50px"],
.gt-table th[style*="width:50px"],
.gt-table td[style*="width:50px"] {
  min-width: 50px !important;
}
.goods-table th[style*="width:60px"],
.goods-table td[style*="width:60px"],
.gt-table th[style*="width:60px"],
.gt-table td[style*="width:60px"] {
  min-width: 60px !important;
}
.goods-table th[style*="width:70px"],
.goods-table td[style*="width:70px"],
.gt-table th[style*="width:70px"],
.gt-table td[style*="width:70px"] {
  min-width: 70px !important;
}
.goods-table th[style*="width:75px"],
.goods-table td[style*="width:75px"] {
  min-width: 75px !important;
}
.goods-table th[style*="width:80px"],
.goods-table td[style*="width:80px"] {
  min-width: 80px !important;
}
.goods-table th[style*="width:65px"],
.goods-table td[style*="width:65px"] {
  min-width: 65px !important;
}

/* 销售单特殊的“折扣(%)”等中文表头需足够空间 */
.gt-table th[style*="width:45px"],
.gt-table td[style*="width:45px"] {
  min-width: 50px !important;
}
.gt-table th[style*="width:42px"],
.gt-table td[style*="width:42px"] {
  min-width: 48px !important;
}
.gt-table th[style*="width:46px"],
.gt-table td[style*="width:46px"] {
  min-width: 56px !important;
}
.gt-table th[style*="width:48px"],
.gt-table td[style*="width:48px"] {
  min-width: 60px !important;
}
.gt-table th[style*="width:52px"],
.gt-table td[style*="width:52px"] {
  min-width: 60px !important;
}
.gt-table th[style*="width:55px"],
.gt-table td[style*="width:55px"] {
  min-width: 60px !important;
}
.gt-table th[style*="width:68px"],
.gt-table td[style*="width:68px"] {
  min-width: 72px !important;
}

/* ---------- 3. Filter栏间距修复 ---------- */
/* 防止筛选栏元素折行后紧密重叠 */
.lp-filter .lp-filter-row,
.lp-filter .lfr,
.sp-filter .sp-row,
.filter-section,
.filter-bar {
  gap: 8px 12px !important;
  margin-bottom: 8px;
}

.lp-filter-row label,
.lfr .lfr-lbl,
.sp-row .sp-lbl,
.filter-section label,
.filter-bar .filter-label {
  min-width: 32px;
  flex-shrink: 0;
}

/* ---------- 4. 表格中文字折行控制 ---------- */
/* 让中文不折行发生断词，但超出部分用省略号 */
/* action-cell 除外（操作按钮区域可换行） */
table td,
.sp-table td,
.gt-table td,
.goods-table td,
.lp-table td,
.data-table td {
  white-space: nowrap;
}

/* 允许备注/描述列自然换行（只对含“备注”语义的列生效，避免对数字列造成破碎） */
table td.remark,
.goods-table td.remark,
.gt-table td.remark,
.sp-table td.remark,
.lp-table td.remark,
.data-table td.remark,
table td.col-remark,
table td[class*="remark"] {
  word-break: break-all;
  white-space: normal;
}

/* 商品表格所有表头统一缩小字体以适配窄列 */
.goods-table th {
  font-size: 11px !important;
  white-space: nowrap !important;
  line-height: 1.3 !important;
  padding: 6px 5px !important;
}

/* 销售单商品表格头也不换行 */
.gt-table th {
  font-size: 11px !important;
  white-space: nowrap !important;
  line-height: 1.3 !important;
  padding: 6px 5px !important;
}

/* 窄列输入框需要适当高度和边框 */
.goods-table input[type="number"],
.gt-table input[type="number"] {
  height: 24px !important;
  padding: 2px 4px !important;
  font-size: 12px !important;
  border: 1px solid #d0d0d0 !important;
  border-radius: 3px !important;
  background: #fff !important;
  text-align: center;
}

.goods-table input[type="text"],
.gt-table input[type="text"] {
  height: 24px !important;
  padding: 2px 6px !important;
  font-size: 12px !important;
  border: 1px solid #d0d0d0 !important;
  border-radius: 3px !important;
  background: #fff !important;
}

/* 销售单数字/金额输入框右对齐 */
.gt-table input.gt-money {
  text-align: right !important;
}

.gt-table input[type="number"]:not(.gt-money) {
  text-align: center !important;
}

/* 商品表格序号/操作列窄列 */
.goods-table th[style*="width:24px"],
.goods-table td[style*="width:24px"],
.goods-table th[style*="width:26px"],
.goods-table td[style*="width:26px"] {
  min-width: 22px !important;
  padding: 4px 2px !important;
}

/* ---------- 5. 三列/多列表单网格修复 ---------- */
/* 防止表单标签被输入框挤压，或输入框太小 */
.form-grid,
.sf-grid {
  column-gap: 12px !important;
  row-gap: 10px !important;
}

/* 修复 filter 行中 label 和 select/input 垂直不对齐 */
.lp-filter-row,
.lfr,
.sp-row,
.filter-bar {
  display: flex;
  align-items: center !important;
  flex-wrap: wrap;
}

.lp-filter-row label,
.lfr label,
.sp-row label,
.filter-bar label {
  display: inline-flex;
  align-items: center;
  line-height: 2;
}

.ff-item,
.sf-item {
  min-width: 0;
}

.ff-label,
.sf-lbl {
  flex-shrink: 0;
  margin-bottom: 3px;
}

.ff-input,
.sf-input {
  min-height: 32px;
  box-sizing: border-box;
}

/* ---------- 6. Input/Select 对齐修复 ---------- */
/* 使各种输入框高度对齐，避免行内不对齐 */
input[type="text"],
input[type="number"],
input[type="date"],
input[type="search"],
select,
.sp-inp,
.sp-sel,
.lfr-inp,
.lfr-sel,
.filter-input,
.filter-select,
.form-control {
  box-sizing: border-box;
  vertical-align: middle;
  line-height: normal;
}

/* filter行内的checkbox和label对齐 */
.sp-cb,
label.sp-cb,
.sp-row label[style*="display:flex"],
.lfr label {
  align-items: center;
  gap: 4px;
  vertical-align: middle;
}

/* checkbox与文字水平居中 */
.sp-cb input[type="checkbox"],
.lp-table input[type="checkbox"],
.lfr input[type="checkbox"],
.filter-section input[type="checkbox"] {
  margin-top: 0;
  vertical-align: middle;
}

/* ---------- 7. 商品明细表「折叠的表格滚动」修复 ---------- */
/* 让窄表格保证至少能显示完整文字 */
.goods-table-wrapper,
.gt-wrapper {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.goods-table,
.gt-table {
  min-width: 900px; /* 大表保证可横向滚动 */
}

/* ---------- 8. 顶部导航紧凑修复 ---------- */
/* 导航项多时不会重叠 */
.header-nav {
  gap: 2px;
  overflow: hidden;
}

.header-nav-item > .nav-label {
  padding: 6px 10px;
  font-size: 13px;
}

/* ---------- 9. 弹窗内容溢出修复 ---------- */
.modal-body {
  overflow-x: hidden;
  word-break: break-word;
}

/* ---------- 10. 统计数据面板对齐修复 ---------- */
.stats-panel .stats-row,
.stat-bar {
  gap: 16px 24px;
}

/* ---------- 11. 选择商品弹窗表格修复 ---------- */
.modal-body .table th,
.modal-body .table td {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ---------- 12. 按钮行内图标文字对齐 ---------- */
.btn i,
.rp-btn i,
.sp-btn i,
.ba-btn i,
.lfr-btns button i {
  vertical-align: middle;
  margin-right: 2px;
}

/* ---------- 13. 商品表格数量/价格/折扣输入框对齐 ---------- */
.goods-table input[type="number"],
.gt-table input[type="number"],
.sp-inp[type="number"] {
  text-align: center;
  -moz-appearance: textfield;
}

.goods-table input[type="number"]::-webkit-inner-spin-button,
.gt-table input[type="number"]::-webkit-inner-spin-button,
.sp-inp[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* ---------- 14. 面包屑区域对齐 ---------- */
.breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
}

/* ---------- 15. 采购单左侧筛选区字体紧凑修复 ---------- */
.lp-filter-row label {
  font-size: 12px !important;
  white-space: nowrap;
  flex-shrink: 0;
}

.lp-filter-row input[type="date"] {
  width: 130px !important;
}

.lp-filter-row input[type="text"] {
  width: 120px !important;
}

.lp-filter-row select {
  width: 110px !important;
}

/* 采购单表格列对齐修复 */
.goods-table td[style*="text-align:center"] {
  text-align: center;
  vertical-align: middle;
}

/* 右侧面板操作按钮行换行保护 */
.rp-header-actions {
  flex-wrap: wrap;
  gap: 4px;
}

.rp-header-actions button {
  font-size: 11px !important;
  padding: 4px 8px !important;
}

/* ---------- 16. 销售单布局修复 ---------- */
/* 销售单左侧筛选区紧凑对齐 */
.lfr {
  gap: 4px 6px;
}

.lfr-inp[type="text"] {
  width: 100px !important;
}

.lfr-sel {
  width: 85px !important;
}

.lfr-date {
  width: 100px !important;
}

/* 销售单tabs标签 */
.tab-sidebar .ts-item {
  padding: 12px 6px;
  font-size: 12px;
}

/* 销售单商品表格合计/底部对齐 */
.gt-summary {
  gap: 12px;
}

/* 销售单底部结算区换行 */
.bottom-settle {
  gap: 6px;
}

/* ---------- 17. 响应式微调 ---------- */
@media (max-width: 1200px) {
  .header-nav-item > .nav-label {
    padding: 5px 7px;
    font-size: 12px;
  }
  .form-grid,
  .sf-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 768px) {
  .form-grid,
  .sf-grid {
    grid-template-columns: 1fr !important;
  }
  .lp-filter-row {
    flex-direction: column;
    align-items: stretch;
  }
  .lp-filter-row > * {
    width: 100% !important;
  }
}