:root{
  --bg:#f8fafc;
  --surface:#ffffff;
  --surface-2:#f1f5f9;
  --text:#0f172a;
  --muted:#475569;
  --border:#e2e8f0;

  --primary:#2563eb;
  --primary-600:#1d4ed8;
}

/* 预留滚动条槽，避免内容高度变化时出现/消失滚动条导致水平位移 */
html {
  scrollbar-gutter: stable;
}

/* Reset loud theme */
body{
  background: var(--bg) !important;
  color: var(--text) !important;
  /* 始终预留垂直滚动条，避免切换页面时内容高度变化导致水平位移/菜单跳动 */
  overflow-y: scroll !important;
}

/* Kill gradients everywhere */
*{
  background-image: none !important;
}

/* Top bars / headers */
.navbar, .topbar, .sl-topbar, header,
.page-header, .section-header, .panel-heading,
.card-header, .title-bar{
  background: rgba(255,255,255,0.92) !important;
  color: var(--text) !important;
  border-bottom: 1px solid var(--border) !important;
}

/* Links in nav */
.navbar a, .topbar a, .sl-topbar a, .nav a, .nav-link{
  color: var(--muted) !important;
}
.navbar a:hover, .topbar a:hover, .sl-topbar a:hover, .nav a:hover, .nav-link:hover{
  background: var(--surface-2) !important;
  color: var(--text) !important;
  text-decoration: none !important;
}
.navbar a.active, .topbar a.active, .sl-topbar a.active, .nav a.active, .nav-link.active{
  background: var(--skin-accent-soft) !important;
  border: 1px solid var(--skin-accent-border) !important;
  color: var(--skin-accent-600) !important;
  border-radius: 999px !important;
}

/* Cards */
.card, .table, .empty{
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px !important;
  box-shadow: 0 1px 2px rgba(15,23,42,0.04) !important;
}

/* Primary buttons：仅此处随皮肤变色，不影响主菜单 */
.btn-primary{
  background: var(--skin-accent) !important;
  border-color: var(--skin-accent) !important;
  color:#fff !important;
}
.btn-primary:hover{
  background: var(--skin-accent-600) !important;
  border-color: var(--skin-accent-600) !important;
}

/* 仪表盘 KPI 卡片：90% 中性色 + 10% 强调色（简洁 SaaS 层级）
 * 仅两种强调色：绿 = 收入  红 = 风险（逾期/现金危险）
 * 其余均为中性灰：未收款、成本、利润、利润率、现金余额(正常/低余额)
 */
:root {
  --dash-color-income: #16a34a;   /* 绿：收入（今日收款、本月收入） */
  --dash-color-risk: #dc2626;     /* 红：风险（逾期、现金余额危险） */
  --dash-color-neutral: #6b7280; /* 灰：中性（成本、利润、利润率、未收款、现金余额等） */
  --dash-color-pending: #ea580c;  /* 橙：保留变量，仅用于非 KPI 场景 */
  --dash-color-info: #2563eb;     /* 蓝：保留变量，仅用于非 KPI 场景 */
  --dash-color-unbilled: #6b7280; /* 灰：未开票/支出类 */
  --dash-kpi-inner-bg: #E8F5E9;  /* 大卡片内小卡片背景（浅薄荷绿，与客户详情财务摘要一致） */
  --dash-kpi-inner-border: #A5D6A7;  /* 小卡片边框（可见的绿色描边） */
}
.dashboard-kpi-card .card-body { border-left: 4px solid var(--border); padding: 8px 12px !important; }

/* 仪表盘财务摘要：大卡片内小卡片风格（与客户详情页一致，每个指标独立成卡） */
#dashboard-kpi .dashboard-kpi-inner-card {
  background: var(--dash-kpi-inner-bg) !important;
  border: 1px solid var(--dash-kpi-inner-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
#dashboard-kpi .dashboard-kpi-inner-card .card-body {
  border-left: none !important;
  background: transparent !important;
  padding: 6px 10px !important;
  border-radius: 8px !important;
  line-height: 1.2;
}
#dashboard-kpi .dashboard-kpi-inner-card .kpi-title {
  font-size: 11px !important;
  color: var(--muted) !important;
  line-height: 1.2;
  margin-bottom: 2px;
}
#dashboard-kpi .dashboard-kpi-inner-card .kpi-value {
  font-size: 1rem !important;
  font-weight: 700 !important;
  text-align: center !important;
  line-height: 1.2;
}
#dashboard-kpi .dashboard-kpi-inner-card .dashboard-kpi-trend,
#dashboard-kpi .dashboard-kpi-inner-card .dashboard-kpi-aux {
  margin-top: 1px !important;
  font-size: 0.65rem !important;
  line-height: 1.2 !important;
}
#dashboard-kpi .dashboard-kpi-inner-card:hover {
  background: #C8E6C9 !important;
  border-color: #81C784 !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
}

/* ========== 仪表盘布局优化：KPI 区无外层卡片、紧凑网格、统一双列与间距 ========== */
/* KPI 区：固定 4 列网格，稳定整齐可预期（不用 auto-fit/auto-fill 让浏览器猜列数）
 * 紧凑布局：小卡片、小间距，节约垂直空间 */
.kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
#dashboard-kpi.kpi-grid {
  --bs-gutter-x: 8px;
  --bs-gutter-y: 8px;
  gap: 10px;
}
.kpi-card:not(.dashboard-kpi-inner-card) {
  padding: 8px 10px;
  border-radius: 6px;
  border: none !important;
  background: #fff !important;
  box-shadow: none !important;
}
.kpi-card .card-body {
  padding: 8px 10px !important;
  border-radius: 6px;
}
.kpi-value {
  font-size: 18px !important;
  font-weight: 600 !important;
}
.kpi-title {
  font-size: 12px !important;
  color: #666 !important;
}

/* 数据概览 KPI：无背景、仅色条+数字（仅适用于非「财务摘要小卡片」的 KPI） */
#dashboard-kpi .dashboard-kpi-card:not(.dashboard-kpi-inner-card) {
  box-shadow: none !important;
  border: none !important;
  background: #fff !important;
  line-height: 1.2;
  min-height: 0;
}
#dashboard-kpi .dashboard-kpi-card:not(.dashboard-kpi-inner-card) .card-body {
  background: #fff !important;
  border-radius: 6px !important;
  border-left-width: 3px !important;
  padding: 8px 12px !important;
}
#dashboard-kpi .dashboard-kpi-card.dashboard-kpi-inner-card .card-body.dashboard-kpi-body {
  padding: 6px 10px !important;
}
#dashboard-kpi .dashboard-kpi-clickable:not(.dashboard-kpi-inner-card):hover {
  box-shadow: none !important;
}
#dashboard-kpi .dashboard-kpi-clickable:not(.dashboard-kpi-inner-card):hover .card-body {
  background: #fff !important;
  box-shadow: none !important;
}

/* 数据概览一排：间距由 .kpi-grid { gap } 与 .kpi-card 统一 */
/* 第一行：标题 + 数字同一行，紧凑对齐 */
#dashboard-kpi .dashboard-kpi-row1 {
  line-height: 1.2;
  min-height: 0;
}
#dashboard-kpi .dashboard-kpi-row1 .kpi-title,
#dashboard-kpi .dashboard-kpi-row1 .small.text-muted {
  font-size: 12px !important;
  color: #6b7280 !important;
  line-height: inherit;
  flex-shrink: 0;
}
#dashboard-kpi .dashboard-kpi-row1 .kpi-value,
#dashboard-kpi .dashboard-kpi-row1 .h4 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.2;
  flex-shrink: 0;
  text-align: right;
}
/* 模式2：带分解说明的卡片 — 辅助信息统一为单行、小字、紧凑 */
#dashboard-kpi .dashboard-kpi-aux {
  margin-top: 2px;
  font-size: 0.7rem;
  line-height: 1.3;
}
#dashboard-kpi .dashboard-kpi-aux .dashboard-kpi-aux-sep {
  margin: 0 0.2em;
  color: var(--bs-secondary);
}
/* 趋势行：环比 vs 上月，小字不换行，紧贴第一行 */
#dashboard-kpi .dashboard-kpi-trend {
  margin-top: 2px;
  font-size: 0.7rem;
  line-height: 1.25;
}
/* KPI 区域：时间范围 + 8 个 KPI 卡片已由外层大卡片包裹 */
.dashboard-range-select-wrap {
  min-width: 9rem;   /* 保证英文 "This month" 等完整显示 */
  width: auto;
  flex-shrink: 0;
}
.dashboard-range-select-wrap #dashboard-range-select,
.dashboard-kpi-wrap .card-body #dashboard-range-select {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box;
  padding-left: 0.35rem;
  padding-right: 1.25rem;
}

/* 降低 KPI 区域视觉权重：收入/中性统一为淡色；逾期/危险保留红色 */
#dashboard-kpi .dashboard-kpi-income .card-body { border-left-color: var(--border) !important; }
#dashboard-kpi .dashboard-kpi-income .kpi-value,
#dashboard-kpi .dashboard-kpi-income .h4 { color: var(--text) !important; }
#dashboard-kpi .dashboard-kpi-unpaid .card-body { border-left-color: var(--border) !important; }
#dashboard-kpi .dashboard-kpi-unpaid .kpi-value,
#dashboard-kpi .dashboard-kpi-unpaid .h4 { color: var(--text) !important; }
#dashboard-kpi .dashboard-kpi-cost .card-body { border-left-color: var(--border) !important; }
#dashboard-kpi .dashboard-kpi-cost .kpi-value,
#dashboard-kpi .dashboard-kpi-cost .h4 { color: var(--text) !important; }
#dashboard-kpi .dashboard-kpi-profit .card-body { border-left-color: var(--border) !important; }
#dashboard-kpi .dashboard-kpi-profit .kpi-value,
#dashboard-kpi .dashboard-kpi-profit .h4 { color: var(--text) !important; }
#dashboard-kpi .dashboard-kpi-profit-margin .card-body { border-left-color: var(--border) !important; }
#dashboard-kpi .dashboard-kpi-profit-margin .kpi-value,
#dashboard-kpi .dashboard-kpi-profit-margin .h4 { color: var(--text) !important; }
#dashboard-kpi .dashboard-kpi-cash-balance .card-body { border-left-color: var(--border) !important; }
#dashboard-kpi .dashboard-kpi-cash-balance .kpi-value,
#dashboard-kpi .dashboard-kpi-cash-balance .h4 { color: var(--text) !important; }
#dashboard-kpi .dashboard-kpi-cash-balance.dashboard-kpi-cash-warning .card-body { border-left-color: var(--border) !important; }
#dashboard-kpi .dashboard-kpi-cash-balance.dashboard-kpi-cash-warning .kpi-value,
#dashboard-kpi .dashboard-kpi-cash-balance.dashboard-kpi-cash-warning .h4 { color: var(--text) !important; }
/* 逾期/危险保留红色，不覆盖 */

/* 概览区时间条与 KPI 网格容器 */
.dashboard-kpi-wrap {
  margin-bottom: 0;
}
#dashboard-kpi .dashboard-kpi-cash-balance .card-body {
  padding: 8px 12px !important;
}

/* 收入：今日收款、本月收入（仅保留的两种强调色之一） */
.dashboard-kpi-income  .card-body { border-left-color: var(--dash-color-income) !important; }
.dashboard-kpi-income  .kpi-value,
.dashboard-kpi-income  .h4 { color: var(--dash-color-income) !important; }
/* 中性：未收款（灰，不再用橙） */
.dashboard-kpi-unpaid  .card-body { border-left-color: var(--dash-color-neutral) !important; }
.dashboard-kpi-unpaid  .kpi-value,
.dashboard-kpi-unpaid  .h4 { color: var(--dash-color-neutral) !important; }
/* 现金余额：正常/低余额均为中性灰；仅危险（负值）用红强调 */
.dashboard-kpi-cash-balance.dashboard-kpi-cash-warning .card-body { border-left-color: var(--dash-color-neutral) !important; }
.dashboard-kpi-cash-balance.dashboard-kpi-cash-warning .kpi-value,
.dashboard-kpi-cash-balance.dashboard-kpi-cash-warning .h4 { color: var(--dash-color-neutral) !important; }
/* 风险：逾期；现金余额-危险（红，仅保留的两种强调色之二） */
.dashboard-kpi-overdue .card-body { border-left-color: var(--dash-color-risk) !important; }
.dashboard-kpi-overdue .kpi-value,
.dashboard-kpi-overdue .h4 { color: var(--dash-color-risk) !important; }
.dashboard-kpi-cash-balance.dashboard-kpi-cash-danger  .card-body { border-left-color: var(--dash-color-risk) !important; }
.dashboard-kpi-cash-balance.dashboard-kpi-cash-danger  .kpi-value,
.dashboard-kpi-cash-balance.dashboard-kpi-cash-danger  .h4 { color: var(--dash-color-risk) !important; }
/* 中性：利润、利润率、逾期金额等（灰，不再用蓝） */
.dashboard-kpi-profit  .card-body { border-left-color: var(--dash-color-neutral) !important; }
.dashboard-kpi-profit  .kpi-value,
.dashboard-kpi-profit  .h4 { color: var(--dash-color-neutral) !important; }
.dashboard-kpi-profit-margin .card-body { border-left-color: var(--dash-color-neutral) !important; }
.dashboard-kpi-profit-margin .kpi-value,
.dashboard-kpi-profit-margin .h4 { color: var(--dash-color-neutral) !important; }
.dashboard-kpi-profit-margin-change .card-body { border-left-color: var(--dash-color-neutral) !important; }
.dashboard-kpi-avg-project-profit .card-body { border-left-color: var(--dash-color-neutral) !important; }
.dashboard-kpi-avg-project-profit .kpi-value,
.dashboard-kpi-avg-project-profit .h4 { color: var(--dash-color-neutral) !important; }
.dashboard-kpi-collection-rate .card-body { border-left-color: var(--dash-color-neutral) !important; }
.dashboard-kpi-collection-rate .kpi-value,
.dashboard-kpi-collection-rate .h4 { color: var(--dash-color-neutral) !important; }
/* 中性：现金余额默认（灰） */
.dashboard-kpi-cash-balance  .card-body { border-left-color: var(--dash-color-neutral) !important; }
.dashboard-kpi-cash-balance  .kpi-value,
.dashboard-kpi-cash-balance  .h4 { color: var(--dash-color-neutral) !important; }
/* 中性：成本（灰） */
.dashboard-kpi-cost    .card-body { border-left-color: var(--dash-color-neutral) !important; }
.dashboard-kpi-cost    .kpi-value,
.dashboard-kpi-cost    .h4 { color: var(--dash-color-neutral) !important; }
/* 未开票 / 支出类：与成本同灰 */
.dashboard-kpi-unbilled .card-body { border-left-color: var(--dash-color-unbilled) !important; }
.dashboard-kpi-unbilled .kpi-value,
.dashboard-kpi-unbilled .h4 { color: var(--dash-color-unbilled) !important; }
.dashboard-kpi-expense .card-body { border-left-color: var(--dash-color-neutral) !important; }
.dashboard-kpi-expense .kpi-value,
.dashboard-kpi-expense .h4 { color: var(--dash-color-neutral) !important; }
.dashboard-kpi-clickable { cursor: pointer; transition: box-shadow 0.2s ease, transform 0.15s ease; }
.dashboard-kpi-clickable:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.12) !important; }
.dashboard-kpi-clickable:focus { outline: 2px solid var(--skin-accent); outline-offset: 2px; }
/* 现金余额卡片内「期初/本月净流入」说明紧凑间距 */
.dashboard-kpi-cash-balance #kpi-cash-breakdown { margin-top: 2px; line-height: 1.3; }

/* 需要处理：3 个提醒项为正式模块，标签与数字放大、每项小卡片 */
#dashboard-need-attention-card .card-header strong { font-size: 1rem !important; }
/* 财务摘要标题：与「需要处理」一致（字号 1rem、字重 600） */
.dashboard-kpi-wrap .card-header .dashboard-kpi-wrap-title {
  font-size: 1rem !important;
  font-weight: 600 !important;
}
#dashboard-need-attention-card .card-body { padding-top: 0.5rem !important; padding-bottom: 1rem !important; }
.dashboard-need-attention-item {
  border-left: 4px solid var(--border);
  background: var(--surface-2, #f1f5f9);
  transition: background 0.2s ease, box-shadow 0.2s ease;
  min-height: 4.5rem;
  box-sizing: border-box;
}
.dashboard-need-attention-item:hover {
  background: var(--surface) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}
.dashboard-need-attention-label {
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--text) !important;
}
.dashboard-need-attention-item {
  text-align: center;
}
#dashboard-need-attention .col-md-4 {
  display: flex;
}
#dashboard-need-attention .dashboard-need-attention-item {
  flex: 1;
  min-width: 0;
}
.dashboard-need-attention-value {
  font-size: 1.375rem;
  font-weight: 700;
  line-height: 1.2;
}
.dashboard-need-attention-overdue { border-left-color: var(--dash-color-risk) !important; }
.dashboard-need-attention-overdue .dashboard-need-attention-value { color: var(--dash-color-risk) !important; }
.dashboard-need-attention-unbilled { border-left-color: var(--dash-color-neutral) !important; }
.dashboard-need-attention-unbilled .dashboard-need-attention-value { color: var(--dash-color-neutral) !important; }
.dashboard-need-attention-lowprofit { border-left-color: #ca8a04 !important; }
.dashboard-need-attention-lowprofit .dashboard-need-attention-value { color: #a16207 !important; }

/* 仪表盘分区标题：总览 → 财务分析 → 项目与客户，增强层次感 */
.dashboard-section-heading { padding-top: 0.25rem; }
.dashboard-section-heading + .card { margin-top: 0; }
.dashboard-section-title {
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
  border-top: 1px solid var(--border);
  padding-top: 1rem;
  margin-bottom: 0;
}

/* 仪表盘主容器：与顶部导航 .sl-topbar__inner 同宽、同左右留白，居中（数值需与 topbar_sl.css 保持一致） */
#dashboard-page.page-content {
  width: 100%;
  max-width: 1200px !important;
  margin: 0 auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* 仪表盘布局系统：统一模块间距（SaaS 规范）— 仅两种垂直间距 */
/* 模块之间 24px；模块内部保持 16px 节奏；避免 A/B/C 三种不同空隙的拼接感 */
.dashboard-grid {
  display: grid;
  gap: 24px;
}

/* ========== Dashboard 统一栅格规则 ========== */
/* 1. full-width-row：整行模块，宽度占满内容区，不允许内部缩窄，margin/gap 统一 */
.dashboard-full-width-row {
  width: 100%;
  max-width: 100%;
  margin-bottom: 24px;
  box-sizing: border-box;
}
#dashboard-page .dashboard-full-width-row:last-child {
  margin-bottom: 0;
}

/* 2. two-col-row：标准两列栅格，左右宽度一致，gap 统一，顶部对齐 */
.dashboard-two-col {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
  align-items: start !important;
  margin-bottom: 24px !important;
}
#dashboard-page .dashboard-two-col:last-child {
  margin-bottom: 0 !important;
}
.dashboard-two-col > * {
  min-width: 0 !important;
  width: 100% !important;
  max-width: none !important;
  flex: none !important;
}
/* 第三层（应收分析 | 项目状态+待处理事项）：两列等高、底部严格对齐 */
#dashboard-page .dashboard-two-col:has(#dashboard-receivables-analysis-module) {
  align-items: stretch !important;
}
/* 左列：限制在网格单元内，内容多时卡片内滚动，底部与右列齐平 */
#dashboard-page .dashboard-two-col:has(#dashboard-receivables-analysis-module) > .col-lg-6:first-child {
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
  align-self: stretch;
}
#dashboard-page .dashboard-two-col:has(#dashboard-receivables-analysis-module) > .col-lg-6:first-child > .card {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
#dashboard-page .dashboard-two-col:has(#dashboard-receivables-analysis-module) > .col-lg-6:first-child > .card .card-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}
/* 右列：拉伸至与左列同高，待处理事项贴底 */
#dashboard-page .dashboard-two-col:has(#dashboard-receivables-analysis-module) > .col-lg-6:last-child {
  display: flex;
  flex-direction: column;
  min-height: 0;
  align-self: stretch;
}
#dashboard-page .dashboard-two-col:has(#dashboard-receivables-analysis-module) > .col-lg-6:last-child #dashboard-pending-card {
  margin-top: auto;
}
/* 第三层右列：卡片间距收紧，减少整行高度从而缩减左侧应收分析下方的空白 */
#dashboard-page .dashboard-two-col:has(#dashboard-receivables-analysis-module) > .col-lg-6:last-child > .card.mt-3 {
  margin-top: 0.375rem !important;
}
/* 待处理事项卡片：整体增高 2rem，内部小卡片区域上下居中 */
#dashboard-page #dashboard-pending-card .card-body {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  padding-top: 1.5rem !important;
  padding-bottom: 1.5rem !important; /* 原 0.5+0.5=1rem，现 1.5+1.5=3rem，净增 2rem */
  margin-bottom: 0;
}
/* 待处理事项内小卡片：保持一行 3 个；增加两行之间的行距，避免太挤 */
#dashboard-page #dashboard-pending {
  --bs-gutter-y: 0.75rem;
}
#dashboard-page #dashboard-pending .col-md-4 {
  display: flex;
}
#dashboard-page #dashboard-pending .dashboard-pending-link {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  width: 100%;
  padding-top: 0 !important;
  padding-bottom: 0 !important; /* 再减少 0.5rem（上下各 0.25rem → 0） */
}
#dashboard-page #dashboard-pending .dashboard-pending-link .h4 {
  margin-top: auto;
}
/* 项目状态、施工进度卡片略收紧，减少下方空白 */
#dashboard-page .dashboard-two-col:has(#dashboard-receivables-analysis-module) > .col-lg-6:last-child > .card:first-of-type .card-body {
  padding-bottom: 0.5rem;
}
#dashboard-page #dashboard-construction-progress-card .card-body {
  padding-bottom: 0.5rem;
}
#dashboard-page .dashboard-two-col .col-lg-6 {
  max-width: none !important;
  flex: none !important;
}
@media (max-width: 991.98px) {
  .dashboard-two-col {
    grid-template-columns: 1fr !important;
  }
}
/* 需要处理 + 报价转化：同一行左右 50%，小屏下仍为上下堆叠（由 .dashboard-two-col 媒体查询控制） */
#dashboard-page #dashboard-need-qc-row.dashboard-two-col {
  align-items: stretch;
}
#dashboard-page #dashboard-need-qc-row .dashboard-need-qc-cell {
  margin-bottom: 0 !important;
  height: 100%;
}
/* 需要处理 + 报价转化：标题区统一 padding，分隔线与标题底距离一致（不用 min-height，避免单行时被撑高） */
#dashboard-page #dashboard-need-qc-row .dashboard-need-qc-header-height {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
}
#dashboard-page #dashboard-need-qc-row .dashboard-need-attention-divider,
#dashboard-page #dashboard-need-qc-row .dashboard-qc-strip-divider {
  height: 1px;
  background: var(--border, #e5e7eb);
  margin: 0;
  flex-shrink: 0;
}
#dashboard-page #dashboard-need-qc-row .dashboard-qc-strip .card-header.dashboard-qc-strip-header {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}
#dashboard-page > .x-stack.dashboard-three-rows > .card,
#dashboard-page > .x-stack.dashboard-three-rows > .row,
#dashboard-page > .x-stack.dashboard-three-rows > .dashboard-kpi-wrap,
#dashboard-page > .x-stack.dashboard-three-rows > .dashboard-two-col,
#dashboard-page > .x-stack.dashboard-three-rows > .dashboard-row-middle {
  margin-bottom: 24px !important;
}
#dashboard-page > .card:last-child,
#dashboard-page > .x-stack.dashboard-three-rows > *:last-child {
  margin-bottom: 0 !important;
}
#dashboard-page .x-stack.dashboard-three-rows {
  margin-bottom: 0;
}
/* 报价转化：与需要处理共用同一标题 padding，不覆盖（分隔线位置已由 .dashboard-need-qc-header-height 统一） */
#dashboard-page .dashboard-qc-strip .card-header.dashboard-qc-strip-header {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}
#dashboard-page .dashboard-qc-strip-title { font-weight: 600; color: var(--text, #111827); }
#dashboard-page .dashboard-qc-strip-divider {
  height: 1px;
  background: var(--border, #e5e7eb);
  margin: 0;
  flex-shrink: 0;
}
#dashboard-page .dashboard-qc-strip .card-body { padding-top: 0.75rem !important; padding-bottom: 0.75rem !important; display: flex !important; flex-direction: column !important; }
#dashboard-page .dashboard-qc-strip-kpis {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1rem 1.5rem;
  align-items: center;
  align-content: center;
  flex: 1 1 0;
  min-height: 0;
  width: 100%;
  min-width: 0;
}
#dashboard-page .dashboard-qc-strip-item { display: flex; flex-direction: column; gap: 2px; min-width: 0; text-align: center; }
#dashboard-page .dashboard-qc-strip-label { font-size: 0.75rem; }
#dashboard-page .dashboard-qc-strip-value { font-size: 1rem; }
@media (max-width: 767.98px) {
  #dashboard-page .dashboard-qc-strip-kpis {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 575.98px) {
  #dashboard-page .dashboard-qc-strip-kpis {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem 1rem;
  }
  #dashboard-page .dashboard-qc-strip-value { font-size: 0.9375rem; }
}

/* 双列布局统一：已合并到上方 Dashboard 统一栅格规则，此处注释保留 */
/* 仪表盘模块内容撑满：卡片内子元素铺满整行，不挤在左上角 */
#dashboard-page .card {
  display: flex !important;
  flex-direction: column !important;
}
#dashboard-page .card .card-body {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
}
#dashboard-page .card .card-body > * {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}
#dashboard-page .card .card-body .row {
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
#dashboard-page .card .card-body .row [class*="col-"] {
  min-width: 0 !important;
}
/* 项目状态、施工进度、应收分析、排行榜等内部块：撑满 */
#dashboard-page .dashboard-project-chart-wrap,
#dashboard-page .dashboard-aging-chart-wrap,
#dashboard-page .dashboard-trend-chart-wrap,
#dashboard-page #dashboard-project-status-summary,
#dashboard-page #dashboard-construction-progress-card .row.g-2,
#dashboard-page #dashboard-receivables-analysis-module .row.g-2,
#dashboard-page #dashboard-receivables-analysis-module .dashboard-receivables-section,
#dashboard-page .dashboard-ranking-wrap,
#dashboard-page .table-responsive.dashboard-ranking-wrap {
  width: 100% !important;
  min-width: 0 !important;
}

/* 行内栅格统一 24px 间距（与模块间距一致） */
#dashboard-page .row.g-2,
#dashboard-page .row.g-3,
#dashboard-page .row.g-4 {
  --bs-gutter-x: 24px;
  --bs-gutter-y: 24px;
}
/* 收入概览 KPI 一排：由 .kpi-grid { gap: 10px } 统一 */
#dashboard-page #dashboard-kpi.kpi-grid {
  /* gap 已在 .kpi-grid */
}
/* 同一列内上下堆叠的卡片：模块间也 24px */
#dashboard-page .row [class*="col-"] > .card {
  margin-bottom: 24px !important;
}
#dashboard-page .row [class*="col-"] > .card:last-child {
  margin-bottom: 0 !important;
}

/* 仪表盘排行榜：表格撑满卡片宽度，列宽由内容分配 */
.dashboard-ranking-wrap { min-width: 0; width: 100%; }
.dashboard-ranking-table { width: 100%; min-width: 280px; table-layout: auto; }
.dashboard-ranking-table th:first-child,
.dashboard-ranking-table td:first-child { min-width: 6em; white-space: nowrap; }
.dashboard-ranking-customer-link,
.dashboard-ranking-revenue-link { color: var(--skin-accent, #0d6efd); }
.dashboard-ranking-customer-link:hover,
.dashboard-ranking-revenue-link:hover { text-decoration: underline !important; }
.dashboard-ranking-table th:last-child,
.dashboard-ranking-table td:last-child { white-space: nowrap; }

/* 仪表盘模块内部布局锁定：防止被「内容撑开」或全局单列规则破坏，保持横向 grid/flex */
#dashboard-page .dashboard-receivables-block {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap: 0 !important;
}
#dashboard-page #dashboard-quote-conversion-skeleton .dashboard-qc-kpi-grid {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 8px !important;
}
#dashboard-page #dashboard-construction-progress-card .row.g-2,
#dashboard-page #dashboard-receivables-analysis-module .row.g-2 {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
}
#dashboard-page #dashboard-construction-progress-card .row.g-2 .col-6,
#dashboard-page #dashboard-construction-progress-card .row.g-2 .col-md-4 {
  flex: 0 0 auto !important;
}
@media (min-width: 768px) {
  #dashboard-page #dashboard-construction-progress-card .row.g-2 .col-md-4 {
    flex: 0 0 33.333333% !important;
    max-width: 33.333333% !important;
  }
}
@media (max-width: 767.98px) {
  #dashboard-page #dashboard-construction-progress-card .row.g-2 .col-6 {
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }
}

/* 施工进度：白色卡片 + 左侧状态色条，企业级 SaaS 风格 */
#dashboard-page #dashboard-construction-progress-card .card-status {
  display: flex;
  align-items: stretch;
  min-height: 72px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  overflow: hidden;
}
#dashboard-page #dashboard-construction-progress-card .card-status .status-bar {
  width: 4px;
  flex-shrink: 0;
}
#dashboard-page #dashboard-construction-progress-card .card-status--in-progress .status-bar {
  background: #2563eb;
}
#dashboard-page #dashboard-construction-progress-card .card-status--about-to-complete .status-bar {
  background: #16a34a;
}
#dashboard-page #dashboard-construction-progress-card .card-status--delayed .status-bar {
  background: #dc2626;
}
#dashboard-page #dashboard-construction-progress-card .card-status .status-content {
  flex: 1;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
}
#dashboard-page #dashboard-construction-progress-card .card-status .status-label {
  color: #6b7280;
  font-size: 0.8125rem;
  line-height: 1.3;
  margin-bottom: 2px;
}
#dashboard-page #dashboard-construction-progress-card .card-status .status-value {
  font-size: 24px;
  font-weight: 600;
  line-height: 1.2;
}
#dashboard-page #dashboard-construction-progress-card .card-status--in-progress .status-value {
  color: #2563eb;
}
#dashboard-page #dashboard-construction-progress-card .card-status--about-to-complete .status-value {
  color: #16a34a;
}
#dashboard-page #dashboard-construction-progress-card .card-status--delayed .status-value {
  color: #dc2626;
}

#dashboard-page .dashboard-ranking-wrap {
  width: 100% !important;
  min-width: 0 !important;
}
/* 客户收入排行 | 项目利润排行：两列等高、卡片底部对齐 */
#dashboard-page .dashboard-two-col:has(#dashboard-customer-ranking) {
  align-items: stretch !important;
}
#dashboard-page .dashboard-two-col:has(#dashboard-customer-ranking) > .col-lg-6 {
  display: flex;
  flex-direction: column;
}
#dashboard-page .dashboard-two-col:has(#dashboard-customer-ranking) > .col-lg-6 > .card {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
#dashboard-page .dashboard-two-col:has(#dashboard-customer-ranking) > .col-lg-6 > .card .card-body {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
#dashboard-page .dashboard-two-col:has(#dashboard-customer-ranking) > .col-lg-6 > .card .card-body .table-responsive.dashboard-ranking-wrap {
  flex: 1 1 auto;
  min-height: 0;
}
/* 客户收入排行、项目利润排行：表格区域最小高度，保证少数据时也有一定高度 */
#dashboard-page .dashboard-two-col:has(#dashboard-customer-ranking) .card-body .table-responsive.dashboard-ranking-wrap {
  min-height: 320px;
}
/* 报价转化小屏时多列保留（2~3 列），避免被改成单列 */
@media (max-width: 576px) {
  #dashboard-page #dashboard-quote-conversion-skeleton .dashboard-qc-kpi-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (min-width: 577px) and (max-width: 768px) {
  #dashboard-page #dashboard-quote-conversion-skeleton .dashboard-qc-kpi-grid {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

/* 报价转化率：KPI 卡片布局，紧凑高度与间距（3 层仪表盘内） */
#dashboard-quote-conversion-skeleton.dashboard-qc-card { margin-bottom: 0; }
#dashboard-quote-conversion-skeleton .dashboard-qc-card-body { padding: 10px 14px; }
#dashboard-quote-conversion-skeleton .dashboard-qc-kpi-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 8px;
}
#dashboard-quote-conversion-skeleton .dashboard-qc-kpi-card {
    height: 64px;
    min-height: 56px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 12px 14px;
    border: none !important;
    border-left: 3px solid var(--border, #e5e7eb);
    border-radius: 0;
    background: transparent !important;
}
#dashboard-quote-conversion-skeleton .dashboard-qc-kpi-title {
    font-size: 11px;
    color: #6b7280;
    display: block;
    margin-bottom: 2px;
}
#dashboard-quote-conversion-skeleton .dashboard-qc-kpi-value {
    font-size: 16px;
    font-weight: 600;
    display: block;
}

/* Quote Conversion 转化率颜色：>40% 绿、20–40% 橙、<20% 红 */
#qc-conversion-rate.qc-rate-high { color: #16a34a !important; }
#qc-conversion-rate.qc-rate-mid  { color: #ea580c !important; }
#qc-conversion-rate.qc-rate-low { color: #dc2626 !important; }

/* Any old theme orange/red buttons */
.btn-warning, .btn-danger, .btn-success{
  filter: saturate(0.9) !important;
}

/* Inputs */
input, select, textarea{
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
input:focus, select:focus, textarea:focus{
  border-color: var(--skin-accent-border) !important;
  box-shadow: 0 0 0 3px var(--skin-accent-soft) !important;
}

/* 主内容区 shell：与顶部导航 .sl-topbar__inner 宽度一致，居中定宽（历史值：与 42b9ac3 topbar-inner / 743cd41 container 对齐 1200px） */
.x-shell{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 18px 20px;
}
/* 仅仪表盘页面使用全宽（已取消：仪表盘与全站统一 1200px，此处保留注释供参考）
body.page-dashboard .page-container.x-shell {
  max-width: none;
}
*/

/* 主内容区与报价页一致：统一最小高度，避免切换系统二级页时页面高度变化导致菜单位移 */
.page-container.x-shell,
.page-content.page-container {
  min-height: calc(100vh - 56px);
  box-sizing: border-box;
}
/* 仪表盘页面：按内容高度，不强制整屏，缩减下方空白 */
body.page-dashboard .page-container.x-shell {
  min-height: 0 !important;
}

/* 全站页面统一宽度（约 2026-03-09 确定）：所有 .page-content 与顶部导航同宽，含 shell 外的发票/财务/考勤等 */
.page-content {
  max-width: 1200px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100%;
  box-sizing: border-box;
}
/* 仪表盘与全站统一宽度，不再单独放宽 */

/* 系统模块统一外层容器：不设 padding（由内层 .page-container 统一负责），只做 max-width 居中和最小高度 */
.x-sys-wrap {
  display: block;
}
/* 系统各子页（个人信息/公司管理等）与主内容区同宽，不强制全宽 */
.x-sys-wrap .page-content.page-container {
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 24px !important;
  box-sizing: border-box !important;
  min-height: calc(100vh - 56px) !important;
}

/* page title rhythm */
.page-title{
  display:flex;
  align-items:flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
.page-title h1{
  font-size: var(--fs-22);
  font-weight: 700;
  letter-spacing: -0.02em;
  margin: 0;
}
.page-title .subtitle{
  margin-top: 6px;
  font-size: var(--fs-12);
  color: var(--muted);
}

/* card padding normalization：标题区更薄、标题与内容间距更小（简洁风） */
.card .card-body{
  padding: 12px 24px 24px 24px !important;  /* 顶部 12px，减少与标题区间距 */
}
.card .card-header{
  padding: 10px 24px 8px 24px !important;    /* 上 10px / 下 8px，压缩标题区高度 */
}

/* 公司资料保存成功：屏幕居中提示 */
.cp-alert-center{
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 9999 !important;
  min-width: 240px;
  max-width: 90vw;
  padding: 14px 24px !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.15) !important;
  text-align: center !important;
}
.cp-alert-center.alert-success{
  background: rgb(220, 248, 222) !important;
  color: #0f5132 !important;
  border: 1px solid rgb(193, 237, 198) !important;
}
.cp-alert-center.alert-danger{
  background: #f8d7da !important;
  color: #842029 !important;
  border: 1px solid #f5c2c7 !important;
}

/* Bank accounts table Actions column */
.bank-actions button{
  margin-right: 6px;
}

/* 公司资料 - 添加帐户表单与页面统一风格 */
#cp-bank-account-form.border-top{
  border-color: var(--border, #dee2e6) !important;
}

/* 公司资料 - 帐户信息：卡片紧凑排列，一行最多 5 个，1-4 个时均匀分布、左右占满、居中 */
#cp-bank-accounts-list {
  max-width: 100%;
}
#cp-bank-accounts-list .cp-bank-empty {
  display: block;
  padding: 10px 0;
}
#cp-bank-accounts-list .cp-bank-cards {
  display: grid;
  gap: 10px;
  justify-content: center;
  justify-items: stretch;
}
/* 1 个：单列居中，卡片适度宽度不拉满 */
#cp-bank-accounts-list .cp-bank-cards-count-1 {
  grid-template-columns: 1fr;
  max-width: 360px;
  margin-left: auto;
  margin-right: auto;
}
/* 2 个：两列均匀分布、左右占满 */
#cp-bank-accounts-list .cp-bank-cards-count-2 {
  grid-template-columns: repeat(2, 1fr);
}
/* 3 个：三列 */
#cp-bank-accounts-list .cp-bank-cards-count-3 {
  grid-template-columns: repeat(3, 1fr);
}
/* 4 个：四列 */
#cp-bank-accounts-list .cp-bank-cards-count-4 {
  grid-template-columns: repeat(4, 1fr);
}
/* 5 个或更多：最多一行 5 个 */
#cp-bank-accounts-list .cp-bank-cards-count-5,
#cp-bank-accounts-list .cp-bank-cards-count-n {
  grid-template-columns: repeat(5, 1fr);
}
#cp-bank-accounts-list .cp-bank-card {
  background: var(--bs-body-bg, #fff);
  border: 1px solid var(--border-light, rgba(0,0,0,0.08));
  border-radius: 8px;
  padding: 0;
  overflow: hidden;
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
  min-width: 0;
}
#cp-bank-accounts-list .cp-bank-card:hover {
  border-color: var(--border, #dee2e6);
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
}
#cp-bank-accounts-list .cp-bank-card-body {
  padding: 10px 12px;
}
#cp-bank-accounts-list .cp-bank-card-name {
  font-weight: 600;
  font-size: 14px;
  color: var(--bs-body-color, #212529);
  margin-bottom: 8px;
  line-height: 1.3;
}
#cp-bank-accounts-list .cp-bank-card-row {
  font-size: 12px;
  color: var(--bs-secondary-color, #6c757d);
  margin-bottom: 4px;
}
#cp-bank-accounts-list .cp-bank-card-row:last-of-type {
  margin-bottom: 0;
}
#cp-bank-accounts-list .cp-bank-card-label {
  margin-right: 4px;
}
#cp-bank-accounts-list .cp-bank-card-value {
  color: var(--bs-body-color, #212529);
  font-weight: 500;
}
#cp-bank-accounts-list .cp-bank-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px 12px;
  background: var(--bs-light, #f8f9fa);
  border-top: 1px solid var(--border-light, rgba(0,0,0,0.06));
}
#cp-bank-accounts-list .cp-bank-card-default .badge {
  font-weight: 500;
}
#cp-bank-accounts-list .cp-bank-card-actions .btn-link {
  text-decoration: none;
  font-size: 12px;
}

/* section rhythm - 减少区块间距，避免上方空白过多 */
.x-section{
  margin-top: 14px;
}
.x-section:first-child{
  margin-top: 0;
}
.x-section-title{
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mono-900);
  margin-bottom: 10px;
}

/* 报价表单内区块折叠 */
.x-section-collapsible{
  padding: 12px 14px;
  border-radius: 8px;
  transition: background 0.2s ease;
  cursor: pointer;
  user-select: none;
}
.x-section-collapsible:hover{
  background: #f1f5f9 !important;
  box-shadow: none !important;
  filter: none !important;
}
/* 防止伪元素遮罩拦截下拉等控件点击 */
.x-section-collapsible::before,
.x-section-collapsible::after{
  pointer-events: none !important;
}
/* 输入控件恢复默认光标与文字选中 */
.x-section-collapsible input,
.x-section-collapsible textarea,
.x-section-collapsible select{
  cursor: text;
  user-select: text;
}
.x-section-collapsible button,
.x-section-collapsible a{
  cursor: pointer;
}
.x-section-collapsible .x-section-head{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between;
  cursor: pointer;
  user-select: none;
  padding: 2px 6px !important;
  margin-bottom: 10px;
  gap: 8px;
  line-height: 1.2 !important;
  min-height: 0 !important;
  background: transparent !important;
}
.x-section-collapsible .x-section-head .x-section-title{
  display: flex;
  align-items: center;
  margin: 0 !important;
}
.x-section-collapsible .x-section-chevron{
  font-size: 10px;
  color: var(--mono-600);
  transition: transform 0.2s ease;
  flex-shrink: 0;
}
.x-section-collapsible.collapsed .x-section-chevron{
  transform: rotate(-90deg);
}
.x-section-collapsible .x-section-body{
  overflow: hidden;
}
/* 接收方区块含客户搜索下拉，需 overflow:visible 避免下拉被裁剪 */
.x-receiver-info .x-section-body,
.x-invoice-receiver-info .x-section-body{
  overflow: visible;
}
/* 服务项目为操作区，不参与折叠，保持与其它区块一致的内边距 */
#quote-service-section{
  padding: 12px 14px;
}
/* 服务项目区块含 margin-policy 下拉（已移至标题行），需 overflow:visible 避免下拉被裁剪 */
#quote-service-section .x-section-head,
#quote-service-section .x-section-body,
.x-invoice-services-section .x-section-body,
.x-invoice-details-section .x-section-body{
  overflow: visible;
}
.x-section-collapsible.collapsed .x-section-body{
  display: none;
}
/* 服务项目折叠时隐藏成本核算图标 */
#quote-service-section.collapsed .x-cost-toggle{
  display: none !important;
}
/* 成本内部可见提示条：黑色字，无背景高亮，跟随成本开关显示/隐藏 */
.x-cost-hint-bar{
  font-size: 12px;
  color: #333 !important;
  background: transparent !important;
}
/* 成本行在对应服务项目的上一行，左对齐 */
.service-item-internal .x-cost-row-left,
.x-cost-row-left{
  justify-content: flex-start !important;
}
/* 折叠后紧凑行距：保留足够点击高度 */
.x-section-collapsible.collapsed{
  margin-top: 0 !important;
  padding: 10px 14px !important;
}
.x-section-collapsible.collapsed .x-section-head{
  padding: 0 !important;
  margin-bottom: 0 !important;
  min-height: 0 !important;
  gap: 0 !important;
  line-height: 1 !important;
}
.x-section-collapsible.collapsed .x-section-head .x-section-title{
  line-height: 1 !important;
}

/* grids */
.x-grid-2{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 16px;
}
.x-grid-3{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 12px 16px;
}
/* 添加收款：收款金额为只读，仅隐藏输入框边框，数据文字照常显示 */
#payment-amount {
  border: none;
  background: transparent;
  box-shadow: none;
  padding-left: 0;
}
#payment-amount:focus {
  outline: none;
  border: none;
  box-shadow: none;
}
.x-grid-4{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 12px 16px;
}
.x-grid-1-1-2{
  display:grid;
  grid-template-columns: 1fr 1fr 2fr;
  gap: 12px 16px;
}
.x-grid-receiver{
  display:grid;
  grid-template-columns: 2fr 1fr 1fr 2fr;
  gap: 12px 16px;
}

/* 公司地址单行高度，与同排输入框一致，隐藏滚动条 */
#customer-address{
  min-height: 38px;
  height: 38px;
  resize: none;
  overflow-y: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
#customer-address::-webkit-scrollbar{
  display: none;
}

/* action area */
.x-actions{
  display:grid;
  gap: 10px;
  margin-top: 18px;
}
.x-actions .btn{
  width: 100%;
  padding: 12px 14px;
  font-weight: 700;
}

/* mobile */
@media (max-width: 1100px){
  .x-shell{ padding: 14px 14px; }
  .x-grid-2, .x-grid-3, .x-grid-4, .x-grid-1-1-2, .x-grid-receiver{ grid-template-columns: 1fr; }
  .page-title{ flex-direction: column; align-items: stretch; }
}

/* XERO3 typography + palette */
:root{
  --bg:#f6f8fb;
  --surface:#ffffff;
  --surface-2:#f1f5f9;

  --text:#0b1220;
  --muted:#526173;
  --border:#dbe3ee;

  --primary:#1a73e8;
  --primary-600:#1558b0;

  --radius:12px;
}

/* Base typography */
body{
  font-size: var(--fs-14) !important;
  line-height: 1.45 !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Headings */
.page-title h1{
  font-size: var(--fs-22) !important;
  line-height: 1.2 !important;
}
.page-title .subtitle{
  line-height: 1.35 !important;
}

/* Links: calmer */
a{
  color: var(--primary) !important;
}
a:hover{
  color: var(--primary-600) !important;
}

/* Labels: consistent */
label{
  font-size: var(--fs-12) !important;
  font-weight: 600 !important;
  color: var(--muted) !important;
  margin-bottom: 6px !important;
}

/* Inputs: calmer corners, clearer focus（随皮肤） */
input, select, textarea{
  border-radius: 10px !important;
}
input:focus, select:focus, textarea:focus{
  border-color: var(--skin-accent-border) !important;
  box-shadow: 0 0 0 3px var(--skin-accent-soft) !important;
}

/* Buttons: calmer，使用 skin-accent */
.btn-primary{
  background: var(--skin-accent) !important;
  border-color: var(--skin-accent) !important;
}
.btn-primary:hover{
  background: var(--skin-accent-600) !important;
  border-color: var(--skin-accent-600) !important;
}
.btn-outline{
  border-radius: 10px !important;
}

/* Badges: softer */
.badge{
  border-radius: 999px !important;
}
.badge-primary{
  background: rgba(26,115,232,0.10) !important;
  border-color: rgba(26,115,232,0.22) !important;
  color: var(--primary-600) !important;
}
.badge-success{
  background: rgba(22,163,74,0.10) !important;
  border-color: rgba(22,163,74,0.22) !important;
}
.badge-danger{
  background: rgba(220,38,38,0.10) !important;
  border-color: rgba(220,38,38,0.22) !important;
}
/* 报价当前进度：仅客户有反馈时有底色（接受=绿，拒绝=红），其余无背景 */
.badge-progress-accepted{
  background: rgba(22,163,74,0.15) !important;
  border: 1px solid rgba(22,163,74,0.35) !important;
  color: #15803d !important;
}
.badge-progress-rejected{
  background: rgba(220,38,38,0.15) !important;
  border: 1px solid rgba(220,38,38,0.35) !important;
  color: #b91c1c !important;
}
.badge-progress-partial{
  background: rgba(245,158,11,0.15) !important;
  border: 1px solid rgba(245,158,11,0.4) !important;
  color: #b45309 !important;
}
/* 当前进度列中非反馈状态（已发送、已创建、已开票、已关闭）无底色，状态文字为黑色 */
#quotes-table-wrap .table td:nth-child(9) .badge:not(.badge-progress-accepted):not(.badge-progress-rejected){
  background: transparent !important;
  border: 1px solid var(--border) !important;
  color: var(--bs-body-color, #212529) !important;
}

/* Card: slightly softer border */
.card, .table, .empty{
  border-color: var(--border) !important;
  border-radius: var(--radius) !important;
}

/* VERIFY MARK: if you don't see this, override is NOT applied */
body::after{
  content:"THEME_OVERRIDE ON";
  position: fixed;
  right: 12px;
  bottom: 12px;
  z-index: 99999;
  font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  color: #0b1220;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(2,6,23,0.12);
  border-radius: 999px;
  padding: 6px 10px;
  box-shadow: 0 6px 18px rgba(2,6,23,0.10);
}

/* Also force-kill obvious gradients on top bars */
.navbar, .topbar, .sl-topbar, header{
  background-image: none !important;
  background: rgba(255,255,255,0.92) !important;
}

/* XERO4 topbar final */
.navbar, .topbar, .sl-topbar, header, .site-header, .app-header, .main-header,
.navbar *, .topbar *, .sl-topbar *, header *{
  background-image: none !important;
}
.navbar, .topbar, .sl-topbar, header, .site-header, .app-header, .main-header{
  background: rgba(255,255,255,0.96) !important;
  border-bottom: 1px solid var(--border) !important;
  box-shadow: 0 1px 0 rgba(15,23,42,0.04) !important;
}

/* nav items spacing + pill — icon & text always inline */
.navbar .nav-link, .topbar .nav-link, .sl-topbar .nav-link, .nav .nav-link, #topNav a{
  padding: 8px 12px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  flex-direction: row !important;
  gap: 5px !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

/* Preview paper container */
.x-preview-wrap{
  position: sticky;
  top: 78px;
}
.x-preview-surface{
  background: #f3f6fb;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 16px;
}
.x-paper{
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 10px 28px rgba(15,23,42,0.10);
  padding: 18px;
  min-height: 520px;
}
@media (max-width: 1100px){
  .x-preview-wrap{ position: static; top:auto; }
}

/* XERO5 form system - 收紧表单区块间距 */
.x-form{
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.x-block{
  padding: 0;
}

.x-divider{
  height: 1px;
  background: var(--border);
  margin: 0;
}

.x-field{
  display:flex;
  flex-direction: column;
  gap: 6px;
}

.x-field label{
  font-size: 12px !important;
  font-weight: 800 !important;
  color: var(--muted) !important;
  letter-spacing: 0.02em;
}

.x-field input,
.x-field select,
.x-field textarea{
  height: 40px;
  padding: 8px 10px !important;
}

.x-field textarea{
  height: auto;
  min-height: 96px;
  padding: 10px 10px !important;
}

/* 项目表单三列同行布局 */
.x-fields-row{
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
  align-items: flex-start;
}
.x-fields-row .x-field-flex{
  flex: 1 1 0;
  min-width: 160px;
}
.x-fields-row .x-field-flex:nth-child(1){ flex: 1 1 20%; }
.x-fields-row .x-field-flex:nth-child(2){ flex: 2 1 35%; }
.x-fields-row .x-field-flex:nth-child(3){ flex: 1 1 25%; }
.x-fields-row .x-field-flex textarea{
  height: 40px;
  min-height: 40px;
  resize: none;
}
@media (max-width: 900px){
  .x-fields-row{ flex-direction: column; }
  .x-fields-row .x-field-flex{ flex: 1 1 auto !important; min-width: 100%; }
}

/* 发送方信息：只读字段去除边框，显示为纯文本 */
.x-sender-info input[readonly],
.x-sender-info input.form-control[readonly] {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  cursor: default !important;
  height: auto !important;
  min-height: unset !important;
}

/* 接收方信息：公司名称、ABN、地址去除边框（选择客户搜索框保留边框） */
.x-receiver-info #quote-company,
.x-receiver-info #quote-abn,
.x-receiver-info #quote-address,
.x-receiver-info #invoice-company,
.x-receiver-info #invoice-abn,
.x-receiver-info #invoice-address {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  height: auto !important;
  min-height: unset !important;
}
.x-receiver-info #quote-address,
.x-receiver-info #invoice-address {
  resize: vertical;
}

/* compact help text */
.x-help{
  font-size: 12px;
  color: var(--muted);
}

/* tighten section titles spacing */
.x-section-title{
  margin-bottom: 12px !important;
}
/* 当 x-section-title 与其他内联元素并排（flex 行内）时，不需要底部间距 */
.d-flex > .x-section-title,
.d-flex > span > .x-section-title,
.d-flex .flex-nowrap .x-section-title {
  margin-bottom: 0 !important;
}

/* service items: make inputs align */
.x-items-table input,
.x-items-table select{
  height: 34px;
  padding: 6px 8px !important;
  font-size: 14px;
}
.x-items-table td{
  vertical-align: middle !important;
}

/* XERO6 items table */
.x-items-table{
  width: 100%;
  table-layout: fixed !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}
.x-items-table th{
  font-size: 12px;
  color: var(--muted);
  background: #f8f9fa !important;
  border-bottom: 1px solid var(--border) !important;
  padding: 6px 10px !important;
  white-space: nowrap;
}
.x-items-table td{
  padding: 6px 10px !important;
  border-bottom: 1px solid var(--border) !important;
  vertical-align: middle !important;
}
/* 所有输入框填满单元格 */
.x-items-table td input,
.x-items-table td select {
  width: 100% !important;
  box-sizing: border-box !important;
}
.x-items-table th.num,
.x-items-table td.num{
  text-align: center !important;
  font-variant-numeric: tabular-nums;
}
.x-items-table td .btn{
  padding: 6px 10px !important;
  font-size: 12px !important;
}
/* no bottom border between input-row and internal-row within same item */
.x-items-table tbody.service-item tr:not(:last-child) td{
  border-bottom: none !important;
}
/* 一级项目与二级项目之间无分隔线 */
.x-items-table tbody.service-item .service-item-internal td{
  border-bottom: none !important;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
  background: transparent !important;
  font-size: 12px;
}
/* 内部行：成本输入、利润/毛利等右对齐，垂直居中 */
.service-item-internal .d-flex{align-items: center !important; justify-content: flex-end !important; flex-wrap: nowrap !important; white-space: nowrap !important;}
/* 报价单成本行在服务项目上一行，靠左显示 */
.service-item-internal .d-flex.x-cost-row-left{ justify-content: flex-start !important; }
.service-item-internal .d-flex label,
.service-item-internal .d-flex span{white-space: nowrap !important;}
/* 成本输入框缩小高度，与文字同一基线 */
.service-item-internal .item-cost{
  height: 1.5em !important;
  min-height: 1.5em !important;
  padding-top: 0.15em !important;
  padding-bottom: 0.15em !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  vertical-align: middle !important;
}
.service-item-internal .d-flex > label{
  display: inline-flex !important;
  align-items: center !important;
  font-size: 12px !important;
}

/* 内部汇总区块：布局与文字样式（背景锁定规则在文件末尾 LOCK 块） */
#quote-profit-summary.x-internal-summary-inline{
  font-size: 12px !important;
  color: #333 !important;
  min-width: 0;
  padding: 2px 10px;
  border: none !important;
  border-radius: 6px;
  position: relative;
  z-index: 5;
}
/* 内部汇总在总计下方：与费用汇总右对齐 */
#quote-profit-summary.x-internal-summary-below-totals{
  flex: none !important;
  justify-content: flex-end !important;
}
#quote-profit-summary.x-internal-summary-inline .x-internal-summary-title,
#quote-profit-summary.x-internal-summary-inline .x-internal-summary-hint,
#quote-profit-summary.x-internal-summary-inline span,
#quote-profit-summary.x-internal-summary-inline strong{
  color: #333 !important;
}
#quote-profit-summary.x-internal-summary-inline .x-internal-summary-hint{
  display: none;
}
#quote-profit-summary.x-internal-summary-inline #margin-policy,
#quote-profit-summary.x-internal-summary-inline select{
  padding: 2px 6px !important;
  font-size: 12px !important;
}
#quote-profit-summary.x-internal-summary,
.x-internal-summary:not(.x-internal-summary-inline){
  background: var(--skin-accent-soft) !important;
  border: 1px solid var(--skin-accent-border) !important;
  font-size: 12px !important;
  color: var(--text) !important;
  transition: background 0.2s ease, border-color 0.2s ease;
}
.x-internal-summary-title{
  color: var(--skin-accent-600) !important;
}
.x-internal-summary-hint{
  color: var(--skin-accent-600) !important;
  font-weight: normal !important;
  opacity: 0.9;
}

/* Column widths — px 固定列宽，仅作用于 colgroup col 元素；desc 列加宽与报价单服务项目卡片一致 */
.x-items-table col.col-desc   { width: 50%; }
.x-items-table col.col-qty    { width: 110px; }
.x-items-table col.col-unit   { width: 140px; }
.x-items-table col.col-gst    { width: 110px; }
.x-items-table col.col-total  { width: 140px; }
.x-items-table col.col-actions{ width: 120px; }

/* 消费税列：固定10%，只读，去除输入框外框 */
input.item-gst {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  cursor: default !important;
}

/* XERO6 totals block */
.x-totals{
  display: grid;
  gap: 5px;
  padding: 7px 14px;
  background: #f7fafc;
  border: 1px solid var(--border);
  border-radius: 12px;
}
.x-totals-row{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
  font-size: 14px;
}
.x-totals-row .label{
  color: var(--muted);
  font-weight: 700;
  font-size: 12px;
}
.x-totals-row .value{
  font-variant-numeric: tabular-nums;
  font-weight: 800;
}
.x-totals-row.total{
  border-top: 1px solid var(--border);
  padding-top: 5px;
  margin-top: 2px;
}
.x-totals-row.total .label{
  font-size: 12px;
}
.x-totals-row.total .value{
  font-size: 15px;
  font-weight: 900;
}
/* 总成本/利润/毛利行：与总计同卡片内，在总计下方 */
.x-totals .x-totals-internal-row,
.x-totals #quote-profit-summary.x-totals-internal-row{
  grid-column: 1 / -1;
  border-top: 1px solid var(--border);
  padding-top: 5px;
  margin-top: 1px;
  margin-bottom: 0;
  background: transparent !important;
  border-radius: 0;
}

/* XERO6 notes */
.x-notes textarea{
  min-height: 110px !important;
  resize: vertical;
}

/* XERO8 stack layout for list + form */
.x-stack{
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
}

.x-collapsible{
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
}

.x-collapsible-head{
  display:flex;
  align-items:center;
  justify-content: space-between;
  padding: 14px 16px;
  border-bottom: 1px solid var(--border);
}

.x-collapsible-body{
  padding: 16px;
}

.x-collapsible-body[hidden]{ display:none !important; }

/* 折叠区标题栏可点击整区切换伸缩 */
.x-collapsible-head-clickable {
  cursor: pointer;
}
.x-collapsible-head-clickable:hover {
  /* 与上方客户记录（table tbody tr:hover td）高亮一致 */
  background: var(--mono-050, #f8fbff) !important;
}
/* 极洁折叠图标：普通灰色，不关联皮肤 */
.x-collapse-icon {
  color: #6c757d !important;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px;
  border: none;
  background: transparent;
  font-size: 1rem;
}
.x-collapse-icon:hover {
  color: #495057 !important;
}

/* 发票表单：隐藏「保存草稿」按钮 */
#invoice-form .btn-save-draft {
  display: none !important;
}

/* 发票表单：隐藏「项目名称」字段，「从报价单转换」独占整行 */
#invoice-reference {
  display: none !important;
}
#invoice-reference ~ label,
label[for="invoice-reference"] {
  display: none !important;
}
/* 父 x-field 整体隐藏 */
#invoice-form .x-grid-2:has(#invoice-reference) .x-field:first-child {
  display: none !important;
}
/* 「从报价单转换」独占整行（invoice-reference 已隐藏，收款账户已移至上方） */
#invoice-form .x-grid-2:has(#invoice-reference) {
  grid-template-columns: 1fr !important;
}

/* 发票表单：隐藏发送方、接收方、服务项目、付款信息区块及其相邻分割线 */
.x-sender-info,
.x-invoice-receiver-info,
#invoice-service-section,
#invoice-form .x-section:has([data-i18n="invoice_section_payment"]) {
  display: none !important;
}
.x-sender-info + .x-divider,
.x-invoice-receiver-info + .x-divider,
#invoice-service-section + .x-divider,
#invoice-form .x-section:has([data-i18n="invoice_section_payment"]) + .x-divider,
#invoice-form .x-divider:has(+ .x-section [data-i18n="invoice_section_payment"]) {
  display: none !important;
}

/* 发票表单：允许下拉框伸出容器，避免「请选择报价单」被裁切无法选下方选项 */
#invoice-form-collapsible,
#invoice-form-collapsible .x-collapsible-body,
#invoice-add-only {
  overflow: visible !important;
}
#invoice-page {
  overflow: visible !important;
}

/* 发票页「请选择报价单」自定义下拉：加宽列表以完整显示报价单信息 */
.invoice-quote-select-wrap { display: block; }
.invoice-quote-select-trigger {
  cursor: pointer;
  min-height: 38px;
  text-align: left !important;
  font-weight: 400;
}
.invoice-quote-select-list {
  position: absolute;
  left: 0;
  right: auto;
  top: 100%;
  margin-top: 2px;
  z-index: 1050;
  min-width: 520px;
  max-width: min(640px, 95vw);
  width: max-content;
  background: #fff;
  border: 1px solid var(--border, #dee2e6);
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.12);
  padding: 4px 0;
}
.invoice-quote-select-list .invoice-quote-option {
  padding: 8px 12px;
  cursor: pointer;
  white-space: nowrap;
  overflow: visible;
  text-overflow: clip;
  font-size: 14px;
  font-weight: 400;
  max-width: 100%;
}
.invoice-quote-select-list .invoice-quote-option:hover,
.invoice-quote-select-list .invoice-quote-option:focus {
  background: var(--company-brand-soft, rgba(13, 110, 253, 0.12));
}
.invoice-quote-select-list .invoice-quote-option[aria-selected="true"] {
  background: var(--company-brand-soft, rgba(13, 110, 253, 0.2));
}
.invoice-quote-select-list .invoice-quote-option-outdated {
  color: #c00;
  cursor: not-allowed;
}

.x-linkbtn{
  border: 1px solid var(--border);
  background: #fff;
  padding: 8px 12px;
  border-radius: 10px;
  font-weight: 800;
  cursor: pointer;
  font-size: 14px;
  color: var(--text);
}

/* XERO12 finance metrics */
.x-metrics{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:16px;
}
@media (max-width: 1100px){
  .x-metrics{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px){
  .x-metrics{ grid-template-columns: 1fr; }
}
.x-metric-card{
  background: var(--skin-accent-soft) !important;
  border: 1px solid var(--skin-accent-border) !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 4px rgba(15,23,42,.06) !important;
  padding: 16px 18px !important;
  transition: background .15s ease, border-color .15s ease;
}
.x-metric-card:hover{
  background: var(--skin-accent-toast) !important;
  border-color: var(--skin-accent-border) !important;
}
/* 客户详情页财务摘要 6 个小卡片：淡淡皮肤色 + 悬浮加深（JS 生成的是 .card.border，此处用 id 限定） */
#customer-detail-finance-cards .card{
  background: var(--skin-accent-soft) !important;
  border: 1px solid var(--skin-accent-border) !important;
  transition: background .15s ease, border-color .15s ease;
}
#customer-detail-finance-cards .card:hover{
  background: var(--skin-accent-toast) !important;
  border-color: var(--skin-accent-border) !important;
}
.x-metric-label{
  font-size: 12px !important;
  font-weight: 800 !important;
  color: var(--muted) !important;
  letter-spacing: .02em !important;
  text-transform: uppercase;
}
.x-metric-value{
  margin-top: 8px !important;
  font-size: 20px !important;
  font-weight: 900 !important;
  color: var(--text) !important;
  font-variant-numeric: tabular-nums !important;
}
.x-metric-sub{
  margin-top: 6px !important;
  font-size: 12px !important;
  color: var(--muted);
}

/* XERO13 totals refinement */
.x-totals{
  background: #fff !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  padding: 8px 18px !important;
  box-shadow: 0 1px 4px rgba(15,23,42,.06) !important;
}
.x-totals-row{
  display: flex;
  justify-content: space-between;
  padding: 3px 0;
  font-variant-numeric: tabular-nums;
}
.x-totals-row.total{
  font-weight: 900 !important;
  font-size: 16px !important;
  border-top: 1px solid var(--border) !important;
  margin-top: 4px !important;
  padding-top: 5px !important;
}

/* XERO14 dense items table */
.x-items-table{
  width: 100%;
  table-layout: fixed !important;
  border-collapse: collapse !important;
  font-size: 14px !important;
}
.x-items-table thead th{
  font-size: 12px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
  color: var(--muted) !important;
  padding: 6px 10px !important;
  border-bottom: 1px solid var(--border) !important;
  background: #fff !important;
}
/* 表头与下方数据列对齐：描述列左缩进、数字列与输入框同宽 */
.x-items-table thead th.col-desc{
  padding-left: 28px !important;
}
.x-cost-summary-title{
  font-size: 12px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
  color: var(--muted) !important;
}
/* 费用汇总与描述列左边缘对齐（描述列有 28px 缩进给折叠把手） */
#quote-service-section .x-cost-summary-title,
#quote-service-section .x-cost-summary-title + .row {
  padding-left: 28px !important;
}
.x-items-table tbody td{
  padding: 6px 10px !important;
  vertical-align: middle !important;
  border-bottom: 1px solid #f1f4f8 !important;
}
/* 输入框填满单元格，表头与数据列宽度一致 */
.x-items-table .col-desc .form-control,
.x-items-table .col-qty .form-control,
.x-items-table .col-unit .form-control,
.x-items-table .col-gst .form-control,
.x-items-table .col-total .form-control{
  width: 100% !important;
  box-sizing: border-box !important;
}
.x-items-table tbody tr:last-child td{
  border-bottom: none !important;
}
.x-items-table input,
.x-items-table select{
  height: 30px !important;
  font-size: 14px !important;
  padding: 4px 8px !important;
  border-radius: 8px !important;
}
.x-items-table .num{
  text-align: center !important;
  font-variant-numeric: tabular-nums !important;
  font-feature-settings: "tnum" 1 !important;
}
/* 数字列 input 显式居中对齐 */
.x-items-table td.num input,
.x-items-table td.num select {
  text-align: center !important;
}
.x-items-table .col-total{
  font-weight: 700 !important;
}
.service-item-internal{
  background: transparent !important;
}
.service-item-internal td{
  font-size: 12px !important;
  color: var(--muted) !important;
  border-bottom: none !important; /* 去掉一级与二级之间的分隔线 */
}
.x-items-table .btn-danger{
  background: #fff !important;
  color: #dc3545 !important;
  border: 1px solid #dc3545 !important;
}
.x-items-table .btn-danger:hover{
  background: #ffeaea !important;
}

/* XERO15 unified button system */
.btn, button{
  border-radius: 10px !important;
  padding: 9px 14px !important;
  font-weight: 800 !important;
  letter-spacing: .01em !important;
  box-shadow: none !important;
  transition: background .12s ease, border-color .12s ease, color .12s ease, transform .05s ease !important;
}
.btn-sm{
  padding: 6px 10px !important;
  border-radius: 9px !important;
  font-weight: 800 !important;
}

/* Primary：仅按钮随皮肤变色 */
.btn-primary, .x-linkbtn{
  background: var(--skin-accent) !important;
  border: 1px solid var(--skin-accent) !important;
  color: #fff !important;
}
.btn-primary:hover, .x-linkbtn:hover{
  filter: brightness(0.96) !important;
}
.btn-primary:active, .x-linkbtn:active{
  transform: translateY(1px) !important;
}

/* Secondary (outline) */
.btn-outline, .btn-outline-secondary{
  background: #fff !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
.btn-outline:hover, .btn-outline-secondary:hover{
  background: #f3f6fb !important;
  border-color: #c9d6ea !important;
}
/*  outline-primary 随皮肤变色（邀请同事、生成PDF等，覆盖 style.css 硬编码） */
.btn-outline-primary,
body .btn-outline-primary{
  background: #fff !important;
  border: 1px solid var(--skin-accent) !important;
  color: var(--skin-accent) !important;
}
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active,
body .btn-outline-primary:hover,
body .btn-outline-primary:focus,
body .btn-outline-primary:active{
  background: var(--skin-accent) !important;
  border-color: var(--skin-accent-600) !important;
  color: #fff !important;
}

/* Ghost */
.btn-link, .btn-ghost{
  background: transparent !important;
  border: 1px solid transparent !important;
  color: var(--text) !important;
}
.btn-link:hover, .btn-ghost:hover{
  background: var(--skin-accent-soft) !important;
  border-color: var(--skin-accent-border) !important;
}

/* Destructive */
.btn-danger{
  background: #fff !important;
  border: 1px solid #dc3545 !important;
  color: #dc3545 !important;
}
.btn-danger:hover{
  background: #ffeaea !important;
}

/* Disabled */
.btn:disabled, button:disabled,
.btn.disabled{
  opacity: .55 !important;
  cursor: not-allowed !important;
  transform: none !important;
}

/* Focus ring（随皮肤） */
.btn:focus, button:focus,
input:focus, select:focus, textarea:focus{
  outline: none !important;
  box-shadow: 0 0 0 4px var(--skin-accent-soft) !important;
  border-color: var(--skin-accent-border) !important;
}

/* Badge low-sat */
.badge{
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 5px 10px !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  font-size: 12px !important;
  border: 1px solid var(--border) !important;
  background: #f6f8fb !important;
  color: var(--text) !important;
}
.badge-primary{
  background: rgba(26,115,232,0.10) !important;
  border-color: rgba(26,115,232,0.20) !important;
  color: #1557b0 !important;
}
.badge-success{
  background: rgba(22,163,74,0.10) !important;
  border-color: rgba(22,163,74,0.20) !important;
  color: #166534 !important;
}
.badge-danger{
  background: rgba(220,53,69,0.08) !important;
  border-color: rgba(220,53,69,0.18) !important;
  color: #b42318 !important;
}

/* Pagination */
.pagination, #pagination{
  display: flex !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}
.pagination .page-link, #pagination button{
  border-radius: 10px !important;
  border: 1px solid var(--border) !important;
  background: #fff !important;
  padding: 8px 12px !important;
  font-weight: 800 !important;
}
.pagination .page-link:hover, #pagination button:hover{
  background: #f3f6fb !important;
  border-color: #c9d6ea !important;
}
.pagination .active .page-link,
#pagination button.active{
  background: var(--skin-accent-soft) !important;
  border-color: var(--skin-accent-border) !important;
  color: var(--skin-accent-600) !important;
}

/* Table hover */
table tbody tr:hover td{
  background: #f8fbff !important;
}

/* 全站 Bootstrap 弹窗：屏幕居中、固定宽度与最小高度（高度随内容增加），不显示 X */
.modal.show{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0.5rem !important;
}
.modal .modal-dialog{
  width: 520px !important;
  max-width: calc(100vw - 24px) !important;
  min-height: 160px !important;
  max-height: calc(100vh - 1rem) !important;
  margin: 0.5rem auto !important;
  flex-shrink: 0 !important;
}
.modal .modal-dialog.modal-lg{
  width: 800px !important;
  max-width: calc(100vw - 24px) !important;
}
.modal .modal-dialog.modal-xl{
  width: 1140px !important;
  max-width: calc(100vw - 24px) !important;
}
.modal .btn-close{
  display: none !important;
}

/* XERO16 确认/提示弹窗：无右上角 X，全站统一风格 */
#uiModalRoot .ui-modal-x,
#uiAlertModalRoot .ui-modal-x,
#uiAlertModalRoot .ui-alert-modal-x{
  display: none !important;
}
#uiModalRoot{
  position: fixed !important;
  inset: 0 !important;
  z-index: 99999 !important;
}
#uiModalRoot .ui-modal-backdrop,
#uiModalRoot .ui-backdrop,
#uiModalRoot [data-ui-backdrop]{
  position: fixed !important;
  inset: 0 !important;
  background: rgba(11,18,32,0.35) !important;
  backdrop-filter: blur(2px) !important;
}
#uiModalRoot .ui-modal,
#uiModalRoot [data-ui-modal]{
  position: fixed !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: min(520px, calc(100vw - 24px)) !important;
  min-height: 160px !important;
  background: var(--skin-toast-bg, #fff) !important;
  border: 1px solid var(--skin-accent-border, var(--border)) !important;
  border-radius: 14px !important;
  box-shadow: 0 18px 60px rgba(0,0,0,0.12) !important;
  overflow: hidden !important;
}
#uiModalRoot .ui-modal-header,
#uiModalRoot [data-ui-modal-header]{
  padding: 16px 18px !important;
  border-bottom: 1px solid var(--skin-accent-border, var(--border)) !important;
  background: var(--skin-toast-bg, #fff) !important;
  justify-content: center !important;
}
#uiModalRoot .ui-modal-title,
#uiModalRoot [data-ui-modal-title]{
  font-size: 16px !important;
  font-weight: 900 !important;
  margin: 0 !important;
  color: var(--text) !important;
  text-align: center !important;
}
#uiModalRoot .ui-modal-body,
#uiModalRoot [data-ui-modal-body]{
  padding: 16px 18px !important;
  color: var(--text) !important;
  white-space: pre-line !important;
  text-align: center !important;
}
#uiModalRoot .ui-modal-footer,
#uiModalRoot [data-ui-modal-footer]{
  padding: 16px 18px !important;
  border-top: 1px solid var(--skin-accent-border, var(--border)) !important;
  display: flex !important;
  justify-content: center !important;
  gap: 12px !important;
  background: var(--skin-toast-bg, #fff) !important;
}
#uiModalRoot .ui-modal-footer .btn-group,
#uiModalRoot [data-ui-modal-footer] .btn-group{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
}
#uiModalRoot .ui-modal-footer .btn,
#uiModalRoot [data-ui-modal-footer] .btn{
  min-width: 96px !important;
  padding: 10px 20px !important;
  border-radius: 10px !important;
  font-weight: 600 !important;
  transition: box-shadow 0.2s ease, background-color 0.2s ease !important;
}
#uiModalRoot .ui-modal-footer .btn-primary,
#uiModalRoot [data-ui-modal-footer] .btn-primary{
  box-shadow: 0 4px 14px rgba(37,99,235,0.25) !important;
}
#uiModalRoot .ui-modal-footer .btn-primary:hover,
#uiModalRoot [data-ui-modal-footer] .btn-primary:hover{
  box-shadow: 0 6px 18px rgba(37,99,235,0.35) !important;
}
#uiModalRoot .ui-modal-footer .btn-outline,
#uiModalRoot [data-ui-modal-footer] .btn-outline{
  border-width: 1.5px !important;
}

/* 居中提示弹窗（Alert/发送确认等）：无 X，与确认弹窗统一风格 */
#uiAlertModalRoot .ui-modal-backdrop{
  position: fixed !important;
  inset: 0 !important;
  background: rgba(11,18,32,0.35) !important;
  backdrop-filter: blur(2px) !important;
}
#uiAlertModalRoot .ui-modal{
  position: fixed !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: min(520px, calc(100vw - 24px)) !important;
  min-height: 160px !important;
  background: var(--skin-toast-bg, #fff) !important;
  border: 1px solid var(--skin-accent-border, var(--border)) !important;
  border-radius: 14px !important;
  box-shadow: 0 18px 60px rgba(0,0,0,0.12) !important;
  overflow: hidden !important;
}
#uiAlertModalRoot .ui-modal-header{
  padding: 16px 18px !important;
  border-bottom: 1px solid var(--skin-accent-border, var(--border)) !important;
  background: var(--skin-toast-bg, #fff) !important;
  justify-content: center !important;
}
#uiAlertModalRoot .ui-modal-title{
  font-size: 16px !important;
  font-weight: 900 !important;
  margin: 0 !important;
  color: var(--text) !important;
  text-align: center !important;
}
#uiAlertModalRoot .ui-modal-body{
  padding: 16px 18px !important;
  color: var(--text) !important;
  text-align: center !important;
  white-space: pre-line !important;
}
#uiAlertModalRoot .ui-modal-footer{
  padding: 14px 18px !important;
  border-top: 1px solid var(--skin-accent-border, var(--border)) !important;
  display: flex !important;
  justify-content: center !important;
  background: var(--skin-toast-bg, #fff) !important;
}

#uiToastHost{
  position: fixed !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  right: auto !important;
  z-index: 99999 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 10px !important;
  pointer-events: none !important;
}
#uiToastHost .ui-toast{
  pointer-events: auto !important;
}
#uiToastHost .ui-toast,
#uiToastHost [data-ui-toast]{
  width: min(360px, calc(100vw - 32px)) !important;
  border-radius: 12px !important;
  border: 1px solid var(--skin-accent-border) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.08) !important;
  padding: 14px 16px !important;
  background: var(--skin-toast-bg) !important;
  display: flex !important;
  gap: 10px !important;
  align-items: center !important;
  justify-content: center !important;
}
/* 一般类文字：信息/成功/错误 使用正文色，内容居中 */
#uiToastHost .ui-toast .ui-toast-msg,
#uiToastHost .ui-toast-info .ui-toast-msg,
#uiToastHost .ui-toast-success .ui-toast-msg,
#uiToastHost .ui-toast-danger .ui-toast-msg{
  color: var(--text) !important;
  text-align: center !important;
}
/* 警告类文字：使用警告色区分，内容居中 */
#uiToastHost .ui-toast-warning .ui-toast-msg,
#uiToastHost [data-ui-toast][data-type="warning"] .ui-toast-msg{
  color: #92400e !important;
  text-align: center !important;
}
/* 弹窗仅保留文字，不显示圆点 */
#uiToastHost .ui-toast::before,
#uiToastHost [data-ui-toast]::before{
  display: none !important;
}
#uiToastHost .ui-toast.success,
#uiToastHost [data-ui-toast][data-type="success"]{
  background: var(--skin-toast-bg) !important;
  border-color: var(--skin-accent-border) !important;
}
#uiToastHost .ui-toast.danger,
#uiToastHost [data-ui-toast][data-type="danger"]{
  background: var(--skin-toast-bg) !important;
  border-color: var(--skin-accent-border) !important;
}
#uiToastHost .ui-toast.info,
#uiToastHost [data-ui-toast][data-type="info"]{
  background: var(--skin-toast-bg) !important;
  border-color: var(--skin-accent-border) !important;
}
#uiToastHost .ui-toast.warning,
#uiToastHost [data-ui-toast][data-type="warning"]{
  background: var(--skin-toast-bg) !important;
  border-color: var(--skin-accent-border) !important;
}

/* XERO19 tabs (bootstrap -> xero-like underline tabs) */
.nav-tabs, .nav-pills{
  border-bottom: 1px solid var(--border) !important;
  gap: 6px !important;
}
.nav-tabs .nav-link, .nav-pills .nav-link{
  border: 1px solid transparent !important;
  background: transparent !important;
  color: var(--muted) !important;
  font-weight: 900 !important;
  padding: 10px 12px !important;
  border-radius: 10px 10px 0 0 !important;
  position: relative !important;
}
.nav-tabs .nav-link:hover, .nav-pills .nav-link:hover{
  background: var(--skin-accent-soft) !important;
  color: var(--text) !important;
}
.nav-tabs .nav-link.active, .nav-pills .nav-link.active{
  background: transparent !important;
  color: var(--text) !important;
}
.nav-tabs .nav-link.active::after, .nav-pills .nav-link.active::after{
  content: "" !important;
  position: absolute !important;
  left: 10px !important;
  right: 10px !important;
  bottom: -1px !important;
  height: 3px !important;
  border-radius: 999px !important;
  background: var(--skin-accent) !important;
}
.tab-content{
  background: #fff !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  padding: 16px 18px !important;
  margin-top: 12px !important;
  box-shadow: 0 1px 4px rgba(15,23,42,.06) !important;
}
.tab-pane{
  padding: 0 !important;
}
@media (max-width: 720px){
  .nav-tabs, .nav-pills{
    flex-wrap: wrap !important;
  }
  .nav-tabs .nav-link, .nav-pills .nav-link{
    border-radius: 10px !important;
  }
  .nav-tabs .nav-link.active::after, .nav-pills .nav-link.active::after{
    display: none !important;
  }
  .nav-tabs .nav-link.active, .nav-pills .nav-link.active{
    background: var(--skin-accent-soft) !important;
    border: 1px solid var(--skin-accent-border) !important;
  }
}

/* 报价页二级标签：报价预览 | 报价单列表（与一级主导航样式一致） */
#quote-preview-wrap .nav-quote-sub.nav-pills {
  border-bottom: none !important;
}
#quote-preview-wrap .nav-quote-sub .nav-link {
  padding: 8px 12px !important;
  border-radius: 999px !important;
  border: 1px solid transparent !important;
  color: #64748b !important;
  background: transparent !important;
}
#quote-preview-wrap .nav-quote-sub .nav-link:hover {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}
#quote-preview-wrap .nav-quote-sub .nav-link.active {
  background: var(--skin-accent-soft) !important;
  border: 1px solid var(--skin-accent-border) !important;
  color: var(--skin-accent-600) !important;
}
#quote-preview-wrap .nav-quote-sub .nav-link.active::after {
  display: none !important;
}
#quote-preview-wrap .quote-sub-panel {
  margin-top: 0;
}
/* 报价页：防止 grid 子项被表格撑宽，卡片保持 1200px，表格内部横向滚动 */
#quote-preview-wrap {
  min-width: 0;
  overflow: hidden;
}
/* 客户/项目页：与报价页一致，grid 子项占满轨道宽度，卡片同宽 */
#customers-list-wrap,
#projects-list-wrap {
  min-width: 0;
  width: 100%;
}
#quote-toolbar-list {
  display: none;
  align-items: center;
  gap: 8px;
}

/* 发票页二级标签：发票预览 | 发票列表（与报价页一致，使用相同 class nav-quote-sub） */
#invoices-list-wrap .nav-quote-sub.nav-pills {
  border-bottom: none !important;
}
#invoices-list-wrap .nav-quote-sub .nav-link {
  padding: 8px 12px !important;
  border-radius: 999px !important;
  border: 1px solid transparent !important;
  color: #64748b !important;
  background: transparent !important;
}
#invoices-list-wrap .nav-quote-sub .nav-link:hover {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}
#invoices-list-wrap .nav-quote-sub .nav-link.active {
  background: var(--skin-accent-soft) !important;
  border: 1px solid var(--skin-accent-border) !important;
  color: var(--skin-accent-600) !important;
}
#invoices-list-wrap .nav-quote-sub .nav-link.active::after {
  display: none !important;
}
#invoices-list-wrap .quote-sub-panel {
  margin-top: 0;
}

/* 项目页二级标签：项目列表 | 项目管理（与发票页一致，使用相同 class nav-quote-sub） */
#projects-list-wrap .nav-quote-sub.nav-pills {
  border-bottom: none !important;
}
#projects-list-wrap .nav-quote-sub .nav-link {
  padding: 8px 12px !important;
  border-radius: 999px !important;
  border: 1px solid transparent !important;
  color: #64748b !important;
  background: transparent !important;
}
#projects-list-wrap .nav-quote-sub .nav-link:hover {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}
#projects-list-wrap .nav-quote-sub .nav-link.active {
  background: var(--skin-accent-soft) !important;
  border: 1px solid var(--skin-accent-border) !important;
  color: var(--skin-accent-600) !important;
}
#projects-list-wrap .nav-quote-sub .nav-link.active::after {
  display: none !important;
}
#projects-list-wrap .quote-sub-panel {
  margin-top: 0;
}

/* 财务页二级标签：收款历史 | 对帐单（与报价单一致） */
#finance-toolbar-wrap .nav-quote-sub.nav-pills {
  border-bottom: none !important;
}
#finance-toolbar-wrap .nav-quote-sub .nav-link {
  padding: 8px 12px !important;
  border-radius: 999px !important;
  border: 1px solid transparent !important;
  color: #64748b !important;
  background: transparent !important;
}
#finance-toolbar-wrap .nav-quote-sub .nav-link:hover {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}
#finance-toolbar-wrap .nav-quote-sub .nav-link.active {
  background: var(--skin-accent-soft) !important;
  border: 1px solid var(--skin-accent-border) !important;
  color: var(--skin-accent-600) !important;
}
#finance-toolbar-wrap .nav-quote-sub .nav-link.active::after {
  display: none !important;
}
#finance-toolbar-wrap .quote-sub-panel {
  margin-top: 0;
}

/* 发票列表「所有状态」下拉框：缩成约 4 个汉字宽（红框大小） */
#invoice-sub-status-filter.invoice-sub-status-filter-narrow,
#invoice-sub-status-filter {
  width: 5em !important;
  min-width: 5em !important;
  max-width: 5em !important;
  padding-left: 2px !important;
  padding-right: 1.25em !important;
  box-sizing: border-box !important;
}

/* 发票列表金额汇总：与报价列表此处样式完全一致（容器/标签/数值/百分比） */
.invoice-sub-summary-inline {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0 6px;
  padding: 6px 12px;
  border-radius: 8px;
  background: linear-gradient(180deg, #f8f9fa 0%, #f1f3f5 100%);
  border: 1px solid rgba(0,0,0,.06);
  font-size: 0.9rem;
}
.invoice-sub-summary-item {
  display: inline-flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0 4px;
  white-space: nowrap;
}
.invoice-sub-summary-sep {
  width: 1px;
  height: 1em;
  background: rgba(0,0,0,.12);
  margin: 0 6px;
  align-self: center;
}
.invoice-sub-summary-inline .invoice-sub-summary-label {
  font-size: 0.8rem;
  color: #6c757d;
  font-weight: 600;
  margin-right: 2px;
}
.invoice-sub-summary-inline .invoice-sub-summary-value {
  font-size: 1rem;
  font-weight: 700;
  color: #1a1a1a;
}
.invoice-sub-summary-inline .invoice-sub-summary-pct {
  font-size: 0.75rem;
  padding: 1px 6px;
  border-radius: 999px;
  background: rgba(0,0,0,.08);
  color: #495057;
  font-weight: 600;
  margin-left: 2px;
}
/* 已逾期金额不为 0 时，整块「已逾期」内容用红色 */
.invoice-sub-summary-item-overdue.invoice-sub-summary-item .invoice-sub-summary-label,
.invoice-sub-summary-item-overdue.invoice-sub-summary-item .invoice-sub-summary-value,
.invoice-sub-summary-item-overdue.invoice-sub-summary-item .invoice-sub-summary-pct {
  color: #c92a2a !important;
}
.invoice-sub-summary-item-overdue.invoice-sub-summary-item .invoice-sub-summary-pct {
  background: rgba(201,42,42,.15) !important;
}

/* 系统设置多级菜单：二级（个人信息|公司管理|系统管理）、三级（团队|公司资料|订阅 等）与报价/发票页一致 */
.nav-sys-sub.nav-pills,
.nav-sys-tertiary.nav-pills {
  border-bottom: none !important;
}
.nav-sys-sub .nav-link,
.nav-sys-tertiary .nav-link {
  padding: 8px 12px !important;
  border-radius: 999px !important;
  border: 1px solid transparent !important;
  color: #64748b !important;
  background: transparent !important;
}
.nav-sys-sub .nav-link:hover,
.nav-sys-tertiary .nav-link:hover {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}
.nav-sys-sub .nav-link.active,
.nav-sys-tertiary .nav-link.active {
  background: var(--skin-accent-soft) !important;
  border: 1px solid var(--skin-accent-border) !important;
  color: var(--skin-accent-600) !important;
}
.nav-sys-sub .nav-link.active::after,
.nav-sys-tertiary .nav-link.active::after {
  display: none !important;
}

/* =========================
   XERO20 Typography & Rhythm（使用 ui.css 字号变量）
   ========================= */
.page-title{
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-end !important;
  margin-bottom: 18px !important;
}
.page-title h1{
  font-size: var(--fs-22) !important;
  font-weight: 700 !important;
  margin: 0 !important;
  letter-spacing: -0.3px !important;
}
.page-title .subtitle,
.page-title small{
  display: block !important;
  font-size: var(--fs-12) !important;
  color: var(--muted) !important;
  margin-top: 4px !important;
  font-weight: 600 !important;
}
.card-header strong{
  font-size: var(--fs-14) !important;
  font-weight: 700 !important;
}

/* 仪表盘模块标题压缩高度 */
#dashboard-page .card .card-header {
  padding: 10px 14px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}
#dashboard-page .card .card-body:not(.p-0) {
  padding: 12px 14px !important;
}
#dashboard-page .card .card-body.p-0 {
  padding: 0 !important;
}
#dashboard-page .card .card-header strong {
  font-size: 14px !important;
  font-weight: 600 !important;
}
#dashboard-page .card .card-header:not(:has(strong)) {
  font-size: 14px !important;
  font-weight: 600 !important;
}
/* 仪表盘快速操作：标签与右侧按钮垂直居中对齐 */
#dashboard-title-wrap .toolbar-right .dash-quick-actions-label {
  display: inline-flex;
  align-items: center;
  min-height: 31px;
  transform: translateY(-2px);
}
.x-field label{
  font-size: var(--fs-12) !important;
  font-weight: 600 !important;
  color: var(--muted) !important;
}
table{
  font-size: var(--fs-14) !important;
}
.x-metric-value{
  font-size: var(--fs-20) !important;
  font-weight: 700 !important;
  letter-spacing: -0.4px !important;
}
.empty-title{
  font-size: var(--fs-16) !important;
  font-weight: 700 !important;
}
.empty-desc{
  font-size: var(--fs-12) !important;
  color: var(--muted) !important;
}
.empty-center{
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  min-height: 120px !important;
}
.empty-center .empty-icon{
  font-size: 2rem !important;
  color: var(--muted) !important;
}
.empty-center .empty-title{
  margin: 0 !important;
}
.x-stack > *{
  margin-bottom: 16px !important;
}
.x-stack > *:last-child{
  margin-bottom: 0 !important;
}
.toolbar{
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
}
@media (max-width: 720px){
  .page-title{
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
  }
}

/* =========================
   XERO20B Button Palette Lock
   ========================= */

/* 1) 主按钮：随皮肤变色 */
.btn-primary{
  background: var(--skin-accent) !important;
  border: 1px solid var(--skin-accent) !important;
  color: #fff !important;
}
.btn-primary:hover{ filter: brightness(0.96) !important; }
.btn-primary:active{ transform: translateY(1px) !important; }

/* 2) 危险按钮 */
.btn-danger{
  background: #fff !important;
  border: 1px solid #dc3545 !important;
  color: #dc3545 !important;
}
.btn-danger:hover{ background: #ffeaea !important; }

/* 3) 其余语义色降级为次按钮 */
.btn-info,
.btn-success,
.btn-secondary,
.btn-warning,
.btn-outline-info,
.btn-outline-success,
.btn-outline-secondary,
.btn-outline-warning{
  background: #fff !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
.btn-info:hover,
.btn-success:hover,
.btn-secondary:hover,
.btn-warning:hover,
.btn-outline-info:hover,
.btn-outline-success:hover,
.btn-outline-secondary:hover,
.btn-outline-warning:hover{
  background: #f3f6fb !important;
  border-color: #c9d6ea !important;
  color: var(--text) !important;
}

/* 4) 全宽大按钮统一规格 */
.btn.w-100,
button.w-100,
.btn.btn-block,
button.btn-block{
  height: 44px !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .01em !important;
}

/* 5) x-actions 内按钮宽度 */
.x-actions .btn,
.x-actions button{
  width: 100% !important;
  margin: 0 !important;
}

/* 6) focus ring 统一 */
.btn:focus, button:focus{
  outline: none !important;
  box-shadow: 0 0 0 4px rgba(26,115,232,0.14) !important;
  border-color: rgba(26,115,232,0.45) !important;
}

/* XERO22 final button color lock */
a.btn, button.btn, .btn{
  background-image: none !important;
}

/* 1) Primary：唯一允许的实心色，随皮肤变色 */
.btn-primary,
.btn.btn-primary{
  background: var(--skin-accent) !important;
  border-color: var(--skin-accent) !important;
  color: #fff !important;
}

/* 2) 彩色实心按钮全部收口成次按钮 */
.btn-success, .btn-info, .btn-warning, .btn-secondary,
.btn.btn-success, .btn.btn-info, .btn.btn-warning, .btn.btn-secondary,
a.btn-success, a.btn-info, a.btn-warning, a.btn-secondary{
  background: #fff !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
  box-shadow: none !important;
}
.btn-success:hover, .btn-info:hover, .btn-warning:hover, .btn-secondary:hover,
.btn.btn-success:hover, .btn.btn-info:hover, .btn.btn-warning:hover, .btn.btn-secondary:hover,
a.btn-success:hover, a.btn-info:hover, a.btn-warning:hover, a.btn-secondary:hover{
  background: #f3f6fb !important;
  border-color: #c9d6ea !important;
  color: var(--text) !important;
}

/* 3) Destructive：危险按钮再加固 */
.btn-danger,
.btn.btn-danger,
a.btn-danger{
  background: #fff !important;
  color: #dc3545 !important;
  border: 1px solid #dc3545 !important;
}
.btn-danger:hover,
.btn.btn-danger:hover,
a.btn-danger:hover{
  background: #ffeaea !important;
}

/* 4) 兜底：inline style 背景色不影响按钮体系 */
.btn[style*="background"],
.btn[style*="background-color"],
button[style*="background"],
button[style*="background-color"],
a.btn[style*="background"],
a.btn[style*="background-color"]{
  background-image: none !important;
}

/* 5) 全宽按钮高度与排版一致 */
.x-actions .btn,
.x-actions a.btn,
.btn.w-100,
a.btn.w-100{
  height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  border-radius: 12px !important;
  font-weight: 900 !important;
}

/* XERO23 global typography lock（与 ui.css 统一：--font，字号变量，字重 400/600/700） */
/* 全站基础 */
html, body{
  font-family: var(--font) !important;
  font-size: var(--fs-14) !important;
  line-height: 1.45 !important;
  text-rendering: optimizeLegibility !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
}

/* 锁定所有交互元素字体 */
button, input, select, textarea,
.btn, a.btn, button.btn,
.navbar, .topbar, .sl-topbar, .nav, .nav-link,
table, th, td{
  font-family: var(--font) !important;
}

/* 按钮统一字重与字号 */
.btn, a.btn, button.btn,
button{
  font-size: var(--fs-14) !important;
  font-weight: 700 !important;
  letter-spacing: .01em !important;
}

/* 小按钮统一 */
.btn-sm, .btn.btn-sm, a.btn-sm{
  font-size: 13px !important;
  font-weight: 700 !important;
}

/* 表单 label */
.x-field label,
label{
  font-family: var(--font) !important;
  font-weight: 600 !important;
}
small, .muted, .text-muted, .help-text, .x-help{
  font-family: var(--font) !important;
}

/* 表头与导航 */
thead th{
  font-family: var(--font) !important;
  font-weight: 600 !important;
}
.nav-link{
  font-family: var(--font) !important;
  font-weight: 600 !important;
}
.btn, a.btn, button.btn{
  font-style: normal !important;
  text-transform: none !important;
}

/* XERO24 unify full-width action blocks */
.x-actions,
.form-actions,
.actions,
.card .card-body .btn-group,
.card .card-body .d-grid{
  gap: 12px !important;
}

/* 全宽按钮高度与排版统一 */
.x-actions .btn,
.x-actions a.btn,
.x-actions button.btn,
.btn.w-100,
a.btn.w-100,
button.btn.w-100{
  height: 44px !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .01em !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* 按钮组里除 primary/danger 外全部压成次按钮 */
.x-actions .btn:not(.btn-primary):not(.btn-danger):not(.x-linkbtn),
.x-actions a.btn:not(.btn-primary):not(.btn-danger):not(.x-linkbtn),
.x-actions button.btn:not(.btn-primary):not(.btn-danger):not(.x-linkbtn){
  background: #fff !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
}

/* 去语义色 */
.x-actions .btn-info,
.x-actions .btn-success,
.x-actions .btn-warning,
.x-actions .btn-secondary,
.x-actions .btn-outline-info,
.x-actions .btn-outline-success,
.x-actions .btn-outline-warning,
.x-actions .btn-outline-secondary{
  background: #fff !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
}

/* 次按钮 hover */
.x-actions .btn:not(.btn-primary):not(.btn-danger):hover,
.x-actions a.btn:not(.btn-primary):not(.btn-danger):hover,
.x-actions button.btn:not(.btn-primary):not(.btn-danger):hover{
  background: #f3f6fb !important;
  border-color: #c9d6ea !important;
}

/* danger 克制化 */
.x-actions .btn-danger,
.x-actions a.btn-danger,
.x-actions button.btn-danger{
  background: #fff !important;
  border: 1px solid #dc3545 !important;
  color: #dc3545 !important;
}
.x-actions .btn-danger:hover,
.x-actions a.btn-danger:hover,
.x-actions button.btn-danger:hover{
  background: #ffeaea !important;
}

/* XERO30 finance payment section header */
.x-section-head{
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 14px 16px !important;
  background: #fff !important;
}
.x-section-left{
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  min-width: 0 !important;
}
.x-section-title{
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  letter-spacing: -0.2px !important;
}
.x-section-subtitle{
  font-size: 12px !important;
  color: var(--mono-600) !important;
  font-weight: 600 !important;
}
.x-section-right{
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
.x-section-head .btn{
  height: 36px !important;
  padding: 7px 14px !important;
  border-radius: 10px !important;
}
@media (max-width: 720px){
  .x-section-head{
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  .x-section-right{
    width: 100% !important;
  }
  .x-section-right .btn{
    width: 100% !important;
    justify-content: center !important;
  }
}

/* XERO31 unified icon-button color scheme (minimal, low-sat) */

/* 1) 图标继承按钮颜色 */
.btn i,
.btn .fa, .btn .fas, .btn .far, .btn .fal, .btn .fab,
.btn [class^="bi-"], .btn [class*=" bi-"],
.btn svg, .btn svg *{
  color: currentColor !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}
/* 风险类操作图标强制红色（覆盖上方 currentColor） */
.btn-danger .fa, .btn-danger .fas, .btn-danger .far, .btn-danger .fal, .btn-danger i[class*="fa-"],
.btn-outline-danger .fa, .btn-outline-danger .fas, .btn-outline-danger .far, .btn-outline-danger i[class*="fa-"],
.btn [class*="danger"] .fa, .btn [class*="danger"] .fas, .btn [class*="danger"] i[class*="fa-"]{
  color: var(--danger) !important;
  fill: var(--danger) !important;
}
/* 全站兜底：报价/发票表单内服务项、任意 .x-section 中的危险按钮图标一律红色 */
.x-items-table .btn.btn-danger .fa, .x-items-table .btn.btn-danger .fas,
.x-items-table .btn.btn-outline-danger .fa, .x-items-table .btn.btn-outline-danger .fas,
#quote-service-section .btn.btn-danger .fa, #quote-service-section .btn.btn-danger .fas,
#quote-service-section .btn.btn-outline-danger .fa, #quote-service-section .btn.btn-outline-danger .fas,
.x-invoice-services-section .btn.btn-danger .fa, .x-invoice-services-section .btn.btn-danger .fas,
.x-invoice-services-section .btn.btn-outline-danger .fa, .x-invoice-services-section .btn.btn-outline-danger .fas,
.x-section .btn.btn-danger .fa, .x-section .btn.btn-danger .fas,
.x-section .btn.btn-outline-danger .fa, .x-section .btn.btn-outline-danger .fas{
  color: var(--danger) !important;
  fill: var(--danger) !important;
}

/* 项目列表：仅点击项目名称打开详情，仅名称列显示手型 */
#project-list tr.project-list-row td:first-child {
  cursor: pointer;
}

/* 项目列表「项目名称」列：第1行项目名，第2行关联客户 */
#project-list .project-name-line {
  line-height: 1.3;
}
#project-list .project-name-customer {
  font-size: 0.875em;
  line-height: 1.3;
  margin-top: 0.2em;
}

/* 项目列表「项目地址」列：超过 18 字由 JS 截断，此处限制最大宽度并保证悬浮显示全文（title） */
#project-list .project-address-cell {
  max-width: 22em;
  overflow: hidden;
}

#project-list .project-address-status {
  font-size: 0.875em;
  color: var(--bs-secondary-color, #6c757d);
  line-height: 1.3;
  margin-top: 0.15em;
}

/* 项目列表「报价」列：第1行报价单数量，第2行报价单金额总计 */
#project-list .project-quote-cell {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.15em;
}
#project-list .project-quote-count {
  font-variant-numeric: tabular-nums;
}
#project-list .project-quote-total {
  font-size: 0.9em;
  color: var(--bs-secondary-color, #6c757d);
}
/* 报价金额非零时黑色更醒目 */
#project-list .project-quote-total.customer-cell-nonzero {
  color: var(--bs-body-color, #212529) !important;
}

/* 2) 表格内操作按钮统一线框灰 */
table .btn.btn-sm,
.table .btn.btn-sm,
.x-items-table .btn,
#invoice-list .btn,
#quote-list .btn,
#project-list .btn,
#customer-list .customer-list-row-clickable {
  cursor: pointer;
}
#customer-list .btn{
  background: #fff !important;
  border: 1px solid var(--border) !important;
  color: #5f6b7a !important;
  box-shadow: none !important;
}

/* hover：轻微蓝灰底 */
table .btn.btn-sm:hover,
.table .btn.btn-sm:hover,
.x-items-table .btn:hover,
#invoice-list .btn:hover,
#quote-list .btn:hover,
#project-list .btn:hover,
#customer-list .btn:hover{
  background: #f3f6fb !important;
  border-color: #c9d6ea !important;
  color: #243041 !important;
}

/* 客户列表工具栏「未收款」：字号与左侧个人/公司数量一致 */
.customer-toolbar-unpaid {
  font-size: 0.85rem !important;
  margin-right: 1rem;
}

/* 客户列表工具栏整行：所有内容上下居中对齐 */
#customers-list-wrap .card-header {
  display: flex !important;
  align-items: center !important;
}
#customers-list-wrap .card-header .toolbar {
  align-items: center !important;
  width: 100%;
}
#customers-list-wrap .toolbar .toolbar-left,
#customers-list-wrap .toolbar .toolbar-right {
  align-items: center !important;
}
#customers-list-wrap .toolbar .x-field {
  align-self: center;
  margin: 0;
}
#customers-list-wrap .toolbar .x-field .form-control {
  vertical-align: middle;
}

/* 客户列表工具栏：个人/公司图标与人数与同行绝对上下居中对齐（方案 C：统一行高 + 整块上移） */
#customers-list-wrap .card-header #customer-type-stats {
  display: inline-flex !important;
  align-items: center !important;
  line-height: 1 !important;
  transform: translateY(-2px);
}
#customers-list-wrap .card-header .customer-stat-icon .stat-count {
  line-height: 1 !important;
}
#customers-list-wrap .card-header .customer-stat-icon i {
  line-height: 1 !important;
  display: inline-block !important;
}

/* 客户列表「项目」数字链接：与正文同色，悬停无字体放大与颜色变化 */
#customer-list .project-count-link {
  color: inherit;
  cursor: pointer;
}
#customer-list .project-count-link:hover {
  color: inherit !important;
  font-size: inherit;
  font-weight: inherit;
}
/* 客户列表「项目」为 0 时：不可点击，灰色无悬停 */
#customer-list .project-count-link-disabled {
  cursor: default;
  color: var(--bs-secondary, #6c757d) !important;
  pointer-events: none;
}
#customer-list .project-count-link-disabled:hover {
  color: var(--bs-secondary, #6c757d) !important;
  font-size: inherit;
  font-weight: inherit;
}

/* 客户列表「上次互助」列：7天内绿、8～30天土黄、31～59天橙、60天+红、无互动黑 */
#customer-list .customer-last-interaction-cell { white-space: nowrap; }
#customer-list .customer-last-interaction-none { color: #6c757d; }
#customer-list .customer-last-interaction-7    { color: #198754; }
#customer-list .customer-last-interaction-30   { color: #b8860b; }
#customer-list .customer-last-interaction-59   { color: #fd7e14; }
#customer-list .customer-last-interaction-60   { color: #dc3545; }
#customer-list .customer-last-interaction-warn  { color: #dc3545; margin-left: 0.15em; }

/* 客户列表「状态」「上次互动」「项目」列：字号与上方单选项（全部客户/需要跟进/长期未联系）一致 */
#customer-list .customer-status-cell,
#customer-list .customer-last-interaction-cell {
  font-size: 0.85rem;
}
#customer-list .customer-project-cell {
  font-size: 1rem;
}
/* 客户列表「状态」列：正常灰、需要跟进橙、长期未联系红、欠款红+强调 */
#customer-list .customer-status-cell { white-space: nowrap; }
#customer-list .customer-status-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.1rem 0.4rem;
  border-radius: 999px;
  font-size: inherit;
  font-weight: 500;
}
#customer-list .customer-status-normal {
  color: #6c757d;
  background-color: rgba(108, 117, 125, 0.1);
}
#customer-list .customer-status-need-follow {
  color: #f97316;
  background-color: rgba(249, 115, 22, 0.08);
}
#customer-list .customer-status-long-no-contact {
  color: #dc2626;
  background-color: rgba(220, 38, 38, 0.08);
}
#customer-list .customer-status-overdue {
  color: #dc2626;
  background-color: rgba(220, 38, 38, 0.12);
}

/* 客户列表「项目」列：第1行未开始，第2行进行中，第3行已完成，第4行总计（字号与上方单选项一致，见上方统一样式） */
#customer-list .customer-project-cell {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.15em;
}
#customer-list .customer-project-row {
  font-variant-numeric: tabular-nums;
}
#customer-list .customer-project-not-started,
#customer-list .customer-project-in-progress,
#customer-list .customer-project-completed,
#customer-list .customer-project-total {
  font-variant-numeric: tabular-nums;
}
/* 客户列表：金额与数量使用原本颜色，不再使用皮肤色强调 */
/* 原规则已移除：#customer-list .customer-*-nonzero 的皮肤色 */

/* 客户列表「报价」列：仅显示总报价金额 */
#customer-list .customer-quote-cell {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
#customer-list .customer-quote-total {
  font-size: 0.9em;
  color: var(--bs-secondary-color, #6c757d);
}
/* 报价金额非零时黑色更醒目 */
#customer-list .customer-quote-total.customer-cell-nonzero {
  color: var(--bs-body-color, #212529) !important;
}
/* 客户列表 $0.00 与报价列一致为灰色（不影响逾期列红色） */
#customer-list .customer-cell-zero {
  color: var(--bs-secondary-color, #6c757d) !important;
}
#customer-list .customer-invoice-cell {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.15em;
}
#customer-list .customer-invoice-count {
  font-variant-numeric: tabular-nums;
}

/* 客户列表 / 项目列表「收款」列：第1行未收款金额汇总，第2行已收款金额汇总；字号与报价/发票列金额一致 */
#customer-list .customer-received-cell,
#project-list .customer-received-cell {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.15em;
  font-size: 0.9em;
}
#customer-list .customer-received-line,
#project-list .customer-received-line {
  font-variant-numeric: tabular-nums;
}
#customer-list .customer-received-line.customer-received-paid,
#project-list .customer-received-line.customer-received-paid {
  color: var(--bs-secondary-color, #6c757d);
}
#customer-list .customer-invoice-total {
  font-size: 0.9em;
  color: var(--bs-secondary-color, #6c757d);
}

/* 项目列表「已开票」数字链接：悬停无字体放大与颜色变化 */
#project-list .project-count-link {
  color: inherit;
  cursor: pointer;
}
#project-list .project-count-link:hover {
  color: inherit !important;
  font-size: inherit;
  font-weight: inherit;
}
#project-list .project-count-link-disabled {
  cursor: default;
  color: var(--bs-secondary, #6c757d) !important;
  pointer-events: none;
}
#project-list .project-count-link-disabled:hover {
  color: var(--bs-secondary, #6c757d) !important;
  font-size: inherit;
  font-weight: inherit;
}

/* 客户列表「未收款」金额链接：>0 时红色否则黑色，悬浮不改色不加粗，点击跳转对帐单 */
#customer-list .customer-unpaid-link {
  color: inherit;
  cursor: pointer;
}
/* 客户列表「未到期」列：统一黑色显示全部未到期金额 */
#customer-list td.customer-col-unpaid,
#customer-list td.customer-col-unpaid .customer-unpaid-link {
  color: var(--bs-body-color, #212529) !important;
}
#customer-list .customer-unpaid-link.customer-unpaid-nonzero,
#customer-list .customer-unpaid-link.customer-unpaid-nonzero:link,
#customer-list .customer-unpaid-link.customer-unpaid-nonzero:visited {
  color: var(--bs-danger, #b91c1c) !important;
}

/* 项目列表「未收款」金额链接：与客户页一致，悬浮不加粗，>0 红色，点击跳转对帐单（按项目检索） */
#project-list .customer-unpaid-link {
  color: inherit;
  cursor: pointer;
}
#project-list .customer-unpaid-link.customer-unpaid-nonzero,
#project-list .customer-unpaid-link.customer-unpaid-nonzero:link,
#project-list .customer-unpaid-link.customer-unpaid-nonzero:visited {
  color: var(--bs-danger, #b91c1c) !important;
}

/* 客户列表「逾期」列：已逾期金额红色；逾期天数显示在金额下一行、居中对齐金额；字号与报价列一致 */
#customer-list .customer-overdue-cell {
  font-size: 0.9em;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
}
#customer-list .customer-overdue-cell.text-danger {
  color: var(--bs-danger, #b91c1c) !important;
}
#customer-list .customer-overdue-days {
  display: block;
  line-height: 1.2;
  margin-top: 2px;
  color: var(--bs-body-color, #212529) !important; /* 逾期天数（X天）显示为黑色 */
}

/* 项目列表顶部「未收款」汇总金额：>0 时红色 */
#project-total-unpaid-wrap #project-total-unpaid.text-danger {
  color: var(--bs-danger, #b91c1c) !important;
}

/* active */
table .btn.btn-sm:active,
.table .btn.btn-sm:active{
  transform: translateY(1px) !important;
}

/* 3) 危险按钮：克制红边，hover 才明确 */
table .btn.btn-sm.btn-danger,
.table .btn.btn-sm.btn-danger,
.x-items-table .btn-danger{
  background: #fff !important;
  border-color: rgba(220,53,69,0.55) !important;
  color: rgba(180,35,24,0.95) !important;
}
table .btn.btn-sm.btn-danger:hover,
.table .btn.btn-sm.btn-danger:hover,
.x-items-table .btn-danger:hover{
  background: #ffeaea !important;
  border-color: rgba(220,53,69,0.75) !important;
  color: #b42318 !important;
}

/* 4) 表格内彩色实心按钮全部降级为线框灰 */
table .btn.btn-sm.btn-success,
table .btn.btn-sm.btn-info,
table .btn.btn-sm.btn-warning,
table .btn.btn-sm.btn-secondary,
table .btn.btn-sm.btn-primary,
.table .btn.btn-sm.btn-success,
.table .btn.btn-sm.btn-info,
.table .btn.btn-sm.btn-warning,
.table .btn.btn-sm.btn-secondary,
.table .btn.btn-sm.btn-primary{
  background: #fff !important;
  border: 1px solid var(--border) !important;
  color: #5f6b7a !important;
}

/* 5) 图标按钮尺寸统一 */
table .btn.btn-sm,
.table .btn.btn-sm{
  height: 32px !important;
  width: 32px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 10px !important;
}

/* 6) 操作功能图标着色：表格/列表内非危险按钮用皮肤色，危险按钮用红色（覆盖上方 currentColor） */
table td .btn.btn-sm:not(.btn-danger) .fa,
table td .btn.btn-sm:not(.btn-danger) .fas,
table td .btn.btn-sm:not(.btn-danger) .far,
table td .btn.btn-sm:not(.btn-danger) i[class*="fa-"],
#customer-list .btn:not(.btn-danger) .fa,
#customer-list .btn:not(.btn-danger) .fas,
#customer-list .btn:not(.btn-danger) .far,
#customer-list .btn:not(.btn-danger) i[class*="fa-"],
#project-list .btn:not(.btn-danger) .fa,
#project-list .btn:not(.btn-danger) .fas,
#quote-list .btn:not(.btn-danger) .fa,
#quote-list .btn:not(.btn-danger) .fas,
#invoice-list .btn:not(.btn-danger) .fa,
#invoice-list .btn:not(.btn-danger) .fas,
.table-actions .btn:not(.btn-danger) .fa,
.table-actions .btn:not(.btn-danger) .fas,
.table-actions .btn:not(.btn-danger) i[class*="fa-"]{
  color: var(--skin-accent, var(--primary)) !important;
  fill: var(--skin-accent, var(--primary)) !important;
}
/* 危险图标红色：必须高于上方“非危险”规则，故加上 .btn-sm 提高特异性 */
table td .btn.btn-sm.btn-danger .fa,
table td .btn.btn-sm.btn-danger .fas,
#customer-list .btn.btn-sm.btn-outline-danger .fa,
#customer-list .btn.btn-sm.btn-outline-danger .fas,
#customer-list .btn.btn-sm.btn-danger .fa,
#customer-list .btn.btn-sm.btn-danger .fas,
#project-list .btn.btn-sm.btn-outline-danger .fa,
#project-list .btn.btn-sm.btn-outline-danger .fas,
#project-list .btn.btn-sm.btn-danger .fa,
#project-list .btn.btn-sm.btn-danger .fas,
#quote-list .btn.btn-sm.btn-outline-danger .fa,
#quote-list .btn.btn-sm.btn-outline-danger .fas,
#quote-list .btn.btn-sm.btn-danger .fa,
#quote-list .btn.btn-sm.btn-danger .fas,
#invoice-list .btn.btn-sm.btn-outline-danger .fa,
#invoice-list .btn.btn-sm.btn-outline-danger .fas,
#invoice-list .btn.btn-sm.btn-danger .fa,
#invoice-list .btn.btn-sm.btn-danger .fas,
.table-actions .btn.btn-sm.btn-outline-danger .fa,
.table-actions .btn.btn-sm.btn-outline-danger .fas,
.table-actions .btn.btn-sm.btn-danger .fa,
.table-actions .btn.btn-sm.btn-danger .fas,
#quote-drafts-list .btn.btn-sm.btn-outline-danger .fa,
#quote-drafts-list .btn.btn-sm.btn-outline-danger .fas,
#invoice-drafts-list .btn.btn-sm.btn-outline-danger .fa,
#invoice-drafts-list .btn.btn-sm.btn-outline-danger .fas,
#drafts-page .btn.btn-outline-danger .fa,
#drafts-page .btn.btn-outline-danger .fas,
#drafts-page .btn.btn-danger .fa,
#drafts-page .btn.btn-danger .fas{
  color: var(--danger) !important;
  fill: var(--danger) !important;
}

/* 发票列表：已付清时编辑按钮禁用态 — 与可用态同尺寸(32×32)，灰色不用皮肤色 */
#invoice-list .btn.btn-edit-disabled,
#invoice-list .btn.btn-edit-disabled .fa,
#invoice-list .btn.btn-edit-disabled .fas,
table td .btn.btn-sm.btn-edit-disabled,
table td .btn.btn-sm.btn-edit-disabled .fa,
table td .btn.btn-sm.btn-edit-disabled .fas{
  color: #6c757d !important;
  fill: #6c757d !important;
  border: 1px solid #adb5bd !important;
  background: #fff !important;
  cursor: not-allowed !important;
}
table td .btn.btn-sm.btn-edit-disabled:disabled{
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  opacity: 1 !important;
}
/* 实心危险按钮（白底红字场景下图标也红） */
table td .btn.btn-sm.btn-danger .fa,
table td .btn.btn-sm.btn-danger .fas{
  color: var(--danger) !important;
}

/* 报价单列表：删除按钮不可用时显示灰色（已开票锁定），不用红色 */
#quotes-list .btn.btn-sm.btn-danger:disabled,
#quotes-list .btn.btn-sm.btn-danger:disabled .fa,
#quotes-list .btn.btn-sm.btn-danger:disabled .fas {
  color: #6c757d !important;
  fill: #6c757d !important;
  border-color: #adb5bd !important;
  background: #fff !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
}

/* 报价单列表：金额汇总 — 一行显示，紧凑且美观 */
.quotes-list-summary-inline {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0 6px;
  padding: 6px 12px;
  border-radius: 8px;
  background: linear-gradient(180deg, #f8f9fa 0%, #f1f3f5 100%);
  border: 1px solid rgba(0,0,0,.06);
  font-size: 0.9rem;
}
.quotes-summary-inline-item {
  display: inline-flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0 4px;
  white-space: nowrap;
}
.quotes-summary-inline-sep {
  width: 1px;
  height: 1em;
  background: rgba(0,0,0,.12);
  margin: 0 6px;
  align-self: center;
}
.quotes-list-summary-inline .quotes-summary-label {
  font-size: 0.8rem;
  color: #6c757d;
  font-weight: 600;
  margin-right: 2px;
}
.quotes-list-summary-inline .quotes-summary-value {
  font-size: 1rem;
  font-weight: 700;
  color: #1a1a1a;
}
.quotes-list-summary-inline .quotes-summary-pct {
  font-size: 0.75rem;
  padding: 1px 6px;
  border-radius: 999px;
  background: rgba(0,0,0,.08);
  color: #495057;
  font-weight: 600;
  margin-left: 2px;
}

/* 报价单列表：数据/图标单行显示，不换行 */
#quotes-table-wrap .table td {
  white-space: nowrap;
  vertical-align: middle;
}
#quotes-table-wrap .table td.num,
#invoice-sub-table-wrap .table td.num,
#finance-invoice-table-wrap .table td.num {
  font-weight: 400;
}
.invoice-progress-num {
  margin-right: 6px;
  font-weight: 600;
}
#quotes-table-wrap .table td:nth-child(3) {
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* 第9列：当前进度 - 固定占位，避免文字数量导致图标错位 */
#quotes-table-wrap .table th:nth-child(9),
#quotes-table-wrap .table td:nth-child(9) {
  width: 200px;
  min-width: 200px;
  max-width: 200px;
  box-sizing: border-box;
  vertical-align: middle;
}
#quotes-table-wrap .table td:nth-child(9) > span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  white-space: nowrap;
}
#quotes-table-wrap .table td:nth-child(9) > span > .badge {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}
#quotes-table-wrap .table td:nth-child(9) > span > button {
  flex-shrink: 0;
}
/* 发票列表：当前进度列内容左对齐，徽章与查看详细进度图标保持上下对齐 */
#invoice-sub-table-wrap .table td:nth-child(9),
#finance-invoice-table-wrap .table td:nth-child(9) {
  text-align: left;
  vertical-align: middle;
}
#invoice-sub-table-wrap .table td:nth-child(9) > span,
#finance-invoice-table-wrap .table td:nth-child(9) > span {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  white-space: nowrap;
}
#invoice-sub-table-wrap .table td:nth-child(9) > span > button,
#finance-invoice-table-wrap .table td:nth-child(9) > span > button {
  flex-shrink: 0;
}
/* 第10列：Actions 操作列，仅 3 个图标按钮，缩小预留宽度减少横向滚动 */
#quotes-table-wrap .table th:nth-child(10),
#quotes-table-wrap .table td:nth-child(10) {
  min-width: 110px;
  width: 1%;
  white-space: nowrap;
}
#quotes-table-wrap .table td:nth-child(10) .table-actions {
  flex-wrap: nowrap;
  white-space: nowrap;
  display: inline-flex;
  gap: 4px;
}
#quotes-table-wrap .table-actions {
  flex-wrap: nowrap;
  white-space: nowrap;
}

/* 报价单列表：允许横向滚动，避免 Actions 列被 overflow:hidden 裁剪（含删除按钮） */
#quotes-table-wrap {
  max-width: 100%;
  overflow: hidden;
}
#quotes-table-wrap .table-responsive {
  overflow-x: auto !important;
}
#quotes-table-wrap .table {
  min-width: min-content;
}

/* 6) 徽章图标继承颜色 */
.badge i, .badge svg, .badge svg *{
  color: currentColor !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

/* XERO31C icon-only actions in tables (hide action text) */

/* 1+4) 真正图标按钮：固定 32×32，flex 居中 */
table td .btn.btn-sm{
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  padding: 0 !important;
  gap: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}

/* 2) 隐藏按钮内的文字包装元素 */
table td .btn.btn-sm span,
table td .btn.btn-sm b,
table td .btn.btn-sm small,
table td .btn.btn-sm em,
table td .btn.btn-sm strong,
table td .btn.btn-sm .btn-text,
table td .btn.btn-sm .text{
  display: none !important;
}

/* 3) font-size:0 隐藏裸文本节点，再给图标恢复字号 */
table td .btn.btn-sm{
  font-size: 0 !important;
}
table td .btn.btn-sm i,
table td .btn.btn-sm .fa,
table td .btn.btn-sm .fas,
table td .btn.btn-sm .far,
table td .btn.btn-sm .fal,
table td .btn.btn-sm .fab,
table td .btn.btn-sm [class^="bi-"],
table td .btn.btn-sm [class*=" bi-"],
table td .btn.btn-sm svg{
  font-size: 14px !important;
  width: 14px !important;
  height: 14px !important;
}

/* XERO32B：accent 映射到皮肤，danger 保持红色 */
:root{
  --mono-950: #0b1220;
  --mono-900: #0f172a;
  --mono-800: #1f2937;
  --mono-700: #334155;
  --mono-600: #475569;
  --mono-500: #64748b;
  --mono-400: #94a3b8;
  --mono-300: #cbd5e1;
  --mono-200: #e2e8f0;
  --mono-100: #f1f5f9;
  --mono-050: #f8fafc;
  --accent: var(--skin-accent);
  --accent-600: var(--skin-accent-600);
  --accent-100: var(--skin-accent-soft);
  --accent-200: var(--skin-accent-border);
  --danger: #dc2626;
  --danger-700: #b91c1c;
  --danger-100: rgba(220,38,38,0.10);
  --danger-200: rgba(220,38,38,0.18);
  --primary: var(--skin-accent);
  --text: var(--mono-600);
  --muted: var(--mono-500);
  --border: var(--mono-300);
}

/* 1) base */
html, body{
  color: var(--mono-600) !important;
  background: var(--mono-050) !important;
}

/* 2) weight normalization */
body, p, td, th, input, select, textarea, label, small, .muted{
  font-weight: 400 !important;
}
.page-title h1,
.card-title{
  font-weight: 700 !important;
  color: var(--mono-900) !important;
}
.x-section-title{
  font-weight: 400 !important;
  color: var(--mono-900) !important;
}
.x-metric-value,
.x-totals-row.total{
  font-weight: 800 !important;
  color: var(--mono-900) !important;
}
.nav-link{
  font-weight: 600 !important;
  color: var(--mono-600) !important;
}

/* 3) links */
a{
  color: var(--mono-900) !important;
}
a:hover{
  color: var(--mono-800) !important;
}

/* 4) icons follow currentColor */
i, .fa, .fas, .far, .fab, svg{
  color: currentColor !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

/* 5) buttons */
.btn, button{
  border-radius: 10px !important;
  box-shadow: none !important;
  color: var(--mono-900) !important;
}
.btn-primary, .x-linkbtn{
  background: var(--skin-accent) !important;
  border: 1px solid var(--skin-accent) !important;
  color: #fff !important;
}
.btn-primary:hover, .x-linkbtn:hover{
  background: var(--skin-accent-600) !important;
  border-color: var(--skin-accent-600) !important;
}
.btn-outline, .btn-outline-secondary,
.btn-secondary, .btn-info, .btn-success, .btn-warning{
  background: #fff !important;
  border: 1px solid var(--mono-300) !important;
  color: var(--mono-900) !important;
}
.btn-outline:hover, .btn-outline-secondary:hover,
.btn-secondary:hover, .btn-info:hover, .btn-success:hover, .btn-warning:hover{
  background: var(--mono-100) !important;
  border-color: var(--mono-300) !important;
}
/* btn-outline-primary 单独随皮肤（不纳入上述灰按钮组） */
.btn-outline-primary{
  background: #fff !important;
  border: 1px solid var(--skin-accent) !important;
  color: var(--skin-accent) !important;
}
.btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active{
  background: var(--skin-accent) !important;
  border-color: var(--skin-accent-600) !important;
  color: #fff !important;
}
.btn-danger{
  background: #fff !important;
  border: 1px solid var(--danger) !important;
  color: var(--danger) !important;
}
.btn-danger:hover{
  background: var(--danger-100) !important;
  border-color: var(--danger-700) !important;
  color: var(--danger-700) !important;
}

/* 6) active nav: 随皮肤 */
.nav-link.active{
  color: var(--mono-900) !important;
}
.nav-link.active::after{
  background: var(--skin-accent) !important;
}

/* 7) badges: monochrome, primary 随皮肤 */
.badge{
  background: #fff !important;
  border: 1px solid var(--mono-300) !important;
  color: var(--mono-700) !important;
  font-weight: 600 !important;
}
.badge-primary{
  background: var(--skin-accent-soft) !important;
  border-color: var(--skin-accent-border) !important;
  color: var(--mono-900) !important;
}
.badge-danger{
  background: var(--danger-100) !important;
  border-color: var(--danger-200) !important;
  color: var(--danger-700) !important;
}
.badge-success, .badge-info, .badge-warning{
  background: #fff !important;
  border-color: var(--mono-300) !important;
  color: var(--mono-700) !important;
}
.badge-progress-accepted{
  background: rgba(22,163,74,0.15) !important;
  border-color: rgba(22,163,74,0.35) !important;
  color: #15803d !important;
}
.badge-progress-rejected{
  background: rgba(220,38,38,0.15) !important;
  border-color: rgba(220,38,38,0.35) !important;
  color: #b91c1c !important;
}
.badge-progress-partial{
  background: rgba(245,158,11,0.15) !important;
  border-color: rgba(245,158,11,0.4) !important;
  color: #b45309 !important;
}

/* 8) numbers */
.num, .col-total{
  color: var(--mono-900) !important;
}

/* 9) focus ring: 随皮肤 */
.btn:focus, button:focus,
input:focus, select:focus, textarea:focus{
  outline: none !important;
  box-shadow: 0 0 0 4px var(--skin-accent-soft) !important;
  border-color: var(--skin-accent-border) !important;
}

/* 10) table hover */
table tbody tr:hover td{
  background: var(--mono-050) !important;
}

/* XERO33 preview 3D paper effect (quote/invoice) */
:root{
  --paper-radius: 14px;
  --paper-border: rgba(15,23,42,0.12);
  --paper-shadow-1: 0 10px 26px rgba(15,23,42,0.08);
  --paper-shadow-2: 0 22px 60px rgba(15,23,42,0.10);
  --surface-shadow: 0 10px 34px rgba(15,23,42,0.06);
}

/* 外层承托面：居中白色卡片 */
.x-preview-surface{
  position: relative !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, #f7f9fc 0%, #f3f6fb 100%) !important;
  border: 1px solid rgba(15,23,42,0.08) !important;
  box-shadow: var(--surface-shadow) !important;
  padding: 18px !important;
  display: flex !important;
  justify-content: center !important;
}

/* 内层纸张（白色卡片）：固定最大宽度并居中 */
.x-preview-surface .x-paper{
  position: relative !important;
  border-radius: var(--paper-radius) !important;
  background: #fff !important;
  border: 1px solid var(--paper-border) !important;
  box-shadow: var(--paper-shadow-1), var(--paper-shadow-2) !important;
  overflow: hidden !important;
  width: 100% !important;
  max-width: 960px !important;
  flex-shrink: 0 !important;
}

/* 纸张顶部橙色高光 */
.x-preview-surface .x-paper::before{
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  height: 56px !important;
  background: linear-gradient(180deg, var(--skin-accent-soft) 0%, transparent 100%) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* 纸张底部内阴影 */
.x-preview-surface .x-paper::after{
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 22px !important;
  background: linear-gradient(180deg, rgba(15,23,42,0.00) 0%, rgba(15,23,42,0.06) 100%) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* 预览内容内边距 + 统一字体排版（居中由 .x-paper 负责） */
#invoice-preview, #quote-preview{
  padding: 18px 18px 22px 18px !important;
  position: relative !important;
  z-index: 1 !important;
  font-family: "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, "Noto Sans SC", sans-serif !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  color: #333 !important;
  display: block !important;
  width: 100% !important;
  max-width: 960px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* 统一表格样式 */
#invoice-preview table, #quote-preview table{
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 14px !important;
}

#invoice-preview table th, #quote-preview table th,
#invoice-preview table td, #quote-preview table td{
  padding: 10px 12px !important;
  border: 1px solid rgba(15,23,42,0.12) !important;
}
/* 服务明细：每行下方不显示分隔线（用户要求去除） */
#invoice-preview .invoice-table tbody td,
#quote-preview .invoice-table tbody td {
  border-top: none !important;
  border-bottom: none !important;
}
#invoice-preview .invoice-table tr.preview-group-header td,
#quote-preview .invoice-table tr.preview-group-header td {
  border-top: none !important;
  border-bottom: none !important;
}

#invoice-preview table thead th, #quote-preview table thead th{
  background: var(--skin-accent-soft) !important;
  font-weight: 600 !important;
}
/* 表头行左上、右上圆角（与 PDF 导出一致） */
#invoice-preview table thead th:first-child,
#quote-preview table thead th:first-child {
  border-radius: 10px 0 0 0 !important;
}
#invoice-preview table thead th:last-child,
#quote-preview table thead th:last-child {
  border-radius: 0 10px 0 0 !important;
}

/* 统一表格列对齐：Description 左，Quantity 中，Unit Price/GST/Amount 右 */
#invoice-preview .invoice-table th:nth-child(1), #quote-preview .invoice-table th:nth-child(1),
#invoice-preview .invoice-table td:nth-child(1), #quote-preview .invoice-table td:nth-child(1){ text-align: left !important; }
#invoice-preview .invoice-table th:nth-child(2), #quote-preview .invoice-table th:nth-child(2),
#invoice-preview .invoice-table td:nth-child(2), #quote-preview .invoice-table td:nth-child(2){ text-align: center !important; }
#invoice-preview .invoice-table th:nth-child(n+3), #quote-preview .invoice-table th:nth-child(n+3),
#invoice-preview .invoice-table td:nth-child(n+3), #quote-preview .invoice-table td:nth-child(n+3){ text-align: right !important; }

/* 发票预览：Original Quote Summary 与 Invoice Item 两表列宽完全一致、绝对对齐（以 Invoice Item 为准） */
#invoice-preview .invoice-preview-quote-and-totals .invoice-table,
#invoice-preview #preview-quote-conversion-summary .invoice-table {
  table-layout: fixed !important;
  width: 100% !important;
}
#invoice-preview .invoice-preview-quote-and-totals .invoice-table th:nth-child(1),
#invoice-preview .invoice-preview-quote-and-totals .invoice-table td:nth-child(1),
#invoice-preview #preview-quote-conversion-summary .invoice-table th:nth-child(1),
#invoice-preview #preview-quote-conversion-summary .invoice-table td:nth-child(1) { width: 46% !important; }
#invoice-preview .invoice-preview-quote-and-totals .invoice-table th:nth-child(2),
#invoice-preview .invoice-preview-quote-and-totals .invoice-table td:nth-child(2),
#invoice-preview #preview-quote-conversion-summary .invoice-table th:nth-child(2),
#invoice-preview #preview-quote-conversion-summary .invoice-table td:nth-child(2) { width: 12% !important; }
#invoice-preview .invoice-preview-quote-and-totals .invoice-table th:nth-child(3),
#invoice-preview .invoice-preview-quote-and-totals .invoice-table td:nth-child(3),
#invoice-preview #preview-quote-conversion-summary .invoice-table th:nth-child(3),
#invoice-preview #preview-quote-conversion-summary .invoice-table td:nth-child(3) { width: 12% !important; }
#invoice-preview .invoice-preview-quote-and-totals .invoice-table th:nth-child(4),
#invoice-preview .invoice-preview-quote-and-totals .invoice-table td:nth-child(4),
#invoice-preview #preview-quote-conversion-summary .invoice-table th:nth-child(4),
#invoice-preview #preview-quote-conversion-summary .invoice-table td:nth-child(4) { width: 12% !important; }
#invoice-preview .invoice-preview-quote-and-totals .invoice-table th:nth-child(5),
#invoice-preview .invoice-preview-quote-and-totals .invoice-table td:nth-child(5),
#invoice-preview #preview-quote-conversion-summary .invoice-table th:nth-child(5),
#invoice-preview #preview-quote-conversion-summary .invoice-table td:nth-child(5) { width: 18% !important; }

/* 报价预览：子项金额列缩进5空格，不靠最右 */
#quote-preview .invoice-table tr.preview-child-row td.preview-child-amount {
  padding-right: 8ch !important; /* 8个字符宽度，金额不贴边 */
}
/* 发票预览：子项金额列与报价一致，向左缩进相同宽度 */
#invoice-preview .invoice-table tr.preview-child-row td.preview-child-amount {
  padding-right: 8ch !important;
}

/* 发票预览：「调整内容」分隔行 */
#invoice-preview .invoice-table tr.preview-adjustment-label td {
  font-weight: 600 !important;
  background: rgba(15,23,42,0.06) !important;
  border-top: 1px dashed rgba(15,23,42,0.2) !important;
}

/* 统一 From/To/Details 标题 */
#invoice-preview h3, #quote-preview h3,
#invoice-preview h6, #quote-preview h6{
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #555 !important;
  margin-top: 0 !important;
  margin-bottom: 8px !important;
  text-transform: none !important;
}

/* 报价预览：恢复普通三列结构 */
#quote-preview .invoice-details h6 {
  white-space: nowrap !important;
  font-weight: 400 !important;
  color: var(--text-color, #333) !important;
}

/* To 区块（客户名、ABN、地址）取消粗体；标题 "To" 保留与 From 一致的粗体，由上方 h6 规则控制 */
#quote-preview .recipient-info,
#invoice-preview .recipient-info {
  font-weight: 400 !important;
}
/* To 区块（客户名、ABN、地址）取消粗体；标题 "To" 保留与 From 一致的粗体，由上方 h6 规则控制 */
#quote-preview .recipient-info,
#invoice-preview .recipient-info {
  font-weight: 400 !important;
}
#quote-preview .recipient-info .info-line,
#invoice-preview .recipient-info p,
#invoice-preview .recipient-info strong {
  font-weight: 400 !important;
}
/* 发票预览：From 下方公司名、Invoice Number/Date/Reference 标签取消加粗 */
#invoice-preview .sender-info p strong,
#invoice-preview .invoice-details p strong {
  font-weight: 400 !important;
}

/* 统一段落与信息区 */
#invoice-preview p, #quote-preview p{
  margin: 4px 0 !important;
  font-size: 14px !important;
}

/* 报价预览：信息块内「条与条」之间增加行距，同一条自动换行保持紧凑 */
#quote-preview .sender-info .info-lines,
#quote-preview .recipient-info .info-lines,
#quote-preview .invoice-details .info-lines {
  display: flex;
  flex-direction: column;
  gap: 0.65em;
}
#quote-preview .sender-info .info-line,
#quote-preview .recipient-info .info-line,
#quote-preview .invoice-details .info-line {
  line-height: 1.2 !important;
  margin: 0 !important;
  font-size: 14px !important;
}

/* 统一信息区与表头间距（缩小以使 Invoice Date 区块更靠上） */
.invoice-info-spacer{
  height: 8px !important;
}

/* 右列 Invoice Date 区块与 To 对齐：去掉顶部空隙，确保顶对齐 */
#invoice-preview .invoice-info, #quote-preview .invoice-info{
  align-items: start !important;
}
#invoice-preview .invoice-details, #quote-preview .invoice-details{
  align-self: start !important;
  padding-top: 0 !important;
  margin-top: 0 !important;
}
/* 报价预览：三列顶部齐平 */
#quote-preview .sender-info,
#quote-preview .recipient-info {
  padding-top: 0 !important;
  margin-top: 0 !important;
}
#invoice-preview .invoice-details p:first-child,
#quote-preview .invoice-details p:first-child{
  margin-top: 0 !important;
}
/* 发票预览：Invoice Number / Date / Reference 区块文字颜色（与下方 Description 列统一） */
#invoice-preview .invoice-details p {
  color: var(--text-color, #333) !important;
}

/* 统一预览内层容器 */
#invoice-preview .invoice-preview-inner,
#quote-preview .invoice-preview-inner{
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 统一合计区 */
#invoice-preview .invoice-summary, #quote-preview .invoice-summary{
  font-size: 14px !important;
}

/* 统一备注区 */
.invoice-notes{
  margin-top: 24px !important;
  padding: 12px 16px !important;
  background: rgba(15,23,42,0.03) !important;
  border-radius: 4px !important;
}

/* 分割线：克制灰色（报价两条分隔线用后面专用规则，此处排除） */
#invoice-preview hr,
#quote-preview hr:not(.quote-sep-above-table):not(.quote-sep-above-summary) {
  border: none !important;
  border-top: 1px solid rgba(15,23,42,0.10) !important;
}

/* 表格头部：淡皮肤色背景（只改背景不改文字色） */
#invoice-preview table thead th,
#quote-preview table thead th{
  background: var(--skin-accent-soft) !important;
  border-bottom: 1px solid rgba(15,23,42,0.10) !important;
}

/* 总金额行 */
#invoice-preview .total, #quote-preview .total{
  font-weight: 700 !important;
}

/* 打印：去掉立体效果 */
@media print{
  .x-preview-surface{
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
  }
  .x-preview-surface .x-paper{
    border: none !important;
    box-shadow: none !important;
  }
  .x-preview-surface .x-paper::before,
  .x-preview-surface .x-paper::after{
    display: none !important;
  }
  #invoice-preview, #quote-preview{
    padding: 0 !important;
  }
}

/* XERO34 preview depth refinement (on top of XERO33) */
:root{
  --paper-tilt: -0.25deg;
  --paper-lift: -1px;
  --edge-highlight: rgba(255,255,255,0.75);
  --edge-shadow: rgba(15,23,42,0.10);
}

/* 托盘：顶部高光 + 内边空气层 */
.x-preview-surface{
  background: linear-gradient(180deg, #f7f9fc 0%, #f2f5fb 100%) !important;
  box-shadow:
    0 10px 34px rgba(15,23,42,0.06),
    inset 0 1px 0 rgba(255,255,255,0.70),
    inset 0 0 0 1px rgba(15,23,42,0.06) !important;
}

/* 纸张：轻微上浮 + 微倾斜 */
.x-preview-surface .x-paper{
  transform: translateY(-4px) rotate(-0.25deg) !important;
  box-shadow:
    0 1px 0 rgba(15,23,42,0.05),
    0 6px 0 rgba(15,23,42,0.07),
    0 16px 22px rgba(15,23,42,0.20),
    0 38px 86px rgba(15,23,42,0.24),
    0 92px 240px rgba(15,23,42,0.20) !important;
  background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 100%) !important;
  outline: 1px solid rgba(15,23,42,0.10) !important;
  outline-offset: -1px !important;
}

/* 纸张伪元素细化 */
.x-preview-surface .x-paper::after{
  background: linear-gradient(180deg, rgba(15,23,42,0.00) 0%, rgba(15,23,42,0.07) 100%) !important;
}
.x-preview-surface .x-paper::before{
  background: linear-gradient(180deg, var(--skin-accent-soft) 0%, transparent 100%) !important;
}

/* 内容层级 */
#invoice-preview, #quote-preview{
  position: relative !important;
  z-index: 2 !important;
}

/* 预览内表头：淡皮肤色，随主题变化 */
#invoice-preview table thead th,
#quote-preview table thead th{
  background: var(--skin-accent-soft) !important;
}

/* 预览内文字加粗收敛 */
#invoice-preview b, #invoice-preview strong,
#quote-preview b, #quote-preview strong{
  font-weight: 600 !important;
}
#invoice-preview .total, #quote-preview .total{
  font-weight: 700 !important;
}

/* 打印：全部清零 */
@media print{
  .x-preview-surface{
    background: transparent !important;
    box-shadow: none !important;
  }
  .x-preview-surface .x-paper{
    transform: none !important;
    box-shadow: none !important;
    outline: none !important;
  }
}

/* 进度时间线：回复/编辑/删除按钮使用正常字重，覆盖全局 .btn 粗体（提高优先级：id+button+类） */
#progress-timeline button.btn-reply-feedback,
#progress-timeline button.timeline-remark-reply-btn,
#progress-timeline button.timeline-remark-edit-btn,
#progress-timeline button.timeline-remark-delete-btn,
#progress-timeline button.timeline-remark-edit-one-btn,
#progress-timeline button.timeline-remark-delete-one-btn,
#progress-timeline-invoice button.btn-reply-feedback,
#progress-timeline-invoice button.timeline-remark-reply-btn,
#progress-timeline-invoice button.timeline-remark-edit-btn,
#progress-timeline-invoice button.timeline-remark-delete-btn,
#progress-timeline-invoice button.timeline-remark-edit-one-btn,
#progress-timeline-invoice button.timeline-remark-delete-one-btn {
  font-weight: 400 !important;
}

/* 留言行：编辑/删除按钮默认隐藏，悬浮整行时显示 */
.timeline-remark-item .timeline-remark-edit-one-btn,
.timeline-remark-item .timeline-remark-delete-one-btn {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 0.15s ease !important;
}
.timeline-remark-item:hover .timeline-remark-edit-one-btn,
.timeline-remark-item:hover .timeline-remark-delete-one-btn {
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* XERO35 paper thickness + subtle content layering */
:root{
  --paper-edge-light: rgba(255,255,255,0.85);
  --paper-edge-dark: rgba(15,23,42,0.10);
  --paper-thickness: rgba(15,23,42,0.06);
  --paper-inner: rgba(15,23,42,0.035);
}

/* 纸张边缘高光与暗边 */
.x-preview-surface .x-paper::before{
  box-shadow: inset 0 1px 0 var(--paper-edge-light) !important;
}
.x-preview-surface .x-paper::after{
  box-shadow:
    inset 0 -1px 0 var(--paper-edge-dark),
    inset 0 -10px 18px rgba(15,23,42,0.05) !important;
}

/* 内容区轻微内阴影 */
#invoice-preview, #quote-preview{
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.55) !important;
}

/* 表头：淡皮肤色，随主题变化 */
#invoice-preview table thead th,
#quote-preview table thead th{
  background: var(--skin-accent-soft) !important;
  border-bottom: 1px solid rgba(15,23,42,0.10) !important;
}

/* 预览表格 tbody 行：统一斑马纹（由 style.css 控制），不再单独强调第一行 */
#invoice-preview .invoice-table tbody tr td,
#quote-preview .invoice-table tbody tr td {
  background: inherit !important;
  color: inherit !important;
}

/* 发票预览与报价预览：Description 列（第一列）文字颜色与背景颜色一致 */
#invoice-preview .invoice-preview-quote-and-totals .invoice-table tbody td:nth-child(1),
#quote-preview .invoice-table tbody td:nth-child(1) {
  color: var(--text-color, #333) !important;
  background: inherit !important;
}

/* 合计区浮层感 */
#invoice-preview .totals,
#invoice-preview .x-totals,
#quote-preview .totals,
#quote-preview .x-totals{
  background: rgba(15,23,42,0.02) !important;
  border: 1px solid rgba(15,23,42,0.08) !important;
  border-radius: 12px !important;
  padding: 10px 12px !important;
}

/* 数字质感 */
#invoice-preview .num, #quote-preview .num{
  font-variant-numeric: tabular-nums !important;
  font-feature-settings: "tnum" 1 !important;
}

/* 关键数字加重 */
#invoice-preview .x-metric-value,
#quote-preview .x-metric-value{
  font-weight: 800 !important;
}

/* 打印清零 */
@media print{
  #invoice-preview, #quote-preview{
    box-shadow: none !important;
  }
  #invoice-preview .totals, #invoice-preview .x-totals,
  #quote-preview .totals, #quote-preview .x-totals{
    background: transparent !important;
    border: none !important;
  }
  #invoice-preview table thead th,
  #quote-preview table thead th{
    background: transparent !important;
    border-bottom: 1px solid #000 !important;
  }
}

/* XERO36C4: kill paper surface inner shadow (keep only drop shadow under paper) */
.x-paper::after{
  box-shadow: none !important;
  background: transparent !important;
  opacity: 0 !important;
  content: none !important;
}
.x-paper::before{
  height: 36px !important;
  opacity: 0.07 !important;
}

/* XERO36C7 LOCK: keep paper depth final (C6) */
.x-preview-surface .x-paper.x-paper{
  box-shadow:
    0 1px 0 rgba(15,23,42,0.05),
    0 6px 0 rgba(15,23,42,0.07),
    0 16px 22px rgba(15,23,42,0.20),
    0 38px 86px rgba(15,23,42,0.24),
    0 92px 240px rgba(15,23,42,0.20) !important;
}

/* NO-BOLD GLOBAL OVERRIDE (SAFE TEXT ONLY)
   Toggle: remove class="no-bold" from <html> to restore bold globally
   * selector intentionally removed to avoid breaking icon fonts (FontAwesome etc.) */
html.no-bold,
html.no-bold body{
  font-weight: 400 !important;
}
html.no-bold p,
html.no-bold span,
html.no-bold div,
html.no-bold label,
html.no-bold small,
html.no-bold strong,
html.no-bold b,
html.no-bold h1,
html.no-bold h2,
html.no-bold h3,
html.no-bold h4,
html.no-bold h5,
html.no-bold h6{
  font-weight: 400 !important;
}
html.no-bold .fw-bold,
html.no-bold .font-bold,
html.no-bold .font-semibold,
html.no-bold .font-extrabold,
html.no-bold .font-black,
html.no-bold .bold{
  font-weight: 400 !important;
}
/* force-reset bootstrap/nav/button active bold */
html.no-bold .active,
html.no-bold .nav-link.active,
html.no-bold .nav-item .active,
html.no-bold .btn.active,
html.no-bold .btn-primary,
html.no-bold .btn-secondary,
html.no-bold .btn-info,
html.no-bold .btn-outline,
html.no-bold .btn-outline-primary,
html.no-bold .btn-outline-secondary,
html.no-bold .btn-outline-success,
html.no-bold .x-linkbtn,
html.no-bold .toolbar .btn,
html.no-bold .toolbar .btn-sm,
html.no-bold .pagination .page-link,
html.no-bold .page-link,
html.no-bold #pagination button,
html.no-bold th,
html.no-bold thead th{
  font-weight: 400 !important;
}
/* NO-BOLD NAV (ALL STATES) */
html.no-bold nav,
html.no-bold .navbar,
html.no-bold .navbar-nav,
html.no-bold .nav,
html.no-bold .nav-item,
html.no-bold .nav-link,
html.no-bold .nav a,
html.no-bold .navbar a,
html.no-bold a.nav-link,
html.no-bold button.nav-link,
html.no-bold .dropdown-item,
html.no-bold .menu a,
html.no-bold .menu-item a,
html.no-bold .topbar a,
html.no-bold .sl-topbar a,
html.no-bold .header a,
html.no-bold .x-select-btn,
html.no-bold .x-select-option,
html.no-bold .invoice-quote-select-trigger,
html.no-bold .invoice-quote-option{
  font-weight: 400 !important;
}
html.no-bold .brand-logo { font-weight: 800 !important; }

/* hide draft count badge — defeat Bootstrap .badge display:inline-block !important */
#drafts-count{
  display: none !important;
}

/* === UI-V1 BEGIN (global unify) === */

/* 1) Typography baseline */
html.ui-v1 body{
  font-size: 14px;
  line-height: 1.45;
}

/* 2) Spacing tokens */
html.ui-v1 .container,
html.ui-v1 .container-fluid{
  padding-left: 16px;
  padding-right: 16px;
}

/* 3) Buttons consistency */
html.ui-v1 .btn{
  border-radius: 10px;
  padding: 8px 12px;
  line-height: 1.2;
}
html.ui-v1 .btn-sm{
  border-radius: 10px;
  padding: 6px 10px;
}

/* 4) Inputs consistency */
html.ui-v1 .form-control,
html.ui-v1 .form-select,
html.ui-v1 textarea,
html.ui-v1 input[type="text"],
html.ui-v1 input[type="number"],
html.ui-v1 input[type="email"],
html.ui-v1 input[type="tel"]{
  border-radius: 10px;
  padding: 8px 10px;
  line-height: 1.25;
}

/* 5) Form spacing unify */
html.ui-v1 .form-label,
html.ui-v1 label{
  margin-bottom: 6px;
}
html.ui-v1 .form-group,
html.ui-v1 .mb-3{
  margin-bottom: 12px !important;
}
html.ui-v1 .row.g-3,
html.ui-v1 .row.gy-3{
  --bs-gutter-y: 12px;
}
html.ui-v1 .row.g-3,
html.ui-v1 .row.gx-3{
  --bs-gutter-x: 12px;
}
html.ui-v1 .input-group{
  margin-bottom: 12px;
}
html.ui-v1 .form-text,
html.ui-v1 .text-muted{
  margin-top: 6px;
}
html.ui-v1 .invalid-feedback,
html.ui-v1 .valid-feedback{
  margin-top: 6px;
}

/* 6) Tables consistency */
html.ui-v1 table{
  font-size: 13px;
}
html.ui-v1 .table > :not(caption) > * > *{
  padding: 10px 12px;
  vertical-align: middle;
}

/* 6) Cards/panels consistency */
html.ui-v1 .card,
html.ui-v1 .x-paper,
html.ui-v1 .panel,
html.ui-v1 .box{
  border-radius: 14px;
}

/* 7) List header + pagination unify */
html.ui-v1 .table thead th,
html.ui-v1 .table thead td{
  padding-top: 12px;
  padding-bottom: 12px;
  white-space: nowrap;
}
/* 客户详情页：客户项目/报价/发票表格表头下不显示横线，避免刺眼 */
#customer-detail-page .card .table thead th{
  border-bottom: none !important;
}
html.ui-v1 .table tbody td,
html.ui-v1 .table tbody th{
  line-height: 1.25;
}
html.ui-v1 .table-responsive{
  border-radius: 14px;
  overflow: hidden;
}
html.ui-v1 .table-toolbar,
html.ui-v1 .list-toolbar,
html.ui-v1 .toolbar,
html.ui-v1 .filters,
html.ui-v1 .actions-bar{
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
html.ui-v1 .pagination{
  gap: 6px;
  margin-top: 12px;
  margin-bottom: 0;
}
html.ui-v1 .page-link{
  border-radius: 10px;
  padding: 6px 10px;
  line-height: 1.2;
}
html.ui-v1 .page-item.active .page-link,
html.ui-v1 .page-link:focus{
  box-shadow: none;
  outline: none;
}

/* 8) Badge shape (do not reintroduce draft count) */
html.ui-v1 .badge{
  border-radius: 999px;
}

/* hard-disable draft count badge */
html.ui-v1 #drafts-count{ display: none !important; }

/* 8) Button size/combo variants */
html.ui-v1 .btn-lg{
  border-radius: 10px;
  padding: 10px 14px;
  line-height: 1.2;
}
html.ui-v1 .input-group .btn,
html.ui-v1 .dropdown-toggle.btn{
  border-radius: 10px;
}

/* === UI-V1 END (global unify) === */

/* ── i18n lang-switch (v1.1) ── DEPRECATED: replaced by native .lang-native-select, kept for legacy pages */
/* .lang-switch-wrapper { ... } .lang-switch { ... } removed in favor of .lang-native-wrap + .lang-native-select */

/* ── i18n native language select (topbar) ── */
.lang-native-wrap {
    flex: 0 0 auto;
    margin-right: 8px;
}
.lang-native-select {
    min-width: 120px;
    max-width: 150px;
    padding: 6px 10px;
    font-size: 13px;
    line-height: 1.4;
    border: 1px solid var(--border, #d0d5dd);
    border-radius: 6px;
    background: var(--surface, #fff);
    color: var(--text, #344054);
    cursor: pointer;
}
.lang-native-select:hover {
    border-color: var(--primary, #3b82f6);
}
.lang-native-select:focus {
    outline: none;
    border-color: var(--primary, #3b82f6);
    box-shadow: 0 0 0 2px var(--skin-accent-soft, rgba(59, 130, 246, 0.2));
}
/* ── i18n native language select END ── */

/* ── i18n pending/ready visibility guard ──────────────────────────────────
   While i18n.js hasn't run yet (html.i18n-pending), hide all translatable
   elements so users see nothing instead of empty shells or stale English.
   visibility:hidden preserves layout; no reflow when text appears.
   ─────────────────────────────────────────────────────────────────────── */
html.i18n-pending [data-i18n] {
    visibility: hidden;
}
html.i18n-ready [data-i18n] {
    visibility: visible;
}

/* ── brand-logo (SiteLedger)：随皮肤变色，加粗 ── */
.brand-logo {
    font-size: 22px;
    font-weight: 800 !important;
    letter-spacing: 0.5px;
    color: var(--skin-accent);
    text-decoration: none;
    white-space: nowrap;
}
.brand-logo:hover {
    text-decoration: none;
    opacity: 0.9;
    color: var(--skin-accent-600);
}
/* ── brand-logo END ── */

/* ── 皮肤主题 (Skin Themes) ─────────────────────────────────────────────────
   网站名称、主菜单激活高亮、报价发票预览橙字/横线、主按钮等均随皮肤变色
   5种风格：default 默认蓝 | teal 青绿 | lavender 薰衣草紫 | orange 暖橙 | forest 森林绿
   ─────────────────────────────────────────────────────────────────────── */
:root {
  --skin-accent:#2563eb;
  --skin-accent-600:#1d4ed8;
  --skin-accent-soft:rgba(37,99,235,0.12);
  --skin-accent-toast:rgba(37,99,235,0.22);
  --skin-toast-bg:#eff6ff;
  --skin-accent-border:rgba(37,99,235,0.25);
  --skin-accent-shadow:rgba(37,99,235,0.3);
  --skin-accent-strong:rgba(37,99,235,0.45);
  --primary-color: var(--skin-accent);
}
html.skin-teal {
  --skin-accent:#0d9488;
  --skin-accent-600:#0f766e;
  --skin-accent-soft:rgba(13,148,136,0.12);
  --skin-accent-toast:rgba(13,148,136,0.22);
  --skin-toast-bg:#f0fdfa;
  --skin-accent-border:rgba(13,148,136,0.25);
  --skin-accent-shadow:rgba(13,148,136,0.3);
  --skin-accent-strong:rgba(13,148,136,0.45);
}
html.skin-lavender {
  --skin-accent:#7c3aed;
  --skin-accent-600:#5b21b6;
  --skin-accent-soft:rgba(124,58,237,0.12);
  --skin-accent-toast:rgba(124,58,237,0.22);
  --skin-toast-bg:#f5f3ff;
  --skin-accent-border:rgba(124,58,237,0.25);
  --skin-accent-shadow:rgba(124,58,237,0.3);
  --skin-accent-strong:rgba(124,58,237,0.45);
}
html.skin-orange {
  --skin-accent:#ea580c;
  --skin-accent-600:#c2410c;
  --skin-accent-soft:rgba(234,88,12,0.12);
  --skin-accent-toast:rgba(234,88,12,0.22);
  --skin-toast-bg:#fff7ed;
  --skin-accent-border:rgba(234,88,12,0.25);
  --skin-accent-shadow:rgba(234,88,12,0.3);
  --skin-accent-strong:rgba(234,88,12,0.45);
}
html.skin-forest {
  --skin-accent:#15803d;
  --skin-accent-600:#166534;
  --skin-accent-soft:rgba(21,128,61,0.12);
  --skin-accent-toast:rgba(21,128,61,0.22);
  --skin-toast-bg:#f0fdf4;
  --skin-accent-border:rgba(21,128,61,0.25);
  --skin-accent-shadow:rgba(21,128,61,0.3);
  --skin-accent-strong:rgba(21,128,61,0.45);
}
/* 皮肤色块：使用 background-color 避免被 * { background-image: none } 影响 */
#skin-options .skin-swatch {
  background-image: none !important;
  min-width: 28px;
  min-height: 28px;
}
/* 皮肤选择色块高亮（固定色，避免受当前主题影响） */
.skin-card { padding: 4px 8px; border-radius: 8px; }
.skin-card.active, .skin-card:hover {
  background: #f1f5f9;
  outline: 2px solid #64748b;
  outline-offset: 2px;
}

/* ── 主菜单：随皮肤变色 ─────────────────────────────────────────────────────
   网站名称、主菜单激活高亮均纳入皮肤切换控制
   ─────────────────────────────────────────────────────────────────────── */
#topNav a,
#topNav .nav-link {
  color: #64748b !important;
}
#topNav a:hover,
#topNav .nav-link:hover {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}
#topNav a.active,
#topNav .nav-link.active {
  background: var(--skin-accent-soft) !important;
  border: 1px solid var(--skin-accent-border) !important;
  color: var(--skin-accent-600) !important;
}

/* 英文模式下主导航更紧凑，避免溢出 */
html[lang="en"] #topNav,
html[lang="en"] #topNavItems {
  gap: 4px !important;
}
html[lang="en"] #topNav a,
html[lang="en"] #topNav .nav-link {
  padding: 6px 10px !important;
  font-size: 13px !important;
}

/* ── 报价/发票预览中原本橙色的内容：随皮肤变色 ───────────────────────────────── */
.invoice-company-name, .invoice-logo-fallback { color: var(--skin-accent) !important; }
#quote-preview .invoice-company-name, #invoice-preview .invoice-company-name { font-weight: 700 !important; }

/* 预览：仅保留需要的分隔线，其余 hr 隐藏；报价两条分隔线用 class 排除，不隐藏 */
#invoice-preview hr,
#quote-preview hr:not(.quote-sep-above-table):not(.quote-sep-above-summary) {
  display: none !important; visibility: hidden !important; height: 0 !important;
  margin: 0 !important; padding: 0 !important; border: none !important; overflow: hidden !important;
}
#invoice-preview .invoice-header, #quote-preview .invoice-header { border-bottom: none !important; }
/* 报价/发票预览：logo 尺寸一致（与报价预览绝对相同） */
#quote-preview .invoice-logo-container, #invoice-preview .invoice-logo-container { min-width: 125px !important; }
#quote-preview .invoice-logo-img, #invoice-preview .invoice-logo-img { width: 100px !important; height: 100px !important; }
/* 报价预览：橙色分隔线放在 From/To 内容区域下方，不在 QUOTE 标题下 */
#quote-preview .quote-header-wrapper { border-bottom: none !important; }
#quote-preview .invoice-info + hr {
  display: block !important; visibility: visible !important;
  height: 0 !important; margin: 14px 0 !important; padding: 0 !important;
  border: none !important; border-top: 2px solid var(--skin-accent, var(--primary-color, #ff6b35)) !important;
}
#invoice-preview .invoice-info + hr {
  display: block !important; visibility: visible !important;
  height: 0 !important; margin: 14px 0 !important; padding: 0 !important;
  border: none !important; border-top: 2px solid var(--skin-accent, var(--primary-color, #ff6b35)) !important;
}
/* Quote Breakdown 下方分隔线：与上方 .invoice-info + hr 同款，仅当设置了本次付款比例或金额（显示 Invoice Item）时显示 */
#invoice-preview #preview-quote-conversion-summary > hr:first-child {
  display: block !important; visibility: visible !important;
  height: 0 !important; margin: 14px 0 !important; padding: 0 !important;
  border: none !important; border-top: 2px solid var(--skin-accent, var(--primary-color, #ff6b35)) !important;
}
/* Invoice Item 内 Subtotal / GST / Total Due 三行整块靠右显示（覆盖全局 summary-table 左对齐） */
#invoice-preview .invoice-item-totals-table {
  margin-left: auto !important;
}
/* Invoice Item 内三行行距与上方 Quote Breakdown 的 Subtotal/GST/Total Due 一致 */
#invoice-preview .invoice-item-totals-table td,
#invoice-preview .invoice-item-totals-table td:first-child,
#invoice-preview .invoice-item-totals-table td:last-child {
  padding: 3px 10px !important;
  line-height: 1.35 !important;
  text-align: right !important;
}
/* Invoice Item 内 Total Due 整行粗体（标签与金额） */
#invoice-preview .invoice-item-totals-table tr.total td {
  font-weight: 700 !important;
}
/* Invoice Item 内 Total Due 下方分隔线，与页面其他 hr 同款（须覆盖上方 #invoice-preview hr 的 display:none） */
#invoice-preview #preview-quote-conversion-summary hr.invoice-item-totals-separator {
  display: block !important;
  visibility: visible !important;
  height: 0 !important;
  margin: 14px 0 !important;
  padding: 0 !important;
  border: none !important;
  border-top: 2px solid var(--skin-accent, var(--primary-color, #ff6b35)) !important;
  overflow: visible !important;
}
/* Contract Summary (Item) 区块宽度为整行 50%，靠右显示；Amount 列右对齐 */
#invoice-preview .preview-contract-section {
  width: 50% !important;
  max-width: none !important;
  margin-left: auto !important;
  margin-right: 0 !important;
  background: #f8f9fa !important;
  border: 1px solid #dee2e6 !important;
  border-radius: 8px !important;
  padding: 15px !important;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
}
#invoice-preview .preview-contract-section .preview-summary-table,
#invoice-preview .preview-contract-section .invoice-table {
  width: 100% !important;
}
#invoice-preview .preview-contract-section th:last-child,
#invoice-preview .preview-contract-section td:last-child {
  text-align: right !important;
}
/* Item 窗口内子项行距缩小 */
#invoice-preview .preview-contract-section tr th,
#invoice-preview .preview-contract-section tr td {
  padding: 2px 8px !important;
  line-height: 1.25 !important;
}
/* 发票预览：Due Date 固定红色，不受主题覆盖 */
#invoice-preview .payment-info .invoice-due-date-line,
.payment-info .invoice-due-date-line {
  color: #c00 !important;
}
/* 发票预览：Item 窗口下方与 Due Date 之间的灰色分隔线去除 */
#invoice-preview .payment-info {
  border-top: none !important;
}
/* 主表格上方标题 Quote Breakdown：确保显示且醒目 */
#invoice-preview .preview-quote-breakdown-title {
  display: block !important;
  visibility: visible !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #333 !important;
  margin: 0 0 8px 0 !important;
}
/* 未设置本次付款金额或比例时：隐藏「Quote Breakdown」标题，与报价单一致（仅显示项目表+总价） */
#invoice-preview.invoice-preview-no-payment #invoice-preview-quote-breakdown-title {
  display: none !important;
  visibility: hidden !important;
}
/* 已填本次付款且为分期时：仅「Quote Breakdown」标题到「Total Due」这一块（历史数据）减淡，不影响页面其余文字 */
#invoice-preview.invoice-preview-partial-payment .invoice-preview-inner > .invoice-preview-quote-and-totals {
  color: #888 !important;
  opacity: 0.85;
}
#invoice-preview.invoice-preview-partial-payment .invoice-preview-inner > .invoice-preview-quote-and-totals .invoice-table,
#invoice-preview.invoice-preview-partial-payment .invoice-preview-inner > .invoice-preview-quote-and-totals .invoice-summary {
  color: inherit !important;
}
#invoice-preview.invoice-preview-partial-payment .invoice-preview-inner > .invoice-preview-quote-and-totals th,
#invoice-preview.invoice-preview-partial-payment .invoice-preview-inner > .invoice-preview-quote-and-totals td,
#invoice-preview.invoice-preview-partial-payment .invoice-preview-inner > .invoice-preview-quote-and-totals h6 {
  color: inherit !important;
  border-color: #bbb !important;
}
/* 同一区域内：表头整行灰色；数据行斑马纹（第1条无背景、第2条有背景、交替） */
#invoice-preview.invoice-preview-partial-payment .invoice-preview-inner > .invoice-preview-quote-and-totals .invoice-table thead tr th {
  background-color: #d0d0d0 !important;
}
#invoice-preview.invoice-preview-partial-payment .invoice-preview-inner > .invoice-preview-quote-and-totals .invoice-table tbody tr:nth-child(odd) td {
  background-color: transparent !important;
}
#invoice-preview.invoice-preview-partial-payment .invoice-preview-inner > .invoice-preview-quote-and-totals .invoice-table tbody tr:nth-child(even) td {
  background-color: #d0d0d0 !important;
}
/* 仅将「Quote Breakdown」标题恢复为正常颜色与字重，与下方 Invoice Item 一致，其余不改 */
#invoice-preview.invoice-preview-partial-payment .invoice-preview-inner > .invoice-preview-quote-and-totals #invoice-preview-quote-breakdown-title {
  color: #333 !important;
  opacity: 1 !important;
  font-weight: 700 !important;
  font-size: 14px !important;
}
/* 同一区域内 Total Due 上方的分隔线改为灰色 */
#invoice-preview.invoice-preview-partial-payment .invoice-preview-inner > .invoice-preview-quote-and-totals .invoice-summary .summary-table tr.total td {
  border-top: 2px solid #bbb !important;
}
#invoice-preview table thead th, #quote-preview table thead th { border-bottom: none !important; }
/* 发票预览（未设置本次付款金额或比例时）：表头行（Description / Quantity / Unit Price / GST / Amount AUD）所有文字为黑色；
   用 :not(.invoice-preview-partial-payment) 覆盖，只要不是“已设付款”状态则表头为黑，不依赖 invoice-preview-no-payment 是否被添加 */
#invoice-preview:not(.invoice-preview-partial-payment) .invoice-preview-inner > .invoice-preview-quote-and-totals .invoice-table thead tr th,
#invoice-preview:not(.invoice-preview-partial-payment) table thead th {
  color: #000 !important;
}
#invoice-preview.invoice-preview-no-payment .invoice-preview-inner > .invoice-preview-quote-and-totals .invoice-table thead tr th,
#invoice-preview.invoice-preview-no-payment table thead th {
  color: #000 !important;
}
/* 报价预览：恢复表头为淡淡皮肤色，并隐藏 Description 行下方边框线；表头文字与 Quote Date 一致 */
#quote-preview table thead th {
  background: var(--skin-accent-soft) !important;
  border-bottom: none !important;
  color: var(--text-color, #333) !important;
}
/* 报价预览：两条分隔线必须盖过全局 hr 隐藏规则，用高特异性 + 2px 深色线彻底可见 */
#quote-preview .invoice-preview-inner hr.quote-sep-above-table,
#quote-preview .invoice-preview-inner hr.quote-sep-above-summary {
  display: block !important;
  visibility: visible !important;
  height: 0 !important;
  margin: 14px 0 !important;
  padding: 0 !important;
  border: none !important;
  border-top: 2px solid #0f172a !important;
  overflow: visible !important;
}
/* Reference 与 Description 之间的分隔线：改为更深的皮肤色 */
#quote-preview .invoice-preview-inner hr.quote-sep-above-table {
  border-top-color: var(--skin-accent-600, var(--skin-accent)) !important;
}
/* 报价预览：隐藏 Subtotal 上方分隔线 */
#quote-preview .invoice-preview-inner hr.quote-sep-above-summary {
  display: none !important;
  visibility: hidden !important;
  border: none !important;
  margin: 0 !important;
}
/* 避免 table/thead 画出淡线，只保留上述 hr 作为分隔线 */
#quote-preview table.invoice-table {
  border-top: none !important;
}
#quote-preview .invoice-summary {
  border-top: none !important;
}
#invoice-preview table td, #invoice-preview table th,
#quote-preview table td, #quote-preview table th { border: none !important; }
/* 汇总表：仅 Total 行保留上边框，去除所有细微线条/阴影/轮廓 */
#invoice-preview .invoice-summary .summary-table,
#quote-preview .invoice-summary .summary-table {
  border: none !important; outline: none !important; box-shadow: none !important;
}
/* Subtotal 与 GST 行之间不显示分隔线（用户要求删除） */
#invoice-preview .invoice-summary .summary-table tr:nth-child(2) td,
#quote-preview .invoice-summary .summary-table tr:nth-child(2) td {
  border-top: none !important;
}
#invoice-preview .invoice-summary .summary-table tr:not(.total),
#invoice-preview .invoice-summary .summary-table tr:not(.total) td,
#invoice-preview .invoice-summary .summary-table tr:not(.total) th,
#quote-preview .invoice-summary .summary-table tr:not(.total),
#quote-preview .invoice-summary .summary-table tr:not(.total) td,
#quote-preview .invoice-summary .summary-table tr:not(.total) th {
  border: none !important; border-left: none !important; border-right: none !important;
  border-top: none !important; border-bottom: none !important;
  outline: none !important; box-shadow: none !important;
}
#invoice-preview .invoice-summary .summary-table tr.total td,
#quote-preview .invoice-summary .summary-table tr.total td {
  border: none !important; border-left: none !important; border-right: none !important;
  border-bottom: none !important;
  outline: none !important; box-shadow: none !important;
}
/* 报价预览：Total 行上边线用淡淡皮肤色，与 Description 上方分隔线一致 */
#quote-preview .invoice-summary .summary-table tr.total td {
  border-top: 2px solid var(--skin-accent-600, var(--skin-accent)) !important;
}
#invoice-preview .invoice-summary, #quote-preview .invoice-summary {
  border: none !important; border-top: none !important;
  background: transparent !important;
  outline: none !important; box-shadow: none !important;
}
#invoice-preview .invoice-summary .summary-table,
#quote-preview .invoice-summary .summary-table,
#invoice-preview .invoice-summary .summary-table td,
#invoice-preview .invoice-summary .summary-table th,
#quote-preview .invoice-summary .summary-table td,
#quote-preview .invoice-summary .summary-table th {
  background: transparent !important;
}
#invoice-preview .totals, #invoice-preview .x-totals,
#quote-preview .totals, #quote-preview .x-totals {
  background: transparent !important;
  border: none !important; outline: none !important; box-shadow: none !important;
}
#invoice-preview .summary-table .total, #quote-preview .summary-table .total {
  border-top: 2px solid rgba(15,23,42,0.95) !important;
}
#invoice-preview .summary-table td:last-child,
#quote-preview .summary-table td:last-child { text-align: right !important; }

/* 统计金额区：以发票为准，标签左对齐、金额右对齐；行距紧凑与 date 区块一致 */
#invoice-preview .summary-table,
#quote-preview .summary-table{
  width: 280px !important;
  table-layout: fixed !important;
}
#invoice-preview .invoice-summary .summary-table td,
#quote-preview .invoice-summary .summary-table td{
  padding: 3px 10px !important;
  line-height: 1.35 !important;
}
#invoice-preview .summary-table td:first-child,
#quote-preview .summary-table td:first-child{
  text-align: left !important;
  width: 50% !important;
}
#invoice-preview .summary-table td:last-child,
#quote-preview .summary-table td:last-child{
  text-align: right !important;
  width: 50% !important;
}
#invoice-preview .summary-table .total{
  font-weight: 600 !important;
  font-size: 14px !important;
  border-top: 2px solid color-mix(in srgb, var(--skin-accent) 80%, black) !important;
}
#quote-preview .summary-table .total{
  font-weight: 600 !important;
  font-size: 14px !important;
  border-top: 2px solid var(--skin-accent-600, var(--skin-accent)) !important;
}

/* ── login/register 页面：橙改随皮肤，按钮文字反白 ───────────────────────────── */
.btn-login {
  background: linear-gradient(135deg, var(--skin-accent) 0%, var(--skin-accent-600) 100%) !important;
  color: #fff !important;
  text-shadow: 0 1px 1px rgba(0,0,0,0.2);
}
.btn-login:hover {
  box-shadow: 0 4px 12px var(--skin-accent-shadow) !important;
}
.form-group input:focus {
  border-color: var(--skin-accent) !important;
  box-shadow: 0 0 0 3px var(--skin-accent-soft) !important;
}
/* 登录/注册切换链接：黑色字体，无背景 */
.auth-switch-link a { color: #333 !important; text-decoration: none; font-weight: 600; }
.auth-switch-link a:hover { text-decoration: underline; color: #333 !important; }
.auth-tab-btn.active {
  color: var(--skin-accent) !important;
  border-bottom-color: var(--skin-accent) !important;
}

/* ── 全站：--primary-color 映射到皮肤 ─────────────────────────────────────────── */
#companyBrandBar { background: var(--skin-accent) !important; }
#team-invite-code { color: var(--skin-accent) !important; border-color: var(--skin-accent-border) !important; }
.form-control:focus, .form-select:focus {
  border-color: var(--skin-accent) !important;
  box-shadow: 0 0 0 0.2rem var(--skin-accent-soft) !important;
}

/* ── Main 顶部 Language：已改为原生 select (.lang-native-wrap)，以下旧浮层样式停用 ── */
/* .topbar-right .lang-switch { ... } */
/* .topbar-right .lang-switch__menu { ... } */
/* .topbar-right .lang-switch__menu.is-open { ... } */
/* .topbar-right .lang-switch__item { ... } */
/* .topbar-right .lang-switch__item:hover { ... } */

/* ── 客户搜索下拉（项目/报价/发票）：定位与层级、宽度 ───────────────────────────────── */
#quote-customer-dropdown,
#project-customer-dropdown,
#invoice-customer-dropdown {
  z-index: 1060;
  min-width: 320px;
}
/* ── 客户搜索下拉：hover/active 随皮肤变色 ───────────────────────────────────── */
#project-customer-dropdown .dropdown-item:hover,
#quote-customer-dropdown .dropdown-item:hover,
#invoice-customer-dropdown .dropdown-item:hover {
  background: var(--skin-accent-soft) !important;
}
#project-customer-dropdown .dropdown-item:active,
#project-customer-dropdown .dropdown-item:focus,
#quote-customer-dropdown .dropdown-item:active,
#quote-customer-dropdown .dropdown-item:focus,
#invoice-customer-dropdown .dropdown-item:active,
#invoice-customer-dropdown .dropdown-item:focus {
  background: var(--skin-accent) !important;
  color: #fff !important;
}
#project-customer-dropdown .dropdown-item:active strong,
#project-customer-dropdown .dropdown-item:active .small,
#project-customer-dropdown .dropdown-item:focus strong,
#project-customer-dropdown .dropdown-item:focus .small,
#quote-customer-dropdown .dropdown-item:active strong,
#quote-customer-dropdown .dropdown-item:active div,
#quote-customer-dropdown .dropdown-item:focus strong,
#quote-customer-dropdown .dropdown-item:focus div,
#invoice-customer-dropdown .dropdown-item:active strong,
#invoice-customer-dropdown .dropdown-item:active div,
#invoice-customer-dropdown .dropdown-item:focus strong,
#invoice-customer-dropdown .dropdown-item:focus div {
  color: inherit !important;
}

/* ── 滚动条：随皮肤变色 ─────────────────────────────────────────────────────────── */
::-webkit-scrollbar-thumb {
  background: var(--skin-accent) !important;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--skin-accent-600) !important;
}

/* 客户列表：类型图标（公司/个人） */
.customer-type-icon {
  font-size: 12px;
  opacity: 0.75;
  margin-right: 0.35em;
  width: 1em;
  display: inline-block;
  text-align: center;
}

/* 系统管理-用户筛选：重置按钮与输入框等高，视觉居中 */
#sau-btn-reset {
  height: calc(1.5em + 0.5rem + 2px);
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* ── x-select: 皮肤感知自定义下拉框 ─────────────────────────────
   替代原生 <select>，使 option hover 高亮随皮肤主题变色
   整块区域可点击展开（不限于右侧箭头）
   ─────────────────────────────────────────────────────────────── */
.x-select-wrap {
  position: relative;
  display: block;
  width: 100%;
  cursor: pointer;
}
/* 原生 select 完全移出可视区，避免遮挡点击（保留 DOM 以保证表单提交） */
.x-select-wrap > select {
  position: absolute !important;
  left: -9999px !important;
  top: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

/* 报价页「项目」下拉：取消粗体、取消皮肤色，与其它文字一致黑白灰 */
.x-select-wrap:has(select#quote-reference) .x-select-btn {
  font-weight: 400 !important;
  background: #fff !important;
  color: var(--mono-900, #0f172a) !important;
  border-color: var(--border, #e2e8f0) !important;
}
/* 全站 x-select 触发按钮与下拉选项统一正常字重（含项目/报价/发票等「请选择…」） */
.x-select-btn,
.x-select-wrap .x-select-text {
  font-weight: 400 !important;
}
.x-select-wrap:has(select#quote-reference) .x-select-btn:hover,
.x-select-wrap:has(select#quote-reference) .x-select-btn.open,
.x-select-wrap:has(select#quote-reference) .x-select-btn:focus {
  border-color: var(--mono-400, #94a3b8) !important;
  box-shadow: 0 0 0 2px rgba(15,23,42,0.08) !important;
  background: #fff !important;
  color: var(--mono-900, #0f172a) !important;
}
.x-select-wrap:has(select#quote-reference) .x-select-chevron {
  color: var(--mono-500, #64748b) !important;
}

/* 可见触发按钮 */
.x-select-btn {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  text-align: left !important;
  background: var(--surface, #fff) !important;
  border: 1px solid var(--border, #e2e8f0) !important;
  border-radius: 10px !important;
  padding: 9px 10px !important;
  font-size: 14px !important;
  color: var(--text, #0f172a) !important;
  font-weight: 400 !important;
  box-shadow: none !important;
  cursor: pointer !important;
  line-height: 1.4 !important;
  transition: border-color .12s ease, box-shadow .12s ease;
}
.x-select-btn:hover {
  border-color: var(--skin-accent-border) !important;
  filter: none !important;
  background: var(--surface, #fff) !important;
}
.x-select-btn.open,
.x-select-btn:focus {
  border-color: var(--skin-accent-border) !important;
  box-shadow: 0 0 0 3px var(--skin-accent-soft) !important;
  outline: none !important;
}
.x-select-text {
  flex: 1 1 0;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  pointer-events: auto; /* 确保文字区可接收点击，不被父级或全局 none 覆盖 */
}
.x-select-chevron {
  font-size: 10px !important;
  color: var(--muted) !important;
  transition: transform .15s ease;
  flex-shrink: 0 !important;
  pointer-events: none;
}
.x-select-btn.open .x-select-chevron {
  transform: rotate(180deg);
}
/* 下拉列表面板 */
.x-select-list {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  z-index: 1200;
  background: var(--surface, #fff);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 10px;
  box-shadow: 0 4px 16px rgba(15,23,42,0.12);
  padding: 4px;
  max-height: 260px;
  overflow-y: auto;
}
/* 每个选项：hover/active/focus 一律随皮肤变色，覆盖 Bootstrap/浏览器默认蓝；占位/选项统一正常字重 */
.x-select-option {
  padding: 8px 10px;
  border-radius: 7px;
  cursor: pointer;
  font-size: 14px !important;
  color: var(--text, #0f172a) !important;
  font-weight: 400 !important;
  transition: background .1s ease, color .1s ease;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.x-select-option:hover,
.x-select-option:focus,
.x-select-option:focus-visible,
.x-select-option:active {
  background: var(--skin-accent) !important;
  color: #fff !important;
}
.x-select-option.x-selected {
  background: var(--skin-accent-soft) !important;
  color: var(--skin-accent-600) !important;
  font-weight: 400 !important;
}
.x-select-option.x-selected:hover,
.x-select-option.x-selected:focus,
.x-select-option.x-selected:focus-visible,
.x-select-option.x-selected:active {
  background: var(--skin-accent) !important;
  color: #fff !important;
  font-weight: 400 !important;
}
/* form-select-sm 对应的小尺寸变体 */
.x-select-wrap.x-sm .x-select-btn {
  padding: 5px 8px !important;
  font-size: 13px !important;
  border-radius: 8px !important;
}
.x-select-wrap.x-sm .x-select-list {
  border-radius: 8px !important;
}
.x-select-wrap.x-sm .x-select-option {
  padding: 6px 8px !important;
  font-size: 13px !important;
  border-radius: 6px !important;
}

/* ===== 内部汇总条：任何 hover 状态都保持白底，不透出父容器 hover 背景 ===== */
/* 容器本身始终白底 */
#quote-profit-summary.x-summary-bar-no-hover-bg {
  background-color: #fff !important;
  position: relative;
  z-index: 5;
}

/* 父区块 hover 时，汇总条仍保持白底 */
#quote-service-section:hover #quote-profit-summary.x-summary-bar-no-hover-bg {
  background-color: #fff !important;
}

/* 条内所有常见控件强制白底，避免透明导致紫色透出 */
#quote-profit-summary.x-summary-bar-no-hover-bg select,
#quote-profit-summary.x-summary-bar-no-hover-bg input,
#quote-profit-summary.x-summary-bar-no-hover-bg textarea,
#quote-profit-summary.x-summary-bar-no-hover-bg button,
#quote-profit-summary.x-summary-bar-no-hover-bg .form-select,
#quote-profit-summary.x-summary-bar-no-hover-bg .form-control,
#quote-profit-summary.x-summary-bar-no-hover-bg .x-select,
#quote-profit-summary.x-summary-bar-no-hover-bg .x-input {
  background-color: #fff !important;
  background-image: none !important;
}

/* 伪元素叠层清除 */
#quote-profit-summary.x-summary-bar-no-hover-bg::before,
#quote-profit-summary.x-summary-bar-no-hover-bg::after,
#quote-profit-summary.x-summary-bar-no-hover-bg:hover::before,
#quote-profit-summary.x-summary-bar-no-hover-bg:hover::after {
  background: transparent !important;
  box-shadow: none !important;
}

/* 阴影与边框保持干净 */
#quote-profit-summary.x-summary-bar-no-hover-bg,
#quote-profit-summary.x-summary-bar-no-hover-bg:hover,
#quote-service-section:hover #quote-profit-summary.x-summary-bar-no-hover-bg {
  box-shadow: none !important;
  outline: none !important;
}
/* ===== END ===== */

/* ===== INTERNAL PROFIT SUMMARY: FORCE SINGLE LINE (v1) ===== */
#quote-profit-summary,
#quote-profit-summary .x-internal-summary,
#quote-profit-summary .x-internal-summary * {
  white-space: nowrap !important;
  word-break: keep-all !important;
}

/* Make the summary container a single-row flex that never wraps */
#quote-profit-summary,
#quote-profit-summary .x-internal-summary {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 10px !important;
  overflow-x: auto !important;
  overflow-y: visible !important;  /* visible 使 margin-policy 下拉可展开，不被裁剪 */
}

/* Hint must NOT take a full row */
#quote-profit-summary .x-internal-summary-hint {
  flex: 0 0 auto !important;
  flex-basis: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Stats line must stay inline */
#quote-profit-summary .x-internal-summary-stats,
#quote-profit-summary .x-internal-summary-values,
#quote-profit-summary .x-internal-summary-totals {
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 10px !important;
}

/* 下拉：合适宽度 + 内容居中 */
#quote-profit-summary #margin-policy,
#quote-profit-summary .margin-policy,
#quote-profit-summary select {
  flex: 0 0 auto !important;
  width: fit-content !important;
  min-width: 90px !important;
  max-width: 120px !important;
  text-align: center !important;
}

/* z-index 确保 margin-policy 下拉不被其它元素压住 */
#quote-profit-summary .x-select-wrap {
  position: relative !important;
  z-index: 50 !important;
}
#quote-profit-summary .x-select-list {
  z-index: 9999 !important;
}

/* ===== 报价表单内联错误提示 ===== */
.quote-form-error-box {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  margin-bottom: 4px;
  padding: 11px 14px;
  border-radius: 8px;
  background: #fff5f5;
  border: 1.5px solid #f5c6cb;
  color: #b71c1c;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.45;
  animation: quote-error-in 0.2s ease;
}
.quote-form-error-box i {
  font-size: 16px;
  flex-shrink: 0;
  color: #e53935;
}
@keyframes quote-error-in {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ===== 服务项目子项样式（灰色线条层级，无彩色背景） ===== */

/* 父项：与子项折线对齐的缩进 */
.svc-group-desc-cell {
  position: relative !important;
  padding-left: 32px !important;
}
/* 描述 + 后方小+号：flex 布局，小+在描述输入框右侧 */
.svc-desc-with-add {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  width: 100%;
  max-width: 100%;
}
.svc-desc-with-add .form-control {
  flex: 1;
  min-width: 0;
}
.x-btn-add-child-inline {
  flex-shrink: 0;
  padding: 2px 6px !important;
  font-size: 12px !important;
  color: #6b7280 !important;
  min-width: auto !important;
  line-height: 1;
}
.x-btn-add-child-inline:hover {
  color: #374151 !important;
}
.svc-group-toggle-handle {
  display: none !important; /* 一级项目不显示线条，仅保留二级项目连接线 */
}
/* 父项折叠时隐藏内部行（子项由 JS 控制 display） */
.x-item-parent.svc-group-collapsed .service-item-internal {
  display: none !important;
}

/* 子项行：左侧折线连接 + 缩进（二级项目层级） */
.x-item-child > tr > td:first-child {
  padding-left: 40px !important;
  position: relative;
}
/* 竖线：每行从顶部画到行中，多行时竖线自然衔接成一条 */
.x-item-child > tr > td:first-child::before {
  content: '';
  position: absolute;
  left: 10px;
  top: 0;
  height: 50%;
  width: 1px;
  background: #9ca3af;
  box-sizing: border-box;
}
/* 横线：从竖线到文字前的折线 */
.x-item-child > tr > td:first-child::after {
  content: '';
  position: absolute;
  left: 10px;
  top: 50%;
  width: 18px;
  height: 0;
  border-bottom: 1px solid #9ca3af;
  box-sizing: border-box;
}

/* 子项行背景：无彩色 */
.x-item-child > tr {
  background: transparent !important;
}
.x-item-child > tr:hover {
  background: #f9fafb !important;
}

/* 子项输入框稍小 */
.x-child-input.form-control {
  font-size: 13px;
}


/* 添加子项按钮行：靠左显示 */
.x-add-child-cell {
  padding: 2px 4px 6px 4px !important;
  border: none !important;
  background: transparent !important;
  text-align: left !important;
}

/* 添加子项按钮：灰色，无彩色，必须显示文字（排除 table td 的 icon-only 规则） */
.x-btn-add-child {
  color: #6b7280;
  border: 1px dashed #d1d5db;
  background: transparent;
  font-size: 12px !important;
  padding: 3px 12px !important;
  border-radius: 6px;
  white-space: nowrap;
  display: inline-flex !important;
  align-items: center;
  gap: 4px;
  transition: background 0.15s, border-color 0.15s;
  width: auto !important;
  min-width: auto !important;
  height: auto !important;
}
.x-btn-add-child:hover {
  background: #f3f4f6;
  border-color: #9ca3af;
  color: #4b5563;
}

/* 报价页面：取消「金额」表头粗体 */
#quote-service-items thead th.col-total {
  font-weight: 400 !important;
}

/* 报价页面：所有数字框与 10% (GST) 同字体、同字号（14px） */
#quote-service-items input.item-quantity,
#quote-service-items input.item-unit-price,
#quote-service-items input.item-amount,
#quote-service-items input.item-gst {
  font-size: 14px !important;
  font-family: inherit !important;
}
#quote-service-section .x-totals-row .value.num.money,
#quote-service-section .x-totals-row.total .value.num.money {
  font-size: 14px !important;
  font-family: inherit !important;
}

/* 报价页：表头字段与下方数据框居中对齐 */
#quote-service-items thead th {
  text-align: center !important;
}
#quote-service-items thead th.col-desc {
  text-align: left !important;
}
#quote-service-items tbody td {
  text-align: center !important;
}
#quote-service-items tbody td.col-desc {
  text-align: left !important;
}
#quote-service-items tbody td.col-desc .form-control {
  text-align: left !important;
}
#quote-service-items tbody td.col-actions .svc-item-actions {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 4px;
}

/* 父项 subtotal 模式：金额列醒目显示（灰色，无彩色）；「小计：」在框外左侧 */
.x-subtotal-cell {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}
.x-subtotal-cell .x-subtotal-label {
  flex-shrink: 0;
  font-weight: 600;
  color: var(--text);
}
.x-subtotal-cell input.item-amount {
  font-weight: 600;
  color: var(--text) !important;
  background: #f3f4f6 !important;
  border-color: #d1d5db !important;
  font-size: 14px;
}

/* 父项锁定时 qty/unit 禁用样式 */
.x-item-has-children input.item-quantity,
.x-item-has-children input.item-unit-price {
  background: #f8f8fa !important;
  color: #aaa !important;
  cursor: not-allowed;
}

/* add-child-wrapper 行无上边框 */
.x-add-child-wrapper > tr > td {
  border-top: none !important;
}
/* 添加子项按钮靠左显示，与描述列对齐 */
#quote-service-items .x-add-child-wrapper > tr > td {
  text-align: left !important;
}

/* 取消一级项目分隔线，改用相邻项目交替灰色背景区分（仅灰色，不关联皮肤色） */
#quote-service-items .x-item-parent ~ .x-item-parent > tr:first-child td {
  border-top: none !important;
}
#quote-service-items .x-item-parent-odd > tr td,
#quote-service-items .x-add-child-wrapper.x-bg-odd > tr td,
#quote-service-items .x-item-child.x-bg-odd > tr td {
  background: #fff !important;
}
#quote-service-items .x-item-parent-even > tr td,
#quote-service-items .x-add-child-wrapper.x-bg-even > tr td,
#quote-service-items .x-item-child.x-bg-even > tr td {
  background: #f3f4f6 !important;
}
#quote-service-items .x-item-parent-even > tr:hover td,
#quote-service-items .x-add-child-wrapper.x-bg-even > tr:hover td,
#quote-service-items .x-item-child.x-bg-even > tr:hover td {
  background: #e5e7eb !important;
}
#quote-service-items .x-item-parent-odd > tr:hover td,
#quote-service-items .x-add-child-wrapper.x-bg-odd > tr:hover td,
#quote-service-items .x-item-child.x-bg-odd > tr:hover td {
  background: #f9fafb !important;
}

/* ===== 发票服务项目（与报价页同结构：输入框尺寸、文字、对齐） ===== */
/* 发票表头与报价页一致：描述左对齐，其余居中 */
#invoice-service-items thead th {
  text-align: center !important;
}
#invoice-service-items thead th.col-desc {
  text-align: left !important;
}
#invoice-service-items thead th.col-total {
  font-weight: 400 !important;
}
#invoice-service-items tbody td {
  text-align: center !important;
}
#invoice-service-items tbody td.col-desc {
  text-align: left !important;
}
#invoice-service-items tbody td.col-desc .form-control {
  text-align: left !important;
}
#invoice-service-items thead th.col-desc,
#invoice-service-items tbody td.col-desc {
  padding-left: 10px !important; /* 发票无折叠把手，不需 28px 缩进 */
}
/* 发票子项行：与报价页一致，描述列右缩进 40px，不遮挡左侧折线 */
#invoice-service-items .x-item-child > tr > td:first-child {
  padding-left: 40px !important;
}
/* 发票费用汇总与报价页同结构：x-cost-summary-title + x-totals */
#invoice-service-section .x-cost-summary-title,
#invoice-service-section .x-cost-summary-title + .row {
  padding-left: 10px !important;
}
#invoice-service-items tbody td.col-actions .svc-item-actions {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 4px;
}

/* ===== END ===== */

/* === TYPOGRAPHY UNIFY: 同级文字字号统一
   层级：22px 品牌/页面标题 | 16px 区块标题 | 14px 正文/按钮/输入/表格 | 12px 标签/表头/辅助
   === */
html:not(.no-bold) .navbar .nav-link,
html:not(.no-bold) .topbar .nav-link,
html:not(.no-bold) .sl-topbar .nav-link,
html:not(.no-bold) #topNav .nav-link{
  font-size: 14px !important;
}
.form-control, .form-select, input:not([type="hidden"]), select, textarea{
  font-size: 14px !important;
}
.form-text, .text-muted, small, .x-help, .help-text{
  font-size: 12px !important;
}

/* === LOCK: quote profit summary must always be white, never transparent === */
#quote-profit-summary,
#quote-profit-summary.x-internal-summary-inline,
#quote-profit-summary.x-bg-solid,
#quote-service-section:hover #quote-profit-summary,
#quote-service-section:hover #quote-profit-summary.x-internal-summary-inline,
.x-section-collapsible:hover #quote-profit-summary,
.x-section-collapsible:hover #quote-profit-summary.x-internal-summary-inline {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  box-shadow: none !important;
  position: relative !important;
  z-index: 9999 !important;
}

/* 子控件也锁白底，避免控件自身透明 */
#quote-profit-summary select,
#quote-profit-summary input,
#quote-profit-summary textarea,
#quote-profit-summary button,
#quote-profit-summary .form-select,
#quote-profit-summary .form-control {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
}

/* 如果紫色来自父级伪元素覆盖 */
#quote-service-section { position: relative; }
#quote-service-section::before,
#quote-service-section::after {
  z-index: 1 !important;
}
#quote-profit-summary::before,
#quote-profit-summary::after {
  background: transparent !important;
  box-shadow: none !important;
}

/* 任何"透明通用规则"排除 x-bg-solid */
.x-internal-summary-inline:not(.x-bg-solid) {
  background: transparent;
}
/* === LOCK END === */

/* 个人信息管理：邮箱、密码显示框宽度限制 */
#profile-email-display {
  max-width: 240px;
}
#profile-password-display {
  max-width: 120px;
}

/* 项目列表表头：可点击 A-Z 排序 */
.th-sortable {
  cursor: pointer;
  user-select: none;
}
.th-sortable:hover .sort-icon {
  opacity: 1;
}
.sort-icon {
  opacity: 0.7;
}
.sort-icon.sort-asc,
.sort-icon.sort-desc {
  opacity: 1;
}

/* 账龄报告：90+ 列表头突出（最危险） */
#aging-report-table th.report-aging-col-90 {
  color: var(--bs-danger, #dc3545);
  font-weight: 600;
}

/* Dashboard 应收账款：KPI 无背景，仅左侧色条，与数据概览一致 */
.dashboard-ar-kpi {
  min-height: 72px;
  max-height: 86px;
  background: transparent !important;
  border: none !important;
  border-left: 3px solid var(--border, #e5e7eb);
  border-radius: 0;
}
.dashboard-aging-chart-wrap {
  height: 260px;
  min-height: 220px;
}
/* 收入 vs 成本趋势图：整行展示时略增高度，减少局促感 */
.dashboard-trend-chart-wrap {
  height: 280px !important;
  min-height: 200px !important;
}
.dashboard-row-middle-cell.dashboard-row-middle-trend .dashboard-trend-chart-wrap {
  height: 300px !important;
  min-height: 240px !important;
}
/* 项目状态图：略压缩高度，减少右侧列空白 */
.dashboard-project-chart-wrap {
  height: 140px;
  min-height: 120px;
}
/* 项目状态摘要：4 组数据 2×2 两行两列 */
.dashboard-project-status-rows-flex {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
  width: 100%;
}
.dashboard-project-status-rows-flex .dashboard-project-status-group {
  min-width: 0;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dashboard-ar-kpi-row .dashboard-kpi-clickable {
  cursor: pointer;
}
.dashboard-ar-kpi-row .dashboard-kpi-clickable:hover .dashboard-ar-kpi {
  background: transparent !important;
}
/* 近期到期：标题强制单行（中/英），三列左右排开以容纳英文 "Due in 1-7 days" 等 */
.dashboard-ar-kpi-row .dashboard-due-soon-label {
  white-space: nowrap;
}
.dashboard-ar-kpi-row .dashboard-due-soon-col {
  min-width: 8.5rem;
}
@media (min-width: 768px) {
  .dashboard-ar-kpi-row.dashboard-due-soon-row .dashboard-due-soon-col {
    flex: 0 1 auto;
    max-width: none;
    min-width: 9.5rem;
  }
}

/* 仪表盘中间层：收入 vs 成本整行独占（full-width-row），不再使用 2fr 1fr */
.dashboard-row-middle {
  display: block !important;
  width: 100%;
  max-width: 100%;
  margin-bottom: 24px;
  box-sizing: border-box;
}
.dashboard-row-middle > * {
  min-width: 0;
  width: 100%;
  max-width: none;
}
/* 收入 vs 成本：整行独占 */
.dashboard-row-middle-cell.dashboard-row-middle-trend {
  display: flex !important;
  align-items: stretch !important;
}
.dashboard-row-middle-cell.dashboard-row-middle-trend .card {
  width: 100% !important;
  min-height: 0 !important;
}
.dashboard-row-middle-cell.dashboard-row-middle-empty {
  display: none !important;
}

/* 图表区域留白压缩：标题→图表、图表→卡片底 更紧凑（全局保持原值，仅仪表盘趋势图更紧凑） */
.chart-container {
  padding-top: 8px;
  padding-bottom: 10px;
}
#dashboard-page .dashboard-row-middle .card:has(.dashboard-trend-chart-wrap) .chart-container {
  padding-top: 6px !important;
  padding-bottom: 8px !important;
}
#dashboard-page .dashboard-row-middle .card:has(.dashboard-trend-chart-wrap) .card-header {
  padding-top: 0.375rem !important;
  padding-bottom: 0.375rem !important;
}
#dashboard-page .dashboard-row-middle .card:has(.dashboard-trend-chart-wrap) .card-body {
  padding-top: 6px !important;
  padding-bottom: 8px !important;
}
#dashboard-page .dashboard-row-middle .card:has(.dashboard-aging-chart-wrap) .card-body {
  padding-top: 8px !important;
  padding-bottom: 10px !important;
}
#dashboard-page .dashboard-row-middle .card:has(.dashboard-aging-chart-wrap) .border-top.pt-2 {
  padding-top: 0.25rem !important;
}
/* 应收分析卡内：账龄图与下方 5 张卡片间距收紧，减少空白 */
#dashboard-page #dashboard-receivables-analysis-module #dashboard-aging-summary {
  margin-top: 0.5rem !important;
  padding-top: 0.5rem !important;
}

/* 应收分析（合并）：左块为概览 KPI（未开票/应收款/逾期金额），右块为账龄 KPI+图表；与应收概览共用部分样式 */
#dashboard-receivables-analysis-module.dashboard-receivables-analysis-card .card-body {
  padding-top: 0.5rem;
  padding-bottom: 0;
}
#dashboard-receivables-analysis-module .dashboard-receivables-section {
  padding-bottom: 0;
}
/* 应收分析合并卡内左侧概览块：保持紧凑高度 */
#dashboard-receivables-analysis-module #dashboard-profit-module {
  height: auto;
}
/* 应收概览：紧凑摘要卡片（独立使用时的样式）；合并版（应收与报价概览）为同一 class，高度由内容决定 */
#dashboard-profit-module.dashboard-receivables-card {
  height: auto;
}
#dashboard-profit-module.dashboard-receivables-card .card-header {
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
}
#dashboard-profit-module.dashboard-receivables-card:not(.dashboard-receivables-quote-merged) .card-body {
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
}
/* 合并卡：应收与报价概览，两段式布局，左列拉高以对齐右列 */
.dashboard-receivables-quote-merged .card-body {
  padding-top: 0.5rem;
  padding-bottom: 0.75rem;
}
.dashboard-receivables-quote-merged .dashboard-receivables-section {
  padding-bottom: 0.75rem;
}
#dashboard-quote-conversion-skeleton.dashboard-qc-section {
  border-top: none;
  padding-top: 0;
  margin-top: 0;
}
/* 应收概览：一个模块内三项指标（未开票 → 应收账款 → 逾期金额），一行一块，不拆成 3 个小盒子 */
.dashboard-receivables-block {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 0;
}
.dashboard-receivables-cell {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0.35rem 0.5rem;
  border-right: 1px solid var(--border, #e5e7eb);
  transition: background 0.15s ease;
  min-height: 2rem;
}
.dashboard-receivables-cell:last-child {
  border-right: none;
}
.dashboard-receivables-cell.dashboard-kpi-clickable {
  cursor: pointer;
  border-radius: 4px;
}
.dashboard-receivables-cell.dashboard-kpi-clickable:hover {
  background: var(--surface-2, #f1f5f9);
}
.dashboard-receivables-label {
  font-size: 0.8125rem;
  margin-bottom: 0.15rem;
}
.dashboard-receivables-value {
  font-weight: 600;
  font-size: 1rem;
}
