/* 全局基础样式。antd 5 是 CSS-in-JS，这里只放最小 reset。 */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html,
body,
#root {
  height: 100%;
}

/* 界面密度（个人设置，ThemeContext 写在 <html data-density>）：只调卡片之间的间距与页面留白，
   控件、字号、卡片内边距不变。layout.tsx 等布局件引用这几个变量 */
:root {
  --page-pad-y: 16px;
  --page-pad-x: 24px;
  /* 并排 / 上下堆叠的卡片之间 */
  --card-gap: 16px;
  /* 同一栏里纵向堆叠的卡片之间（详情栏、表格上方的提示条等） */
  --stack-gap: 12px;
}
:root[data-density='compact'] {
  --page-pad-y: 8px;
  --page-pad-x: 12px;
  --card-gap: 8px;
  --stack-gap: 8px;
}

body {
  font-family:
    'Microsoft YaHei UI',
    'Microsoft YaHei',
    'PingFang SC',
    'Noto Sans SC',
    -apple-system,
    'Segoe UI',
    sans-serif;
  color: var(--c-ink, #1d232b);
  background: var(--c-paper, #f4f2ee);
  -webkit-font-smoothing: antialiased;
}

::selection {
  background: color-mix(in srgb, var(--theme-primary, #b8581a) 22%, transparent);
}

/* ---------- 方案A 通用样式 ---------- */

/* 金额、单号、时间等数字一律等宽对齐 */
.num {
  font-family: 'JetBrains Mono', 'Cascadia Mono', Consolas, 'SF Mono', monospace;
  font-variant-numeric: tabular-nums;
}

/* 主从分栏：当前选中行（配合 Table rowClassName） */
.ant-table-wrapper .ant-table-tbody > tr.row-active > td {
  background: var(--table-row-selected, #fbf1e7);
}
.ant-table-wrapper .ant-table-tbody > tr.row-active > td:first-child {
  box-shadow: inset 3px 0 0 var(--theme-primary, #b8581a);
}
.ant-table-wrapper .ant-table-tbody > tr.row-clickable {
  cursor: pointer;
}

/* 细滚动条 */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-thumb {
  background: var(--scroll-thumb, #d3cdc2);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--scroll-thumb-hover, #b8b0a3);
}
::-webkit-scrollbar-track {
  background: transparent;
}

/* 无边框窗口：顶栏可拖拽，交互元素排除 */
.drag-region {
  -webkit-app-region: drag;
}
.drag-region button,
.drag-region input,
.drag-region a,
.drag-region .ant-select,
.drag-region .ant-picker,
.drag-region .ant-segmented,
.drag-region .no-drag {
  -webkit-app-region: no-drag;
}

/* 左侧图标栏 */
.rail-item {
  width: 48px;
  height: 48px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 21px;
  color: var(--rail-icon, #a7afba);
  border: 0;
  background: transparent;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    color 0.15s ease;
}
.rail-item:hover {
  color: var(--rail-hover-fg, #fff);
  background: var(--rail-hover-bg, rgba(255, 255, 255, 0.08));
}
.rail-item.active {
  color: var(--rail-active-fg, #fff);
  background: var(--rail-active-bg, rgba(255, 255, 255, 0.12));
}
.rail-item:focus-visible,
.chip:focus-visible,
.subnav-item:focus-visible {
  outline: 2px solid var(--theme-primary, #b8581a);
  outline-offset: 2px;
}

/* 对话框/抽屉的遮罩让出左侧图标栏（宽度同 sizes.railWidth），对话框在内容区内居中；
   body.has-rail 由 MainLayout 挂载时添加，登录页与独立子窗口不受影响 */
body.has-rail .ant-modal-mask,
body.has-rail .ant-modal-wrap,
body.has-rail .ant-drawer-mask {
  left: 68px;
}

/* 胶囊筛选按钮（状态流水线、来源、分类快捷切换） */
.chip {
  height: 34px;
  padding: 0 12px;
  border-radius: 8px;
  font-size: 13px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--c-line-strong, #dad5cb);
  background: var(--c-surface, #fff);
  color: var(--c-ink, #1d232b);
  cursor: pointer;
  white-space: nowrap;
  font-family: inherit;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease;
}
.chip:hover {
  border-color: var(--scroll-thumb-hover, #b8b0a3);
}
.chip .chip-count {
  font-size: 12px;
  color: var(--c-muted, #5e6570);
}
.chip.active {
  border-color: transparent;
  background: var(--chip-active-bg, #1d232b);
  color: #fff;
}
.chip.active .chip-count {
  color: var(--chip-active-count, #e9dccb);
}

/* 二级导航（系统设置、分类树等竖向列表项） */
.subnav-item {
  height: 38px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 10px;
  border-radius: 8px;
  font-size: 14px;
  color: var(--c-ink, #1d232b);
  cursor: pointer;
  border: 0;
  background: transparent;
  width: 100%;
  text-align: left;
  font-family: inherit;
}
/* 侧栏各项保持固定高度：窗口变矮时侧栏自己出纵向滚动条，而不是把每项压扁、间距挤乱 */
.side-nav > * {
  flex-shrink: 0;
}
.subnav-item:hover {
  background: var(--c-paper-inset, #f1ede6);
}
.subnav-item.active {
  background: color-mix(in srgb, var(--theme-primary, #b8581a) 10%, #fff);
  color: color-mix(in srgb, var(--theme-primary, #b8581a) 75%, #000);
  font-weight: 500;
}

/* fit-table：表格主体（含横向滚动条）拉伸填满容器、分页器贴底。
   高度沿 antd 内部结构逐层下传：wrapper → spin → table → container → body，
   覆盖 scroll.y 注入的 max-height，让 body 由 flex 决定高度——
   数据少时空白留在表格内部，横向滚动条始终贴在容器底部（分页器上方）。
   需配合 Table 传 scroll.y（触发固定表头的 header/body 分离结构）。 */
.fit-table {
  height: 100%;
}
.fit-table .ant-table-wrapper,
.fit-table .ant-spin-nested-loading,
.fit-table .ant-spin-container {
  height: 100%;
}
.fit-table .ant-spin-container {
  display: flex;
  flex-direction: column;
}
.fit-table .ant-table {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.fit-table .ant-table-container {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.fit-table .ant-table-header {
  flex-shrink: 0;
}
.fit-table .ant-table-body {
  flex: 1;
  min-height: 0;
  max-height: none !important;
}
.fit-table .ant-table-pagination.ant-pagination {
  margin-bottom: 0;
}

/* drawer-fill-spin：抽屉/弹窗里包住整块内容的 Spin 撑满父容器高度（配合 fit-tabs） */
.drawer-fill-spin {
  flex: 1;
  min-height: 0;
}
.drawer-fill-spin > .ant-spin-container {
  height: 100%;
}

/* fit-tabs：让 antd Tabs 的内容区撑满父容器（配合表格自适应高度） */
.fit-tabs {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.fit-tabs .ant-tabs-content-holder {
  flex: 1;
  min-height: 0;
}
.fit-tabs .ant-tabs-content {
  height: 100%;
}
.fit-tabs .ant-tabs-tabpane {
  height: 100%;
  display: flex;
  flex-direction: column;
}
/* 上面的 display:flex 会盖掉 antd 对非当前标签页的隐藏；forceRender 预渲染的
   面板必须保持隐藏，否则所有标签页内容会叠在一起显示 */
.fit-tabs .ant-tabs-tabpane-hidden {
  display: none;
}

/* fill-spin：带内容的 Spin 撑满父容器（配合 Spin 的 wrapperClassName 使用） */
.fill-spin,
.fill-spin > .ant-spin-container {
  height: 100%;
}

/* 销售列表订单编号：虚线下划线提示可悬浮查看商品明细 */
.order-no-hover {
  cursor: default;
  border-bottom: 1px dashed currentColor;
  padding-bottom: 1px;
}
.order-no-hover:hover {
  color: var(--theme-primary, #b8581a);
}