/* 超维货代 V4 · Data-Dense Operations Console
 * PC-first shell and shared component layer. Business DOM, ids and handlers stay intact.
 */
:root {
  --v4-canvas: #edf2f6;
  --v4-surface: #ffffff;
  --v4-surface-2: #f7f9fb;
  --v4-ink: #17324a;
  --v4-text: #365269;
  --v4-muted: #718496;
  --v4-line: #d4dfe8;
  --v4-line-soft: #e7edf2;
  --v4-navy: #0d253b;
  --v4-navy-2: #123450;
  --v4-navy-3: #1a476b;
  --v4-blue: #2463a6;
  --v4-blue-2: #164a7d;
  --v4-blue-soft: #e8f1fa;
  --v4-success: #2b7c5d;
  --v4-warning: #a45b0a;
  --v4-danger: #b42318;
  --v4-radius: 6px;
  --v4-shadow: 0 1px 2px rgba(20, 47, 72, .06);
  --v4-focus: 0 0 0 3px rgba(36, 99, 166, .2);
}

/* Application shell */
.v4-shell { display: flex; min-width: 0; height: 100vh; overflow: hidden; background: var(--v4-canvas); color: var(--v4-ink); }
.v4-shell .main { min-width: 0; display: flex; flex: 1 1 auto; flex-direction: column; height: 100vh; background: var(--v4-canvas); }
.v4-sidebar { width: 182px; min-width: 182px; display: flex; flex-direction: column; background-color: #fff; background-image: linear-gradient(180deg, #102a42 0%, #0b2033 100%); border-right: 1px solid #1d405d; color: #b8c8d8; }
.v4-sidebar .v4-brand { height: 58px; min-height: 58px; display: flex; align-items: center; gap: 8px; padding: 0 14px; overflow: hidden; color: #f3f7fb; background-color: #fff; background-image: linear-gradient(180deg, #102a42 0%, #0c2338 100%); border-bottom: 1px solid #1d405d; font-size: 12px; font-weight: 700; letter-spacing: .02em; white-space: nowrap; }
.v4-brand .brand-logo { width: 28px; height: 28px; flex: 0 0 28px; object-fit: contain; padding: 3px; border-radius: 5px; background: #f4f8fb; }
.v4-shell .nav { flex: 1; overflow: auto; padding: 9px 8px 14px; scrollbar-color: #31536f transparent; }
.v4-shell .nav-section-label { height: 27px; margin: 8px 5px 1px; padding: 7px 4px 0; color: #7f99af; font-size: 10px; font-weight: 700; line-height: 18px; letter-spacing: .11em; }
.v4-shell .nav-section-label::after { display: none; }
.v4-shell .nav-item { min-height: 35px; display: flex; align-items: center; gap: 9px; margin: 2px 0; padding: 0 10px; border-radius: 5px; color: #b8c8d8; font-size: 12px; font-weight: 500; line-height: 35px; transition: background-color .14s ease, color .14s ease; }
.v4-shell .nav-item:hover { background: #173752; color: #f4f8fb; }
.v4-shell .nav-item.active { background: #1b4267; color: #fff; font-weight: 700; }
.v4-shell .nav-item .icon { width: 16px; height: 16px; flex: 0 0 16px; color: #9eb5c9; }
.v4-shell .nav-item.active .icon, .v4-shell .nav-item:hover .icon { color: #e2f0fb; }
.v4-shell .nav-item .arrow { margin-left: auto; width: 14px; height: 14px; color: #7f99af; }
.v4-shell .nav-item .arrow svg { width: 14px; height: 14px; transition: transform .14s ease; }
.v4-shell .nav-sub { margin: 1px 0 4px 17px; padding: 1px 0 2px 9px; border-left: 1px solid #31536f; }
.v4-shell .nav-sub-item { min-height: 29px; padding: 0 9px; border-radius: 4px; color: #a8bbcd; font-size: 11px; line-height: 29px; }
.v4-shell .nav-sub-item:hover { background: #173752; color: #f4f8fb; }
.v4-shell .nav-sub-item.active { background: #1b4267; color: #fff; font-weight: 700; }
.v4-shell .nav-badge { min-width: 16px; height: 16px; margin-left: auto; padding: 0 4px; border-radius: 8px; background: #c3483b; color: #fff; font-size: 10px; line-height: 16px; text-align: center; }
.v4-shell .nav-mobile-toggle { display: none; }

/* Compact topbar and MDI rail */
.v4-topbar { height: 54px; min-height: 54px; display: flex; align-items: stretch; padding: 0 16px; background: var(--v4-surface); border-bottom: 1px solid var(--v4-line); box-shadow: 0 1px 4px rgba(20, 47, 72, .04); }
.v4-topbar .header-title-group { min-width: 0; flex: 1; display: flex; align-items: flex-end; }
.v4-tab-rail { height: 42px; align-items: stretch; gap: 2px; overflow: auto; }
.v4-tab-rail .workspace-tab { min-width: 94px; max-width: 170px; height: 42px; padding: 0 10px; border-radius: 4px 4px 0 0; color: var(--v4-muted); font-size: 12px; }
.v4-tab-rail .workspace-tab:hover { background: #f2f6f9; color: var(--v4-ink); }
.v4-tab-rail .workspace-tab[aria-selected="true"] { background: var(--v4-blue-soft); color: var(--v4-ink); font-weight: 700; }
.v4-tab-rail .workspace-tab-close { width: 20px; height: 20px; }
.v4-topbar .header-actions { gap: 7px; align-items: center; }
.v4-topbar .sync-status { max-width: 170px; overflow: hidden; color: var(--v4-muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.v4-topbar .workspace-tab-menu-trigger { height: 30px; padding: 0 8px; font-size: 11px; }
.v4-topbar .workspace-tab-menu-trigger span { display: none; }
.v4-topbar .account-trigger { height: 32px; padding: 0 7px; border: 1px solid transparent; border-radius: 5px; }
.v4-topbar .account-trigger:hover { background: #f2f6f9; border-color: var(--v4-line); }
.v4-topbar .account-avatar { width: 26px; height: 26px; background: var(--v4-blue-soft); color: var(--v4-blue); }
.v4-topbar .account-name { max-width: 90px; overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }

/* Work canvas and page frame */
.v4-work-canvas { min-height: 0; flex: 1; overflow: auto; padding: 16px 18px 24px; background: var(--v4-canvas); }
.v4-work-canvas > .page { width: 100%; max-width: none; min-height: calc(100vh - 94px); }
.v4-work-canvas .page-toolbar, .v4-work-canvas .taskboard-toolbar, .v4-work-canvas .page-section-head, .v4-work-canvas .ln-header { min-height: 42px; margin: 0 0 10px; padding: 0 0 10px; border-bottom: 1px solid var(--v4-line); }
.v4-work-canvas .page-toolbar-head, .v4-work-canvas .taskboard-toolbar-head { min-height: 36px; align-items: center; }
.v4-work-canvas .page-toolbar-head h3, .v4-work-canvas .taskboard-toolbar-head h3, .v4-work-canvas .page-section-head h3, .v4-work-canvas .ln-header h3 { margin: 0; color: var(--v4-ink); font-size: 16px; line-height: 22px; }
.v4-work-canvas .page-toolbar-head .page-summary, .v4-work-canvas .page-section-head > div > span, .v4-work-canvas .taskboard-toolbar-head .page-summary { color: var(--v4-muted); font-size: 11px; }

/* Page titles already represented by the MDI rail; retain summaries, drop duplicate large headings. */
#page-orders .page-toolbar-head h3, #page-customers .page-toolbar-head h3, #page-suppliers .page-toolbar-head h3, #page-warehouse .page-toolbar-head h3, #page-finance .finance-page-head h3 { display: none; }
#page-orders .page-toolbar-head, #page-customers .page-toolbar-head, #page-suppliers .page-toolbar-head, #page-warehouse .page-toolbar-head { justify-content: flex-end; }
#page-finance .finance-page-head { min-height: 25px; padding-bottom: 7px; }
#page-finance .finance-page-head > div > span { display: none; }

/* Shared surface language: flat bordered work surfaces, no white card pile. */
.v4-work-canvas .card, .v4-work-canvas .scroll-card, .v4-work-canvas .dash-module, .v4-work-canvas .dash-todo, .v4-work-canvas .task-column { border: 1px solid var(--v4-line); border-radius: var(--v4-radius); background: var(--v4-surface); box-shadow: var(--v4-shadow); }
.v4-work-canvas .card { padding: 0; }
.v4-work-canvas .card.scroll-card { overflow: auto; }
.v4-work-canvas .btn { min-height: 30px; height: 30px; border-radius: 5px; font-size: 12px; transition: background-color .14s ease, border-color .14s ease, color .14s ease, box-shadow .14s ease; }
.v4-work-canvas .btn-primary { background: var(--v4-blue); border-color: var(--v4-blue); box-shadow: none; }
.v4-work-canvas .btn-primary:hover { background: var(--v4-blue-2); border-color: var(--v4-blue-2); box-shadow: 0 2px 5px rgba(22, 74, 125, .16); }
.v4-work-canvas .btn-outline { background: var(--v4-surface); border-color: #b6c7d5; color: var(--v4-text); }
.v4-work-canvas .btn-outline:hover { background: var(--v4-blue-soft); border-color: #7ca7ca; color: var(--v4-blue-2); }
.v4-work-canvas .btn-ghost { background: transparent; color: var(--v4-blue-2); }
.v4-work-canvas .btn:disabled { opacity: .52; box-shadow: none; cursor: not-allowed; }
.v4-work-canvas input, .v4-work-canvas select, .v4-work-canvas textarea { min-height: 30px; border: 1px solid var(--v4-line); border-radius: 5px; background: var(--v4-surface); color: var(--v4-ink); font-size: 12px; }
.v4-work-canvas input:hover, .v4-work-canvas select:hover, .v4-work-canvas textarea:hover { border-color: #9eb5c7; }
.v4-work-canvas input:focus, .v4-work-canvas select:focus, .v4-work-canvas textarea:focus, .v4-work-canvas input:focus-visible, .v4-work-canvas select:focus-visible, .v4-work-canvas textarea:focus-visible { border-color: var(--v4-blue); outline: none; box-shadow: var(--v4-focus); }
.v4-shell .nav-item:focus-visible, .v4-shell .nav-sub-item:focus-visible, .v4-tab-rail .workspace-tab:focus-visible, .v4-topbar .account-trigger:focus-visible { outline: none; box-shadow: var(--v4-focus); }

/* Filter strips and toolbars */
.v4-work-canvas .order-filter-row, .v4-work-canvas .customer-filter-row, .v4-work-canvas .supplier-filter-row, .v4-work-canvas .warehouse-filter-row, .v4-work-canvas .taskboard-filters, .v4-work-canvas .finance-toolbar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 7px; margin-top: 8px; }
.v4-work-canvas .compact-search, .v4-work-canvas .compact-field, .v4-work-canvas .toolbar-filter-field, .v4-work-canvas .dash-filter-field { gap: 4px; }
.v4-work-canvas .compact-search > span, .v4-work-canvas .compact-field > span, .v4-work-canvas .toolbar-filter-field > span, .v4-work-canvas .dash-filter-field > label, .v4-work-canvas .toolbar-filter-caption { color: var(--v4-muted); font-size: 11px; line-height: 17px; }
.v4-work-canvas .compact-search input { width: 260px; }
.v4-work-canvas .customer-search-field input { width: 260px; }
.v4-work-canvas .toolbar-select, .v4-work-canvas .compact-field select { min-width: 128px; }
.v4-work-canvas .order-command-row { gap: 6px; }
.v4-work-canvas .toolbar-menu-panel, .v4-work-canvas .workspace-tab-menu-panel, .v4-work-canvas .account-panel, .v4-work-canvas .combobox-drop, .v4-work-canvas .date-picker-popup { border: 1px solid var(--v4-line); border-radius: 6px; box-shadow: 0 10px 26px rgba(17, 43, 65, .14); }

/* Tables / data-grid */
.v4-work-canvas table { width: 100%; border-collapse: separate; border-spacing: 0; font-variant-numeric: tabular-nums; }
.v4-work-canvas th { height: 33px; padding: 0 9px; background: #eef3f7; border-bottom: 1px solid var(--v4-line); color: #587087; font-size: 11px; font-weight: 700; line-height: 33px; white-space: nowrap; }
.v4-work-canvas td { height: 38px; padding: 0 9px; border-bottom: 1px solid var(--v4-line-soft); color: var(--v4-text); font-size: 12px; line-height: 38px; white-space: nowrap; }
.v4-work-canvas tbody tr:hover td { background: #eef5fb; }
.v4-work-canvas tbody tr:focus-within td { background: #e7f0f9; box-shadow: inset 0 1px 0 #9ec1df, inset 0 -1px 0 #9ec1df; }
.v4-work-canvas .frozen-head { border-bottom: 1px solid var(--v4-line); }
.v4-work-canvas .frozen-body { background: var(--v4-surface); }
.v4-work-canvas .status-tag, .v4-work-canvas .pill { border-radius: 999px; font-size: 11px; }
.v4-work-canvas .empty-state { min-height: 170px; padding: 40px 16px; color: var(--v4-muted); font-size: 12px; }

/* Dashboard: queue-first operating console */
#page-dashboard .dash-filter { display: grid; grid-template-columns: 1fr; gap: 8px; margin: 0 0 10px; padding: 10px 12px; border: 1px solid var(--v4-line); border-radius: var(--v4-radius); background: var(--v4-surface); box-shadow: var(--v4-shadow); }
#page-dashboard .dash-filter-title strong { color: var(--v4-ink); font-size: 13px; }
#page-dashboard .dash-filter-title > span, #page-dashboard .dash-section-heading > span, #page-dashboard .dash-summary, #page-dashboard .dash-filter-help { display: none; }
#page-dashboard .dash-filter-top { min-height: 29px; display: flex; align-items: center; gap: 14px; }
#page-dashboard .dash-quick-ranges { margin-left: auto; }
#page-dashboard .dash-filter-controls { display: flex; align-items: flex-end; gap: 8px; }
#page-dashboard .dash-section { margin-bottom: 10px; }
#page-dashboard .dash-section-heading { min-height: 30px; margin: 0; padding: 0 2px; border-bottom: 1px solid var(--v4-line); }
#page-dashboard .dash-section-heading h3 { color: var(--v4-ink); font-size: 13px; line-height: 30px; }
#page-dashboard .stats-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 0 0 10px; }
#page-dashboard .stat-card { min-height: 64px; padding: 10px 12px; border: 1px solid var(--v4-line); border-radius: var(--v4-radius); background: var(--v4-surface); box-shadow: var(--v4-shadow); }
#page-dashboard .stat-card:hover { border-color: #9ebbd3; box-shadow: 0 3px 9px rgba(20, 47, 72, .09); }
#page-dashboard .stat-card .stat-label { color: var(--v4-muted); font-size: 11px; }
#page-dashboard .stat-card .stat-value { margin-top: 3px; color: var(--v4-ink); font-size: 22px; font-weight: 700; line-height: 28px; }
#page-dashboard .dash-progress-grid { gap: 8px; }
#page-dashboard .dash-grid { grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); gap: 10px; }
#page-dashboard .dash-module { padding: 12px; }
#page-dashboard .dash-module-header { min-height: 28px; padding-bottom: 7px; border-bottom: 1px solid var(--v4-line-soft); }
#page-dashboard .dash-module-header h3 { color: var(--v4-ink); font-size: 13px; }
#page-dashboard .dash-todo { padding: 10px; border-left: 3px solid var(--v4-blue); }

/* Orders: work table remains the primary surface; detail opens as a right drawer. */
#page-orders .table-scroll-fixed { height: calc(100vh - 205px); min-height: 330px; }
#page-orders .order-filter-row { align-items: flex-end; }
#page-orders .order-more-menu { margin-left: auto; }
#orderModal.order-drawer-mode #orderModalCard { border-left: 1px solid var(--v4-line); box-shadow: -16px 0 34px rgba(10, 30, 49, .18); }

/* Customers / supplier / warehouse dense records */
#page-customers .customer-search-field { width: 260px !important; max-width: 260px !important; }
#page-customers .customer-search-field input { width: 260px !important; max-width: 260px !important; }
#page-customers #customerStats { display: none !important; }
#page-customers .stats-row { display: flex; gap: 8px; margin: 0 0 10px; }
#page-customers .stats-row .stat-card { min-width: 150px; min-height: 52px; padding: 8px 11px; }
#page-customers .stats-row .stat-value { font-size: 18px; line-height: 22px; }
#page-customers .card.scroll-card, #page-suppliers .card.scroll-card, #page-warehouse .card.scroll-card { min-height: 340px; }
#page-suppliers .supplier-filter-row, #page-warehouse .warehouse-filter-row { align-items: center; }
#page-suppliers .supplier-filter-row .btn, #page-warehouse .warehouse-filter-row .fin-tab { min-height: 36px; height: 36px; }
#page-warehouse #whSyncStatus { margin: 0 0 8px !important; color: var(--v4-muted) !important; font-size: 11px !important; }

/* Finance: compact indicators, state rail, table and review panel. */
#page-finance .finance-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-bottom: 8px; }
#page-finance .finance-summary-grid > * { min-height: 64px; padding: 9px 12px; border: 1px solid var(--v4-line); border-radius: var(--v4-radius); background: var(--v4-surface); box-shadow: var(--v4-shadow); }
#page-finance .fx-rate-row { display: none; }
#page-finance .fx-rate-meta { display: none !important; }
#page-finance .fin-tabs { min-height: 38px; display: flex; align-items: center; gap: 4px; border-bottom: 1px solid var(--v4-line); }
#page-finance .fin-tab { min-height: 36px; padding: 0 12px; border-radius: 4px; color: var(--v4-muted); font-size: 12px; line-height: 36px; }
#page-finance .fin-tab:hover { background: var(--v4-blue-soft); color: var(--v4-blue-2); }
#page-finance .fin-tab.active { background: var(--v4-blue-soft); color: var(--v4-blue-2); font-weight: 700; }
#page-finance .finance-toolbar { min-height: 38px; padding: 7px 0; }
#page-finance .finance-toolbar > input { width: 235px; }
#page-finance .fin-layout { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 10px; min-height: 430px; }
#page-finance .fin-right { display: none; border: 1px solid var(--v4-line); border-radius: var(--v4-radius); background: var(--v4-surface); box-shadow: var(--v4-shadow); }
#page-finance .fin-right.active { display: block; }
#page-finance .fin-layout:not(:has(#finRightPanel.active)) { grid-template-columns: minmax(0, 1fr); }
#page-finance .fin-breakbulk-toggle { display: inline-flex !important; align-items: center; gap: 6px; min-height: 30px; height: 30px; margin: 0; padding: 0 8px; border: 1px solid var(--v4-line); border-radius: 5px; background: var(--v4-surface-2); color: var(--v4-text); font-size: 11px; line-height: 30px; white-space: nowrap; }
#page-finance .fin-breakbulk-toggle input { width: 14px !important; height: 14px !important; min-width: 14px; min-height: 14px !important; margin: 0; accent-color: var(--v4-blue); }

/* Settings and secondary pages inherit the same density. */
#page-settings .settings-tabs { min-height: 35px; display: flex; align-items: center; gap: 4px; margin-bottom: 10px; border-bottom: 1px solid var(--v4-line); }
#page-settings .stab-content .toolbar, #page-accounts > .toolbar, #page-logs > .toolbar { min-height: 36px; display: flex; align-items: center; gap: 8px; margin-bottom: 10px; padding: 0 0 8px; border-bottom: 1px solid var(--v4-line); }
#page-settings .stab-content .toolbar h3, #page-accounts > .toolbar h3, #page-logs > .toolbar h3 { margin: 0; color: var(--v4-ink); font-size: 13px; }
#page-taskboard .taskboard-grid { gap: 9px; }
#page-logisticsnews .ln-content { border: 1px solid var(--v4-line); border-radius: var(--v4-radius); background: var(--v4-surface); }

/* Semantic states: success is reserved for successful state, never the brand. */
.v4-work-canvas .status-success, .v4-work-canvas .status-paid, .v4-work-canvas .status-done { color: var(--v4-success); }
.v4-work-canvas .status-warning, .v4-work-canvas .status-pending { color: var(--v4-warning); }
.v4-work-canvas .status-danger, .v4-work-canvas .status-overdue { color: var(--v4-danger); }

@media (prefers-reduced-motion: reduce) {
  .v4-shell *, .v4-shell *::before, .v4-shell *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* ============================================================================
   UI 审计修复层 · 2026-09-24                                        [可整段回滚]
   ----------------------------------------------------------------------------
   本段全部为「覆盖规则」，删除本段即可完整回滚本批次 UI 调整，不影响其它层。
   覆盖项：UI-01 窄屏横向溢出 / UI-02 财务工具行 / UI-03 运单工具行
           UI-05 账号权限列 / UI-06 操作日志详情列 / UI-08 港口管理工具行
           UI-09 工作台按钮等高 / UI-12 看板搜索框 / UI-13 搜索与日期框规格
           UI-15 看板标签配色收敛 / UI-16 状态分布占比条
   约束：不改业务逻辑、不改 server.js、不改任何 class 命名、不改任何 JS 选择器
   ============================================================================ */

/* ---- UI-01 窄屏：主内容区允许收缩（配合 .v4-shell 去掉 1100px 硬下限）---- */
.v4-shell > .main { min-width: 0; }

/* 桌面档（≥1280px）内的规格统一，避免影响 1279 及以下的既有响应式布局 */
@media (min-width: 1280px) {

  /* ---- UI-02 财务工具行：控件统一 36px，收窄核销时间使「清除」回到主行 ---- */
  #page-finance .finance-toolbar { align-items: flex-end; gap: 8px; }
  #page-finance .finance-toolbar > * { flex: 0 0 auto; }
  #page-finance .finance-toolbar > input[type="search"] { width: 260px; height: 36px; flex: 0 1 260px; }
  #page-finance .finance-toolbar > select { height: 36px; min-width: 118px; width: auto; }
  #page-finance .finance-toolbar > .finance-export-actions > summary.btn { height: 36px; min-height: 36px; line-height: 34px; }
  #page-finance .finance-toolbar > .fin-breakbulk-toggle { height: 36px; min-height: 36px; line-height: 34px; }
  #page-finance .finance-toolbar > .btn.btn-sm { height: 36px; min-height: 36px; line-height: 34px; padding: 0 14px; }
  #page-finance .finance-toolbar > .fin-date-filter { flex: 0 0 auto; min-width: 0; }
  /* 注意：style.css 的 .finance-toolbar input 带 min-width:220px，必须一并归零，否则 width 不生效 */
  #page-finance .finance-toolbar > .fin-date-filter .dash-date-field { min-width: 0; }
  #page-finance .finance-toolbar > .fin-date-filter .dash-date-field input { width: 150px; min-width: 0; flex: 0 0 150px; height: 36px; }
  #page-finance .finance-toolbar > .fin-date-filter .dash-date-field .date-pick-btn { height: 36px; flex: 0 0 auto; }

  /* ---- UI-03 运单工具行：搜索框定宽，「更多数据操作」回到主行并与输入框等高 ---- */
  #page-orders .order-filter-row > .compact-search { width: 260px; flex: 0 1 260px; }
  #page-orders .order-filter-row > .compact-search input { width: 100%; }
  #page-orders .order-filter-row > .compact-field { flex: 0 0 auto; }
  #page-orders .order-filter-row > .toolbar-menu > summary.btn { height: 36px; min-height: 36px; line-height: 34px; }

  /* ---- UI-08 港口管理工具行：取消两端对齐，标题/标签/按钮成组左对齐并等高 ---- */
  #page-settings .stab-content > .toolbar { justify-content: flex-start; align-items: center; gap: 8px; }
  #page-settings .stab-content > .toolbar > .btn { height: 36px; min-height: 36px; line-height: 34px; }
  #page-settings .stab-content > .toolbar > h3 { margin-right: 4px; }

  /* ---- UI-13 搜索框 / 日期框规格统一 ---- */
  .dash-date-field input { width: 130px; height: 36px; }
  .dash-date-field .date-pick-btn { height: 36px; }
  #page-quotations .dash-filter-top .inq-search-field input { width: 260px; height: 36px; }
  #page-quotations .dash-filter-top .dash-export-actions .btn { height: 32px; min-height: 32px; line-height: 30px; }

  /* ---- UI-12 任务看板：搜索框不再被拉伸到 879px ---- */
  .taskboard-filters .compact-search { flex: 0 1 260px; min-width: 260px; max-width: 260px; }
  .taskboard-filters .compact-field { flex: 0 0 auto; }
}

/* ---- UI-05 账号管理 · 权限列：允许换行，杜绝文字越过「状态」列 ---- */
#page-accounts .account-permissions { max-width: 360px; white-space: normal; overflow-wrap: anywhere; line-height: 1.55; }
#page-accounts table td.account-permissions { vertical-align: top; }

/* ---- UI-06 操作日志 · 详情列：限宽换行，表格不再撑破卡片 ---- */
#page-logs table td:nth-child(5), #page-logs table th:nth-child(5) { max-width: 620px; white-space: normal; overflow-wrap: anywhere; line-height: 1.55; }

/* ---- UI-09 工作台：快捷范围与导出按钮等高（原 27px / 29px 混用）---- */
#page-dashboard.control-tower-dashboard .dash-quick-ranges button { height: 32px; min-height: 32px; }
#page-dashboard.control-tower-dashboard .dash-export-actions .btn.btn-sm { height: 32px; min-height: 32px; line-height: 30px; }

/* ---- UI-15 任务看板：来源标签收敛为「中性 + 异常红」两色，去掉紫色 ---- */
.task-source.workorder { background: var(--surface-muted); color: var(--muted); }

/* ---- UI-16 工作台「状态分布」：7 个等大等色圆点 → 占比条 + 可点击图例 ---- */
#page-dashboard.control-tower-dashboard .dash-timeline { display: block; margin: 14px 0 4px; overflow: visible; }
.tl-bar { display: flex; gap: 2px; width: 100%; height: 12px; border-radius: 999px; background: var(--surface-muted); overflow: hidden; }
.tl-bar .tl-seg { flex: 1 1 0; min-width: 5px; padding: 0; border: 0; border-radius: 0; background: var(--accent); opacity: .34; cursor: pointer; transition: opacity .15s ease; }
.tl-bar .tl-seg:hover { opacity: .62; }
.tl-bar .tl-seg.active { opacity: 1; }
.tl-bar .tl-bar-empty { flex: 1 1 100%; background: var(--surface-muted); }
#page-dashboard.control-tower-dashboard .tl-legend { display: flex; flex-wrap: wrap; gap: 2px; margin-top: 8px; }
#page-dashboard.control-tower-dashboard .tl-legend .tl-node { flex: 1 0 auto; min-width: 74px; display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 5px 6px; border: 0; border-radius: 8px; background: transparent; font: inherit; cursor: pointer; }
#page-dashboard.control-tower-dashboard .tl-legend .tl-node::before,
#page-dashboard.control-tower-dashboard .tl-legend .tl-node::after { display: none; content: none; }
#page-dashboard.control-tower-dashboard .tl-legend .tl-node:hover { background: var(--surface-muted); }
#page-dashboard.control-tower-dashboard .tl-legend .tl-node.active { background: var(--accent-soft); }

/* ============================================================================
   工具行排版重做 · 2026-09-24（第二轮）                            [可整段回滚]
   ----------------------------------------------------------------------------
   本段全部为「覆盖规则」，删除本段即可完整回滚本批次调整。
   背景：v4 层曾把 5 个页面的标题 h3 整体 display:none，并用
         justify-content:flex-end / margin-left:auto 把主操作按钮推到最右，
         导致「页面无标题 + 按钮孤悬右侧 + 左侧只剩一行统计小字」。
   本段：① 恢复页面标题；② 标题与主操作成组左对齐；③ 次要操作不再推到最右。
   约束：不改业务逻辑、不改 server.js、不改任何 class/id 命名、不改 JS 选择器。
   ============================================================================ */

/* ---- ① 恢复被隐藏的页面标题 ---- */
#page-orders .page-toolbar-head h3,
#page-customers .page-toolbar-head h3,
#page-suppliers .page-toolbar-head h3,
#page-warehouse .page-toolbar-head h3,
#page-finance .finance-page-head h3 { display: block; }

/* 页面主标题规格全站统一（16px / 深蓝墨色 / 行高 22） */
#page-orders .page-toolbar-head h3,
#page-customers .page-toolbar-head h3,
#page-suppliers .page-toolbar-head h3,
#page-warehouse .page-toolbar-head h3,
#page-finance .finance-page-head h3,
.v4-work-canvas .taskboard-toolbar-head h3,
#page-accounts > .toolbar h3,
#page-logs > .toolbar h3,
#page-settings .stab-content > .toolbar h3 {
  margin: 0;
  color: var(--v4-ink);
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
}

/* ---- ② 标题 + 主操作 成组左对齐，主按钮不再飘到最右 ---- */
/* 注意：style.css 有 `#page-x .x-toolbar .page-toolbar-head`(1,2,0) 级别的
   space-between 规则，本节选择器必须带上 tool-bar 中间层才能压过它。 */
#page-orders .page-toolbar-head,
#page-customers .customer-toolbar .page-toolbar-head,
#page-suppliers .supplier-toolbar .page-toolbar-head,
#page-warehouse .warehouse-toolbar .page-toolbar-head,
.v4-work-canvas .taskboard-toolbar-head { justify-content: flex-start; gap: 12px; }

#page-customers .customer-toolbar .page-toolbar-head h3,
#page-suppliers .supplier-toolbar .page-toolbar-head h3,
#page-warehouse .warehouse-toolbar .page-toolbar-head h3 { font-size: 16px; }

#page-accounts > .toolbar,
#page-logs > .toolbar,
#page-settings .stab-content > .toolbar { justify-content: flex-start; }

/* 运单页主操作容器带 margin-left:auto，必须一并归零，否则仍会被推到最右 */
#page-orders .page-toolbar-primary.order-command-row,
.page-toolbar-primary { margin-left: 0; margin-right: 0; }

/* ---- ③ 次要操作（更多数据操作）不再推到最右，跟随筛选控件紧凑排列 ---- */
#page-orders .order-more-menu { margin-left: 0; }

/* Paged grid: only reserve the compact footer on this PC business page. */
:is(#page-orders, #page-finance) .order-pagination[hidden] { display: none; }
:is(#page-orders, #page-finance) .order-pagination {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; margin-top: 12px; min-height: 36px; font-size: 13px;
}
:is(#page-orders, #page-finance) .order-page-controls { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
:is(#page-orders, #page-finance) .order-page-count, :is(#page-orders, #page-finance) .order-page-feedback { color: var(--text); }
:is(#page-orders, #page-finance) .order-page-feedback:empty { display: none; }
:is(#page-orders, #page-finance) .order-page-controls button, :is(#page-orders, #page-finance) .order-page-controls select {
  min-width: 32px; height: 32px; padding: 0 9px; border: 1px solid var(--line);
  border-radius: 6px; color: var(--text); background: var(--surface); font: inherit; cursor: pointer;
}
:is(#page-orders, #page-finance) .order-page-controls button[aria-current="page"] { color: var(--accent); border-color: var(--accent); background: var(--accent-soft); font-weight: 600; }
:is(#page-orders, #page-finance) .order-page-controls button:hover:not(:disabled) { border-color: var(--accent); color: var(--accent); }
:is(#page-orders, #page-finance) .order-page-controls button:focus-visible, :is(#page-orders, #page-finance) .order-page-controls select:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
:is(#page-orders, #page-finance) .order-page-controls button:disabled { opacity: .45; cursor: default; }
:is(#page-orders, #page-finance) .order-page-gap { padding: 0 3px; color: var(--muted); }
:is(#page-orders, #page-finance) .order-page-error { color: var(--danger); }
#finFrozenBody { overflow-anchor: none; }
#page-finance .fin-left:has(#financePagination:not([hidden]))>.data-grid { display:flex; flex-direction:column; min-height:220px; }
#page-finance .fin-left:has(#financePagination:not([hidden])) .frozen-head { flex:none; }
#page-finance .fin-left:has(#financePagination:not([hidden])) .frozen-body { flex:1; min-height:0; max-height:none; }
#page-orders .order-page-pending { opacity: .65; }
#page-orders:has(.order-pagination:not([hidden])) .table-scroll-fixed { height: calc(100vh - 312px); min-height: 280px; }

/* Supplier search stays outside the animated category rail. PC scope only. */
@media(min-width:1101px) {
  #page-suppliers .supplier-tools { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
  #page-suppliers .supplier-tools>.supplier-filter-row { flex:0 0 auto; margin:0; }
  #page-suppliers .supplier-search-tools { display:flex; align-items:center; gap:8px; flex:0 1 auto; min-width:0; }
  #page-suppliers .supplier-search-field { display:block; flex:0 1 280px; width:280px; min-width:180px; margin:0; }
  #page-suppliers .supplier-search-field .toolbar-search { width:100%; min-width:0; max-width:100%; height:36px; margin:0; }
  #page-suppliers .supplier-search-tools>.btn { flex:none; height:36px; margin:0; }
  #page-suppliers .supplier-result-count { color:var(--muted); font-size:12px; white-space:nowrap; font-variant-numeric:tabular-nums; }
  #page-suppliers .supplier-search-tools :is(input,button):focus-visible,
  #page-suppliers #supplierEmptyClear:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
  #page-suppliers #supplierEmptyClear { margin-top:12px; }
}
