:root {
  --blue: #2f80ed;
  --blue-dark: #2170dc;
  --rail: #2d80ea;
  --line: #e6edf5;
  --line-dark: #d6e1ed;
  --bg: #f4f7fb;
  --panel: #ffffff;
  --text: #263238;
  --muted: #7d8a99;
  --green: #12823f;
  --red: #e33d3d;
  --orange: #f59a23;
  --cyan: #00a8c8;

  /* ===== 字体大小规范（全站统一） ===== */
  --fs-2xs:  10px;   /* 极小辅助文字 */
  --fs-xs:   11px;   /* 标签、徽章、时间戳 */
  --fs-sm:   12px;   /* 次要文字：元数据、表格副文本 */
  --fs-base: 13px;   /* 正文默认 */
  --fs-md:   14px;   /* 小标题、卡片标题 */
  --fs-lg:   16px;   /* 区块标题、弹窗标题 */
  --fs-xl:   18px;   /* 页面标题 */
  --fs-2xl:  20px;   /* 大数字 */
  --fs-3xl:  24px;   /* 仪表盘统计大数字 */
  --fs-4xl:  28px;   /* 超大统计数字 */
  --fs-stat: 32px;   /* 仪表盘特大数字 */
  --fs-display: 48px; /* 超大展示数字 */

  /* ===== 字重规范 ===== */
  --fw-normal: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
}

/* ===== 全局字重归零：覆盖浏览器默认加粗元素 ===== */
h1, h2, h3, h4, h5, h6,
strong, b,
th,
dt,
legend,
optgroup,
summary { font-weight: 400; }


/* v115: bilingual customer layout, scroll safety and team page */
.customer-form-pair {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
}
.customer-form-pair > label { min-width: 0; }
.customer-form-pair input { width: 100%; min-width: 0; }
.status-section.collapsed .status-list { display: none !important; }
.status-filter-link .side-dot {
  width: 9px;
  height: 9px;
  flex: 0 0 9px;
  border-radius: 50%;
  background: var(--status-color);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--status-color) 16%, transparent);
}
.ai-product-shell #customersPage,
.ai-product-shell #customersPage .table-shell,
.ai-product-shell .workspace { min-width: 0; }
.ai-product-shell #customersPage .table-shell {
  overflow: auto !important;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  -webkit-overflow-scrolling: touch;
}
.team-page { padding: 24px; overflow: auto; }
.team-page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.team-page-head h1 { margin: 2px 0 6px; font-size: var(--fs-4xl); }
.team-page-head p { margin: 0; color: #64748b; }
.team-eyebrow { color: #0967ff !important; font-size: var(--fs-sm); font-weight: 400; letter-spacing: .08em; text-transform: uppercase; }
.team-card { border: 1px solid #e6edf7; border-radius: 14px; background: #fff; padding: 16px; }
.team-table-shell { width: 100%; overflow: auto; }
.team-table { width: 100%; min-width: 560px; }
.team-note { margin: 12px 2px 0; color: #64748b; font-size: var(--fs-sm); }
.gp-lang-toggle {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0;
  padding: 2px;
  border: 1px solid #d8e0ee;
  border-radius: 8px;
  background: #fff;
  isolation: isolate;
}
.gp-lang-toggle button {
  position: relative;
  z-index: 1;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #475569;
  padding: 5px 10px;
  font-size: var(--fs-sm);
  font-weight: 400;
  cursor: pointer;
  transition: color .18s;
}
.gp-lang-toggle button.active {
  color: #fff;
  background: transparent;  /* pill handles bg */
}
/* Sliding pill pseudo-element */
.gp-lang-toggle::after {
  content: "";
  position: absolute;
  z-index: 0;
  top: 2px;
  left: 2px;
  width: 32px;
  height: calc(100% - 4px);
  border-radius: 6px;
  background: #0967ff;
  transition: transform .18s ease, width .18s ease;
  transform: translateX(0);
}
.gp-lang-toggle.lang-zh-active::after {
  width: 44px;
  transform: translateX(32px);
}
@media (prefers-reduced-motion: reduce) {
  .gp-lang-toggle::after,
  .gp-lang-toggle button { transition: none; }
}
/* In blue topbar: transparent bg, white borders */
.topbar .gp-lang-toggle {
  border-color: rgba(255,255,255,.3);
  background: transparent;
}
.topbar .gp-lang-toggle button {
  color: rgba(255,255,255,.75);
}
.topbar .gp-lang-toggle button.active {
  color: #0967ff;
}
.topbar .gp-lang-toggle::after {
  background: #fff;
}

/* ── Sidebar collapse toggle (white bg) ── */
.rail-collapse-btn {
  position: absolute; top: 4px; right: 4px;
  width: 22px; height: 22px;
  border: 0; border-radius: 4px;
  background: transparent; color: var(--muted);
  font-size: var(--fs-xs); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  z-index: 10;
}
.rail-collapse-btn:hover { background: #eef2ff; color: #1a237e; }
.icon-rail { position: relative; }
@media (prefers-reduced-motion: reduce) { .app { transition: none; } }
@media (max-width: 768px) {
  .customer-form-pair { grid-template-columns: minmax(0, 1fr) !important; gap: 8px; }
  .ai-product-shell .workspace { width: 100%; overflow-x: hidden; }
  .ai-product-shell #customersPage { width: 100%; overflow: hidden; }
  .ai-product-shell #customersPage .tabs,
  .ai-product-shell #customersPage .list-toolbar,
  .ai-product-shell #customersPage .filter-row { overflow-x: auto !important; flex-wrap: nowrap !important; }
  .ai-product-shell .list-sidebar { overflow-y: auto !important; }
  .team-page { padding: 14px; }
  .team-page-head { align-items: center; }
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  overflow: hidden;
  background: var(--bg);
  color: var(--text);
  font-family: "Segoe UI", "Microsoft YaHei", Arial, sans-serif;
  font-size: var(--fs-base);
}

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

button {
  cursor: pointer;
}

.app {
  height: 100vh;
  display: grid;
  grid-template-columns: var(--rail-width, 210px) 188px minmax(0, 1fr);
  transition: grid-template-columns .18s;
}
.app.rail-collapsed { --rail-width: 54px; }
@media (prefers-reduced-motion: reduce) { .app { transition: none; } }

.icon-rail {
  height: 100vh;
  display: flex;
  flex-direction: column;
  color: var(--text);
  background: #fff;
  border-right: 1px solid var(--line-dark);
  overflow: hidden;
}

.user-head {
  height: 90px;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 3px;
  border-bottom: 1px solid var(--line);
}

/* ── Batch 1: Single-line brand (white bg) ── */
.gp-brand {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 8px; min-height: 68px;
  border-bottom: 1px solid var(--line);
  cursor: pointer; color: var(--text);
}
.gp-brand-text { display: flex; align-items: baseline; gap: 3px; white-space: nowrap; overflow: hidden; }
.gp-brand-gp { color: #0d47a1; font-weight: 400; font-size: var(--fs-xs); letter-spacing: .5px; }
.gp-brand-text strong { font-size: var(--fs-base); font-weight: 400; color: #1a237e; }
.gp-brand-pro { font-size: var(--fs-2xs); font-weight: 400; color: #1565c0; letter-spacing: .5px; }

/* Sidebar collapsed state (white bg) */
.icon-rail.collapsed .gp-brand-text { display: none; }
.icon-rail.collapsed .gp-brand { justify-content: center; padding: 10px 4px; min-height: 56px; }
.icon-rail.collapsed .rail-item b { display: none; }
.icon-rail.collapsed .rail-item { height: 42px; }
.icon-rail.collapsed .nav-separator { margin: 4px 8px; }
.icon-rail.collapsed .market-btn { font-size: 0; }
.icon-rail.collapsed .market-btn::after { content: "\2699"; font-size: var(--fs-sm); }

.avatar {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 36%, #fff 0 7px, transparent 8px),
    radial-gradient(circle at 50% 85%, #fff 0 14px, transparent 15px),
    #b9dcff;
}

.gp-logo {
  width: 44px;
  height: 44px;
}
.gp-logo svg {
  display: block;
}

.user-head strong {
  font-size: var(--fs-sm);
  line-height: 1;
}

.user-head span {
  font-size: var(--fs-xs);
  opacity: .9;
}

.rail-nav {
  display: grid;
}

.rail-item {
  position: relative;
  height: 50px;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 2px;
  border: 0;
  color: var(--muted);
  background: transparent;
  cursor: pointer;
}

.rail-item span {
  width: 22px; height: 22px;
  display: grid; place-items: center;
  font-size: var(--fs-sm); font-weight: 400;
}
.rail-item b { font-size: var(--fs-xs); font-weight: 400; }
.rail-item:hover { color: #1a237e; background: #eef2ff; }
.rail-item.active { color: #fff; background: #0967ff; }
.rail-item.active span, .rail-item.active b { color: #fff; }

.market-btn {
  margin-top: auto; min-height: 42px;
  border: 0; color: var(--muted);
  background: #f4f7fb; font-size: var(--fs-sm); cursor: pointer;
}
.market-btn:hover { background: #eef2ff; color: #1a237e; }

/* ── Nav separator (white bg) ── */
.nav-separator { height: 1px; margin: 6px 14px; background: var(--line-dark); }
.rail-boss-only { display: none !important; }
.icon-rail.is-boss .rail-boss-only { display: grid !important; }
.icon-rail.is-boss .market-btn.rail-boss-only { display: block !important; }
.icon-rail.is-boss .nav-separator { display: block; }
.icon-rail:not(.is-boss) .nav-separator { display: none; }

.list-sidebar {
  height: 100vh;
  overflow-y: auto;
  border-right: 1px solid var(--line-dark);
  background: #fbfcfe;
}

.side-search {
  display: block;
  padding: 14px 12px 8px;
}

.side-search input {
  width: 100%;
  height: 28px;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 0 12px;
  background: #fff;
  outline: none;
}

.side-section {
  padding: 4px 8px;
}

.side-title {
  padding: 8px 8px;
  color: #7e8b9a;
  font-size: var(--fs-sm);
}

.status-toggle {
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
}

.status-toggle span {
  display: inline-block;
  width: 14px;
}

.status-section.collapsed .status-list {
  display: none;
}

.side-link {
  position: relative;
  width: 100%;
  min-height: 34px;
  border: 0;
  border-radius: 4px;
  padding: 0 8px;
  color: #4d5c6c;
  background: transparent;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.side-link:hover,
.side-link.active,
.side-link.hot {
  color: #2e70c8;
  background: #eaf3ff;
}

.side-link em {
  display: inline-flex;
  min-width: 20px;
  height: 18px;
  justify-content: center;
  align-items: center;
  border-radius: 9px;
  color: #fff;
  background: #ff6060;
  font-style: normal;
  font-size: var(--fs-xs);
}

.workspace {
  min-width: 0;
  height: 100vh;
  display: grid;
  grid-template-rows: 48px minmax(0, 1fr);
}

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 0 18px;
  color: #fff;
  background: var(--blue);
}

.top-search {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
}

.top-search input {
  width: min(480px, 48vw);
  max-width: 100%;
  height: 32px;
  border: 0;
  border-radius: 6px;
  padding: 0 14px;
  background: #fff;
  outline: none;
  font-size: var(--fs-base);
}

.top-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.top-actions button {
  height: 32px;
  min-width: 28px;
  border: 0;
  border-radius: 4px;
  color: #fff;
  background: transparent;
  font-weight: 400;
  font-size: var(--fs-md);
}

/* ── FR|ZH blue slider ── */
.gp-lang-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0;
  padding: 2px;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 8px;
  background: transparent;
}
.gp-lang-toggle button {
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: rgba(255,255,255,.75);
  padding: 4px 8px;
  font-size: var(--fs-sm);
  font-weight: 400;
  cursor: pointer;
  transition: background .18s, color .18s;
}
.gp-lang-toggle button.active {
  background: #fff;
  color: #0967ff;
}
.gp-lang-toggle button:not(.active):hover {
  background: rgba(255,255,255,.15);
  color: #fff;
}

.page {
  min-height: 0;
  display: none;
  grid-template-rows: auto auto minmax(0, 1fr) 40px;
}

#contractsPage.active {
  grid-template-rows: auto auto auto minmax(0, 1fr);
}

.page.active {
  display: grid;
}

/* Page-specific layout rules must never make an inactive page visible. */
.page:not(.active) {
  display: none !important;
}

#dashboardPage.active {
  display: block;
  overflow: auto;
}

#documentsPage.active {
  overflow-y: auto;
}

#productsPage.active,
#contractsPage.active,
#studentsPage.active {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  height: 100%;
}

#customerOverviewPage.active {
  display: grid;
  grid-template-rows: auto auto auto minmax(0, 1fr);
  height: 100%;
  min-height: 0;
  overflow: hidden;
}

#customersPage.active {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}

.tabs {
  height: 45px;
  display: flex;
  align-items: end;
  gap: 2px;
  border-bottom: 2px solid #37c7d7;
  padding: 0 12px;
  background: #fff;
}

.tab {
  height: 34px;
  border: 0;
  border-radius: 0;
  padding: 0 12px;
  color: #4e5e70;
  background: transparent;
}

.tab.active {
  color: #fff;
  background: var(--blue);
}

.danger-tab {
  color: #d9534f;
}

.list-toolbar {
  height: 43px;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0 12px;
  border-bottom: 1px solid var(--line);
  background: #f7f8fb;
}

.list-toolbar button {
  height: 28px;
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 0 9px;
  color: #4c5a6a;
  background: #fff;
}

.list-toolbar button:hover {
  color: #1c71cf;
  border-color: #b9daf9;
}

.list-toolbar .ai-btn {
  color: #be92c9;
  background: #fff8ff;
}

.toolbar-spacer,
.pager-fill {
  flex: 1;
}

.toolbar-select {
  height: 28px;
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 0 6px;
  color: #4c5a6a;
  background: #fff;
  font-size: var(--fs-sm);
  cursor: pointer;
}
.toolbar-select:focus {
  border-color: #b9daf9;
  outline: none;
}

.toolbar-dropdown-wrapper {
  position: relative;
}
.export-dropdown-btn {
  height: 28px;
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 0 9px;
  color: #4c5a6a;
  background: #fff;
  font-size: var(--fs-sm);
  cursor: pointer;
}
.export-dropdown-btn:hover {
  color: #1c71cf;
  border-color: #b9daf9;
}
.dropdown-menu {
  display: none;
  position: absolute;
  top: 30px;
  left: 0;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 4px;
  box-shadow: 0 4px 12px rgba(0,0,0,.12);
  z-index: 5000;
  min-width: 150px;
}
.dropdown-menu.open {
  display: block;
}
.dropdown-menu button {
  display: block;
  width: 100%;
  height: 32px;
  border: none;
  border-radius: 0;
  background: none;
  padding: 0 12px;
  text-align: left;
  font-size: var(--fs-sm);
  color: #2f3b46;
  cursor: pointer;
  white-space: nowrap;
}
.dropdown-menu button:hover {
  background: #eef5ff;
  color: #1c71cf;
}
.dropdown-menu.show {
  display: block;
}

/* Customer export menu: make export scope and counts unambiguous. */
#exportDropdownMenu.dm-export-menu {
  width: min(320px, calc(100vw - 16px));
  min-width: min(320px, calc(100vw - 16px));
  padding: 6px;
  border-radius: 10px;
  border-color: #d7e4f3;
  box-shadow: 0 12px 30px rgba(30, 64, 120, .18);
  overflow: hidden;
}
#exportDropdownMenu.dm-export-menu button {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  width: 100%;
  height: auto;
  min-height: 56px;
  padding: 8px 9px;
  border-radius: 7px;
  color: #24364b;
  white-space: normal;
}
#exportDropdownMenu.dm-export-menu button + button {
  margin-top: 3px;
}
#exportDropdownMenu.dm-export-menu button:hover:not(:disabled) {
  background: #eef5ff;
  color: #155fd1;
}
#exportDropdownMenu.dm-export-menu button:disabled {
  cursor: not-allowed;
  background: #f8fafc;
  color: #98a5b5;
  opacity: 1;
}
.dm-export-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  color: #1265df;
  background: #eaf2ff;
  font-size: var(--fs-md);
  font-weight: 400;
}
button:disabled .dm-export-icon {
  color: #97a5b6;
  background: #edf1f5;
}
.dm-export-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 3px;
  line-height: 1.25;
}
.dm-export-copy .dm-label {
  overflow: hidden;
  color: inherit;
  font-size: var(--fs-sm);
  font-style: normal;
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dm-export-copy .dm-description {
  overflow: hidden;
  color: #7a8899;
  font-size: var(--fs-2xs);
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dm-export-count {
  min-width: 48px;
  padding: 3px 7px;
  border-radius: 999px;
  color: #155fd1;
  background: #eaf2ff;
  font-size: var(--fs-2xs);
  font-style: normal;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
}
button:disabled .dm-export-count {
  color: #7c8998;
  background: #e9eef4;
}
.dropdown-sep {
  height: 1px;
  background: var(--line);
  margin: 3px 0;
}

/* Toolbar dropdown button (generic, matches export-dropdown-btn) — centered */
.toolbar-dropdown-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 28px;
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 0 9px;
  color: #4c5a6a;
  background: #fff;
  font-size: var(--fs-sm);
  cursor: pointer;
  white-space: nowrap;
  line-height: 1;
}
.toolbar-dropdown-btn:hover {
  color: #1c71cf;
  border-color: #b9daf9;
}
/* Issue 5 — One-click export all button */
.toolbar-btn-export-all {
  height: 28px;
  border: 1px solid #2563eb;
  border-radius: 3px;
  padding: 0 12px;
  color: #fff;
  background: #2563eb;
  font-size: var(--fs-sm);
  font-weight: 400;
  cursor: pointer;
  white-space: nowrap;
  transition: background .12s;
}
.toolbar-btn-export-all:hover {
  background: #1d4ed8;
}

/* Standalone toolbar button (for Import, Template, History) */
.toolbar-btn {
  height: 28px;
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 0 9px;
  color: #4c5a6a;
  background: #fff;
  font-size: var(--fs-sm);
  cursor: pointer;
  white-space: nowrap;
}
.toolbar-btn:hover {
  color: #1c71cf;
  border-color: #b9daf9;
}

/* ── Policy action menu dropdown ── */
.policy-menu-dropdown {
  background: var(--card-bg, #fff);
  border: 1px solid #d4dce6;
  border-radius: 8px;
  padding: 6px;
  min-width: 200px;
  max-width: 280px;
  box-shadow: 0 6px 28px rgba(0,0,0,.16), 0 2px 8px rgba(0,0,0,.08);
  overflow: hidden;
}
.policy-menu-item {
  display: block;
  width: 100%;
  padding: 8px 12px;
  margin: 1px 0;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: var(--fs-base);
  text-align: left;
  background: transparent;
  color: #334155;
  transition: background .08s;
}
.policy-menu-item:hover {
  background: #f1f5f9;
}
.policy-menu-item-danger {
  color: #dc2626;
  font-weight: 400;
}
.policy-menu-item-danger:hover {
  background: #fef2f2;
}

/* ── Batch B: Selection toolbar ── */
.selection-count {
  font-size: var(--fs-sm);
  color: #1c71cf;
  font-weight: 400;
  white-space: nowrap;
}
#toolbarSelection button {
  font-size: var(--fs-sm);
  height: 28px;
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 0 8px;
  background: #fff;
  color: #4c5a6a;
  cursor: pointer;
  white-space: nowrap;
}
#toolbarSelection button:hover {
  border-color: #b9daf9;
  color: #1c71cf;
}
#clearSelectionBtn {
  color: #888 !important;
}
#clearSelectionBtn:hover {
  color: #ff0a50 !important;
  border-color: #ff0a50 !important;
}

/* Destructive actions (delete) — red */
.destructive-action,
button.destructive-action,
.destructive-btn {
  color: #ff0a50 !important;
}
.destructive-action:hover,
button.destructive-action:hover,
.destructive-btn:hover {
  background: #fff0f3 !important;
  border-color: #ff0a50 !important;
}

/* ── Batch B: Import result summary ── */
.import-result {
  padding: 16px;
  border-top: 1px solid var(--line);
}
.import-result-summary {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.result-stat {
  text-align: center;
  padding: 12px 20px;
  border-radius: 6px;
  background: #f5f7fa;
  min-width: 80px;
}
.result-stat b {
  display: block;
  font-size: var(--fs-xs);
  color: #888;
  margin-bottom: 4px;
  text-transform: uppercase;
}
.result-stat span {
  font-size: var(--fs-3xl);
  font-weight: 400;
}
.result-added span { color: #14b86a; }
.result-updated span { color: #0967ff; }
.result-skipped span { color: #f59a23; }
.result-failed span { color: #ff0a50; }
.import-result-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  align-items: center;
}
.import-result-actions button {
  font-size: var(--fs-sm);
  padding: 6px 14px;
  border-radius: 4px;
  cursor: pointer;
}

/* ── Batch B: Import preview badges ── */
.row-badge-dup { background: #fff3cd; color: #856404; padding: 1px 6px; border-radius: 3px; font-size: var(--fs-xs); }
.row-badge-err { background: #ffe0e0; color: #c00; padding: 1px 6px; border-radius: 3px; font-size: var(--fs-xs); }
.row-dup { background: #fffbe6; }
.row-missing { background: #fff0f0; }
.row-error { background: #ffe8e8; }

/* ── Batch B: Batch delete dialog ── */
.batch-delete-body { padding: 8px 0; }
.batch-delete-body p { margin-bottom: 8px; }
.batch-delete-note { font-size: var(--fs-sm); color: #888; font-style: italic; }
.batch-delete-names { padding: 8px; background: #fff5f5; border-radius: 4px; border: 1px solid #ffcccc; margin-top: 8px; }

/* DM boss-only items */
.dm-boss-only { }
body:not(.is-boss) .dm-boss-only { display: none !important; }

/* ══════════════════════════════════════════════════════════════════
   PHASE 3 TOOLBAR — single compact row
   ══════════════════════════════════════════════════════════════════ */
.phase3-toolbar {
  height: auto !important;
  min-height: 36px;
  padding: 4px 10px !important;
  gap: 4px !important;
  background: #f7f8fb;
  border-bottom: 1px solid var(--line);
  flex-shrink: 0;
}
.phase3-toolbar-row {
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: nowrap;
  width: 100%;
}
.phase3-toolbar-btn {
  height: 28px !important;
  border: 1px solid var(--line) !important;
  border-radius: 3px !important;
  padding: 0 8px !important;
  color: #4c5a6a !important;
  background: #fff !important;
  font-size: var(--fs-sm) !important;
  cursor: pointer !important;
  white-space: nowrap;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
.phase3-toolbar-btn:hover {
  color: #1c71cf !important;
  border-color: #b9daf9 !important;
}
.phase3-toolbar-sel {
  height: 28px !important;
  border: 1px solid var(--line) !important;
  border-radius: 3px !important;
  padding: 0 6px !important;
  color: #4c5a6a !important;
  background: #fff !important;
  font-size: var(--fs-sm) !important;
  cursor: pointer !important;
  white-space: nowrap;
  flex-shrink: 0;
  max-width: 140px;
}
.phase3-toolbar-sel:focus {
  border-color: #b9daf9 !important;
  outline: none;
}
#customerToolbar .toolbar-search-input {
  height: 28px;
  font-size: var(--fs-sm);
  min-width: 140px;
  max-width: 240px;
  flex-shrink: 1;
}
/* Narrow screen: wrap toolbar */
@media (max-width: 900px) {
  .phase3-toolbar-row {
    flex-wrap: wrap;
    gap: 3px;
  }
  .phase3-toolbar-btn,
  .phase3-toolbar-sel {
    font-size: var(--fs-xs) !important;
    padding: 0 5px !important;
    height: 26px !important;
  }
  #customerToolbar .toolbar-search-input {
    height: 26px;
    font-size: var(--fs-xs);
    min-width: 100px;
  }
}

/* 销售合同 — 文件生成 / 模版管理 */
.gen-doc-btn {
  background: none !important;
  border: 1px solid transparent !important;
  font-size: var(--fs-md) !important;
  padding: 2px 4px !important;
  line-height: 1 !important;
}
.gen-doc-btn:hover {
  background: #eef5ff !important;
  border-color: #b9daf9 !important;
}
.gen-doc-quick-menu {
  display: block !important;
}
.template-mgr-body {
  padding: 0 16px;
  min-height: 200px;
}
.template-mgr-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
  margin-bottom: 8px;
}
.template-list {
  max-height: 350px;
  overflow-y: auto;
}
.template-item:hover {
  background: #f8fafc;
}
.batch-policy-list label:hover {
  background: #eef5ff;
}

#batchOpsBtn {
  display: none;
  background: #fff7e6;
  border-color: #ffc069;
  color: #d46b08;
  font-weight: 400;
}
#batchOpsBtn:hover {
  background: #ffe7ba;
  border-color: #ffa940;
}

#todayFollowBtn.active {
  background: #fff0e6;
  border-color: #ff6b35;
  color: #e05010;
  font-weight: 400;
}

.follow-badge {
  display: inline-block;
  background: #ff6b35;
  color: #fff;
  font-size: var(--fs-xs);
  padding: 1px 7px;
  border-radius: 10px;
  margin-left: 4px;
  vertical-align: middle;
  line-height: 1.4;
}

#todayFollowBtn.active .follow-badge {
  background: #e05010;
}

.table-shell {
  min-height: 0;
  overflow: auto;
  background: #fff;
  flex: 1;
}
/* (Issue 8.C) Empty placeholder cells — visible "Non renseigné" */
.empty-placeholder {
  color: #94a3b8 !important;
  font-style: italic;
  font-size: var(--fs-xs);
}
/* Phase 3: Compact pagination against table — footer stays visible, table fills viewport */
#customersPage {
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding-bottom: 0;
}
#customersPage .table-shell {
  flex: 1;
  min-height: 200px;
  overflow: auto;
  background: #fff;
}
#customersPage .pager {
  flex-shrink: 0;
  margin: 0;
  border-top: 1px solid var(--line);
}

.data-table {
  min-width: 100%;
  width: auto;
  border-collapse: collapse;
  color: #2f3b46;
}

.data-table th,
.data-table td {
  height: 40px;
  border-bottom: 1px solid #edf1f5;
  border-right: 1px solid #edf1f5;
  padding: 7px 10px;
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
}

.data-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  height: 34px;
  color: #6c7784;
  background: #f9fbfd;
  font-size: var(--fs-sm);
  font-weight: 400;
}

/* 表格列冻结：复选框 + 客户名称 + 客户状态在横向滚动时固定 */
/* Static fallback; JS applyStickyColumns in display-settings-fix.js sets precise inline left/z-index */
.data-table th[data-col="_select"],
.data-table td[data-col="_select"] {
  position: sticky;
  left: 0;
  z-index: 5;
  min-width: 42px;
  width: 42px;
}
.data-table th[data-col="_select"] { background: #f5f7fa; }
.data-table td[data-col="_select"] { background: #fff; }

/* Req 6: name column sticky at left:42px, width 240px */
.data-table th[data-col="name"],
.data-table td[data-col="name"] {
  position: sticky;
  left: 42px;
  z-index: 4;
  width: 240px;
  min-width: 240px;
}
.data-table th[data-col="name"] { background: #f5f7fa; }
.data-table td[data-col="name"] { background: #fff; }

/* Req 6: status column sticky at left:282px (42+240), width 130px */
.data-table th[data-col="status"],
.data-table td[data-col="status"] {
  position: sticky;
  left: 282px;
  z-index: 4;
  width: 130px;
  min-width: 130px;
}
.data-table th[data-col="status"] { background: #f5f7fa; }
.data-table td[data-col="status"] { background: #fff; }
/* Ensure sticky columns remain opaque on row hover — data-col, not nth-child (Issue 4.3) */
.data-table tbody tr:hover td[data-col="_select"],
.data-table tbody tr:hover td[data-col="name"],
.data-table tbody tr:hover td[data-col="status"] {
  background: #f0f5fb;
}
.data-table tbody tr.selected td[data-col="_select"],
.data-table tbody tr.selected td[data-col="name"],
.data-table tbody tr.selected td[data-col="status"] {
  background: #e8f0fe;
}

.data-table tbody tr:hover {
  background: #f8fcff;
}

.data-table tbody tr.selected {
  background: #eef7ff;
}

.compact-columns .data-table th:nth-child(10),
.compact-columns .data-table th:nth-child(11),
.compact-columns .data-table td:nth-child(10),
.compact-columns .data-table td:nth-child(11) {
  display: none;
}

.data-table a,
.client-link {
  border: 0;
  color: #1398b8;
  background: transparent;
  font-weight: 400;
}

/* 可编辑单元格提示 */
[data-editable] {
  cursor: cell;
}
[data-editable]:hover {
  background: #eef5ff !important;
  outline: 1px dashed #0967ff;
  outline-offset: -1px;
}

.plus-box {
  display: inline-grid;
  place-items: center;
  width: 15px;
  height: 15px;
  margin-right: 4px;
  border-radius: 2px;
  color: #fff;
  background: #27a9e0;
  font-size: var(--fs-sm);
  line-height: 15px;
}

.status {
  font-weight: 400;
}

.status.client { color: var(--green); }
.status.resilie { color: var(--red); }
.status.prospect { color: #367bd5; }
.status.attention { color: var(--orange); }
.status.complique { color: #8f54cc; }

.product-link {
  color: #159cb3;
  font-weight: 400;
}

.bell {
  color: #b5b5b5;
  font-size: var(--fs-lg);
}

.pager {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  border-top: 1px solid var(--line);
  color: #6c7784;
  background: #f9fbfd;
  font-size: var(--fs-sm);
}

.pager button {
  height: 28px;
  border: 1px solid var(--line);
  border-radius: 3px;
  color: #6c7784;
  background: #fff;
}

.pager .page-num {
  min-width: 32px;
  color: #fff;
  background: #f5a11d;
  border-color: #f5a11d;
}

.pager input {
  width: 44px;
  height: 28px;
  border: 1px solid var(--line);
  text-align: center;
}

/* ── Requirement 9: Dynamic pagination layout ── */
.pager {
  flex-wrap: wrap;
  min-height: 36px;
  padding: 2px 10px;
}
.pager-summary {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  min-height: 30px;
  padding: 0 2px;
  font-size: var(--fs-sm);
  color: #6c7784;
}
.pager-summary b {
  color: #334155;
}
.pager-sep {
  color: #cbd5e1;
  user-select: none;
}
.pager-controls {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
  margin-left: auto;
  padding: 0 2px 2px 2px;
}
.pager-controls button {
  height: 26px;
  min-width: 28px;
  padding: 0 8px;
  border: 1px solid #e2e8f0;
  border-radius: 3px;
  color: #475569;
  background: #fff;
  font-size: var(--fs-sm);
  cursor: pointer;
  white-space: nowrap;
}
.pager-controls button:hover:not(:disabled) {
  background: #f1f5f9;
  border-color: #cbd5e1;
}
.pager-controls button:disabled {
  opacity: 0.4;
  cursor: default;
}
.pager-controls button.page-num,
.pager-controls button.active-page {
  min-width: 30px;
  color: #fff;
  background: #f5a11d;
  border-color: #f5a11d;
  font-weight: 400;
}
.pager-controls button.page-num:hover,
.pager-controls button.active-page:hover {
  background: #e8950d;
  border-color: #e8950d;
}
.pager-ellipsis {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 26px;
  color: #94a3b8;
  font-size: var(--fs-md);
  user-select: none;
}
.pager-controls input {
  width: 44px;
  height: 26px;
  border: 1px solid #e2e8f0;
  border-radius: 3px;
  text-align: center;
  font-size: var(--fs-sm);
  color: #334155;
}
.pager-controls span {
  font-size: var(--fs-sm);
  color: #6c7784;
}
/* ── Three-zone alignment ── */
.pager {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 4px;
}
.pager-summary {
  flex: 0 0 auto;
}
.pager-fill {
  flex: 0 0 auto;
  width: 16px;
}
.pager-controls {
  flex: 0 0 auto;
  margin-left: auto;
}

.dash-tabs {
  height: 48px;
  display: flex;
  align-items: end;
  gap: 18px;
  padding: 0 20px;
  background: #fff;
}

.dash-tabs button {
  height: 34px;
  border: 0;
  color: #687789;
  background: transparent;
}

.dash-tabs .active {
  color: var(--blue);
  border-bottom: 2px solid var(--blue);
}

.dash-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 12px;
}

.dash-card {
  min-height: 250px;
  border: 1px solid var(--line);
  background: #fff;
}

.span-2 {
  grid-column: span 1;
}

.card-head {
  height: 50px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 14px;
  border-bottom: 1px solid var(--line);
}

.card-head h2 {
  margin: 0;
  flex: 1;
  font-size: var(--fs-md);
}

.card-head select,
.card-head input {
  height: 30px;
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 0 10px;
  color: #6b7785;
  background: #fff;
}

.brief-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 12px;
  padding: 18px;
}

/* 仪表盘佣金KPI横条 */
.dash-commission-bar {
  display: flex;
  gap: 0;
  background: #fff;
  border: 1px solid #edf1f5;
  border-radius: 6px;
  margin-bottom: 12px;
  overflow: hidden;
  grid-column: 1 / -1;
}
.dash-comm-item {
  flex: 1;
  padding: 12px 16px;
  text-align: center;
  border-right: 1px solid #edf1f5;
}
.dash-comm-item:last-child { border-right: 0; }
.dash-comm-item span { display: block; font-size: var(--fs-sm); color: #8899aa; margin-bottom: 4px; }
.dash-comm-item b { font-size: var(--fs-2xl); font-weight: 400; color: #1a3a6b; }
.dash-comm-item.highlight { background: #f0f7ff; }
.dash-comm-item.highlight b { color: #0967ff; }
.dash-comm-item.warn b { color: #e67e22; }

.brief-card,
.reminder-card {
  height: 88px;
  border: 1px solid #edf1f5;
  padding: 14px;
  background: #fff;
}

.brief-card strong,
.reminder-card strong {
  display: block;
  color: #59a2e8;
  font-size: var(--fs-2xl);
  font-weight: 400;
}

.brief-card span,
.reminder-card span {
  display: block;
  margin-top: 10px;
  color: #606f7f;
}

.todo-box {
  padding: 22px 30px;
  color: #606f7f;
}

.rank-tabs {
  display: flex;
  gap: 22px;
  padding: 0 16px;
  height: 38px;
  align-items: center;
  border-bottom: 1px solid var(--line);
}

.rank-tabs button {
  border: 0;
  color: #44505d;
  background: transparent;
}

.rank-tabs .active {
  color: var(--blue);
  border-bottom: 2px solid var(--blue);
}

.rank-row {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 12px;
  align-items: center;
  padding: 9px 20px;
}

.rank-bar {
  height: 14px;
  border-radius: 8px;
  background: #e9edf5;
  overflow: hidden;
}

.rank-bar div {
  height: 100%;
  border-radius: inherit;
  background: #3b9aed;
}

.goal-ring {
  display: grid;
  place-items: center;
  height: 160px;
}

.goal-ring div {
  width: 116px;
  height: 116px;
  display: grid;
  place-items: center;
  border: 14px solid #25cb16;
  border-radius: 50%;
  color: #22b915;
}

.goal-ring b,
.goal-ring span {
  grid-column: 1;
  grid-row: 1;
}

.goal-ring span {
  transform: translateY(18px);
  font-size: var(--fs-sm);
}

.goal-info {
  width: 330px;
  max-width: calc(100% - 40px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  padding: 14px;
  border-radius: 4px;
  background: #eeeeee;
  text-align: center;
  overflow: hidden;
}
.goal-info span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.goal-info b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.funnel {
  height: 230px;
  display: grid;
  place-items: center;
  padding: 20px;
}

.funnel-stage {
  height: 28px;
  color: #fff;
  text-align: center;
  line-height: 28px;
  font-size: var(--fs-sm);
}

.reminder-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 22px;
}

.empty-state {
  min-height: calc(100vh - 48px);
  display: grid;
  place-items: center;
  align-content: center;
  gap: 14px;
  color: #7a8795;
  background: #fff;
}

.placeholder-workbench {
  width: min(760px, 92vw);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 4px;
}

.placeholder-card {
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: #fff;
  text-align: left;
}

.placeholder-card b {
  color: #31465a;
}

.placeholder-card span {
  color: var(--muted);
  font-size: var(--fs-sm);
  line-height: 1.5;
}

.empty-illustration {
  width: 78px;
  height: 78px;
  display: grid;
  place-items: center;
  border: 2px solid #9dc9ef;
  border-radius: 40% 45% 38% 50%;
  color: #8ebeea;
  font-size: var(--fs-stat);
}

.blue-action {
  height: 32px;
  border: 0;
  border-radius: 3px;
  padding: 0 16px;
  color: #fff;
  background: var(--blue);
}

.floating-actions {
  position: fixed;
  right: 16px;
  top: 230px;
  display: grid;
  gap: 10px;
}

.floating-actions button {
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 50%;
  color: #fff;
  background: var(--blue);
  box-shadow: 0 3px 12px rgba(39, 128, 237, .35);
}

.enhanced-filter-row {
  min-height: 40px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  border-bottom: 1px solid var(--line);
  background: #fbfdff;
  color: #5d6b7a;
  font-size: var(--fs-sm);
}

.enhanced-filter-row label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.enhanced-filter-row input,
.enhanced-filter-row select,
.enhanced-filter-row button {
  height: 28px;
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 0 8px;
  background: #fff;
  color: #3e4b59;
}

.enhanced-filter-row input {
  width: 150px;
}

/* 客户评级按钮组 */
.rating-group {
  display: flex;
  gap: 3px;
}
.rating-btn {
  height: 28px;
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 0 10px;
  background: #fff;
  color: #6b7a8d;
  font-size: var(--fs-sm);
  cursor: pointer;
  white-space: nowrap;
  transition: all .15s;
}
.rating-btn:hover {
  border-color: #b9daf9;
  color: #1c71cf;
}
.rating-btn.active,
.rating-btn.active:hover {
  background: #eef5ff;
  border-color: #1c71cf;
  color: #1c71cf;
  font-weight: 400;
}
.rating-btn.vip.active {
  background: #e8f5e9;
  border-color: #4caf50;
  color: #2e7d32;
}
.rating-btn.normal.active {
  background: #fff8e1;
  border-color: #ff9800;
  color: #e65100;
}
.rating-btn.risk.active {
  background: #ffebee;
  border-color: #f44336;
  color: #c62828;
}
.rating-num {
  font-weight: 400;
  margin-left: 2px;
}
.filter-sep {
  width: 1px;
  height: 20px;
  background: #ddd;
  margin: 0 6px;
}
.filter-spacer {
  flex: 1;
}

.debt-side em,
.vip-side em,
.risk-side em {
  background: #f05f5f;
}

.data-table tbody tr.debt-row {
  color: #a91d2b;
  background: #fff1f2;
}

.data-table tbody tr.debt-row:hover {
  background: #ffe7e9;
}

.name-stack {
  display: inline-grid;
  grid-template-columns: auto 1fr;
  gap: 2px 5px;
  align-items: center;
  text-align: left;
}

.name-stack small {
  grid-column: 2;
  color: #7c8997;
  font-size: var(--fs-xs);
  font-weight: 400;
}

.rating-badge,
.policy-status,
.birthday-pill,
.debt-blink,
.mini-tag,
.debt-label {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  border-radius: 3px;
  padding: 1px 6px;
  font-size: var(--fs-sm);
  line-height: 1.4;
  white-space: nowrap;
}

.rating-vip {
  color: #18823b;
  background: #e7f7ed;
}

.rating-normal {
  color: #2f3d4d;
  background: #edf1f5;
}

.rating-risk {
  color: #bd4a00;
  background: #fff0df;
}

.policy-ok {
  color: #18823b;
  background: #e7f7ed;
}

/* BUG 6 修复：已过期和待续保保单状态样式 */
.policy-expired {
  color: #b42335;
  background: #ffe2e6;
}

.policy-warning {
  color: #bd4a00;
  background: #fff0df;
}

.policy-bad,
.debt-label {
  color: #b42335;
  background: #ffe2e6;
}

.debt-blink {
  color: #fff;
  background: #e44d5e;
  animation: debtPulse 1.5s ease-in-out infinite;
}

.birthday-pill {
  color: #7a4b00;
  background: #fff4cc;
}

@keyframes debtPulse {
  0%, 100% {
    box-shadow: 0 0 0 rgba(228, 77, 94, 0);
  }
  50% {
    box-shadow: 0 0 0 3px rgba(228, 77, 94, .16);
  }
}

.policy-icon {
  display: inline-grid;
  place-items: center;
  width: 20px;
  height: 20px;
  margin-right: 5px;
  border-radius: 3px;
  color: #276dcc;
  background: #e9f2ff;
  font-weight: 400;
}

.insurance-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  border: 1px solid #d8e5f2;
  border-radius: 4px;
  padding: 2px 9px 2px 3px;
  background: #f6fbff;
  color: #263b51;
  font-weight: 400;
  line-height: 1.2;
  white-space: nowrap;
  margin: 1px;
  vertical-align: middle;
}
/* Category chips cell: wrap, no truncation */
.category-chips-cell {
  white-space: normal !important;
  line-height: 1.6;
}
/* Product tags cell: wrap, no truncation */
.product-tags-cell {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  align-items: center;
  line-height: 1.6;
}
.product-tag {
  display: inline-block;
  padding: 2px 8px;
  margin: 1px 2px;
  border: 1px solid #d8e5f2;
  border-radius: 4px;
  background: #f6fbff;
  color: #263b51;
  font-size: var(--fs-sm);
  font-weight: 400;
  line-height: 1.4;
  vertical-align: middle;
  max-width: 100%;
  word-break: break-word;
}

.insurance-mark {
  width: 28px;
  height: 26px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  color: #fff;
  background: #3478d8;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .24);
  font-size: 0;
  font-weight: 400;
}

.insurance-mark svg {
  width: 19px;
  height: 19px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.25;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.insurance-mark .bi {
  font-size: var(--fs-xl);
  line-height: 1;
}

.insurance-badge.type-auto {
  border-color: #bfd8ff;
  background: #f0f6ff;
}

.insurance-badge.type-auto .insurance-mark {
  background: #2e74d8;
}

.insurance-badge.type-home {
  border-color: #cce5d1;
  background: #f3fff5;
}

.insurance-badge.type-home .insurance-mark {
  background: #2c9a4b;
}

.insurance-badge.type-health {
  border-color: #bddff6;
  background: #f0faff;
}

.insurance-badge.type-health .insurance-mark {
  background: #1590c8;
}

.insurance-badge.type-accident {
  border-color: #f7dcb1;
  background: #fff9ef;
}

.insurance-badge.type-accident .insurance-mark {
  background: #d98512;
}

.insurance-badge.type-life {
  border-color: #ffd0d7;
  background: #fff5f7;
}

.insurance-badge.type-life .insurance-mark {
  background: #cf4660;
}

.insurance-badge.type-pension {
  border-color: #d7c9ff;
  background: #f7f3ff;
}

.insurance-badge.type-pension .insurance-mark {
  background: #7056ca;
}

.insurance-badge.type-saving {
  border-color: #f0dda2;
  background: #fffbee;
}

.insurance-badge.type-saving .insurance-mark {
  background: #b98400;
}

.insurance-badge.type-group {
  border-color: #c7d9ea;
  background: #f4f8fc;
}

.insurance-badge.type-group .insurance-mark {
  background: #607d99;
}

.insurance-badge.type-other .insurance-mark {
  background: #7a8795;
}

.profile-quick-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-top: 0;
  background: #fbfdff;
}

.profile-quick-actions button,
.mini-action,
.transfer-box button {
  min-height: 28px;
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 0 10px;
  background: #fff;
  color: #31516d;
}

.profile-quick-actions label,
.transfer-box label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #657386;
}

.transfer-box {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: flex-start;
  padding: 10px;
  border: 1px solid var(--line);
  background: #fbfdff;
}

.transfer-search-wrap {
  position: relative;
  flex: 1;
  min-width: 260px;
}

.transfer-search-wrap input[type="text"] {
  width: 100%;
  height: 30px;
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 0 8px;
  font-size: var(--fs-base);
}

.search-dropdown {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  max-height: 200px;
  overflow-y: auto;
  background: #fff;
  border: 1px solid var(--line);
  border-top: none;
  border-radius: 0 0 4px 4px;
  z-index: 1000;
  box-shadow: 0 4px 12px rgba(0,0,0,.1);
}

.search-dropdown-item {
  padding: 7px 10px;
  font-size: var(--fs-base);
  cursor: pointer;
  border-bottom: 1px solid #f0f0f0;
}

.search-dropdown-item:hover,
.search-dropdown-item.active {
  background: #e8f0fe;
  color: #1a3a5c;
}

.search-dropdown-item small {
  color: #888;
  margin-left: 6px;
  font-size: var(--fs-xs);
}

.search-dropdown-item.no-match {
  color: #999;
  cursor: default;
  text-align: center;
}

.search-dropdown-item.no-match:hover {
  background: #fff;
}

.transfer-box select {
  height: 30px;
  min-width: 260px;
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 0 8px;
  background: #fff;
}

.policy-ledger-line .mini-action,
.profile-policy .mini-action {
  justify-self: start;
}

.year-break td {
  color: #286bbd;
  font-weight: 400;
  background: #eef6ff;
}

.year-toggle { cursor: pointer; user-select: none; }
.year-toggle:hover td { background: #dceeff; }
.year-arrow { display: inline-block; width: 16px; font-size: var(--fs-xs); transition: transform 0.2s; }
.year-stats { margin-left: 12px; font-weight: 400; color: #6688aa; font-size: var(--fs-sm); }

.policy-stats-bar {
  display: flex;
  gap: 6px;
  padding: 5px 10px;
  background: #eef2f7;
  border-top: 1px solid #d4dae6;
  margin-top: 4px;
  align-items: center;
  font-size: var(--fs-xs);
  flex-wrap: wrap;
  line-height: 1.4;
  min-height: 0;
  border-radius: 4px;
  justify-content: center;
}
.compact-stat { white-space: nowrap; color: #445; font-size: var(--fs-xs); }
.compact-stat b { color: #1a3a6b; font-size: var(--fs-xs); font-weight: 400; }
.compact-sep { color: #bbc4d4; margin: 0 3px; font-size: var(--fs-2xs); }
.policy-stats-bar .stat-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 6px 14px;
  background: #fff;
  border-radius: 4px;
  border: 1px solid #e0e6f0;
  min-width: 80px;
}
.policy-stats-bar .stat-card .stat-value {
  font-size: var(--fs-xl);
  font-weight: 400;
  color: #1a3a6b;
}
.policy-stats-bar .stat-card .stat-label {
  font-size: var(--fs-xs);
  color: #8899aa;
  margin-top: 2px;
}
.policy-stats-bar .stat-divider {
  width: 1px;
  height: 28px;
  background: #d0ddf0;
}
.policy-stats-bar .stat-highlight { color: #e67e22; }
.policy-stats-bar .stat-profit { color: #27ae60; }

.policy-ai-bar {
  display: flex;
  gap: 8px;
  padding: 8px 12px;
  background: #fafbff;
  border: 1px solid #d8dff0;
  border-radius: 6px;
  margin-bottom: 8px;
  align-items: center;
}
.policy-ai-bar input {
  flex: 1;
  border: 1px solid #ccd5e8;
  border-radius: 4px;
  padding: 6px 12px;
  font-size: var(--fs-base);
  outline: none;
}
.policy-ai-bar input:focus { border-color: #4a90d9; box-shadow: 0 0 0 2px rgba(74,144,217,0.15); }
.policy-ai-bar button {
  padding: 6px 16px;
  background: #4a90d9;
  color: #fff;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: var(--fs-base);
  white-space: nowrap;
}
.policy-ai-bar button:hover { background: #3a7bc8; }
.policy-ai-result {
  font-size: var(--fs-base);
  color: #2a6bb0;
  max-width: 400px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.policy-analytics-panel {
  background: #fff;
  border: 1px solid #d8dff0;
  border-radius: 6px;
  margin-bottom: 8px;
  overflow: hidden;
}
.analytics-tabs {
  display: flex;
  background: #f5f7fb;
  border-bottom: 1px solid #d8dff0;
}
.analytics-tab {
  padding: 8px 16px;
  border: none;
  background: none;
  font-size: var(--fs-sm);
  color: #7799bb;
  cursor: pointer;
  border-bottom: 2px solid transparent;
}
.analytics-tab.active { color: #2a6bb0; border-bottom-color: #4a90d9; font-weight: 400; }
.analytics-tab:hover { color: #4a90d9; }
.analytics-content { padding: 12px 16px; max-height: 400px; overflow-y: auto; }
.analytics-table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.analytics-table th { text-align: left; padding: 6px 8px; border-bottom: 2px solid #e0e6f0; color: #779; font-weight: 400; }
.analytics-table td { padding: 5px 8px; border-bottom: 1px solid #f0f3f8; }
.analytics-table tr:hover td { background: #f8faff; }
.analytics-bar { display: inline-block; height: 14px; border-radius: 3px; background: #4a90d9; vertical-align: middle; margin-right: 6px; min-width: 2px; }
.analytics-bar.orange { background: #e67e22; }
.analytics-bar.green { background: #27ae60; }
.analytics-bar.red { background: #e74c3c; }
.analytics-highlight { font-weight: 400; color: #2a6bb0; }
.analytics-warn { color: #e67e22; font-weight: 400; }
.analytics-danger { color: #e74c3c; font-weight: 400; }

.home-alerts {
  display: grid;
  grid-template-columns: 1.2fr 1.2fr .9fr;
  gap: 10px;
  padding: 10px 12px 0;
}

.alert-board {
  min-height: 86px;
  display: grid;
  grid-template-columns: minmax(130px, .65fr) 1fr auto;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--line);
  background: #fff;
  padding: 10px;
}

.alert-board b {
  display: block;
  color: #263544;
}

.alert-board span {
  color: #7c8997;
  font-size: var(--fs-sm);
}

.debt-board {
  border-color: #ffd5db;
  background: #fff7f8;
}

.birthday-board {
  border-color: #f5dfaa;
  background: #fffcf3;
}

.vip-board {
  border-color: #cdebd8;
  background: #f5fff8;
}

.alert-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.alert-list button {
  min-height: 28px;
  border: 1px solid var(--line);
  border-radius: 3px;
  background: #fff;
  color: #3a5269;
  padding: 4px 8px;
  text-align: left;
}

.alert-list small {
  display: block;
  color: #9a4a55;
  font-size: var(--fs-xs);
}

.compact-action {
  height: 28px;
  padding: 0 10px;
  white-space: nowrap;
}

.ledger-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 10px;
  padding: 12px;
  border-bottom: 1px solid var(--line);
  background: #fff;
}

.mini-tag {
  margin: 2px 4px 2px 0;
  color: #3a5269;
  background: #eef4fb;
}

.profile-grid {
  align-items: start;
}

.enhanced-profile {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.enhanced-panel {
  margin-top: 12px;
}

.enhanced-panel h3 {
  margin: 0 0 10px;
  color: #33495f;
  font-size: var(--fs-md);
}

.relation-row,
.policy-ledger-line,
.file-card {
  display: grid;
  gap: 5px;
  border: 1px solid #edf1f5;
  background: #fff;
  padding: 10px;
  margin-bottom: 8px;
}

.relation-row {
  grid-template-columns: 1fr auto;
  align-items: center;
}

.relation-row small {
  display: block;
  color: #7c8997;
  margin-top: 3px;
}

.relation-row button,
.relation-control button,
.file-actions button {
  height: 26px;
  border: 1px solid var(--line);
  border-radius: 3px;
  background: #fff;
  color: #3a5269;
  padding: 0 8px;
}

.relation-control {
  display: grid;
  grid-template-columns: 1fr 110px auto;
  gap: 6px;
  margin-top: 8px;
}

.relation-control select {
  height: 28px;
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 0 8px;
  background: #fff;
}

.file-folder {
  border: 1px solid #edf1f5;
  margin-bottom: 10px;
}

.folder-head {
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  background: #f7fbff;
  border-bottom: 1px solid #edf1f5;
}

.folder-head input {
  max-width: 220px;
  font-size: var(--fs-sm);
}

.file-list {
  padding: 10px;
}

.file-card span,
.policy-ledger-line span {
  color: #647486;
  font-size: var(--fs-sm);
  line-height: 1.5;
}

.file-actions {
  display: flex;
  gap: 6px;
}

.file-preview-img {
  max-width: min(720px, 80vw);
  max-height: 70vh;
  display: block;
  object-fit: contain;
  border: 1px solid var(--line);
}

.debt-card {
  border-color: #ffd5db;
  background: #fff7f8;
}

@media (max-width: 1100px) {
  .home-alerts {
    grid-template-columns: 1fr;
  }

  .alert-board {
    grid-template-columns: 1fr;
  }

  .enhanced-filter-row {
    flex-wrap: wrap;
  }
}

.modal {
  width: min(900px, calc(100vw - 32px));
  border: 0;
  border-radius: 6px;
  padding: 0;
  box-shadow: 0 20px 80px rgba(0,0,0,.25);
}

.action-list {
  display: grid;
  gap: 10px;
}

.action-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: #fbfcfe;
}

.action-row span,
.action-note {
  color: var(--muted);
  line-height: 1.5;
}

.action-row button,
.mini-action {
  height: 30px;
  border: 1px solid var(--line-dark);
  border-radius: 3px;
  padding: 0 10px;
  background: #fff;
}

.edit-customer-btn {
  min-width: 70px;
  height: 28px;
  border: 1px solid #c8ddf4;
  border-radius: 3px;
  background: #eef6ff;
  color: #0d63b8;
  font-weight: 400;
  white-space: nowrap;
}

.edit-customer-btn:hover {
  border-color: #86b9ee;
  background: #dff0ff;
}

.summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.summary-card {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: #fbfcfe;
}

.summary-card b {
  display: block;
  margin-top: 4px;
  font-size: var(--fs-2xl);
}

body.theme-alt {
  --blue: #247c92;
  --blue-dark: #1b6577;
  --rail: #286c83;
  --cyan: #20a4b8;
}

.wide-modal {
  width: min(1120px, calc(100vw - 32px));
}

.modal::backdrop {
  background: rgba(20, 31, 45, .42);
}

.modal-card {
  padding: 18px;
}

.modal-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
}

.modal-head h2 {
  margin: 0;
  font-size: var(--fs-xl);
}

.modal-head button {
  width: 32px;
  height: 32px;
  border: 1px solid var(--line);
  background: #fff;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.form-grid label {
  display: grid;
  gap: 5px;
  color: #4e5d6e;
  font-weight: 400;
}

.form-grid input,
.form-grid select,
.form-grid textarea,
.file-box input {
  width: 100%;
  border: 1px solid var(--line-dark);
  border-radius: 3px;
  padding: 8px;
  outline: none;
}

.wide {
  grid-column: 1 / -1;
}

/* Form section headings — span two columns, tight height */
.form-section-heading {
  grid-column: 1 / -1;
  padding: 6px 0 4px;
  margin: 4px 0 0;
  color: #1a237e;
  font-size: var(--fs-base);
  font-weight: 400;
  letter-spacing: .03em;
  line-height: 1.3;
  border-bottom: 2px solid #eef2ff;
}

.modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 16px;
  position: sticky;
  bottom: 0;
  background: #fff;
  padding: 10px 0 4px;
  z-index: 2;
  border-top: 1px solid #edf1f6;
}

/* ── Customer form: sticky footer with shadow ── */
#customerDialog .modal-card { display: flex; flex-direction: column; max-height: 90vh; }
#customerDialog .modal-head { flex-shrink: 0; }
#customerDialog .form-grid { flex: 1; overflow-y: auto; padding: 0 4px; }
#customerDialog .modal-actions { flex-shrink: 0; box-shadow: 0 -2px 6px rgba(0,0,0,.06); margin-top: 0; }

.modal-actions button,
.primary {
  height: 34px;
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 0 16px;
  background: #fff;
}

.modal-actions .primary,
.primary {
  color: #fff;
  border-color: var(--blue);
  background: var(--blue);
}

/* ═══ Internal dialog system (replaces browser prompt/alert/confirm) ═══ */
.internal-dialog { max-width: 480px !important; }
.internal-dialog-card { max-height: 85vh; display: flex; flex-direction: column; overflow: hidden; }
.internal-dialog-body { flex: 1; overflow-y: auto; padding: 8px 0; min-height: 40px; }
.internal-dialog-body p { margin: 0 0 8px; font-size: var(--fs-base); line-height: 1.5; white-space: pre-wrap; }
.internal-dialog-footer { margin-top: 0; padding-top: 8px; border-top: 1px solid #edf1f6; }
.internal-dialog-footer button { min-width: 70px; }
.internal-prompt-input:focus { border-color: #2563eb; outline: none; box-shadow: 0 0 0 2px rgba(37,99,235,.15); }
.internal-dlg-close { width: 32px; height: 32px; border: 1px solid #ddd; border-radius: 3px; background: #fff; cursor: pointer; font-size: var(--fs-lg); line-height: 1; }

.quote-layout {
  display: grid;
  grid-template-columns: 330px minmax(0, 1fr);
  gap: 16px;
}

.quote-results {
  min-height: 360px;
  display: grid;
  gap: 10px;
  align-content: start;
}

.quote-card {
  display: grid;
  grid-template-columns: 1fr 120px 80px 150px;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--blue);
  background: #fff;
}

.quote-card h3 {
  margin: 0 0 4px;
  font-size: var(--fs-md);
}

.quote-card p {
  margin: 0;
  color: #667585;
}

.profile-grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: 14px;
}

.profile-two-col {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 16px;
  align-items: start;
}

.profile-col-left {
  min-width: 0;
}

.profile-col-right {
  min-width: 0;
  position: sticky;
  top: 0;
}

.profile-col-right .profile-panel {
  margin-bottom: 12px;
}

.profile-col-right .birthday-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.profile-col-right .birthday-row input {
  width: 100%;
}

.profile-panel {
  border: 1px solid var(--line);
  background: #fff;
}

.profile-panel h3 {
  margin: 0;
  height: 38px;
  display: flex;
  align-items: center;
  padding: 0 12px;
  border-bottom: 1px solid var(--line);
  font-size: var(--fs-md);
}

.profile-info,
.profile-policy-list {
  display: grid;
  gap: 8px;
  padding: 12px;
}

.profile-kv,
.profile-policy {
  display: grid;
  gap: 4px;
  padding: 9px;
  border: 1px solid #edf1f5;
  background: #fbfcfe;
}

.profile-kv span,
.profile-policy span {
  color: var(--muted);
  font-size: var(--fs-sm);
}

.profile-kv b,
.profile-policy b {
  overflow-wrap: anywhere;
}

.quote-price {
  color: #111;
  font-size: var(--fs-2xl);
  font-weight: 400;
  text-align: right;
}

.score {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  color: var(--green);
  border: 5px solid #39c869;
  font-weight: 400;
}

.quote-actions {
  display: grid;
  gap: 6px;
}

.quote-actions button {
  height: 30px;
  border: 1px solid var(--line-dark);
  border-radius: 3px;
  background: #fff;
}

.quote-actions .primary {
  border-color: var(--blue);
  background: var(--blue);
}

.notice {
  margin: 0 0 12px;
  padding: 10px;
  border: 1px solid #bfe5f0;
  background: #f1fbff;
  color: #4e6575;
  line-height: 1.6;
}

.file-box {
  min-height: 100px;
  display: grid;
  place-items: center;
  gap: 10px;
  border: 1px dashed #b9d7f2;
  background: #f8fcff;
}

#importLog {
  min-height: 80px;
  padding: 10px;
  background: #f6f8fb;
  white-space: pre-wrap;
}

.toast {
  position: fixed;
  right: 18px;
  bottom: 18px;
  max-width: 420px;
  padding: 12px 14px;
  color: #fff;
  background: #263238;
  border-radius: 4px;
  box-shadow: 0 8px 28px rgba(0,0,0,.22);
}

.hidden { display: none; }

@media (max-width: 1100px) {
  .app {
    grid-template-columns: 62px 160px minmax(0, 1fr);
  }
  .brief-grid,
  .reminder-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .quote-layout {
    grid-template-columns: 1fr;
  }
  .profile-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  body { overflow: auto; }
  .app {
    height: auto;
    grid-template-columns: 1fr;
  }
  .icon-rail,
  .list-sidebar,
  .workspace {
    height: auto;
  }
  .rail-nav {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .list-sidebar {
    display: none;
  }
  .topbar,
  .list-toolbar,
  .pager {
    overflow-x: auto;
  }
  .workspace {
    min-height: 100vh;
  }
  .dash-grid,
  .form-grid,
  .placeholder-workbench,
  .summary-grid {
    grid-template-columns: 1fr;
  }
}

/* v117: team management */
.team-page { width: 100%; max-width: 1440px; margin: 0 auto; padding: clamp(16px, 2.5vw, 32px); }
.team-page-head { align-items: center; }
.team-page-head h1 { display: flex; align-items: center; gap: 10px; }
#teamMemberCount { display: inline-grid; place-items: center; min-width: 30px; height: 25px; padding: 0 8px; border-radius: 999px; background: #eaf2ff; color: #0967ff; font-size: var(--fs-base); }
.team-head-actions { display: flex; align-items: center; gap: 9px; flex: 0 0 auto; }
.team-refresh-btn { width: 38px; height: 38px; border: 1px solid #dbe7f7; border-radius: 10px; background: #fff; color: #475569; font-size: var(--fs-2xl); cursor: pointer; }
.team-refresh-btn:hover { border-color: #0967ff; color: #0967ff; }
.team-filters { display: grid; grid-template-columns: minmax(280px, 1.5fr) minmax(170px, .6fr) minmax(170px, .6fr); gap: 12px; margin-bottom: 16px; }
.team-filters label { display: grid; gap: 6px; min-width: 0; }
.team-filters label > span { color: #64748b; font-size: var(--fs-xs); font-weight: 400; letter-spacing: .04em; text-transform: uppercase; }
.team-filters input, .team-filters select { width: 100%; height: 40px; border: 1px solid #dbe7f7; border-radius: 10px; background: #fff; padding: 0 12px; }
.team-filters input:focus, .team-filters select:focus { outline: none; border-color: #0967ff; box-shadow: 0 0 0 3px rgba(9,103,255,.11); }
.team-table { min-width: 1080px; }
.team-member-cell { display: flex; align-items: center; gap: 10px; min-width: 220px; }
.team-member-cell > span:last-child { display: grid; gap: 2px; min-width: 0; }
.team-member-cell strong, .team-member-cell small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.team-member-cell small { color: #64748b; font-weight: 400; }
.team-avatar { display: grid; place-items: center; width: 38px; height: 38px; flex: 0 0 38px; border-radius: 12px; background: linear-gradient(135deg,#e7efff,#cfe0ff); color: #0759d6; font-weight: 400; }
.team-role-badge, .team-status-badge { display: inline-flex; align-items: center; gap: 6px; width: max-content; padding: 5px 9px; border-radius: 999px; font-size: var(--fs-xs); font-weight: 400; }
.team-role-badge.is-boss { background: #f3e8ff; color: #6b21a8; }
.team-role-badge.is-employee { background: #e0f2fe; color: #075985; }
.team-status-badge.is-active { background: #dcfce7; color: #166534; }
.team-status-badge.is-disabled { background: #f1f5f9; color: #64748b; }
.team-status-badge i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.team-row-menu { position: relative; display: inline-flex; justify-content: flex-end; }
.team-menu-trigger { width: 34px; height: 32px; border: 1px solid #dbe7f7; border-radius: 9px; background: #fff; color: #334155; font-size: var(--fs-xl); line-height: 1; cursor: pointer; }
.team-menu { position: absolute; z-index: 30; top: calc(100% + 5px); right: 0; display: grid; width: 250px; padding: 6px; border: 1px solid #dbe7f7; border-radius: 11px; background: #fff; box-shadow: 0 16px 34px rgba(15,23,42,.16); }
.team-menu[hidden] { display: none; }
.team-menu button { padding: 9px 10px; border: 0; border-radius: 7px; background: transparent; text-align: left; cursor: pointer; }
.team-menu button:hover:not(:disabled) { background: #f1f6ff; }
.team-menu button.danger { color: #b91c1c; }
.team-menu button:disabled { color: #94a3b8; cursor: not-allowed; }
.team-empty { padding: 28px !important; text-align: center; color: #64748b; }
.team-note { padding: 11px 13px; border-radius: 9px; background: #f8fafc; line-height: 1.5; }
.team-member-dialog .modal-card { max-width: 620px !important; }
.form-error { min-height: 20px; margin: 8px 0 0; color: #b91c1c; font-weight: 400; }

/* ── Team v119: summary cards, mobile cards, audit timeline, action buttons ── */
.team-summary-row { display: flex; gap: 10px; margin-bottom: 16px; flex-wrap: wrap; }
.team-summary-card { display: grid; gap: 2px; flex: 1 1 130px; min-width: 110px; padding: 12px 16px; border-radius: 12px; background: #f8fafc; border: 1px solid #e8eef7; text-align: center; }
.team-summary-card b { font-size: var(--fs-2xl); font-weight: 400; color: #0f172a; }
.team-summary-card span { font-size: var(--fs-xs); color: #64748b; font-weight: 400; text-transform: uppercase; letter-spacing: .03em; }
.team-summary-card.active { border-color: #bbf7d0; background: #f0fdf4; }
.team-summary-card.active b { color: #166534; }
.team-summary-card.disabled { border-color: #e2e8f0; background: #f8fafc; }
.team-summary-card.disabled b { color: #64748b; }
.team-summary-card.boss { border-color: #e9d5ff; background: #faf5ff; }
.team-summary-card.boss b { color: #6b21a8; }
.team-summary-card.employee { border-color: #bfdbfe; background: #eff6ff; }
.team-summary-card.employee b { color: #1e40af; }

/* Action buttons in table */
.team-actions-cell { display: flex; gap: 4px; flex-wrap: nowrap; }
.team-action-btn { width: 32px; height: 32px; padding: 0; border: 1px solid #dbe7f7; border-radius: 8px; background: #fff; cursor: pointer; font-size: var(--fs-md); line-height: 1; color: #475569; }
.team-action-btn:hover { border-color: #0967ff; color: #0967ff; background: #f1f6ff; }
.team-action-btn.warn:hover { border-color: #dc2626; color: #dc2626; background: #fef2f2; }

/* Role/status badges (v119 naming) */
.team-role-badge.role-boss { background: #f3e8ff; color: #6b21a8; }
.team-role-badge.role-employee { background: #e0f2fe; color: #075985; }
.team-status-badge.status-active { background: #dcfce7; color: #166534; }
.team-status-badge.status-disabled { background: #f1f5f9; color: #64748b; }
.row-disabled { opacity: 0.55; }

/* Team mobile cards */
.team-mobile-shell { display: none; }
.team-mobile-card { border: 1px solid #e8eef7; border-radius: 12px; padding: 14px; margin-bottom: 10px; background: #fff; }
.team-mobile-card.card-disabled { opacity: 0.55; }
.tmc-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.tmc-identity { flex: 1; min-width: 0; }
.tmc-identity b { display: block; font-size: var(--fs-md); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tmc-identity span { font-size: var(--fs-sm); color: #64748b; }
.tmc-meta { display: grid; gap: 6px; margin-bottom: 10px; }
.tmc-meta > div { display: flex; justify-content: space-between; align-items: center; }
.tmc-meta > div > span:first-child { font-size: var(--fs-xs); color: #64748b; }
.tmc-actions { display: flex; gap: 6px; justify-content: flex-end; }

/* Audit timeline in dialog */
.audit-body { max-height: 50vh; overflow-y: auto; padding: 4px 0; }
.audit-timeline { position: relative; padding-left: 20px; }
.audit-timeline::before { content: ""; position: absolute; left: 7px; top: 4px; bottom: 4px; width: 2px; background: #e2e8f0; }
.audit-entry { position: relative; margin-bottom: 14px; }
.audit-dot { position: absolute; left: -17px; top: 6px; width: 10px; height: 10px; border-radius: 50%; background: #0967ff; border: 2px solid #fff; box-shadow: 0 0 0 2px #0967ff; }
.audit-content { display: grid; gap: 2px; }
.audit-action { font-weight: 400; font-size: var(--fs-base); color: #0f172a; }
.audit-detail { font-size: var(--fs-sm); color: #475569; }
.audit-time { font-size: var(--fs-xs); color: #94a3b8; }
.audit-by { font-size: var(--fs-xs); color: #64748b; }

/* Team dialog styles */
.team-action-dialog .modal-card { max-width: 520px; max-height: 85vh; overflow-y: auto; }
.team-action-dialog .modal-head { display: flex; align-items: center; justify-content: space-between; }
.team-action-dialog .modal-head h2 { margin: 0; font-size: var(--fs-xl); }
.team-action-dialog .modal-close-btn { background: none; border: none; font-size: var(--fs-3xl); cursor: pointer; color: #94a3b8; padding: 0 4px; line-height: 1; }
.team-action-dialog .modal-close-btn:hover { color: #0f172a; }
.team-action-dialog .form-grid { display: grid; gap: 14px; margin: 16px 0; }
.team-action-dialog .form-grid label { display: grid; gap: 4px; font-size: var(--fs-base); font-weight: 400; color: #334155; }
.team-action-dialog .form-grid input,
.team-action-dialog .form-grid select { height: 40px; border: 1px solid #dbe7f7; border-radius: 8px; padding: 0 12px; font-size: var(--fs-md); }
.team-action-dialog .form-grid input:focus,
.team-action-dialog .form-grid select:focus { outline: none; border-color: #0967ff; box-shadow: 0 0 0 3px rgba(9,103,255,.11); }
.team-action-dialog .modal-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 8px; }
.team-action-dialog .modal-actions button { padding: 10px 20px; border-radius: 8px; font-weight: 400; cursor: pointer; font-size: var(--fs-md); }
.team-action-dialog .modal-actions button.primary { background: #0967ff; color: #fff; border: none; }
.team-action-dialog .modal-actions button.primary:hover { background: #0054e8; }
.team-action-dialog .modal-actions button.primary.danger { background: #dc2626; }
.team-action-dialog .modal-actions button.primary.danger:hover { background: #b91c1c; }
.team-action-dialog .modal-actions button:not(.primary) { background: #fff; border: 1px solid #dbe7f7; color: #334155; }
.team-action-dialog .modal-actions button:not(.primary):hover { background: #f1f6ff; border-color: #0967ff; }
.team-action-dialog .confirm-body { margin: 16px 0; }
.team-action-dialog .confirm-body p { margin: 0 0 8px; font-size: var(--fs-md); color: #334155; }
.team-action-dialog .confirm-body p.muted { color: #64748b; font-size: var(--fs-base); }
.team-action-dialog .form-error { min-height: 20px; margin: 0; color: #dc2626; font-weight: 400; font-size: var(--fs-base); }

@media (max-width: 720px) {
  .team-page-head { align-items: flex-start; flex-direction: column; }
  .team-head-actions { width: 100%; }
  #addTeamMemberBtn { flex: 1 1 auto; }
  .team-filters { grid-template-columns: 1fr; }
  .team-card { padding: 12px; }
  .team-menu { position: fixed; top: auto; right: 12px; bottom: 12px; left: 12px; width: auto; }
  .team-summary-row { gap: 6px; }
  .team-summary-card { flex: 1 1 90px; min-width: 80px; padding: 10px 8px; }
  .team-summary-card b { font-size: var(--fs-xl); }
  .team-table-shell { display: none; }
  .team-mobile-shell { display: block; }
}

/* GP AI Intelligence production skin */
.ai-product-shell {
  --blue: #0967ff;
  --blue-dark: #0054e8;
  --rail: #ffffff;
  --bg: #f7f9fd;
  --panel: #ffffff;
  --line: #e8eef7;
  --line-dark: #d9e6f7;
  --text: #0d1015;
  --muted: #9aa3ad;
  --cyan: #10cbe8;
  --green: #00d46a;
  --red: #ff0a50;
  background: #f7f9fd;
}

.ai-product-shell .app {
  grid-template-columns: 96px 224px minmax(720px, 1fr) 400px;
  background: #f7f9fd;
}

.ai-product-shell .icon-rail,
.ai-product-shell .list-sidebar,
.ai-product-shell .efficiency-hub {
  color: #15181f;
  background: #fff;
}

.ai-product-shell .icon-rail {
  border-right: 1px solid #eef1f6;
}

.ai-product-shell .user-head {
  height: 118px;
  grid-template-columns: 50px 1fr;
  justify-items: start;
  align-content: center;
  column-gap: 14px;
  padding: 0 28px;
  border-bottom: 1px solid #f0f2f6;
}

.ai-product-shell .user-head .ai-logo-mark {
  grid-row: span 2;
  width: 50px;
  height: 50px;
  border-radius: 16px;
  background: linear-gradient(135deg, #0a70ff, #12d4e9);
  box-shadow: 0 10px 22px rgba(0, 112, 255, .28);
}

.ai-product-shell .user-head strong {
  display: inline-flex;
  gap: 0;
  color: #05070b;
  font-size: var(--fs-2xl);
  font-weight: 400;
}

.ai-product-shell .user-head strong span {
  color: #0a65ff;
  font-size: inherit;
  opacity: 1;
}

.ai-product-shell .user-head small {
  color: #00a8ff;
  font-size: var(--fs-xs);
  font-weight: 400;
}

.ai-product-shell .rail-nav {
  padding: 26px 16px;
  gap: 18px;
}

.ai-product-shell .rail-item {
  height: 48px;
  grid-template-columns: 34px 1fr auto;
  justify-items: start;
  align-content: center;
  border-radius: 18px;
  padding: 0 18px;
  color: #191d25;
}

.ai-product-shell .rail-item span {
  width: 26px;
  height: 26px;
  color: #191d25;
  font-size: var(--fs-xl);
}

.ai-product-shell .rail-item b {
  font-size: var(--fs-md);
  font-weight: 400;
}

.ai-product-shell .rail-item:hover,
.ai-product-shell .rail-item.active {
  color: #0967ff;
  background: #eaf2ff;
  box-shadow: inset 6px 0 0 #0967ff;
}

.ai-product-shell .rail-item:hover span,
.ai-product-shell .rail-item.active span {
  color: #0967ff;
}

.ai-product-shell .rail-item em,
.ai-product-shell .side-link em {
  background: #0967ff;
  box-shadow: 0 8px 18px rgba(9, 103, 255, .25);
}

.ai-product-shell .market-btn {
  margin: auto 16px 18px;
  border-radius: 16px;
  color: #0967ff;
  background: #eff6ff;
  font-weight: 400;
}

.ai-product-shell .list-sidebar {
  position: relative;
  padding-top: 118px;
  border-right: 1px solid #eef1f6;
}

.ai-product-shell .list-sidebar::before {
  content: "gpassurances PRO";
  white-space: nowrap;
  position: absolute;
  inset: 0 0 auto 0;
  height: 118px;
  display: grid;
  align-content: center;
  padding-left: 22px;
  color: #05070b;
  font-size: var(--fs-2xl);
  font-weight: 400;
  line-height: 1.25;
}

.ai-product-shell .list-sidebar::after {
  content: "";
  position: absolute;
  top: 54px;
  left: 85px;
  width: 66px;
  height: 2px;
  background: #00a8ff;
}

.ai-product-shell .user-head strong,
.ai-product-shell .user-head small {
  display: none;
}

.ai-product-shell .side-search {
  display: none;
}

.ai-product-shell .side-section {
  padding: 5px 16px;
}

.ai-product-shell .side-title {
  color: #b6bdc7;
  font-weight: 400;
}

.ai-product-shell .side-link {
  min-height: 36px;
  border-radius: 16px;
  padding: 0 14px;
  color: #191d25;
  font-weight: 400;
}

.ai-product-shell .side-link:hover,
.ai-product-shell .side-link.active,
.ai-product-shell .side-link.hot {
  color: #0967ff;
  background: #edf4ff;
}

.ai-product-shell .workspace {
  grid-template-rows: 98px minmax(0, 1fr);
  background: #f8faff;
}

.ai-product-shell .topbar {
  padding: 0 40px;
  color: #0d1015;
  background: #fff;
  border-bottom: 1px solid #eef1f6;
}

.ai-product-shell .top-search {
  justify-content: center;
  gap: 0;
}

.ai-product-shell .top-search::before {
  content: "⌕";
  width: 52px;
  height: 54px;
  display: grid;
  place-items: center;
  border: 1px solid #e5ebf4;
  border-right: 0;
  border-radius: 28px 0 0 28px;
  color: #0967ff;
  background: #fff;
  font-size: var(--fs-4xl);
  box-shadow: 0 8px 24px rgba(24, 45, 80, .07);
}

.ai-product-shell .top-search select {
  display: none;
}

.ai-product-shell .top-search input {
  width: min(560px, 54vw);
  height: 54px;
  border: 1px solid #e5ebf4;
  border-left: 0;
  border-radius: 0 28px 28px 0;
  color: #171a21;
  background: #fff;
  font-size: var(--fs-md);
  box-shadow: 10px 8px 24px rgba(24, 45, 80, .07);
}

.ai-product-shell .top-search input::placeholder {
  color: #c6c8cc;
}

.ai-product-shell .top-link {
  color: #0967ff;
  font-weight: 400;
}

.ai-product-shell .top-icons button {
  color: #0d1015;
  background: #fff;
}

.ai-product-shell .top-icons .upload {
  color: #0967ff;
  background: #eff8ff;
}

.ai-product-shell .page {
  background: #f8faff;
}

.ai-product-shell #customersPage.active {
  padding: 16px 28px;
  gap: 8px;
  grid-template-rows: auto auto auto auto;
  align-content: start;
  align-self: start;
  max-height: 100%;
  overflow: hidden;
}

.ai-product-shell .tabs {
  height: auto;
  min-height: 42px;
  align-items: center;
  gap: 10px;
  border: 0;
  padding: 0;
  background: transparent;
}

.ai-product-shell .tab {
  height: 38px;
  border-radius: 20px;
  padding: 0 16px;
  color: #4a5565;
  background: #fff;
  border: 1px solid #edf1f6;
  font-weight: 400;
}

.ai-product-shell .tab.active {
  color: #fff;
  background: linear-gradient(135deg, #0967ff, #10cbe8);
  box-shadow: 0 12px 22px rgba(9, 103, 255, .22);
}

.ai-product-shell .list-toolbar,
.ai-product-shell .enhanced-filter-row,
.ai-product-shell .pager {
  border: 1px solid #edf1f6;
  border-radius: 20px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 12px 28px rgba(24, 45, 80, .06);
}

.ai-product-shell .list-toolbar button,
.ai-product-shell .enhanced-filter-row button,
.ai-product-shell .pager button {
  border-radius: 14px;
  border: 1px solid #e4ebf5;
  background: #fff;
  color: #172033;
  font-weight: 400;
}

.ai-product-shell .list-toolbar .ai-btn,
.ai-product-shell .blue-action,
.ai-product-shell .primary {
  color: #fff;
  background: linear-gradient(135deg, #0967ff, #10cbe8);
  border: 0;
}

.ai-product-shell .table-shell {
  border: 1px solid #e2ebf8;
  border-radius: 28px;
  background: #fff;
  box-shadow: 0 18px 36px rgba(23, 50, 90, .08);
}

.ai-product-shell .data-table th {
  height: 54px;
  color: #7a8491;
  background: #f8fbff;
  font-size: var(--fs-xs);
  font-weight: 400;
  text-transform: uppercase;
}

.ai-product-shell .data-table td {
  height: 64px;
  color: #10151d;
  font-weight: 400;
}

.ai-product-shell .data-table tr.debt-row td {
  background: #fff2f6;
  color: #db0047;
}

.ai-product-shell .edit-customer-btn,
.ai-product-shell .insurance-badge {
  border-radius: 10px;
}

.ai-product-shell .name-stack b,
.ai-product-shell .client-link {
  color: #0967ff;
  font-weight: 400;
}

.efficiency-hub {
  height: 100vh;
  border-left: 1px solid #eef1f6;
  padding: 30px;
  overflow-y: auto;
}

.hub-head {
  height: 48px;
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 30px;
}

.hub-flash {
  color: #10cbe8;
  font-size: var(--fs-4xl);
  font-weight: 400;
}

.hub-head h2 {
  margin: 0;
  font-size: var(--fs-2xl);
  font-weight: 400;
}

.hub-primary,
.hub-secondary,
.hub-data-btn,
.hub-import {
  width: 100%;
  min-height: 64px;
  display: grid;
  place-items: center;
  border-radius: 20px;
  font-size: var(--fs-xl);
  font-weight: 400;
}

.hub-primary {
  border: 0;
  color: #fff;
  background: linear-gradient(135deg, #0967ff, #10cbe8);
  box-shadow: 0 14px 26px rgba(9, 103, 255, .24);
}

.hub-secondary {
  margin-top: 20px;
  border: 1px solid #e4e9f0;
  color: #0d1015;
  background: #fff;
  box-shadow: 0 8px 18px rgba(24, 45, 80, .06);
}

.hub-section {
  margin-top: 34px;
}

.hub-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
  color: #c6c8cc;
  font-size: var(--fs-base);
  font-weight: 400;
}

.hub-title em {
  padding: 5px 12px;
  border-radius: 999px;
  color: #0967ff;
  background: #e9f2ff;
  font-style: normal;
}

.workflow-card {
  position: relative;
  min-height: 104px;
  padding: 24px 24px 18px;
  border: 1px solid #edf1f6;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(24, 45, 80, .06);
}

.workflow-card + .workflow-card {
  margin-top: 18px;
}

.workflow-card b {
  display: block;
  color: #10151d;
  font-size: var(--fs-lg);
  font-weight: 400;
}

.workflow-card span {
  display: block;
  margin-top: 4px;
  color: #b0b6bf;
  font-weight: 400;
}

.workflow-card::after {
  content: "";
  position: absolute;
  left: 24px;
  right: 24px;
  bottom: 20px;
  height: 6px;
  border-radius: 999px;
  background: #eef1f4;
}

.workflow-card i {
  position: absolute;
  left: 24px;
  bottom: 20px;
  z-index: 1;
  height: 6px;
  border-radius: 999px;
  background: linear-gradient(90deg, #10cbe8, #0967ff);
}

.hub-data-btn,
.hub-import {
  min-height: 44px;
  margin-top: 10px;
  border: 1px solid #e4e9f0;
  color: #172033;
  background: #fff;
  font-size: var(--fs-md);
}

.hub-import input {
  display: none;
}

.cloud-auth-modal {
  position: fixed;
  inset: 0;
  z-index: 3000;
  display: grid;
  place-items: center;
  background: rgba(7, 13, 26, .38);
  backdrop-filter: blur(8px);
}

.cloud-auth-modal.hidden {
  display: none;
  pointer-events: none;
}

.cloud-auth-card {
  width: min(420px, calc(100vw - 32px));
  padding: 28px;
  border-radius: 28px;
  background: #fff;
  box-shadow: 0 28px 70px rgba(8, 21, 46, .28);
}

.cloud-auth-card h2 {
  margin: 0 0 8px;
  font-size: var(--fs-3xl);
}

.cloud-auth-card p {
  margin: 0 0 18px;
  color: #6b7480;
  line-height: 1.6;
}

.cloud-auth-card input {
  width: 100%;
  height: 48px;
  border: 1px solid #dbe6f5;
  border-radius: 16px;
  padding: 0 14px;
  outline: none;
}

.cloud-auth-card button {
  width: 100%;
  height: 48px;
  margin-top: 12px;
  border: 0;
  border-radius: 16px;
  color: #fff;
  background: linear-gradient(135deg, #0967ff, #10cbe8);
  font-weight: 400;
}

.cloud-auth-card .cloud-auth-secondary {
  color: #172033;
  background: #eef4ff;
  border: 1px solid #dbe6f5;
}

.cloud-auth-error {
  min-height: 18px;
  margin-top: 10px;
  color: #ff0a50;
  font-weight: 400;
}

/* 登录前隐藏主应用内容 - 安全措施 */
#mainAppContent {
  display: none;
}

#mainAppContent.authenticated {
  display: contents;
}

@media (max-width: 1280px) {
  .ai-product-shell .app {
    grid-template-columns: 88px 210px minmax(640px, 1fr);
  }

  .efficiency-hub {
    display: none;
  }
}

@media (max-width: 920px) {
  .ai-product-shell .app {
    grid-template-columns: minmax(0, 1fr);
  }

  .ai-product-shell .workspace {
    grid-template-rows: auto minmax(0, 1fr);
  }

  .ai-product-shell .topbar {
    padding: 12px;
  }

  .ai-product-shell #customersPage.active {
    padding: 12px;
  }
}

/* Production interaction polish: keep features, reduce duplicate noise */
.ai-product-shell {
  font-size: var(--fs-md);
}

.ai-product-shell .app {
  grid-template-columns: 116px 204px minmax(720px, 1fr) 380px;
}

.ai-product-shell .rail-item {
  grid-template-columns: 24px minmax(0, 1fr) auto;
  gap: 8px;
  padding: 0 12px;
}

.ai-product-shell .rail-item span {
  width: 22px;
  height: 22px;
  font-size: var(--fs-md);
}

.ai-product-shell .rail-item b {
  min-width: 0;
  overflow: hidden;
  font-size: var(--fs-base);
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ai-product-shell .side-link,
.ai-product-shell .list-toolbar button,
.ai-product-shell .enhanced-filter-row,
.ai-product-shell .pager {
  font-size: var(--fs-base);
}

.ai-product-shell .top-search input {
  height: 50px;
  font-size: var(--fs-md);
}

.ai-product-shell .top-search::before {
  height: 50px;
  font-size: var(--fs-3xl);
}

.ai-product-shell #quickAdd,
.ai-product-shell #topDashboardBtn,
.ai-product-shell #quickContractsBtn,
.ai-product-shell #themeBtn {
  display: none;
}

.ai-product-shell [data-page-shortcut="opportunities"],
.ai-product-shell [data-page-shortcut="follow"],
.ai-product-shell [data-page-shortcut="orders"],
.ai-product-shell [data-page-shortcut="refunds"],
.ai-product-shell [data-page-shortcut="reconcile"],
.ai-product-shell [data-page-shortcut="nearby"],
.ai-product-shell [data-page-shortcut="goals"],
.ai-product-shell [data-page-shortcut="reports"],
.ai-product-shell [data-page-shortcut="questionnaire"] {
  display: none;
}

.ai-product-shell .rail-item[data-page="ai"],
.ai-product-shell .rail-item[data-page="common"],
.ai-product-shell .rail-item[data-page="call"],
.ai-product-shell .rail-item[data-page="office"],
.ai-product-shell .rail-item[data-page="more"],
.ai-product-shell #marketBtn,
.ai-product-shell #callCenterBtn {
  display: none;
}

.ai-product-shell .top-icons {
  gap: 6px;
}

.ai-product-shell .top-icons .upload {
  min-width: 110px;
  font-size: var(--fs-sm);
}

.ai-product-shell .list-toolbar {
  min-height: 42px;
  height: auto;
  flex-wrap: nowrap;
  overflow-x: auto;
  padding: 6px 10px;
}

.ai-product-shell .enhanced-filter-row {
  min-height: 44px;
  flex-wrap: wrap;
  gap: 8px;
  padding: 8px 10px;
}

.ai-product-shell .enhanced-filter-row label,
.ai-product-shell .pager {
  color: #657181;
  font-size: var(--fs-sm);
  font-weight: 400;
}

.ai-product-shell .enhanced-filter-row input,
.ai-product-shell .enhanced-filter-row select {
  height: 30px;
  border-radius: 10px;
  border-color: #dfe8f3;
}

.ai-product-shell .data-table th {
  height: 48px;
  font-size: var(--fs-xs);
  line-height: 1.25;
}

.ai-product-shell .data-table {
  font-size: var(--fs-base);
}

.ai-product-shell .data-table td {
  height: 58px;
  font-size: var(--fs-base);
  line-height: 1.35;
}

.ai-product-shell .name-stack b {
  font-size: var(--fs-base);
  line-height: 1.2;
}

.ai-product-shell .edit-customer-btn {
  height: 28px;
  font-size: var(--fs-sm);
}

.ai-product-shell .insurance-badge {
  min-height: 28px;
  font-size: var(--fs-sm);
}

.ai-product-shell .hub-head h2 {
  font-size: var(--fs-2xl);
}

.ai-product-shell .hub-primary,
.ai-product-shell .hub-secondary {
  min-height: 56px;
  font-size: var(--fs-lg);
}

.ai-product-shell .workflow-card {
  min-height: 94px;
  padding: 20px 22px 16px;
}

.ai-product-shell .workflow-card b {
  font-size: var(--fs-md);
}

.ai-product-shell .workflow-card span,
.ai-product-shell .hub-title {
  font-size: var(--fs-sm);
}

.wide-modal .modal-card {
  width: min(1180px, calc(100vw - 40px));
  max-height: min(900px, calc(100vh - 40px));
  overflow: hidden;
}

.wide-modal .modal-head {
  min-height: 64px;
  padding: 0 22px;
  border-bottom: 1px solid #edf1f6;
}

.wide-modal .modal-head h2 {
  font-size: var(--fs-xl);
  font-weight: 400;
}

.wide-modal .modal-head button,
.wide-modal [data-close="profileDialog"] {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #dce5f2;
  border-radius: 50%;
  color: #1f2937;
  background: #fff;
  font-size: var(--fs-xl);
  font-weight: 400;
  line-height: 1;
  box-shadow: 0 6px 16px rgba(24, 45, 80, .08);
}

.wide-modal .modal-head button:hover,
.wide-modal [data-close="profileDialog"]:hover {
  color: #0967ff;
  border-color: #b9d5ff;
  background: #f7fbff;
}

.profile-grid {
  grid-template-columns: minmax(0, 1.25fr) minmax(360px, .75fr);
  gap: 16px;
  max-height: calc(100vh - 180px);
  overflow: auto;
  padding: 18px;
  background: #f7f9fd;
}

.profile-panel {
  border: 1px solid #e5edf7;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(24, 45, 80, .06);
}

.profile-panel h3 {
  margin: 0;
  padding: 14px 16px;
  border-bottom: 1px solid #edf1f6;
  font-size: var(--fs-md);
  font-weight: 400;
}

.profile-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
  padding: 18px;
  border: 1px solid #dcecff;
  border-radius: 20px;
  background: linear-gradient(135deg, #f8fbff, #eef7ff);
}

.profile-eyebrow {
  color: #0967ff;
  font-size: var(--fs-xs);
  font-weight: 400;
  text-transform: uppercase;
}

.profile-hero h3 {
  margin: 5px 0 4px;
  color: #0d1015;
  font-size: var(--fs-2xl);
  font-weight: 400;
}

.profile-hero p {
  margin: 0;
  color: #657181;
  font-size: var(--fs-base);
  font-weight: 400;
}

.profile-hero-status {
  min-width: 126px;
  padding: 12px 14px;
  border-radius: 16px;
  color: #00a857;
  background: #eafff4;
  text-align: right;
}

.profile-hero-status.is-debt {
  color: #ff0a50;
  background: #fff0f5;
}

.profile-hero-status span {
  display: block;
  font-size: var(--fs-xs);
  font-weight: 400;
}

.profile-hero-status b {
  display: block;
  margin-top: 3px;
  font-size: var(--fs-md);
}

.profile-long-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.profile-section {
  min-width: 0;
  padding: 14px;
  border: 1px solid #edf1f6;
  border-radius: 16px;
  background: #fff;
}

.profile-section h4 {
  margin: 0 0 10px;
  color: #0d1015;
  font-size: var(--fs-md);
  font-weight: 400;
}

.profile-kv {
  display: grid;
  grid-template-columns: 94px minmax(0, 1fr);
  gap: 10px;
  padding: 8px 0;
  border-top: 1px solid #f0f3f7;
}

.profile-kv:first-of-type {
  border-top: 0;
}

.profile-kv span {
  color: #8c96a3;
  font-size: var(--fs-sm);
  font-weight: 400;
}

.profile-kv b {
  min-width: 0;
  color: #111827;
  font-size: var(--fs-base);
  font-weight: 400;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.enhanced-filter-row label:last-child {
  margin-left: auto;
}

.enhanced-filter-row label:last-child input {
  min-width: 160px;
}

.wide-kv {
  grid-template-columns: 1fr;
  gap: 4px;
}

.profile-quick-actions {
  margin-top: 14px;
  padding: 12px;
  border: 1px solid #edf1f6;
  border-radius: 16px;
  background: #fff;
}

.profile-quick-actions button,
.profile-quick-actions label {
  border-radius: 12px;
  font-size: var(--fs-base);
}

.relation-row,
.profile-policy,
.file-row,
.policy-ledger-line {
  border-radius: 14px;
}

@media (max-width: 1100px) {
  .profile-grid,
  .profile-long-grid {
    grid-template-columns: 1fr;
  }
}

/* ====== GP Assurances v2 新增样式 ====== */

/* 侧边栏分组 */
.side-section { margin-bottom: 4px; }
.side-section.status-section, .side-section.module-links { }
.side-title.status-toggle {
  padding: 8px 16px 6px;
  font-size: var(--fs-xs);
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #8a97a8;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
}
.side-link.active { background: rgba(9,103,255,0.12); color: #0967ff; }
.side-link.hot { color: #ff4757; }

/* 页面标签 */
.tab.active { background: #0967ff; color: #fff; }
.tab.danger-tab { border-color: #ff4757; color: #ff4757; }
.tab.danger-tab.active { background: #ff4757; border-color: #ff4757; color: #fff; }

/* 导航 */
.rail-item.active { background: rgba(9,103,255,0.12); color: #0967ff; }

/* 宽模态窗 */
.modal.wide-modal .modal-card { max-width: 900px; }
.modal.import-preview-dialog .modal-card {
  max-width: 1100px;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
}

/* 操作按钮增强 */
.primary.wide { min-width: 160px; }

/* 学生保险字段 */
.student-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 10px;
  padding: 10px;
  background: #f8fafc;
  border-radius: 8px;
  border: 1px dashed #cdd7e3;
}

/* 续保提醒面板 v2 */
.dash-card.span-2 { grid-column: span 2; }
@media (max-width: 900px) {
  .dash-card.span-2 { grid-column: span 1; }
}

.renewal-hero-v2 {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 8px;
  margin-bottom: 12px;
}
@media (max-width: 900px) {
  .renewal-hero-v2 { grid-template-columns: repeat(3, 1fr); }
}

.rh-stat {
  padding: 14px 10px;
  border-radius: 10px;
  text-align: center;
  transition: transform 0.15s;
  cursor: pointer;
}
.rh-stat:hover { transform: translateY(-2px); }
.rh-stat.fire { background: linear-gradient(135deg, #fff5f5, #ffe0e0); border: 1px solid #ffcccc; }
.rh-stat.warn { background: linear-gradient(135deg, #fffbf0, #fff3cd); border: 1px solid #ffeaa7; }
.rh-stat.info { background: linear-gradient(135deg, #f0f7ff, #d6eaff); border: 1px solid #b3d4ff; }
.rh-stat.danger { background: linear-gradient(135deg, #fdf2f8, #fce4ec); border: 1px solid #f8bbd0; }
.rh-stat.cake { background: linear-gradient(135deg, #fff8f0, #ffe8d6); border: 1px solid #ffd4a8; }
.rh-stat.month { background: linear-gradient(135deg, #f5f0ff, #e8deff); border: 1px solid #d4bfff; }
.rh-stat .rh-num { font-size: var(--fs-3xl); font-weight: 400; line-height: 1.2; }
.rh-stat.fire .rh-num { color: #ff4757; }
.rh-stat.warn .rh-num { color: #f59e0b; }
.rh-stat.info .rh-num { color: #0967ff; }
.rh-stat.danger .rh-num { color: #e040fb; }
.rh-stat.cake .rh-num { color: #ff6b35; }
.rh-stat.month .rh-num { color: #7c3aed; }
.rh-stat .rh-label { font-size: var(--fs-xs); color: #6b7d91; margin-top: 4px; }

.renewal-table-shell {
  background: #fff;
  border: 1px solid #e8ecf0;
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 10px;
}
.renewal-table-title {
  padding: 8px 12px;
  font-weight: 400;
  font-size: var(--fs-base);
  color: #3a4a5c;
  border-bottom: 1px solid #e8ecf0;
  background: #fafbfc;
}

.renewal-mini-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--fs-sm);
}
.renewal-mini-table th {
  background: #f0f4f9;
  padding: 6px 8px;
  text-align: left;
  font-weight: 400;
  color: #5a6d80;
}
.renewal-mini-table td { padding: 6px 8px; border-bottom: 1px solid #f0f4f9; }
.renewal-mini-table tr.urgent { background: #fff5f5; }
.renewal-mini-table tr.warning { background: #fffdf5; }
.renewal-mini-table .days-left.urgent b { color: #ff4757; }
.renewal-mini-table .days-left.warning b { color: #f59e0b; }
.renewal-mini-table .show-more {
  text-align: center;
  color: #0967ff;
  cursor: pointer;
  padding: 8px;
  font-weight: 400;
}
.renewal-mini-table .show-more:hover { background: #f0f7ff; }
.renew-action { color: #0967ff; text-decoration: none; font-weight: 400; }
.renew-action:hover { text-decoration: underline; }
.renewal-ok { padding: 16px; text-align: center; color: #22c55e; font-weight: 400; }

/* 生日提醒条 */
.birthday-alert-bar {
  background: #fff;
  border: 1px solid #ffe0b2;
  border-radius: 8px;
  padding: 10px 14px;
  margin-bottom: 8px;
}
.birthday-alert-bar.upcoming-birthdays {
  border-color: #e0d4ff;
  background: #faf8ff;
}
.birthday-alert-title {
  font-size: var(--fs-base);
  font-weight: 400;
  color: #e65100;
  margin-bottom: 6px;
}
.upcoming-birthdays .birthday-alert-title { color: #7c3aed; }
.birthday-alert-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.birthday-tag {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: var(--fs-sm);
  background: #fff3e0;
  color: #e65100;
  cursor: pointer;
  transition: all 0.15s;
}
.birthday-tag:hover { background: #ffe0b2; transform: scale(1.05); }
.upcoming-birthdays .birthday-tag { background: #f3e8ff; color: #7c3aed; }
.upcoming-birthdays .birthday-tag:hover { background: #e9d5ff; }
.renewal-mini-table td {
  padding: 5px 8px;
  border-bottom: 1px solid #f0f3f7;
}
.renewal-mini-table tr.urgent td:first-child {
  border-left: 3px solid #ff4757;
}
.renewal-mini-table tr.warning td:first-child {
  border-left: 3px solid #f59e0b;
}

/* 跟进记录 */
.followup-section { margin-top: 8px; }
.followup-input-row {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}
.followup-input-row input {
  flex: 1;
  padding: 8px 12px;
  border: 1px solid #cdd7e3;
  border-radius: 8px;
  font-size: var(--fs-base);
}
.timeline {
  max-height: 200px;
  overflow-y: auto;
  border: 1px solid #edf1f6;
  border-radius: 10px;
  padding: 8px;
}
.timeline-item {
  padding: 8px 12px;
  border-left: 3px solid #0967ff;
  margin-bottom: 6px;
  background: #f8fafc;
  border-radius: 0 6px 6px 0;
  font-size: var(--fs-base);
}
.timeline-item .tl-time {
  font-size: var(--fs-xs);
  color: #8a97a8;
}
.timeline-item .tl-content {
  margin-top: 2px;
  color: #1c2c44;
}

/* 档案库 */
.document-section { margin-top: 8px; }
.doc-upload-row {
  display: flex;
  gap: 8px;
  align-items: center;
  margin: 8px 0;
}
.doc-upload-row select {
  padding: 6px 10px;
  border: 1px solid #cdd7e3;
  border-radius: 8px;
  font-size: var(--fs-base);
}
.doc-list {
  max-height: 200px;
  overflow-y: auto;
  border: 1px solid #edf1f6;
  border-radius: 10px;
  padding: 4px;
}
.doc-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  border-bottom: 1px solid #f5f7fa;
  font-size: var(--fs-base);
}
.doc-item:last-child { border-bottom: none; }
.doc-icon { font-size: var(--fs-xl); }
.doc-name {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #1c2c44;
}
.doc-meta {
  font-size: var(--fs-xs);
  color: #8a97a8;
  white-space: nowrap;
}
.doc-dl, .doc-del {
  padding: 2px 6px;
  border: none;
  background: none;
  cursor: pointer;
  font-size: var(--fs-md);
  border-radius: 4px;
}
.doc-dl { color: #0967ff; text-decoration: none; }
.doc-dl:hover { background: #e8f0fe; }
.doc-del { color: #ff4757; }
.doc-del:hover { background: #ffe8ea; }

/* 档案库双文件夹 */
.doc-folders {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 8px;
}
.doc-folder {
  border: 1px solid #edf1f6;
  border-radius: 10px;
  overflow: hidden;
}
.doc-folder-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  background: #f8fafc;
  border-bottom: 1px solid #edf1f6;
}
.doc-folder-head h4 {
  font-size: var(--fs-md);
  font-weight: 400;
  color: #1c2c44;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 6px;
}
.doc-folder-head .folder-count {
  font-size: var(--fs-sm);
  color: #8a97a8;
  font-weight: 400;
}
.doc-folder-upload {
  font-size: var(--fs-xs);
  padding: 3px 10px;
  border-radius: 6px;
  border: 1px solid #cdd7e3;
  background: #fff;
  color: #0967ff;
  cursor: pointer;
}
.doc-folder-upload:hover { background: #e8f0fe; }
.doc-folder-body {
  max-height: 180px;
  overflow-y: auto;
  padding: 4px;
}

/* 生日管理 */
.birthday-section { margin-top: 8px; }
.birthday-row {
  display: flex;
  gap: 8px;
  align-items: center;
  margin: 8px 0;
}
.birthday-row input[type="date"] {
  padding: 6px 10px;
  border: 1px solid #cdd7e3;
  border-radius: 8px;
  font-size: var(--fs-base);
}

/* 生日祝福卡片 */
.greeting-preview {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.greeting-card {
  padding: 14px;
  border-radius: 10px;
  border: 2px solid #e8ecf0;
  cursor: pointer;
  transition: all 0.2s;
}
.greeting-card:hover { border-color: #0967ff; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.08); }
.greeting-card.sms-card { background: #f0fff4; border-color: #c6f6d5; }
.greeting-card.email-card { background: #eff6ff; border-color: #bfdbfe; }
.greeting-icon { font-size: var(--fs-4xl); margin-bottom: 4px; }
.greeting-label { font-weight: 400; font-size: var(--fs-md); margin-bottom: 2px; }
.sms-card .greeting-label { color: #16a34a; }
.email-card .greeting-label { color: #2563eb; }
.greeting-detail { font-size: var(--fs-sm); color: #8a97a8; margin-bottom: 8px; }
.greeting-preview-text {
  font-size: var(--fs-sm);
  color: #5a6d80;
  line-height: 1.5;
  background: rgba(255,255,255,0.6);
  padding: 8px;
  border-radius: 6px;
  max-height: 60px;
  overflow: hidden;
}

/* 学生保险证明 */
.modal-card.student-certificate { max-width: 700px; }
.cert-body { padding: 20px; }
.cert-header { text-align: center; margin-bottom: 20px; }
.cert-header h1 { font-size: var(--fs-3xl); color: #1c2c44; margin: 0; }
.cert-header p { color: #5a6d80; margin: 4px 0; }
.cert-subtitle { font-size: var(--fs-lg); font-weight: 400; color: #0967ff; margin-top: 10px; }
.cert-main p { margin: 10px 0; line-height: 1.6; }
.cert-student-name { font-size: var(--fs-2xl); font-weight: 400; color: #1c2c44; margin: 12px 0; }
.cert-school { font-size: var(--fs-xl); color: #3a4a5c; margin: 8px 0; }
.cert-footer { margin-top: 30px; }
.cert-signature { margin-top: 30px; text-align: right; }
.cert-sig-line { border-bottom: 1px solid #1c2c44; width: 200px; margin-left: auto; margin-top: 40px; }

/* Toast */
.toast.hidden { display: none; }

/* 头像 */
.avatar { width: 32px; height: 32px; border-radius: 50%; }
.ai-logo-mark { }

/* ====== 导入预览 ====== */
.import-preview-toolbar {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 10px 0;
  border-bottom: 1px solid #edf1f6;
  flex-wrap: wrap;
}
.preview-stats {
  font-size: var(--fs-base);
  color: #5a6d80;
  margin-right: auto;
}
.preview-stats .st-new { color: #00a86b; font-weight: 400; }
.preview-stats .st-exists { color: #f59e0b; font-weight: 400; }
.preview-stats .st-update { color: #0967ff; font-weight: 400; }
.preview-stats .st-incomplete { color: #f59a23; font-weight: 400; }
.preview-stats .st-dup { color: #e67e22; font-weight: 400; }
.preview-stats .st-err { color: #ff4757; font-weight: 400; }
.preview-stats .st-sel { color: #6c5ce7; font-weight: 400; }
.preview-stats .st-sheet {
  background: #e8f0fe;
  color: #1967d2;
  padding: 1px 6px;
  border-radius: 3px;
  font-size: var(--fs-xs);
  font-weight: 400;
}
/* Source/type badges in preview table */
.source-badge {
  background: #e8f0fe;
  color: #174ea6;
  padding: 1px 5px;
  border-radius: 3px;
  font-size: var(--fs-2xs);
  white-space: nowrap;
}
.type-badge {
  padding: 1px 5px;
  border-radius: 3px;
  font-size: var(--fs-2xs);
  font-weight: 400;
  white-space: nowrap;
}
.type-badge.type-company { background: #d4edda; color: #155724; }
.type-badge.type-personal { background: #fff3cd; color: #856404; }
.row-source-cell { font-size: var(--fs-xs); white-space: nowrap; }
.import-check-all {
  font-size: var(--fs-base);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
}
#importMatchFilter {
  padding: 4px 8px;
  border: 1px solid #cdd7e3;
  border-radius: 6px;
  font-size: var(--fs-base);
}
.import-preview-table-wrap {
  overflow: auto;
  max-height: 55vh;
  margin: 8px 0;
  border: 1px solid #edf1f6;
  border-radius: 8px;
}
.import-preview-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--fs-sm);
  white-space: nowrap;
}
.import-preview-table thead {
  position: sticky;
  top: 0;
  z-index: 1;
}
.import-preview-table th {
  background: #f0f4f9;
  padding: 8px 10px;
  text-align: left;
  font-weight: 400;
  color: #3a4a5c;
  border-bottom: 2px solid #cdd7e3;
}
.import-preview-table td {
  padding: 6px 10px;
  border-bottom: 1px solid #f0f3f7;
}
.import-preview-table tr.row-new td { background: #e6f9f0; }
.import-preview-table tr.row-new:hover td { background: #d4f2e3; }
.import-preview-table tr.row-exists td { background: #fff8e6; }
.import-preview-table tr.row-exists:hover td { background: #fff0cc; }
.import-preview-table tr.row-error td { background: #ffe8ea; }
.import-preview-table tr.row-hidden { display: none; }
.import-preview-table td.row-badge {
  width: 28px;
  text-align: center;
}
.row-badge-new { color: #00a86b; font-weight: 400; }
.row-badge-exists { color: #f59e0b; font-weight: 400; }
.import-progress {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px 0;
}
.import-progress .progress-bar {
  height: 6px;
  background: #edf1f6;
  border-radius: 3px;
  overflow: hidden;
}
.import-progress .progress-fill {
  height: 100%;
  background: #0967ff;
  width: 0%;
  transition: width 0.3s;
}

/* ── New import preview styles (v2) ── */
.preview-stats .st-update { color: #0967ff; font-weight: 400; }
.preview-stats .st-incomplete { color: #f59a23; font-weight: 400; }
.preview-stats .st-dup { color: #e67e22; font-weight: 400; }
.preview-stats .st-sel { color: #4c5a6a; font-weight: 400; }

.import-preview-table tr.row-pending_info td { background: #fff8e1; }
.import-preview-table tr.row-pending_info:hover td { background: #fff3cd; }
.import-preview-table tr.row-duplicate td { background: #fff0e6; }
.import-preview-table tr.row-duplicate:hover td { background: #ffe8d6; }
.import-preview-table tr.row-unparseable td { background: #f0f0f0; color: #999; }
.import-preview-table tr.row-editing td { background: #e8f4ff !important; }

.row-status-cell { white-space: nowrap; font-size: var(--fs-xs); font-weight: 400; }
.row-name-cell { white-space: nowrap; }
.row-missing-cell { font-size: var(--fs-2xs); color: #e67e22; max-width: 120px; overflow: hidden; text-overflow: ellipsis; }
.row-match-cell { font-size: var(--fs-xs); max-width: 120px; overflow: hidden; text-overflow: ellipsis; }
.row-actions-cell { white-space: nowrap; }

.match-info-update { color: #0967ff; font-weight: 400; }
.match-info-dup { color: #e67e22; font-weight: 400; }

/* Inline edit inputs */
.inline-edit-input {
  padding: 2px 4px;
  border: 1px solid #b9daf9;
  border-radius: 3px;
  font-size: var(--fs-xs);
  background: #fff;
  color: #334;
}
.inline-edit-input:focus { outline: none; border-color: #0967ff; box-shadow: 0 0 0 2px rgba(9,103,255,.12); }

/* Mini buttons in table */
.mini-btn {
  padding: 1px 5px;
  border: 1px solid #d0d7de;
  border-radius: 3px;
  background: #fff;
  font-size: var(--fs-xs);
  cursor: pointer;
  color: #4c5a6a;
}
.mini-btn:hover { border-color: #0967ff; color: #0967ff; }
.mini-select { border: 1px solid #d0d7de; border-radius: 3px; background: #fff; font-size: var(--fs-xs); }

/* Import confirmation dialog stats */
.import-confirm-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 8px 14px;
  border-radius: 6px;
  background: #f8f9fb;
  min-width: 60px;
}
.import-confirm-stat span { font-size: var(--fs-xs); }
.import-confirm-stat b { font-size: var(--fs-2xl); }

/* Result stat — incomplete */
.result-incomplete { text-align: center; }
.result-incomplete b { display: block; font-size: var(--fs-xs); color: #f59a23; }
.result-incomplete span { color: #f59a23; font-weight: 400; }

.result-action-btn { transition: all .12s; }
.result-action-btn:hover { opacity: .85; }

/* ── Req 4: Missing field tags ── */
.missing-tag {
  display: inline-block;
  padding: 1px 5px;
  margin: 1px 2px;
  border-radius: 3px;
  background: #fff3e0;
  color: #e65100;
  font-size: var(--fs-2xs);
  font-weight: 400;
  white-space: nowrap;
}

/* ── Req 2: Pending info / incomplete badge ── */
.row-badge-incomplete { color: #f59a23; font-weight: 400; }

/* ── Req 6: Inline edit panel ── */
.inline-edit-row td { padding: 0 !important; }
.inline-edit-panel {
  padding: 12px 16px;
  background: #e8f4ff;
  border: 2px solid #0967ff;
  border-radius: 6px;
  margin: 4px 0;
}
.inline-edit-title {
  font-size: var(--fs-base);
  font-weight: 400;
  color: #1a3a6b;
  margin-bottom: 10px;
}
.inline-edit-fields {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.edit-field-label {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: var(--fs-xs);
  color: #5a6d80;
}
.edit-field-label span { font-weight: 400; }
.edit-field-input {
  padding: 4px 8px;
  border: 1px solid #b9daf9;
  border-radius: 3px;
  font-size: var(--fs-sm);
  min-width: 100px;
}
.edit-field-input:focus { outline: none; border-color: #0967ff; box-shadow: 0 0 0 2px rgba(9,103,255,.12); }
.inline-edit-actions {
  margin-top: 10px;
  display: flex;
  gap: 8px;
}
.inline-edit-actions .primary { background: #0967ff; color: #fff; border: none; }

/* ── Req 8: Import result pending stat ── */
.result-pending { text-align: center; }
.result-pending b { display: block; font-size: var(--fs-xs); color: #f59a23; }
.result-pending span { color: #f59a23; font-weight: 400; }

/* ── Req 5: Preview stats items ── */
.ps-item {
  display: inline-block;
  font-size: var(--fs-sm);
  white-space: nowrap;
  margin-right: 8px;
}
.ps-item b { margin-left: 2px; }

/* ── Req 11: Toolbar button centering fix ── */
.list-toolbar button,
.toolbar-dropdown-btn,
.toolbar-btn,
.toolbar-btn-export-all {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 30px !important;
  line-height: 1 !important;
  padding: 0 10px !important;
  white-space: nowrap !important;
  vertical-align: middle !important;
  gap: 4px;
}
#customerToolbar {
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
#customerToolbar .toolbar-group {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}
@media (max-width: 900px) {
  #customerToolbar {
    flex-wrap: nowrap;
    overflow-x: auto;
  }
  #customerToolbar .toolbar-group {
    flex-shrink: 0;
  }
}

/* Production fixes: wider ledger workspace and usable policy/customer rows */
.ai-product-shell.wide-workspace .app {
  grid-template-columns: 116px 204px minmax(0, 1fr);
}

.ai-product-shell.wide-workspace .efficiency-hub {
  display: none;
}

.ai-product-shell.wide-workspace #productsPage.active,
.ai-product-shell.wide-workspace #contractsPage.active {
  grid-template-rows: auto auto minmax(0, 1fr);
  padding: 22px 28px;
  overflow: hidden;
}

.ai-product-shell.wide-workspace .table-shell {
  min-width: 0;
  border: 1px solid #e6edf6;
  border-radius: 12px;
  box-shadow: 0 16px 35px rgba(25, 64, 116, .08);
}

.ai-product-shell.wide-workspace #productsPage .data-table {
  min-width: 980px;
  table-layout: fixed;
}

.ai-product-shell.wide-workspace #contractsPage .data-table {
  min-width: 1500px;
  table-layout: fixed;
}

.ai-product-shell.wide-workspace #contractsPage .data-table th:nth-child(1),
.ai-product-shell.wide-workspace #contractsPage .data-table td:nth-child(1) { width: 100px; }
.ai-product-shell.wide-workspace #contractsPage .data-table th:nth-child(2),
.ai-product-shell.wide-workspace #contractsPage .data-table td:nth-child(2) { width: 110px; }
.ai-product-shell.wide-workspace #contractsPage .data-table th:nth-child(3),
.ai-product-shell.wide-workspace #contractsPage .data-table td:nth-child(3) { width: 120px; }
.ai-product-shell.wide-workspace #contractsPage .data-table th:nth-child(4),
.ai-product-shell.wide-workspace #contractsPage .data-table td:nth-child(4) { width: 140px; }
.ai-product-shell.wide-workspace #contractsPage .data-table th:nth-child(5),
.ai-product-shell.wide-workspace #contractsPage .data-table td:nth-child(5) { width: 190px; }
.ai-product-shell.wide-workspace #contractsPage .data-table th:nth-child(6),
.ai-product-shell.wide-workspace #contractsPage .data-table td:nth-child(6) { width: 92px; }
.ai-product-shell.wide-workspace #contractsPage .data-table th:nth-child(7),
.ai-product-shell.wide-workspace #contractsPage .data-table td:nth-child(7) { width: 82px; }
.ai-product-shell.wide-workspace #contractsPage .data-table th:nth-child(8),
.ai-product-shell.wide-workspace #contractsPage .data-table td:nth-child(8) { width: 100px; }
.ai-product-shell.wide-workspace #contractsPage .data-table th:nth-child(9),
.ai-product-shell.wide-workspace #contractsPage .data-table td:nth-child(9) { width: 116px; }
.ai-product-shell.wide-workspace #contractsPage .data-table th:nth-child(10),
.ai-product-shell.wide-workspace #contractsPage .data-table td:nth-child(10) { width: 84px; }
.ai-product-shell.wide-workspace #contractsPage .data-table th:nth-child(11),
.ai-product-shell.wide-workspace #contractsPage .data-table td:nth-child(11) { width: 150px; }

.ai-product-shell.wide-workspace #productsPage .data-table th:last-child,
.ai-product-shell.wide-workspace #productsPage .data-table td:last-child,
.ai-product-shell.wide-workspace #contractsPage .data-table th:last-child,
.ai-product-shell.wide-workspace #contractsPage .data-table td:last-child {
  position: sticky;
  right: 0;
  z-index: 3;
  width: 138px;
  background: #fff;
  box-shadow: -10px 0 18px rgba(31, 56, 88, .06);
}

.ai-product-shell.wide-workspace #productsPage .data-table th:last-child,
.ai-product-shell.wide-workspace #contractsPage .data-table th:last-child {
  z-index: 4;
  background: #f9fbfd;
}

.ai-product-shell.wide-workspace .client-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  margin: 2px 3px 2px 0;
  border-radius: 8px;
  padding: 0 9px;
  background: #eef6ff;
  color: #0967ff;
  white-space: nowrap;
}

.policy-icon-row {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 6px;
  vertical-align: middle;
}

.insurance-icon-only {
  width: 24px;
  height: 24px;
  display: inline-grid;
  place-items: center;
  border: 1px solid #d9e6f5;
  border-radius: 8px;
  background: #f7fbff;
  color: #286bbd;
}

.insurance-icon-only svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.insurance-icon-only .bi {
  font-size: var(--fs-md);
  line-height: 1;
}

.policy-icon-more {
  min-width: 24px;
  height: 24px;
  display: inline-grid;
  place-items: center;
  border-radius: 8px;
  background: #edf1f7;
  color: #657181;
  font-size: var(--fs-xs);
  font-weight: 400;
}

.type-auto.insurance-icon-only { color: #2e74d8; background: #eff6ff; }
.type-home.insurance-icon-only { color: #24964a; background: #f0fff5; }
.type-health.insurance-icon-only { color: #1390c5; background: #effaff; }
.type-accident.insurance-icon-only { color: #d1800d; background: #fff8ec; }
.type-life.insurance-icon-only { color: #cf4660; background: #fff3f6; }
.type-pension.insurance-icon-only { color: #7056ca; background: #f6f1ff; }
.type-saving.insurance-icon-only { color: #a87300; background: #fff9e8; }
.type-group.insurance-icon-only { color: #607d99; background: #f4f8fc; }

.policy-row-actions,
.profile-policy-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.profile-policy-grid {
  display: grid;
  gap: 8px;
  max-height: 520px;
  overflow: auto;
  padding: 10px;
}

.profile-policy-row {
  display: grid;
  grid-template-columns: 34px minmax(112px, .75fr) minmax(180px, 1.25fr) minmax(110px, .8fr) 92px 128px minmax(132px, .9fr) 112px;
  gap: 9px;
  align-items: center;
  border: 1px solid #e7edf5;
  border-radius: 10px;
  padding: 10px;
  background: #fbfdff;
}

.profile-policy-row small {
  display: block;
  margin-bottom: 3px;
  color: #8793a2;
  font-size: var(--fs-xs);
  font-weight: 400;
}

.profile-policy-row b,
.profile-policy-row span {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: var(--fs-sm);
  line-height: 1.35;
}

.profile-policy-row b {
  color: #17202a;
  font-size: var(--fs-base);
}

.modal.wide-modal .modal-card {
  width: min(1180px, calc(100vw - 48px));
  max-width: 1180px;
}

.wide-modal .profile-two-col {
  grid-template-columns: minmax(0, 1fr) 300px;
}

.wide-modal .profile-col-right {
  top: 12px;
}

.profile-policy-actions button,
.policy-row-actions .mini-action {
  min-height: 28px;
  border: 1px solid #d9e6f5;
  border-radius: 8px;
  padding: 0 10px;
  background: #fff;
  color: #0967ff;
  font-weight: 400;
  cursor: pointer;
}

.policy-bad-text {
  color: #e11d48 !important;
}

#policyDebtReason {
  min-height: 72px;
  resize: vertical;
}

@media (max-width: 1180px) {
  .profile-policy-row {
    grid-template-columns: 30px minmax(0, 1fr) minmax(0, 1.4fr);
  }
  .profile-policy-actions {
    grid-column: 2 / -1;
  }
}

/* PROD usability pass: keep every primary action visible */
.ai-product-shell .app {
  grid-template-columns: 116px 204px minmax(0, 1fr) !important;
}

.ai-product-shell .efficiency-hub {
  display: none !important;
}

.ai-product-shell .workspace {
  min-width: 0;
}

.ai-product-shell #customersPage.active,
.ai-product-shell #dashboardPage.active {
  padding-right: 28px;
}

.ai-product-shell #customersPage .table-shell {
  border: 1px solid #e6edf6;
  border-radius: 12px;
  box-shadow: 0 16px 35px rgba(25, 64, 116, .08);
}

/* Req 6: Customer table — fixed layout, explicit column widths via data-col (prevents squeeze to viewport) */
.ai-product-shell #customersPage .data-table {
  table-layout: fixed;
  width: auto;
  min-width: 7000px;
}

/* Req 6: Use data-col attributes for widths; nth-child fallbacks removed in favor of data-col rules below */

.ai-product-shell #customersPage .data-table th:last-child,
.ai-product-shell #customersPage .data-table td:last-child {
  position: sticky;
  right: 0;
  z-index: 3;
  width: 154px;
  background: #fff;
  box-shadow: -10px 0 18px rgba(31, 56, 88, .06);
}

.ai-product-shell #customersPage .data-table th:last-child {
  z-index: 4;
  background: #f9fbfd;
}

.row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
}

.row-actions button {
  min-height: 26px;
  border: 1px solid #d9e6f5;
  border-radius: 8px;
  padding: 0 8px;
  background: #eef6ff;
  color: #0967ff;
  font-size: var(--fs-sm);
  font-weight: 400;
  cursor: pointer;
}

#profileInfo {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

#profileInfo .profile-hero { order: 1; }
#profileInfo .profile-quick-actions {
  order: 2;
  position: sticky;
  top: 0;
  z-index: 8;
  margin-top: 0;
  border: 1px solid #dbe8f7;
  border-radius: 12px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 10px 24px rgba(25, 64, 116, .08);
}
#profileInfo #profileCardStatus { order: 3; }
#profileInfo #profileCardSupplement { order: 4; }
#profileInfo #profileCardGaranties { order: 5; }
#profileInfo #profileCardAnnualContracts { order: 6; }
#profileInfo #profileCardAllPolicies { order: 7; }
#profileInfo .profile-long-grid { order: 8; }
#profileInfo > .profile-panel { order: 9; }

.profile-quick-actions button,
.profile-quick-actions select {
  min-height: 32px;
}

.ai-product-shell #contractsPage .data-table td {
  overflow: hidden;
  overflow-wrap: anywhere;
  white-space: normal;
}

.ai-product-shell #contractsPage .data-table .client-link {
  max-width: 100%;
  white-space: normal;
  text-align: left;
  line-height: 1.2;
}

.ai-product-shell #contractsPage .data-table th:nth-child(3),
.ai-product-shell #contractsPage .data-table td:nth-child(3) { width: 150px; }
.ai-product-shell #contractsPage .data-table th:nth-child(4),
.ai-product-shell #contractsPage .data-table td:nth-child(4) { width: 170px; }
.ai-product-shell #contractsPage .data-table th:nth-child(5),
.ai-product-shell #contractsPage .data-table td:nth-child(5) { width: 230px; }

.ai-product-shell #contractsPage .data-table th:last-child,
.ai-product-shell #contractsPage .data-table td:last-child,
.ai-product-shell #customersPage .data-table th:last-child,
.ai-product-shell #customersPage .data-table td:last-child {
  overflow: visible;
}

.ai-product-shell #contractsPage .data-table {
  width: 100%;
  table-layout: auto;
}
.ai-product-shell #contractsPage .data-table th:nth-child(1),
.ai-product-shell #contractsPage .data-table td:nth-child(1) { width: 12%; }
.ai-product-shell #contractsPage .data-table th:nth-child(2),
.ai-product-shell #contractsPage .data-table td:nth-child(2) { width: 11%; }
.ai-product-shell #contractsPage .data-table th:nth-child(3),
.ai-product-shell #contractsPage .data-table td:nth-child(3) { width: 14%; }
.ai-product-shell #contractsPage .data-table th:nth-child(4),
.ai-product-shell #contractsPage .data-table td:nth-child(4) { width: 20%; }
.ai-product-shell #contractsPage .data-table th:nth-child(5),
.ai-product-shell #contractsPage .data-table td:nth-child(5) { width: 11%; }
.ai-product-shell #contractsPage .data-table th:nth-child(6),
.ai-product-shell #contractsPage .data-table td:nth-child(6) { width: 18%; }
.ai-product-shell #contractsPage .data-table th:nth-child(7),
.ai-product-shell #contractsPage .data-table td:nth-child(7) { width: 14%; }

.policy-year {
  display: block;
  margin-top: 5px;
  color: #8a97a8;
  font-size: var(--fs-xs);
  font-weight: 400;
}

.policy-product-cell b,
.policy-product-cell span {
  display: block;
}

.policy-actions {
  white-space: nowrap;
  text-align: center;
  vertical-align: middle;
}

.policy-actions .client-link {
  display: inline-block;
  padding: 0 2px !important;
  font-size: var(--fs-2xs);
  line-height: 20px;
  border-radius: 3px;
  white-space: nowrap;
  height: 20px;
}

/* Responsive operations workspace */
.ai-product-shell {
  --ops-blue: #0b63f6;
  --ops-cyan: #08b8d4;
  --ops-ink: #101828;
  --ops-muted: #667085;
  --ops-line: #dfe7f2;
  --ops-soft: #f5f8fc;
  --ops-danger: #d92d50;
  --ops-success: #079455;
}

.ai-product-shell .app {
  grid-template-columns: 108px 204px minmax(0, 1fr) !important;
}

.ai-product-shell .rail-item[data-page="ai"] {
  display: grid;
}

.ai-product-shell .rail-item[data-page="stats"] {
  display: none !important;
}

.ai-product-shell .rail-item:hover,
.ai-product-shell .rail-item.active,
.ai-product-shell .tab.active,
.ai-product-shell .list-toolbar .ai-btn,
.ai-product-shell .blue-action,
.ai-product-shell .primary {
  background: var(--ops-blue);
  box-shadow: none;
}

.ai-product-shell .rail-item:hover,
.ai-product-shell .rail-item.active {
  color: #fff;
}

.ai-product-shell .rail-item:hover span,
.ai-product-shell .rail-item:hover b,
.ai-product-shell .rail-item.active span,
.ai-product-shell .rail-item.active b {
  color: inherit;
}

.ai-product-shell .floating-actions {
  display: none !important;
}

.ai-product-shell .table-shell,
.ai-product-shell .list-toolbar,
.ai-product-shell .enhanced-filter-row,
.ai-product-shell .pager {
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(16, 24, 40, .06);
}

.ai-product-shell #dashboardPage.active,
.ai-product-shell #aiPage.active {
  display: block;
  min-height: 0;
  overflow: auto;
  padding: 28px;
  background: #f5f7fb;
}

.ops-dashboard,
.ai-workspace-page {
  width: min(1320px, 100%);
  margin: 0 auto;
}

.ops-dashboard-head,
.ai-workspace-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  padding: 4px 0 22px;
}

.ops-kicker {
  display: block;
  margin-bottom: 7px;
  color: var(--ops-blue);
  font-size: var(--fs-xs);
  font-weight: 400;
  text-transform: uppercase;
}

.ops-dashboard-head h1,
.ai-workspace-head h1 {
  margin: 0;
  color: var(--ops-ink);
  font-size: var(--fs-4xl);
  line-height: 1.2;
  font-weight: 400;
}

.ops-dashboard-head p,
.ai-workspace-head p {
  margin: 8px 0 0;
  color: var(--ops-muted);
  font-size: var(--fs-md);
  line-height: 1.6;
}

.ops-head-actions,
.ai-composer > div,
.ai-result-head,
.ops-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.primary-action,
.secondary-action,
.ops-panel-head button,
.ai-result-head button,
.ai-next-actions button {
  min-height: 38px;
  border: 1px solid var(--ops-line);
  border-radius: 7px;
  padding: 0 14px;
  background: #fff;
  color: var(--ops-ink);
  font-weight: 400;
}

.primary-action {
  border-color: var(--ops-blue);
  color: #fff;
  background: var(--ops-blue);
}

.ops-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--ops-line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(16, 24, 40, .05);
}

.ops-metrics button {
  min-width: 0;
  min-height: 116px;
  display: grid;
  align-content: center;
  gap: 5px;
  border: 0;
  border-right: 1px solid var(--ops-line);
  padding: 20px 24px;
  color: var(--ops-ink);
  background: transparent;
  text-align: left;
}

.ops-metrics button:last-child {
  border-right: 0;
}

.ops-metrics button:hover {
  background: #f8fbff;
}

.ops-metrics span,
.ops-panel-head span,
.ai-tool-title span,
.ai-result-head span,
.ai-context-title span {
  color: var(--ops-muted);
  font-size: var(--fs-sm);
  font-weight: 400;
}

.ops-metrics b {
  font-size: var(--fs-4xl);
  line-height: 1.1;
  font-weight: 400;
}

.ops-metrics small {
  color: #98a2b3;
  font-size: var(--fs-xs);
}

.ops-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr);
  align-items: start;
  gap: 16px;
  margin-top: 16px;
}

.ops-panel,
.ai-tool-panel,
.ai-context-panel,
.ai-result-panel {
  min-width: 0;
  border: 1px solid var(--ops-line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(16, 24, 40, .05);
}

.ops-panel {
  min-height: 0;
  padding: 20px;
}

.ops-ai-panel {
  min-height: 0;
}

.ops-panel-head {
  align-items: flex-start;
  padding-bottom: 16px;
  border-bottom: 1px solid #edf1f6;
}

.ops-panel-head h2,
.ai-tool-title h2,
.ai-result-head h2 {
  margin: 4px 0 0;
  color: var(--ops-ink);
  font-size: var(--fs-xl);
  line-height: 1.25;
}

.ops-panel-head button {
  min-height: 32px;
  padding: 0 10px;
  color: var(--ops-blue);
}

.ops-ai-brief,
.ops-list,
.ai-plan-list,
.ai-result-list {
  display: grid;
  gap: 0;
}

.ops-ai-brief button,
.ops-list button,
.ai-plan-list button {
  width: 100%;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border: 0;
  border-bottom: 1px solid #edf1f6;
  padding: 15px 2px;
  color: var(--ops-ink);
  background: transparent;
  text-align: left;
}

.ops-ai-brief button:hover,
.ops-list button:hover,
.ai-plan-list button:hover {
  background: #f8fbff;
}

.ops-ai-brief button:last-child,
.ops-list button:last-child,
.ai-plan-list button:last-child {
  border-bottom: 0;
}

.ops-ai-brief button {
  display: grid;
  justify-content: stretch;
  gap: 5px;
}

.ops-ai-brief b,
.ops-list b,
.ai-plan-list b {
  color: var(--ops-ink);
  font-size: var(--fs-md);
}

.ops-ai-brief span,
.ops-list small,
.ai-plan-list span {
  min-width: 0;
  color: var(--ops-muted);
  font-size: var(--fs-sm);
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.ops-list button > span {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.ops-list strong {
  flex: 0 0 auto;
  color: var(--ops-blue);
  font-size: var(--fs-base);
}

.ops-list strong.is-urgent,
.ops-list strong.is-debt {
  color: var(--ops-danger);
}

.ops-prompt-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid #edf1f6;
}

.ops-prompt-row button {
  min-height: 32px;
  border: 1px solid #cfe0f7;
  border-radius: 7px;
  padding: 0 11px;
  color: var(--ops-blue);
  background: #f4f8ff;
  font-weight: 400;
}

.ops-empty {
  padding: 28px 4px;
  color: #98a2b3;
  text-align: center;
}

.ai-workspace-head {
  align-items: center;
}

.ai-workspace-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 16px;
}

.ai-tool-panel,
.ai-context-panel,
.ai-result-panel {
  padding: 22px;
}

.ai-tool-title,
.ai-context-title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.ai-local-badge {
  flex: 0 0 auto;
  border: 1px solid #a6f4c5;
  border-radius: 999px;
  padding: 6px 9px;
  color: var(--ops-success) !important;
  background: #ecfdf3;
}

.ai-composer {
  margin-top: 18px;
  border: 1px solid #cfdbea;
  border-radius: 8px;
  background: #fbfdff;
}

.ai-composer textarea {
  width: 100%;
  min-height: 116px;
  border: 0;
  padding: 16px;
  color: var(--ops-ink);
  background: transparent;
  outline: none;
  resize: vertical;
  line-height: 1.6;
}

.ai-composer > div {
  border-top: 1px solid #e4eaf2;
  padding: 10px 12px;
}

.ai-composer > div > span {
  color: #98a2b3;
  font-size: var(--fs-xs);
}

.ai-quick-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin-top: 14px;
}

.ai-quick-grid button {
  min-width: 0;
  min-height: 86px;
  display: grid;
  align-content: center;
  gap: 5px;
  border: 1px solid var(--ops-line);
  border-radius: 7px;
  padding: 12px;
  color: var(--ops-ink);
  background: #fff;
  text-align: left;
}

.ai-quick-grid button:hover {
  border-color: #9fc3f7;
  background: #f5f9ff;
}

.ai-quick-grid b {
  font-size: var(--fs-base);
}

.ai-quick-grid span {
  color: var(--ops-muted);
  font-size: var(--fs-xs);
  line-height: 1.4;
}

.ai-context-title {
  display: grid;
  gap: 3px;
}

.ai-context-title b {
  font-size: var(--fs-xl);
}

.ai-context-metrics {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-top: 18px;
  border: 1px solid var(--ops-line);
  border-radius: 7px;
}

.ai-context-metrics div {
  display: grid;
  gap: 4px;
  border-right: 1px solid var(--ops-line);
  border-bottom: 1px solid var(--ops-line);
  padding: 14px;
}

.ai-context-metrics div:nth-child(2n) {
  border-right: 0;
}

.ai-context-metrics div:nth-last-child(-n + 2) {
  border-bottom: 0;
}

.ai-context-metrics span {
  color: var(--ops-muted);
  font-size: var(--fs-xs);
}

.ai-context-metrics b {
  color: var(--ops-ink);
  font-size: var(--fs-2xl);
}

.ai-context-panel > p {
  margin: 18px 0 0;
  color: var(--ops-muted);
  font-size: var(--fs-sm);
  line-height: 1.7;
}

.ai-result-panel {
  grid-column: 1 / -1;
  min-height: 300px;
}

.ai-result-head {
  align-items: flex-start;
  padding-bottom: 16px;
  border-bottom: 1px solid #edf1f6;
}

.ai-result-body {
  padding-top: 4px;
}

.ai-answer-summary {
  display: grid;
  gap: 6px;
  margin: 14px 0 4px;
  border-left: 3px solid var(--ops-cyan);
  padding: 10px 14px;
  background: #f5fbfd;
}

.ai-answer-summary b {
  color: var(--ops-ink);
  font-size: var(--fs-md);
}

.ai-answer-summary span {
  color: var(--ops-muted);
  line-height: 1.6;
}

.ai-result-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 170px auto;
  gap: 14px;
  align-items: center;
  border-bottom: 1px solid #edf1f6;
  padding: 13px 2px;
}

.ai-result-row > div {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.ai-result-row > div:nth-child(2) {
  text-align: right;
}

.ai-result-row b {
  color: var(--ops-ink);
  overflow-wrap: anywhere;
}

.ai-result-row span {
  color: var(--ops-muted);
  font-size: var(--fs-sm);
  overflow-wrap: anywhere;
}

.ai-result-row.urgent > div:nth-child(2) b,
.ai-result-row.debt > div:nth-child(2) b {
  color: var(--ops-danger);
}

.ai-result-row button {
  min-height: 30px;
  border: 1px solid #cfe0f7;
  border-radius: 6px;
  padding: 0 9px;
  color: var(--ops-blue);
  background: #f4f8ff;
  font-weight: 400;
}

.ai-next-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}

.ai-message-draft {
  margin-top: 16px;
  border: 1px solid var(--ops-line);
  border-radius: 8px;
  padding: 18px;
  background: #fbfdff;
}

.ai-message-draft span {
  color: var(--ops-muted);
  font-size: var(--fs-xs);
}

.ai-message-draft p {
  margin: 10px 0 0;
  color: var(--ops-ink);
  font-size: var(--fs-md);
  line-height: 1.8;
}

.mobile-navigation {
  display: none;
}

@media (max-width: 1199px) and (min-width: 768px) {
  .ai-product-shell .app {
    grid-template-columns: 84px minmax(0, 1fr) !important;
  }

  .ai-product-shell .list-sidebar {
    display: none !important;
  }

  .ai-product-shell .icon-rail {
    width: 84px;
  }

  .ai-product-shell .user-head {
    height: 92px;
    display: grid;
    grid-template-columns: 1fr;
    justify-items: center;
    padding: 0;
  }

  .ai-product-shell .rail-nav {
    gap: 8px;
    padding: 16px 8px;
  }

  .ai-product-shell .rail-item {
    height: 58px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    border-radius: 7px;
    padding: 0 4px;
  }

  .ai-product-shell .rail-item b {
    font-size: var(--fs-xs);
  }

  .ai-product-shell .rail-item:hover,
  .ai-product-shell .rail-item.active {
    box-shadow: inset 3px 0 0 var(--ops-blue);
  }

  .ai-product-shell .topbar {
    min-width: 0;
    padding: 0 20px;
  }

  .ai-product-shell .top-search input {
    width: min(480px, 58vw);
  }

  .ai-product-shell .top-icons .upload {
    display: none;
  }

  .ai-product-shell #customersPage.active,
  .ai-product-shell #productsPage.active,
  .ai-product-shell #contractsPage.active,
  .ai-product-shell #dashboardPage.active,
  .ai-product-shell #aiPage.active {
    padding: 18px !important;
  }

  .ai-product-shell #customersPage .data-table {
    min-width: 1320px;
  }

  .ops-dashboard-grid {
    grid-template-columns: 1fr 1fr;
  }

  .ops-ai-panel {
    grid-column: 1 / -1;
  }

  .ai-quick-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  body.ai-product-shell {
    width: 100%;
    min-width: 0;
    height: 100dvh;
    overflow: hidden;
  }

  .ai-product-shell .app {
    width: 100%;
    height: 100dvh;
    display: block;
  }

  .ai-product-shell .icon-rail,
  .ai-product-shell .list-sidebar,
  .ai-product-shell .efficiency-hub,
  .ai-product-shell .floating-actions {
    display: none !important;
  }

  .ai-product-shell .workspace {
    width: 100%;
    height: 100dvh;
    grid-template-rows: 62px minmax(0, 1fr);
    padding-bottom: 62px;
  }

  .ai-product-shell .topbar {
    min-width: 0;
    gap: 8px;
    padding: 8px 10px;
  }

  .ai-product-shell .top-search {
    min-width: 0;
    width: 100%;
  }

  .ai-product-shell .top-search::before {
    width: 38px;
    height: 44px;
    border-radius: 8px 0 0 8px;
    font-size: var(--fs-xl);
    box-shadow: none;
  }

  .ai-product-shell .top-search input {
    min-width: 0;
    width: 100%;
    height: 44px;
    border-radius: 0 8px 8px 0;
    padding: 0 10px;
    font-size: var(--fs-base);
    box-shadow: none;
  }

  .ai-product-shell .top-link,
  .ai-product-shell .top-icons {
    display: none;
  }

  .ai-product-shell .page.active {
    min-width: 0;
    max-width: 100%;
  }

  .ai-product-shell #customersPage.active,
  .ai-product-shell #productsPage.active,
  .ai-product-shell #contractsPage.active {
    max-height: 100%;
    gap: 8px;
    padding: 10px !important;
    overflow: hidden;
  }

  .ai-product-shell #productsPage.active,
  .ai-product-shell #contractsPage.active {
    grid-template-rows: auto auto minmax(0, 1fr);
  }

  .ai-product-shell #dashboardPage.active,
  .ai-product-shell #aiPage.active {
    padding: 14px 12px 22px !important;
  }

  .ai-product-shell .tabs,
  .ai-product-shell .list-toolbar,
  .ai-product-shell .enhanced-filter-row,
  .ai-product-shell .pager {
    max-width: 100%;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
  }

  .ai-product-shell .tabs::-webkit-scrollbar,
  .ai-product-shell .list-toolbar::-webkit-scrollbar,
  .ai-product-shell .enhanced-filter-row::-webkit-scrollbar,
  .ai-product-shell .pager::-webkit-scrollbar {
    display: none;
  }

  .ai-product-shell .tab,
  .ai-product-shell .list-toolbar button,
  .ai-product-shell .enhanced-filter-row > *,
  .ai-product-shell .pager > * {
    flex: 0 0 auto;
  }

  .ai-product-shell .tabs {
    min-height: 40px;
    gap: 6px;
  }

  .ai-product-shell .tab {
    height: 34px;
    border-radius: 7px;
    padding: 0 11px;
    font-size: var(--fs-sm);
  }

  .ai-product-shell .list-toolbar,
  .ai-product-shell .enhanced-filter-row {
    min-height: 42px;
    padding: 6px;
  }

  .ai-product-shell .list-toolbar .toolbar-spacer {
    display: none;
  }

  .ai-product-shell .table-shell {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: auto;
  }

  .ai-product-shell #customersPage .data-table {
    min-width: 820px !important;
  }

  .ai-product-shell #customersPage th:nth-child(1),
  .ai-product-shell #customersPage td:nth-child(1),
  .ai-product-shell #customersPage th:nth-child(4),
  .ai-product-shell #customersPage td:nth-child(4),
  .ai-product-shell #customersPage th:nth-child(6),
  .ai-product-shell #customersPage td:nth-child(6),
  .ai-product-shell #customersPage th:nth-child(9),
  .ai-product-shell #customersPage td:nth-child(9),
  .ai-product-shell #customersPage th:nth-child(11),
  .ai-product-shell #customersPage td:nth-child(11),
  .ai-product-shell #customersPage th:nth-child(12),
  .ai-product-shell #customersPage td:nth-child(12),
  .ai-product-shell #customersPage th:nth-child(13),
  .ai-product-shell #customersPage td:nth-child(13),
  .ai-product-shell #customersPage th:nth-child(14),
  .ai-product-shell #customersPage td:nth-child(14),
  .ai-product-shell #customersPage th:nth-child(15),
  .ai-product-shell #customersPage td:nth-child(15) {
    display: none;
  }

  .ai-product-shell #productsPage .data-table {
    min-width: 760px !important;
  }

  .ai-product-shell #contractsPage .data-table {
    min-width: 940px !important;
  }

  .ai-product-shell .data-table th {
    height: 42px;
  }

  .ai-product-shell .data-table td {
    height: 54px;
  }

  .ai-product-shell .pager {
    min-height: 40px;
    padding: 5px 7px;
  }

  .ops-dashboard-head,
  .ai-workspace-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 14px;
    padding-bottom: 16px;
  }

  .ops-dashboard-head h1,
  .ai-workspace-head h1 {
    font-size: var(--fs-3xl);
  }

  .ops-head-actions {
    width: 100%;
  }

  .ops-head-actions button {
    flex: 1;
  }

  .ops-metrics {
    grid-template-columns: 1fr 1fr;
  }

  .ops-metrics button {
    min-height: 94px;
    border-right: 1px solid var(--ops-line);
    border-bottom: 1px solid var(--ops-line);
    padding: 14px;
  }

  .ops-metrics button:nth-child(2n) {
    border-right: 0;
  }

  .ops-metrics button:nth-last-child(-n + 2) {
    border-bottom: 0;
  }

  .ops-metrics b {
    font-size: var(--fs-3xl);
  }

  .ops-dashboard-grid,
  .ai-workspace-grid {
    grid-template-columns: 1fr;
  }

  .ops-ai-panel {
    min-height: 0;
  }

  .ops-panel,
  .ai-tool-panel,
  .ai-context-panel,
  .ai-result-panel {
    min-height: 0;
    padding: 16px;
  }

  .ai-result-panel {
    grid-column: auto;
  }

  .ai-quick-grid {
    grid-template-columns: 1fr 1fr;
  }

  .ai-quick-grid button {
    min-height: 78px;
  }

  .ai-result-row {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .ai-result-row > div:nth-child(2) {
    text-align: right;
  }

  .ai-result-row > button {
    grid-column: 1 / -1;
    justify-self: start;
  }

  .mobile-navigation {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1200;
    height: 62px;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    border-top: 1px solid #dfe7f2;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 -8px 24px rgba(16, 24, 40, .08);
  }

  .mobile-navigation button {
    min-width: 0;
    display: grid;
    justify-items: center;
    align-content: center;
    gap: 2px;
    border: 0;
    color: #667085;
    background: transparent;
  }

  .mobile-navigation button span {
    font-size: var(--fs-md);
    font-weight: 400;
  }

  .mobile-navigation button b {
    font-size: var(--fs-2xs);
  }

  .mobile-navigation button.active {
    color: var(--ops-blue);
    background: #f1f6ff;
  }

  .modal {
    padding: 0;
  }

  .modal .modal-card,
  .modal.wide-modal .modal-card {
    width: 100vw;
    max-width: none;
    min-height: 100dvh;
    max-height: 100dvh;
    margin: 0;
    border-radius: 0;
    overflow: auto;
  }

  .wide-modal .profile-two-col,
  .profile-two-col,
  .profile-long-grid,
  .form-grid,
  .quote-layout {
    grid-template-columns: 1fr !important;
  }

  .profile-policy-row {
    grid-template-columns: 30px minmax(0, 1fr);
  }

  .profile-policy-actions {
    grid-column: 1 / -1;
  }
}

/* Customer debt, relationships and finance workspace */
.profile-hero-status.is-settled {
  color: #087a49;
  background: #eaf9f2;
}

.debt-manager {
  overflow: hidden;
}

.debt-manager.is-outstanding {
  border-color: #ffd2dc;
}

.debt-manager-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid #edf1f6;
}

.debt-manager-head span {
  color: #8a96a6;
  font-size: var(--fs-xs);
  font-weight: 400;
}

.debt-manager-head h3 {
  padding: 0;
  border: 0;
}

.debt-manager-head button,
.finance-row-actions button {
  min-height: 32px;
  border: 1px solid #cfe0f6;
  border-radius: 8px;
  padding: 0 10px;
  color: #0967ff;
  background: #f3f8ff;
  font-weight: 400;
}

.debt-manager-summary {
  display: grid;
  grid-template-columns: .8fr .8fr 1.6fr .8fr;
  gap: 1px;
  background: #edf1f6;
}

.debt-manager-summary > div {
  min-width: 0;
  padding: 12px 14px;
  background: #fff;
}

.debt-manager-summary span,
.debt-history span {
  display: block;
  color: #8a96a6;
  font-size: var(--fs-xs);
  font-weight: 400;
}

.debt-manager-summary b {
  display: block;
  margin-top: 4px;
  overflow-wrap: anywhere;
}

.debt-history {
  padding: 8px 14px 14px;
}

.debt-history > div {
  display: grid;
  grid-template-columns: 90px 72px 100px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid #edf1f6;
}

.debt-history > div:last-child {
  border-bottom: 0;
}

.debt-history small {
  overflow-wrap: anywhere;
}

.debt-editor-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  padding: 18px;
}

.debt-editor-form label {
  display: grid;
  gap: 6px;
  color: #5e6c7d;
  font-size: var(--fs-sm);
  font-weight: 400;
}

.debt-editor-form .wide {
  grid-column: 1 / -1;
}

.debt-editor-form input,
.debt-editor-form select,
.debt-editor-form textarea,
.relation-control input,
.relation-row select {
  width: 100%;
  min-height: 36px;
  border: 1px solid #d9e3ef;
  border-radius: 8px;
  padding: 7px 10px;
  color: #172033;
  background: #fff;
}

.relation-row {
  grid-template-columns: minmax(0, 1fr) 112px auto;
}

.relation-control {
  grid-template-columns: minmax(160px, 1.2fr) minmax(180px, 1fr) 110px auto;
}

.relation-control input,
.relation-control select {
  height: 36px;
}

.relation-search-note {
  margin: 7px 0 0;
  color: #8793a3;
  font-size: var(--fs-xs);
}

.finance-page {
  padding: 22px;
  background: #f5f8fc;
}

.finance-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}

.finance-head h1 {
  margin: 4px 0;
  font-size: var(--fs-3xl);
}

.finance-head p {
  margin: 0;
  color: #718096;
}

.finance-head-actions,
.finance-filters,
.finance-row-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}

.finance-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.finance-metrics article {
  min-width: 0;
  padding: 16px;
  border: 1px solid #e1e9f3;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 20px rgba(34, 56, 88, .05);
}

.finance-metrics span,
.finance-metrics small {
  display: block;
  color: #718096;
  font-size: var(--fs-sm);
  font-weight: 400;
}

.finance-metrics b {
  display: block;
  margin: 8px 0 4px;
  color: #111827;
  font-size: var(--fs-3xl);
}

.finance-metrics .finance-warning {
  border-color: #ffcbd7;
  background: #fff8fa;
}

.finance-metrics .finance-warning b {
  color: #e9164d;
}

.finance-ledger {
  overflow: hidden;
  border: 1px solid #e1e9f3;
  border-radius: 8px;
  background: #fff;
}

.finance-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 16px;
  border-bottom: 1px solid #e8eef5;
}

.finance-toolbar h2 {
  margin: 0 0 3px;
  font-size: var(--fs-lg);
}

.finance-toolbar span {
  color: #7d8998;
  font-size: var(--fs-sm);
}

.finance-filters button {
  min-height: 32px;
  border: 1px solid #dce5f0;
  border-radius: 7px;
  padding: 0 11px;
  color: #566579;
  background: #fff;
  font-weight: 400;
}

.finance-filters button.active {
  border-color: #0967ff;
  color: #0967ff;
  background: #eef5ff;
}

.finance-table td:first-child small {
  display: block;
  margin-top: 3px;
  color: #8a96a6;
}

.finance-status {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  border-radius: 6px;
  padding: 0 8px;
  color: #4f6074;
  background: #eef2f6;
  font-size: var(--fs-sm);
  font-weight: 400;
}

.finance-status.status-outstanding {
  color: #d81649;
  background: #ffedf2;
}

.finance-status.status-settled {
  color: #087a49;
  background: #eaf9f2;
}

@media (max-width: 1100px) {
  .finance-metrics {
    grid-template-columns: 1fr 1fr;
  }

  .debt-manager-summary {
    grid-template-columns: 1fr 1fr;
  }

  .relation-control {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 767px) {
  .mobile-navigation {
    grid-template-columns: repeat(6, 1fr);
  }

  dialog.modal[open] {
    inset: 0;
    width: 100%;
    max-width: 100%;
    height: 100dvh;
    max-height: 100dvh;
    margin: 0;
    border: 0;
    padding: 0;
  }

  .modal .modal-card,
  .modal.wide-modal .modal-card {
    width: 100% !important;
    height: 100%;
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
  }

  .modal-head {
    position: sticky;
    top: 0;
    z-index: 30;
    min-height: 58px;
    padding: 10px 14px;
    background: rgba(255, 255, 255, .98);
  }

  .modal-head h2 {
    min-width: 0;
    font-size: var(--fs-lg);
    line-height: 1.25;
    overflow-wrap: anywhere;
  }

  #profileDialog .profile-two-col {
    display: block;
    padding: 12px;
  }

  #profileDialog .profile-col-right {
    position: static;
    width: 100%;
  }

  .profile-hero {
    align-items: stretch;
    flex-direction: column;
    margin-bottom: 0;
    padding: 14px;
    border-radius: 10px;
  }

  .profile-hero h3 {
    font-size: var(--fs-xl);
  }

  .profile-hero-status {
    width: 100%;
    min-width: 0;
    border-radius: 8px;
    text-align: left;
  }

  #profileInfo .profile-quick-actions {
    position: static;
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 10px;
    border-radius: 8px;
    box-shadow: none;
  }

  #profileInfo .profile-quick-actions label {
    min-width: 0;
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: auto minmax(0, 1fr);
  }

  .profile-section,
  .profile-panel {
    border-radius: 8px;
    box-shadow: none;
  }

  .profile-section {
    padding: 12px;
  }

  .profile-kv {
    grid-template-columns: 88px minmax(0, 1fr);
    gap: 8px;
  }

  .debt-manager-head,
  .finance-head,
  .finance-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .debt-manager-head button {
    width: 100%;
  }

  .debt-manager-summary,
  .finance-metrics {
    grid-template-columns: 1fr 1fr;
  }

  .debt-history > div {
    grid-template-columns: 1fr 1fr;
  }

  .debt-history small {
    grid-column: 1 / -1;
  }

  .relation-row,
  .relation-control {
    grid-template-columns: 1fr;
  }

  .relation-row button,
  .relation-row select,
  .relation-control button {
    width: 100%;
    min-height: 36px;
  }

  .debt-editor-form {
    grid-template-columns: 1fr;
    padding: 14px;
  }

  .finance-page {
    padding: 14px 12px 76px;
  }

  .finance-head h1 {
    font-size: var(--fs-2xl);
  }

  .finance-head-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .finance-metrics article {
    padding: 12px;
  }

  .finance-metrics b {
    font-size: var(--fs-xl);
  }

  .finance-filters {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
  }

  .finance-table thead {
    display: none;
  }

  .finance-table,
  .finance-table tbody {
    display: block;
    min-width: 0 !important;
  }

  .finance-table tr {
    display: grid;
    margin: 10px;
    border: 1px solid #e2eaf4;
    border-radius: 8px;
    background: #fff;
  }

  .finance-table td {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 8px;
    align-items: start;
    min-width: 0;
    padding: 9px 10px;
    border-bottom: 1px solid #edf1f6;
    overflow-wrap: anywhere;
  }

  .finance-table td::before {
    color: #8a96a6;
    font-size: var(--fs-xs);
    font-weight: 400;
  }

  .finance-table td:nth-child(1)::before { content: "客户"; }
  .finance-table td:nth-child(2)::before { content: "Dossier"; }
  .finance-table td:nth-child(3)::before { content: "状态"; }
  .finance-table td:nth-child(4)::before { content: "金额"; }
  .finance-table td:nth-child(5)::before { content: "欠款原因"; }
  .finance-table td:nth-child(6)::before { content: "结清日期"; }
  .finance-table td:nth-child(7)::before { content: "更新时间"; }
  .finance-table td:nth-child(8)::before { content: "操作"; }

  .finance-row-actions {
    flex-wrap: wrap;
  }

  /* 学生页面手机适配 */
  #studentsPage .data-table { min-width: 720px !important; }
  #studentsPage .list-toolbar { flex-wrap: wrap; }
  #studentsPage .list-toolbar button { flex: 1 1 auto; min-width: 80px; font-size: var(--fs-xs); }
  .student-toolbar-row { flex-wrap: wrap !important; }
  .student-search-wrap { min-width: 120px; }
  .student-chip { padding: 4px 10px; font-size: var(--fs-sm); }
  .chip-count { min-width: 16px; height: 16px; font-size: var(--fs-2xs); padding: 0 5px; }

  /* 证书弹窗手机适配 */
  .student-certificate { padding: 14px !important; }
  .cert-header h1 { font-size: var(--fs-2xl); }
  .cert-student-name { font-size: var(--fs-lg); }
  .cert-body { padding: 10px; }

  /* 客户关系面板手机适配 */
  .relation-row { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 0; }
  .relation-row > span { flex: 1 1 100%; }
  .relation-row select { flex: 1 1 auto; min-width: 100px; }
  .relation-row button { flex: 0 0 auto; }
  .relation-control { display: flex; flex-wrap: wrap; gap: 6px; }
  .relation-control input { flex: 1 1 100%; }
  .relation-control select { flex: 1 1 calc(50% - 6px); }
  .relation-control button { flex: 1 1 100%; }

  /* 客户编辑弹窗手机适配 */
  #customerForm .form-grid { grid-template-columns: 1fr !important; }
  #customerForm .student-fields { grid-template-columns: 1fr !important; }

  /* 保单弹窗手机适配 */
  #policyForm .form-grid { grid-template-columns: 1fr !important; }

  /* 操作按钮手机适配 */
  .modal-actions { flex-wrap: wrap; gap: 6px; }
  .modal-actions button { flex: 1 1 auto; min-width: 80px; }

  /* 跟进记录手机适配 */
  .followup-input-row { flex-direction: column; gap: 6px; }
  .followup-input-row input { width: 100%; }
  .followup-input-row button { width: 100%; }

  /* 欠款管理面板手机适配 */
  .debt-manager-summary > div { padding: 8px 10px; }
  .debt-manager-summary b { font-size: var(--fs-base); word-break: break-all; }

  /* 档案库手机适配 */
  .doc-folders { grid-template-columns: 1fr !important; }
  .doc-folder-head { flex-wrap: wrap; gap: 6px; }
  .doc-item { flex-wrap: wrap; gap: 4px; }
  .doc-item .doc-name { flex: 1 1 100%; }
}

/* 移动端全局表格优化 */
@media (max-width: 767px) {
  .data-table { font-size: var(--fs-sm); }
  .data-table th, .data-table td { padding: 6px 8px; white-space: nowrap; }

  /* 客户表格操作列 */
  #customerRows .row-actions { display: flex; gap: 4px; flex-wrap: wrap; }
  #customerRows .row-actions button { font-size: var(--fs-2xs); padding: 3px 6px; min-height: 28px; }

  /* 批量操作工具栏 */
  .batch-toolbar { flex-wrap: wrap; gap: 4px; padding: 6px 8px; }
  .batch-toolbar .batch-info { flex: 1 1 100%; }
  .batch-toolbar button, .batch-toolbar select { font-size: var(--fs-xs); min-height: 30px; }

  /* 导入预览弹窗 */
  .import-preview-dialog .modal-card { padding: 0 !important; }
  .import-preview-toolbar { flex-wrap: wrap; gap: 4px; padding: 8px; }
  .import-preview-toolbar button, .import-preview-toolbar select { font-size: var(--fs-xs); min-height: 30px; }
  .import-preview-table-wrap { max-height: 50vh; }

  /* 报价弹窗 */
  .quote-layout { display: flex; flex-direction: column; }
  .quote-results { max-height: 40vh; overflow-y: auto; }
  .quote-card { padding: 10px; }
  .quote-price { font-size: var(--fs-lg); }

  /* 学生页面 */
  #studentsPage.active { padding: 8px !important; }
}

/* ====== 学生保险页面 ====== */
#studentsPage.active { display: flex; flex-direction: column; }

/* ── Year chips row ── */
.student-toolbar-row {
  display: flex;
  gap: 8px;
  padding: 8px 12px;
  background: #fff;
  border-bottom: 1px solid var(--line);
  align-items: center;
  flex-wrap: nowrap;
}

.student-chips-row {
  flex-wrap: nowrap;
  overflow: hidden;
}

.student-chips-row .student-chip {
  flex-shrink: 0;
}

.student-chips-scroll {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #c0c0c0 transparent;
  align-items: center;
  flex: 1 1 auto;
  min-width: 0;
}

.student-chips-scroll::-webkit-scrollbar {
  height: 3px;
}
.student-chips-scroll::-webkit-scrollbar-thumb {
  background: #c0c0c0;
  border-radius: 3px;
}
.student-chips-scroll::-webkit-scrollbar-track {
  background: transparent;
}

/* ── Individual year chip ── */
.student-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: var(--fs-base);
  font-weight: 400;
  border: 1.5px solid var(--line);
  background: #f5f6f8;
  color: #444;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.15s ease;
  font-family: inherit;
  line-height: 1.4;
  user-select: none;
}

.student-chip:hover {
  background: #e8ecf1;
  border-color: #b0b8c1;
}

.student-chip.active {
  background: #e8eaf6;
  border-color: #1a237e;
  color: #1a237e;
  font-weight: 400;
}

.student-chip.current {
  background: #0d47a1;
  border-color: #0d47a1;
  color: #fff;
}

.student-chip.current:hover {
  background: #1565c0;
  border-color: #1565c0;
}

.student-chip.current .chip-count {
  background: rgba(255,255,255,0.25);
  color: #fff;
}

.chip-label {
  font-size: var(--fs-base);
}

.chip-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 18px;
  padding: 0 6px;
  border-radius: 10px;
  background: #e0e0e0;
  color: #555;
  font-size: var(--fs-xs);
  font-weight: 400;
  font-style: normal;
}

.student-chip-add {
  border-style: dashed;
  color: #1a237e;
  font-weight: 400;
  flex-shrink: 0;
}

.student-chip-add:hover {
  background: #e8eaf6;
  border-color: #1a237e;
}

/* ── Chip ellipsis menu ── */
.student-chip-menu-wrap {
  position: relative;
  display: inline-flex;
}

.chip-ellipsis-btn {
  width: 22px;
  height: 22px;
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: var(--fs-lg);
  color: inherit;
  opacity: 0.6;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  line-height: 1;
  transition: opacity 0.15s;
}

.chip-ellipsis-btn:hover {
  opacity: 1;
  background: rgba(0,0,0,0.08);
}

.current .chip-ellipsis-btn {
  color: #fff;
  opacity: 0.8;
}

.current .chip-ellipsis-btn:hover {
  background: rgba(255,255,255,0.2);
  opacity: 1;
}

/* ── Ellipsis dropdown ── */
.chip-menu-dropdown {
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 4px;
  min-width: 170px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.12);
  z-index: 1000;
  overflow: hidden;
  animation: chipMenuIn 0.12s ease;
}

@keyframes chipMenuIn {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

.chip-menu-dropdown button {
  display: block;
  width: 100%;
  padding: 8px 14px;
  border: none;
  background: none;
  text-align: left;
  font-size: var(--fs-base);
  cursor: pointer;
  color: #333;
  font-family: inherit;
  transition: background 0.1s;
}

.chip-menu-dropdown button:hover {
  background: #f0f3f8;
}

.chip-menu-dropdown button.danger {
  color: #e53935;
}

.chip-menu-dropdown button.danger:hover {
  background: #ffebee;
}

.chip-menu-dropdown .menu-divider {
  height: 1px;
  background: var(--line);
  margin: 2px 0;
}

/* ── Archived row ── */
.student-archived-row {
  display: flex;
  gap: 8px;
  padding: 6px 12px;
  background: #fafafa;
  border-bottom: 1px solid var(--line);
  align-items: center;
  flex-wrap: nowrap;
}

.archived-label {
  font-size: var(--fs-sm);
  color: #888;
  white-space: nowrap;
  flex-shrink: 0;
}

.student-archived-row .student-chip {
  opacity: 0.65;
  font-size: var(--fs-sm);
  padding: 4px 12px;
}

.student-archived-row .student-chip:hover {
  opacity: 0.9;
}

/* ── Student search ── */
.student-search-wrap {
  flex: 1 1 auto;
  min-width: 180px;
}

.student-search-wrap input {
  width: 100%;
  padding: 7px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  font-size: var(--fs-base);
  font-family: inherit;
  background: #f8f9fb;
  transition: border-color 0.15s;
}

.student-search-wrap input:focus {
  outline: none;
  border-color: #0d47a1;
  background: #fff;
}

/* ── Boss-only visibility ── */
.boss-only { display: none !important; }
body.is-boss .boss-only { display: inline-flex !important; }
body.is-boss .toolbar-dropdown-wrapper.boss-only { display: inline-block !important; }
/* Extended form sections/fields — boss only */
.boss-only-section,
.boss-only-field { display: none !important; }
body.is-boss .boss-only-section { display: block !important; }
body.is-boss .boss-only-field { display: block !important; }
/* Also handle inline boss-only labels in form grid */
body:not(.is-boss) label.boss-only-field { display: none !important; }
body.is-boss label.boss-only-field { display: block !important; }

#studentsPage .data-table th:nth-child(1) { width: 140px; }
#studentsPage .data-table th:nth-child(2) { width: 160px; }
#studentsPage .data-table th:nth-child(3) { width: 100px; }
#studentsPage .data-table th:nth-child(4) { width: 110px; }
#studentsPage .data-table th:nth-child(5) { width: 100px; }
#studentsPage .data-table th:nth-child(6) { width: 120px; }
#studentsPage .data-table th:nth-child(7) { width: 90px; }
#studentsPage .data-table th:nth-child(8) { width: 90px; }
#studentsPage .data-table th:nth-child(9) { width: 100px; }

/* 学生保险表单字段 */
.student-fields { display: block !important; }
.student-fields label {
  display: block;
  margin-bottom: 6px;
}

#studentCheckbox {
  margin-right: 6px;
}

/* 弹窗自动适配（响应式） */
.modal-card {
  transition: transform 0.2s ease;
}

/* 客户大表格样式 — Requirement 6: fixed layout, no truncation, word wrapping */
#customersTable {
  table-layout: fixed;
  width: auto;
  min-width: 7000px;
  border-collapse: collapse;
}
#customersTable th {
  white-space: nowrap;
  padding: 6px 8px;
  font-size: var(--fs-xs);
  font-weight: 400;
  background: #f0f4f9;
  position: sticky;
  top: 0;
  z-index: 2;
  text-align: center;
  vertical-align: middle;
  height: 40px;
}
#customersTable td {
  white-space: normal;
  overflow-wrap: break-word;
  word-wrap: break-word;
  padding: 6px 8px;
  font-size: var(--fs-sm);
  min-height: 64px;
  height: auto;
  vertical-align: middle;
}
/* Sticky column backgrounds on row hover/selected — use data-col, not nth-child (Issue 4.3) */
#customersTable tbody tr:hover td[data-col="_select"],
#customersTable tbody tr:hover td[data-col="name"],
#customersTable tbody tr:hover td[data-col="status"] {
  background: #f0f5fb;
}
#customersTable tbody tr.selected td[data-col="_select"],
#customersTable tbody tr.selected td[data-col="name"],
#customersTable tbody tr.selected td[data-col="status"] {
  background: #e8f0fe;
}

/* 客户资料弹窗 — 统一字号，可滚动 */
#profileDialog { max-height: 90vh !important; height: fit-content !important; max-width: 100vw !important; overflow: hidden !important; }
#profileDialog .modal-card { padding: 12px 16px; overflow-y: auto !important; max-height: 85vh; height: auto; }
/* ── Font-weight normalization: ALL visible text within profile dialog must be 400 ── */
#profileDialog,
#profileDialog *,
#profileDialog *::before,
#profileDialog *::after { font-weight: 400 !important; }
/* ── Compact bottom bar — sticky, opaque, left/right grouped ── */
#profileDialog .profile-bottom-bar {
  position: sticky;
  bottom: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  padding: 8px 0 10px;
  margin: 12px 0 0;
  border-top: 1px solid #edf1f6;
  background: #fff;
}
#profileDialog .profile-bottom-bar .pbb-left {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
#profileDialog .profile-bottom-bar .pbb-right {
  display: flex;
  align-items: center;
  margin-left: auto;
}
#profileDialog .pbb-btn {
  font-size: var(--fs-base);
  font-weight: 400;
  padding: 6px 16px;
  border: 1px solid #d4dce6;
  border-radius: 6px;
  background: #fff;
  color: #334155;
  cursor: pointer;
  white-space: nowrap;
  transition: background .12s, border-color .12s;
}
#profileDialog .pbb-btn:hover {
  background: #f1f5f9;
  border-color: #94a3b8;
}
#profileDialog .pbb-btn:disabled {
  opacity: .45;
  cursor: not-allowed;
}
#profileDialog .pbb-btn.primary {
  background: #2563eb;
  color: #fff;
  border-color: #2563eb;
}
#profileDialog .pbb-btn.primary:hover {
  background: #1d4ed8;
}
#profileDialog .pbb-done {
  background: #0f172a;
  color: #fff;
  border-color: #0f172a;
  font-weight: 400;
  min-width: 90px;
  text-align: center;
}
#profileDialog .pbb-done:hover {
  background: #1e293b;
}
/* Ensure scrollable content has room so sticky bar never covers last row */
#profileDialog .modal-card {
  padding-bottom: 4px;
}
/* Narrow screen */
@media (max-width: 600px) {
  #profileDialog .profile-bottom-bar {
    gap: 6px;
    padding: 6px 0 8px;
  }
  #profileDialog .pbb-btn {
    font-size: var(--fs-sm);
    padding: 5px 12px;
  }
}
#profileDialog .profile-two-col { display: block; }

/* ── Policy "More" dropdown menu (Issue 9: portal-level, never clipped) ── */
.qa-policy-menu {
  animation: qaMenuIn .12s ease-out;
}
@keyframes qaMenuIn {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}
.qa-policy-menu-item {
  display: block;
  width: 100%;
  text-align: left;
  padding: 7px 14px;
  border: none;
  border-radius: 5px;
  background: transparent;
  font-size: var(--fs-base);
  font-weight: 400;
  color: #1e293b;
  cursor: pointer;
  white-space: nowrap;
  transition: background .1s;
}
.qa-policy-menu-item:hover {
  background: #f1f5f9;
}
.qa-policy-menu-item--danger {
  color: #dc2626;
}
.qa-policy-menu-item--danger:hover {
  background: #fef2f2;
  color: #b91c1c;
}

/* ── Profile dialog scroll body (Issue 10: header + scroll + footer) ── */
.qa-profile-scroll-body {
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: hidden;
  padding-bottom: 20px;
  min-height: 0;
  -webkit-overflow-scrolling: touch;
}

/* Solid separator between scroll body and footer */
#profileDialog .profile-bottom-bar {
  flex-shrink: 0;
}

/* ── Custom confirm overlay (Issue 11: no native confirm) ── */
@keyframes qaFadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes qaScaleIn {
  from { opacity: 0; transform: scale(.94); }
  to   { opacity: 1; transform: scale(1); }
}

/* 统一字号 */
#profileDialog .modal-head { padding: 6px 0; margin-bottom: 8px; border-bottom: 1px solid #e0e0e0; }
#profileDialog .modal-head h2 { font-size: var(--fs-lg); margin: 0; font-weight: 700; }
#profileDialog .modal-head button { width: 28px; height: 28px; font-size: var(--fs-md); }
#profileDialog .profile-hero { padding: 10px 14px; margin-bottom: 10px; border: 1px solid #dcecff; border-radius: 8px; background: #f8fbff; }
#profileDialog .profile-hero h3 { font-size: var(--fs-xl); margin: 4px 0; }
#profileDialog .profile-hero p { font-size: var(--fs-sm); }
#profileDialog .profile-eyebrow { font-size: var(--fs-2xs); }
#profileDialog .profile-hero-status { padding: 8px 12px; min-width: auto; border-radius: 8px; }
#profileDialog .profile-hero-status span { font-size: var(--fs-2xs); }
#profileDialog .profile-hero-status b { font-size: var(--fs-base); }
#profileDialog .profile-two-col { gap: 12px; }
#profileDialog .profile-long-grid { gap: 8px; grid-template-columns: 1fr 1fr; }
#profileDialog .profile-section { padding: 10px; border: 1px solid #edf1f6; border-radius: 6px; background: #fff; }
#profileDialog .profile-section h4 { font-size: var(--fs-sm); margin: 0 0 6px; color: #333; text-transform: none; }
#profileDialog .profile-kv { padding: 3px 0; border: none; background: transparent; display: flex; gap: 6px; }
#profileDialog .profile-kv span { font-size: var(--fs-xs); color: #777; white-space: nowrap; }
#profileDialog .profile-kv b { font-size: var(--fs-sm); }
#profileDialog .profile-quick-actions { gap: 6px; margin: 8px 0; }
#profileDialog .profile-quick-actions button { font-size: var(--fs-sm); padding: 5px 10px; }
#profileDialog .profile-panel { margin-bottom: 10px; border: 1px solid #e8e8e8; border-radius: 6px; background: #fff; }
#profileDialog .profile-panel h3 { height: 32px; font-size: var(--fs-sm); padding: 0 10px; border-bottom: 1px solid #eee; background: #f8f8f8; }
#profileDialog .profile-info,
#profileDialog .profile-policy-list { padding: 8px; gap: 6px; }
#profileDialog .profile-policy { padding: 6px 8px; border: 1px solid #edf1f5; background: #fbfcfe; }
#profileDialog .profile-policy b { font-size: var(--fs-sm); }
#profileDialog .profile-policy span { font-size: var(--fs-xs); }
#profileDialog .action-note { font-size: var(--fs-xs); padding: 8px; }
#profileDialog .relation-row { padding: 6px 8px; font-size: var(--fs-xs); }
#profileDialog .relation-control { gap: 6px; margin-top: 6px; }
#profileDialog .relation-control select,
#profileDialog .relation-control button { font-size: var(--fs-xs); }
#profileDialog .followup-item { padding: 6px 8px; }
#profileDialog .followup-item span { font-size: var(--fs-xs); }
#profileDialog .followup-input-row { gap: 6px; }
#profileDialog .followup-input-row input { font-size: var(--fs-sm); padding: 5px 8px; }
#profileDialog .followup-input-row button { font-size: var(--fs-xs); padding: 4px 8px; }
#profileDialog .debt-summary-row { padding: 6px 8px; font-size: var(--fs-xs); }
#profileDialog .birthday-row { gap: 6px; }
#profileDialog .birthday-row input { font-size: var(--fs-xs); padding: 4px 6px; }
#profileDialog .birthday-row button { font-size: var(--fs-xs); padding: 4px 8px; }
#profileDialog .doc-item { padding: 4px 8px; }
#profileDialog .doc-item span { font-size: var(--fs-xs); }
#profileDialog .doc-item button,
#profileDialog .doc-item a { font-size: var(--fs-xs); }
/* 产品保障分组 */
#profileDialog .profile-product-group { margin-bottom: 6px; padding: 4px 0; }
#profileDialog .profile-product-cat { display: inline-flex; align-items: center; gap: 4px; margin-bottom: 4px; }
#profileDialog .profile-product-item { padding: 6px 0 6px 22px; border-bottom: 1px dotted #eee; font-size: var(--fs-xs); }
#profileDialog .profile-product-item:last-child { border-bottom: none; }
#profileDialog .ppi-main { display: flex; align-items: baseline; gap: 8px; margin-bottom: 3px; }
#profileDialog .ppi-main b { font-size: var(--fs-base); font-weight: 400; }
#profileDialog .ppi-main span { font-size: var(--fs-xs); color: #888; }
#profileDialog .ppi-meta { display: flex; flex-wrap: wrap; gap: 8px; }
#profileDialog .ppi-meta span { font-size: var(--fs-xs); color: #666; white-space: nowrap; }
#profileDialog .ppi-meta .ppi-status { font-weight: 400; }
#profileDialog .ppi-status.is-debt-row { color: #d32f2f; }
#profileDialog .ppi-status.is-expired-row { color: #f57c00; }
#profileDialog .profile-product-item.is-debt-row { background: #fff5f5; padding-left: 28px; border-left: 3px solid #ffcdd2; }
#profileDialog .profile-product-item.is-expired-row { background: #fff8e1; padding-left: 28px; border-left: 3px solid #ffe0b2; }
/* 剩余天数 */
#profileDialog .ppi-days { font-weight: 400; }
#profileDialog .ppi-days.days-urgent { color: #d32f2f; }
#profileDialog .ppi-days.days-warn { color: #f57c00; }
/* 欠费原因 */
#profileDialog .ppi-debt { padding: 3px 0; }
#profileDialog .ppi-debt span { font-size: var(--fs-xs); color: #d32f2f; background: #fff5f5; padding: 2px 8px; border-radius: 3px; }
/* 滞纳金 */
#profileDialog .ppi-latefee { padding: 2px 0; }
#profileDialog .ppi-latefee .latefee-tag { font-size: var(--fs-2xs); background: #e8f5e9; color: #2e7d32; padding: 1px 6px; border-radius: 3px; margin-right: 6px; }
#profileDialog .ppi-latefee b { font-size: var(--fs-sm); color: #2e7d32; }
#profileDialog .ppi-latefee-row { display: flex; align-items: center; gap: 6px; padding: 4px 0; }
#profileDialog .ppi-latefee-row .latefee-select { font-size: var(--fs-2xs); padding: 2px 4px; border: 1px solid #ddd; border-radius: 3px; }
#profileDialog .ppi-latefee-row .latefee-amt { font-size: var(--fs-xs); width: 80px; padding: 2px 6px; border: 1px solid #ddd; border-radius: 3px; }
#profileDialog .ppi-latefee-row .mini-action { font-size: var(--fs-xs); padding: 2px 6px; }
/* 快捷操作 */
#profileDialog .ppi-actions { display: flex; gap: 6px; padding: 4px 0; }
#profileDialog .ppi-actions .mini-action { font-size: var(--fs-xs); padding: 2px 8px; border: 1px solid #ddd; border-radius: 4px; background: #f8f9fa; cursor: pointer; }
#profileDialog .ppi-actions .mini-action:hover { background: #e8edf5; }
/* 合计保费 */

/* 客户列表 - 保单/类别列 */
.policy-col { min-width: 280px; padding: 2px 6px; white-space: normal; line-height: 1.6; }
.policy-tag { display: inline-block; background: #e8f0fe; color: #1a73e8; font-size: var(--fs-xs); padding: 1px 6px; border-radius: 3px; margin: 1px 2px; white-space: nowrap; }
.cat-tag { display: inline-flex; align-items: center; gap: 3px; font-size: var(--fs-xs); padding: 2px 7px 2px 4px; border-radius: 4px; margin: 1px 2px; white-space: nowrap; font-weight: 400; }
.cat-tag svg { width: 14px; height: 14px; display: block; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.cat-tag.cat-santé,.cat-tag.cat-mutuelle { background: #fce8e6; color: #c5221f; }
.cat-tag.cat-prévoyance { background: #e8f5e9; color: #1e8e3e; }
.cat-tag.cat-auto,.cat-tag.cat-automobile { background: #e3f2fd; color: #1565c0; }
.cat-tag.cat-habitation { background: #fff3e0; color: #e65100; }
.cat-tag.cat-rc { background: #f3e5f5; color: #7b1fa2; }
.cat-tag.cat-épargne { background: #e0f2f1; color: #00695c; }
.cat-tag.cat-voyage { background: #e8eaf6; color: #3949ab; }
.cat-tag.cat-autre { background: #f5f5f5; color: #616161; }
.cat-tag.cat-overflow { background: #e0e0e0; color: #555; cursor: help; padding: 2px 7px; font-weight: 400; }
.cat-tag.cat-overflow:hover { background: #ccc; color: #333; }
.category-chips-cell { min-width: 140px; line-height: 1.9; }

/* ── Redesigned profile hero (v2) ── */
#profileDialog .profile-hero-v2 { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 14px 16px; margin-bottom: 12px; border: 1px solid #dcecff; border-radius: 10px; background: linear-gradient(135deg, #f8fbff, #eef7ff); flex-wrap: wrap; }
#profileDialog .profile-hero-left { flex: 1; min-width: 180px; display: flex; flex-direction: column; gap: 4px; }
#profileDialog .profile-hero-left .ws-summary-item { display: flex; align-items: baseline; gap: 4px; }
#profileDialog .profile-hero-left .ws-summary-label { font-size: 16px; font-weight: 700; color: #8b95a5; white-space: nowrap; }
#profileDialog .profile-hero-left .ws-summary-value { font-size: 16px; font-weight: 700; color: #0f172a; }
#profileDialog .profile-hero-left .profile-hero-name { font-size: 24px; font-weight: 700; line-height: 1.25; color: #0f172a; margin: 0; }
#profileDialog .profile-hero-right { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; min-width: 150px; flex-shrink: 0; }
#profileDialog .profile-hero-right .ws-status-badge { font-size: 16px; font-weight: 700; padding: 5px 16px; border-radius: 14px; white-space: nowrap; }
#profileDialog .profile-hero-right .hero-summary-items { display: flex; flex-wrap: wrap; gap: 6px 16px; justify-content: flex-end; }
#profileDialog .profile-hero-right .ws-summary-item { display: inline-flex; align-items: baseline; gap: 4px; }
#profileDialog .profile-hero-right .ws-summary-label { font-size: 16px; font-weight: 700; color: #8b95a5; white-space: nowrap; }
#profileDialog .profile-hero-right .ws-summary-value { font-size: 16px; font-weight: 700; color: #0f172a; }

/* ── All purchased insurance table ── */
#profileCardAllPolicies .all-policies-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
#profileCardAllPolicies .all-policies-table { font-size: var(--fs-base); width: 100%; min-width: 680px; border-collapse: collapse; }
#profileCardAllPolicies .all-policies-table th { font-size: var(--fs-xs); padding: 6px 8px; white-space: nowrap; background: #f1f5f9; color: #64748b; text-transform: uppercase; letter-spacing: .03em; font-weight: 400; }
#profileCardAllPolicies .all-policies-table td { font-size: var(--fs-base); padding: 6px 8px; white-space: nowrap; border-bottom: 1px solid #f1f4f8; font-weight: 400; }
#profileCardAllPolicies .all-policies-table tbody tr:hover { background: #f8fafc; }
#profileCardAllPolicies .all-policies-table tbody tr:last-child td { border-bottom: none; }
/* All-policies empty state cell */
#profileCardAllPolicies .all-policies-empty-cell {
  text-align: center;
  padding: 28px 16px;
  font-size: var(--fs-base);
  color: #94a3b8;
  line-height: 1.6;
  font-weight: 400;
}
/* All-policies filter bar inputs */
#profileCardAllPolicies .all-policies-filters input,
#profileCardAllPolicies .all-policies-filters select {
  font-size: var(--fs-base);
  font-weight: 400;
  border: 1px solid #d4dce6;
  border-radius: 5px;
  padding: 0 8px;
  background: #fff;
  color: #334155;
  height: 36px;
  line-height: 36px;
  box-sizing: border-box;
}
#profileCardAllPolicies .all-policies-filters input::placeholder { color: #94a3b8; }
/* ── Mini status chip for tables ── */
.status-chip-mini { font-size: var(--fs-2xs); font-weight: 400; padding: 2px 6px; border-radius: 4px; background: #dcfce7; color: #166534; white-space: nowrap; line-height: 1.4; }
/* Status variants */
#profileDialog .status-chip-mini.is-active,
#profileDialog .status-chip-mini.is-normal { background: #dcfce7; color: #166534; }
#profileDialog .status-chip-mini.is-expired,
#profileDialog .status-chip-mini.is-overdue { background: #fef2f2; color: #b91c1c; }
#profileDialog .status-chip-mini.is-pending,
#profileDialog .status-chip-mini.is-warning { background: #fffbeb; color: #b45309; }
#profileDialog .status-chip-mini.is-draft { background: #f1f5f9; color: #475569; }

/* ── Full-width profile cards ── */
#profileDialog .profile-full-card { margin-bottom: 16px; padding: 16px 18px; border: 1px solid #edf1f6; border-radius: 8px; background: #fff; }
#profileDialog .profile-full-card h4 { margin: 0 0 12px; font-size: var(--fs-xl); font-weight: 400; color: #0d1015; display: flex; align-items: center; gap: 8px; }
#profileDialog .profile-full-card h4 small { font-weight: 400; color: #888; font-size: var(--fs-base); }
#profileDialog .section-h4-icon { font-style: normal; line-height: 1; }
/* Section title button (e.g. debt edit) */
#profileDialog .section-title-btn { font-size: var(--fs-sm); padding: 3px 10px; border: 1px solid #d9e6f5; border-radius: 4px; background: #f0f5ff; color: #1a237e; cursor: pointer; white-space: nowrap; margin-left: auto; }
#profileDialog .section-title-btn:hover { background: #dcecff; }

/* ── SECTION 1: Overview card / 客户概览 (redesigned) ── */
/* Card header row with title + subtitle */
#profileDialog .ov-card-header { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 14px; flex-wrap: wrap; gap: 4px 12px; }
#profileDialog .ov-card-header h4 { margin: 0 !important; }


/* ── Grouped detail sections ── */
#profileDialog .ov-groups { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 24px; margin-bottom: 4px; }
#profileDialog .ov-group { min-width: 0; }
#profileDialog .ov-group-title { font-size: var(--fs-xs); font-weight: 400; color: #1a237e; text-transform: uppercase; letter-spacing: .05em; margin: 0 0 7px; padding-bottom: 5px; border-bottom: 2px solid #eef2ff; }
#profileDialog .ov-group-grid { display: flex; flex-direction: column; gap: 1px; }
#profileDialog .ov-field { display: flex; align-items: baseline; gap: 8px; padding: 3px 0; min-height: 28px; line-height: 28px; }
#profileDialog .ov-field-label { font-size: var(--fs-base); color: #657181; min-width: 88px; flex-shrink: 0; white-space: nowrap; }
#profileDialog .ov-field-value { font-size: var(--fs-base); font-weight: 400; color: #0d1015; word-break: break-word; }
#profileDialog .ov-field-value.ov-strong { font-weight: 400; }
#profileDialog .ov-field-value.ov-empty { color: #b0b8c4; font-style: italic; }

/* Audit footer */
#profileDialog .overview-audit { display: flex; gap: 24px; margin-top: 10px; padding-top: 8px; border-top: 1px solid #e8ecf2; font-size: var(--fs-sm); color: #96a0b0; }
#profileDialog .overview-audit b { color: #657181; font-weight: 400; }

/* ── SECTION 2: Status & Finance / 客户状态与财务信息 ── */
#profileDialog .status-chips-row { display: flex; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
#profileDialog .status-chips-row .status-chip,
#profileDialog .status-chips-row .chip { font-size: var(--fs-base); font-weight: 400; padding: 4px 12px; border-radius: 14px; white-space: nowrap; }
#profileDialog .status-finance-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 24px; }
#profileDialog .sf-col { display: flex; flex-direction: column; gap: 1px; }
#profileDialog .sf-col-title { font-size: var(--fs-base); font-weight: 400; color: #1a237e; padding-bottom: 6px; margin-bottom: 4px; border-bottom: 2px solid #eef2ff; }
#profileDialog .sf-kv { display: flex; align-items: baseline; gap: 8px; padding: 3px 0; min-height: 30px; line-height: 30px; }
#profileDialog .sf-kv span { font-size: var(--fs-base); color: #657181; min-width: 115px; flex-shrink: 0; }
#profileDialog .sf-kv b { font-size: var(--fs-md); font-weight: 400; color: #0d1015; }
#profileDialog .sf-kv-strong b { font-size: var(--fs-md); font-weight: 400; color: #991b1b; }

/* ── SECTION 2: Inline debt editor ── */
#profileDialog .debt-clear-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 14px; border-radius: 8px;
  background: #dcfce7; color: #166534;
  font-size: var(--fs-base); font-weight: 400;
  margin: 4px 0;
}
#profileDialog .sf-debt-editor {
  padding: 8px 0;
}
#profileDialog .sf-debt-editor label {
  display: flex; flex-direction: column; gap: 3px;
  margin-bottom: 6px; font-size: var(--fs-xs); color: #657181; font-weight: 400;
}
#profileDialog .sf-debt-editor label.wide { grid-column: 1 / -1; }
#profileDialog .sf-debt-editor input,
#profileDialog .sf-debt-editor select,
#profileDialog .sf-debt-editor textarea {
  width: 100%; border: 1px solid #d1d5db; border-radius: 4px;
  padding: 4px 8px; font-size: var(--fs-sm); outline: none;
}
#profileDialog .sf-debt-editor input:focus,
#profileDialog .sf-debt-editor select:focus,
#profileDialog .sf-debt-editor textarea:focus {
  border-color: #0967ff; box-shadow: 0 0 0 2px rgba(9,103,255,.12);
}
#profileDialog .debt-inline-actions {
  display: flex; align-items: center; gap: 8px;
  margin-top: 10px; padding-top: 8px;
  border-top: 1px solid #edf1f6;
}
#profileDialog .debt-inline-actions button {
  height: 30px; border: 1px solid #d1d5db; border-radius: 4px;
  padding: 0 14px; font-size: var(--fs-sm); background: #fff; cursor: pointer; font-weight: 400;
}
#profileDialog .debt-inline-actions button.primary {
  background: #0967ff; color: #fff; border-color: #0967ff;
}
#profileDialog .debt-inline-cancel:hover { background: #f1f5f9; }
#profileDialog .sf-edit-btn {
  font-size: var(--fs-2xs); padding: 1px 6px; border: 1px solid #d9e6f5;
  border-radius: 3px; background: #f0f5ff; color: #0967ff; cursor: pointer; font-weight: 400;
}
#profileDialog .sf-edit-btn:hover { background: #dcecff; }

/* ── SECTION 2 v2: Dual equal-width cards (Follow-up + Debt) ── */
#profileDialog .sf-dual-cards {
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px;
}
@media (max-width: 768px) {
  #profileDialog .sf-dual-cards { grid-template-columns: 1fr; }
}
#profileDialog .sf-card {
  display: flex; flex-direction: column;
  border: 1px solid #edf1f6; border-radius: 8px;
  background: #fafbfc; overflow: hidden;
}
#profileDialog .sf-card-title {
  font-size: var(--fs-lg); font-weight: 400; color: #1a237e;
  padding: 10px 12px; background: #f0f4ff;
  border-bottom: 1px solid #eef2ff;
  display: flex; align-items: center; gap: 8px;
}
#profileDialog .sf-card-title .sf-edit-btn {
  margin-left: auto; font-size: var(--fs-sm); padding: 4px 12px;
  border: 1px solid #d9e6f5; border-radius: 4px;
  background: #f0f5ff; color: #1a237e; cursor: pointer;
  white-space: nowrap; font-weight: 400;
}
#profileDialog .sf-card-title .sf-edit-btn:hover { background: #dcecff; }
#profileDialog .sf-card-body {
  padding: 10px 12px; flex: 1;
}
/* Follow-up field grid: two-column on wide, one-column on narrow */
#profileDialog #followupDisplay { margin: 0; }
#profileDialog .sf-followup-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 6px 20px;
}
@media (max-width: 480px) {
  #profileDialog .sf-followup-grid { grid-template-columns: 1fr; }
}
#profileDialog .sf-followup-grid .sf-fv { display: flex; flex-direction: column; gap: 2px; padding: 4px 0; }
#profileDialog .sf-followup-grid .sf-fv-label {
  font-size: var(--fs-base); color: #64748b; font-weight: 400;
}
#profileDialog .sf-followup-grid .sf-fv-value {
  font-size: var(--fs-md); color: #111827; font-weight: 400;
  word-break: break-word;
}
#profileDialog .sf-followup-grid .sf-fv-value.sf-fv-empty {
  font-size: var(--fs-md); color: #b0b8c4; font-weight: 400; font-style: italic;
}
/* Debt section: keep inline editor capable */
#profileDialog .sf-card-footer {
  padding: 4px 12px 8px; text-align: right;
  border-top: 1px solid #f0f0f0;
}
#profileDialog .sf-inline-editor {
  padding: 8px 12px;
}
#profileDialog .sf-inline-editor label {
  display: flex; flex-direction: column; gap: 3px;
  margin-bottom: 6px; font-size: var(--fs-xs); color: #657181; font-weight: 400;
}
#profileDialog .sf-inline-editor label.wide { grid-column: 1 / -1; }
#profileDialog .sf-inline-editor input,
#profileDialog .sf-inline-editor select,
#profileDialog .sf-inline-editor textarea {
  width: 100%; border: 1px solid #d1d5db; border-radius: 4px;
  padding: 4px 8px; font-size: var(--fs-sm); outline: none;
}
#profileDialog .sf-inline-editor input:focus,
#profileDialog .sf-inline-editor select:focus,
#profileDialog .sf-inline-editor textarea:focus {
  border-color: #0967ff; box-shadow: 0 0 0 2px rgba(9,103,255,.12);
}
#profileDialog .sf-inline-actions {
  display: flex; align-items: center; gap: 8px;
  margin-top: 10px; padding-top: 8px;
  border-top: 1px solid #edf1f6;
}
#profileDialog .sf-inline-actions button {
  height: 30px; border: 1px solid #d1d5db; border-radius: 4px;
  padding: 0 14px; font-size: var(--fs-sm); background: #fff; cursor: pointer; font-weight: 400;
}
#profileDialog .sf-inline-actions button.primary {
  background: #0967ff; color: #fff; border-color: #0967ff;
}
#profileDialog .sf-inline-cancel:hover { background: #f1f5f9; }
#profileDialog .sf-kv-strong b { font-size: var(--fs-md); font-weight: 400; color: #991b1b; }

/* ── Workspace card (redesigned vertical sections) ── */
#profileDialog .sf-workspace-card { padding: 0; overflow: hidden; }
/* Title bar: 18px / 700 per spec */
#profileDialog .sf-ws-title {
  padding: 12px 20px; margin: 0;
  font-size: 18px; font-weight: 700; color: #1a237e;
  background: linear-gradient(135deg, #f0f4ff 0%, #e8eeff 100%);
  border-bottom: 1px solid #dee5f7;
  border-radius: 8px 8px 0 0;
  letter-spacing: 0.01em;
}
/* ── 1. Top summary bar ── */
#profileDialog .ws-summary-bar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px;
  padding: 10px 20px;
  background: #fafbfd;
  border-bottom: 1px solid #edf1f6;
}
#profileDialog .ws-status-badge {
  display: inline-flex; align-items: center;
  padding: 3px 12px; border-radius: 12px;
  font-size: 13px; font-weight: 600; line-height: 1.6;
  white-space: nowrap;
}
/* 10-status badge colors — reuse existing status-select / status-chip palette */
#profileDialog .ws-status-priority   { background: #f3e8ff; color: #5b21b6; }
#profileDialog .ws-status-debtors    { background: #fee2e2; color: #991b1b; }
#profileDialog .ws-status-risk       { background: #ffedd5; color: #9a3412; }
#profileDialog .ws-status-normal     { background: #dcfce7; color: #166534; }
#profileDialog .ws-status-prospect   { background: #dbeafe; color: #1e40af; }
#profileDialog .ws-status-temporaire { background: #cffafe; color: #155e75; }
#profileDialog .ws-status-attention  { background: #fef9c3; color: #854d0e; }
#profileDialog .ws-status-complique  { background: #fce7f3; color: #9d174d; }
#profileDialog .ws-status-resilie    { background: #e2e8f0; color: #334155; }
#profileDialog .ws-status-blacklist  { background: #e5e7eb; color: #111827; }
#profileDialog .ws-status-neutral    { background: #eff6ff; color: #1d4ed8; }
#profileDialog .ws-summary-item {
  display: inline-flex; align-items: baseline; gap: 4px;
}
#profileDialog .ws-summary-label {
  font-size: 13px; font-weight: 500; color: #8b95a5; white-space: nowrap;
}
#profileDialog .ws-summary-value {
  font-size: 14px; font-weight: 600; color: #0f172a;
}
/* ── Sections (vertical stack replacing old 2x2 grid) ── */
#profileDialog .ws-section {
  border-bottom: 1px solid #edf1f6;
}
#profileDialog .ws-section:last-of-type {
  border-bottom: none;
}
/* Section title: 15px / 700 per spec */
#profileDialog .ws-section-title {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 20px;
  font-size: 15px; font-weight: 700; color: #1a237e;
  background: #f8faff;
}
#profileDialog .ws-section-title .sf-edit-btn {
  margin-left: auto;
  font-size: 13px; font-weight: 500;
  padding: 3px 12px;
  border: 1px solid #c7d2e8; border-radius: 5px;
  background: #fff; color: #1e40af; cursor: pointer;
  white-space: nowrap;
  transition: all .15s ease;
}
#profileDialog .ws-section-title .sf-edit-btn:hover {
  background: #eff4ff; border-color: #93b4f5;
}
/* Section body */
#profileDialog .ws-section-body {
  padding: 10px 20px 14px;
}
/* 2-column key-value grid inside sections */
#profileDialog .ws-kv-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 24px;
}
/* ── Key-value lines (unified typography) ── */
/* Label: 13px / 500, lighter color */
#profileDialog .sf-kv-line {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 16px;
  padding: 8px 0; min-height: 36px; line-height: 1.45;
  border-bottom: 1px solid #edf1f6;
}
#profileDialog .sf-kv-label {
  font-size: 15px; font-weight: 600; color: #64748b;
  min-width: 104px; flex-shrink: 0; white-space: nowrap;
}
/* Values share the label typography and align to the right. */
#profileDialog .sf-kv-val {
  flex: 1; min-width: 0; text-align: right;
  font-size: 15px; font-weight: 600; color: #0f172a;
  overflow-wrap: anywhere; word-break: normal; line-height: 1.45;
}
/* Empty values keep the same size and weight so rows remain visually aligned. */
#profileDialog .sf-kv-val.sf-kv-empty {
  color: #9ca3af; font-weight: 600; font-size: 15px; font-style: italic;
}
/* Strong/key values: more prominent */
#profileDialog .sf-kv-line.sf-kv-strong .sf-kv-val {
  font-weight: 600; color: #111827;
}
#profileDialog .sf-kv-strong b { font-size: 15px; font-weight: 600; color: #991b1b; }

/* Responsive: single-column below 760px */
@media (max-width: 760px) {
  #profileDialog .ws-kv-grid { grid-template-columns: 1fr; gap: 0; }
  #profileDialog .ws-summary-bar { padding: 8px 12px; gap: 6px 12px; }
  #profileDialog .ws-section-title { padding: 8px 12px; }
  #profileDialog .ws-section-body { padding: 8px 12px 12px; }
  #profileDialog .sf-ws-title { padding: 10px 12px; }
}
/* ── Debt display (keep compact, inherits kv style) ── */
#profileDialog .profile-kv-compact {
  display: flex; align-items: baseline; gap: 6px;
  padding: 3px 0; min-height: 26px;
}
#profileDialog .profile-kv-compact span {
  font-size: 13px; font-weight: 500; color: #8b95a5; min-width: 64px; flex-shrink: 0;
}
#profileDialog .profile-kv-compact b {
  font-size: 15px; font-weight: 600; color: #0f172a;
}
#profileDialog .debt-clear-badge {
  font-size: 15px; font-weight: 600; color: #15803d; padding: 4px 0;
}
/* Audit footer — keep existing but align with new layout */
#profileDialog .sf-workspace-card .overview-audit {
  padding: 10px 20px 14px; margin-top: 0;
}

/* ── Follow-up editor modal ── */
#followupEditDialog.modal { min-width: 420px; max-width: 560px; }
#followupEditDialog .modal-card { padding: 0; }
#followupEditDialog .modal-head { padding: 14px 20px; border-bottom: 1px solid #e2e8f0; display: flex; align-items: center; gap: 10px; }
#followupEditDialog .modal-head h2 { margin: 0; font-size: var(--fs-lg); font-weight: 400; }
#followupEditDialog .modal-head .close-btn { margin-left: auto; border: none; background: none; font-size: var(--fs-2xl); cursor: pointer; color: #888; }
#followupEditDialog .modal-head .close-btn:hover { color: #111; }
#followupEditDialog .modal-body { padding: 16px 20px; }
#followupEditDialog .modal-body label {
  display: flex; flex-direction: column; gap: 4px;
  margin-bottom: 12px; font-size: var(--fs-base); color: #475569; font-weight: 400;
}
#followupEditDialog .modal-body label.wide { grid-column: 1 / -1; }
#followupEditDialog .modal-body input,
#followupEditDialog .modal-body select,
#followupEditDialog .modal-body textarea {
  width: 100%; border: 1px solid #d1d5db; border-radius: 6px;
  padding: 7px 10px; font-size: var(--fs-md); outline: none;
  box-sizing: border-box;
}
#followupEditDialog .modal-body input:focus,
#followupEditDialog .modal-body select:focus,
#followupEditDialog .modal-body textarea:focus {
  border-color: #0967ff; box-shadow: 0 0 0 3px rgba(9,103,255,.12);
}
/* Two-column form layout inside modal */
#followupEditDialog .fu-form-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px;
}
@media (max-width: 520px) {
  #followupEditDialog .fu-form-grid { grid-template-columns: 1fr; }
}
#followupEditDialog .modal-actions {
  padding: 12px 20px; border-top: 1px solid #e2e8f0;
  display: flex; align-items: center; gap: 10px; justify-content: flex-end;
}
#followupEditDialog .modal-actions button {
  height: 34px; border: 1px solid #d1d5db; border-radius: 6px;
  padding: 0 16px; font-size: var(--fs-base); background: #fff; cursor: pointer;
}
#followupEditDialog .modal-actions button.primary {
  background: #0967ff; color: #fff; border-color: #0967ff;
}
#followupEditDialog .modal-actions button.primary:hover { background: #0651d8; }
#followupEditDialog .modal-actions .fu-saving-status {
  font-size: var(--fs-sm); color: #888; margin-right: auto;
}

/* ── SECTION 3.5: Annual contract details ── */
#profileDialog .annual-contracts-list {
  display: flex; flex-direction: column; gap: 10px;
  --annual-cols: 28px 80px minmax(0, 1fr) 95px 78px 75px 175px 140px;
}

#profileDialog .annual-year-group {
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
}

#profileDialog .annual-year-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  background: #f8fafc;
  cursor: pointer;
  user-select: none;
  transition: background .15s;
}
#profileDialog .annual-year-header:hover {
  background: #eef3fa;
}

#profileDialog .annual-expand-icon {
  display: inline-block;
  width: 18px;
  font-size: var(--fs-2xs);
  color: #64748b;
  text-align: center;
  flex-shrink: 0;
}

#profileDialog .annual-year-label {
  font-size: var(--fs-md);
  font-weight: 400;
  color: #1a237e;
  flex-shrink: 0;
}

#profileDialog .annual-year-stats {
  font-size: var(--fs-sm);
  color: #64748b;
  background: #eef2f7;
  padding: 2px 10px;
  border-radius: 10px;
  font-weight: 400;
  flex-shrink: 0;
}

#profileDialog .annual-year-total {
  margin-left: auto;
  font-size: var(--fs-md);
  font-weight: 400;
  color: #0d47a1;
  flex-shrink: 0;
}

#profileDialog .annual-year-body {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* Policy row — CSS grid for column alignment */
#profileDialog .annual-policy-row {
  display: grid;
  grid-template-columns: var(--annual-cols);
  gap: 8px;
  align-items: center;
  padding: 10px 14px;
  border-bottom: 1px solid #f1f4f8;
  font-size: var(--fs-sm);
  transition: background .12s;
  min-height: 40px;
  min-width: 680px;
}
#profileDialog .annual-policy-row:last-child {
  border-bottom: 0;
}
#profileDialog .annual-policy-row:hover {
  background: #fafbfd;
}

#profileDialog .annual-policy-cat {
  font-size: var(--fs-sm);
  color: #4a5b6e;
  font-weight: 400;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#profileDialog .annual-policy-product {
  font-weight: 400;
  color: #1e293b;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#profileDialog .annual-policy-premium {
  font-weight: 400;
  color: #0d47a1;
  text-align: left;
  white-space: nowrap;
}

#profileDialog .annual-policy-payment {
  font-size: var(--fs-sm);
  color: #5d6b7e;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#profileDialog .annual-policy-status {
  text-align: center;
}

#profileDialog .annual-policy-dates {
  font-size: var(--fs-xs);
  color: #64748b;
  white-space: nowrap;
}

#profileDialog .annual-policy-actions {
  display: flex;
  gap: 4px;
  justify-content: flex-end;
  white-space: nowrap;
}
#profileDialog .annual-policy-actions .mini-action {
  display: inline-flex; align-items: center; gap: 4px;
  line-height: 1.4;
}
#profileDialog .annual-policy-actions .mini-action .bi {
  font-size: 11px; line-height: 1;
}
#profileDialog .annual-policy-actions-hidden {
  visibility: hidden;
}

/* ── Annual contracts column header row ── */
#profileDialog .annual-table-header {
  display: grid;
  grid-template-columns: var(--annual-cols);
  gap: 8px;
  align-items: center;
  padding: 5px 14px;
  border-bottom: 2px solid #e2e8f0;
  background: #f1f5f9;
  min-width: 680px;
}
#profileDialog .annual-th-icon,
#profileDialog .annual-th-cat,
#profileDialog .annual-th-product,
#profileDialog .annual-th-premium,
#profileDialog .annual-th-payment,
#profileDialog .annual-th-status,
#profileDialog .annual-th-dates,
#profileDialog .annual-th-actions {
  font-size: var(--fs-2xs);
  font-weight: 400;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: .03em;
  white-space: nowrap;
}
#profileDialog .annual-th-premium { text-align: left; }
#profileDialog .annual-th-status { text-align: center; }
#profileDialog .annual-th-actions { text-align: right; }

/* ── Annual contracts empty row ── */
#profileDialog .annual-empty-row {
  padding: 28px 14px;
  text-align: center;
}
#profileDialog .annual-empty-msg {
  margin: 0;
  font-size: var(--fs-base);
  color: #94a3b8;
  line-height: 1.6;
  font-weight: 400;
}

/* ── Responsive: annual year-body scrolls horizontally via overflow-x:auto; grid rows have min-width ── */

/* ── Responsive: dual cards stack on narrow screens ── */
@media (max-width: 680px) {
  #profileDialog .sf-dual-cards { grid-template-columns: 1fr; }
}

/* ── Font legibility: enlarged section titles ── */
#profileDialog .profile-panel.enhanced-panel h3 { font-size: var(--fs-lg); font-weight: 400; padding: 8px 12px; height: auto; min-height: 36px; line-height: 34px; }
#profileDialog .profile-kv-compact { min-height: 30px; line-height: 30px; }
#profileDialog .profile-kv-compact span { font-size: var(--fs-base); color: #657181; }
#profileDialog .profile-kv-compact b { font-size: var(--fs-md); font-weight: 400; }

/* ── Empty value styling ── */
#profileDialog .sf-kv b:empty::after { content: attr(data-nv); }
#profileDialog b.nv-empty { color: #b0b8c4; font-weight: 400; font-style: italic; }

/* ── Responsive: overview card ── */
@media (max-width: 900px) {
}
@media (max-width: 768px) {
  #profileDialog .ov-groups { grid-template-columns: 1fr; }
  #profileDialog .status-finance-grid { grid-template-columns: 1fr; gap: 12px; }
  #profileDialog .overview-audit { flex-direction: column; gap: 4px; }
  #profileDialog .sf-kv span { min-width: 90px; }
  #profileDialog .ov-field-label { min-width: 72px; }
}
@media (max-width: 500px) {
}

/* ── Policy cards grid inside profile ── */
/* Single product: one column, card takes natural width */

/* ── Empty policy card (no policies state) ── */
/* Empty policy state (no policies) */
#profileDialog .profile-policy-empty-msg p {
  margin: 0; max-width: 340px;
}

/* ── Policy card sections - redesigned vertical layout ── */
/* Top row: icon+category+product (left) | status badge (right) */
/* Status badge in top-right */

/* Middle: 2-column grid for insurance details */

/* Remaining days — separate full-width row */

/* Late fee row — fixed below remaining days */

/* Actions row — right-aligned at bottom */

/* ── Notes row inside first card ── */

/* ── Coverage / fee controls row ── */

/* ── Compact KV rows ── */
#profileDialog .profile-kv-compact { padding: 2px 0; border: none; gap: 4px; }
#profileDialog .profile-kv-compact span { font-size: var(--fs-2xs); color: #999; }
#profileDialog .profile-kv-compact b { font-size: var(--fs-xs); }

/* -- Supplement overview: independent section between workspace and products -- */
#profileDialog .supplement-overview {
  padding: 0;
  border: none;
  border-radius: 0;
  background: none;
}
#profileDialog .si-ov-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
#profileDialog .si-ov-title {
  font-size: var(--fs-sm);
  font-weight: 400;
  color: #334155;
}
#profileDialog .si-ov-head .si-edit-btn {
  border-color: #bfdbfe;
  background: #eff6ff;
  color: #1d4ed8;
}
/* ── Four independent info blocks, separated by gap not shared borders ── */
#profileDialog .si-ov-blocks {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
#profileDialog .si-block {
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid #edf1f7;
  border-radius: 8px;
  background: #fff;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
#profileDialog .si-block-icon {
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 7px;
  font-size: var(--fs-sm);
}
#profileDialog .si-block-icon-docs     { background: #edf3ff; color: #4776c9; }
#profileDialog .si-block-icon-remark   { background: #f3eeff; color: #7058d6; }
#profileDialog .si-block-icon-need     { background: #fff3e6; color: #cc8030; }
#profileDialog .si-block-icon-followup { background: #e8f5ec; color: #1d8c5e; }
#profileDialog .si-block-label {
  font-size: var(--fs-2xs);
  font-weight: 400;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: .3px;
  line-height: 1.2;
}
#profileDialog .si-block-value {
  font-size: var(--fs-xs);
  font-weight: 400;
  color: #334155;
  line-height: 1.4;
  word-break: break-word;
}
#profileDialog .si-block-value-empty {
  color: #94a3b8;
  font-style: italic;
}
/* Values inside info blocks — reset flex to work in column layout */
#profileDialog .si-block .si-cv {
  font-size: var(--fs-xs);
  font-weight: 400;
  color: #334155;
  line-height: 1.4;
  flex: none;
  word-break: break-word;
}
#profileDialog .si-block .si-cv-empty {
  color: #94a3b8;
  font-style: italic;
}
#profileDialog .si-block .si-cm {
  font-size: var(--fs-2xs);
  color: #94a3b8;
  line-height: 1.3;
  flex: none;
  width: 100%;
}
#profileDialog .si-block-docs {
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s;
}
#profileDialog .si-block-docs:hover {
  border-color: #bfd6f2;
  box-shadow: 0 1px 4px rgba(59, 130, 246, .06);
}
/* ── Tags row inside blocks ── */
#profileDialog .si-tags-row {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  align-items: center;
  min-height: 18px;
}
#profileDialog .si-tag {
  display: inline-block;
  font-size: var(--fs-2xs);
  font-weight: 400;
  color: #1e40af;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: 4px;
  padding: 1px 6px;
  line-height: 1.5;
  white-space: nowrap;
  max-width: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
}
#profileDialog .si-tag-overflow {
  color: #64748b;
  background: #f1f5f9;
  border-color: #e2e8f0;
  font-size: var(--fs-2xs);
}
/* --- Edit button (used in overview header and editor modal) --- */
#profileDialog .supplement-edit-row {
  margin-top: 6px;
  display: flex;
  justify-content: flex-end;
}
#profileDialog .si-edit-btn {
  font-size: var(--fs-xs);
  font-weight: 400;
  color: #475569;
  background: none;
  border: 1px solid #e2e8f0;
  border-radius: 4px;
  padding: 3px 10px;
  cursor: pointer;
  transition: border-color 0.15s, color 0.15s;
  white-space: nowrap;
}
#profileDialog .si-edit-btn:hover {
  border-color: #94a3b8;
  color: #1e293b;
}
#profileDialog .supplement-info-area.is-empty .si-edit-btn {
  font-size: var(--fs-xs);
  padding: 3px 10px;
}
/* ── Responsive: 2×2 on tablet, single-column on phone ── */
@media (max-width: 1100px) {
  #profileDialog .si-ov-blocks {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 600px) {
  #profileDialog .si-ov-blocks {
    grid-template-columns: 1fr;
  }
  #profileDialog .si-block {
    padding: 10px 12px;
    gap: 4px;
  }
  #profileDialog .si-block-icon {
    width: 26px;
    height: 26px;
  }
}


/* ── Compact identity/contact grid ── */
#profileDialog .profile-compact-grid { gap: 8px; margin-bottom: 10px; }
#profileDialog .profile-compact-grid .profile-section { padding: 8px 10px; }
#profileDialog .profile-compact-grid .profile-section h4 { font-size: var(--fs-xs); margin-bottom: 4px; }

/* ── Merged status card (CARD 2) ── */
#profileDialog .merged-chips { display: flex; gap: 6px; margin-bottom: 10px; flex-wrap: wrap; }
#profileDialog .merged-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; }
#profileDialog .merged-col { display: flex; flex-direction: column; gap: 2px; }

/* ── Responsive: single-column policy cards on narrow ── */
@media (max-width: 860px) {
  #profileDialog .merged-grid { grid-template-columns: 1fr; }
  #profileDialog .profile-hero-v2 { flex-direction: column; }
  #profileDialog .profile-hero-right { align-items: flex-start; }
  #profileDialog .profile-hero-right .hero-summary-items { justify-content: flex-start; }
}
@media (max-width: 600px) {
  #profileDialog .si-ov-grid { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════
   #profileDialog — Normalized Design System
   Typography: headings 14px, body/forms/buttons 13px, meta 12px
   Heights: standard 36px, compact 30px
   Cards: unified border/radius/spacing/header heights
   ═══════════════════════════════════════════════════════════ */

/* ── 1. Typography baseline ── */
#profileDialog { font-size: var(--fs-base); line-height: 1.5; }

/* Section headings → 14px (--fs-md) */
#profileDialog .profile-panel h3,
#profileDialog .profile-panel.enhanced-panel h3,
#profileDialog .profile-section h4,
#profileDialog .profile-full-card h4,
#profileDialog .sf-card-title,
#profileDialog .annual-year-label,
#profileDialog .sf-col-title,
#profileDialog .si-ov-title { font-size: var(--fs-md); font-weight: 400; line-height: 1.4; }

/* Body / forms / standard buttons → 13px (--fs-base) */
#profileDialog .ov-field-label,
#profileDialog .ov-field-value,
#profileDialog .sf-kv b,
#profileDialog .sf-kv span,
#profileDialog .profile-kv b,
#profileDialog .profile-kv span,
#profileDialog .profile-kv-compact b,
#profileDialog .profile-kv-compact span,
#profileDialog .sf-followup-grid .sf-fv-label,
#profileDialog .ppc-left-text b,
#profileDialog .ppc-mid-grid .ppc-meta-item,
#profileDialog .profile-policy b,
#profileDialog .profile-policy span,
#profileDialog .annual-policy-row,
#profileDialog .annual-policy-product,
#profileDialog .annual-policy-premium,
#profileDialog .annual-policy-payment { font-size: var(--fs-base); }

/* Secondary / meta / count → 12px (--fs-sm) */
#profileDialog .action-note,
#profileDialog .relation-row,
#profileDialog .followup-item,
#profileDialog .followup-item span,
#profileDialog .debt-summary-row,
#profileDialog .doc-item span,
#profileDialog .overview-audit,
#profileDialog .overview-audit b
#profileDialog .annual-year-stats,
#profileDialog .annual-policy-dates,
#profileDialog .annual-policy-cat,
#profileDialog .si-block-value,
#profileDialog .si-cv,
#profileDialog .ppc-days-row,
#profileDialog .ppc-status-badge,
#profileDialog .ppc-latefee-row,
#profileDialog .profile-hero p,
#profileDialog .profile-hero-status span,
#profileDialog .profile-hero-status b

/* Tiny labels → 11px (--fs-xs) */
#profileDialog .doc-item button,
#profileDialog .doc-item a,
#profileDialog .si-block-label,
#profileDialog .si-cm,
#profileDialog .si-tag,
#profileDialog .ppc-left-text .ppc-cat,
#profileDialog .annual-th-icon,
#profileDialog .annual-th-cat,
#profileDialog .annual-th-product,
#profileDialog .annual-th-premium,
#profileDialog .annual-th-payment,
#profileDialog .annual-th-status,
#profileDialog .annual-th-dates,
#profileDialog .annual-th-actions { font-size: var(--fs-xs); }

/* Buttons: 13px for standard, 12px for compact */
#profileDialog .pbb-btn,
#profileDialog .profile-quick-actions button { font-size: var(--fs-base); }
#profileDialog .mini-action,
#profileDialog .ppc-actions-row .mini-action,
#profileDialog .ppi-actions .mini-action,
#profileDialog .sf-edit-btn,
#profileDialog .section-title-btn,
#profileDialog .si-edit-btn,
#profileDialog .profile-quick-actions button.mini-action { font-size: var(--fs-sm); }

/* ── 2. Input / select / button heights ── */
/* Standard: 36px */
#profileDialog input[type="text"]:not(.latefee-amt):not(.ppc-cov-amount),
#profileDialog input[type="date"],
#profileDialog input[type="email"],
#profileDialog input[type="number"],
#profileDialog input:not([type]),
#profileDialog select:not(.latefee-select):not(.ppc-cov-select):not(.status-select),
#profileDialog .pbb-btn,
#profileDialog .profile-quick-actions button,
#profileDialog .followup-input-row input,
#profileDialog .followup-input-row button,
#profileDialog .birthday-row input,
#profileDialog .birthday-row button,
#profileDialog .relation-control select,
#profileDialog .relation-control button { height: 36px; line-height: 36px; padding-top: 0; padding-bottom: 0; box-sizing: border-box; }

/* Compact: 30px */
#profileDialog .mini-action,
#profileDialog .ppc-actions-row .mini-action,
#profileDialog .ppi-actions .mini-action,
#profileDialog .sf-edit-btn,
#profileDialog .section-title-btn,
#profileDialog .si-edit-btn,
#profileDialog .debt-inline-actions button,
#profileDialog .sf-inline-actions button { height: 30px; line-height: 30px; padding-top: 0; padding-bottom: 0; box-sizing: border-box; }

/* ── 3. Vertical icon/text alignment ── */
#profileDialog .modal-head h2,
#profileDialog .profile-panel h3,
#profileDialog .profile-full-card h4,
#profileDialog .sf-card-title { display: flex; align-items: center; gap: 8px; }
#profileDialog .section-h4-icon { line-height: 1; display: inline-flex; align-items: center; }
#profileDialog .ov-field,
#profileDialog .profile-kv,
#profileDialog .sf-kv,
#profileDialog .profile-kv-compact { display: flex; align-items: center; }
#profileDialog .annual-year-header { display: flex; align-items: center; }
#profileDialog .profile-product-cat { display: inline-flex; align-items: center; gap: 4px; }

/* ── 4. Unified card borders, radius, spacing ── */
#profileDialog .profile-panel,
#profileDialog .profile-section,
#profileDialog .profile-full-card,
#profileDialog .sf-card,
#profileDialog .si-block,
#profileDialog .profile-policy-card,
#profileDialog .annual-year-group { border: 1px solid #edf1f6; border-radius: 8px; }
#profileDialog .profile-panel,
#profileDialog .profile-full-card { margin-bottom: 12px; }
#profileDialog .profile-panel h3,
#profileDialog .profile-panel.enhanced-panel h3 { height: 36px; min-height: 36px; padding: 0 12px; line-height: 36px; border-bottom: 1px solid #edf1f6; background: #f8fafc; display: flex; align-items: center; }
#profileDialog .profile-full-card h4 { margin: 0 0 10px; padding-bottom: 8px; border-bottom: 1px solid #edf1f6; }

/* ── 5. Empty states ── */
#profileDialog .action-note { font-size: var(--fs-sm); color: #94a3b8; padding: 20px 12px; text-align: center; font-style: italic; line-height: 1.5; }
#profileDialog .annual-empty-msg { font-size: var(--fs-sm); color: #94a3b8; }
#profileDialog .profile-policy-empty-msg { font-size: var(--fs-sm); color: #64748b; }
#profileDialog .sf-fv-empty { font-size: var(--fs-sm); color: #94a3b8; }
#profileDialog b.nv-empty { font-size: var(--fs-sm); }

/* ── 6. Input/button baseline alignment & responsive wrapping ── */
#profileDialog .followup-input-row,
#profileDialog .birthday-row,
#profileDialog .relation-control { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
#profileDialog .followup-input-row input { flex: 1; min-width: 160px; }
#profileDialog .profile-bottom-bar .pbb-left,
#profileDialog .profile-bottom-bar .pbb-right { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

@media (max-width: 600px) {
  #profileDialog .followup-input-row,
  #profileDialog .birthday-row { flex-direction: column; align-items: stretch; }
  #profileDialog .followup-input-row input { flex: none; min-width: 0; }
  #profileDialog .profile-bottom-bar { flex-direction: column; align-items: stretch; gap: 8px; }
  #profileDialog .profile-bottom-bar .pbb-left,
  #profileDialog .profile-bottom-bar .pbb-right { width: 100%; justify-content: stretch; }
  #profileDialog .profile-bottom-bar .pbb-right { margin-left: 0; }
  #profileDialog .pbb-btn { flex: 1; text-align: center; }
}

/* 客户状态下拉选择框 */
.status-select { font-size: var(--fs-sm); padding: 2px 4px; border: 1px solid #ddd; border-radius: 4px; background: #fff; cursor: pointer; max-width: 160px; }
.status-select:focus { border-color: #1a73e8; outline: none; }

/* 客户状态下拉框 - 颜色区分 */
.status-select.status-prioritaires { background: #f3e8ff; color: #5b21b6; border-color: #c4b5fd; }
.status-select.status-debiteurs { background: #fee2e2; color: #991b1b; border-color: #fca5a5; }
.status-select.status-risque { background: #ffedd5; color: #9a3412; border-color: #fdba74; }
.status-select.status-client { background: #dcfce7; color: #166534; border-color: #86efac; }
.status-select.status-prospect { background: #dbeafe; color: #1e40af; border-color: #93c5fd; }
.status-select.status-temporaire { background: #cffafe; color: #155e75; border-color: #67e8f9; }
.status-select.status-attention { background: #fef9c3; color: #854d0e; border-color: #fde047; }
.status-select.status-complique { background: #fce7f3; color: #9d174d; border-color: #f9a8d4; }
.status-select.status-resilie { background: #e2e8f0; color: #334155; border-color: #cbd5e1; }
.status-select.status-noire { background: #e5e7eb; color: #111827; border-color: #9ca3af; }
.status-select:focus { border-color: #1a73e8; outline: none; box-shadow: 0 0 0 2px rgba(26,115,232,.15); }
/* ── Batch 3: Status chips (Issue 4.2: each has distinct border) ── */
.status-chip, .chip { display:inline-block; padding:2px 8px; border-radius:10px; font-size: var(--fs-xs); font-weight: 400; white-space:nowrap; border:1px solid transparent; }
.chip-priority,.chip-status-prioritaires{background:#f3e8ff;color:#5b21b6;border-color:#d8b4fe} .chip-debtors,.chip-debt,.chip-status-debiteurs{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
.chip-risk,.chip-status-risque{background:#ffedd5;color:#9a3412;border-color:#fdba74} .chip-normal,.chip-status-client{background:#dcfce7;color:#166534;border-color:#86efac}
.chip-prospect,.chip-status-prospect{background:#dbeafe;color:#1e40af;border-color:#93c5fd} .chip-temporaire,.chip-status-temporaire{background:#cffafe;color:#155e75;border-color:#67e8f9}
.chip-attention,.chip-status-attention{background:#fef9c3;color:#854d0e;border-color:#fde047} .chip-complique,.chip-status-complique{background:#fce7f3;color:#9d174d;border-color:#f9a8d4}
.chip-resilie,.chip-status-resilie{background:#e2e8f0;color:#334155;border-color:#cbd5e1} .chip-blacklist,.chip-status-noire{background:#e5e7eb;color:#111827;border-color:#9ca3af}
.chip-level{background:#eef2ff;color:#1a237e} .chip-ok{background:#dcfce7;color:#166534}
.status-chip-edit { font-size: var(--fs-sm); padding: 2px 4px; border-radius: 4px; border: 1px solid #ccc; max-width: 150px; }
.chip-debt{background:#fee2e2;color:#991b1b}
.merged-chips{display:flex;gap:6px;margin-bottom:10px;flex-wrap:wrap}
.merged-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.merged-col{display:flex;flex-direction:column;gap:4px}
.profile-updated{font-size: var(--fs-xs);color:var(--muted)}
/* ── Batch 3: Policy compact cards ── */
.policy-compact-card{border:1px solid var(--line);border-radius:8px;margin-bottom:6px;background:#fff;overflow:hidden}
.policy-compact-card.policy-urgent{border-left:3px solid var(--red)}
.policy-compact-row{display:flex;align-items:center;gap:6px;padding:8px 10px;cursor:pointer;font-size: var(--fs-sm);flex-wrap:wrap}
.policy-compact-row:hover{background:#f8faff}
.policy-cat{font-weight: 400;color:#1a237e;min-width:80px}
.policy-prod{flex:1;min-width:100px}
.policy-carr,.policy-num{color:var(--muted);font-size: var(--fs-xs)}
.policy-prem{font-weight: 400;color:var(--green)}
.policy-days{font-size: var(--fs-xs);font-weight: 400}
.policy-days.expiring{color:var(--red)}
.policy-stat{font-size: var(--fs-xs);padding:1px 6px;border-radius:4px;background:var(--bg)}
.policy-pay,.policy-cov{color:var(--muted);font-size: var(--fs-xs)}
.policy-expand-btn{border:0;background:none;font-size: var(--fs-md);cursor:pointer;color:var(--muted)}
.policy-menu{cursor:pointer;color:var(--muted);font-weight: 400}
.policy-detail{padding:10px 14px;border-top:1px solid var(--line);background:#fafbfc}
.policy-detail-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.policy-actions{display:flex;gap:8px;margin-top:10px}
.policy-actions button{padding:4px 10px;border:1px solid var(--line);border-radius:4px;background:#fff;cursor:pointer;font-size: var(--fs-xs)}
.policy-actions button:hover{background:var(--bg)}
.debt-history{margin-top:8px;font-size: var(--fs-xs)}
.debt-hist-row{display:flex;gap:8px;padding:4px 6px;border-bottom:1px solid var(--line);align-items:center}
.debt-hist-row.active{background:#fff5f5} .debt-hist-row.settled{background:#f0fff4}
.debt-hist-row span{color:var(--muted)} .debt-hist-row b{color:var(--red)} .debt-hist-row.settled b{color:var(--green)}
@media(max-width:768px){.merged-grid,.policy-detail-grid{grid-template-columns:1fr}}
/* ── Batch 3: Archives dual-column + trash ── */
.archives-dual{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.arch-col{border:1px solid var(--line);border-radius:8px;padding:10px;background:#fff}
.arch-col h4{font-size: var(--fs-base);margin:0 0 8px;color:#1a237e}
.arch-file-row{display:flex;align-items:center;gap:8px;padding:4px 0;border-bottom:1px solid var(--line);font-size: var(--fs-sm)}
.arch-fname{flex:1;font-weight: 400;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.arch-meta{color:var(--muted);font-size: var(--fs-2xs);white-space:nowrap}
.arch-actions{display:flex;gap:4px;flex-shrink:0}
.arch-upload-btn{cursor:pointer;color:#0967ff;font-size: var(--fs-xs);font-weight: 400;padding:4px 8px;border:1px dashed #0967ff;border-radius:4px;display:inline-block;margin-bottom:6px}
.arch-upload-btn:hover{background:#eef2ff}
.arch-trash{margin-top:12px;font-size: var(--fs-sm)}
.arch-trash summary{cursor:pointer;color:var(--red);font-weight: 400}
.trash-row{display:flex;align-items:center;gap:8px;padding:4px 0;font-size: var(--fs-xs)}
.trash-row span{flex:1} .trash-row small{color:var(--muted)}
@media(max-width:768px){.archives-dual{grid-template-columns:1fr}}

/* 月度趋势图 */
.trend-chart { display: flex; gap: 8px; align-items: flex-end; padding: 8px 0; justify-content: center; flex-wrap: wrap; }
.trend-col { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 48px; }
.trend-bars { display: flex; gap: 3px; align-items: flex-end; height: 120px; }
.trend-bar { width: 16px; border-radius: 3px 3px 0 0; transition: height .3s; }
.trend-bar.prem { background: linear-gradient(180deg, #1a73e8, #4285f4); }
.trend-bar.cust { background: linear-gradient(180deg, #14b86a, #34d399); }
.trend-label { font-size: var(--fs-xs); color: #666; }
.trend-val { font-size: var(--fs-2xs); color: #999; font-weight: 400; }
.trend-legend { display: flex; gap: 16px; justify-content: center; margin-bottom: 8px; }
.trend-dot { font-size: var(--fs-xs); }
.trend-dot::before { content: '●'; margin-right: 4px; }
.trend-dot.prem::before { color: #1a73e8; }
.trend-dot.cust::before { color: #14b86a; }

/* 续保率 */
.renewal-rate { display: flex; flex-direction: column; align-items: center; padding: 8px 0; }
.rate-circle { width: 100px; height: 100px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.rate-inner { width: 74px; height: 74px; border-radius: 50%; background: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.rate-inner b { font-size: var(--fs-3xl); line-height: 1; }
.rate-inner span { font-size: var(--fs-xs); color: #999; }

/* 动态流 */
.activity-feed { max-height: 280px; overflow-y: auto; }
.activity-item { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid #f0f0f0; font-size: var(--fs-sm); }
.activity-item:last-child { border-bottom: none; }
.act-icon { flex-shrink: 0; width: 22px; text-align: center; }
.act-text { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.act-time { flex-shrink: 0; font-size: var(--fs-2xs); color: #aaa; }

/* 收款状态标签 */
.rec-status { font-size: var(--fs-xs); padding: 2px 8px; border-radius: 10px; font-weight: 400; }
.rec-status.rec-ok { background: #e8f5e9; color: #2e7d32; }
.rec-status.rec-warning { background: #fff3e0; color: #e65100; }
.rec-status.rec-overdue { background: #ffebee; color: #c62828; }

/* ===== 角色权限：员工隐藏敏感数据 ===== */
body.role-employee .stat-premium,
body.role-employee .stat-profit,
body.role-employee .stat-revenue,
body.role-employee .stat-debt,
body.role-employee [data-page="finance"],
body.role-employee [data-mobile-page="finance"],
body.role-employee .nav-finance,
body.role-employee .finance-tab,
body.role-employee #nav-finance {
  display: none !important;
}

/* 员工：隐藏仪表盘金额卡片 */
body.role-employee .premium-card,
body.role-employee .revenue-card,
body.role-employee .profit-card,
body.role-employee .debt-card {
  display: none !important;
}

/* 员工：隐藏表格金额列（JS 标记 + CSS 加固） */
body.role-employee [data-finance-col] {
  display: none !important;
}

/* 员工：隐藏仪表盘金额卡片 */
body.role-employee .premium-card,
body.role-employee .revenue-card,
body.role-employee .profit-card,
body.role-employee .debt-card {
  display: none !important;
}

/* 老板：显示用户管理入口 */
body.role-boss .boss-only {
  display: flex !important;
}
body:not(.role-boss) .boss-only {
  display: none !important;
}

/* ===== 保险公司信件上传页面 ===== */
.doc-panel { padding: 16px; }
.upload-zone {
  border: 2px dashed #ccc;
  border-radius: 12px;
  padding: 48px 24px;
  text-align: center;
  cursor: pointer;
  transition: all .2s;
  background: #fafbfc;
}
.upload-zone:hover, .upload-zone.drag-over {
  border-color: #2563eb;
  background: #eff6ff;
}
.upload-icon { font-size: var(--fs-display); margin-bottom: 12px; }
.upload-hint { color: #888; font-size: var(--fs-base); margin-top: 8px; }
.upload-progress { margin-top: 16px; }
.spinner {
  width: 36px; height: 36px;
  border: 3px solid #e5e7eb;
  border-top-color: #2563eb;
  border-radius: 50%;
  animation: spin .8s linear infinite;
  margin: 0 auto 8px;
}
@keyframes spin { to { transform: rotate(360deg); } }
.upload-result { margin-top: 16px; }
.upload-result h3 { margin: 0 0 12px; }
.result-stats {
  display: flex; gap: 16px; flex-wrap: wrap; margin-bottom: 16px;
}
.result-stat {
  background: #f0f9ff; border: 1px solid #bae6fd;
  border-radius: 8px; padding: 12px 16px; min-width: 120px;
}
.result-stat .label { font-size: var(--fs-sm); color: #666; }
.result-stat .value { font-size: var(--fs-2xl); font-weight: 400; color: #1e40af; }
.result-table { max-height: 400px; overflow: auto; }
.result-table table { width: 100%; border-collapse: collapse; font-size: var(--fs-base); }
.result-table th { background: #f8fafc; padding: 8px; text-align: left; border-bottom: 2px solid #e5e7eb; position: sticky; top: 0; }
.result-table td { padding: 6px 8px; border-bottom: 1px solid #f1f5f9; }
.result-table tr.matched { background: #f0fdf4; }
.result-table tr.unmatched { background: #fff7ed; }
.match-badge {
  display: inline-block; padding: 2px 8px; border-radius: 10px; font-size: var(--fs-xs);
}
.match-badge.matched { background: #dcfce7; color: #16a34a; }
.match-badge.unmatched { background: #ffedd5; color: #ea580c; }
.rec-summary {
  display: flex; gap: 16px; margin-bottom: 16px; flex-wrap: wrap;
}
.rec-card {
  background: linear-gradient(135deg, #1e40af, #3b82f6);
  color: #fff; border-radius: 10px; padding: 16px 20px; min-width: 140px;
}
.rec-card .rec-label { font-size: var(--fs-sm); opacity: .8; }
.rec-card .rec-value { font-size: var(--fs-3xl); font-weight: 400; margin-top: 4px; }
.doc-detail-modal {
  position: fixed; inset: 0; background: rgba(0,0,0,.5);
  display: flex; align-items: center; justify-content: center; z-index: 9999;
}
.doc-detail-card {
  background: #fff; border-radius: 12px; padding: 24px; max-width: 900px;
  width: 95%; max-height: 85vh; overflow: auto;
}

/* 员工角色隐藏：保险公司信件 */
.role-employee #profileLettersSection { display: none !important; }

/* v116: contract-year navigation and viewport-safe dialogs */
.ai-product-shell #contractsPage { min-width: 0; overflow: hidden; }
.ai-product-shell #contractsPage .list-toolbar,
.ai-product-shell #contractsPage .tabs {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 8px;
  overflow-x: auto;
  scrollbar-width: thin;
}
.ai-product-shell #contractsPage .list-toolbar > *,
.ai-product-shell #contractsPage .tabs > * { flex: 0 0 auto; white-space: nowrap; }
.ai-product-shell #contractsPage .table-shell {
  width: 100%;
  min-width: 0;
  overflow: auto !important;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  -webkit-overflow-scrolling: touch;
}
.ai-product-shell #contractsPage .data-table { min-width: 900px; }
.policy-year-header { display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; }
.policy-year-toggle { display: inline-flex; align-items: center; gap: 6px; min-width: 170px; padding: 5px 8px; border: 0; background: transparent; color: #153e75; font-weight: 400; cursor: pointer; }
.policy-year-toggle:focus-visible { outline: 3px solid rgba(9,103,255,.18); border-radius: 8px; }
.policy-year-tools { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex: 1 1 420px; min-width: 260px; }
.policy-year-tools input[type="search"] { width: min(100%, 560px); min-width: 260px; height: 34px; border: 1px solid #cfe0f7; border-radius: 9px; padding: 0 12px; background: #fff; }
.policy-year-tools input[type="search"]:focus { outline: none; border-color: #0967ff; box-shadow: 0 0 0 3px rgba(9,103,255,.12); }
.year-delete-direct {
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  border: 1px solid #f4b8be;
  border-radius: 9px;
  background: #fff5f6;
  color: #c72a3a;
  font-size: var(--fs-xl);
  line-height: 1;
  cursor: pointer;
}
.year-delete-direct:hover { background: #ffe7e9; border-color: #e47782; }
.policy-category-with-icon { display: inline-flex; align-items: center; gap: 5px; font-weight: 400; }
.policy-year-empty { padding: 18px !important; color: #64748b; text-align: center; background: #f8fafc; }
.year-action { margin-left: 8px; font-size: var(--fs-xs); font-weight: 400; color: #5588bb; padding: 1px 8px; border: 1px solid #cfe0f7; border-radius: 10px; background: #f0f6ff; white-space: nowrap; }
#addPolicyYearBtn, #removePolicyYearBtn { font-weight: 400; }

dialog.modal,
dialog[open].modal {
  position: fixed !important;
  inset: 0 !important;
  margin: auto !important;
  max-width: calc(100vw - 24px) !important;
  max-height: calc(100dvh - 24px) !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 14px !important;
}
dialog.modal > .modal-card,
dialog.modal > form.modal-card,
.modal .modal-card {
  width: min(100%, 1100px) !important;
  max-width: 100% !important;
  max-height: calc(100dvh - 32px) !important;
  margin: 0 auto !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
}
dialog.modal .modal-head { position: sticky; top: 0; z-index: 4; background: inherit; }
dialog.modal .modal-actions { position: sticky; bottom: 0; z-index: 4; background: inherit; }

@media (max-width: 760px) {
  .policy-year-header { align-items: stretch; flex-direction: column; gap: 8px; }
  .policy-year-toggle { min-width: 0; justify-content: flex-start; }
  .policy-year-tools { flex: 1 1 auto; width: 100%; min-width: 0; justify-content: stretch; }
  .policy-year-tools input[type="search"] { width: 100%; min-width: 220px; }
  dialog.modal, dialog[open].modal { max-width: calc(100vw - 12px) !important; max-height: calc(100dvh - 12px) !important; }
  dialog.modal > .modal-card, dialog.modal > form.modal-card, .modal .modal-card { max-height: calc(100dvh - 20px) !important; padding-left: 14px !important; padding-right: 14px !important; }
  /* 窄屏：表单改为单列 */
  .form-grid { grid-template-columns: 1fr !important; }
  .modal-head h2 { font-size: var(--fs-md); }
  .modal-actions { flex-wrap: wrap; gap: 6px; }
  .modal-actions button { flex: 1 1 auto; min-width: 80px; }
}

/* 平板适配（761-1024px） */
@media (min-width: 761px) and (max-width: 1024px) {
  dialog.modal, dialog[open].modal { max-width: calc(100vw - 32px) !important; max-height: calc(100dvh - 32px) !important; }
  dialog.modal > .modal-card, dialog.modal > form.modal-card, .modal .modal-card { max-height: calc(100dvh - 40px) !important; }
  .form-grid { grid-template-columns: 1fr 1fr !important; }
}

/* 确保弹窗内表格和长文本不撑破视口 */
.modal-card table, .modal-card pre, .modal-card code {
  max-width: 100%;
  word-break: break-word;
  overflow-wrap: break-word;
}
.modal-card img, .modal-card svg { max-width: 100%; height: auto; }
.modal-card input, .modal-card select, .modal-card textarea { max-width: 100%; }

/* ═══════════════════════════════════════════════════════
   Contract Annual Page v119
   ═══════════════════════════════════════════════════════ */

/* Expand/Collapse all bar */
.annual-expand-collapse-bar {
  margin-bottom: 10px;
}
.annual-expand-collapse-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 18px;
  border: 1px solid #d7e4f8;
  border-radius: 8px;
  background: #fff;
  color: #0967ff;
  font-weight: 400;
  font-size: var(--fs-base);
  cursor: pointer;
  transition: background .15s, border-color .15s;
}
.annual-expand-collapse-btn:hover {
  background: #eef4ff;
  border-color: #0967ff;
}

/* Year header row */
.year-break td {
  padding: 0 !important;
  background: #f8fafd;
  border-bottom: 2px solid #d7e4f8;
}
.policy-year-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 16px;
  flex-wrap: wrap;
}
.policy-year-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 8px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  cursor: pointer;
  font-size: var(--fs-md);
  color: #1a237e;
  transition: background .12s;
}
.policy-year-toggle:hover { background: #e8ecf6; }
.policy-year-toggle .year-arrow {
  font-size: var(--fs-xs);
  width: 16px;
  text-align: center;
  color: #64748b;
}
.policy-year-toggle strong {
  font-size: var(--fs-md);
  font-weight: 400;
  color: #1a237e;
}
.policy-year-toggle .year-stats {
  font-size: var(--fs-sm);
  color: #64748b;
  font-weight: 400;
  background: #eef2f7;
  padding: 2px 8px;
  border-radius: 10px;
}
.policy-year-toggle .year-hint {
  font-size: var(--fs-xs);
  color: #0967ff;
  font-weight: 400;
}
.year-archived-badge {
  font-size: var(--fs-xs);
  color: #92400e;
  background: #fef3c7;
  padding: 2px 8px;
  border-radius: 10px;
  font-weight: 400;
}
.policy-year-tools {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.year-search-input {
  width: 260px;
  height: 32px;
  border: 1px solid #d7e4f8;
  border-radius: 8px;
  padding: 0 10px;
  font-size: var(--fs-sm);
  background: #fff;
  color: #334155;
}
.year-search-input:focus {
  border-color: #0967ff;
  outline: none;
  box-shadow: 0 0 0 2px rgba(9,103,255,.12);
}
.year-search-input::placeholder { color: #94a3b8; font-size: var(--fs-xs); }

/* Year menu (ellipsis) */
.year-menu-wrapper { position: relative; display: inline-block; }
.year-menu-trigger {
  width: 30px;
  height: 30px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  font-size: var(--fs-lg);
  font-weight: 400;
  color: #64748b;
  cursor: pointer;
  transition: background .12s, border-color .12s;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.year-menu-trigger:hover { background: #eef2f7; border-color: #d7e4f8; }
.year-menu-dropdown {
  position: absolute;
  right: 0;
  top: 100%;
  z-index: 100;
  min-width: 160px;
  background: #fff;
  border: 1px solid #d7e4f8;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(15,23,42,.12);
  padding: 4px;
  display: flex;
  flex-direction: column;
}
.year-menu-dropdown button {
  display: block;
  width: 100%;
  text-align: left;
  padding: 8px 14px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  font-size: var(--fs-base);
  color: #334155;
  cursor: pointer;
  font-weight: 400;
  white-space: nowrap;
}
.year-menu-dropdown button:hover { background: #f1f5f9; }
.year-menu-dropdown button.danger { color: #e33d3d; }
.year-menu-dropdown button.danger:hover { background: #fef2f2; }

/* Empty year message */
.policy-year-empty {
  text-align: center;
  padding: 24px 16px !important;
  color: #94a3b8;
  font-size: var(--fs-base);
  font-style: italic;
}

/* Add year row */
.add-year-row td {
  padding: 12px 16px !important;
  background: transparent;
  border-top: 1px dashed #d7e4f8;
}
.add-year-area {
  display: flex;
  justify-content: center;
  padding: 8px 0;
}
.add-year-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 20px;
  border: 2px dashed #c7d2e8;
  border-radius: 10px;
  background: transparent;
  color: #0967ff;
  font-weight: 400;
  font-size: var(--fs-base);
  cursor: pointer;
  transition: background .15s, border-color .15s;
}
.add-year-btn:hover {
  background: #eef4ff;
  border-color: #0967ff;
}

/* Contract row inside year sections */
[data-policy-year-row] td {
  padding: 6px 10px;
  font-size: var(--fs-base);
}
[data-policy-year-row] .policy-product-cell b {
  display: block;
  font-size: var(--fs-base);
  color: #1e293b;
}
[data-policy-year-row] .policy-product-cell span {
  display: block;
  font-size: var(--fs-xs);
  color: #64748b;
  margin-top: 2px;
}
[data-policy-year-row] .policy-year {
  display: block;
  font-size: var(--fs-2xs);
  color: #94a3b8;
  margin-top: 2px;
}

/* Contract table last column (Statut) is shown — actions are embedded within */

/* Policy status badges */
.policy-status {
  font-size: var(--fs-sm);
  font-weight: 400;
  padding: 2px 8px;
  border-radius: 8px;
  white-space: nowrap;
}

/* Policy actions (inline in rows) — compact */
.policy-actions {
  display: inline-flex;
  gap: 4px;
  flex-wrap: wrap;
}
.policy-actions button {
  font-size: var(--fs-xs);
  padding: 3px 8px;
  border: 1px solid #d7e4f8;
  border-radius: 6px;
  background: #fff;
  color: #0967ff;
  cursor: pointer;
  font-weight: 400;
  white-space: nowrap;
}
.policy-actions button:hover { background: #eef4ff; }
.policy-actions button.danger { color: #e33d3d; border-color: #fecaca; }
.policy-actions button.danger:hover { background: #fef2f2; }

/* Responsive: mobile adjustments */
@media (max-width: 768px) {
  .policy-year-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  .policy-year-tools {
    width: 100%;
    justify-content: space-between;
  }
  .year-search-input { width: 100%; max-width: none; }
  .year-menu-dropdown {
    right: auto;
    left: 0;
  }
  .annual-expand-collapse-bar {
    text-align: center;
  }
}

/* Desktop: internal table scroll */
@media (min-width: 769px) {
  #contractsPage .table-shell {
    overflow: auto !important;
  }
}

/* ═══ Mobile bottom nav ═══ */
.mobile-bottom-nav {
  display: none;
  position: fixed;
  bottom: 0; left: 0; right: 0;
  z-index: 2500;
  background: #fff;
  border-top: 1px solid #e6edf7;
  grid-template-columns: repeat(5, 1fr);
  padding: 4px 0 env(safe-area-inset-bottom, 4px);
}
.mobile-bottom-nav button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  border: 0;
  background: transparent;
  color: #64748b;
  font-size: var(--fs-md);
  padding: 6px 4px;
  cursor: pointer;
}
.mobile-bottom-nav button span { font-size: var(--fs-xl); }
.mobile-bottom-nav button small { font-size: var(--fs-2xs); font-weight: 400; }
.mobile-bottom-nav button.active { color: #0967ff; }
.mobile-bottom-nav button.active small { color: #0967ff; }
.mobile-bottom-nav button[data-nav-group="boss"] { display: none; }
.mobile-bottom-nav.is-boss button[data-nav-group="boss"] { display: flex; }
@media (max-width: 768px) {
  .mobile-bottom-nav { display: grid; }
  .workspace { padding-bottom: 56px; }
}

/* ═══ Logo sizing: GP 48-52px, brand region 72-76px ═══ */
.gp-brand {
  min-height: 72px;
  max-height: 76px;
}
.gp-logo svg {
  width: 48px;
  height: 48px;
  min-width: 48px;
}
@media (min-width: 769px) {
  .gp-logo svg { width: 52px; height: 52px; min-width: 52px; }
}

/* ═══ Sidebar collapse: 210-220px → 64px ═══ */
.icon-rail {
  width: 210px;
  min-width: 210px;
  transition: width .22s ease, min-width .22s ease;
}
.icon-rail.collapsed {
  width: 64px;
  min-width: 64px;
}
@media (prefers-reduced-motion: reduce) {
  .icon-rail { transition: none; }
}
/* Subtle white sidebar divider */
.list-sidebar {
  border-right: 1px solid #eef2f7;
}

/* ═══ Dialog: centered, internal scroll, sticky header/footer ═══ */
.modal[open] {
  display: flex;
  align-items: center;
  justify-content: center;
}
.modal-card {
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.modal-card .modal-head {
  position: sticky;
  top: 0;
  z-index: 2;
  background: inherit;
  padding-bottom: 8px;
}
.modal-card .modal-actions {
  position: sticky;
  bottom: 0;
  z-index: 2;
  background: inherit;
  padding-top: 8px;
}
.modal-card .form-grid {
  overflow-y: auto;
}
/* Two-column on desktop, single-column on mobile */
@media (min-width: 769px) {
  .modal-card .form-grid {
    grid-template-columns: 1fr 1fr;
  }
  .modal-card .form-grid .wide {
    grid-column: span 2;
  }
}
@media (max-width: 768px) {
  .modal-card {
    width: calc(100vw - 24px);
    max-width: 390px;
    margin: 0 auto;
  }
  .modal-card .form-grid {
    grid-template-columns: 1fr;
  }
}

/* ═══════════════════════════════════════════════════════
   Contract Page v119 — Urgency Bands, Row Actions, Login, Renewal WS
   ═══════════════════════════════════════════════════════ */

/* ── Global search toolbar input ── */
#policyGlobalSearch {
  width: 320px;
  height: 34px;
  border: 1px solid #d7e4f8;
  border-radius: 10px;
  padding: 0 14px;
  font-size: var(--fs-base);
  background: #fff;
  color: #334155;
}
#policyGlobalSearch:focus {
  border-color: #0967ff;
  outline: none;
  box-shadow: 0 0 0 3px rgba(9,103,255,.12);
}
#policyGlobalSearch::placeholder { color: #94a3b8; font-size: var(--fs-sm); }

/* ── Urgency band colors ── */
.urgency-red {
  background: #fef2f2 !important;
}
.urgency-orange {
  background: #fff7ed !important;
}
.urgency-blue {
  background: #eff6ff !important;
}
.urgency-band {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 8px;
  border-radius: 8px;
  font-size: var(--fs-2xs);
  font-weight: 400;
  white-space: nowrap;
}
.urgency-red .urgency-band {
  background: #fecaca;
  color: #991b1b;
}
.urgency-orange .urgency-band {
  background: #fed7aa;
  color: #9a3412;
}
.urgency-blue .urgency-band {
  background: #bfdbfe;
  color: #1e40af;
}

/* ── Row actions (embedded in status column) ── */
.policy-row-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
  flex-wrap: nowrap;
}
.renew-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 12px;
  border: 1px solid #0967ff;
  border-radius: 6px;
  background: #0967ff;
  color: #fff;
  font-weight: 400;
  font-size: var(--fs-sm);
  cursor: pointer;
  white-space: nowrap;
  transition: background .15s;
}
.renew-btn:hover {
  background: #0754d1;
  border-color: #0754d1;
}

/* ── Row More menu ── */
.row-menu-wrapper {
  position: relative;
  display: inline-block;
}
.row-menu-trigger {
  width: 28px;
  height: 28px;
  border: 1px solid #d7e4f8;
  border-radius: 6px;
  background: #fff;
  font-size: var(--fs-md);
  font-weight: 400;
  color: #64748b;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background .12s, border-color .12s;
}
.row-menu-trigger:hover {
  background: #eef4ff;
  border-color: #0967ff;
}
.row-menu-dropdown {
  position: absolute;
  right: 0;
  top: 100%;
  z-index: 120;
  min-width: 150px;
  background: #fff;
  border: 1px solid #d7e4f8;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(15,23,42,.14);
  padding: 4px;
  display: flex;
  flex-direction: column;
}
.row-menu-dropdown button {
  display: block;
  width: 100%;
  text-align: left;
  padding: 7px 14px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  font-size: var(--fs-sm);
  color: #334155;
  cursor: pointer;
  font-weight: 400;
  white-space: nowrap;
  transition: background .12s;
}
.row-menu-dropdown button:hover { background: #f1f5f9; }
.row-menu-dropdown button.danger { color: #e33d3d; }
.row-menu-dropdown button.danger:hover { background: #fef2f2; }

/* ── Login card compact ── */
.auth-brand {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-bottom: 16px;
}
.auth-brand svg {
  flex-shrink: 0;
}
.auth-brand-text {
  font-size: var(--fs-2xl);
  font-weight: 400;
  color: #1a237e;
  letter-spacing: .02em;
}
.auth-brand-text small {
  font-size: var(--fs-xs);
  color: #0967ff;
  font-weight: 400;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-left: 4px;
  vertical-align: super;
}
.cloud-auth-card {
  width: min(380px, calc(100vw - 32px));
  padding: 32px 28px;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 28px 70px rgba(8, 21, 46, .28);
}
.cloud-auth-card h2 {
  margin: 0 0 4px;
  font-size: var(--fs-2xl);
  text-align: center;
}
.cloud-auth-card p {
  margin: 0 0 20px;
  color: #6b7480;
  line-height: 1.5;
  text-align: center;
  font-size: var(--fs-base);
}
.cloud-auth-card input {
  width: 100%;
  height: 46px;
  border: 1px solid #dbe6f5;
  border-radius: 12px;
  padding: 0 14px;
  outline: none;
  margin-bottom: 8px;
  font-size: var(--fs-md);
}
.cloud-auth-card button {
  width: 100%;
  height: 46px;
  margin-top: 8px;
  border: 0;
  border-radius: 12px;
  color: #fff;
  background: linear-gradient(135deg, #0967ff, #10cbe8);
  font-weight: 400;
  font-size: var(--fs-md);
  cursor: pointer;
  transition: opacity .15s;
}
.cloud-auth-card button:hover {
  opacity: .92;
}
.cloud-auth-error {
  min-height: 18px;
  margin-top: 8px;
  color: #ff0a50;
  font-weight: 400;
  font-size: var(--fs-sm);
  text-align: center;
}

/* ── Renewal workspace overlay ── */
.renewal-workspace-overlay {
  position: absolute;
  inset: 0;
  z-index: 200;
  background: rgba(8, 21, 46, .32);
  backdrop-filter: blur(4px);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 40px 16px;
  overflow-y: auto;
}
.renewal-workspace-panel {
  width: min(1100px, 100%);
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 20px 60px rgba(8, 21, 46, .24);
  overflow: hidden;
  max-height: calc(100vh - 80px);
  display: flex;
  flex-direction: column;
}
.renewal-workspace-head {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 24px;
  border-bottom: 1px solid #e6edf5;
  flex-shrink: 0;
}
.renewal-workspace-head h2 {
  margin: 0;
  font-size: var(--fs-xl);
  color: #1a237e;
  flex: 1;
}
.renewal-workspace-head p {
  margin: 0;
  color: #64748b;
  font-size: var(--fs-base);
  font-weight: 400;
}
.renewal-close-btn {
  width: 32px;
  height: 32px;
  border: 1px solid #d7e4f8;
  border-radius: 8px;
  background: #fff;
  font-size: var(--fs-xl);
  color: #64748b;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .12s;
}
.renewal-close-btn:hover { background: #f1f5f9; }
.renewal-workspace-body {
  padding: 16px 24px 24px;
  overflow-y: auto;
  flex: 1;
}
.renewal-empty {
  text-align: center;
  color: #94a3b8;
  padding: 40px 0;
  font-size: var(--fs-md);
}
.renewal-band-group {
  margin-bottom: 24px;
}
.renewal-band-header {
  margin: 0 0 10px;
  padding: 8px 14px;
  border-radius: 8px;
  font-size: var(--fs-md);
  font-weight: 400;
}
.renewal-band-header.urgency-red {
  background: #fee2e2;
  color: #991b1b;
}
.renewal-band-header.urgency-orange {
  background: #ffedd5;
  color: #9a3412;
}
.renewal-band-header.urgency-blue {
  background: #dbeafe;
  color: #1e40af;
}
.renewal-table {
  width: 100%;
  min-width: 700px;
}
.renewal-table th {
  font-size: var(--fs-xs);
  background: #f8fafd;
}
.renewal-table td {
  font-size: var(--fs-base);
}
.renewal-ws-renew {
  font-size: var(--fs-xs) !important;
  padding: 3px 10px !important;
}

/* ── Contract tab counts ── */
#policyTabs .tab .tab-count {
  display: inline-block;
  margin-left: 4px;
  padding: 1px 7px;
  border-radius: 8px;
  font-size: var(--fs-xs);
  font-weight: 400;
  font-style: normal;
  background: #eef2f7;
  color: #64748b;
  min-width: 20px;
  text-align: center;
}
#policyTabs .tab.active .tab-count {
  background: rgba(9,103,255,.12);
  color: #0967ff;
}

/* ── Language toggle ZH button ── */
.gp-lang-toggle .lang-zh {
  min-width: 44px;
}
.topbar .gp-lang-toggle {
  border-color: #cfe0f4;
  background: #fff;
}
.topbar .gp-lang-toggle button { color: #64748b; background: transparent; }
.topbar .gp-lang-toggle button.active { color: #fff; background: transparent; }
.topbar .gp-lang-toggle button:not(.active):hover { color: #0967ff; background: #eef4ff; }
.topbar .gp-lang-toggle::after { background: #0967ff; }
.gp-brand-gp { display: none; }
.gp-brand { gap: 10px; padding-left: 8px; padding-right: 8px; }
.gp-logo { flex: 0 0 52px; width: 52px; display: grid; place-items: center; }
.gp-brand-text { flex: 1 1 auto; min-width: 0; overflow: visible; }
.gp-brand-text strong { font-size: var(--fs-md); }
.gp-brand-pro { font-size: var(--fs-sm); }
/* Hide old auth lang toggle */
.auth-lang-toggle { display: none !important; }

/* ── Contract toolbar dropdown buttons ── */
#policyToolbar .toolbar-dropdown-btn {
  height: 30px;
  padding: 0 12px;
  border: 1px solid #d7e4f8;
  border-radius: 8px;
  background: #fff;
  color: #334155;
  font-size: var(--fs-sm);
  font-weight: 400;
  cursor: pointer;
  white-space: nowrap;
  transition: background .12s;
}
#policyToolbar .toolbar-dropdown-btn:hover { background: #eef4ff; }
#policyToolbar .toolbar-dropdown-wrapper {
  position: relative;
  display: inline-block;
}
#policyToolbar .dropdown-menu {
  position: absolute;
  right: 0;
  top: 100%;
  z-index: 110;
  min-width: 200px;
  background: #fff;
  border: 1px solid #d7e4f8;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(15,23,42,.14);
  padding: 4px;
  display: none;
  flex-direction: column;
}
#policyToolbar .dropdown-menu button {
  display: block;
  width: 100%;
  text-align: left;
  padding: 8px 14px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  font-size: var(--fs-sm);
  color: #334155;
  cursor: pointer;
  font-weight: 400;
  white-space: nowrap;
}
#policyToolbar .dropdown-menu button:hover { background: #f1f5f9; }
#policyToolbar .dropdown-sep {
  height: 1px;
  background: #e6edf5;
  margin: 4px 8px;
}

/* ── Toolbar search ── */
#policyToolbar .toolbar-group input[type="search"] {
  height: 30px;
  border: 1px solid #d7e4f8;
  border-radius: 8px;
  padding: 0 12px;
  font-size: var(--fs-sm);
  background: #fff;
  color: #334155;
}
#policyToolbar .toolbar-group input[type="search"]:focus {
  border-color: #0967ff;
  outline: none;
  box-shadow: 0 0 0 2px rgba(9,103,255,.12);
}

/* ── Toolbar new contract button ── */
#newPolicyBtn {
  height: 30px;
  padding: 0 14px;
  border: 0;
  border-radius: 8px;
  background: #0967ff;
  color: #fff;
  font-weight: 400;
  font-size: var(--fs-sm);
  cursor: pointer;
  white-space: nowrap;
  transition: background .15s;
}
#newPolicyBtn:hover { background: #0754d1; }

/* ── Renewal workspace toolbar button ── */
#renewalWorkspaceBtn {
  height: 30px;
  padding: 0 14px;
  border: 1px solid #0967ff;
  border-radius: 8px;
  background: #fff;
  color: #0967ff;
  font-weight: 400;
  font-size: var(--fs-sm);
  cursor: pointer;
  white-space: nowrap;
  transition: background .12s;
}
#renewalWorkspaceBtn:hover { background: #eef4ff; }
#renewalWorkspaceBtn em {
  font-style: normal;
  display: inline-block;
  margin-left: 4px;
  padding: 1px 7px;
  border-radius: 8px;
  font-size: var(--fs-xs);
  font-weight: 400;
  background: #0967ff;
  color: #fff;
}

/* ── Responsive: toolbar wraps on small screens ── */
@media (max-width: 900px) {
  #policyToolbar {
    flex-wrap: wrap !important;
  }
  #policyGlobalSearch {
    width: 100%;
  }
  #policyToolbar .toolbar-group {
    flex: 0 1 auto;
  }
}

/* ── Contract table minimum width for horizontal scroll ── */
#contractsDataTable {
  min-width: 980px;
}

/* ── Native menu dialogs (detail + audit sub-dialogs) — showModal() top-layer ── */
dialog.native-menu-dialog {
  /* Override generic .modal styles that would make this full-width */
  width: auto !important;
  max-width: none !important;
  min-width: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  /* Positioned via inline style top/left by JS */
}
dialog.native-menu-dialog::backdrop {
  background: transparent !important;
}

/* ── Policy menu portal — fixed-position div dropdown (Issue 2: no dialog top-layer) ── */
.policy-menu-portal {
  position: fixed;
  z-index: 10000;
  min-width: 200px;
  max-width: 228px;
  display: none;
}
.policy-menu-portal .policy-menu-dropdown {
  background: var(--card-bg, #fff);
  border: 1px solid #d4dce6;
  border-radius: 8px;
  padding: 6px;
  box-shadow: 0 6px 28px rgba(0,0,0,.16), 0 2px 8px rgba(0,0,0,.08);
  overflow: hidden;
  min-width: 200px;
  max-width: 228px;
}

/* Policy detail dialog — the inner content card */
dialog.policy-detail-dlg {
  display: flex;
  align-items: center;
  justify-content: center;
}
dialog.policy-detail-dlg::backdrop {
  background: rgba(20, 31, 45, .42) !important;
}
dialog.policy-detail-dlg .modal-card {
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 20px 80px rgba(0,0,0,.25);
}

/* Policy audit dialog */
dialog.policy-audit-dlg {
  display: flex;
  align-items: center;
  justify-content: center;
}
dialog.policy-audit-dlg::backdrop {
  background: rgba(20, 31, 45, .42) !important;
}

/* ═══ v120: Batch 4 comprehensive fixes ═══ */

/* Row More menu trigger */
.row-more-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 6px;
  transition: background .15s;
}
.row-more-trigger:hover {
  background: #e8ecf1;
  color: #0f172a;
}

/* Row More menu portal */
.row-more-portal {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.row-menu-item {
  color: #334155;
  transition: background .12s;
}
.row-menu-item:hover {
  background: #f1f5f9;
}
.row-menu-item-danger:hover {
  background: #fef2f2;
}

/* Expiry alarm badge */
.expiry-alarm-badge {
  font-weight: 400;
  white-space: nowrap;
  vertical-align: middle;
}
.expiry-alarm-badge.multi {
  background: #fef2f2;
  color: #dc2626;
  padding: 1px 6px;
  border-radius: 10px;
  font-size: var(--fs-xs);
}

/* Alarm popover */
.alarm-popover {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.alarm-pop-item:hover {
  background: #f8fafc;
}

/* Status + Finance card */
.sf-chips {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.sf-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
@media (max-width: 640px) {
  .sf-grid {
    grid-template-columns: 1fr;
  }
}
.sf-col h5 {
  margin: 0 0 8px;
  font-size: var(--fs-base);
  font-weight: 400;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: .03em;
}

/* Status chip colors */
.status-chip {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 12px;
  font-size: var(--fs-sm);
  font-weight: 400;
  white-space: nowrap;
}

/* Explicit empty value styling */
td[data-editable] {
  min-width: 40px;
}

/* Toolbar dropdown positioning */
.toolbar-dropdown-wrapper {
  position: relative;
}
.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  min-width: 200px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
  padding: 4px 0;
}
.dropdown-menu.open {
  display: block;
}
.dropdown-menu button {
  display: block;
  width: 100%;
  text-align: left;
  padding: 8px 14px;
  border: none;
  background: none;
  font-size: var(--fs-base);
  color: #334155;
  cursor: pointer;
  white-space: nowrap;
}
.dropdown-menu button:hover {
  background: #f1f5f9;
}
.dropdown-menu .dropdown-sep {
  height: 1px;
  background: #e2e8f0;
  margin: 4px 0;
}
.dropdown-menu button.destructive-action {
  color: #dc2626;
  font-weight: 400;
}
.dropdown-menu button.destructive-action:hover {
  background: #fef2f2;
}

/* Modals: centered, scroll, two-column */
dialog.modal {
  margin: auto;
  border: none;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0,0,0,.2);
}
.modal-card {
  max-height: 85vh;
  overflow-y: auto;
}
.modal-head {
  position: sticky;
  top: 0;
  background: #fff;
  z-index: 5;
  padding: 16px 20px;
  border-bottom: 1px solid #e2e8f0;
}
.modal-actions {
  position: sticky;
  bottom: 0;
  background: #fff;
  z-index: 5;
  padding: 12px 20px;
  border-top: 1px solid #e2e8f0;
}

/* Two-column form grid on desktop */
@media (min-width: 640px) {
  .form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
  .form-grid .wide {
    grid-column: 1 / -1;
  }
}

/* Customer form pair rows */
.customer-form-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.customer-form-pair.wide {
  grid-column: 1 / -1;
}

/* Profile dialogue sections */
.profile-panel.enhanced-panel {
  background: #fff;
  border: 1px solid #e8ecf1;
  border-radius: 10px;
  padding: 16px;
  margin-bottom: 12px;
}

/* Import preview table */
.import-preview-dialog .modal-card {
  max-width: 1100px;
  max-height: 90vh;
}

/* Row badge indicators */
.row-badge-new {
  background: #dcfce7;
  color: #166534;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: var(--fs-xs);
  font-weight: 400;
}
.row-badge-exists {
  background: #fef9c3;
  color: #854d0e;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: var(--fs-xs);
  font-weight: 400;
}

/* Progress bar */
.import-progress {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 0;
}
.progress-bar {
  height: 6px;
  background: #e2e8f0;
  border-radius: 3px;
  overflow: hidden;
}
.progress-fill {
  height: 100%;
  background: #0967ff;
  width: 0%;
  transition: width .3s ease;
}

/* Selection toolbar visibility — class-based toggle (no style-attr hack) */
#toolbarSelection {
  display: none;
}
#toolbarSelection.active {
  display: flex !important;
  align-items: center;
  gap: 6px;
}

/* Table sticky columns */
#customersTable th:first-child,
#customersTable td:first-child {
  position: sticky;
  left: 0;
  z-index: 2;
  background: #fff;
}

/* Category chips — no wrap, all visible */
.category-chips-cell {
  white-space: normal;
  line-height: 1.8;
}
.cat-tag {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: var(--fs-xs);
  padding: 2px 7px;
  border-radius: 4px;
  margin: 1px 2px;
  white-space: nowrap;
  font-weight: 400;
}

/* Team page: remove right blank */
.team-table-shell {
  width: 100%;
  overflow-x: auto;
}
.team-table {
  width: 100%;
}
#teamPage .team-page-head .team-head-actions {
  flex-shrink: 0;
}

/* Responsive: modals at narrow viewport */
@media (max-width: 640px) {
  dialog.modal {
    max-width: 98vw;
    margin: 1vh auto;
    border-radius: 10px;
  }
  .modal-card {
    max-height: 88vh;
    padding: 12px;
  }
  .form-grid {
    grid-template-columns: 1fr;
  }
  .customer-form-pair {
    grid-template-columns: 1fr;
  }
  .sf-grid {
    grid-template-columns: 1fr;
  }
  .archive-dual {
    grid-template-columns: 1fr;
  }
}

/* ═══════════════════════════════════════════════════════
   Item 8: Data Maintenance Dialog (customer-data-maintenance.js)
   ═══════════════════════════════════════════════════════ */

.toolbar-maintenance-btn {
  background: var(--bg, #f4f7fb);
  border: 1px solid var(--line, #e6edf5);
  border-radius: 6px;
  padding: 7px 14px;
  font-size: var(--fs-base);
  cursor: pointer;
  color: var(--text, #263238);
  white-space: nowrap;
  transition: background 0.15s, border-color 0.15s;
}
.toolbar-maintenance-btn:hover:not(:disabled) {
  background: var(--line, #e6edf5);
  border-color: var(--blue, #2f80ed);
}
.toolbar-maintenance-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

/* Data maintenance dialog — uses existing .modal / #actionDialog system */
.dm-form {
  padding: 0;
  max-height: 70vh;
  overflow-y: auto;
}

.dm-group {
  border: 1px solid var(--line, #e6edf5);
  border-radius: 8px;
  margin-bottom: 16px;
  padding: 12px 16px;
  background: #fff;
}

.dm-group-legend {
  font-weight: 400;
  font-size: var(--fs-md);
  color: var(--blue, #2f80ed);
  padding: 0 8px;
}

.dm-group-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 16px;
}

.dm-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.dm-field-full {
  grid-column: 1 / -1;
}

.dm-label {
  font-size: var(--fs-sm);
  font-weight: 400;
  color: var(--muted, #7d8a99);
  text-transform: none;
  display: flex;
  align-items: center;
  gap: 6px;
}

.dm-system-badge {
  font-size: var(--fs-2xs);
  font-weight: 400;
  color: var(--muted, #7d8a99);
  background: var(--bg, #f4f7fb);
  border-radius: 3px;
  padding: 1px 6px;
}

.dm-input {
  width: 100%;
  padding: 7px 10px;
  border: 1px solid var(--line, #e6edf5);
  border-radius: 5px;
  font-size: var(--fs-base);
  color: var(--text, #263238);
  background: #fff;
  transition: border-color 0.15s;
  box-sizing: border-box;
}

.dm-input:focus {
  outline: none;
  border-color: var(--blue, #2f80ed);
  box-shadow: 0 0 0 2px rgba(47, 128, 237, 0.12);
}

.dm-input.dm-readonly {
  background: var(--bg, #f4f7fb);
  color: var(--muted, #7d8a99);
  cursor: default;
}

/* Data Maintenance: select+custom combo */
.dm-field-select-custom {
  grid-column: 1 / -1;
}
.dm-select-custom-wrap {
  display: flex;
  gap: 8px;
}
.dm-select-custom-wrap select {
  flex: 0 0 auto;
  min-width: 180px;
}
.dm-select-custom-wrap input[type="text"] {
  flex: 1 1 auto;
  min-width: 120px;
}

/* Data Maintenance: checkbox label */
.dm-checkbox-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: var(--fs-base);
  font-weight: 400;
  cursor: pointer;
  padding: 6px 0;
}
.dm-checkbox-label input[type="checkbox"] {
  width: 16px;
  height: 16px;
  cursor: pointer;
}

/* Data Maintenance: save button */
.dm-save-btn {
  font-weight: 400;
}

textarea.dm-input {
  resize: vertical;
  min-height: 60px;
}

/* (Issue 9.1/9.6) Compact money input with € suffix */
.dm-money-wrap {
  display: flex;
  align-items: center;
  gap: 0;
}
.dm-money-wrap .dm-input {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  flex: 1;
}
.dm-money-suffix {
  display: inline-flex;
  align-items: center;
  padding: 7px 10px;
  border: 1px solid var(--line, #e6edf5);
  border-left: 0;
  border-radius: 0 5px 5px 0;
  background: #f4f7fb;
  font-size: var(--fs-base);
  font-weight: 400;
  color: #64748b;
  white-space: nowrap;
  box-sizing: border-box;
}

.dm-checkbox-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--fs-base);
  font-weight: 400;
  color: var(--text, #263238);
  cursor: pointer;
  padding: 4px 0;
}

.dm-checkbox-label input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--blue, #2f80ed);
}

.dm-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 14px 0 0;
  border-top: 1px solid var(--line, #e6edf5);
  margin-top: 12px;
  position: sticky;
  bottom: 0;
  background: var(--panel, #ffffff);
}

.dm-save-btn {
  padding: 8px 22px;
  border: none;
  border-radius: 6px;
  background: var(--blue, #2f80ed);
  color: #fff;
  font-size: var(--fs-base);
  font-weight: 400;
  cursor: pointer;
  transition: background 0.15s;
}
.dm-save-btn:hover:not(:disabled) {
  background: var(--blue-dark, #2170dc);
}
.dm-save-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.dm-cancel-btn {
  padding: 8px 22px;
  border: 1px solid var(--line, #e6edf5);
  border-radius: 6px;
  background: var(--bg, #f4f7fb);
  color: var(--text, #263238);
  font-size: var(--fs-base);
  font-weight: 400;
  cursor: pointer;
  transition: background 0.15s;
}
.dm-cancel-btn:hover {
  background: var(--line, #e6edf5);
}

.dm-error-msg {
  margin-top: 10px;
  padding: 8px 12px;
  background: #fff0f0;
  border: 1px solid #ffcdd2;
  border-radius: 5px;
  color: var(--red, #e33d3d);
  font-size: var(--fs-sm);
}

.dm-loading,
.dm-error {
  padding: 32px;
  text-align: center;
  color: var(--muted, #7d8a99);
  font-size: var(--fs-md);
}

/* Narrow screen: single column */
@media (max-width: 768px) {
  .dm-group-fields {
    grid-template-columns: 1fr;
  }
  .dm-actions {
    flex-direction: column-reverse;
    gap: 8px;
  }
  .dm-save-btn,
  .dm-cancel-btn {
    width: 100%;
  }
}

/* ensure modal-card scrolls, bottom buttons stay visible */
.modal-card {
  max-height: 85vh;
  display: flex;
  flex-direction: column;
}
.modal-card .dm-form {
  flex: 1;
  overflow-y: auto;
  min-height: 0;
}
#actionDialog .modal-head {
  flex-shrink: 0;
}

/* ── Item 8a: Customer chooser for data maintenance ── */
.dm-chooser { display:flex; flex-direction:column; gap:8px; min-height:240px; max-height:50vh; }
.dm-chooser-search { width:100%; padding:8px 12px; border:1px solid var(--line,#e6edf5); border-radius:6px; font-size: var(--fs-md); outline:none; box-sizing:border-box; }
.dm-chooser-search:focus { border-color:var(--blue,#2463eb); box-shadow:0 0 0 3px rgba(36,99,235,.12); }
.dm-chooser-list { flex:1; overflow-y:auto; border:1px solid var(--line,#e6edf5); border-radius:6px; }
.dm-chooser-row { display:flex; align-items:center; gap:12px; padding:8px 12px; border-bottom:1px solid #f0f4f9; cursor:pointer; font-size: var(--fs-base); transition:background .12s; }
.dm-chooser-row:last-child { border-bottom:0; }
.dm-chooser-row:hover,
.dm-chooser-row:focus { background:var(--highlight,#eef3ff); outline:none; }
.dm-chooser-name { font-weight: 400; color:var(--text,#263238); min-width:120px; }
.dm-chooser-meta { color:#64748b; font-size: var(--fs-sm); }
.dm-chooser-empty { padding:24px; text-align:center; color:#94a3b8; font-style:italic; }

/* ── Item 9: Compact queue tabs (3 rows, no large gaps) ── */
#customerTabs { flex-wrap: nowrap; overflow-x: auto; min-height: 34px; -webkit-overflow-scrolling: touch; }
#customerTabs .tab { padding: 5px 14px; font-size: var(--fs-sm); white-space: nowrap; flex-shrink: 0; }
/* Fix 2: Prevent malformed count values from stretching tabs/pills horizontally */
#customerTabs .tab .tab-count { max-width: 64px; overflow: hidden; text-overflow: ellipsis; display: inline-block; vertical-align: middle; }
#customerTabs::-webkit-scrollbar { height: 3px; }
#customerTabs::-webkit-scrollbar-thumb { background: #d4dce6; border-radius: 2px; }
/* (Issue 8) More dropdown section labels */
.dm-section-label { display:block; padding:6px 10px 2px; font-size: var(--fs-2xs); font-weight: 400; color:#94a3b8; text-transform:uppercase; letter-spacing:.5px; }
.dm-inline-select { width:calc(100% - 20px); margin:2px 10px 6px; padding:4px 6px; font-size: var(--fs-sm); border:1px solid #d4dce6; border-radius:4px; box-sizing:border-box; }
.list-toolbar { gap: 5px; padding: 4px 0 6px; flex-wrap: nowrap; overflow-x: auto; align-items: center; }
.toolbar-group { display: flex; align-items: center; gap: 4px; }
#enhancedFilterRow { display: flex; gap: 8px; padding: 4px 0; flex-wrap: wrap; }

/* ── Item 10: Table layout — fixed table for stable column widths, horizontal scroll */
#customersTable { table-layout: fixed; width: auto; min-width: 7000px; }

/* ══════════════════════════════════════════════════════════════════
   TOOLBAR V2 — single compact row, selection mode replaces toolbar
   All children unified: height / padding / border / radius / font / line-height
   ══════════════════════════════════════════════════════════════════ */
#customerToolbar {
  min-height: 44px;
  height: auto;
  padding: 6px 12px;
  gap: 6px;
  display: flex;
  align-items: center;
  overflow-x: auto;
  overflow-y: visible;
  white-space: nowrap;
  scrollbar-width: thin;
  border-bottom: 1px solid var(--line);
  background: #f7f8fb;
}
#customerToolbar::-webkit-scrollbar { height: 4px; }
#customerToolbar::-webkit-scrollbar-thumb { background: #ccc; border-radius: 2px; }
#customerToolbar .toolbar-row {
  display: flex;
  align-items: center;
  gap: 5px;
  flex: 1;
  min-width: 0;
  flex-wrap: nowrap;
}
/* ── Unified button: all <button> children including toolbar-dropdown-btn ── */
#customerToolbar .toolbar-row button,
#customerToolbar .toolbar-row .toolbar-dropdown-btn {
  height: 30px;
  line-height: 1;
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 0 10px;
  color: #4c5a6a;
  background: #fff;
  font-size: var(--fs-sm);
  font-weight: normal;
  cursor: pointer;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  flex-shrink: 0;
  transition: all .15s;
}
#customerToolbar .toolbar-row button:hover,
#customerToolbar .toolbar-row .toolbar-dropdown-btn:hover {
  color: #1c71cf;
  border-color: #b9daf9;
  background: #f0f6ff;
}
/* ── Unified select: same height / border / radius / font as buttons ── */
#customerToolbar .toolbar-row .toolbar-select {
  height: 30px;
  line-height: 1;
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 0 7px;
  color: #4c5a6a;
  background: #fff;
  font-size: var(--fs-sm);
  font-weight: normal;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  max-width: 170px;
}
/* ── Unified search input: same height as buttons, pushed right by spacer ── */
#customerToolbar .toolbar-search-input {
  height: 30px;
  line-height: 1;
  min-width: 140px;
  max-width: 280px;
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 0 10px;
  font-size: var(--fs-sm);
  background: #fff;
  flex-shrink: 1;
  box-sizing: border-box;
}
#customerToolbar .toolbar-search-input:focus { border-color: #b9daf9; outline: none; }
/* Keep legacy bare-class selector for any search outside #customerToolbar */
.toolbar-search-input {
  height: 30px;
  min-width: 140px;
  max-width: 280px;
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 0 10px;
  font-size: var(--fs-sm);
  background: #fff;
  flex-shrink: 1;
}
.toolbar-search-input:focus { border-color: #b9daf9; outline: none; }
.toolbar-spacer { flex: 1; min-width: 12px; }
.selection-count {
  font-size: var(--fs-base);
  font-weight: 400;
  color: #0967ff;
  padding: 0 4px;
  white-space: nowrap;
  flex-shrink: 0;
}
.destructive-action {
  color: #e33d3d !important;
  border-color: #fecaca !important;
}
.destructive-action:hover {
  background: #fef2f2 !important;
  border-color: #e33d3d !important;
}
/* ── More menu (always visible for sort/followup/note) ── */
#toolbarMore { display: inline-flex; }
#toolbarMore .dropdown-menu > * { display: block; }
@media (max-width: 1100px) {
  /* Narrow screen: allow toolbar row to scroll horizontally */
  #customerToolbar .toolbar-row {
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
  }
  #customerToolbar .toolbar-row::-webkit-scrollbar { height: 3px; }
}

/* ══════════════════════════════════════════════════════════════════
   SIDEBAR V2 — centered customer navigation module
   ══════════════════════════════════════════════════════════════════ */
.customer-nav-module {
  width: 88%;
  margin: 0 auto;
  padding: 0;
}
.customer-nav-module .side-search {
  padding: 12px 0 8px;
}
.customer-nav-module .side-search input {
  width: 100%;
  height: 30px;
  border: 1px solid var(--line);
  border-radius: 15px;
  padding: 0 14px;
  background: #fff;
  outline: none;
  font-size: var(--fs-sm);
}
.side-all-customers {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  font-weight: 400 !important;
  border-radius: 6px !important;
  margin-bottom: 2px;
}
.side-count-badge {
  display: inline-flex;
  min-width: 20px;
  max-width: 80px;
  height: 18px;
  justify-content: center;
  align-items: center;
  border-radius: 9px;
  color: #fff;
  background: #64748b;
  font-style: normal;
  font-size: var(--fs-xs);
  padding: 0 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.side-all-customers .side-count-badge {
  background: #0967ff;
}
.status-list-v2 {
  padding: 2px 0;
}
.status-heading {
  font-size: var(--fs-2xs);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #94a3b8;
  padding: 10px 8px 2px;
  font-weight: 400;
}
.status-divider {
  height: 1px;
  background: var(--line);
  margin: 4px 8px 8px;
  opacity: 0.6;
}
.side-status-row {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 34px !important;
  padding: 0 10px !important;
  border-radius: 4px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  border-left: 3px solid transparent !important;
  transition: background .12s;
}
.side-status-row:hover { background: #f0f4ff; }
.side-status-row.active {
  background: rgba(9,103,255,0.08) !important;
  border-left-color: #2563eb !important;
}
/* (Issue 8.A) Preserve dot color when active — don't override text color */
.side-status-row.active .side-status-text { color: inherit; }
.side-status-row.active .side-count-badge { opacity: 1; }
.side-dot {
  width: 10px;
  height: 10px;
  flex: 0 0 10px;
  border-radius: 50%;
  box-shadow: 0 0 0 3px color-mix(in srgb, currentColor 16%, transparent);
}
.side-status-text {
  flex: 1;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: var(--fs-sm);
}
/* Status dot colors — background + color for consistent box-shadow glow */
.dot-priority { background: #7c3aed; color: #7c3aed; }
.dot-debtors { background: #dc2626; color: #dc2626; }
.dot-risk { background: #ea580c; color: #ea580c; }
.dot-normal { background: #16a34a; color: #16a34a; }
.dot-prospect { background: #2563eb; color: #2563eb; }
.dot-temporaire { background: #0891b2; color: #0891b2; }
.dot-attention { background: #ca8a04; color: #ca8a04; }
.dot-complique { background: #db2777; color: #db2777; }
.dot-resilie { background: #64748b; color: #64748b; }
.dot-blacklist { background: #111827; color: #111827; }
/* Scope group */
.scope-group {
  margin-top: 4px;
}
.scope-heading {
  font-size: var(--fs-2xs);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #94a3b8;
  padding: 10px 8px 2px;
  font-weight: 400;
}
.scope-divider {
  height: 1px;
  background: var(--line);
  margin: 4px 8px 8px;
  opacity: 0.6;
}

/* ══════════════════════════════════════════════════════════════════
   DISPLAY & TABLE SETTINGS MODAL
   ══════════════════════════════════════════════════════════════════ */
/* ── Display Settings Dialog — redesigned: responsive width, scrollable col list, fixed nav/footer ── */

dialog[open].modal.display-settings-modal {
  width: clamp(540px, 60vw, 900px) !important;
  max-width: 96vw !important;
  max-height: 82vh !important;
  border-radius: 10px !important;
}

.ds-shell {
  display: flex;
  flex-direction: column;
  max-height: 82vh;
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
}

.ds-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 18px;
  border-bottom: 1px solid var(--line);
  flex-shrink: 0;
  background: #fff;
}
.ds-head h2 { margin: 0; font-size: var(--fs-lg); font-weight: 400; }
.ds-close {
  border: none; background: none; font-size: var(--fs-2xl); cursor: pointer;
  color: #94a3b8; padding: 0 4px; line-height: 1;
}
.ds-close:hover { color: #333; }

.ds-body {
  display: flex;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

/* ── Left nav: 160px, fixed ── */
.ds-left-nav {
  width: 160px;
  flex-shrink: 0;
  padding: 6px 0;
  border-right: 1px solid var(--line);
  background: #fafbfc;
  overflow-y: auto;
}

.ds-cat {
  display: block;
  width: 100%;
  border: none;
  background: transparent;
  padding: 9px 16px;
  text-align: left;
  font-size: var(--fs-base);
  color: #475569;
  cursor: pointer;
  border-radius: 0;
  transition: background .12s;
  white-space: nowrap;
}
.ds-cat:hover { background: #f0f4ff; }
.ds-cat.active { background: #e8f0fe; color: #0967ff; font-weight: 400; }

/* ── Right panel: fills remaining space, internal scroll ── */
.ds-right-panel {
  flex: 1;
  min-width: 0;
  padding: 14px 18px;
  overflow-y: auto;
  overflow-x: hidden;
}

/* Panel body: flex column so col-list can fill available height */
.ds-panel-body {
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

.ds-hint {
  font-size: var(--fs-xs);
  color: #94a3b8;
  margin: 0 0 10px;
  flex-shrink: 0;
}

/* ── Column list: fills space, scrolls internally ── */
.ds-col-list {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 1px;
  margin: 0 -6px;
  padding: 0 6px;
}

/* ── Each column row: horizontal alignment ── */
.ds-col-item {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 6px;
  border-radius: 4px;
  font-size: var(--fs-sm);
  min-height: 32px;
  transition: background .1s;
}
.ds-col-item:hover { background: #f0f4ff; }
.ds-col-item.locked { opacity: 0.7; }

/* Drag handle */
.ds-col-drag-handle {
  flex-shrink: 0;
  cursor: grab;
  font-size: var(--fs-lg);
  color: #94a3b8;
  padding: 2px 3px;
  user-select: none;
  line-height: 1;
}
.ds-col-drag-handle:active { cursor: grabbing; }

/* Checkbox in col row */
.ds-col-item input[type="checkbox"] {
  margin: 0;
  flex-shrink: 0;
}

/* Column name: fills remaining horizontal space */
.ds-col-name {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--fs-sm);
}

/* Lock / fixed-status button */
.ds-col-sticky {
  flex-shrink: 0;
  display: flex;
  align-items: center;
}
.ds-sticky-btn {
  border: none;
  background: none;
  cursor: pointer;
  font-size: var(--fs-md);
  opacity: 0.35;
  padding: 2px 4px;
  border-radius: 3px;
  line-height: 1;
}
.ds-sticky-btn.active { opacity: 1; }
.ds-sticky-btn:hover { opacity: 0.8; background: #f0f4ff; }

/* Move up/down button group */
.ds-col-move-btns {
  display: flex;
  flex-shrink: 0;
  gap: 2px;
}
.ds-move-btn {
  border: none;
  background: none;
  cursor: pointer;
  font-size: var(--fs-2xs);
  padding: 3px 5px;
  border-radius: 3px;
  color: #64748b;
  line-height: 1;
}
.ds-move-btn:hover:not(:disabled) { background: #e8f0fe; color: #334155; }
.ds-move-btn:disabled { opacity: 0.2; cursor: default; }

/* ── Column actions toolbar (Show all / Restore defaults) ── */
.ds-col-actions {
  display: flex;
  gap: 6px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
  flex-shrink: 0;
}

.ds-btn-sm {
  height: 28px;
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 0 10px;
  background: #fff;
  color: #475569;
  font-size: var(--fs-xs);
  cursor: pointer;
  white-space: nowrap;
}
.ds-btn-sm:hover { background: #f0f4ff; border-color: #b9daf9; }

/* ── Density / Sort radio rows ── */
.ds-radio-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  margin-bottom: 6px;
  cursor: pointer;
  transition: all .1s;
}
.ds-radio-row:hover { border-color: #b9daf9; }
.ds-radio-row.active { border-color: #0967ff; background: #f0f7ff; }
.ds-radio-row input { margin: 0; flex-shrink: 0; }
.ds-radio-row span b { display: block; }
.ds-radio-row span small { color: #94a3b8; }

.ds-subsection { margin-top: 14px; }
.ds-subsection label { font-size: var(--fs-sm); color: #475569; }
.ds-subsection select {
  margin-top: 4px;
  width: 100%;
  height: 32px;
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 0 8px;
  font-size: var(--fs-base);
}

/* ── Theme appearance grid ── */
.ds-theme-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.ds-theme-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 16px 10px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  transition: all .15s;
}
.ds-theme-card:hover { border-color: #b9daf9; }
.ds-theme-card.active { border-color: #0967ff; background: #f0f7ff; }
.ds-theme-icon { font-size: var(--fs-3xl); }
.ds-theme-label { font-size: var(--fs-sm); font-weight: 400; }

/* ── Footer: fixed bottom bar (Cancel → Restore → SaveAsDefault → Save) ── */
.ds-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  padding: 10px 16px;
  border-top: 1px solid var(--line);
  background: #fafbfc;
  flex-shrink: 0;
}

.ds-btn {
  height: 32px;
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: 0 14px;
  background: #fff;
  color: #475569;
  font-size: var(--fs-sm);
  cursor: pointer;
  white-space: nowrap;
  font-weight: 400;
}
.ds-btn:hover { background: #f0f4ff; }

.ds-btn-primary {
  background: #0967ff;
  color: #fff;
  border-color: #0967ff;
  font-weight: 400;
}
.ds-btn-primary:hover { background: #0753d6; }

.ds-btn-outline {
  background: transparent;
  color: #0967ff;
  border-color: #0967ff;
  font-size: var(--fs-xs);
}
.ds-btn-outline:hover { background: #f0f7ff; }

/* ── Narrow screen ≤640px: top-bottom layout, horizontal category tabs ── */
@media (max-width: 640px) {
  dialog[open].modal.display-settings-modal {
    width: calc(100vw - 12px) !important;
    max-width: 100vw !important;
    max-height: 94vh !important;
    margin: 0 auto !important;
  }
  .ds-shell {
    max-height: 94vh;
    border-radius: 8px;
  }
  .ds-body {
    flex-direction: column;
  }
  /* Left nav becomes horizontal category bar */
  .ds-left-nav {
    width: 100%;
    flex-shrink: 0;
    display: flex;
    flex-direction: row;
    padding: 4px 8px;
    border-right: none;
    border-bottom: 1px solid var(--line);
    overflow-x: auto;
    overflow-y: hidden;
  }
  .ds-cat {
    white-space: nowrap;
    padding: 7px 12px;
    font-size: var(--fs-sm);
    flex-shrink: 0;
    width: auto;
    border-radius: 4px;
    margin: 0 2px;
  }
  .ds-right-panel {
    padding: 10px 12px;
  }
  .ds-col-list {
    margin: 0 -4px;
    padding: 0 4px;
  }
  .ds-footer {
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 4px;
    padding: 8px 12px;
  }
  .ds-btn {
    height: 30px;
    padding: 0 10px;
    font-size: var(--fs-xs);
  }
  .ds-head {
    padding: 10px 14px;
  }
  .ds-theme-grid {
    gap: 8px;
  }
  .ds-theme-card {
    padding: 12px 8px;
  }
  .ds-col-item {
    gap: 4px;
    padding: 5px 4px;
    font-size: var(--fs-xs);
  }
}
/* ══════════════════════════════════════════════════════════════════
   PHASE 3 TABLE — Requirement 6: fixed table layout, explicit column widths,
   min row height 64px, word wrapping, horizontal scroll, sticky columns
   ══════════════════════════════════════════════════════════════════ */
#customersTable td, #customersTable th {
  padding: 5px 8px;
  vertical-align: middle;
  font-size: var(--fs-sm);
}
#customersTable td:last-child, #customersTable th:last-child { padding-right: 6px; }

/* ── Requirement 6: Explicit column widths for all 53 customer data columns ── */
#customersTable th[data-col="_select"],
#customersTable td[data-col="_select"] { width: 42px; text-align: center; }
#customersTable th[data-col="name"],
#customersTable td[data-col="name"] { width: 240px; }
#customersTable th[data-col="status"],
#customersTable td[data-col="status"] { width: 130px; text-align: center; }
#customersTable th[data-col="phone"],
#customersTable td[data-col="phone"] { width: 145px; }
#customersTable th[data-col="email"],
#customersTable td[data-col="email"] { width: 240px; }
#customersTable th[data-col="dossier"],
#customersTable td[data-col="dossier"] { width: 120px; }
#customersTable th[data-col="address"],
#customersTable td[data-col="address"] { width: 300px; text-align: left; }
#customersTable th[data-col="postal_code"],
#customersTable td[data-col="postal_code"] { width: 100px; text-align: center; }
#customersTable th[data-col="city"],
#customersTable td[data-col="city"] { width: 170px; }
#customersTable th[data-col="contract_category"],
#customersTable td[data-col="contract_category"] { width: 220px; }
#customersTable th[data-col="contracts_bought"],
#customersTable td[data-col="contracts_bought"] { width: 300px; }
#customersTable th[data-col="contact"],
#customersTable td[data-col="contact"] { width: 180px; text-align: left; }
#customersTable th[data-col="remark"],
#customersTable td[data-col="remark"] { width: 280px; text-align: left; }
#customersTable th[data-col="need"],
#customersTable td[data-col="need"] { width: 200px; text-align: left; }
#customersTable th[data-col="wechat"],
#customersTable td[data-col="wechat"] { width: 130px; }
#customersTable th[data-col="id"],
#customersTable td[data-col="id"] { width: 100px; text-align: center; }
#customersTable th[data-col="source"],
#customersTable td[data-col="source"] { width: 120px; text-align: left; }
#customersTable th[data-col="followed_at"],
#customersTable td[data-col="followed_at"] { width: 120px; text-align: center; }
#customersTable th[data-col="created_at"],
#customersTable td[data-col="created_at"] { width: 120px; text-align: center; }
#customersTable th[data-col="created_by"],
#customersTable td[data-col="created_by"] { width: 130px; text-align: left; }
#customersTable th[data-col="updated_at"],
#customersTable td[data-col="updated_at"] { width: 120px; text-align: center; }
#customersTable th[data-col="acquired_at"],
#customersTable td[data-col="acquired_at"] { width: 120px; text-align: center; }
#customersTable th[data-col="follow_count"],
#customersTable td[data-col="follow_count"] { width: 90px; text-align: center; }
#customersTable th[data-col="deal_count"],
#customersTable td[data-col="deal_count"] { width: 90px; text-align: center; }
#customersTable th[data-col="first_deal_at"],
#customersTable td[data-col="first_deal_at"] { width: 110px; text-align: center; }
#customersTable th[data-col="last_deal_at"],
#customersTable td[data-col="last_deal_at"] { width: 110px; text-align: center; }
#customersTable th[data-col="deal_cycle"],
#customersTable td[data-col="deal_cycle"] { width: 100px; text-align: center; }
#customersTable th[data-col="deal_product_count"],
#customersTable td[data-col="deal_product_count"] { width: 110px; text-align: center; }
#customersTable th[data-col="deal_total"],
#customersTable td[data-col="deal_total"] { width: 110px; text-align: center; }
#customersTable th[data-col="profit"],
#customersTable td[data-col="profit"] { width: 100px; text-align: center; }
#customersTable th[data-col="owner"],
#customersTable td[data-col="owner"] { width: 130px; text-align: left; }
#customersTable th[data-col="contact_count"],
#customersTable td[data-col="contact_count"] { width: 90px; text-align: center; }
#customersTable th[data-col="first_follow_at"],
#customersTable td[data-col="first_follow_at"] { width: 120px; text-align: center; }
#customersTable th[data-col="first_follow_duration"],
#customersTable td[data-col="first_follow_duration"] { width: 100px; text-align: center; }
#customersTable th[data-col="first_follow_by"],
#customersTable td[data-col="first_follow_by"] { width: 130px; text-align: left; }
#customersTable th[data-col="last_follow_content"],
#customersTable td[data-col="last_follow_content"] { width: 200px; text-align: left; }
#customersTable th[data-col="last_follow_by"],
#customersTable td[data-col="last_follow_by"] { width: 130px; text-align: left; }
#customersTable th[data-col="shared"],
#customersTable td[data-col="shared"] { width: 80px; text-align: center; }
#customersTable th[data-col="total_received"],
#customersTable td[data-col="total_received"] { width: 120px; text-align: center; }
#customersTable th[data-col="receipt_ratio"],
#customersTable td[data-col="receipt_ratio"] { width: 100px; text-align: center; }
#customersTable th[data-col="debt_total"],
#customersTable td[data-col="debt_total"] { width: 120px; text-align: center; }
#customersTable th[data-col="refund_total"],
#customersTable td[data-col="refund_total"] { width: 120px; text-align: center; }
#customersTable th[data-col="refund_count"],
#customersTable td[data-col="refund_count"] { width: 100px; text-align: center; }
#customersTable th[data-col="last_receipt_at"],
#customersTable td[data-col="last_receipt_at"] { width: 130px; text-align: center; }
#customersTable th[data-col="last_receipt_amount"],
#customersTable td[data-col="last_receipt_amount"] { width: 130px; text-align: center; }
#customersTable th[data-col="receipt_count"],
#customersTable td[data-col="receipt_count"] { width: 100px; text-align: center; }
#customersTable th[data-col="fee_collect_count"],
#customersTable td[data-col="fee_collect_count"] { width: 100px; text-align: center; }
#customersTable th[data-col="fee_collect_total"],
#customersTable td[data-col="fee_collect_total"] { width: 120px; text-align: center; }
#customersTable th[data-col="fee_expense_count"],
#customersTable td[data-col="fee_expense_count"] { width: 100px; text-align: center; }
#customersTable th[data-col="fee_expense_total"],
#customersTable td[data-col="fee_expense_total"] { width: 120px; text-align: center; }
#customersTable th[data-col="uninvoiced"],
#customersTable td[data-col="uninvoiced"] { width: 110px; text-align: center; }
#customersTable th[data-col="archived"],
#customersTable td[data-col="archived"] { width: 80px; text-align: center; }
#customersTable th[data-col="new_customer"],
#customersTable td[data-col="new_customer"] { width: 100px; text-align: center; }
#customersTable th[data-col="primary_contact_name"],
#customersTable td[data-col="primary_contact_name"] { width: 180px; text-align: left; }

/* ── Right‑edge pin overlay: primary_contact_name column pinned to the
   visible right edge during horizontal scroll.  JS builds this overlay
   inside .table‑shell and syncs it via requestAnimationFrame so it
   stays aligned with the table rows while remaining locked to the
   right edge.  Nouveau client (new_customer) scrolls normally. ── */
.gp-right-pin-col {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 15;
  background: #fff;
  box-shadow: -6px 0 10px -5px rgba(15, 23, 42, .18);
  overflow: hidden;
  pointer-events: none;
  will-change: transform;
}
.gp-right-pin-header {
  height: 40px;
  line-height: 40px;
  padding: 6px 8px;
  font-size: var(--fs-xs);
  font-weight: 400;
  background: #f0f4f9;
  white-space: nowrap;
  text-align: left;
  border-bottom: 1px solid #e5e7eb;
  position: sticky;
  top: 0;
  z-index: 2;
}
.gp-right-pin-cell {
  padding: 6px 8px;
  font-size: var(--fs-sm);
  display: flex;
  align-items: center;
  border-bottom: 1px solid #f1f5f9;
  background: #fff;
}
/* Preserve hover feedback on the pinned‑overlay cells */
#customersTable tbody tr:hover ~ .gp-right-pin-col .gp-right-pin-cell {
  /* Hover sync is handled inline via the JS rebuild that reads row state */;
}

/* ── Customer name cell — wrappable content ── */
#customersTable th[data-col="name"] .customer-name-cell,
#customersTable td[data-col="name"] .customer-name-cell {
  white-space: normal;
  overflow-wrap: break-word;
  word-wrap: break-word;
  display: block;
  line-height: 1.4;
}

/* Status chip in table cell */
.status-chip-v3 {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: var(--fs-xs);
  font-weight: 400;
  white-space: nowrap;
  line-height: 1.4;
  cursor: default;
}
/* Empty placeholder */
.empty-placeholder { font-size: var(--fs-xs); white-space: nowrap; color: #94a3b8; font-style: italic; }

/* ── Item 17: Contract table — full width, no right whitespace ── */
#contractsDataTable { width: 100%; table-layout: auto; min-width: 900px; }
#contractsDataTable td { padding: 4px 8px; }

/* ── Document dropdown Escape handler (also covered by toolbar Escape) ── */
#policyDocsDropdownMenu.open,
#policyImportExportDropdownMenu.open { z-index: 99990; }

/* ── Item 18: Team page no right whitespace ── */
.team-table { width: 100%; table-layout: auto; }
.team-table-shell { width: 100%; overflow-x: auto; }

/* ── Item 19: Sticky footer for customer dialog ── */
#customerDialog .modal-card {
  display: flex;
  flex-direction: column;
  max-height: 85vh;
  overflow: hidden;
}
#customerDialog .modal-head { flex-shrink: 0; }
#customerDialog .form-grid {
  flex: 1;
  overflow-y: auto;
  padding: 0 4px;
  min-height: 0;
}
#customerDialog .modal-actions {
  flex-shrink: 0;
  box-shadow: 0 -2px 6px rgba(0,0,0,.06);
  margin-top: 0;
  padding-top: 8px;
}

/* ── Browser QA: mandatory customers-table columns can never be hidden ──
   Deterministic guarantee: stylesheet !important beats any stale inline
   style="display:none" left by preference appliers, regardless of timing. */
#customersTable th[data-col="_select"], #customersTable td[data-col="_select"],
#customersTable th[data-col="name"],    #customersTable td[data-col="name"],
#customersTable th[data-col="status"],  #customersTable td[data-col="status"] {
  display: table-cell !important;
}
#customersTable th[data-col="_select"] input[type="checkbox"],
#customersTable td[data-col="_select"] input[type="checkbox"] {
  display: inline-block !important;
  visibility: visible !important;
}

/* Runtime authentication CSS uses a stronger desktop grid selector. Reassert
   the accepted full-width single-column mobile layout so the workspace does
   not collapse into an implicit narrow grid column. */
@media (max-width: 767px) {
  #mainAppContent.authenticated .app {
    display: block !important;
    width: 100vw !important;
    min-width: 0 !important;
  }

  #mainAppContent.authenticated .workspace {
    width: 100vw !important;
    min-width: 0 !important;
  }
}

/* (Issue 7) Audit history timeline */
.audit-timeline { display:flex; flex-direction:column; gap:6px; max-height:60vh; overflow-y:auto; }
.audit-entry { padding:8px 12px; border:1px solid #edf1f6; border-radius:6px; background:#fff; }
.audit-entry-head { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.audit-action { font-weight: 400; font-size: var(--fs-sm); color:#1e40af; }
.audit-user { font-size: var(--fs-xs); color:#64748b; }
.audit-date { font-size: var(--fs-2xs); color:#94a3b8; margin-left:auto; }
.audit-change { font-size: var(--fs-xs); padding:2px 0; color:#334155; }
.audit-field { font-weight: 400; color:#475569; }
.audit-old { color:#dc2626; text-decoration:line-through; }
.audit-new { color:#16a34a; }

/* (Issue 8) Contract category + product cells — min-width, no vertical text */
[data-col="contract_category"] { min-width:120px; }
[data-col="contract_category"] .category-chips-cell { display:flex; flex-wrap:wrap; gap:3px; align-items:center; }
[data-col="contracts_bought"] { min-width:100px; max-width:200px; }
[data-col="contracts_bought"] .product-tags-cell { display:flex; flex-wrap:wrap; gap:3px; align-items:center; }

/* (Issue 9) Dashboard 9-metric row — wrap on narrow, scroll on very narrow */
.ops-metrics { display:flex; flex-wrap:wrap; gap:6px; }
.ops-metrics button { flex:0 0 auto; min-width:100px; }
@media (max-width:900px){.ops-metrics{justify-content:flex-start}.ops-metrics button{font-size: var(--fs-xs);padding:6px 10px}}
@media (max-width:600px){.ops-metrics{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch}.ops-metrics button{flex-shrink:0}}

/* ══════════════════════════════════════════════════════════════
   Customer Extended Info Editor / 客户扩展资料编辑器
   ══════════════════════════════════════════════════════════════ */

/* Native <dialog> — true top-layer (above profileDialog via showModal).
   Replaces the old div overlay that sat behind native dialog top layer. */
.xfi-dialog-native {
  border: none; border-radius: 0; padding: 0;
  background: transparent;
  max-width: none; max-height: none;
  overflow: visible;
}
.xfi-dialog-native::backdrop {
  background: rgba(0,0,0,0.55);
}

/* Legacy overlay (fallback if dialog not used) */
.xfi-overlay,
.xfi-history-overlay {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.55);
  z-index: 100000;
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}


/* Dialog card */
.xfi-dialog {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 8px 40px rgba(0,0,0,0.25);
  width: 100%;
  max-width: 780px;
  max-height: 90vh;
  display: flex; flex-direction: column;
  overflow: hidden;
  animation: xfiSlideIn 0.2s ease-out;
}
.xfi-dialog-wide { max-width: 900px; }

@keyframes xfiSlideIn {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Dialog head */
.xfi-dialog-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid #e5e7eb;
  flex-shrink: 0;
}
.xfi-dialog-head h2 {
  margin: 0; font-size: var(--fs-lg); font-weight: 400; color: #111827;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.xfi-head-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }

.xfi-btn-close {
  border: none; background: none; font-size: var(--fs-2xl); color: #6b7280;
  cursor: pointer; padding: 2px 8px; border-radius: 4px; line-height: 1;
}
.xfi-btn-close:hover { background: #f3f4f6; color: #111827; }

/* Info bar */
.xfi-info-bar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 20px; background: #f9fafb; border-bottom: 1px solid #e5e7eb;
  font-size: var(--fs-sm); color: #6b7280; flex-shrink: 0;
}
.xfi-info-label { font-family: monospace; }
.xfi-info-role { font-weight: 400; text-transform: uppercase; letter-spacing: 0.5px; }

/* Dialog body */
.xfi-dialog-body {
  flex: 1; overflow-y: auto; padding: 20px;
  -webkit-overflow-scrolling: touch;
}

/* Section */
.xfi-section {
  margin-bottom: 20px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  overflow: hidden;
}
.xfi-section:last-child { margin-bottom: 0; }

.xfi-section-title {
  margin: 0; padding: 10px 16px;
  background: #f3f4f6;
  font-size: var(--fs-md); font-weight: 400; color: #374151;
  border-bottom: 1px solid #e5e7eb;
}

/* Field grid — 2 columns, collapses on narrow */
.xfi-field-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 16px;
  padding: 16px;
}
@media (max-width: 560px) {
  .xfi-field-grid { grid-template-columns: 1fr; }
}

/* Individual field */
.xfi-field {
  display: flex; flex-direction: column; gap: 4px;
}
.xfi-field label {
  font-size: var(--fs-sm); font-weight: 400; color: #6b7280;
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
}
.xfi-field input,
.xfi-field textarea,
.xfi-field select {
  width: 100%; padding: 8px 10px;
  border: 1px solid #d1d5db; border-radius: 6px;
  font-size: var(--fs-base); color: #111827; background: #fff;
  transition: border-color 0.15s;
  box-sizing: border-box;
}
.xfi-field input:focus,
.xfi-field textarea:focus,
.xfi-field select:focus {
  outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,0.1);
}
.xfi-field textarea { resize: vertical; min-height: 60px; }
.xfi-field input[type="date"] { font-family: inherit; }

/* Computed / read-only fields */
.xfi-computed input,
.xfi-computed textarea { background: #f9fafb; color: #6b7280; }
.xfi-computed-badge {
  font-size: var(--fs-2xs); font-weight: 400; color: #9ca3af;
  background: #f3f4f6; padding: 1px 6px; border-radius: 3px;
  white-space: nowrap;
}
.xfi-readonly {
  padding: 8px 10px; background: #f9fafb; border: 1px solid #e5e7eb;
  border-radius: 6px; font-size: var(--fs-base); color: #374151;
  min-height: 18px; word-break: break-word;
}

/* Checkbox field */
.xfi-field-checkbox {
  grid-column: span 1;
}
.xfi-checkbox-label {
  display: flex !important; align-items: center; gap: 8px;
  font-size: var(--fs-base) !important; color: #111827 !important;
  cursor: pointer;
}
.xfi-checkbox-label input[type="checkbox"] {
  width: 16px; height: 16px; cursor: pointer; accent-color: #2563eb;
}

/* Editable field highlight */
.xfi-editable input,
.xfi-editable textarea,
.xfi-editable select {
  border-color: #93c5fd;
}

/* Dialog footer — fixed bottom */
.xfi-dialog-foot {
  display: flex; align-items: center; justify-content: flex-end; gap: 10px;
  padding: 14px 20px;
  border-top: 1px solid #e5e7eb;
  background: #fafafa;
  flex-shrink: 0;
}

.xfi-btn {
  padding: 9px 20px; border-radius: 6px; font-size: var(--fs-base); font-weight: 400;
  cursor: pointer; border: 1px solid transparent; transition: all 0.15s;
}
.xfi-btn-cancel {
  background: #fff; color: #374151; border-color: #d1d5db;
}
.xfi-btn-cancel:hover { background: #f3f4f6; }
.xfi-btn-save {
  background: #2563eb; color: #fff;
}
.xfi-btn-save:hover { background: #1d4ed8; }
.xfi-btn-save:disabled { opacity: 0.6; cursor: not-allowed; }
.xfi-btn-outline {
  background: #fff; color: #2563eb; border-color: #2563eb; font-size: var(--fs-sm);
  padding: 6px 14px;
}
.xfi-btn-outline:hover { background: #eff6ff; }

/* Loading spinner */
.xfi-loading {
  display: flex; align-items: center; justify-content: center;
  padding: 60px; color: #9ca3af;
}
.xfi-loading .spinner {
  width: 36px; height: 36px; border: 3px solid #e5e7eb;
  border-top-color: #2563eb; border-radius: 50%;
  animation: xfiSpin 0.7s linear infinite;
}
@keyframes xfiSpin { to { transform: rotate(360deg); } }

.xfi-error { color: #dc2626; padding: 20px; text-align: center; }
.xfi-empty { color: #9ca3af; text-align: center; padding: 30px; font-style: italic; }

/* ── Audit history ── */
.xfi-history-body { padding: 16px 20px; }
.xfi-history-summary {
  font-size: var(--fs-base); color: #6b7280; margin-bottom: 16px;
  padding-bottom: 12px; border-bottom: 1px solid #e5e7eb;
}

.xfi-history-entry {
  padding: 12px 0; border-bottom: 1px solid #f3f4f6;
}
.xfi-history-entry:last-child { border-bottom: none; }

.xfi-history-meta {
  display: flex; align-items: center; gap: 12px; margin-bottom: 6px;
  font-size: var(--fs-base); flex-wrap: wrap;
}
.xfi-history-user { font-weight: 400; color: #111827; }
.xfi-history-action {
  background: #eff6ff; color: #2563eb; padding: 2px 8px;
  border-radius: 4px; font-size: var(--fs-xs); font-weight: 400;
}
.xfi-history-date { color: #9ca3af; font-size: var(--fs-xs); font-family: monospace; }

.xfi-history-detail {
  font-size: var(--fs-sm); color: #6b7280; line-height: 1.6;
  padding-left: 4px;
}
.xfi-change-field { font-weight: 400; color: #374151; }
.xfi-change-old { color: #dc2626; text-decoration: line-through; }
.xfi-change-new { color: #16a34a; font-weight: 400; }

/* ── Responsive: narrow screens ── */
@media (max-width: 640px) {
  .xfi-dialog { max-width: 100%; max-height: 95vh; border-radius: 8px; }
  .xfi-dialog-head { padding: 12px 14px; }
  .xfi-dialog-head h2 { font-size: var(--fs-md); }
  .xfi-dialog-body { padding: 12px; }
  .xfi-field-grid { padding: 10px; gap: 8px 10px; }
  .xfi-dialog-foot { padding: 10px 14px; }
  .xfi-section-title { padding: 8px 12px; font-size: var(--fs-base); }
}

/* ══════════════════════════════════════════════════════════════
   Phase 2: Empty states, supplement editor, footer, More menu
   ══════════════════════════════════════════════════════════════ */

/* ── Empty state card (zero-data modules) ── */
.empty-state-card {
  text-align: center;
  padding: 24px 16px;
  color: #94a3b8;
  border: 1px dashed #d4dce6;
  border-radius: 8px;
  margin: 8px 0;
}
.empty-state-card .action-note {
  margin: 0 0 8px;
  font-size: var(--fs-base);
}
.empty-state-card .mini-action.primary {
  background: #2563eb;
  color: #fff;
  border-color: #2563eb;
  padding: 6px 16px;
  font-size: var(--fs-base);
  border-radius: 6px;
  cursor: pointer;
  font-weight: 400;
}
.empty-state-card .mini-action.primary:hover {
  background: #1d4ed8;
}

/* ── Compact summary row in supplement area ── */
.si-compact-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  padding: 8px 12px;
  font-size: var(--fs-sm);
  color: #475569;
  background: #f8fafc;
  border-radius: 6px;
  border: 1px solid #edf1f6;
}
.si-citem { display: inline-flex; align-items: center; gap: 4px; }
.si-citem em {
  font-style: normal;
  font-size: var(--fs-2xs);
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: .3px;
}
.si-citem-empty { color: #94a3b8; font-style: italic; }

/* ── Supplement editor form ── */
.supplement-editor-form label {
  display: block;
  font-size: var(--fs-base);
  color: #334155;
  margin-bottom: 4px;
}

/* ── Profile footer: ensure it never covers content ── */
#profileDialog .profile-bottom-bar {
  flex-shrink: 0;
  background: #fff;
  border-top: 1px solid #e2e8f0;
}
.qa-profile-scroll-body {
  padding-bottom: 24px !important; /* extra room so footer never covers last row */
}

/* ── Policy menu portal: ensure it stays anchored ── */
.policy-menu-portal {
  z-index: 10001 !important;
}
.policy-menu-portal .policy-menu-dropdown {
  max-height: 320px;
  overflow-y: auto;
}

/* ── Policy menu item danger style ── */
.qa-policy-menu-item--danger {
  color: #dc2626 !important;
}
.qa-policy-menu-item--danger:hover {
  background: #fef2f2 !important;
}

/* ── Profile dialog: ensure single scroll area, no nested scrollbars ── */
#profileDialog[open] {
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
#profileDialog .modal-card {
  display: flex;
  flex-direction: column;
  max-height: 90vh;
  overflow: hidden;
}
#profileDialog .modal-head {
  flex-shrink: 0;
}
#profileInfo {
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: hidden;
  min-height: 0;
  padding-right: 4px;
}

/* ═══════════════════════════════════════════════════════════
   Phase 4: Customer table alignment, chips, audit, name width
   ═══════════════════════════════════════════════════════════ */

/* ── Table cell alignment ── */
/* Req 6: all cells vertically centered; numeric/date cells nowrap; text cells wrap sensibly */
#customersTable th, #customersTable td {
  vertical-align: middle;
}

#customersTable td.cell-center {
  text-align: center;
  white-space: nowrap;
}

#customersTable td.cell-left {
  text-align: left;
  white-space: normal;
  overflow-wrap: break-word;
  word-wrap: break-word;
}

/* ── Customer name cell ── */
.customer-name-cell {
  white-space: normal;
  overflow-wrap: break-word;
  word-wrap: break-word;
  line-height: 1.4;
}

/* ── Category chips ── */
.category-chips-cell {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  align-items: center;
}

.category-chip-overflow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #e2e8f0;
  color: #475569;
  border-radius: 10px;
  padding: 1px 7px;
  font-size: var(--fs-xs);
  font-weight: 400;
  cursor: pointer;
  white-space: nowrap;
}

.category-chip-overflow:hover {
  background: #cbd5e1;
}

/* ── Product tags ── */
.product-tags-cell {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  align-items: center;
}

.product-tag {
  display: inline-flex;
  align-items: center;
  background: #f1f5f9;
  color: #334155;
  border: 1px solid #e2e8f0;
  border-radius: 4px;
  padding: 1px 6px;
  font-size: var(--fs-xs);
  white-space: nowrap;
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.product-tag:hover {
  background: #e2e8f0;
  border-color: #94a3b8;
}

/* ── Empty placeholder styling ── */
.empty-placeholder {
  color: #94a3b8;
  font-style: italic;
  font-size: var(--fs-sm);
}

/* Customer table integrity: a TD must remain a table-cell.  Earlier flex
   declarations on these TDs split one customer into visually stacked rows. */
#customersTable td.category-chips-cell,
#customersTable td.product-tags-cell {
  display: table-cell !important;
  height: auto !important;
  vertical-align: middle;
  white-space: normal !important;
  line-height: 1.45;
}

#customersTable td.category-chips-cell > *,
#customersTable td.product-tags-cell > * {
  margin-top: 2px;
  margin-bottom: 2px;
  vertical-align: middle;
}

#customerRows > tr {
  height: auto;
}

/* Import and export are two independent, vertical three-action menus. */
#importDropdownMenu.dm-import-menu,
#exportDropdownMenu.dm-export-menu {
  box-sizing: border-box;
  width: min(320px, calc(100vw - 16px));
  min-width: min(320px, calc(100vw - 16px));
  padding: 6px;
  overflow: hidden;
  border: 1px solid #d7e4f3;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(30, 64, 120, .18);
}

#importDropdownMenu.dm-import-menu > button,
#exportDropdownMenu.dm-export-menu > button {
  box-sizing: border-box;
  width: 100% !important;
  margin: 0 !important;
}

#importDropdownMenu.dm-import-menu > button {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  min-height: 42px !important;
  height: auto !important;
  padding: 9px 12px !important;
  border-radius: 7px !important;
  text-align: left !important;
}

#importDropdownMenu.dm-import-menu > button + button,
#exportDropdownMenu.dm-export-menu > button + button {
  margin-top: 3px !important;
}

#importDropdownMenu.dm-import-menu > button:hover:not(:disabled) {
  color: #155fd1;
  background: #eef5ff;
}

/* ── System/readonly badge ── */
.dm-system-badge {
  display: inline-block;
  background: #fef3c7;
  color: #92400e;
  font-size: var(--fs-2xs);
  font-weight: 400;
  padding: 1px 6px;
  border-radius: 3px;
  margin-left: 6px;
  vertical-align: middle;
  text-transform: uppercase;
}

/* ── Audit history dialog ── */
.audit-entry {
  border-bottom: 1px solid #e2e8f0;
  padding: 10px 0;
}

.audit-entry:last-child {
  border-bottom: none;
}

.audit-entry-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
}

.audit-entry-user {
  font-weight: 400;
  font-size: var(--fs-base);
  color: #1e293b;
}

.audit-entry-time {
  font-size: var(--fs-xs);
  color: #94a3b8;
}

.audit-entry-action {
  display: inline-block;
  font-size: var(--fs-xs);
  font-weight: 400;
  padding: 1px 6px;
  border-radius: 3px;
  margin-right: 6px;
}

.audit-action-update { background: #dbeafe; color: #1e40af; }
.audit-action-insert { background: #dcfce7; color: #166534; }
.audit-action-operational { background: #fef3c7; color: #92400e; }
.audit-action-extended { background: #f3e8ff; color: #6b21a8; }
.audit-action-batch { background: #fce7f3; color: #9d174d; }
.audit-action-delete { background: #fee2e2; color: #991b1b; }
.audit-action-other { background: #f1f5f9; color: #475569; }

.audit-change-list {
  margin: 4px 0 0 0;
  padding: 0;
  list-style: none;
  font-size: var(--fs-sm);
  color: #475569;
}

.audit-change-list li {
  padding: 2px 0;
}

.audit-change-field {
  font-weight: 400;
  color: #334155;
}

.audit-change-old {
  color: #dc2626;
  text-decoration: line-through;
  margin: 0 4px;
}

.audit-change-arrow {
  color: #94a3b8;
  margin: 0 2px;
}

.audit-change-new {
  color: #16a34a;
}

.audit-no-changes {
  color: #94a3b8;
  font-style: italic;
  font-size: var(--fs-sm);
}

.audit-pagination {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 12px;
  padding-top: 8px;
  border-top: 1px solid #e2e8f0;
}

.audit-pagination button {
  padding: 4px 12px;
  border: 1px solid #cbd5e1;
  border-radius: 4px;
  background: white;
  cursor: pointer;
  font-size: var(--fs-sm);
}

.audit-pagination button:disabled {
  opacity: 0.5;
  cursor: default;
}

.audit-pagination button:hover:not(:disabled) {
  background: #f1f5f9;
}

.audit-loading {
  text-align: center;
  padding: 24px;
  color: #94a3b8;
}

/* ═══════════════════════════════════════════════════════════════
   ENHANCED CUSTOMER EDITOR V2 — Requirements 2-3
   ═══════════════════════════════════════════════════════════════ */
.ce-dialog {
  border: none;
  border-radius: 12px;
  padding: 0;
  max-width: 820px;
  width: 95vw;
  max-height: 90vh;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,.3);
  background: #fff;
}
.ce-dialog::backdrop { background: rgba(0,0,0,.5); }
.ce-container { display: flex; flex-direction: column; max-height: 90vh; }
.ce-header {
  display: flex; align-items: center; gap: 12px;
  padding: 16px 20px; border-bottom: 1px solid #e2e8f0;
  background: #f8fafc; flex-shrink: 0;
}
.ce-title { font-size: var(--fs-xl); font-weight: 400; color: #1e293b; margin: 0; flex: 1; }
.ce-subtitle { font-size: var(--fs-base); color: #64748b; }
.ce-close-btn {
  background: none; border: 1px solid #cbd5e1; border-radius: 6px;
  font-size: var(--fs-xl); cursor: pointer; padding: 4px 10px; color: #64748b;
}
.ce-close-btn:hover { background: #fee2e2; border-color: #fca5a5; color: #dc2626; }
.ce-form { overflow-y: auto; flex: 1; padding: 12px 20px; }
.ce-section {
  border: 1px solid #e2e8f0; border-radius: 8px;
  margin-bottom: 8px; background: #fff;
}
.ce-section[open] { border-color: #93c5fd; }
.ce-section-title {
  padding: 10px 14px; font-size: var(--fs-md); font-weight: 400;
  color: #334155; cursor: pointer; background: #f8fafc;
  border-radius: 8px; user-select: none;
}
.ce-section[open] .ce-section-title { background: #eff6ff; color: #1d4ed8; }
.ce-section-body { padding: 10px 14px; }
.ce-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; }
.ce-grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px 12px; }
.ce-field { display: flex; flex-direction: column; gap: 3px; }
.ce-label {
  font-size: var(--fs-sm); font-weight: 400; color: #64748b;
  display: flex; align-items: center; gap: 4px;
}
.ce-input {
  width: 100%; padding: 6px 10px; border: 1px solid #cbd5e1;
  border-radius: 6px; font-size: var(--fs-base); color: #1e293b;
  background: #fff; box-sizing: border-box;
}
.ce-input:focus { border-color: #3b82f6; outline: none; box-shadow: 0 0 0 3px rgba(59,130,246,.15); }
.ce-input:disabled { background: #f1f5f9; color: #64748b; cursor: not-allowed; }
.ce-money { font-family: 'SF Mono','Consolas',monospace; text-align: right; }
.ce-checkbox { display: flex; align-items: center; gap: 6px; font-size: var(--fs-base); }
.ce-badge {
  font-size: var(--fs-2xs); padding: 1px 6px; border-radius: 10px;
  font-weight: 400; text-transform: uppercase;
}
.ce-badge-boss { background: #fef3c7; color: #92400e; }
.ce-badge-computed { background: #dbeafe; color: #1e40af; }
.ce-badge-legacy { background: #fce7f3; color: #9d174d; }
.readonly-field .ce-label { color: #94a3b8; }
.ce-footer {
  display: flex; gap: 8px; justify-content: flex-end;
  padding: 12px 20px; border-top: 1px solid #e2e8f0;
  background: #f8fafc; flex-shrink: 0;
}
.ce-btn-cancel {
  padding: 8px 20px; border: 1px solid #cbd5e1; border-radius: 6px;
  background: #fff; color: #64748b; font-size: var(--fs-base); cursor: pointer;
}
.ce-btn-cancel:hover { background: #f1f5f9; }
.ce-btn-save {
  padding: 8px 24px; border: none; border-radius: 6px;
  background: #1d4ed8; color: #fff; font-size: var(--fs-base); font-weight: 400; cursor: pointer;
}
.ce-btn-save:hover { background: #1e40af; }
.ce-btn-save:disabled { opacity: .6; cursor: not-allowed; }
.ce-empty { text-align: center; padding: 16px; color: #94a3b8; font-size: var(--fs-base); }
.ce-error { text-align: center; padding: 16px; color: #dc2626; font-size: var(--fs-base); }
.ce-legacy-section { }
.ce-legacy-hint { font-size: var(--fs-sm); color: #94a3b8; margin: 0 0 8px 0; font-style: italic; }
.ce-map-btn {
  font-size: var(--fs-sm); padding: 2px 8px; border: 1px dashed #cbd5e1;
  border-radius: 4px; background: #fff; cursor: pointer; margin-top: 4px; align-self: flex-start;
}
.ce-map-btn:hover { background: #eff6ff; border-color: #3b82f6; }
.ce-audit-placeholder { min-height: 40px; }
.ce-audit-table { width: 100%; font-size: var(--fs-sm); border-collapse: collapse; }
.ce-audit-table th {
  text-align: left; padding: 6px 8px; border-bottom: 2px solid #e2e8f0;
  color: #64748b; font-weight: 400; font-size: var(--fs-xs);
}
.ce-audit-table td {
  padding: 5px 8px; border-bottom: 1px solid #f1f5f9;
  color: #334155; max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ce-audit-detail { font-size: var(--fs-xs); color: #64748b; max-width: 300px; }
.ce-mapping-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.4);
  display: flex; align-items: center; justify-content: center; z-index: 10000;
}
.ce-mapping-dialog {
  background: #fff; border-radius: 10px; padding: 24px;
  max-width: 400px; width: 90vw; box-shadow: 0 10px 40px rgba(0,0,0,.3);
}
.ce-mapping-dialog h3 { margin: 0 0 12px 0; font-size: var(--fs-lg); }
.ce-mapping-dialog p { font-size: var(--fs-base); color: #64748b; margin: 0 0 10px 0; }
.ce-mapping-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 16px; }
.ce-mapping-actions button {
  padding: 6px 16px; border-radius: 6px; font-size: var(--fs-base); cursor: pointer; border: 1px solid #cbd5e1;
}
.ce-mapping-actions button:first-child { background: #1d4ed8; color: #fff; border-color: #1d4ed8; }
.ce-mapping-actions button:first-child:hover { background: #1e40af; }

/* Responsive: stack to single column on narrow screens */
@media (max-width: 600px) {
  .ce-dialog { max-width: 100vw; width: 100vw; max-height: 100vh; border-radius: 0; }
  .ce-grid-2, .ce-grid-3 { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════════
   DATA MANAGEMENT PAGE V2
   ═══════════════════════════════════════════════════════════════ */
.data-mgr-page { padding: 16px; }
.data-mgr-tabs { display: flex; gap: 0; border-bottom: 2px solid #e2e8f0; margin-bottom: 16px; }
.data-mgr-tab {
  padding: 10px 20px; border: none; background: none; font-size: var(--fs-md);
  color: #64748b; cursor: pointer; border-bottom: 2px solid transparent;
  margin-bottom: -2px; font-weight: 400;
}
.data-mgr-tab.active { color: #1d4ed8; border-bottom-color: #1d4ed8; }
.data-mgr-tab:hover { color: #334155; }
.data-mgr-toolbar {
  display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
  padding: 8px 0; margin-bottom: 12px;
}
.data-mgr-search { flex: 1; min-width: 200px; }
.data-mgr-search input {
  width: 100%; padding: 6px 12px; border: 1px solid #cbd5e1;
  border-radius: 6px; font-size: var(--fs-base);
}
.data-mgr-table-wrap { overflow-x: auto; }
.data-mgr-table { width: 100%; border-collapse: collapse; font-size: var(--fs-base); }
.data-mgr-table th {
  text-align: left; padding: 8px 10px; border-bottom: 2px solid #e2e8f0;
  color: #64748b; font-weight: 400; font-size: var(--fs-sm); white-space: nowrap;
  position: sticky; top: 0; background: #fff;
}
.data-mgr-table td {
  padding: 6px 10px; border-bottom: 1px solid #f1f5f9;
  color: #334155; max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.data-mgr-table tr:hover td { background: #f8fafc; }
.data-mgr-empty { text-align: center; padding: 32px; color: #94a3b8; }
.data-mgr-badge {
  font-size: var(--fs-xs); padding: 2px 8px; border-radius: 10px; font-weight: 400;
}
.data-mgr-badge-primary { background: #dbeafe; color: #1e40af; }
.data-mgr-badge-pending { background: #fef3c7; color: #92400e; }
.data-mgr-badge-resolved { background: #dcfce7; color: #166534; }
.data-mgr-actions { display: flex; gap: 4px; }
.data-mgr-actions button {
  font-size: var(--fs-xs); padding: 3px 8px; border: 1px solid #cbd5e1;
  border-radius: 4px; background: #fff; cursor: pointer; color: #64748b;
}
.data-mgr-actions button:hover { background: #f1f5f9; border-color: #94a3b8; }
.data-mgr-actions button.danger { color: #dc2626; border-color: #fca5a5; }
.data-mgr-actions button.danger:hover { background: #fee2e2; }
.data-mgr-pagination {
  display: flex; gap: 8px; align-items: center; justify-content: center;
  padding: 12px 0; font-size: var(--fs-base); color: #64748b;
}

/* ═══════════════════════════════════════════════════════════
   Customer Overview Page (Read-Only) — Requirement 1
   ═══════════════════════════════════════════════════════════ */

/* Read-only banner */
.overview-readonly-banner {
  display: flex; align-items: center; gap: 10px;
  background: linear-gradient(135deg, #fff3cd 0%, #ffe69c 100%);
  border: 1px solid #ffc107; border-radius: 6px;
  padding: 10px 16px; margin: 0 16px 12px 16px;
  font-size: var(--fs-base); color: #664d03; line-height: 1.4;
}
.overview-banner-icon { font-size: var(--fs-xl); flex-shrink: 0; }

/* Overview tabs */
.overview-tabs {
  display: flex; gap: 2px; padding: 0 16px; margin-bottom: 0;
  border-bottom: 2px solid #e2e8f0;
}
.overview-tab {
  padding: 9px 18px; border: none; background: transparent;
  font-size: var(--fs-base); font-weight: 400; color: #64748b; cursor: pointer;
  border-bottom: 2px solid transparent; margin-bottom: -2px;
  transition: color 0.15s, border-color 0.15s;
}
.overview-tab:hover { color: #1e293b; }
.overview-tab.active {
  color: #0d47a1; border-bottom-color: #0d47a1; font-weight: 400;
}

/* Overview toolbar */
.overview-toolbar {
  padding: 8px 16px; border-bottom: 1px solid #e2e8f0; background: #f8fafc;
}
.overview-toolbar-row {
  display: flex; align-items: center; gap: 8px; flex-wrap: nowrap; overflow-x: auto;
}
.overview-toolbar-left, .overview-toolbar-right {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
.overview-toolbar-btn {
  font-size: var(--fs-sm); padding: 5px 12px; border: 1px solid #cbd5e1;
  border-radius: 4px; background: #fff; color: #334155; cursor: pointer;
  white-space: nowrap; flex-shrink: 0;
}
.overview-toolbar-btn:hover { background: #f1f5f9; border-color: #94a3b8; }
.overview-toolbar-btn.overview-go-main {
  background: #0d47a1; color: #fff; border-color: #0d47a1; font-weight: 400;
}
.overview-toolbar-btn.overview-go-main:hover {
  background: #1565c0; border-color: #1565c0;
}
/* Requirement 3: Filter controls in one-line toolbar */
.overview-search-input {
  width: 220px; min-width: 140px; padding: 5px 10px; font-size: var(--fs-sm);
  border: 1px solid #cbd5e1; border-radius: 4px; background: #fff; color: #334155;
  flex-shrink: 0;
}
.overview-search-input::placeholder { color: #94a3b8; }
.overview-filter-select {
  font-size: var(--fs-sm); padding: 5px 8px; border: 1px solid #cbd5e1;
  border-radius: 4px; background: #fff; color: #334155; cursor: pointer;
  flex-shrink: 0; max-width: 140px;
}
.overview-toolbar-spacer { flex: 1; min-width: 8px; }

/* Sync status indicator */
.overview-sync-status {
  display: flex; align-items: center; gap: 5px; font-size: var(--fs-xs); color: #64748b;
}
.sync-dot {
  width: 8px; height: 8px; border-radius: 50%; display: inline-block;
}
.sync-dot-ok { background: #22c55e; }
.sync-dot-err { background: #ef4444; }
.sync-dot-updating { background: #f59e0b; animation: sync-pulse 0.8s ease-in-out infinite alternate; }
@keyframes sync-pulse { from { opacity: 1; } to { opacity: 0.3; } }

/* Last update time */
.overview-last-update {
  font-size: var(--fs-xs); color: #94a3b8;
}

/* Overview content area */
.overview-content {
  padding: 0 16px 24px;
  min-height: 0;
  overflow: auto;
}
.overview-tab-panel {
  padding-top: 8px;
  min-height: 0;
}
.overview-tab-panel.active {
  display: block;
  min-height: 0;
}

/* Overview tables — expanded with sticky headers, group rows, and sticky identity columns */
.overview-table-wrap {
  overflow: auto; border: 1px solid #e2e8f0; border-radius: 6px;
  max-height: 70vh;
  scrollbar-gutter: stable;
}

/* ── Pinned header clone (sticky, no JS scroll listeners) ── */
.ov-pinned-header {
  position: sticky; top: 0; z-index: 20;
  width: max-content; min-width: 100%;
  background: #fff; overflow: hidden; box-sizing: border-box;
}
.ov-pinned-header-table {
  width: max-content; min-width: 100%;
  border-collapse: separate; border-spacing: 0;
}
.ov-source-header-hidden { visibility: hidden; }

/* ── Category navigator (above individual/company overview tables) ── */
.ov-cat-nav {
  display: flex;
  gap: 4px;
  padding: 6px 4px;
  margin-bottom: 6px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.ov-cat-nav-item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 14px;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  background: #fff;
  color: #475569;
  font-size: var(--fs-sm);
  cursor: pointer;
  white-space: nowrap;
  transition: all .15s ease;
  line-height: 1.4;
}
.ov-cat-nav-item:hover {
  background: #f0f6ff;
  border-color: #93c5fd;
  color: #1d4ed8;
}
.ov-cat-nav-item.active {
  background: #eff6ff;
  border-color: #2563eb;
  color: #2563eb;
  box-shadow: 0 1px 3px rgba(37,99,235,.15);
}
.ov-cat-nav-item .bi {
  font-size: var(--fs-base);
  line-height: 1;
}
.ov-cat-nav-label {
  font-size: var(--fs-sm);
}
.ov-cat-nav-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 10px;
  background: #e2e8f0;
  color: #64748b;
  font-size: var(--fs-xs);
  line-height: 1;
}
.ov-cat-nav-item.active .ov-cat-nav-count {
  background: #2563eb;
  color: #fff;
}

.overview-table {
  width: max-content; min-width: 100%; border-collapse: separate; border-spacing: 0; font-size: var(--fs-sm);
}
/* Native two-row sticky header: horizontal alignment stays tied to the table. */
.overview-table thead {
  position: static; transform: none;
}
.overview-table thead th {
  background: #f1f5f9;
  position: sticky;
  top: 0;
}
.overview-table thead tr:first-child th { top: 0; }
.overview-table thead tr + tr th { top: 30px; }
/* Single-row contact table header */
#overviewTableContacts thead th {
  z-index: 8;
  background: #f1f5f9;
}
/* Group header row (first row of two-row header) */
.overview-table th.ov-group-header {
  padding: 6px 10px; text-align: center; font-weight: 400;
  color: #1a237e; font-size: var(--fs-sm);
  background: #e8edf5; border-bottom: 1px solid #d0d8e8;
  border-right: 1px solid #d0d8e8;
  white-space: nowrap; user-select: none;
  letter-spacing: .03em;
  z-index: 8;
  height: 30px; box-sizing: border-box;
}
/* Column header row (second row of two-row header) */
.overview-table thead tr:last-child th {
  padding: 5px 8px; text-align: left; font-weight: 400;
  color: #475569; font-size: var(--fs-sm);
  background: #f1f5f9; border-bottom: 2px solid #cbd5e1;
  border-right: 1px solid #e2e8f0;
  white-space: nowrap; user-select: none;
  min-width: 80px;
  z-index: 7;
}
/* Sticky left identity columns (customer name + dossier) */
.overview-table th.ov-sticky-col,
.overview-table td.ov-sticky-col {
  position: sticky; z-index: 1;
  background: #fff;
}
.overview-table thead th.ov-sticky-col {
  z-index: 11;
  background: #f1f5f9;
}
.overview-table th.ov-sticky-col:nth-child(1),
.overview-table td.ov-sticky-col:nth-child(1) { left: 0; min-width: 130px; }
.overview-table th.ov-sticky-col:nth-child(2),
.overview-table td.ov-sticky-col:nth-child(2) { left: 130px; min-width: 130px; }
.overview-table td.ov-sticky-col:nth-child(1),
.overview-table td.ov-sticky-col:nth-child(2) {
  background: #fff;
}
.overview-table tbody tr:hover td.ov-sticky-col { background: #e8f0fe; }

/* Data cells */
.overview-table td {
  padding: 5px 8px; border-bottom: 1px solid #f1f5f9;
  border-right: 1px solid #f1f5f9;
  color: #334155; white-space: nowrap; max-width: 220px;
  overflow: hidden; text-overflow: ellipsis;
  font-size: var(--fs-base);
}
.overview-table tbody tr:hover { background: #f8fafc; }

/* Overview empty/loading/error states */
.overview-loading, .overview-empty, .overview-error {
  text-align: center; padding: 32px 16px; color: #94a3b8;
  font-size: var(--fs-base); font-style: italic;
}
.overview-error { color: #ef4444; }

/* Overview pagination */
.overview-pager {
  display: flex; align-items: center; justify-content: center;
  gap: 10px; padding: 12px 0; font-size: var(--fs-base);
}
.overview-pager-info { color: #94a3b8; font-size: var(--fs-sm); }
.overview-pager-current { color: #475569; font-weight: 400; }
.overview-pager-btn {
  padding: 4px 12px; border: 1px solid #cbd5e1; border-radius: 4px;
  background: #fff; color: #334155; cursor: pointer; font-size: var(--fs-sm);
}
.overview-pager-btn:hover:not(:disabled) { background: #f1f5f9; }
.overview-pager-btn:disabled { opacity: 0.4; cursor: default; }

/* Stats placeholder */
.overview-placeholder {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 60px 20px; text-align: center;
}
.overview-placeholder-icon {
  font-size: var(--fs-display); margin-bottom: 16px; opacity: 0.5;
}
.overview-placeholder p {
  color: #94a3b8; font-size: var(--fs-md); font-style: italic;
}

/* ── Requirement 3: Row clickable cursor ── */
.overview-table tbody tr { cursor: pointer; }
.overview-table tbody tr:hover { background: #e8f0fe; }
.overview-table td.ov-empty-cell {
  color: #94a3b8; font-style: italic; font-size: var(--fs-sm);
}

/* ── Requirement 3: Side drawer ── */
.overview-drawer-overlay {
  position: fixed; top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(0,0,0,0.25); z-index: 200; animation: ov-fade-in .15s;
}
@keyframes ov-fade-in { from { opacity: 0; } to { opacity: 1; } }
.overview-drawer {
  position: fixed; top: 0; right: 0; width: 600px; max-width: 94vw; height: 100%;
  background: #fff; box-shadow: -4px 0 24px rgba(0,0,0,0.12); z-index: 201;
  display: flex; flex-direction: column; animation: ov-slide-in .2s ease;
}
@keyframes ov-slide-in { from { transform: translateX(100%); } to { transform: translateX(0); } }
.overview-drawer-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 20px; border-bottom: 1px solid #e2e8f0; flex-shrink: 0;
  position: sticky; top: 0; background: #fff; z-index: 2;
}
.overview-drawer-head h3 {
  margin: 0; font-size: var(--fs-lg); font-weight: 400; color: #1e293b;
}
.overview-drawer-close {
  width: 30px; height: 30px; border: 0; background: transparent;
  font-size: var(--fs-2xl); color: #64748b; cursor: pointer; border-radius: 4px;
  display: flex; align-items: center; justify-content: center;
}
.overview-drawer-close:hover { background: #f1f5f9; color: #1e293b; }
.overview-drawer-body {
  flex: 1; overflow-y: auto; padding: 16px 20px 24px;
  scroll-behavior: smooth;
}
.overview-drawer-loading {
  text-align: center; padding: 40px; color: #94a3b8; font-size: var(--fs-base);
}
.overview-drawer-foot {
  display: flex; align-items: center; justify-content: flex-end; gap: 8px;
  padding: 12px 20px; border-top: 1px solid #e2e8f0; flex-shrink: 0;
}
/* ── Drawer identity header ── */
.ov-dr-identity {
  display: flex; align-items: flex-start; gap: 14px;
  margin-bottom: 18px; padding-bottom: 14px;
  border-bottom: 1px solid #e8ecf2;
}
.ov-dr-avatar {
  width: 44px; height: 44px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  border-radius: 10px; background: linear-gradient(135deg, #e0e7ff, #dcecff);
  font-size: 20px; font-weight: 500; color: #1a237e;
}
.ov-dr-id-core { flex: 1; min-width: 0; }
.ov-dr-name {
  font-size: var(--fs-lg); font-weight: 500; color: #0d1015;
  word-break: break-word; margin-bottom: 4px;
}
.ov-dr-meta {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-bottom: 6px;
}
.ov-dr-type {
  font-size: var(--fs-xs); color: #657181;
}
.ov-dr-status {
  font-size: var(--fs-2xs); font-weight: 400; padding: 2px 8px; border-radius: 10px;
  white-space: nowrap;
}
.ov-dr-badge-neutral  { background: #f0f4ff; color: #1a237e; }
.ov-dr-badge-priority { background: #fef0f0; color: #991b1b; }
.ov-dr-badge-debt     { background: #fff7ed; color: #c2410c; }
.ov-dr-badge-risk     { background: #fefce8; color: #a16207; }
.ov-dr-badge-blacklist{ background: #f1f5f9; color: #334155; }
.ov-dr-badge-closed   { background: #f0fdf4; color: #166534; }
.ov-dr-badge-prospect { background: #eff6ff; color: #1d4ed8; }
.ov-dr-badge-attention{ background: #fdf2f8; color: #9d174d; }
.ov-dr-id-aux {
  display: flex; flex-wrap: wrap; gap: 6px 16px;
  font-size: var(--fs-xs); color: #657181;
}
.ov-dr-aux-item { white-space: nowrap; }
.ov-dr-aux-lbl { color: #94a3b8; }
/* ── Drawer grouped cards ── */
.ov-dr-card {
  margin-bottom: 14px; border: 1px solid #edf1f6; border-radius: 8px;
  background: #fff; overflow: hidden;
}
.ov-dr-card-title {
  padding: 7px 12px; font-size: var(--fs-sm); font-weight: 400;
  color: #1a237e; background: #f0f4ff;
  border-bottom: 1px solid #eef2ff;
}
.ov-dr-card-body { padding: 8px 12px; }
.ov-dr-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 2px 16px;
}
.ov-dr-row {
  display: flex; align-items: baseline; gap: 6px;
  padding: 3px 0; min-height: 22px; line-height: 1.35;
}
.ov-dr-lbl {
  font-size: var(--fs-xs); color: #94a3b8; min-width: 68px; flex-shrink: 0;
  white-space: nowrap;
}
.ov-dr-fv {
  font-size: var(--fs-sm); font-weight: 400; color: #1e293b;
  word-break: break-word; min-width: 0;
}
.ov-dr-fv.ov-dr-empty {
  color: #b0b8c4; font-style: italic;
}
/* Drawer empty / no-policy note */
.ov-dr-empty-note {
  font-size: var(--fs-sm); color: #94a3b8; font-style: italic;
  padding: 6px 0; text-align: center;
}
/* ── Drawer responsive: narrower on small screens ── */
@media (max-width: 680px) {
  .overview-drawer { width: 100%; max-width: 100vw; }
  .ov-dr-grid { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════════════
   Requirement 4: Custom Statistical Analysis Tab
   ═══════════════════════════════════════════════════════════════════ */
.stats-analysis-layout {
  display: flex; gap: 0; min-height: 500px;
  border: 1px solid #e2e8f0; border-radius: 8px; overflow: hidden;
  background: #fff;
}

/* ── Left criteria panel (280px) ── */
.stats-criteria-panel {
  width: 280px; min-width: 280px; flex-shrink: 0;
  background: #f8fafc; border-right: 1px solid #e2e8f0;
  display: flex; flex-direction: column;
}
.stats-criteria-header {
  padding: 14px 16px; border-bottom: 1px solid #e2e8f0;
}
.stats-criteria-header h3 {
  margin: 0; font-size: var(--fs-md); font-weight: 400; color: #1e293b;
}
.stats-criteria-body {
  flex: 1; overflow-y: auto; padding: 12px 14px;
  display: flex; flex-direction: column; gap: 10px;
}
.stats-field {
  display: flex; flex-direction: column; gap: 4px;
}
.stats-field span {
  font-size: var(--fs-xs); font-weight: 400; color: #64748b; text-transform: uppercase;
  letter-spacing: 0.03em;
}
.stats-field select,
.stats-field input[type="date"] {
  width: 100%; padding: 6px 8px; border: 1px solid #cbd5e1; border-radius: 4px;
  font-size: var(--fs-sm); color: #334155; background: #fff;
}
.stats-field select:focus,
.stats-field input[type="date"]:focus {
  border-color: #0d47a1; outline: none; box-shadow: 0 0 0 2px rgba(13,71,161,0.12);
}
.stats-custom-range {
  display: flex; gap: 6px;
}
.stats-custom-range .stats-field { flex: 1; }
/* Boss-only metric options hidden for non-boss */
.stats-boss-only { display: none; }
body.boss-role .stats-boss-only { display: block; }

.stats-run-btn {
  margin-top: 6px; padding: 8px 12px; border: 0; border-radius: 6px;
  background: #0d47a1; color: #fff; font-size: var(--fs-base); font-weight: 400;
  cursor: pointer; transition: background .15s;
}
.stats-run-btn:hover { background: #1565c0; }
.stats-export-btn {
  padding: 6px 10px; border: 1px solid #cbd5e1; border-radius: 6px;
  background: #fff; color: #334155; font-size: var(--fs-sm); cursor: pointer;
}
.stats-export-btn:hover { background: #f1f5f9; }

/* ── Right results panel ── */
.stats-results-panel {
  flex: 1; display: flex; flex-direction: column; min-width: 0;
}
.stats-results-toolbar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px; border-bottom: 1px solid #e2e8f0; flex-shrink: 0;
  background: #fafbfc; gap: 12px; flex-wrap: wrap;
}
.stats-view-tabs {
  display: flex; gap: 2px;
}
.stats-view-tab {
  padding: 5px 12px; border: 1px solid #cbd5e1; background: #fff;
  color: #475569; font-size: var(--fs-sm); cursor: pointer; border-radius: 4px;
  transition: all .12s;
}
.stats-view-tab:hover { background: #f1f5f9; }
.stats-view-tab.active {
  background: #0d47a1; color: #fff; border-color: #0d47a1;
}
.stats-results-summary {
  font-size: var(--fs-xs); color: #94a3b8; white-space: nowrap;
}
.stats-results-body {
  flex: 1; overflow: auto; padding: 16px; position: relative;
  display: flex; align-items: center; justify-content: center;
}

/* Placeholder */
.stats-placeholder-msg {
  text-align: center; padding: 40px 20px;
}
.stats-placeholder-icon {
  font-size: var(--fs-display); margin-bottom: 12px; opacity: 0.35;
}
.stats-placeholder-msg p {
  color: #94a3b8; font-size: var(--fs-md); font-style: italic; margin: 0;
}

/* Loading */
.stats-loading {
  text-align: center; padding: 40px; color: #64748b; font-size: var(--fs-base);
}

/* Chart container */
.stats-chart-container {
  width: 100%; max-width: 800px;
}
.stats-chart-container canvas {
  width: 100%; height: auto;
}

/* Table container for stats results */
.stats-table-container {
  width: 100%; overflow: auto;
}
.stats-results-table {
  width: 100%; border-collapse: collapse; font-size: var(--fs-sm);
}
.stats-results-table thead { background: #f1f5f9; position: sticky; top: 0; z-index: 1; }
.stats-results-table th {
  padding: 7px 10px; text-align: left; font-weight: 400;
  color: #475569; font-size: var(--fs-xs); border-bottom: 2px solid #e2e8f0;
  white-space: nowrap;
}
.stats-results-table th.rh { text-align: right; }
.stats-results-table td {
  padding: 6px 10px; border-bottom: 1px solid #f1f5f9;
  color: #334155;
}
.stats-results-table td.rv { text-align: right; font-variant-numeric: tabular-nums; font-weight: 400; }
.stats-results-table tbody tr:hover { background: #f8fafc; }
.stats-results-table tbody tr { cursor: pointer; }
.stats-results-table .clickable-cell { color: #0d47a1; cursor: pointer; }
.stats-results-table .clickable-cell:hover { text-decoration: underline; }

/* Details container */
.stats-details-container {
  width: 100%; overflow: auto; max-height: 500px;
}
.stats-details-header {
  font-size: var(--fs-base); font-weight: 400; color: #1e293b;
  margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid #e2e8f0;
}

/* Stats metric bar visualization */
.stats-bar-row {
  display: flex; align-items: center; gap: 8px; margin-bottom: 6px;
}
.stats-bar-label {
  width: 140px; flex-shrink: 0; font-size: var(--fs-sm); color: #475569;
  text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.stats-bar-track {
  flex: 1; height: 22px; background: #f1f5f9; border-radius: 4px; overflow: hidden;
  position: relative; cursor: pointer;
}
.stats-bar-fill {
  height: 100%; border-radius: 4px; transition: width .3s; min-width: 2px;
}
.stats-bar-value {
  width: 60px; flex-shrink: 0; font-size: var(--fs-sm); color: #334155;
  font-weight: 400; text-align: right;
}

/* Donut legend */
.stats-donut-legend {
  display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; justify-content: center;
}
.stats-donut-legend-item {
  display: flex; align-items: center; gap: 4px; font-size: var(--fs-xs); color: #475569;
  padding: 2px 8px; border-radius: 3px; cursor: pointer; border: 1px solid transparent;
}
.stats-donut-legend-item:hover { border-color: #cbd5e1; background: #f8fafc; }
.stats-donut-swatch {
  width: 10px; height: 10px; border-radius: 2px; flex-shrink: 0;
}
.stats-donut-value { font-weight: 400; color: #1e293b; margin-left: 2px; }

/* Responsive: narrow screens stack */
@media (max-width: 900px) {
  .stats-analysis-layout { flex-direction: column; }
  .stats-criteria-panel { width: 100%; min-width: 0; border-right: 0; border-bottom: 1px solid #e2e8f0; }
  .stats-criteria-body { flex-direction: row; flex-wrap: wrap; gap: 8px; }
  .stats-criteria-body .stats-field { flex: 1; min-width: 120px; }
}

/* ═══════════════════════════════════════════════════════════
   Fix 3: policy card completeness (SECTION 5 — Garanties)
   Audit row, coverage status, always-visible late-fee fields
   ═══════════════════════════════════════════════════════════ */

/* ═══ Related-customer relationships redesign ═══ */
.rel-section { }
.rel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.rel-title {
  font-size: var(--fs-lg);
  font-weight: 400;
  margin: 0;
  color: #1e293b;
}
.rel-count-badge {
  font-size: var(--fs-base);
  color: #64748b;
  white-space: nowrap;
}
.rel-count-badge b {
  color: #2563eb;
  font-weight: 400;
}
.rel-empty {
  padding: 16px 12px;
  background: #f8fafc;
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  color: #64748b;
  font-size: var(--fs-base);
  line-height: 1.5;
}
.rel-empty p { margin: 0; }
.rel-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 12px;
}
.rel-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  min-height: 36px;
  gap: 8px;
  flex-wrap: wrap;
}
.rel-row:hover { background: #f8fafc; border-color: #cbd5e1; }
.rel-row-info {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  min-width: 0;
}
.rel-name { font-size: var(--fs-md); font-weight: 400; color: #1e293b; }
.rel-dossier { font-size: var(--fs-sm); color: #64748b; }
.rel-phone { font-size: var(--fs-sm); color: #64748b; }
.rel-type-badge {
  display: inline-block;
  font-size: var(--fs-sm);
  padding: 2px 8px;
  border-radius: 12px;
  background: #eff6ff;
  color: #2563eb;
  font-weight: 400;
}
.rel-status {
  font-size: var(--fs-sm);
  color: #475569;
}
.rel-row-actions {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
}
.rel-view-btn {
  height: 28px;
  padding: 0 10px;
  border: 1px solid #cbd5e1;
  border-radius: 4px;
  background: #fff;
  color: #475569;
  font-size: var(--fs-sm);
  cursor: pointer;
}
.rel-view-btn:hover { background: #f1f5f9; border-color: #94a3b8; }
.rel-unlink-btn {
  height: 28px;
  padding: 0 10px;
  border: 1px solid #fecaca;
  border-radius: 4px;
  background: #fff;
  color: #dc2626;
  font-size: var(--fs-sm);
  cursor: pointer;
}
.rel-unlink-btn:hover { background: #fef2f2; border-color: #f87171; }
.rel-add-row {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  padding: 10px 0;
  border-top: 1px solid #e2e8f0;
  margin-top: 4px;
}
.rel-search-input {
  flex: 1 1 200px;
  min-width: 160px;
  height: 36px;
  padding: 0 10px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  font-size: var(--fs-base);
  color: #334155;
}
.rel-search-input:focus { border-color: #2563eb; outline: none; box-shadow: 0 0 0 2px rgba(37,99,235,0.15); }

/* ── Related customer card listbox (replaces native select) ── */
.rel-card-listbox {
  width: 100%;
  max-height: 320px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-top: 8px;
}
.rel-card-empty {
  padding: 16px;
  text-align: center;
  color: #94a3b8;
  font-size: var(--fs-base);
}
.rel-card-item {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 6px;
  padding: 10px 12px;
  border-bottom: 1px solid #e2e8f0;
  border-left: 3px solid transparent;
  cursor: pointer;
  transition: background .12s, border-color .12s, border-left-color .12s;
  font-size: var(--fs-base);
  min-height: 44px;
}
.rel-card-item:last-child { border-bottom: none; }
.rel-card-item:hover { background: #f0f6ff; border-color: #dbeafe; border-left-color: #93c5fd; }
.rel-card-item:focus { outline: 2px solid #2563eb; outline-offset: -2px; }
.rel-card-item.selected {
  background: #eff6ff;
  border-color: #93c5fd;
  border-left-color: #2563eb;
  box-shadow: none;
}

/* ── Left column: name + meta ── */
.rel-card-left {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
}

.rel-card-name {
  font-size: 1.125rem;
  color: #0f172a;
  font-weight: 700 !important;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 1.3;
}

.rel-card-meta {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
}

.rel-card-dossier {
  font-size: 13px;
  font-weight: 600;
  color: #334155;
  background: #eef2ff;
  padding: 1px 7px;
  border-radius: 4px;
  white-space: nowrap;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  border: 1px solid #c7d2fe;
}

.rel-card-type {
  font-size: 13px;
  color: #94a3b8;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── Right column: status + owner + contact ── */
.rel-card-right {
  display: flex;
  flex-direction: column;
  gap: 3px;
  align-items: flex-end;
  flex-shrink: 0;
  max-width: 45%;
}

.rel-card-status-badge {
  font-size: 14px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 10px;
  background: #f8fafc;
  color: #475569;
  white-space: nowrap;
  border: 1px solid #e2e8f0;
}
.rel-card-status-badge.rel-card-status-empty {
  background: #f8fafc;
  color: #94a3b8;
  border-color: #e2e8f0;
}
.rel-card-status-badge.rel-card-status-green {
  background: #f0fdf4;
  color: #166534;
  border-color: #bbf7d0;
}
.rel-card-status-badge.rel-card-status-orange {
  background: #fff7ed;
  color: #9a3412;
  border-color: #fed7aa;
}
.rel-card-status-badge.rel-card-status-red {
  background: #fef2f2;
  color: #991b1b;
  border-color: #fecaca;
}

.rel-card-owner {
  font-size: 14px;
  color: #475569;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

.rel-card-contact {
  font-size: 14px;
  color: #475569;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.rel-type-select {
  height: 36px;
  min-width: 130px;
  padding: 0 8px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  font-size: var(--fs-base);
  color: #334155;
  background: #fff;
}
.rel-link-btn {
  height: 36px;
  padding: 0 16px;
  border: none;
  border-radius: 6px;
  background: #2563eb;
  color: #fff;
  font-size: var(--fs-base);
  font-weight: 400;
  cursor: pointer;
  white-space: nowrap;
}
.rel-link-btn:hover { background: #1d4ed8; }
.rel-search-status {
  font-size: var(--fs-sm);
  color: #94a3b8;
  margin-top: 4px;
  min-height: 16px;
}

/* ============================================================
   全站字体规范：去除所有加粗，统一字重为 400
   ============================================================ */
*,
*::before,
*::after {
  font-weight: 400 !important;
}

/* 显式覆盖浏览器默认加粗标签 */
b,
strong,
th,
h1, h2, h3, h4, h5, h6,
dt,
label,
legend,
caption,
summary,
optgroup,
select > option:checked {
  font-weight: 400 !important;
}

/* 覆盖内联 style 中的 font-weight */
[style*="font-weight"] {
  font-weight: 400 !important;
}

/* 覆盖 Bootstrap 等框架默认 small 字号 */
small,
.small {
  font-size: var(--fs-xs) !important;
}

/* ── Task5: Garanties section redesign ── */

/* ── Section header (title + Add button) ── */
#profileDialog .ppc-section-head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin: 0 0 12px; padding-bottom: 10px; border-bottom: 1px solid #e2e8f0;
}
#profileDialog .ppc-section-head h4 {
  margin: 0; padding: 0; border: none; font-size: 15px; font-weight: 400; color: #0f172a;
}
#profileDialog .ppc-add-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 6px 16px; border: 1px solid #2563eb; border-radius: 6px;
  background: #2563eb; color: #fff;
  font-size: 14px; font-weight: 400; cursor: pointer; white-space: nowrap;
  line-height: 1.4; transition: background .15s, border-color .15s;
}
#profileDialog .ppc-add-btn:hover { background: #1d4ed8; border-color: #1d4ed8; }

/* ── Three-stat strip ── */
#profileDialog .ppc-stats-strip {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px;
  margin-bottom: 16px;
}
#profileDialog .ppc-stat {
  padding: 14px 16px; border: 1px solid #e2e8f0; border-radius: 10px;
  background: #f8fafc; display: flex; flex-direction: column; gap: 6px;
}
#profileDialog .ppc-stat-value {
  font-size: 20px; font-weight: 400; color: #0f172a; line-height: 1.2;
}
#profileDialog .ppc-stat-value.ppc-stat-warn { color: #d97706; }
#profileDialog .ppc-stat-label {
  font-size: 13px; font-weight: 400; color: #64748b;
  text-transform: uppercase; letter-spacing: .4px; line-height: 1.2;
}

/* ── Policy rows container (single-column) ── */
#profileDialog .ppc-policy-rows {
  display: flex; flex-direction: column; gap: 12px;
}

/* ── Individual policy card ── */
#profileDialog .ppc-policy-row {
  display: flex; flex-direction: column; gap: 10px;
  padding: 16px 18px; border: 1.5px solid #d1d9e6; border-radius: 10px;
  background: #fbfdff; min-width: 0;
  box-shadow: 0 1px 4px rgba(15, 23, 42, .05);
  transition: border-color .15s ease, box-shadow .15s ease;
}
#profileDialog .ppc-policy-row:hover {
  border-color: #93b9e8; box-shadow: 0 2px 8px rgba(37, 99, 235, .08);
}
#profileDialog .ppc-policy-row.ppc-row-debt {
  background: #fffcfc; border-left: 4px solid #fecaca;
}
#profileDialog .ppc-policy-row.ppc-row-expired {
  background: #fffefa; border-left: 4px solid #fde68a;
}

/* ── Body wrapper: main info grid ── */
#profileDialog .ppc-row-body {
  display: block; width: 100%;
}

/* ── Main info layout: grid (left 160px category + right full-width field grid) ── */
#profileDialog .ppc-row-main {
  display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 16px; align-items: flex-start; width: 100%;
}

/* ── Two-row × three-column unified ppc-field grid ── */
#profileDialog .ppc-row-grid {
  display: grid; grid-template-columns: repeat(3, minmax(160px, 200px)); gap: 2px 28px;
  width: 100%; justify-content: end;
}

/* ── Unified ppc-field: label em + value span, fixed heights for strict row/col alignment ── */
#profileDialog .ppc-field {
  display: flex; flex-direction: column; min-width: 0;
}
/* Three-column alignment: left / center / right */
#profileDialog .ppc-row-grid > .ppc-field:nth-child(3n+1) {
  align-items: flex-start;
}
#profileDialog .ppc-row-grid > .ppc-field:nth-child(3n+1) em,
#profileDialog .ppc-row-grid > .ppc-field:nth-child(3n+1) .ppc-field-value {
  text-align: left;
}
#profileDialog .ppc-row-grid > .ppc-field:nth-child(3n+2) {
  align-items: center;
}
#profileDialog .ppc-row-grid > .ppc-field:nth-child(3n+2) em,
#profileDialog .ppc-row-grid > .ppc-field:nth-child(3n+2) .ppc-field-value {
  text-align: center;
}
#profileDialog .ppc-row-grid > .ppc-field:nth-child(3n) {
  align-items: flex-end;
}
#profileDialog .ppc-row-grid > .ppc-field:nth-child(3n) em,
#profileDialog .ppc-row-grid > .ppc-field:nth-child(3n) .ppc-field-value {
  text-align: right;
}
#profileDialog .ppc-field em {
  font-style: normal; font-size: 12px; font-weight: 400; color: #94a3b8;
  display: block; min-height: 18px; line-height: 18px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
#profileDialog .ppc-field .ppc-field-value {
  font-size: 14px; font-weight: 400; color: #334155;
  display: block; min-height: 22px; line-height: 22px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
#profileDialog .ppc-field em .bi { font-size: 11px; margin-right: 1px; }

#profileDialog .ppc-row-col {
  display: flex; flex-direction: column; gap: 5px; min-width: 0;
}
#profileDialog .ppc-col-catprod {
  flex: 0 0 160px; max-width: 180px;
}

/* ── Category / Product / Status ── */
#profileDialog .ppc-cat {
  font-size: 13px; font-weight: 400; color: #64748b;
  text-transform: uppercase; letter-spacing: .3px; line-height: 1.3;
  display: inline-flex; align-items: center; gap: 4px;
}
#profileDialog .ppc-cat .insurance-icon-only {
  width: 18px; height: 18px; border-radius: 5px; border: 1px solid #d9e6f5;
  flex: 0 0 auto;
}
#profileDialog .ppc-cat .insurance-icon-only svg {
  width: 11px; height: 11px;
}
#profileDialog .ppc-product {
  font-size: 14px; font-weight: 400; color: #0f172a;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.4;
}
#profileDialog .ppc-status-badge {
  font-size: 13px; font-weight: 400; padding: 3px 12px; border-radius: 999px;
  white-space: nowrap; flex-shrink: 0; line-height: 1.6;
  color: #166534; background: #dcfce7;
  display: inline-block; width: -moz-fit-content; width: fit-content;
}
#profileDialog .ppc-status-badge.ppc-row-debt { color: #b91c1c; background: #fef2f2; }
#profileDialog .ppc-status-badge.ppc-row-expired { color: #b45309; background: #fffbeb; }

/* ── Insurer / Number / Premium / Payment fields ── */
#profileDialog .ppc-carrier,
#profileDialog .ppc-number,
#profileDialog .ppc-premium,
#profileDialog .ppc-payment {
  font-size: 14px; font-weight: 400; color: #334155; line-height: 1.5;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
#profileDialog .ppc-carrier em,
#profileDialog .ppc-number em,
#profileDialog .ppc-premium em,
#profileDialog .ppc-payment em {
  font-style: normal; font-size: 12px; font-weight: 400; color: #94a3b8;
  display: block; line-height: 1.3;
}
#profileDialog .ppc-premium em .bi,
#profileDialog .ppc-payment em .bi { font-size: 11px; margin-right: 1px; }

/* ── Dates / Days ── */
#profileDialog .ppc-dates {
  font-size: 14px; font-weight: 400; color: #475569; line-height: 1.5;
}
#profileDialog .ppc-dates em {
  font-style: normal; font-size: 12px; font-weight: 400; color: #94a3b8;
}
#profileDialog .ppc-dates em .bi { font-size: 11px; margin-right: 1px; }
/* Two-line date format: each row is block + nowrap to prevent single-char breaks */
#profileDialog .ppc-date-line {
  display: block; white-space: nowrap; line-height: 1.6;
}
#profileDialog .ppc-date-val {
  font-weight: 400; color: #334155;
}
#profileDialog .ppc-days {
  font-size: 14px; font-weight: 400; padding: 3px 10px; border-radius: 6px;
  white-space: nowrap; color: #475569; background: #f1f5f9; display: inline-block;
  width: -moz-fit-content; width: fit-content;
}
#profileDialog .ppc-days.ppc-days-urgent,
#profileDialog .ppc-days-remaining.ppc-days-urgent { color: #d97706; background: #fffbeb; }
#profileDialog .ppc-days.ppc-days-warn { color: #d97706; background: #fffbeb; }
#profileDialog .ppc-days.ppc-days-negative,
#profileDialog .ppc-days-remaining.ppc-days-negative { color: #dc2626; background: #fef2f2; }

/* ── Bottom meta row: coverage (left) | days remaining (center) | actions (right) ── */
#profileDialog .ppc-row-meta-bottom {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px;
  padding: 8px 12px; background: #f8fafc; border-radius: 6px;
  border: 1px solid #f0f2f5;
}
#profileDialog .ppc-row-meta-bottom .ppc-meta-pill {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 13px; font-weight: 400; color: #64748b;
  line-height: 1.4; white-space: nowrap;
}
#profileDialog .ppc-row-meta-bottom .ppc-meta-pill .bi {
  flex: 0 0 auto; font-size: 13px; line-height: 1;
}
#profileDialog .ppc-row-meta-bottom .ppc-meta-pill.ppc-meta-coverage {
  color: #166534; background: #f0fdf4; padding: 2px 8px; border-radius: 4px;
}
/* Days remaining pill — centered, flex:1 pushes it to center between coverage and actions */
#profileDialog .ppc-days-remaining {
  font-size: 13px; font-weight: 500; padding: 2px 10px; border-radius: 6px;
  white-space: nowrap; display: inline-block;
  width: -moz-fit-content; width: fit-content;
}
/* Inline actions (replaces standalone .ppc-row-actions) */
#profileDialog .ppc-row-actions-inline {
  display: inline-flex; align-items: center; gap: 6px;
  margin-left: auto; flex-shrink: 0;
}
#profileDialog .ppc-row-actions-inline .mini-action {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 14px; font-weight: 400; padding: 5px 14px;
  border: 1px solid #d7e2ef; border-radius: 6px;
  background: #fff; color: #334155; cursor: pointer;
  white-space: nowrap; transition: background .15s, border-color .15s;
  line-height: 1.4;
}
#profileDialog .ppc-row-actions-inline .mini-action .bi {
  font-size: 13px; line-height: 1;
}
#profileDialog .ppc-row-actions-inline .mini-action:hover {
  border-color: #93b9e8; background: #f4f8fd; color: #1d4ed8;
}
#profileDialog .ppc-row-actions-inline [data-edit-policy] {
  border-color: #bfdbfe; background: #eff6ff; color: #1d4ed8;
}

/* ── Late fee prominent panel ── */
#profileDialog .ppc-latefee-panel {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 16px; background: #fffbeb; border: 1.5px solid #fde68a;
  border-radius: 8px; flex-wrap: wrap;
}
#profileDialog .ppc-latefee-panel .ppc-latefee-icon {
  font-size: 22px; color: #d97706; flex: 0 0 auto;
  display: flex; align-items: center;
}
#profileDialog .ppc-latefee-panel .ppc-latefee-label {
  font-size: 14px; font-weight: 400; color: #92400e;
  text-transform: uppercase; letter-spacing: .4px; white-space: nowrap;
}
#profileDialog .ppc-latefee-panel .ppc-latefee-value {
  font-size: 15px; font-weight: 400; color: #78350f; flex: 1 1 auto;
  min-width: 0;
}
#profileDialog .ppc-latefee-panel .ppc-latefee-value strong {
  color: #b45309; font-size: 16px; margin-left: 4px;
}
#profileDialog .ppc-latefee-panel .ppc-latefee-edit-btn {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 14px; padding: 6px 16px;
  border: 1.5px solid #f59e0b; border-radius: 6px;
  background: #fff; color: #b45309; cursor: pointer;
  white-space: nowrap; transition: background .15s, border-color .15s;
  line-height: 1.4; flex: 0 0 auto;
}
#profileDialog .ppc-latefee-panel .ppc-latefee-edit-btn:hover {
  background: #fef3c7; border-color: #d97706;
}
#profileDialog .ppc-latefee-panel .ppc-latefee-edit-btn .bi {
  font-size: 14px; line-height: 1;
}

/* ── Late fee editor (boss-only, hidden by default) ── */
#profileDialog .ppc-latefee-editor {
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px;
  padding: 10px 0; border-top: 1px solid #fde68a; margin-top: 0;
}
#profileDialog .ppc-latefee-editor .ppc-latefee-select {
  font-size: 14px; padding: 4px 8px; max-width: 320px; border: 1px solid #d7e2ef; border-radius: 5px;
}
#profileDialog .ppc-latefee-editor .ppc-latefee-amt {
  font-size: 14px; width: 90px; padding: 4px 8px; border: 1px solid #d7e2ef; border-radius: 5px;
}
#profileDialog .ppc-latefee-editor .mini-action {
  font-size: 13px; padding: 4px 12px;
}

/* ── Actions row (inline, moved into ppc-row-meta-bottom) ── */

/* ── Empty state ── */
#profileDialog .ppc-empty-state {
  display: flex; flex-direction: column; align-items: center; gap: 16px;
  padding: 32px 16px; text-align: center;
}
#profileDialog .ppc-empty-state .pe-shield-icon {
  width: 44px; height: 44px; flex: 0 0 44px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 12px; background: #eef5ff; color: #3978c9;
  font-size: var(--fs-xl);
}
#profileDialog .ppc-empty-state .pe-empty-content {
  display: flex; flex-direction: column; gap: 4px; min-width: 0;
}
#profileDialog .ppc-empty-state .pe-empty-main {
  font-size: var(--fs-sm); font-weight: 400; color: #334155;
  margin: 0; line-height: 1.5;
}
#profileDialog .ppc-empty-state .pe-empty-hint {
  font-size: var(--fs-xs); font-weight: 400; color: #94a3b8;
  margin: 0; line-height: 1.45;
}

/* ── Responsive ── */
@media (max-width: 860px) {
  #profileDialog .ppc-row-main { grid-template-columns: 1fr; gap: 8px; }
  #profileDialog .ppc-row-grid { grid-template-columns: repeat(3, 1fr); gap: 2px 8px; }
  #profileDialog .ppc-policy-row { padding: 12px 14px; }
  #profileDialog .ppc-latefee-panel { flex-direction: column; align-items: flex-start; gap: 6px; }
  #profileDialog .ppc-row-meta-bottom { gap: 4px 8px; }
}
@media (max-width: 760px) {
  #profileDialog .ppc-section-head { flex-direction: column; align-items: flex-start; gap: 8px; }
  #profileDialog .ppc-stats-strip { grid-template-columns: 1fr; gap: 8px; }
  #profileDialog .ppc-stat { padding: 10px 12px; }
  #profileDialog .ppc-stat-value { font-size: 18px; }
  #profileDialog .ppc-row-main { grid-template-columns: 1fr; gap: 8px; }
  #profileDialog .ppc-row-grid { grid-template-columns: 1fr 1fr; gap: 2px 8px; }
  #profileDialog .ppc-row-grid > .ppc-field:nth-child(3n+1),
  #profileDialog .ppc-row-grid > .ppc-field:nth-child(3n+2),
  #profileDialog .ppc-row-grid > .ppc-field:nth-child(3n) { align-items: flex-start; }
  #profileDialog .ppc-row-grid > .ppc-field:nth-child(3n+1) em,
  #profileDialog .ppc-row-grid > .ppc-field:nth-child(3n+1) .ppc-field-value,
  #profileDialog .ppc-row-grid > .ppc-field:nth-child(3n+2) em,
  #profileDialog .ppc-row-grid > .ppc-field:nth-child(3n+2) .ppc-field-value,
  #profileDialog .ppc-row-grid > .ppc-field:nth-child(3n) em,
  #profileDialog .ppc-row-grid > .ppc-field:nth-child(3n) .ppc-field-value { text-align: left; }
  #profileDialog .ppc-policy-row { padding: 12px 14px; gap: 8px; }
  #profileDialog .ppc-row-meta-bottom { flex-direction: column; align-items: flex-start; gap: 4px; }
  #profileDialog .ppc-row-actions-inline { margin-left: 0; }
  #profileDialog .ppc-empty-state { padding: 24px 12px; }
  #profileDialog .ppc-latefee-panel { padding: 10px 12px; }
}

/* ── #profileCardStatus audit footer: right align, larger font/spacing/contrast ── */
#profileDialog .overview-audit {
  display: flex;
  justify-content: flex-end;
  gap: 24px;
  padding: 10px 16px;
  margin-top: 10px;
  border-top: 1px solid #e2e8f0;
  font-size: var(--fs-base);
  color: #475569;
  background: #fafbfc;
  border-radius: 6px;
  flex-wrap: wrap;
}
#profileDialog .overview-audit span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  line-height: 1.5;
}
#profileDialog .overview-audit b {
  color: #0f172a;
  font-size: 14px;
}
@media (max-width: 760px) {
  #profileDialog .overview-audit {
    justify-content: flex-start;
    gap: 10px;
    flex-direction: column;
  }
}

/* ── Annual contracts empty state ── */
#profileDialog #profilePolicy { display: none !important; }

#profileDialog #profileCardAnnualContracts .empty-state-card {
  margin: 0;
  padding: 18px 16px;
}

#profileDialog #profileCardAnnualContracts .empty-state-card .action-note {
  margin: 0;
}

/* ═══════════════════════════════════════════════════════════════════
   Workspace unified typography (Req 3)
   - Main title: 18px/700
   - Subcard/section title: 15px/700
   - Label: 13px/500, color #8b95a5
   - Value: 15px/600
   - Empty value: 14px/400, gray
   - Key values/status: more prominent
   ═══════════════════════════════════════════════════════════════════ */
#profileDialog #profileCardStatus .sf-card-title {
  font-size: 18px; font-weight: 700;
}
#profileDialog #profileCardStatus .ws-section-title {
  font-size: 15px; font-weight: 700;
}
#profileDialog #profileCardStatus .sf-kv-label {
  font-size: 15px; font-weight: 600; color: #64748b;
}
#profileDialog #profileCardStatus .sf-kv-val {
  font-size: 15px; font-weight: 600; text-align: right;
}
#profileDialog #profileCardStatus .sf-kv-val.sf-kv-empty {
  font-size: 15px; font-weight: 600;
}
/* Form controls — keep compact */
#profileDialog #profileCardStatus .sf-edit-btn,
#profileDialog #profileCardStatus .sf-inline-actions button,
#profileDialog #profileCardStatus input,
#profileDialog #profileCardStatus select,
#profileDialog #profileCardStatus textarea,
#profileDialog #profileCardStatus label {
  font-size: 13px; font-weight: 400;
}
/* Inline debt editor: preserve existing layout at tighter spacing */
#profileDialog #profileCardStatus #debtEditor {
  padding: 8px 20px;
}
#profileDialog #profileCardStatus #debtEditor label {
  font-size: 13px; font-weight: 500;
}
#profileDialog #profileCardStatus .sf-inline-actions {
  padding: 6px 0 4px;
}
/* Debt edit button */
#profileDialog #profileCardStatus .sf-card-footer {
  padding: 6px 20px 10px;
}
#profileDialog #profileCardStatus .sf-card-footer .sf-edit-btn,
#profileDialog #profileCardStatus .sf-card-footer .mini-action {
  font-size: 13px; padding: 4px 12px;
}

/* ═══════════════════════════════════════════════════════════════════
   (pf-data-section CSS removed — Excel full-data area eliminated in workspace redesign)
   ═══════════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════════
   Req 2: Multi-policy cell rendering (overview table vertical stacks)

/* ═══════════════════════════════════════════════════════════════════
   Req 2: Multi-policy cell rendering (overview table vertical stacks)
   ═══════════════════════════════════════════════════════════════════ */

/* Multi-policy cell container */
.ov-mp-cell {
  padding: 0 !important;
  vertical-align: top;
  min-width: 100px;
  max-width: 180px;
}

/* Individual policy line */
.ov-mp-line {
  display: block;
  min-height: 22px;
  line-height: 22px;
  padding: 1px 8px;
  font-size: var(--fs-sm);
  color: #1e293b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border-bottom: 1px solid #f8fafc;
}

/* Alternating background for readability */
.ov-mp-line:nth-child(odd) {
  background: rgba(241,245,249,.4);
}

/* Empty/subdued placeholder line */
.ov-mp-line.ov-mp-empty {
  color: #cbd5e1;
  font-style: italic;
}

/* ═══════════════════════════════════════════════════════════════════
   Req 2: Multi-policy drawer field rendering
   ═══════════════════════════════════════════════════════════════════ */

/* Multi-policy row in drawer */
.ov-dr-mp-row {
  align-items: flex-start !important;
}

/* Vertical stack container in drawer */
.ov-dr-mp-stack {
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* Each policy line in drawer stack */
.ov-dr-mp-line {
  display: block;
  min-height: 20px;
  line-height: 20px;
  font-size: var(--fs-sm);
  color: #1e293b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 1px 0;
}

.ov-dr-mp-line:nth-child(odd) {
  background: rgba(241,245,249,.35);
}

/* Empty placeholder in drawer policy stack */
.ov-dr-mp-line.ov-dr-empty {
  color: #cbd5e1;
  font-style: italic;
}

/* Responsive drawer */
@media (max-width: 680px) {
  .ov-dr-mp-stack {
    max-width: 100%;
    overflow-x: auto;
  }
  .ov-dr-mp-line {
    white-space: normal;
    word-break: break-word;
  }
}

/* ═══════════════════════════════════════════════════════════════════
   Drawer policy info table (per-policy rows, not vertical stacks)
   ═══════════════════════════════════════════════════════════════════ */
.ov-dr-policy-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.ov-dr-policy-table {
  width: max-content; min-width: 100%;
  border-collapse: collapse;
  font-size: var(--fs-sm);
  table-layout: auto;
}
.ov-dr-policy-table thead th {
  position: sticky; top: 0; z-index: 1;
  padding: 6px 8px; font-size: 12px; font-weight: 400;
  color: #64748b; background: #f1f5f9;
  border-bottom: 2px solid #e2e8f0;
  white-space: nowrap; text-align: left;
}
.ov-dr-policy-table tbody td {
  padding: 5px 8px; border-bottom: 1px solid #f1f5f9;
  color: #334155; white-space: nowrap; line-height: 1.5;
}
.ov-dr-policy-table tbody tr:hover td {
  background: #f8fafc;
}
.ov-dr-policy-table tbody tr:last-child td {
  border-bottom: none;
}

/* ============================================================
   Global font-weight / font-style normalization
   ============================================================ */
body * {
  font-weight: 400 !important;
  font-style: normal !important;
}

/* Pseudo-elements: only force font-style, keep Bootstrap Icons glyph via font-family + weight */
body *::before,
body *::after {
  font-style: normal !important;
}

/* Explicit element-level overrides so specificity is unambiguous */
h1, h2, h3, h4, h5, h6,
b, strong,
em, i,
button,
input, select, textarea,
table,
dialog {
  font-weight: 400 !important;
  font-style: normal !important;
}