/*
 * 吉瑞祥实业发展集团运营管理平台：全站唯一的基础样式令牌。
 *
 * 页面样式只负责业务布局；字体、字号、字重、基础配色、间距和圆角从这里取值。
 * 详细规则见 docs/internal-ui-style-guide.md。
 */

/* Numeric values must only change through deliberate typing. */
input[type="number"] {
  -moz-appearance: textfield;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  margin: 0;
  -webkit-appearance: none;
}

/* 表单里的日期/时间控件内容本身就是纯字母数字，固定用全站等宽字体。 */
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"],
input[type="week"] {
  font-family: var(--ui-font-mono);
  letter-spacing: 0;
}

:root {
  color-scheme: light;

  --ui-bg: #f5f5f5;
  --ui-panel: #ffffff;
  --ui-header: #ededed;
  --ui-border: #d0d0d0;
  --ui-border-strong: #b8b8b8;
  --ui-text: #1a1a1a;
  --ui-text-muted: #555555;
  --ui-text-subtle: #888888;
  --ui-accent: #1565c0;
  --ui-accent-hover: #0d47a1;
  --ui-accent-soft: #edf5ff;
  --ui-danger: #c62828;
  --ui-danger-soft: #fbe9e9;
  --ui-loading: #c2410c;
  --ui-loading-dark: #8f2d05;
  --ui-success: #2e7d32;
  --ui-success-soft: #e6f4ea;
  --ui-warning: #9a6700;
  --ui-warning-soft: #fff8e8;

  /* Win10 简体中文 + Chrome：拉丁字形用 Segoe UI，汉字逐字回退到微软雅黑。 */
  --ui-font-sans:
    "Segoe UI", "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", Arial,
    sans-serif;
  /* 全站等宽字体：业务表格里的订单号、账号、日期等纯字母数字内容统一用它。 */
  --ui-font-mono: "Courier New", "Lucida Console", Menlo, monospace;
  --ui-font-size-body: 12px;
  --ui-font-size-title: 16px;
  --ui-font-weight-regular: 400;
  --ui-font-weight-semibold: 600;
  --ui-line-height: 1.5;

  --ui-space-1: 4px;
  --ui-space-2: 8px;
  --ui-space-3: 12px;
  --ui-space-4: 16px;
  --ui-space-5: 20px;
  --ui-space-6: 24px;
  --ui-page-gutter: 16px;
  --ui-radius: 3px;
  --ui-control-height: 30px;

  /* 旧页面沿用的短名字。改颜色或字号只改上面的 --ui-*。 */
  --bg: var(--ui-bg);
  --panel: var(--ui-panel);
  --border: var(--ui-border);
  --border-2: var(--ui-border-strong);
  --border-strong: var(--ui-border-strong);
  --text: var(--ui-text);
  --text-2: var(--ui-text-muted);
  --text-3: var(--ui-text-subtle);
  --muted: var(--ui-text-muted);
  --subtle: var(--ui-text-subtle);
  --link: var(--ui-accent);
  --link-h: var(--ui-accent-hover);
  --blue: var(--ui-accent);
  --blue-dark: var(--ui-accent-hover);
  --blue-soft: var(--ui-accent-soft);
  --warn: var(--ui-danger);
  --warn-bg: var(--ui-danger-soft);
  --red: var(--ui-danger);
  --red-soft: var(--ui-danger-soft);
  --ok: var(--ui-success);
  --ok-bg: var(--ui-success-soft);
  --green: var(--ui-success);
  --green-soft: var(--ui-success-soft);
  --amber: var(--ui-warning);
  --amber-soft: var(--ui-warning-soft);
  --r: var(--ui-radius);
  --radius: var(--ui-radius);
  --gap: var(--ui-space-2);
  --gap-2: var(--ui-space-4);
  --gap-3: var(--ui-space-6);
  --font: var(--ui-font-sans);
  --mono: var(--ui-font-mono);
  --fs: var(--ui-font-size-body);
  --fs-title: var(--ui-font-size-title);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-family: var(--ui-font-sans);
}

body {
  margin: 0;
  color: var(--ui-text);
  background: var(--ui-bg);
  font-size: var(--ui-font-size-body);
  line-height: var(--ui-line-height);
  font-weight: var(--ui-font-weight-regular);
  font-variant-numeric: tabular-nums;
}

button,
input,
select,
textarea {
  color: inherit;
  font: inherit;
}

[hidden] {
  display: none !important;
}

/*
 * 全站唯一的加载提示：固定悬浮，不占文档流，也不拦截页面操作。
 * 橙色实底、加粗大字和高对比图标保证足够醒目；显示/隐藏只改变透明度和位移。
 */
.ui-global-loading {
  position: fixed;
  z-index: 90;
  top: 88px;
  left: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 52px;
  max-width: calc(100vw - 32px);
  padding: 10px 20px;
  border: 2px solid var(--ui-loading-dark);
  border-radius: 999px;
  color: #ffffff;
  background: var(--ui-loading);
  box-shadow:
    0 8px 24px rgba(143, 45, 5, 0.3),
    0 2px 6px rgba(0, 0, 0, 0.18);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.02em;
  white-space: nowrap;
  pointer-events: none;
  visibility: hidden;
  opacity: 0;
  transform: translate(-50%, -8px) scale(0.98);
  transition:
    opacity 140ms ease,
    transform 160ms cubic-bezier(0.2, 0.8, 0.2, 1),
    visibility 0s linear 160ms;
}
.ui-global-loading.is-visible {
  visibility: visible;
  opacity: 1;
  transform: translate(-50%, 0) scale(1);
  transition-delay: 0s;
}
.ui-global-loading-icon {
  flex: none;
  width: 28px;
  height: 28px;
  animation: ui-global-loading-spin 0.7s linear infinite;
}
@keyframes ui-global-loading-spin {
  to {
    transform: rotate(360deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .ui-global-loading {
    transition: none;
  }
  .ui-global-loading-icon {
    animation-duration: 2.4s;
  }
}

h1,
h2,
h3,
h4,
h5,
h6,
strong,
b {
  font-weight: var(--ui-font-weight-semibold);
}

.app-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 40px;
  padding: 8px 16px;
  border-bottom: 1px solid var(--ui-border);
  background: var(--ui-panel);
}

.app-header h1 {
  margin: 0;
  font-size: var(--ui-font-size-title);
  font-weight: var(--ui-font-weight-semibold);
  white-space: nowrap;
}

.app-header h1 a {
  color: var(--ui-text);
  text-decoration: none;
}

.app-header h1 a:hover {
  text-decoration: none;
}

.head-r {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  color: var(--ui-text-muted);
}

.head-r .user {
  color: var(--ui-text);
}

.head-r .role {
  margin-left: 4px;
  color: var(--ui-text-muted);
  background: #e0e0e0;
}

.head-r .role.admin {
  color: var(--ui-warning);
  background: var(--ui-warning-soft);
}

.head-r .link {
  padding: 0;
  border: 0;
  color: var(--ui-accent);
  background: none;
  cursor: pointer;
  text-decoration: underline;
}

.head-r .link:hover {
  color: var(--ui-accent-hover);
}

.workspace-nav {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  min-height: 36px;
  padding: 0 8px;
  overflow-x: auto;
  border-bottom: 1px solid var(--ui-border);
  background: var(--ui-panel);
}

.workspace-nav-divider {
  flex: 0 0 1px;
  width: 1px;
  margin: 8px 6px;
  background: var(--ui-border-strong);
}

.workspace-tab {
  flex: 0 0 auto;
  padding: 8px 10px;
  border: 0;
  border-bottom: 2px solid transparent;
  color: var(--ui-text-muted);
  background: transparent;
  white-space: nowrap;
  text-decoration: none;
}

.workspace-nav a.workspace-tab:hover {
  color: var(--ui-accent);
  text-decoration: none;
}

.workspace-tab.active {
  border-bottom-color: var(--ui-accent);
  color: var(--ui-accent);
  font-weight: var(--ui-font-weight-semibold);
}

/*
 * 工具面板标签页（采集状态 / 导入日志 / 操作审计）：
 * 位于常驻导航之后，由 app-chrome.js 按 sessionStorage 里打开过的集合渲染。
 * 本体是真实链接，右侧的 × 是独立的关闭按钮（嵌套 <button> 在 <a> 里不合法，
 * 所以这里是“链接 + 按钮”的组合，视觉上并成一个标签）。
 */
.workspace-tool-tabs {
  display: flex;
  flex: 0 0 auto;
  align-items: stretch;
}

.workspace-tool-tab {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  border-bottom: 2px solid transparent;
  color: var(--ui-text-muted);
  white-space: nowrap;
}

.workspace-tool-tab:hover {
  color: var(--ui-accent);
}

.workspace-tool-tab.active {
  border-bottom-color: var(--ui-accent);
  color: var(--ui-accent);
  font-weight: var(--ui-font-weight-semibold);
}

.workspace-tool-link {
  padding: 8px 2px 8px 10px;
  color: inherit;
  text-decoration: none;
}

.workspace-tool-link:hover {
  color: inherit;
  text-decoration: none;
}

.workspace-tool-close {
  margin: 0 4px 0 2px;
  padding: 0 4px;
  border: 0;
  border-radius: var(--ui-radius);
  color: var(--ui-text-subtle);
  background: none;
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
}

.workspace-tool-close:hover {
  color: var(--ui-danger);
  background: var(--ui-danger-soft);
}

.skip-link {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 1000;
  padding: 8px 12px;
  border-radius: var(--ui-radius);
  color: #fff;
  background: var(--ui-accent);
  transform: translateY(-150%);
  transition: transform 0.15s ease;
}

.skip-link:focus-visible {
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .skip-link {
    transition: none;
  }
}

.ui-page-shell {
  width: 100%;
  max-width: none;
  min-width: 0;
  margin: 0;
  padding: 12px var(--ui-page-gutter) 20px;
}

/*
 * 不可点击强调（状态/提醒/标签）的全站统一 pill 基线：
 * 无边框、无 hover、无手型，只靠底色与文字色表达强/弱提醒。
 * 业务页面只为各自的语义类补充颜色（如 .ma-status.expired、
 * .status-chip.overdue、.tag.warning），不要重新定义 padding/圆角，
 * 也不要让纯展示元素套用链接/按钮的边框与 hover 形制。
 */
.ma-status,
.ma-completeness,
.status-chip,
.tag,
.term-badge,
.issue-chip,
.ok-chip,
.ma-default-tag,
.readonly-badge,
.collect-gap-badge,
.head-r .role {
  display: inline-block;
  padding: 2px 6px;
  border-radius: 10px;
  line-height: var(--ui-line-height);
  white-space: nowrap;
}

/*
 * 全站统一 hover tooltip（替代原生 title 提示）。
 * 气泡由 frontend-utils.js 惰性挂到 <body> 下，position:fixed，
 * 因此不受表格容器 overflow:hidden/auto 的裁剪。
 */
.ui-tooltip {
  position: fixed;
  z-index: 10000;
  max-width: min(380px, calc(100vw - 16px));
  padding: 4px 8px;
  border-radius: var(--ui-radius);
  color: #fff;
  background: #2a2a2a;
  font-size: var(--ui-font-size-body);
  line-height: 1.5;
  white-space: pre-line;
  overflow-wrap: anywhere;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 90ms ease,
    visibility 0s linear 90ms;
  pointer-events: none;
}

.ui-tooltip.show {
  opacity: 1;
  visibility: visible;
  transition: opacity 90ms ease;
}

@media (prefers-reduced-motion: reduce) {
  .ui-tooltip,
  .ui-tooltip.show {
    transition: none;
  }
}

/*
 * UnifiedDataTable 的全站唯一主题。
 * 业务页只提供列定义、状态色和业务事件，不允许再覆盖表头、行高、单元格、
 * 筛选器、分页或分组样式。
 */
.ui-data-table.tabulator {
  width: 100%;
  border: 1px solid var(--ui-border);
  background: var(--ui-panel);
  color: var(--ui-text);
  font-family: var(--ui-font-sans);
  font-size: var(--ui-font-size-body);
  /*
   * Tabulator 自带 .tabulator{overflow:hidden}，会把下面的 sticky 表头困在
   * 表格盒子里直接失效；显式放开裁剪，让表头能相对窗口吸顶。
   */
  overflow: visible;
}

/*
 * 表头吸顶（全站所有统一表格）：表格跟着页面一起滚，列名和筛选框停在窗口
 * 顶部；sticky 的作用范围是表格自身，表格滚过去就自然收走，不会压住下一页内容。
 */
.ui-data-table.tabulator .tabulator-header {
  position: sticky;
  top: 0;
  z-index: 3;
  border-bottom: 1px solid var(--ui-border-strong);
  background: var(--ui-accent);
  color: #ffffff;
  font-weight: var(--ui-font-weight-regular);
}

.ui-data-table.tabulator .tabulator-header .tabulator-col {
  min-width: 0;
  border-right: 1px solid rgba(255, 255, 255, 0.25);
  background: var(--ui-accent);
}

.ui-data-table.tabulator .tabulator-col-title {
  color: #ffffff;
  font-weight: var(--ui-font-weight-regular);
}

.ui-data-table.tabulator
  .tabulator-headers
  .tabulator-col.tabulator-sortable:hover {
  background: var(--ui-accent-hover);
}

.ui-data-table.tabulator .tabulator-col-sorter .tabulator-arrow {
  border-top-color: rgba(255, 255, 255, 0.65);
  border-bottom-color: rgba(255, 255, 255, 0.65);
}

.ui-data-table.tabulator
  .tabulator-col-sorter.tabulator-col-sorter-element
  .tabulator-arrow:hover {
  border-top-color: #ffffff;
  border-bottom-color: #ffffff;
}

.ui-data-table.tabulator .tabulator-row {
  border-bottom: 1px solid var(--ui-border);
  cursor: default;
}

/* 普通数据行没有行级点击行为；覆盖 Tabulator 的 selectable 手型提示。 */
.ui-data-table.tabulator .tabulator-row.tabulator-selectable:hover {
  cursor: default;
}

.ui-data-table.tabulator .tabulator-row.tabulator-row-even {
  background: var(--ui-panel);
}

.ui-data-table.tabulator .tabulator-row:hover {
  background: #f7f9fc;
}

.ui-data-table.tabulator .tabulator-row .tabulator-cell {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  padding: 5px 8px;
  border-right: 1px solid var(--ui-border);
  cursor: default;
  overflow-wrap: anywhere;
  white-space: normal;
}

/*
 * 铺满型宽表（fitDataGrow / fitDataFill）优先把列收进可用视口：列宽靠内容
 * 测量 + 折行 + minWidth 收窄，正常情况下不会出现横向滚动条。
 * 但列实在太多时总宽会超过视口，此时保留横向滚动作为兜底——用 hidden 裁掉
 * 会让右侧列永久不可达（滚不动、点不到），所以这里只能用 auto。
 * 档案/列表类表格不走这条路径，而是用下面的 ui-data-table-pack：
 * 列宽由内容决定、整表收缩靠左，内容超宽时在表格区域内横向滚动。
 */
.ui-data-table.tabulator .tabulator-tableholder {
  overflow-x: auto !important;
}

/*
 * 内容自适应表格（配合 UnifiedDataTable 的 fitContent: true 使用）：
 * - 表格本体 display:inline-block + width:auto，宽度只跟内容走并靠左，
 *   最宽不超过容器（max-width: 100%）；
 * - 内容比容器宽时，滚动发生在表格内部，冻结列仍贴在左侧；
 * - 列宽完全由 fitDataTable 布局模式按内容测量，剩余空间不再分给任何列。
 */
.ui-data-table.tabulator.ui-data-table-pack {
  display: inline-block;
  width: auto;
  max-width: 100%;
  vertical-align: top;
}

/*
 * 档案表的纵向滚动交给页面本身，表体不再限高：
 * 100 行就是 100 行的长度，滚动条出现在浏览器窗口最右边（而不是表格框
 * 内部多出一根纵向滚动条）。表体只保留横向滚动，列实在太多时才有。
 */
.ui-data-table.tabulator.ui-data-table-pack .tabulator-tableholder {
  overflow-x: auto !important;
  /* 表格确实超宽时给出可见的横向滚动条（Chromium/Firefox 都会常显），
     避免系统自动隐藏滚动条时用户以为右列被裁掉。 */
  scrollbar-width: thin;
  scrollbar-color: var(--ui-border-strong) transparent;
}

.ui-data-table.tabulator.ui-data-table-pack
  .tabulator-tableholder::-webkit-scrollbar {
  height: 10px;
}

.ui-data-table.tabulator.ui-data-table-pack
  .tabulator-tableholder::-webkit-scrollbar-track {
  background: transparent;
}

.ui-data-table.tabulator.ui-data-table-pack
  .tabulator-tableholder::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 5px;
  background: var(--ui-border-strong);
  background-clip: padding-box;
}

.ui-data-table.tabulator.ui-data-table-pack
  .tabulator-tableholder::-webkit-scrollbar-thumb:hover {
  background: var(--ui-text-muted);
  background-clip: padding-box;
}

.ui-data-table.tabulator
  .tabulator-header
  .tabulator-col
  .tabulator-col-content
  .tabulator-col-title {
  overflow-wrap: anywhere;
  white-space: normal;
}

.ui-data-table.tabulator .tabulator-row .tabulator-cell > * {
  min-width: 0;
  max-width: 100%;
}

/*
 * 数据单元格一律不加粗：需要强调时只使用颜色（见 internal-ui-style-guide.md
 * 的表格规范）。这一条同时覆盖原生 <table> 数据行，防止后续在单元格里用
 * strong/b 标签重新引入加粗。
 */
table td strong,
table td b,
.ui-data-table.tabulator .tabulator-row .tabulator-cell,
.ui-data-table.tabulator .tabulator-row .tabulator-cell strong,
.ui-data-table.tabulator .tabulator-row .tabulator-cell b {
  font-weight: var(--ui-font-weight-regular);
}

.ui-data-table.tabulator .tabulator-row .tabulator-cell .ma-relation-link {
  overflow-wrap: anywhere;
  white-space: normal;
}

/*
 * 不折行列：表头用深一档底色作为暗号，hover 有解释；
 * 单元格单行显示，超出部分省略号截断。
 */
.ui-data-table.tabulator .tabulator-header .tabulator-col.ui-col-nowrap {
  background: var(--ui-accent-hover);
}

.ui-data-table.tabulator
  .tabulator-header
  .tabulator-col.ui-col-nowrap
  .tabulator-col-title {
  overflow: hidden;
  overflow-wrap: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-data-table.tabulator
  .tabulator-header
  .tabulator-col.ui-col-nowrap.tabulator-sortable:hover {
  background: #0a3470;
}

.ui-data-table.tabulator .tabulator-row .tabulator-cell.ui-col-nowrap {
  overflow: hidden;
  white-space: nowrap;
}

.ui-data-table.tabulator .tabulator-row .tabulator-cell.ui-col-nowrap > * {
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
}

.ui-data-table.tabulator
  .tabulator-row
  .tabulator-cell.ui-col-nowrap
  .ui-cell-nowrap {
  display: block;
  text-overflow: ellipsis;
}

.ui-table-actions {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
  width: max-content;
  white-space: nowrap;
}

.ui-table-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  padding: 0;
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-radius);
  color: var(--ui-text);
  background: var(--ui-panel);
  font: inherit;
  line-height: 1;
  cursor: pointer;
  white-space: nowrap;
}

.ui-table-action .ui-icon {
  display: block;
  width: 14px;
  height: 14px;
}

.ui-table-action:hover {
  border-color: var(--ui-accent);
  color: var(--ui-accent);
}

.ui-table-action:focus-visible {
  outline: 2px solid var(--ui-accent);
  outline-offset: 1px;
}

.ui-table-action.danger {
  border-color: #d9a5a5;
  color: var(--ui-danger);
}

.ui-table-action.danger:hover {
  border-color: var(--ui-danger);
  color: var(--ui-danger);
  background: var(--ui-danger-soft);
}

/*
 * 金额单元格全站默认右对齐 + 等宽数字：
 * - Tabulator 列声明 amount: true 后由 unified-data-table.js 统一补上
 *   hozAlign、表头右对齐和 amount 类，这里兜底样式；
 * - 手写的 hozAlign: "right" 列由 unified-data-table.js 补 ui-align-right
 *   类，同样在这里处理；
 * - 手写表格的金额列在表头和数据单元格上加 .amount（或沿用的 .money）。
 * 单元格是 inline-flex，text-align 只影响文本本身，必须同时给
 * justify-content: flex-end，包含 span 等内容时才能真正贴右。
 */
.ui-data-table.tabulator .tabulator-cell.amount,
.ui-data-table.tabulator .tabulator-cell.ui-align-right {
  justify-content: flex-end;
}

.ui-data-table.tabulator .tabulator-cell.amount,
.ui-data-table.tabulator .tabulator-cell.ui-align-right,
td.amount,
td.money,
th.amount,
th.money {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.ui-data-table.tabulator
  .tabulator-header
  .tabulator-col.amount
  .tabulator-col-title,
.ui-data-table.tabulator
  .tabulator-header
  .tabulator-col.ui-align-right
  .tabulator-col-title {
  text-align: right;
}

.ui-data-table.tabulator .tabulator-cell.mono {
  font-family: var(--ui-font-mono);
  font-size: var(--ui-font-size-body);
  letter-spacing: 0;
}

/*
 * 表格等宽内容统一入口：
 * - .mono：手写表格 / Tabulator 列里显式标记的字段；
 * - .ma-mono：档案页沿用名；
 * - .ui-ascii-mono：frontend-utils.js 自动给“整格内容全是英文字母/数字/符号”
 *   的数据单元格打的类（含中文的单元格不打，避免中英混排割裂）。
 */
.mono,
.ma-mono,
.ui-ascii-mono {
  font-family: var(--ui-font-mono);
  letter-spacing: 0;
}

/*
 * 系统自动填充的“无值”占位符：
 * - 只有数据为 null / 空字符串等“没有值”时，渲染代码才包上本类；
 * - 用户自己录入的“—”是真实数据，保持普通正文样式，从而和系统占位区分；
 * - 等宽字体与字号沿用表格编码/账号列的 --ui-font-mono / --ui-font-size-body；
 * - 颜色取功能红（--ui-danger）：表格里出现“—”即表示该字段缺失，
 *   与正常正文的灰黑区分开，便于扫视需要补录的位置。
 * 页面和脚本只引用本类，不要各自复制字体与颜色定义。
 */
.ui-empty-mark {
  color: var(--ui-danger);
  font-family: var(--ui-font-mono);
  font-size: var(--ui-font-size-body);
  font-weight: var(--ui-font-weight-regular);
  letter-spacing: 0;
}

.ui-data-table.tabulator .tabulator-header .tabulator-calcs-holder,
.ui-data-table.tabulator
  .tabulator-header
  .tabulator-calcs-holder
  .tabulator-row,
.ui-data-table.tabulator .tabulator-row.tabulator-calcs {
  border-color: var(--ui-accent-hover) !important;
  background: var(--ui-accent) !important;
  font-weight: var(--ui-font-weight-regular);
}

.ui-data-table.tabulator .tabulator-calcs-holder .tabulator-cell {
  cursor: text;
  user-select: text;
}

.ui-data-table.tabulator
  .tabulator-header
  .tabulator-calcs-holder
  .tabulator-cell,
.ui-data-table.tabulator .tabulator-row.tabulator-calcs .tabulator-cell {
  color: #ffffff;
}

.ui-data-table.tabulator .tabulator-footer {
  border-top: 1px solid var(--ui-border-strong);
  background: var(--ui-panel);
  font-weight: var(--ui-font-weight-regular);
}

.ui-data-table.tabulator .tabulator-page.active {
  border-color: var(--ui-accent);
  color: #ffffff;
  background: var(--ui-accent);
}

.ui-data-table.tabulator .tabulator-header-filter input,
.ui-data-table.tabulator .tabulator-header-filter select {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  height: 24px;
  padding: 3px 6px;
  /* 筛选框位于蓝色表头内，业务页普遍让 input 继承 color；不显式指定时
   * 会把表头的白字带进白底输入框，打字完全看不见。这里统一盖回正文色。 */
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: var(--ui-radius);
  color: var(--ui-text);
  background: var(--ui-panel);
  font: inherit;
}

.ui-data-table.tabulator .tabulator-header-filter input:focus,
.ui-data-table.tabulator .tabulator-header-filter select:focus {
  outline: none;
  border-color: var(--ui-accent-hover);
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.45);
}

.ui-data-table.tabulator .tabulator-header-filter input::placeholder {
  color: var(--ui-text-subtle);
  opacity: 1;
}

.ui-data-table.tabulator .tabulator-group {
  padding: 6px 10px;
  border-bottom: 1px solid var(--ui-border);
  background: #f3f3f3;
}

.ui-data-table.tabulator .tabulator-row.tabulator-group {
  font-weight: var(--ui-font-weight-regular);
}

.ui-data-table.tabulator .tabulator-group .group-meta {
  margin-left: 8px;
  color: var(--ui-text-muted);
}

.ui-data-table.tabulator .tabulator-group.tabulator-group-level-1 {
  padding-left: 24px;
  background: #f8f8f8;
}

.ui-data-table.tabulator
  .tabulator-placeholder
  .tabulator-placeholder-contents {
  color: var(--ui-text-subtle);
  font-size: var(--ui-font-size-body);
  font-weight: var(--ui-font-weight-regular);
}

body .tabulator-edit-list {
  font-family: var(--ui-font-sans);
  font-size: var(--ui-font-size-body);
  font-weight: var(--ui-font-weight-regular);
  max-height: 320px;
}

/*
 * 数据采集缺漏红标：任何启用账户在巡检窗口里缺天，就给顶栏「采集状态」入口
 * 挂一个红色徽标（明细走全站统一 tooltip，点进去是采集状态页）。
 * 这里刻意不做全宽横幅：横幅在每个工作区页面都会出现、稳定占掉两行高度，
 * 而缺漏只是一个入口级提醒。
 */
.head-r .link.collect-gap-link {
  font-weight: var(--ui-font-weight-semibold);
}

.collect-gap-badge {
  margin-left: 4px;
  background: var(--ui-danger-soft);
  color: var(--ui-danger);
}

@media (max-width: 760px) {
  :root {
    --ui-page-gutter: 12px;
  }

  .app-header,
  .workspace-nav {
    padding-left: 12px;
    padding-right: 12px;
  }
}