/* CRM 公共样式（由 base.html 内联样式外置，勿手工重复维护两处） */
    :root {
      /* ===== 品牌配色：翡翠绿 Emerald（改这里即可全局换色）===== */
      --brand: #34d399;          /* 主品牌浅色（强调/描边/焦点） */
      --brand-mid: #10b981;      /* 品牌中间色（渐变起点） */
      --brand-dark: #059669;     /* 主色（按钮/链接/激活） */
      --brand-deep: #064e3b;     /* 深色（hover 加深） */
      --brand-light: #34d399;
      --brand-rgb: 5,150,105;        /* --brand-dark 的 RGB（用于 rgba） */
      --brand-mid-rgb: 16,185,129;   /* --brand-mid 的 RGB */
      --brand-light-rgb: 52,211,153; /* --brand-light 的 RGB */
      --bg: #f1f9f4; --card-border: #e8eef5;   /* 页面背景(随主题) */
      --side-1: #052e22; --side-2: #0a3d2c; --side-3: #083527;  /* 侧边栏渐变(随主题) */
      --sidebar-w: 236px; --radius: 14px;
      --shadow-xs: 0 1px 2px rgba(15,23,42,.04);
      --shadow-sm: 0 1px 3px rgba(15,23,42,.05), 0 2px 10px rgba(15,23,42,.04);
      --shadow-md: 0 6px 20px rgba(15,23,42,.09);
      --shadow-lg: 0 16px 44px rgba(15,23,42,.14);

      /* ===== 设计令牌（统一规范：间距/字号/语义色/规格）===== */
      /* 间距体系（8pt 基准） */
      --space-1: 4px;   --space-2: 8px;   --space-3: 12px;  --space-4: 16px;
      --space-5: 20px;  --space-6: 24px;  --space-7: 32px;  --space-8: 40px;
      /* 字号体系 */
      --fs-xs: 12px;   --fs-sm: 13px;   --fs-base: 14px;  --fs-md: 15px;
      --fs-lg: 16px;   --fs-xl: 18px;   --fs-2xl: 22px;   --fs-3xl: 28px;
      /* 行高 */
      --lh-tight: 1.25;  --lh-base: 1.5;  --lh-relaxed: 1.7;
      /* 圆角 */
      --radius-xs: 6px;  --radius-sm: 8px;  --radius-md: 10px;
      --radius-lg: 14px; --radius-full: 999px;
      /* 语义色 */
      --success: #10b981;  --warning: #f59e0b;  --danger: #ef4444;  --info: #3b82f6;
      /* 文本层级 */
      --text-1: #0f172a;   --text-2: #475569;   --text-3: #94a3b8;
      /* 表面与边框 */
      --surface: #ffffff;  --surface-2: #f8fafc;
      --border: #e2e8f0;   --border-soft: #eef2f7;
      /* 卡片规格 */
      --card-pad: 16px;    --card-header-h: 44px;  --card-gap: 16px;
      /* 控件高度 */
      --ctl-h-sm: 30px;    --ctl-h: 36px;          --ctl-h-lg: 42px;
      /* 页面边距 */
      --page-pad: 20px;
    }
    /* ===== 主题配色切换（data-theme 属性）=====
       默认(无属性)=翡翠绿；切换后 html[data-theme="sky|indigo|violet"] 覆盖品牌变量 */
    html[data-theme="sky"] {
      --brand: #38bdf8; --brand-mid: #0ea5e9; --brand-dark: #0284c7; --brand-deep: #0c4a6e;
      --brand-light: #38bdf8;
      --brand-rgb: 2,132,199; --brand-mid-rgb: 14,165,233; --brand-light-rgb: 56,189,248;
      --bg: #f2f7fd;
      --side-1: #0a1120; --side-2: #0f1a2e; --side-3: #0d1a31;
    }
    html[data-theme="indigo"] {
      --brand: #818cf8; --brand-mid: #6366f1; --brand-dark: #4f46e5; --brand-deep: #312e81;
      --brand-light: #818cf8;
      --brand-rgb: 79,70,229; --brand-mid-rgb: 99,102,241; --brand-light-rgb: 129,140,248;
      --bg: #f4f4fd;
      --side-1: #111329; --side-2: #161a3a; --side-3: #131733;
    }
    html[data-theme="violet"] {
      --brand: #a78bfa; --brand-mid: #8b5cf6; --brand-dark: #7c3aed; --brand-deep: #4c1d95;
      --brand-light: #a78bfa;
      --brand-rgb: 124,58,237; --brand-mid-rgb: 139,92,246; --brand-light-rgb: 167,139,250;
      --bg: #f7f4fd;
      --side-1: #1c1030; --side-2: #241540; --side-3: #1f1338;
    }
    html[data-theme="rose"] {
      --brand: #fb7185; --brand-mid: #f43f5e; --brand-dark: #e11d48; --brand-deep: #881337;
      --brand-light: #fb7185;
      --brand-rgb: 225,29,72; --brand-mid-rgb: 244,63,94; --brand-light-rgb: 251,113,133;
      --bg: #fdf2f4;
      --side-1: #2b0a14; --side-2: #3b0f1d; --side-3: #34111c;
    }
    html[data-theme="orange"] {
      --brand: #fb923c; --brand-mid: #f97316; --brand-dark: #ea580c; --brand-deep: #7c2d12;
      --brand-light: #fb923c;
      --brand-rgb: 234,88,12; --brand-mid-rgb: 249,115,22; --brand-light-rgb: 251,146,60;
      --bg: #fdf5ef;
      --side-1: #2a1205; --side-2: #381906; --side-3: #33170a;
    }
    html[data-theme="teal"] {
      --brand: #2dd4bf; --brand-mid: #14b8a6; --brand-dark: #0d9488; --brand-deep: #134e4a;
      --brand-light: #2dd4bf;
      --brand-rgb: 13,148,136; --brand-mid-rgb: 20,184,166; --brand-light-rgb: 45,212,191;
      --bg: #f0faf9;
      --side-1: #062c2a; --side-2: #0a3a37; --side-3: #08332f;
    }
    html[data-theme="slate"] {
      --brand: #94a3b8; --brand-mid: #64748b; --brand-dark: #475569; --brand-deep: #1e293b;
      --brand-light: #94a3b8;
      --brand-rgb: 71,85,105; --brand-mid-rgb: 100,116,139; --brand-light-rgb: 148,163,184;
      --bg: #f4f6f8;
      --side-1: #0f172a; --side-2: #1a2436; --side-3: #161f30;
    }
    html[data-theme="amber"] {
      --brand: #fbbf24; --brand-mid: #f59e0b; --brand-dark: #d97706; --brand-deep: #78350f;
      --brand-light: #fbbf24;
      --brand-rgb: 217,119,6; --brand-mid-rgb: 245,158,11; --brand-light-rgb: 251,191,36;
      --bg: #fdf9ef;
      --side-1: #2a1a05; --side-2: #382206; --side-3: #33200a;
    }

    /* 主题切换器样式 */
    .theme-item { display: flex; align-items: center; gap: 8px; font-size: 13px; border-radius: 8px; }
    .theme-item.active { background: #f0fdf4; font-weight: 600; }
    .theme-dot { width: 16px; height: 16px; border-radius: 50%; display: inline-block; box-shadow: 0 1px 3px rgba(0,0,0,.2); border: 2px solid #fff; }
    html[data-bs-theme="dark"] .theme-item.active { background: #1a2740; }

    /* 统一基础字号，Bootstrap 的 rem 组件（按钮/表单等）随之放大；
       始终为纵向滚动条预留空间：页面长短切换（如点击侧栏进入高页面）时
       不再因滚动条出现/消失导致整页左右“跳动” */
    html { font-size: 14.5px; scrollbar-gutter: stable; }
    body {
      background:
        radial-gradient(1100px 520px at 12% -8%, rgba(var(--brand-light-rgb),.07), transparent 55%),
        radial-gradient(900px 480px at 108% 4%, rgba(var(--brand-mid-rgb),.05), transparent 50%),
        var(--bg);
      background-attachment: fixed;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
                   "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
      color: #1e293b; font-size: 14.5px; line-height: 1.65;
    }

    /* ---- 侧边栏 ---- */
    .sidebar {
      width: var(--sidebar-w); height: 100vh;
      background:
        radial-gradient(420px 240px at 50% -60px, rgba(var(--brand-light-rgb),.16), transparent 62%),
        linear-gradient(180deg, var(--side-1) 0%, var(--side-2) 55%, var(--side-3) 100%);
      position: fixed; top: 0; left: 0; z-index: 100;
      display: flex; flex-direction: column; overflow: hidden;
      box-shadow: 2px 0 22px rgba(2,6,23,.18);
    }
    .sidebar::after {
      content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 130px;
      background: radial-gradient(320px 150px at 50% 100%, rgba(var(--brand-mid-rgb),.10), transparent 70%);
      pointer-events: none;
    }
    .sidebar .brand {
      color: #fff; padding: 20px 18px 16px; font-size: 16.5px; font-weight: 700;
      border-bottom: 1px solid rgba(255,255,255,.08); letter-spacing: .5px;
      display: flex; align-items: center; gap: 11px; flex-shrink: 0; position: relative; z-index: 1;
    }
    .sidebar .brand .logo {
      width: 38px; height: 38px; border-radius: 11px;
      background: transparent;   /* logo 本身为透明图，避免蓝色垫底造成金字看不清 */
      display: inline-flex; align-items: center; justify-content: center; font-size: 17px; color: #fff;
      box-shadow: 0 2px 10px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.07);
    }
    .sidebar .brand-text { display: flex; flex-direction: column; line-height: 1.25; }
    .sidebar .brand-name { font-size: 15.5px; letter-spacing: .5px; }
    .sidebar .brand-sub { font-size: 11px; font-weight: 500; color: #7c8ba5; letter-spacing: .3px; margin-top: 2px; }

    /* ===== Logo 跑马灯：彩色流光沿边框循环流转 =====
       conic 渐变放在 ::before 上并用遮罩只留环宽（遮罩不能放环本体，否则子元素 logo 图也会被遮掉） */
    .logo-ring {
      --mq-a: 0deg;
      position: relative; display: inline-flex; flex: none;
      padding: 3px; border-radius: 14px;
    }
    .logo-ring::before {
      content: ''; position: absolute; inset: 0; border-radius: inherit;
      padding: inherit;
      background: conic-gradient(from var(--mq-a),
        #f43f5e, #f59e0b, #facc15, #22c55e, #06b6d4, #3b82f6, #8b5cf6, #ec4899, #f43f5e);
      -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
      -webkit-mask-composite: xor;
              mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
              mask-composite: exclude;
      animation: logo-marquee 3s linear infinite;
    }
    .logo-ring > img { position: relative; z-index: 1; display: block; }
    .logo-ring-sm { padding: 2px; border-radius: 10px; }
    .logo-ring-sm > img { border-radius: 8px; }
    .logo-ring-auth { border-radius: 19px; }
    /* ---- 登录页 ---- */
    .login-card {
      border-radius: var(--radius-lg); border: 1px solid rgba(255,255,255,.25);
      background: rgba(255,255,255,.97); backdrop-filter: blur(12px);
      box-shadow: 0 24px 70px rgba(0,0,0,.4); animation: flashIn .4s ease;
      width: 100%; max-width: 420px;
    }
    .login-card .form-control, .login-card .form-select { min-height: 40px; }
    .login-card .input-group-text { border-color: var(--border); }
    .login-card .btn-primary { min-height: 44px; font-size: var(--fs-md); border-radius: var(--radius-sm); }
    .login-card .form-label { font-weight: 500; }
    @media (max-width: 575.98px) {
      .login-card { border-radius: var(--radius-md); max-width: 100%; }
      .login-card.p-4 { padding: var(--space-4) !important; }
      .login-card .logo-ring-auth img { height: 60px !important; }
    }
    .logo-ring-auth > img { border-radius: 16px; }
    @keyframes logo-marquee { to { --mq-a: 360deg; } }
    /* @property 让渐变角度可动画；不支持的浏览器降级为静态彩色环 */
    @property --mq-a { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
    @media (prefers-reduced-motion: reduce) { .logo-ring::before { animation: none; } }
    .sidebar .nav-wrap {
      /* 左右 padding 归零：滚动条贴右边缘；菜单项自身 margin 提供缩进 */
      padding: 12px 0 20px; flex: 1; min-height: 0;
      overflow-y: auto; overflow-x: hidden; position: relative; z-index: 1;
      /* 始终预留滚动条空间：折叠分组导致内容高度变化时，滚动条出现/消失不会挤压菜单宽度（防抖动） */
      scrollbar-gutter: stable;
    }
    .side-group {
      color: #8199b8; padding: var(--space-4) var(--space-3) var(--space-1);
      font-size: 12px; letter-spacing: .8px; font-weight: 600;
      text-transform: none;
    }
    .sidebar .nav-link {
      color: #b6c2d6; padding: 8px 12px; margin: 1px 0; font-size: 13.5px;
      border-radius: var(--radius-sm); position: relative;
      transition: color .16s ease, background-color .16s ease, padding-left .16s ease;
      display: flex; align-items: center; gap: 10px;
    }
    .sidebar .nav-link i { width: 18px; font-size: 15px; text-align: center; opacity: .9; flex: none; }
    .sidebar .nav-link:hover { color: #fff; background: rgba(255,255,255,.07); }
    .sidebar .nav-link.active {
      color: #fff; font-weight: 600;
      background: linear-gradient(90deg, rgba(var(--brand-light-rgb),.24), rgba(var(--brand-light-rgb),.07));
      box-shadow: inset 0 0 0 1px rgba(var(--brand-light-rgb),.3), 0 2px 10px rgba(var(--brand-rgb),.18);
    }
    /* 当前项左侧指示条 */
    .sidebar .nav-link.active::before {
      content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
      width: 3px; height: 18px; border-radius: 0 3px 3px 0; background: var(--brand-light);
    }
    .sidebar .sidebar-foot {
      color: #64748b; font-size: 12px; padding: 14px 18px; border-top: 1px solid rgba(255,255,255,.07);
      display: flex; align-items: center; gap: 8px; flex-shrink: 0; position: relative; z-index: 1;
    }

    /* ---- 主区 ---- */
    .main { margin-left: var(--sidebar-w); min-height: 100vh; display: flex; flex-direction: column; }
    .topbar {
      background: rgba(255,255,255,.76);
      backdrop-filter: blur(14px) saturate(1.5);
      -webkit-backdrop-filter: blur(14px) saturate(1.5);
      padding: 11px 26px; border-bottom: 1px solid rgba(148,163,184,.16);
      display: flex; align-items: center; justify-content: space-between;
      position: sticky; top: 0; z-index: 99;
      box-shadow: 0 1px 0 rgba(255,255,255,.65) inset, 0 6px 22px rgba(15,23,42,.05);
    }
    .topbar::after {
      content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
      background: linear-gradient(90deg, transparent, rgba(var(--brand-light-rgb),.5), transparent);
      pointer-events: none;
    }
    .topbar h5 { font-weight: 700; color: #0f172a; }
    .page-back-btn {
      flex: none; width: 32px; height: 32px; padding: 0;
      display: inline-flex; align-items: center; justify-content: center;
      border-radius: 50%; border: 1px solid var(--card-border); background: #fff;
      color: #334155; font-size: 15px; line-height: 1;
    }
    .page-back-btn:hover { background: #f1f5f9; color: #0f172a; }
    .content { padding: var(--space-5) var(--space-6); flex: 1; }

    /* ---- 卡片 ---- */
    .card {
      border: 1px solid var(--border-soft); box-shadow: var(--shadow-sm);
      border-radius: var(--radius-lg); transition: box-shadow .22s ease, transform .22s ease;
      background: var(--surface);
    }
    .card:hover { box-shadow: var(--shadow-md); }
    .card-header {
      min-height: var(--card-header-h); padding: 0 var(--card-pad);
      display: flex; align-items: center; gap: 6px;
      background: var(--surface); border-bottom: 1px solid var(--border-soft);
      font-weight: 600; font-size: var(--fs-base); color: var(--text-1);
    }
    .card-body { padding: var(--card-pad); }
    /* 图标徽章尺寸体系（成套比例：圆角≈尺寸30%、图标≈尺寸47%）
       卡片头 26×26/r8/14 · 统计卡 36×36/r11/17 · KPI 46×46/r14/21 · 移动端 KPI 40×40/r12/18
       原先统计卡是 30×30 但圆角被覆盖成 14px（近乎正圆），与 26px 的 r8、46px 的 r12 不成套 */
    .stat-icon { width: 36px; height: 36px; border-radius: 11px; display: flex; align-items: center; justify-content: center; font-size: 17px; box-shadow: 0 2px 6px rgba(15,23,42,.06); }
    .stat-card:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(15,23,42,.1); border-color: #dbeafe; }

    /* ---- 表格 ---- */
    .table > :not(caption) > * > * { padding: 10px 12px; }
    .table thead th {
      background: var(--surface-2); font-size: var(--fs-sm); color: var(--text-2); font-weight: 600;
      border-bottom: 1px solid var(--border); white-space: nowrap; letter-spacing: .2px;
    }
    .table tbody { font-size: var(--fs-base); }
    .table tbody tr { transition: background .15s ease; }
    .table-hover tbody tr:hover { background: var(--surface-2); }
    .table td { vertical-align: middle; border-color: var(--border-soft); }

    /* 详情页信息表（label/value 排版统一） */
    .table-sm > :not(caption) > * > * { padding: 6px 10px; }
    .table-sm th { font-weight: 500; color: var(--text-2); background: transparent; white-space: nowrap; }
    .table-sm td { color: var(--text-1); }
    .table-sm thead th { color: var(--text-2); background: var(--surface-2); }

    /* ---- 表单 ---- */
    .form-control, .form-select {
      min-height: var(--ctl-h); border-radius: var(--radius-sm); border-color: var(--border);
      font-size: var(--fs-base); transition: border-color .15s ease, box-shadow .15s ease;
    }
    .form-control:focus, .form-select:focus {
      border-color: var(--brand); box-shadow: 0 0 0 3px rgba(var(--brand-light-rgb),.15);
    }
    .form-label { font-size: var(--fs-sm); font-weight: 600; color: var(--text-2); margin-bottom: 4px; }
    .form-text { font-size: var(--fs-xs); color: var(--text-3); }

    /* 表单统一：分隔线与按钮区 */
    form hr { border: 0; border-top: 1px solid var(--border-soft); opacity: 1; margin: var(--space-4) 0; }
    form .row > .col-12.d-flex.gap-2 { padding-top: var(--space-2); margin-top: var(--space-1); }
    form .row > .col-12.d-flex.gap-2 .btn-primary { min-width: 92px; }
    /* 表单必填标记 */
    .form-label .text-danger { font-weight: 400; }

    /* ---- 按钮 ---- */
    .btn { min-height: var(--ctl-h); border-radius: var(--radius-sm); font-size: var(--fs-base); font-weight: 500; transition: all .15s ease; }
    .btn-sm { min-height: var(--ctl-h-sm); font-size: var(--fs-sm); }
    .btn-lg { min-height: var(--ctl-h-lg); }
    .btn:hover { transform: translateY(-1px); }
    .btn:active { transform: translateY(0); }
    .btn-primary { background: linear-gradient(135deg,var(--brand-mid),var(--brand-dark)); border: 0; box-shadow: 0 2px 6px rgba(var(--brand-rgb),.22); }
    .btn-primary:hover { background: linear-gradient(135deg,var(--brand-dark),#0369a1); box-shadow: 0 4px 14px rgba(var(--brand-rgb),.35); }
    .btn-outline-primary { border-color: #bae6fd; color: #0369a1; }
    .btn-outline-primary:hover { background: #e0f2fe; border-color: #7dd3fc; color: #0369a1; }

    /* ---- 徽章/进度条 ---- */
    /* ===== 细节优化（统一：徽章/列表组/滚动条/链接/动效）===== */
    .badge { font-weight: 500; border-radius: var(--radius-xs); font-size: var(--fs-xs); padding: .34em .6em; letter-spacing: .2px; }
    .list-group-item { border-color: var(--border-soft); }
    .list-group-item-action:hover { background: var(--surface-2); }
    a { transition: color .15s ease; }
    /* 滚动条（细窄、圆角、淡色） */
    /* 卡片内链接悬停 */
    .card a.text-decoration-none:hover { color: var(--brand-dark) !important; }
    .progress { background: #eef2f7; border-radius: 6px; }

    /* ---- 用户菜单 ---- */
    .user-menu-btn { transition: background .15s ease; }
    .user-menu-btn:hover, .user-menu-btn:focus { background: #f1f5f9 !important; }
    .user-menu-btn::after { margin-left: 2px; }

    /* ---- 头像 ---- */
    .avatar { width: 34px; height: 34px; border-radius: 50%; background: linear-gradient(135deg,var(--brand-light),var(--brand-dark)); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; }

    /* ---- flash 动画 ---- */
    .flash { margin-bottom: 0; animation: flashIn .3s ease; }
    @keyframes flashIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

    /* ---- 页面过渡（仅淡入，不做位移动画：避免每次菜单跳转时内容整体
       “滑入上移”造成跳动感，尤其日历等高页面加载较慢时更明显） ---- */
    @keyframes fadeInUp { from { opacity: 0; } to { opacity: 1; } }
    .content { animation: fadeInUp .2s ease; }
    ::selection { background: rgba(56, 189, 248, .25); }
    a:focus-visible, button:focus-visible, .nav-link:focus-visible,
    .dropdown-item:focus-visible, .btn:focus-visible {
      outline: 2px solid var(--brand);
      outline-offset: 2px;
    }

    /* ---- 分页 ---- */
    .pagination { margin-bottom: 0; gap: 2px; }
    .pagination .page-link { border-radius: var(--radius-sm) !important; margin: 0; padding: 6px 11px; font-size: var(--fs-sm); color: var(--text-2); border-color: var(--border); transition: all .15s ease; }
    .pagination .page-link:hover { background: var(--surface-2); color: var(--brand-dark); border-color: var(--brand); }
    .pagination .page-item.active .page-link { background: var(--brand-dark); border-color: var(--brand-dark); box-shadow: 0 2px 8px rgba(var(--brand-rgb),.25); }
    .pagination .page-item.disabled .page-link { color: var(--text-3); }

    /* ---- 空状态 ---- */
    .empty-tip { color: #94a3b8; }
    .empty-state {
      text-align: center; padding: 42px 16px; color: #94a3b8;
    }
    .empty-state i { font-size: 34px; display: block; margin-bottom: 10px; opacity: .4; }
    .empty-state .empty-title { color: #64748b; font-weight: 500; font-size: 14px; }
    .empty-state .empty-sub { font-size: 12.5px; margin-top: 4px; color: #94a3b8; }

    /* ---- 卡片标题强调条 ---- */
    .card-header { position: relative; padding-left: 20px; }
    .card-header::before {
      content: ''; position: absolute; left: 0; top: 11px; bottom: 11px; width: 3px;
      border-radius: 3px; background: linear-gradient(180deg, var(--brand-light), var(--brand-dark));
    }

    /* ---- 统计卡片图标渐变 + 数值强调 ---- */
    .stat-icon.text-bg-primary { background: linear-gradient(135deg,var(--brand-light),var(--brand-dark)) !important; }
    .stat-icon.text-bg-info    { background: linear-gradient(135deg,#22d3ee,#0891b2) !important; }
    .stat-icon.text-bg-success { background: linear-gradient(135deg,#34d399,#16a34a) !important; }
    .stat-icon.text-bg-warning { background: linear-gradient(135deg,#fbbf24,#d97706) !important; }
    .stat-icon.text-bg-danger  { background: linear-gradient(135deg,#f87171,#dc2626) !important; }
    .stat-icon.text-bg-secondary { background: linear-gradient(135deg,#94a3b8,#64748b) !important; }

    /* ---- 列表组 / 徽章 / 标签页 ---- */
    .list-group-item { border-color: #f1f5f9; padding: .42rem 1rem; }
    .list-group-item:hover { background: #f8fbff; }
    .badge { border-radius: 6px; padding: .45em .6em; font-weight: 500; }
    .nav-tabs .nav-link { color: #64748b; font-weight: 500; border-radius: 8px 8px 0 0; }
    .nav-tabs .nav-link.active { color: var(--brand-dark); font-weight: 600; }

    /* ---- 模态框 ---- */
    .modal-content { border-radius: 16px; border: 0; box-shadow: var(--shadow-lg); }
    .modal-header { border-bottom: 1px solid #f1f5f9; background: linear-gradient(180deg,#fcfdff,#fff); border-radius: 16px 16px 0 0; }
    .modal-footer { border-top: 1px solid #f1f5f9; }

    /* ---- 输入框组 ---- */
    .input-group-text { color: #64748b; border-color: #e2e8f0; }
    .input-group .form-control:focus { z-index: 1; }

    /* ---- 全局链接过渡 ---- */
    a { transition: color .15s ease; }
    a.text-decoration-none { color: inherit; }
    a.text-decoration-none:hover { color: var(--brand-dark); }

    /* ---- 详情页字段分组小标题 ---- */
    .detail-group-title {
      font-size: 12px; color: #64748b; font-weight: 600;
      letter-spacing: .5px; margin: 10px 0 6px; text-transform: uppercase;
      display: flex; align-items: center; gap: 4px;
    }
    .detail-group-title::after { content: ''; flex: 1; height: 1px; background: #eef2f7; margin-left: 8px; }

    /* ---- 用户菜单分隔线 ---- */
    .dropdown-menu { border: 0; box-shadow: var(--shadow-md); border-radius: 12px; padding: 6px; }
    .dropdown-item { border-radius: 8px; padding: 8px 12px; font-size: 13.5px; }
    .dropdown-item:hover { background: #f1f5f9; }

    /* ---- 侧边栏折叠分组 ---- */
    .side-group { cursor: pointer; user-select: none; transition: color .15s; }
    .side-group:hover { color: #94a3b8; }
    .side-group .chevron { font-size: 10px; transition: transform .2s ease; opacity: .6; margin-left: auto; }
    .side-group.collapsed .chevron { transform: rotate(-90deg); }
    .side-group.collapsed + .nav-group { display: none; }

    /* ---- 全局搜索 ---- */
    .global-search { position: relative; min-width: 200px; }
    .global-search .input-group-text { background: #f8fafc; border-right: 0; padding: .35rem .5rem; }
    .global-search .form-control { border-left: 0; font-size: 13px; padding: .35rem .5rem; }
    .global-search .form-control:focus { box-shadow: none; border-color: #e2e8f0; }
    .global-search .input-group:focus-within { box-shadow: 0 0 0 3px rgba(var(--brand-light-rgb),.15); border-radius: 8px; }
    .search-dropdown {
      position: absolute; top: calc(100% + 4px); left: 0; right: 0;
      background: #fff; border: 1px solid #e9eef5; border-radius: 10px;
      box-shadow: 0 8px 28px rgba(15,23,42,.12); max-height: 320px;
      overflow-y: auto; z-index: 200; display: none;
    }
    .search-dropdown.show { display: block; }
    .search-item { display: flex; align-items: center; gap: 8px; padding: 8px 12px; font-size: 13.5px; color: #475569; border-radius: 8px; margin: 2px; text-decoration: none; transition: background .12s; }
    .search-item:hover { background: #f1f5f9; color: var(--brand-deep); }
    .search-item i { font-size: 15px; color: #94a3b8; width: 18px; }
    .search-item .search-label { font-weight: 500; }
    .search-item .search-sub { font-size: 11.5px; color: #94a3b8; }
    .search-more { border-top: 1px solid #eef2f7; margin-top: 2px; padding: 2px; position: sticky; bottom: 0; background: #fff; }
    .search-more a { display: block; text-align: center; font-size: 12.5px; color: var(--brand-dark); padding: 7px; border-radius: 8px; text-decoration: none; }
    .search-more a:hover { background: #f1f5f9; }
    /* 搜索分组/历史 */
    .search-sec { padding: 4px 2px; }
    .search-sec + .search-sec { border-top: 1px solid #eef2f7; margin-top: 2px; padding-top: 6px; }
    .search-sec-h { display: flex; align-items: center; gap: 6px; padding: 6px 12px 4px; font-size: 11px; color: #64748b; font-weight: 600; letter-spacing: .4px; text-transform: uppercase; }
    .search-sec-h i { font-size: 12px; color: #94a3b8; }
    .search-sec-cnt { margin-left: auto; font-size: 11px; font-weight: 400; color: #94a3b8; background: #f1f5f9; border-radius: 8px; padding: 0 6px; }
    .search-sec-clear { margin-left: auto; font-size: 11.5px; font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--brand-dark); text-decoration: none; }
    .search-sec-clear:hover { text-decoration: underline; }
    .search-hist { color: #475569; }
    .search-hist .search-hist-go { margin-left: auto; font-size: 13px; color: #cbd5e1; }
    html[data-bs-theme="dark"] .search-sec + .search-sec { border-color: #1e293b; }
    html[data-bs-theme="dark"] .search-sec-h { color: #94a3b8; }
    html[data-bs-theme="dark"] .search-sec-cnt { background: #1a2740; color: #94a3b8; }

    /* ---- 侧边栏菜单工具栏（过滤+全展开） ---- */
    .nav-toolbar { display: flex; gap: 6px; padding: 10px 12px 6px; align-items: center; }
    .nav-filter { flex: 1; min-width: 0; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); color: #cbd5e1; font-size: 12.5px; padding: 5px 8px; border-radius: 8px; }
    .nav-filter::placeholder { color: #64748b; }
    .nav-filter:focus { outline: none; border-color: var(--brand); background: rgba(255,255,255,.1); box-shadow: 0 0 0 3px rgba(var(--brand-light-rgb),.15); }
    .nav-act-btn { flex: none; width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); color: #94a3b8; border-radius: 8px; cursor: pointer; font-size: 14px; }
    .nav-act-btn:hover { background: rgba(255,255,255,.12); color: #fff; }

    .list-group-item mark, .search-item mark { background: #fff3a0; color: inherit; padding: 0 1px; border-radius: 3px; }
    html[data-bs-theme="dark"] .list-group-item mark, html[data-bs-theme="dark"] .search-item mark { background: #7a5c00; color: #fff; }

    /* ---- 面包屑 ---- */
    .breadcrumb-wrap { padding: 0 0 4px; }
    .breadcrumb { margin: 0; padding: 0; font-size: 12.5px; }
    .breadcrumb a { color: #64748b; }
    .breadcrumb a:hover { color: var(--brand-dark); }
    .breadcrumb .separator { color: #cbd5e1; margin: 0 6px; }
    .breadcrumb .current { color: #1e293b; font-weight: 600; }

    /* ---- Toast 通知 ---- */
    .toast-container { position: fixed; top: 16px; right: 16px; z-index: 1090; max-width: 360px; }
    .toast-container .toast { min-width: 280px; border-radius: 10px; box-shadow: 0 6px 24px rgba(15,23,42,.15); }
    .toast-container .toast-body { padding: 12px 16px; display: flex; align-items: center; gap: 8px; font-size: 14px; }

    /* ---- 骨架屏 ---- */
    .skeleton { background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 37%, #f1f5f9 63%); background-size: 400% 100%; animation: shimmer 1.4s ease infinite; border-radius: 6px; }
    @keyframes shimmer { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } }
    .skeleton-text { height: 14px; margin-bottom: 6px; }
    .skeleton-card { height: 80px; }

    /* ---- 快捷操作面板 ---- */
    .quick-action { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 9px 6px; border-radius: 9px; text-decoration: none; color: #475569; transition: all .18s ease; border: 1px solid #f1f5f9; background: #fbfdff; }
    .quick-action:hover { background: linear-gradient(135deg,#f0f9ff,#e0f2fe); border-color: #bae6fd; color: var(--brand-dark); transform: translateY(-3px); box-shadow: 0 6px 16px rgba(var(--brand-mid-rgb),.14); }
    .quick-action:active { transform: translateY(-1px); }
    .quick-action i { font-size: 20px; width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; background: linear-gradient(135deg,#e0f2fe,#bae6fd); color: #0369a1; transition: transform .18s ease, background .18s ease; box-shadow: 0 2px 5px rgba(var(--brand-mid-rgb),.12); }
    .quick-action:hover i { transform: scale(1.1); background: linear-gradient(135deg,#bae6fd,#7dd3fc); }
    .quick-action span { font-size: 11.5px; font-weight: 500; }

    /* ---- 日历视图 ---- */
    .cal-toolbar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; }
    .cal-grid { display:grid; grid-template-columns:repeat(7,1fr); border:1px solid #e2e8f0; border-radius:14px; overflow:hidden; background:#fff; box-shadow: var(--shadow-xs); }
    .cal-cell { min-height:96px; border-right:1px solid #f1f5f9; border-bottom:1px solid #f1f5f9; padding:6px; background:#fff; transition:background .15s; }
    .cal-cell:nth-child(7n) { border-right:none; }
    .cal-cell:nth-last-child(-n+7) { border-bottom:none; }
    .cal-cell:hover { background:#f8fafc; }
    .cal-cell.out { background:#f8fafc; }
    .cal-cell.today { background:#ecfdf5; box-shadow: inset 0 0 0 2px var(--brand-dark); border-radius:8px; }
    .cal-dow { text-align:center; font-size:12px; color:#64748b; padding:8px 0; background:#f8fafc; font-weight:600; border-bottom:1px solid #e2e8f0; }
    .cal-dow.weekend { color:#ef4444; }
    .cal-daynum { font-size:13px; font-weight:600; color:#334155; }
    .cal-cell.today .cal-daynum { color: var(--brand-dark); }
    .cal-cell.out .cal-daynum { color:#cbd5e1; }
    .cal-task { display:block; font-size:11.5px; padding:2px 6px; border-radius:6px; margin-top:4px; color:#fff; text-decoration:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .cal-task:hover { filter:brightness(1.08); }
    .cal-task.p-low { background: var(--brand-dark); }
    .cal-task.p-mid { background:#f59e0b; }
    .cal-task.p-high { background:#ef4444; }
    .cal-task.done { opacity:.55; text-decoration:line-through; }
    .cal-more { font-size:11px; color: var(--brand-dark); padding:2px 6px; cursor:pointer; }
    .cal-legend { display:flex; gap:14px; flex-wrap:wrap; font-size:12px; color:#64748b; }
    .cal-task.k-visit { background:#10b981; }
    .cal-task.k-follow { background:#8b5cf6; }
    .cal-task.k-contract { background:#0891b2; }
    .cal-task.k-payment { background:#e11d48; }
    .cal-task.k-opp { background:#ec4899; }
    .cal-task.k-plan { background:#14b8a6; }
    .cal-legend .sw { display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:4px; vertical-align:middle; }
    .cal-legend .sw.p-high { background:#ef4444; } .cal-legend .sw.p-mid { background:#f59e0b; } .cal-legend .sw.p-low { background:#64748b; }
    .cal-legend .sw.k-visit { background:#10b981; } .cal-legend .sw.k-follow { background:#8b5cf6; }
    .cal-legend .sw.k-contract { background:#0891b2; } .cal-legend .sw.k-payment { background:#e11d48; }
    .cal-legend .sw.k-task { background: var(--brand-dark); }
    .cal-legend .sw.k-opp { background:#ec4899; } .cal-legend .sw.k-plan { background:#14b8a6; }


    /* ---- 时间线 ---- */
    .activity-timeline { position: relative; padding-left: 24px; }
    .activity-timeline::before { content: ''; position: absolute; left: 8px; top: 4px; bottom: 4px; width: 2px; background: #e2e8f0; border-radius: 1px; }
    .activity-item { position: relative; padding: 0 0 7px 8px; }
    .activity-item::before { content: ''; position: absolute; left: -20px; top: 4px; width: 10px; height: 10px; border-radius: 50%; background: #fff; border: 2px solid var(--brand); }
    .activity-item.success::before { border-color: #22c55e; }
    .activity-item.warning::before { border-color: #f59e0b; }
    .activity-item.danger::before { border-color: #ef4444; }
    .activity-time { font-size: 11px; color: #94a3b8; }
    .activity-text { font-size: 13.5px; color: #334155; margin-top: 2px;  line-height: 1.45; font-size: 12.5px; }
    .activity-text a { font-weight: 500; }

    /* ---- KPI 迷你卡片 ---- */
    .mini-kpi { padding: 10px 14px; border-radius: 10px; background: #f8fafc; border: 1px solid #f1f5f9; }
    .mini-kpi .kpi-val { font-size: 20px; font-weight: 700; }
    .mini-kpi .kpi-label { font-size: 11.5px; color: #64748b; }
    .mini-kpi .kpi-trend { font-size: 11px; }
    .mini-kpi .kpi-trend.up { color: #16a34a; }
    .mini-kpi .kpi-trend.down { color: #dc2626; }

    /* ---- 移动端适配 ---- */
    @media (max-width: 991.98px) {
      .sidebar {
        width: 264px; transform: translateX(-100%);
        transition: transform .25s ease; box-shadow: 2px 0 16px rgba(0,0,0,.25);
      }
      .sidebar.open { transform: translateX(0); }
      .main { margin-left: 0; }
      .topbar { padding: 10px 12px; }
      .content { padding: 14px; padding-bottom: calc(14px + env(safe-area-inset-bottom)); }
      #sidebarMask { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 99; }
      #sidebarMask.show { display: block; }
      .hide-md { display: none !important; }
      .global-search { display: none !important; }
      .toast-container { top: 8px; right: 8px; left: 8px; max-width: none; }

      /* 移动端触摸友好 */
      .btn, .form-control, .form-select, .page-link, .dropdown-item, .list-group-item, .nav-link {
        min-height: 44px; display: inline-flex; align-items: center;
      }
      .btn-sm { min-height: 36px; }
      .table td, .table th { white-space: nowrap; }
      .table-responsive { -webkit-overflow-scrolling: touch; }

      /* 移动端卡片堆叠 */
      .row > [class*="col-"] { margin-bottom: 8px; }
      .row > [class*="col-"]:last-child { margin-bottom: 0; }
      .stat-card .card-body { padding: 12px; }

      /* 移动端表单优化 */
      .form-label { font-size: 14px; }
      input, select, textarea { font-size: 16px !important; } /* 防止 iOS 放大 */

      /* 移动端地图容器 */
      #customerMap, #recordPicker, #detailMap { min-height: 50vh !important; }
      .modal-body #recordPicker { height: 60vh !important; }
    }

    /* 小屏手机额外优化 */
    @media (max-width: 575.98px) {
      html { font-size: 16px; }
      .content { padding: 10px; }
      .topbar h5 { font-size: 16px; }
      .card-header { padding: 10px 14px; font-size: 14px; }
      .table { font-size: 13px; }
      .btn { font-size: 14px; padding: .5rem .75rem; }
      .modal-dialog { margin: .5rem; }
      .pagination { flex-wrap: wrap; justify-content: center; }
      /* 拜访记录照片预览小屏放大 */
      #photoPreview img, #existingPhotos img { width: 90px !important; height: 90px !important; }
      .modal-body #recordPicker { height: 50vh !important; }
      /* ---- 手机端观感增强 ---- */
      .topbar { padding: 8px 12px; gap: 8px; }
      .topbar h5 { max-width: 52vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
      .card { border-radius: 10px; }
      .card .card { box-shadow: none; }
      .content { padding: 10px 10px 12px; }
      .card-body { padding: 9px 14px; }
      .modal-dialog { margin: .4rem; }
      .dropdown-menu { max-width: calc(100vw - 20px); }
      .detail-group-title { margin: 8px 0 4px; }
      .avatar { font-size: 13px; }
    }

    /* ---- 深色模式（Bootstrap 5.3 data-bs-theme） ---- */
    html[data-bs-theme="dark"] {
      --bg: #0b1220; --card-border: #1e293b;
    }
    html[data-bs-theme="dark"] body { background: var(--bg); color: #e2e8f0; }
    html[data-bs-theme="dark"] .card { background: #131c2e; }
    html[data-bs-theme="dark"] .card-header { background: #131c2e; border-bottom-color: #1e293b; }
    html[data-bs-theme="dark"] .topbar { background: rgba(11,18,32,.9); border-bottom-color: #1e293b; }
    html[data-bs-theme="dark"] .topbar h5 { color: #f1f5f9; }
    html[data-bs-theme="dark"] .page-back-btn { background: #131c2e; border-color: #1e293b; color: #cbd5e1; }
    html[data-bs-theme="dark"] .page-back-btn:hover { background: #1e293b; color: #fff; }
    html[data-bs-theme="dark"] .table thead th { background: #172033; color: #94a3b8; border-bottom-color: #1e293b; }
    html[data-bs-theme="dark"] .table-hover tbody tr:hover { background: #1a2740; }
    html[data-bs-theme="dark"] .list-group-item { border-color: #1e293b; }
    html[data-bs-theme="dark"] .list-group-item:hover { background: #1a2740; }
    html[data-bs-theme="dark"] .dropdown-item:hover { background: #1a2740; }
    html[data-bs-theme="dark"] .form-control, html[data-bs-theme="dark"] .form-select { border-color: #334155; }
    html[data-bs-theme="dark"] .input-group-text { background: #172033; border-color: #334155; color: #cbd5e1; }
    html[data-bs-theme="dark"] .pagination .page-link { border-color: #334155; }
    html[data-bs-theme="dark"] .btn-outline-secondary { color: #cbd5e1; border-color: #475569; }
    html[data-bs-theme="dark"] .btn-outline-secondary:hover { background: #334155; color: #fff; }
    html[data-bs-theme="dark"] .progress { background: #334155; }
    html[data-bs-theme="dark"] .detail-group-title::after { background: #334155; }
    html[data-bs-theme="dark"] .global-search .input-group-text { background: #172033; }
    html[data-bs-theme="dark"] .global-search .form-control { background: #131c2e; border-color: #334155; color: #e2e8f0; }
    html[data-bs-theme="dark"] .search-dropdown { background: #131c2e; border-color: #1e293b; }
    html[data-bs-theme="dark"] .search-item:hover { background: #1a2740; color: var(--brand-light); }
    html[data-bs-theme="dark"] .breadcrumb a { color: #94a3b8; }
    html[data-bs-theme="dark"] .breadcrumb .current { color: #f1f5f9; }
    html[data-bs-theme="dark"] .breadcrumb .separator { color: #475569; }
    html[data-bs-theme="dark"] .quick-action { color: #94a3b8; }
    html[data-bs-theme="dark"] .quick-action:hover { background: rgba(var(--brand-light-rgb),.1); border-color: rgba(var(--brand-light-rgb),.3); color: var(--brand-light); }
    html[data-bs-theme="dark"] .mini-kpi { background: #172033; border-color: #1e293b; }
    html[data-bs-theme="dark"] .skeleton { background: linear-gradient(90deg, #1e293b 25%, #334155 37%, #1e293b 63%); background-size: 400% 100%; }
    html[data-bs-theme="dark"] .activity-timeline::before { background: #334155; }
    html[data-bs-theme="dark"] .activity-item::before { background: #131c2e; }
    html[data-bs-theme="dark"] .activity-text { color: #cbd5e1; }

    /* ---- 打印：隐藏导航，仅输出内容 ---- */
    @media print {
      .sidebar, .topbar, .no-print, #sidebarMask { display: none !important; }
      .main { margin-left: 0 !important; }
      .content { padding: 0 !important; }
      .print-title { margin-top: 0; }
      body { background: #fff; }
      .card { border: 1px solid #dee2e6; box-shadow: none; }
    }

    /* ================================================================
       UI 2.0 · 全局布局与视觉增强（叠加层，不影响既有功能）
       ================================================================ */
    body { background: #f4f7fb; }
    .main { background: linear-gradient(180deg, rgba(255,255,255,.55), transparent 300px); }
    .content { padding: 22px 26px 48px; }
    @media (min-width: 1560px) {
      .content { max-width: 1480px; margin: 0 auto; width: 100%; }
    }

    /* 顶栏：更强毛玻璃 + 搜索聚焦光环 */
    .topbar { background: rgba(255,255,255,.8); backdrop-filter: blur(14px) saturate(1.5); }
    .topbar h5 { letter-spacing: .2px; }
    .global-search .input-group { border-radius: 10px; transition: box-shadow .18s ease; }
    .global-search:focus-within .input-group { box-shadow: 0 0 0 3px rgba(var(--brand-mid-rgb),.14); }

    /* 侧栏：投影 + 导航项胶囊化 */
    .sidebar { box-shadow: 6px 0 26px rgba(2,6,23,.2); }
    .sidebar .brand { background: linear-gradient(180deg, rgba(255,255,255,.05), transparent); }
    /* 菜单项左右外边距与工具栏/分组标题的 12px 对齐，避免 2px 错位 */
    .sidebar .nav-link { border-radius: 9px; margin: 2px var(--space-3); }
    /* 侧边栏滚动条：极细 + 默认极淡，悬停侧边栏时明显（最不碍眼）*/
    .sidebar .nav-wrap { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.16) transparent; }
    .sidebar .nav-wrap::-webkit-scrollbar { width: 4px; }
    .sidebar .nav-wrap::-webkit-scrollbar-thumb { background: transparent; border-radius: 2px; border: 0; }
    .sidebar .nav-wrap::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.3); }
    .sidebar .nav-wrap::-webkit-scrollbar-track { background: transparent; }
    .sidebar:hover .nav-wrap::-webkit-scrollbar-thumb { background: rgba(255,255,255,.18); }
    .sidebar:hover .nav-wrap::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.34); }

    /* 卡片/统计 */
    .card { border-radius: 14px; }
    .card-header { padding: 14px 20px; font-size: 15px; }
    .card-body { padding: 18px 20px; }
    /* 圆角已在上方基础规则统一（11px），此处不再覆盖以免破坏比例 */
    .stat-card .card-body { align-items: center; gap: 14px; }
    .quick-action { background: linear-gradient(180deg, #ffffff, #f7fafd); }
    .quick-action span { font-weight: 500; }

    /* 表格：行悬浮左侧品牌提示条 */
    .table > :not(caption) > * > * { padding: .72rem .95rem; }
    .table-hover tbody tr:hover { box-shadow: inset 3px 0 0 var(--brand); }

    /* 按钮 / 徽章 / 分页 / 弹窗 / 提醒 */
    .btn { font-weight: 500; }
    .btn-primary { box-shadow: 0 4px 12px rgba(var(--brand-rgb),.2); }
    .btn-success { background: linear-gradient(135deg,#22c55e,#16a34a); border: 0; box-shadow: 0 4px 12px rgba(22,163,74,.18); }
    .badge { padding: .42em .7em; border-radius: 7px; }
    .page-link { border-radius: 8px; margin: 0 2px; }
    .modal-content { border-radius: 16px; }
    .modal-header { border-bottom-color: #f1f5f9; }
    .alert { border-radius: 12px; }
    .reminder-group { border-radius: 12px; }
    .reminder-group-head { border-radius: 10px; }

    /* 深色模式适配新增项 */
    html[data-bs-theme="dark"] .main { background: transparent; }
    html[data-bs-theme="dark"] .quick-action { background: #131c2e; border-color: #1e293b; }
    html[data-bs-theme="dark"] .modal-header { border-bottom-color: #1e293b; }

    /* ==================== 在线文档中心 ==================== */
    .doc-icon {
      width: 38px; height: 38px; border-radius: 10px;
      display: inline-flex; align-items: center; justify-content: center;
      font-size: 19px; color: #fff; flex: none;
    }
    .doc-editor {
      font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
      font-size: 13.5px; line-height: 1.7; background: #f8fafc;
      tab-size: 2;
    }
    html[data-bs-theme="dark"] .doc-editor { background: #0b1526; color: #cbd5e1; }
    .doc-viewer {
      width: 100%; height: calc(100vh - 280px); min-height: 480px;
      border: 0; background: #fff; border-radius: 0 0 16px 16px;
    }
    html[data-bs-theme="dark"] .doc-viewer { background: #1e293b; }
    .doc-text {
      font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
      font-size: 13.5px; line-height: 1.75; white-space: pre-wrap; word-break: break-word;
      max-height: calc(100vh - 280px); overflow: auto;
    }

    /* ==================== 内部会话（协同办公） ==================== */
    .chat-wrap { display: flex; height: calc(100vh - 240px); min-height: 540px; overflow: hidden; }
    .chat-side { width: 312px; flex: none; border-right: 1px solid var(--card-border); display: flex; flex-direction: column; min-width: 0; }
    .chat-side-head { padding: 11px 14px; border-bottom: 1px solid #f1f5f9; background: #fbfdff; display: flex; align-items: center; justify-content: space-between; }
    .chat-list { flex: 1; overflow-y: auto; min-height: 0; }
    .chat-side-foot { padding: 8px 10px; border-top: 1px solid #f1f5f9; background: #fbfdff; }
    .chat-side-foot .btn { color: #475569; }
    .chat-side-foot .btn:hover { color: var(--brand); }
    html[data-bs-theme="dark"] .chat-side-foot { background: #131c2e; border-color: #1e293b; }
    .chat-item { padding: 10px 14px; border-bottom: 1px solid #f6f8fb; cursor: pointer; }
    .chat-item:hover { background: #f7fafd; }
    .chat-item.active { background: linear-gradient(90deg, rgba(var(--brand-light-rgb),.16), rgba(var(--brand-light-rgb),.04)); box-shadow: inset 3px 0 0 var(--brand); }
    .chat-item-t { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: #0f172a; font-size: 14px; font-weight: 600; }
    .chat-item-l { display: flex; align-items: center; gap: 5px; color: #64748b; font-size: 12px; margin-top: 3px; min-width: 0; }
    .chat-item-time { color: #94a3b8; font-size: 11px; text-align: right; margin-top: 2px; }
    .chat-item .chat-badge { font-size: 10.5px; line-height: 1.5; }
    .chat-main { flex: 1; display: flex; flex-direction: column; min-width: 0; background: #fff; }
    .chat-thread-head { padding: 11px 16px; border-bottom: 1px solid var(--card-border); background: #fbfdff; min-height: 47px; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
    .chat-msgs { flex: 1; overflow-y: auto; min-height: 0; padding: 18px 18px 8px; background: #f8fafc; display: flex; flex-direction: column; }
    .chat-msg { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 14px; max-width: 100%; }
    .chat-msg.mine { flex-direction: row-reverse; }
    .chat-avatar { width: 34px; height: 34px; border-radius: 50%; background: linear-gradient(135deg,var(--brand-light),var(--brand-dark)); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; flex: none; }
    .chat-bubble-wrap { max-width: min(72%, 720px); min-width: 0; }
    .chat-msg-name { font-size: 11px; color: #94a3b8; margin-bottom: 3px; }
    .chat-msg.mine .chat-msg-name { text-align: right; }
    .chat-bubble { background: #fff; border: 1px solid #e6edf5; border-radius: 4px 12px 12px 12px; padding: 8px 12px; font-size: 14px; line-height: 1.65; word-break: break-word; box-shadow: 0 1px 2px rgba(15,23,42,.03); }
    .chat-msg.mine .chat-bubble { background: linear-gradient(135deg,var(--brand-mid),var(--brand-dark)); color: #fff; border: 0; border-radius: 12px 4px 12px 12px; }
    .chat-input { display: flex; gap: 8px; padding: 10px 12px; border-top: 1px solid var(--card-border); align-items: flex-end; background: #fff; }
    .chat-input textarea { resize: none; max-height: 140px; font-size: 14px; }
    .chat-biz-empty { text-align: center; color: #94a3b8; padding: 26px 12px; }
    /* 业务对象详情页内的内部讨论面板 */
    .biz-avatar { width: 28px; height: 28px; border-radius: 50%; background: linear-gradient(135deg,var(--brand-light),var(--brand-dark)); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 600; flex: none; }
    .biz-bubble { display: inline-block; background: #f1f6fb; border: 1px solid #e6edf5; border-radius: 4px 10px 10px 10px; padding: 6px 10px; font-size: 13.5px; line-height: 1.6; word-break: break-word; }
    html[data-bs-theme="dark"] .biz-bubble { background: #1b2a44; border-color: #24334f; color: #e2e8f0; }
    html[data-bs-theme="dark"] .chat-main { background: #131c2e; }
    html[data-bs-theme="dark"] .chat-msgs { background: #0d1626; }
    html[data-bs-theme="dark"] .chat-side-head, html[data-bs-theme="dark"] .chat-thread-head { background: #131c2e; border-color: #1e293b; }
    html[data-bs-theme="dark"] .chat-item { border-color: #16223a; }
    html[data-bs-theme="dark"] .chat-item:hover { background: #1a2740; }
    html[data-bs-theme="dark"] .chat-bubble { background: #1b2a44; border-color: #24334f; color: #e2e8f0; }
    html[data-bs-theme="dark"] .chat-input { background: #131c2e; border-color: #1e293b; }
    @media (max-width: 991.98px) {
      .chat-wrap { flex-direction: column; height: auto; min-height: 0; }
      .chat-side { width: 100%; border-right: 0; border-bottom: 1px solid var(--card-border); }
      .chat-list { max-height: 260px; }
      .chat-main { height: 480px; }
    }
    /* 侧边栏最近访问 */
    .nav-group-recent { padding: 4px var(--space-3) 8px; border-bottom: 1px solid rgba(255,255,255,.07); margin-bottom: 4px; }
    .nav-group-recent .rg-head { color: #7c93b0; font-size: 11px; letter-spacing: .4px; padding: 4px 0 2px; }
    .nav-group-recent .rg-link { display: flex; align-items: center; gap: 8px; padding: 7px var(--space-3); border-radius: 8px; color: #a8bdd6; text-decoration: none; font-size: 13px; min-width: 0; }
    .nav-group-recent .rg-link:hover { background: rgba(255,255,255,.08); color: #fff; }
    .nav-group-recent .rg-link i { font-size: 13px; color: #5b8db8; }

    /* ==================== 邮箱中心三栏客户端 ==================== */
    .mclient { display: grid; grid-template-columns: 200px 360px 1fr; height: calc(100vh - 200px); min-height: 480px; border: 1px solid var(--card-border); border-radius: var(--radius); overflow: hidden; background: var(--bs-body-bg, #fff); }
    .mclient-col { display: flex; flex-direction: column; min-height: 0; min-width: 0; }
    .mclient-folders { border-right: 1px solid var(--card-border); }
    .mclient-list { border-right: 1px solid var(--card-border); }
    .mclient-pane { min-width: 0; }
    .mclient-h { display: flex; align-items: center; gap: 6px; padding: 8px 10px; border-bottom: 1px solid var(--card-border); background: rgba(241,245,249,.6); flex-wrap: wrap; }
    html[data-bs-theme="dark"] .mclient-h { background: rgba(15,23,42,.5); }
    .mclient-folders .fold-scroll { flex: 1; overflow-y: auto; min-height: 0; }
    /* 左栏顶部操作区（写邮件/账号/同步/设置） */
    .mclient-folders .fold-head { padding: 10px; border-bottom: 1px solid var(--card-border); background: rgba(241,245,249,.45); }
    html[data-bs-theme="dark"] .mclient-folders .fold-head { background: rgba(15,23,42,.35); }
    .email-set-btn { min-width: 30px; }
    /* 文件夹分组标题（查看/发件归档/票据处理） */
    .fold-grp { display: flex; align-items: center; gap: 8px; padding: 10px 14px 4px; font-size: 11px; color: #94a3b8; font-weight: 600; letter-spacing: .6px; text-transform: uppercase; }
    .fold-grp::after { content: ''; flex: 1; height: 1px; background: #eef2f7; }
    html[data-bs-theme="dark"] .fold-grp::after { background: #1e293b; }
    .fold-item.sub { padding: 6px 14px 6px 22px; font-size: 13px; }
    /* “含票据”业务项强调 */
    .fold-item.fold-tickets { border-left-color: #f59e0b; }
    .fold-item.fold-tickets i { color: #d97706; }
    html[data-bs-theme="dark"] .fold-item.fold-tickets i { color: #fbbf24; }
    .fold-item.fold-tickets .badge { background: #f59e0b !important; color: #fff; }
    .fold-item.fold-tickets.active { border-left-color: #f59e0b; }
    .fold-item { display: flex; align-items: center; gap: 8px; padding: 8px 14px; font-size: 13.5px; color: #475569; cursor: pointer; border-left: 3px solid transparent; }
    .fold-item:hover { background: rgba(var(--brand-light-rgb),.08); }
    .fold-item.active { background: rgba(var(--brand-light-rgb),.14); border-left-color: var(--brand-dark); color: var(--brand-dark); font-weight: 600; }
    .fold-item .badge { font-size: 11px; }
    html[data-bs-theme="dark"] .fold-item { color: #94a3b8; }
    html[data-bs-theme="dark"] .fold-item.active { color: #7dd3fc; background: rgba(var(--brand-light-rgb),.12); border-left-color: var(--brand-light); }
    .mrows { flex: 1; overflow-y: auto; min-height: 0; }
    .mrow { padding: 8px 12px; border-bottom: 1px solid #eef2f7; cursor: default; transition: background .12s; }
    .mrow:hover { background: rgba(var(--brand-light-rgb),.06); }
    .mrow.active { background: rgba(var(--brand-light-rgb),.12); }
    .mrow.unread { background: #f0f7ff; }
    .mrow.unread .mrow-subj { font-weight: 600; }
    html[data-bs-theme="dark"] .mrow { border-color: #1e293b; }
    html[data-bs-theme="dark"] .mrow:hover { background: rgba(var(--brand-light-rgb),.08); }
    html[data-bs-theme="dark"] .mrow.active { background: rgba(var(--brand-light-rgb),.14); }
    html[data-bs-theme="dark"] .mrow.unread { background: #16254a; }
    .mrow-subj { font-size: 13px; color: #1e293b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .mrow-sub { display: flex; gap: 8px; font-size: 12px; color: #94a3b8; margin-top: 2px; align-items: baseline; min-width: 0; }
    html[data-bs-theme="dark"] .mrow-subj { color: #e2e8f0; }
    .mclient-pane iframe { flex: 1; width: 100%; border: 0; min-height: 0; }
    .email-nav .nav-link { font-size: 13.5px; padding: 6px 14px; }
    .email-draftbar { background: rgba(241,245,249,.5); border-radius: 8px; padding: 6px 10px; }
    html[data-bs-theme="dark"] .email-draftbar { background: rgba(15,23,42,.4); }
    .email-suggest.dropdown-menu { background: var(--bs-body-bg, #fff); border: 1px solid var(--card-border); }
    /* 响应式：平板隐藏文件夹列 */
    @media (max-width: 991.98px) {
      .mclient { grid-template-columns: 0 340px 1fr; }
      .mclient-folders { display: none; }
    }
    /* 响应式：移动端单列栈 */
    @media (max-width: 575.98px) {
      .mclient { grid-template-columns: 1fr; height: auto; min-height: 0; }
      .mclient-list { border-right: 0; border-bottom: 1px solid var(--card-border); height: 50vh; }
      .mclient-pane { display: none; height: 60vh; }
      .mclient-pane.show-mobile { display: flex; }
      .mclient-list.hide-mobile { display: none; }
    }




/* ============================================================
   全面布局优化与美化层（全局生效）
   ============================================================ */

/* ---- 内容区节奏 ---- */
.content { padding: 16px 24px 26px; }

/* ---- 筛选/工具条卡片统一 ---- */
.card-toolbar { background: linear-gradient(180deg,#fcfdff,#f9fbfe); }
.card-toolbar .card-body { padding: 14px 18px; }
.card-toolbar .input-group-text { background: #fff; }
.card-toolbar .form-select, .card-toolbar .form-control { font-size: 13.5px; }

/* ---- 页面标题与操作 ---- */
.page-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

/* ---- 表格细节 ---- */
.table > :not(caption) > * > * { padding: .45rem .75rem; }
.table thead th { letter-spacing: .3px; }
.table tbody tr { transition: background .12s ease; }
.table .row-actions { white-space: nowrap; text-align: right; }
/* 操作列按钮：默认半透明、悬停显现（对所有 text-end 操作列生效） */
.table td.text-end .btn, .table .row-actions .btn { opacity: .55; transition: opacity .15s ease, transform .15s ease; padding: 3px 8px; font-size: var(--fs-sm); border-radius: var(--radius-xs); }
.table .row-actions .btn-group { gap: 2px; }
.table tbody tr:hover td.text-end .btn, .table tbody tr:hover .row-actions .btn { opacity: 1; }
.table td.text-end .btn:hover, .table .row-actions .btn:hover { opacity: 1; transform: translateY(-1px); }
.table td.text-end .btn-group .btn, .table .row-actions .btn-group .btn { opacity: .5; }
.table td.text-end .btn-group:hover .btn, .table .row-actions .btn-group:hover .btn { opacity: 1; }
.table-hover tbody tr:hover { background: #f7fafd; }

/* 表格响应式：窄屏横向滚动 */
.table-responsive { border-radius: 0 0 var(--radius) var(--radius); }

/* ---- 表单细节 ---- */
.form-label { font-weight: 600; color: #475569; }
.form-text { font-size: 12px; }
.form-control, .form-select { box-shadow: inset 0 1px 2px rgba(15,23,42,.02); }
.form-section-title {
  display: flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: 700; color: #334155;
  margin: 18px 0 10px; padding-bottom: 8px; border-bottom: 1px solid #eef2f7;
}
.form-section-title:first-child { margin-top: 0; }
.form-section-title i { color: var(--brand-dark); }

/* ---- 按钮统一 ---- */
.btn { font-weight: 500; letter-spacing: .2px; }
.btn i { vertical-align: -1px; }
.btn-group .btn + .btn { margin-left: -1px; }

/* ---- 分页 ---- */
.pagination { justify-content: center; margin-top: 18px; }
.pagination .page-link { min-width: 32px; text-align: center; }

/* ---- 空状态 ---- */
/* ===== 任务4：信息层级（页面标题区强化）===== */
/* 分区标题（详情页/长页功能区层级）*/
.section-title {
  display: flex; align-items: center; gap: var(--space-2);
  font-size: var(--fs-base); font-weight: 600; color: var(--text-1);
  margin: var(--space-5) 0 var(--space-3); padding-left: 10px;
  border-left: 3px solid var(--brand-dark); line-height: 1.4;
}
.section-title:first-child { margin-top: 0; }
.section-title .badge { font-weight: 500; }
.section-title-sub { font-size: var(--fs-xs); color: var(--text-3); font-weight: 400; }
/* 功能标签（Tab/Pills）令牌化统一 */
.nav-tabs { border-bottom: 1px solid var(--border-soft); }
.nav-tabs .nav-link { color: var(--text-2); font-weight: 500; border: 0; border-radius: var(--radius-sm) var(--radius-sm) 0 0; padding: .5rem .9rem; }
.nav-tabs .nav-link:hover { color: var(--brand-dark); }
.nav-tabs .nav-link.active { color: var(--brand-dark); font-weight: 600; background: transparent; border-bottom: 2px solid var(--brand-dark); }
.nav-pills .nav-link { color: var(--text-2); font-size: var(--fs-sm); padding: .4rem .9rem; border-radius: var(--radius-sm); }
.nav-pills .nav-link:hover { color: var(--brand-dark); }
.nav-pills .nav-link.active { background: var(--brand-dark); color: #fff; }
/* 状态筛选标签组（列表页一键切换）*/
.filter-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.filter-tags .btn { border-radius: var(--radius-full); font-size: var(--fs-sm); padding: 4px 14px; }
.page-head h5 { font-size: var(--fs-xl); font-weight: 700; color: var(--text-1); letter-spacing: -.2px; line-height: 1.3; }
.page-head { display: flex; flex-direction: column; gap: 3px; }

/* ===== 任务2：细节优化 ===== */
/* 表格斑马纹 */
.table-striped > tbody > tr:nth-of-type(odd) > * { background: rgba(248,250,252,.6); }
.table-striped > tbody > tr:hover > * { background: var(--surface-2) !important; }
/* 卡片悬浮层次 */
.card-hover { transition: transform .2s ease, box-shadow .2s ease; }
.card-hover:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }
/* 卡片标题图标语义色（品牌色，更醒目）*/
.card-header i.bi { color: var(--brand-dark); }
.card-header .text-bg-danger i.bi, .card-header i.bi.text-danger { color: inherit; }
/* 空状态美化 */
.empty-state { padding: var(--space-7) var(--space-4); text-align: center; }
.empty-state i { font-size: 42px; display: block; margin-bottom: var(--space-3); opacity: .3; }
.empty-state .empty-title { color: var(--text-2); font-weight: 600; font-size: var(--fs-base); }
.empty-state .empty-sub { font-size: var(--fs-xs); margin-top: var(--space-1); color: var(--text-3); }
.empty-state i { font-size: 38px; opacity: .35; }
.empty-state .empty-title { font-size: 14.5px; }

/* ---- 迷你统计卡 ---- */
.mini-kpi { padding: 5px 8px; border-radius: 7px; background: #f8fafc; border: 1px solid #f1f5f9; text-align: center; }
.mini-kpi .kpi-label { font-size: 12px; color: #64748b; margin-bottom: 4px; }
.mini-kpi .kpi-val { font-size: 14px; font-weight: 700; }

/* ---- 面包屑 ---- */
.breadcrumb-wrap { padding: 0 0 6px; }
.breadcrumb { font-size: 12px; }

/* ---- 详情页字段 ---- */
.detail-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px 22px; }
.detail-item .d-k { color: #94a3b8; font-size: 12px; margin-bottom: 2px; }
.detail-item .d-v { font-size: 14px; color: #1e293b; font-weight: 500; word-break: break-all; }

/* ---- 列表徽标/状态统一 ---- */
.badge { letter-spacing: .2px; }

/* ---- 卡片内嵌页签 ---- */
.nav-pills .nav-link { font-size: 13.5px; padding: .4rem .9rem; }
.nav-pills .nav-link.active { background: linear-gradient(135deg, var(--brand-mid), var(--brand-dark)); }

/* ---- 滚动条 ---- */
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-thumb { background: #c9d4e1; border-radius: 5px; border: 2px solid transparent; background-clip: content-box; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; background-clip: content-box; }

/* ---- 卡片统一 hover 轻微提升 ---- */
.card { transition: box-shadow .22s ease, transform .22s ease, border-color .22s ease; }
.card:hover { border-color: #dbe6f2; }

/* ---- 页面淡入 ---- */
.content { animation: fadeInUp .22s ease; }

/* ---- 响应式优化 ---- */
@media (max-width: 1199.98px) { .content { padding: 18px 18px 28px; } }
@media (max-width: 767.98px) {
  .content { padding: 14px 12px 24px; }
  .card-body { padding: 14px; }
  .card-header { padding: 12px 14px; }
  .topbar { padding: 10px 14px; }
  .detail-grid { grid-template-columns: 1fr 1fr; }
  .table > :not(caption) > * > * { padding: .55rem .6rem; white-space: nowrap; }
}

/* ===== 销售漏斗 ===== */
.funnel { padding: 4px 0; }
.funnel-row { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.funnel-bar {
  height: 18px; border-radius: 5px; margin-left: auto; margin-right: auto;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 12.5px; font-weight: 500;
  min-width: 60px; max-width: 96%;
  box-shadow: 0 2px 6px rgba(15,23,42,.12);
  transition: transform .18s ease, box-shadow .18s ease;
  text-shadow: 0 1px 2px rgba(0,0,0,.25);
}
.funnel-bar:hover { transform: scale(1.02); box-shadow: 0 4px 12px rgba(15,23,42,.2); }
.funnel-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0 10px; }
.funnel-label b { font-weight: 700; }
.funnel-meta { flex: none; min-width: 74px; font-size: 12px; color: #64748b; text-align: right; line-height: 1.3; }
.funnel-meta span { display: block; }
.funnel-conv { color: #f59e0b; font-size: 11px; font-weight: 600; }

/* ===== 侧边栏折叠（桌面端） ===== */
.sidebar { transition: width .22s ease; }
.main { transition: margin-left .22s ease; }
body.sb-collapsed .sidebar { width: 64px; }
body.sb-collapsed .main { margin-left: 64px; }
body.sb-collapsed .sidebar .brand { justify-content: center; padding: 18px 0 14px; }
body.sb-collapsed .sidebar .brand-text { display: none; }
body.sb-collapsed .side-group {
  font-size: 0; letter-spacing: 0; padding: 12px 0 6px; text-align: center;
}
body.sb-collapsed .side-group::after { content: '•••'; font-size: 10px; letter-spacing: 2px; }
body.sb-collapsed .sidebar .nav-link { justify-content: center; padding: 9px 0; margin: 2px 6px; }
body.sb-collapsed .sidebar .nav-link span { display: none; }
body.sb-collapsed .sidebar .nav-link i { width: auto; }
body.sb-collapsed .nav-toolbar { justify-content: center; padding: 8px 0 4px; }
body.sb-collapsed .nav-filter { display: none; }
body.sb-collapsed .nav-act-btn { width: 30px; }
body.sb-collapsed .sidebar .sidebar-foot { justify-content: center; padding: 14px 0; font-size: 0; }
body.sb-collapsed .sidebar .sidebar-foot i { font-size: 14px; }
body.sb-collapsed .side-group .chevron { display: none; }

/* ===== 可折叠卡片（点击标题展开/收起） ===== */
.card-collapsible .card-header { cursor: pointer; user-select: none; }
.card-collapsible .card-header:hover { background: var(--surface-2); }
.card-collapsible .card-caret { margin-left: auto; transition: transform .2s ease; font-size: var(--fs-xs); color: var(--text-3); }
.card-collapsible .card-header[aria-expanded="true"] .card-caret { transform: rotate(180deg); }
.card-collapsible .card-body { border-top: 1px solid var(--border-soft); }

/* ===== 按钮/标签 增强组合与位置 ===== */
/* 按钮图标间距 */
.btn .bi, .btn i { margin-right: 4px; }
.btn-sm .bi, .btn-sm i { margin-right: 3px; }

/* 操作按钮组统一 */
.toolbar-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.toolbar-actions .btn { white-space: nowrap; }
.btn-group { box-shadow: 0 1px 3px rgba(15,23,42,.06); border-radius: 8px; }
.btn-group .btn { box-shadow: none; }
.btn-group .btn:first-child { border-radius: 8px 0 0 8px; }
.btn-group .btn:last-child { border-radius: 0 8px 8px 0; }

/* 卡片头部：标题左 / 操作右 */
.card-header .card-actions { margin-left: auto; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }

/* 徽章胶囊化 + 语义色 */
.badge { border-radius: 999px; padding: .32em .72em; font-weight: 500; letter-spacing: .2px; }
.badge-soft-success { background: #dcfce7; color: #15803d; border: 1px solid #bbf7d0; }
.badge-soft-warning { background: #fef3c7; color: #b45309; border: 1px solid #fde68a; }
.badge-soft-danger  { background: #fee2e2; color: #b91c1c; border: 1px solid #fecaca; }
.badge-soft-info    { background: #e0f2fe; color: #0369a1; border: 1px solid #bae6fd; }
.badge-soft-muted   { background: #f1f5f9; color: #64748b; border: 1px solid #e2e8f0; }

/* 标签 chip（多选标签/快捷筛选） */
.tag-chip {
  display: inline-flex; align-items: center; gap: 4px;
  background: #f1f5f9; border: 1px solid #e2e8f0; border-radius: 999px;
  padding: 2px 10px; font-size: 12px; color: #475569;
  transition: all .15s ease; text-decoration: none;
}
.tag-chip:hover { background: #e0f2fe; border-color: #7dd3fc; color: #0369a1; }
.tag-chip.active { background: var(--brand-dark); border-color: var(--brand-dark); color: #fff; }
.tag-chip .bi { font-size: 11px; }

/* 表格内徽章紧凑 */
.table .badge { font-size: 11.5px; padding: .25em .6em; }

/* 空状态按钮居中 */
.empty-state .btn { margin-top: 12px; }

/* 筛选栏按钮组间距 */
.card-toolbar .btn, .card-toolbar .btn-group { margin-top: 0; }

/* ===== 弹窗屏幕居中显示 =====
   采用 Bootstrap 官方 modal-dialog-centered 同款布局：.modal 保持 block，
   .modal-dialog 用 flex + min-height 做垂直居中、左右 margin:auto 做水平居中。
   注意：不要用 .modal{display:flex} 强制居中——那会让 .modal-dialog 收缩到内容宽度，
   丢失 Bootstrap 默认的 max-width:500px 宽度，小弹窗会被压成窄条。 */
.modal.show { display: block !important; }
.modal.show .modal-dialog {
  display: flex;
  align-items: center;
  min-height: calc(100% - var(--bs-modal-margin) * 2);
  margin-left: auto;
  margin-right: auto;
}
.modal.show .modal-dialog-scrollable { max-height: calc(100vh - 40px); }
/* 非scrollable超长弹窗：内容区可滚动且弹窗不超出视口 */
.modal.show .modal-dialog > .modal-content { max-height: calc(100vh - 40px); overflow-y: auto; }
@media (max-width: 767.98px) {
  /* 小屏同样屏幕居中（取消原“底部抽屉式”），并收紧上下留白 */
  .modal.show .modal-dialog > .modal-content { max-height: calc(100vh - 24px); }
}

/* ===== 按钮位置与响应式统一（全站） ===== */
/* 1) 表格操作列：右对齐、不换行、按钮间距一致 */
.table > thead > tr > th.text-end,
.table > tbody > tr > td.text-end { white-space: nowrap; }
.table > tbody > tr > td.text-end > .btn + .btn,
.table > tbody > tr > td.text-end > form + .btn,
.table > tbody > tr > td.text-end > .btn + form { margin-left: .25rem; }

/* 2) 工具栏（筛选 + 主操作）：按钮文字不拆行，窄屏整体换行 */
.card-toolbar .btn { white-space: nowrap; }
.card-toolbar .row { row-gap: .5rem; }

/* 3) 弹窗底部按钮区：右对齐、窄屏换行不溢出 */
.modal-footer { flex-wrap: wrap; }
.modal-footer > form { margin: 0; }

/* 4) 窄屏：工具条右侧操作区改为左对齐，按钮区允许换行 */
@media (max-width: 767.98px) {
  .card-toolbar .row > .text-end,
  .card-toolbar .row > [class*="text-md-end"] { text-align: left !important; }
  .card-toolbar .row > [class*="col-"] > .d-flex { flex-wrap: wrap; }
  .modal-footer > .btn,
  .modal-footer > form { flex: 1 1 auto; }
  .modal-footer > form > .btn { width: 100%; }
}

/* ===== 弹窗滚动条增强 ===== */
.modal-content::-webkit-scrollbar,
.modal-body::-webkit-scrollbar { width: 8px; height: 8px; }
.modal-content::-webkit-scrollbar-thumb,
.modal-body::-webkit-scrollbar-thumb {
  background: #cbd5e1; border-radius: 6px; border: 2px solid transparent; background-clip: content-box;
}
.modal-content::-webkit-scrollbar-thumb:hover,
.modal-body::-webkit-scrollbar-thumb:hover { background: #94a3b8; background-clip: content-box; }
.modal-content::-webkit-scrollbar-track,
.modal-body::-webkit-scrollbar-track { background: transparent; }
.modal-content, .modal-body { scrollbar-width: thin; scrollbar-color: #cbd5e1 transparent; }

/* 弹窗打开内容平滑回到顶部 */
.modal.show .modal-content, .modal.show .modal-body { scroll-behavior: smooth; }

/* ============================================================
   交互一致性统一层（追加为主，尽量不推翻既有样式）
   ============================================================ */

/* ---- 空状态统一：图标约 32px / 标题 14px·600 / 副标题 12.5px 次要色 / 上下留白 ---- */
.empty-state { padding: 32px 16px; color: #94a3b8; }
.empty-state i { font-size: 32px; display: block; margin: 0 auto 10px; opacity: .4; }
.empty-state .empty-title { font-size: 14px; font-weight: 600; color: #64748b; }
.empty-state .empty-sub { font-size: 12.5px; color: #94a3b8; margin-top: 4px; }

/* ---- 按钮图标间距统一：紧跟文字时右侧约 .35em，独苗图标不加间距 ---- */
.btn > i.bi, .btn > .bi { margin-right: .35em; }
.btn > i.bi:only-child, .btn > .bi:only-child { margin-right: 0; }

/* ---- 表格内按钮尺寸视觉统一（CSS 兜底，不改模板 class，对齐 btn-sm） ---- */
.table td .btn:not(.btn-sm) { padding: .25rem .5rem; font-size: 13.5px; }

/* ---- 工具栏按钮尺寸统一（若非 btn-sm 亦兜底为一致尺寸） ---- */
.card-toolbar .btn:not(.btn-sm) { padding: .25rem .5rem; font-size: 13.5px; }

/* ---- 表单必填标记：模板用 <span class="req">*</span> ---- */
.req { color: #dc3545; margin-left: 2px; font-weight: 400; line-height: 1; }

/* ---- 表单校验提示统一 ---- */
.form-text { font-size: 12px; color: #94a3b8; }
.invalid-feedback { display: none; font-size: 12px; color: #dc3545; margin-top: 4px; }
.was-validated .form-control:invalid ~ .invalid-feedback,
.was-validated .form-select:invalid ~ .invalid-feedback,
.form-control.is-invalid ~ .invalid-feedback,
.form-select.is-invalid ~ .invalid-feedback { display: block; }
/* 默认不显示红框，避免初始误报：仅 was-validated 或 is-invalid 时才显示 */
form:not(.was-validated) .form-control:invalid:not(.is-invalid),
form:not(.was-validated) .form-select:invalid:not(.is-invalid) { border-color: #e2e8f0; box-shadow: none; }
.was-validated .form-control:invalid,
.was-validated .form-select:invalid,
.form-control.is-invalid,
.form-select.is-invalid { border-color: #dc3545; box-shadow: 0 0 0 3px rgba(220,53,69,.14); }
html[data-bs-theme="dark"] form:not(.was-validated) .form-control:invalid:not(.is-invalid),
html[data-bs-theme="dark"] form:not(.was-validated) .form-select:invalid:not(.is-invalid) { border-color: #334155; }

/* ---- 可排序表头（点击切换升/降序） ---- */
.table thead th.th-sort { cursor: pointer; white-space: nowrap; }
.table thead th.th-sort > a {
  color: inherit; text-decoration: none;
  display: inline-flex; align-items: center; gap: 4px;
}
.table thead th.th-sort > a:hover { color: var(--brand-dark); }
.table thead th.th-sort > a > i.bi { font-size: 11px; opacity: .7; }
.table thead th.th-sort > a:hover > i.bi { opacity: 1; }
html[data-bs-theme="dark"] .table thead th.th-sort > a:hover { color: var(--brand-light); }

/* ===== 数据看板：核心 KPI 卡片（等高、整卡可点击） ===== */
.kpi-card {
  display: flex; align-items: center; gap: var(--space-4); height: 100%;
  padding: var(--card-pad); background: var(--surface);
  border: 1px solid var(--border-soft); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm); text-decoration: none; color: inherit;
  transition: box-shadow .22s ease, transform .22s ease, border-color .22s ease;
}
.kpi-card:hover, .kpi-card:focus { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: #dbeafe; color: inherit; }
.kpi-card .stat-icon { flex: none; width: 46px; height: 46px; font-size: 21px; border-radius: 14px; }
.kpi-card-main { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.kpi-card-label { font-size: 12.5px; color: #64748b; line-height: 1.3; }
.kpi-card-value { font-size: 22px; font-weight: 700; color: #0f172a; line-height: 1.3; }
.kpi-card-sub { font-size: 11.5px; color: #94a3b8; line-height: 1.3; }
.kpi-card-go { flex: none; color: #cbd5e1; font-size: 14px; transition: transform .2s ease, color .2s ease; }
.kpi-card:hover .kpi-card-go { color: var(--brand-dark); transform: translateX(3px); }
.kpi-trend { font-weight: 600; }
.kpi-trend.up { color: #16a34a; }
.kpi-trend.down { color: #dc2626; }
html[data-bs-theme="dark"] .kpi-card { background: #131c2e; }
html[data-bs-theme="dark"] .kpi-card:hover { border-color: #334155; }
html[data-bs-theme="dark"] .kpi-card-value { color: #e2e8f0; }
@media (max-width: 575.98px) {
  .kpi-card { padding: 13px 14px; gap: 11px; }
  .kpi-card .stat-icon { width: 40px; height: 40px; font-size: 18px; border-radius: 12px; }
  .kpi-card-value { font-size: 19px; }
}

/* ===== 移动端顶栏自适应：避免右侧控件簇撑出横向滚动 ===== */
@media (max-width: 575.98px) {
  .topbar { padding-left: .5rem; padding-right: .5rem; gap: .5rem; }
  .topbar > .d-flex.align-items-center.gap-3 { gap: .5rem !important; }
  /* 语言切换仅保留图标、用户菜单仅保留头像，避免溢出 */
  .topbar .lang-toggle { padding-left: .4rem; padding-right: .4rem; }
  .topbar .lang-toggle .lang-text { display: none; }
  .topbar .user-menu-btn .user-meta { display: none; }
  /* 左侧标题可收缩，避免长标题反向撑宽 */
  .topbar > .d-flex.align-items-center.gap-2 { min-width: 0; flex: 1 1 auto; }
  .topbar > .d-flex.align-items-center.gap-2 > div { min-width: 0; }
  .topbar h5 { font-size: 1rem; margin-bottom: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}

/* ===== 数据看板卡片折叠（配合 .card-collapsible 既有类使用） =====
   箭头绝对定位在 header 最右，不参与 flex 布局，避免与 header 内按钮/链接/btn-group
   抢占空间或重叠（settings.html 的 .card-collapsible 为非 flex header，不受影响）。 */
.dash-collapsible > .card-header { position: relative; padding-right: 2.2rem; }
.dash-collapsible > .card-header > .card-caret {
  position: absolute; right: .8rem; top: 50%; margin-left: 0;
  transform: translateY(-50%);
}
.dash-collapsible > .card-header[aria-expanded="true"] > .card-caret {
  transform: translateY(-50%) rotate(180deg);
}

/* ===== 卡片图标徽章：统一几何 + 语义配色 =====
   目标：让卡片 header 标题前的「装饰图标」全站成套、精致、可辨识。
   · 几何：header 徽章统一 26×26 / 圆角 8px / 图标字号 14px / 右侧间距 8px，与标题垂直居中；
           KPI 卡 .stat-icon 保持更大一档（46×46 / 圆角 12px / 图标 20px，见上方 .kpi-card 段）体现层级。
   · 配色：同色系「浅底 + 深色前景」tint；按图标语义分组，同模块同色：
           客户/人脉=蓝、商机/分析=紫、合同/单据=绿、回款/资金=青、
           任务/待办/审批=橙、风险/预警=红、系统/设置/说明=灰（默认）。
   · 命中范围：仅 header 内的「标题前装饰图标」——直接子级首个 <i.bi>，或首个 <span> 的首个 <i.bi>；
           不命中按钮 / .btn-group / 链接内的图标（它们既非直接子级，也非首 span 的首图标），
           也不命中折叠箭头 .card-caret（已显式排除；它恒为 header 末位子级）。
   · 实现：纯 CSS（不改模板）；语义由「图标类名关键字」推断，并兼容模板已有的 text-* 工具类映射。
   · 深色模式：低透明度浅底 + 亮色前景，保证对比度；亮/暗两套变量在同一分组规则内定义，
           由下方单条深色规则切换，避免逐组重复长选择器。 */

/* ---- 几何 + 默认中性配色（灰）+ 亮/暗双套变量 ---- */
:is(.card-header:not([class*="text-bg-"]), .card-header:not([class*="text-bg-"]) > span:first-child)
  > i.bi:not(.card-caret):first-child {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  width: 26px; height: 26px; border-radius: 8px;
  font-size: 14px; line-height: 1;
  margin-right: 8px; vertical-align: middle;
  --ci-bg-l: #eef2f7; --ci-fg-l: #475569;
  --ci-bg-d: rgba(148,163,184,.16); --ci-fg-d: #cbd5e1;
  background: var(--ci-bg-l); color: var(--ci-fg-l);
  transition: background-color .18s ease, color .18s ease;
}

/* ---- 语义分组（同模块同色；后者覆盖前者，顺序：蓝→紫→绿→青→灰→橙→红） ---- */
/* 蓝：客户 / 人脉 / 沟通 / 渠道 / 地理 */
:is(.card-header:not([class*="text-bg-"]), .card-header:not([class*="text-bg-"]) > span:first-child)
  > i.bi:not(.card-caret):is(
      [class*="bi-people"], [class*="bi-person"], [class*="bi-building"], [class*="bi-hdd-rack"],
      [class*="bi-geo"], [class*="bi-chat"], [class*="bi-envelope"], [class*="bi-telephone"],
      [class*="bi-megaphone"], [class*="bi-camera"], [class*="bi-translate"],
      [class*="bi-lightning"], [class*="bi-airplane"], [class*="bi-star"],
      [class*="bi-share"], [class*="bi-image"]
    ):first-child { --ci-bg-l: #e8f1ff; --ci-fg-l: #1d4ed8; --ci-bg-d: rgba(59,130,246,.16); --ci-fg-d: #93c5fd; }

/* 紫：商机 / 分析 / 报表 / 趋势 / 图表 */
:is(.card-header:not([class*="text-bg-"]), .card-header:not([class*="text-bg-"]) > span:first-child)
  > i.bi:not(.card-caret):is(
      [class*="bi-funnel"], [class*="bi-filter"], [class*="bi-diagram-3"], [class*="bi-graph-up"],
      [class*="bi-bar-chart"], [class*="bi-pie-chart"], [class*="bi-percent"], [class*="bi-activity"],
      [class*="bi-table"], [class*="bi-tags"], [class*="bi-trophy"], [class*="bi-speedometer"],
      [class*="bi-calculator"]
    ):first-child { --ci-bg-l: #efe9ff; --ci-fg-l: #6d28d9; --ci-bg-d: rgba(139,92,246,.18); --ci-fg-d: #c4b5fd; }

/* 绿：合同 / 报价 / 单据 / 记录 / 新增 */
:is(.card-header:not([class*="text-bg-"]), .card-header:not([class*="text-bg-"]) > span:first-child)
  > i.bi:not(.card-caret):is(
      [class*="bi-file-earmark"], [class*="bi-file-text"], [class*="bi-receipt"], [class*="bi-list-ul"],
      [class*="bi-sticky"], [class*="bi-journal"], [class*="bi-plus"], [class*="bi-check-circle"]
    ):first-child { --ci-bg-l: #e4f7ec; --ci-fg-l: #15803d; --ci-bg-d: rgba(34,197,94,.16); --ci-fg-d: #86efac; }

/* 青：回款 / 资金 / 财务 */
:is(.card-header:not([class*="text-bg-"]), .card-header:not([class*="text-bg-"]) > span:first-child)
  > i.bi:not(.card-caret):is(
      [class*="bi-cash"], [class*="bi-coin"], [class*="bi-wallet"],
      [class*="bi-credit-card"], [class*="bi-currency-exchange"]
    ):first-child { --ci-bg-l: #e0f5f6; --ci-fg-l: #0e7490; --ci-bg-d: rgba(20,184,166,.18); --ci-fg-d: #5eead4; }

/* 灰：系统 / 设置 / 安全 / 信息 / 库存（关键字较宽，须排在「蓝」之后以收回 person-gear / image-alt） */
:is(.card-header:not([class*="text-bg-"]), .card-header:not([class*="text-bg-"]) > span:first-child)
  > i.bi:not(.card-caret):is(
      [class*="bi-gear"], [class*="bi-shield-lock"], [class*="bi-person-gear"], [class*="bi-database"],
      [class*="bi-magic"], [class*="bi-info-circle"], [class*="bi-boxes"], [class*="bi-box-seam"],
      [class*="bi-clock"], [class*="bi-calendar"], [class*="bi-arrow-repeat"], [class*="bi-image-alt"],
      [class*="bi-trash"], [class*="bi-sliders"], [class*="bi-pencil"]
    ):first-child { --ci-bg-l: #eef2f7; --ci-fg-l: #475569; --ci-bg-d: rgba(148,163,184,.16); --ci-fg-d: #cbd5e1; }

/* 橙：任务 / 待办 / 审批 / 流程 / 进度 / 目标（须排在「灰-日历」之后） */
:is(.card-header:not([class*="text-bg-"]), .card-header:not([class*="text-bg-"]) > span:first-child)
  > i.bi:not(.card-caret):is(
      [class*="bi-list-check"], [class*="bi-check2"], [class*="bi-calendar-check"], [class*="bi-calendar2-check"],
      [class*="bi-clipboard-check"], [class*="bi-hourglass"], [class*="bi-stopwatch"],
      [class*="bi-arrow-left-right"], [class*="bi-signpost"], [class*="bi-kanban"],
      [class*="bi-bullseye"], [class*="bi-flag"]
    ):first-child { --ci-bg-l: #fef1e0; --ci-fg-l: #b45309; --ci-bg-d: rgba(245,158,11,.18); --ci-fg-d: #fcd34d; }

/* 红：风险 / 预警 / 逾期 / 警示 */
:is(.card-header:not([class*="text-bg-"]), .card-header:not([class*="text-bg-"]) > span:first-child)
  > i.bi:not(.card-caret):is(
      [class*="bi-exclamation"], [class*="bi-bell"], [class*="bi-shield-exclamation"],
      [class*="bi-radioactive"], [class*="bi-x-octagon"]
    ):first-child { --ci-bg-l: #fdeaea; --ci-fg-l: #b91c1c; --ci-bg-d: rgba(239,68,68,.18); --ci-fg-d: #fca5a5; }

/* ---- 复用模板已有 text-* 工具类（优先级高于名称推断） ---- */
:is(.card-header:not([class*="text-bg-"]), .card-header:not([class*="text-bg-"]) > span:first-child)
  > i.bi:not(.card-caret)[class~="text-primary"]:first-child { --ci-bg-l: #e8f1ff; --ci-fg-l: #1d4ed8; --ci-bg-d: rgba(59,130,246,.16); --ci-fg-d: #93c5fd; }
:is(.card-header:not([class*="text-bg-"]), .card-header:not([class*="text-bg-"]) > span:first-child)
  > i.bi:not(.card-caret)[class~="text-info"]:first-child { --ci-bg-l: #e0f5f6; --ci-fg-l: #0e7490; --ci-bg-d: rgba(20,184,166,.18); --ci-fg-d: #5eead4; }
:is(.card-header:not([class*="text-bg-"]), .card-header:not([class*="text-bg-"]) > span:first-child)
  > i.bi:not(.card-caret)[class~="text-success"]:first-child { --ci-bg-l: #e4f7ec; --ci-fg-l: #15803d; --ci-bg-d: rgba(34,197,94,.16); --ci-fg-d: #86efac; }
:is(.card-header:not([class*="text-bg-"]), .card-header:not([class*="text-bg-"]) > span:first-child)
  > i.bi:not(.card-caret)[class~="text-warning"]:first-child { --ci-bg-l: #fef1e0; --ci-fg-l: #b45309; --ci-bg-d: rgba(245,158,11,.18); --ci-fg-d: #fcd34d; }
:is(.card-header:not([class*="text-bg-"]), .card-header:not([class*="text-bg-"]) > span:first-child)
  > i.bi:not(.card-caret)[class~="text-danger"]:first-child { --ci-bg-l: #fdeaea; --ci-fg-l: #b91c1c; --ci-bg-d: rgba(239,68,68,.18); --ci-fg-d: #fca5a5; }
:is(.card-header:not([class*="text-bg-"]), .card-header:not([class*="text-bg-"]) > span:first-child)
  > i.bi:not(.card-caret)[class~="text-secondary"]:first-child { --ci-bg-l: #eef2f7; --ci-fg-l: #475569; --ci-bg-d: rgba(148,163,184,.16); --ci-fg-d: #cbd5e1; }

/* ---- 深色模式：切换到深色变量（低透明度浅底 + 亮色前景） ---- */
html[data-bs-theme="dark"]
  :is(.card-header:not([class*="text-bg-"]), .card-header:not([class*="text-bg-"]) > span:first-child)
  > i.bi:not(.card-caret):first-child {
  background: var(--ci-bg-d); color: var(--ci-fg-d);
}

/* ================================================================
   UI 3.0 · 语义色板与可访问性（叠加层，最后加载以覆盖既有硬编码值）

   背景：原样式大量直接硬编码浅色主题色值（#94a3b8 / #64748b / #475569 …），
   深色模式只对部分类做了覆盖；同时直接沿用 Bootstrap 语义色，
   而这些色是为白底设计的（.text-warning 在白底仅 1.63:1）。
   结果：暗色下用户名/表单标签/表格次要文字几乎看不清，
   浅色下 ⌘K 提示、KPI 副标题、空状态说明、金额语义色对比度不足。

   做法：建立一套语义 token，浅/深色各一套；既有类与 Bootstrap 工具类
   统一改为引用 token。所有取值均按 WCAG AA 实算校验
   （正文 ≥4.5:1，大字号 ≥3.0:1），深色底按各主题卡片色复核。
   ================================================================ */
:root {
  /* 文本层级（浅色主题） */
  --fg-1: #0f172a;          /* 主要文本 */
  --fg-2: #334155;          /* 次要文本 */
  --fg-3: #5a6b80;          /* 弱化：说明、表头、标签   (白底 5.46) */
  --fg-4: #6b7280;          /* 最弱：时间戳、副标题     (白底 4.83) */
  --fg-on-muted: #556577;   /* 浅灰底(#f1f5f9)上的弱化文本 (5.45) */

  /* 语义色（浅色主题：白底/浅灰底均 ≥4.5，仅用于文字，背景仍用 Bootstrap 原色） */
  --sc-primary: #1d4ed8;    /* 6.70 on white */
  --sc-success: #15803d;    /* 5.02 */
  --sc-warning: #b45309;    /* 5.02 */
  --sc-info: #0e7490;       /* 5.36 */
  --sc-danger: #b91c1c;     /* 6.47 */
  --sc-secondary: #5a6b80;  /* 5.46 */

  /* 侧边栏（深色底）文字层级 */
  --sb-fg: #b6c2d6;
  --sb-fg-dim: #9db0c8;
  --sb-fg-faint: #93a6bd;   /* 5.44 on #083527 */
  --sb-head: #8fa8c4;       /* 5.75 on #063225 */
}

html[data-bs-theme="dark"] {
  --fg-1: #e8eef7;
  --fg-2: #c9d5e4;
  --fg-3: #a7b6c9;
  --fg-4: #93a3b6;
  --fg-on-muted: #a7b6c9;

  /* 暗色下语义色需整体提亮（暗底上深色语义色不可读） */
  --sc-primary: #7cb2ff;
  --sc-success: #4ade80;
  --sc-warning: #fbbf24;
  --sc-info: #4dd4e8;
  --sc-danger: #f87171;
  --sc-secondary: #a7b6c9;
}

/* ---- 1) 接管 Bootstrap 语义色工具类 ------------------------------------
   排除 .text-bg-*（徽章需保留白字），否则会与它们的 !important 互相覆盖。 */
:not([class*="text-bg-"]).text-primary { color: var(--sc-primary) !important; }
:not([class*="text-bg-"]).text-success { color: var(--sc-success) !important; }
:not([class*="text-bg-"]).text-warning { color: var(--sc-warning) !important; }
:not([class*="text-bg-"]).text-info    { color: var(--sc-info) !important; }
:not([class*="text-bg-"]).text-danger  { color: var(--sc-danger) !important; }
:not([class*="text-bg-"]).text-secondary,
.text-body-secondary { color: var(--sc-secondary) !important; }
.text-muted { color: var(--fg-4) !important; }

/* 变体文字色（-emphasis）同样纳入 */
.text-primary-emphasis { color: var(--sc-primary) !important; }
.text-success-emphasis { color: var(--sc-success) !important; }
.text-warning-emphasis { color: var(--sc-warning) !important; }
.text-info-emphasis    { color: var(--sc-info) !important; }
.text-danger-emphasis  { color: var(--sc-danger) !important; }

/* 图标/徽章背景仍沿用 Bootstrap 原色，不受上面影响；仅文字用 token */

/* ---- 2) 主题感知的描边按钮（暗色下原浅色描边按钮几乎不可读：2.87:1） ---- */
html[data-bs-theme="dark"] .btn-outline-primary { color: var(--sc-primary); border-color: rgba(124,178,255,.45); }
html[data-bs-theme="dark"] .btn-outline-primary:hover { background: rgba(124,178,255,.14); color: #cfe1ff; border-color: var(--sc-primary); }
html[data-bs-theme="dark"] .btn-outline-success { color: var(--sc-success); border-color: rgba(74,222,128,.45); }
html[data-bs-theme="dark"] .btn-outline-success:hover { background: rgba(74,222,128,.14); color: #d7fbe4; border-color: var(--sc-success); }
html[data-bs-theme="dark"] .btn-outline-info { color: var(--sc-info); border-color: rgba(77,212,232,.45); }
html[data-bs-theme="dark"] .btn-outline-info:hover { background: rgba(77,212,232,.14); color: #d6f8fe; border-color: var(--sc-info); }
html[data-bs-theme="dark"] .btn-outline-warning { color: var(--sc-warning); border-color: rgba(251,191,36,.45); }
html[data-bs-theme="dark"] .btn-outline-warning:hover { background: rgba(251,191,36,.14); color: #ffeec2; border-color: var(--sc-warning); }
html[data-bs-theme="dark"] .btn-outline-danger { color: var(--sc-danger); border-color: rgba(248,113,113,.45); }
html[data-bs-theme="dark"] .btn-outline-danger:hover { background: rgba(248,113,113,.14); color: #ffd9d9; border-color: var(--sc-danger); }
html[data-bs-theme="dark"] .btn-outline-dark { color: var(--fg-2); border-color: #475569; }

/* ---- 3) 表单与表格可读性 ---- */
.form-label { color: var(--fg-2); }
.input-group-text { color: var(--fg-3); }
.form-text, .form-check-label { color: var(--fg-3); }
/* 禁用态与占位符也要看得见（原值过淡） */
.form-control::placeholder { color: var(--fg-4); opacity: 1; }
html[data-bs-theme="dark"] .form-control::placeholder { color: #8b9bb0; }
html[data-bs-theme="dark"] .form-label,
html[data-bs-theme="dark"] .form-text,
html[data-bs-theme="dark"] .form-check-label { color: var(--fg-3); }
.table > thead > tr > th { color: var(--fg-2); }
html[data-bs-theme="dark"] .table > thead > tr > th { color: var(--fg-3); }
/* 表格次要文字（联系方式等灰字）在暗色下必须可读 */
html[data-bs-theme="dark"] td .text-secondary,
html[data-bs-theme="dark"] td.text-secondary,
html[data-bs-theme="dark"] .list-group-item .text-secondary { color: var(--sc-secondary) !important; }

/* ---- 4) 卡片内文字层级 ---- */
.kpi-card-label, .stat-label, .mini-kpi-label { color: var(--fg-3); }
.kpi-card-sub, .stat-sub, .activity-time, .mini-kpi-sub { color: var(--fg-4); }
html[data-bs-theme="dark"] .kpi-card-label,
html[data-bs-theme="dark"] .stat-label,
html[data-bs-theme="dark"] .mini-kpi-label { color: var(--fg-3); }
html[data-bs-theme="dark"] .kpi-card-sub,
html[data-bs-theme="dark"] .stat-sub,
html[data-bs-theme="dark"] .activity-time,
html[data-bs-theme="dark"] .mini-kpi-sub { color: var(--fg-4); }
.card-header { color: var(--fg-1); }
.card-title, .card-header .card-title { color: var(--fg-1); }

/* ---- 5) 空状态：说明文字原为 #94a3b8（2.56:1），提亮到 AA ---- */
.empty-state, .empty-state i, .empty-tip { color: var(--fg-4); }
.empty-state .empty-title { color: var(--fg-2); }
.empty-state .empty-sub { color: var(--fg-4); }
html[data-bs-theme="dark"] .empty-state,
html[data-bs-theme="dark"] .empty-state i,
html[data-bs-theme="dark"] .empty-tip,
html[data-bs-theme="dark"] .empty-state .empty-title,
html[data-bs-theme="dark"] .empty-state .empty-sub { color: var(--fg-4); }

/* ---- 6) 侧边栏文字（深色底，原 brand-sub/sidebar-foot 均不达标） ---- */
.sidebar .brand-sub { color: var(--sb-fg-faint); }
.sidebar .sidebar-foot { color: var(--sb-fg-faint); }
.side-group { color: var(--sb-fg-dim); }
.side-group:hover { color: var(--sb-fg); }
.sidebar .nav-link { color: var(--sb-fg); }
.nav-group-recent .rg-head { color: var(--sb-head); }
.nav-group-recent .rg-link { color: var(--sb-fg); }
.nav-group-recent .rg-link i { color: var(--sb-head); }

/* ---- 7) 顶栏：⌘K 提示原为 #94a3b8 (2.45:1) 且写死在内联样式里 ---- */
.kbd-hint {
  font-size: 10px; color: var(--fg-3); border-left: 0;
  background: #f8fafc; letter-spacing: .3px;
}
html[data-bs-theme="dark"] .kbd-hint { background: #172033; color: var(--fg-3); }

/* 用户菜单：原 class="text-dark" 在暗色下 #212529 on #0a1120 = 1.22:1（几乎不可见） */
.user-menu-btn { color: var(--fg-1) !important; }
.user-menu-btn:hover { color: var(--brand-dark) !important; }
html[data-bs-theme="dark"] .user-menu-btn { color: var(--fg-1) !important; }
html[data-bs-theme="dark"] .user-menu-btn:hover { color: var(--brand-light) !important; }
.user-menu-btn .badge { color: #fff; }

/* 顶栏图标按钮：文字色与命中区域一并增强 */
.topbar .text-secondary { color: var(--fg-3) !important; }
.topbar-icon-link {
  position: relative;                 /* 未读角标 position-absolute 的定位基准 */
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border-radius: 9px; color: var(--fg-3);
  text-decoration: none;
  transition: background-color .16s ease, color .16s ease;
}
.topbar-icon-link:hover { background: rgba(var(--brand-rgb),.1); color: var(--brand-dark); }
html[data-bs-theme="dark"] .topbar-icon-link { color: var(--fg-3); }
html[data-bs-theme="dark"] .topbar-icon-link:hover { background: rgba(var(--brand-light-rgb),.14); color: var(--brand-light); }

/* ---- 8) 语义色文字（Bootstrap 原色在白底不可读） ---- */
.funnel-bar { text-shadow: 0 1px 3px rgba(0,0,0,.35); }
.funnel-meta { color: var(--fg-4); }
.funnel-conv { color: var(--sc-warning); }
html[data-bs-theme="dark"] .funnel-meta { color: var(--fg-4); }
.badge-soft-muted { color: var(--fg-on-muted); }
.page-link { color: var(--fg-2); }
.nav-tabs .nav-link { color: var(--fg-3); }
.nav-tabs .nav-link.active { color: var(--brand-dark); }
html[data-bs-theme="dark"] .nav-tabs .nav-link.active { color: var(--brand-light); }
html[data-bs-theme="dark"] .nav-tabs { border-bottom-color: #1e293b; }
.breadcrumb a { color: var(--fg-3); }
html[data-bs-theme="dark"] .breadcrumb a { color: var(--fg-3); }

/* 搜索下拉：次要说明文字 */
.search-item { color: var(--fg-2); }
.search-item i { color: var(--fg-3); }
.search-item .search-sub { color: var(--fg-4); }
.search-sec-h { color: var(--fg-3); }
.search-sec-h i { color: var(--fg-4); }
.search-sec-cnt { color: var(--fg-on-muted); background: #f1f5f9; }
.search-hist { color: var(--fg-2); }
html[data-bs-theme="dark"] .search-sec-h,
html[data-bs-theme="dark"] .search-sec-cnt,
html[data-bs-theme="dark"] .search-item i,
html[data-bs-theme="dark"] .search-item .search-sub { color: var(--fg-4); }

/* 时间线/活动流 */
.activity-text { color: var(--fg-2); }
html[data-bs-theme="dark"] .activity-text { color: var(--fg-2); }

/* 暗色下的下拉菜单文字 */
html[data-bs-theme="dark"] .dropdown-menu { background: #131c2e; border-color: #1e293b; }
html[data-bs-theme="dark"] .dropdown-item { color: var(--fg-2); }
html[data-bs-theme="dark"] .dropdown-header { color: var(--fg-3); }
html[data-bs-theme="dark"] .dropdown-divider { border-color: #1e293b; }
html[data-bs-theme="dark"] .theme-item.active { background: rgba(var(--brand-light-rgb),.16); }

/* 暗色下的列表/表格分隔与悬浮 */
html[data-bs-theme="dark"] .table > :not(caption) > * > * { border-bottom-color: #1e293b; }
html[data-bs-theme="dark"] .table-light,
html[data-bs-theme="dark"] thead.table-light th { background: #172033; color: var(--fg-3); }

/* ================================================================
   UI 3.0 · 布局与触控增强（窄屏防横向溢出 + 点击目标尺寸）

   实测（Chromium 1440/768/390）窄屏存在整页横向溢出：
     customers        390px  溢出 39px   ← 工具条内 .btn-group（5 个导出/导入按钮，不换行）
     customers/detail 390px  溢出 68px   ← [data-field] 信息行（图标+文本+按钮+转移表单）不换行
     payments         390px  溢出 11px   ← 右侧 .ms-auto.d-flex 操作组不换行
   另外顶部图标链接命中区域仅 18×30，触控偏小。
   ================================================================ */
@media (max-width: 767.98px) {
  /* 按钮组在窄屏换行（原 nowrap 会把整页撑宽），换行后恢复独立圆角 */
  .btn-group { flex-wrap: wrap; }
  .btn-group > .btn {
    border-radius: 8px !important;
    margin-left: 0 !important;
  }

  /* 客户详情等信息行：允许换行，避免被按钮/表单撑破 */
  [data-field].d-flex { flex-wrap: wrap; row-gap: 6px; }
  [data-field].d-flex > .ms-2 { margin-left: 0 !important; }

  /* 工具条右侧操作组：整体换行并左对齐，不再溢出 */
  .ms-auto.d-flex { flex-wrap: wrap; }
  .card-body > .d-flex > .ms-auto { margin-left: 0 !important; }

  /* 行内表单（转移负责人等）：换行避免 150px 下拉 + 按钮撑宽 */
  form.d-inline-flex { flex-wrap: wrap; max-width: 100%; }

  /* 页签在窄屏改为横向滚动，避免 text-nowrap 的 tab 撑破页面 */
  .nav-tabs {
    overflow-x: auto; flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch; scrollbar-width: thin;
  }
  .nav-tabs .nav-item { flex: 0 0 auto; }
}

/* ---- 触控目标：图标类按钮/链接保证 ≥34px 命中区（原 18×30 / 31×31） ---- */
.topbar .btn-sm {
  min-width: 34px; min-height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
}
.topbar .lang-toggle { min-width: 34px; padding-left: 10px; padding-right: 10px; }

/* 表格行内图标按钮：略微放大提升可点性（保持紧凑观感） */
.table .btn-sm:not(.dropdown-toggle) { min-height: 30px; min-width: 30px; }
.table td .btn-group { gap: 2px; }

/* 移动端：表格内按钮给足触控高度 */
@media (max-width: 767.98px) {
  .table .btn-sm { min-height: 34px; min-width: 34px; }
  .pagination .page-link { min-width: 34px; min-height: 34px;
    display: inline-flex; align-items: center; justify-content: center; }
}

/* ================================================================
   UI 3.0 · 深色模式「浅色表面」补齐

   原深色模式只覆盖了 .card/.topbar 等主要表面，以下「浅色底」在暗色下仍是
   浅色，导致暗色文字压浅底（实测：badge-soft-muted 1.88:1、bg-light 统计框
   1.96:1、table-secondary 已完成行 1.61:1）。
   ================================================================ */
html[data-bs-theme="dark"] .bg-light,
html[data-bs-theme="dark"] .bg-white { background-color: #172033 !important; }
html[data-bs-theme="dark"] .bg-body-tertiary { background-color: #172033 !important; }
html[data-bs-theme="dark"] .table-secondary,
html[data-bs-theme="dark"] .table-secondary > :not(caption) > * > * {
  background-color: #1a2740; color: var(--fg-2);
  --bs-table-bg: #1a2740; --bs-table-color: var(--fg-2);
}
html[data-bs-theme="dark"] .table-light,
html[data-bs-theme="dark"] .table-light > :not(caption) > * > * { --bs-table-bg: #172033; --bs-table-color: var(--fg-3); }
html[data-bs-theme="dark"] table > tbody > tr > td { color: var(--fg-2); }
html[data-bs-theme="dark"] .text-decoration-line-through { color: var(--fg-4) !important; }

/* 柔色徽章：暗色下改为「低透明度彩底 + 亮色文字」（与既有 --ci-* 图标徽章同一思路） */
html[data-bs-theme="dark"] .badge-soft-success { background: rgba(34,197,94,.16); color: #86efac; border-color: rgba(34,197,94,.32); }
html[data-bs-theme="dark"] .badge-soft-warning { background: rgba(245,158,11,.18); color: #fcd34d; border-color: rgba(245,158,11,.34); }
html[data-bs-theme="dark"] .badge-soft-danger  { background: rgba(239,68,68,.18); color: #fca5a5; border-color: rgba(239,68,68,.34); }
html[data-bs-theme="dark"] .badge-soft-info    { background: rgba(56,189,248,.16); color: #7dd3fc; border-color: rgba(56,189,248,.32); }
html[data-bs-theme="dark"] .badge-soft-muted   { background: rgba(148,163,184,.16); color: #cbd5e1; border-color: rgba(148,163,184,.28); }

/* ---- 通用浅色信息面板（替换模板里的 background:#eff6ff 等写死底） ---- */
.soft-panel {
  background: #eff6ff; border: 1px solid #dbeafe; border-radius: 10px;
}
.soft-panel .soft-panel-title { color: var(--sc-primary); font-weight: 600; }
html[data-bs-theme="dark"] .soft-panel {
  background: rgba(59,130,246,.12); border-color: rgba(59,130,246,.28);
}
html[data-bs-theme="dark"] .soft-panel .soft-panel-title { color: #8ab4ff; }
.thumb-placeholder {
  display: inline-flex; align-items: center; justify-content: center;
  background: #f1f5f9; border-radius: 8px; color: var(--fg-4);
}
html[data-bs-theme="dark"] .thumb-placeholder { background: #1a2740; color: var(--fg-3); }
/* 锁定/只读输入：暗色下保持深底，避免浅底压亮字 */
html[data-bs-theme="dark"] input[readonly] { background: #172033 !important; color: var(--fg-3) !important; }

/* 深色下的进度条与分隔线细节统一 */
html[data-bs-theme="dark"] hr { border-color: #1e293b; }
html[data-bs-theme="dark"] .border { border-color: #1e293b !important; }
html[data-bs-theme="dark"] .border-top,
html[data-bs-theme="dark"] .border-bottom { border-color: #1e293b !important; }

/* ---- 列表项左右分栏：窄屏换行（跟进历史等的「内容 + 右侧时间/操作」原不换行，撑破页面 68px） ---- */
@media (max-width: 767.98px) {
  .list-group-item > .d-flex.justify-content-between { flex-wrap: wrap; row-gap: 6px; }
  .list-group-item > .d-flex.justify-content-between > div { min-width: 0; }
}

/* ---- 纯图标按钮：保证可点面积（列表操作列的编辑/删除等仅 24×24） ---- */
.btn-sm:has(> i.bi:only-child) {
  min-width: 32px; min-height: 30px;
  display: inline-flex; align-items: center; justify-content: center;
  padding-left: 6px; padding-right: 6px;
}
@media (max-width: 767.98px) {
  .btn-sm:has(> i.bi:only-child) { min-width: 36px; min-height: 36px; }
}

/* ---- 描边按钮：Bootstrap 原色为白底设计（白字底上 .btn-outline-warning 仅 1.63:1、
        .btn-outline-info 1.94:1），浅色主题下同样需要换成可读色 ---- */
.btn-outline-success { --bs-btn-color: var(--sc-success); --bs-btn-border-color: #86c9a2;
  --bs-btn-hover-bg: var(--sc-success); --bs-btn-hover-border-color: var(--sc-success);
  --bs-btn-active-bg: var(--sc-success); --bs-btn-active-border-color: var(--sc-success); }
.btn-outline-warning { --bs-btn-color: var(--sc-warning); --bs-btn-border-color: #e3b478;
  --bs-btn-hover-bg: var(--sc-warning); --bs-btn-hover-border-color: var(--sc-warning);
  --bs-btn-active-bg: var(--sc-warning); --bs-btn-active-border-color: var(--sc-warning); }
.btn-outline-info { --bs-btn-color: var(--sc-info); --bs-btn-border-color: #8fc6d4;
  --bs-btn-hover-bg: var(--sc-info); --bs-btn-hover-border-color: var(--sc-info);
  --bs-btn-active-bg: var(--sc-info); --bs-btn-active-border-color: var(--sc-info); }
.btn-outline-danger { --bs-btn-color: var(--sc-danger); --bs-btn-border-color: #e39b9b;
  --bs-btn-hover-bg: var(--sc-danger); --bs-btn-hover-border-color: var(--sc-danger);
  --bs-btn-active-bg: var(--sc-danger); --bs-btn-active-border-color: var(--sc-danger); }
.btn-outline-primary { --bs-btn-color: var(--sc-primary); --bs-btn-border-color: #9db9f2;
  --bs-btn-hover-bg: var(--sc-primary); --bs-btn-hover-border-color: var(--sc-primary);
  --bs-btn-active-bg: var(--sc-primary); --bs-btn-active-border-color: var(--sc-primary); }
.btn-outline-secondary { --bs-btn-color: var(--fg-3); --bs-btn-border-color: #c4cedb;
  --bs-btn-hover-bg: var(--fg-3); --bs-btn-hover-border-color: var(--fg-3);
  --bs-btn-active-bg: var(--fg-3); --bs-btn-active-border-color: var(--fg-3); }
.btn-link { --bs-btn-color: var(--sc-primary); }
html[data-bs-theme="dark"] .btn-outline-success,
html[data-bs-theme="dark"] .btn-outline-warning,
html[data-bs-theme="dark"] .btn-outline-info,
html[data-bs-theme="dark"] .btn-outline-danger,
html[data-bs-theme="dark"] .btn-outline-primary,
html[data-bs-theme="dark"] .btn-outline-secondary { --bs-btn-hover-color: #0b1220; --bs-btn-active-color: #0b1220; }
html[data-bs-theme="dark"] .btn-link { --bs-btn-color: var(--sc-primary); }

/* ---- 看板环比/同比趋势：原 #16a34a 白底仅 3.30:1 ---- */
.kpi-trend.up, .mini-kpi .kpi-trend.up { color: var(--sc-success); }
.kpi-trend.down, .mini-kpi .kpi-trend.down { color: var(--sc-danger); }

/* ---- 窄屏徽章：长文案徽章原 nowrap+block，宽度按内容撑到 458px 撑破页面 ---- */
@media (max-width: 767.98px) {
  .badge { white-space: normal; max-width: 100%; }
}

/* ---- 窄屏：卡片头标题与操作按钮换行，避免标题被挤压/溢出 ---- */
@media (max-width: 575.98px) {
  .card-header { flex-wrap: wrap; row-gap: 6px; }
}

/* ---- 补充暗色适配：分组标题 / 迷你卡标签（原 #64748b 在暗底仅 3.4~3.6:1） ---- */
html[data-bs-theme="dark"] .detail-group-title,
html[data-bs-theme="dark"] .mini-kpi .kpi-label,
html[data-bs-theme="dark"] .mini-kpi .kpi-card-label { color: var(--fg-3); }
html[data-bs-theme="dark"] .detail-group-title::after { background: #334155; }
html[data-bs-theme="dark"] .mini-kpi .kpi-val { color: var(--fg-1); }

/* ---- Bootstrap .text-dark 语义反转 ----
   该类表示「深色文字」，写在浅底上；暗色模式下底变深，文字必须跟着变亮，
   否则出现 #212529 on #0a1120（1.22:1）几乎不可见。 */
html[data-bs-theme="dark"] .text-dark { color: var(--fg-1) !important; }
html[data-bs-theme="dark"] .text-black { color: var(--fg-1) !important; }

/* ---- 紫色强调（商机金额等）：代替模板内联 color:#7c3aed ---- */
.tone-violet { color: #6d28d9; }          /* 白底 6.94:1 */
html[data-bs-theme="dark"] .tone-violet { color: #c4b5fd; }

/* ---- 浅灰面板（代替模板内联 background:#f8fafc） ---- */
.soft-surface { background: #f8fafc; border: 1px solid #f1f5f9; border-radius: 10px; }
html[data-bs-theme="dark"] .soft-surface { background: #172033; border-color: #1e293b; }

/* ---- 兼容垫片：历史模板里直接写死浅色底的内联样式，暗色下统一改为深底 ----
   仅为兜底，新增代码请用 .soft-surface / .soft-panel，勿再写内联底色。 */
html[data-bs-theme="dark"] [style*="background:#f8fafc"],
html[data-bs-theme="dark"] [style*="background: #f8fafc"],
html[data-bs-theme="dark"] [style*="background:#f1f5f9"],
html[data-bs-theme="dark"] [style*="background: #f1f5f9"],
html[data-bs-theme="dark"] [style*="background:#eff6ff"],
html[data-bs-theme="dark"] [style*="background:#fbfdff"],
html[data-bs-theme="dark"] [style*="background:#ffffff"],
html[data-bs-theme="dark"] [style*="background:#fff;"] { background-color: #172033 !important; }

/* ---- 药丸页签（nav-pills）：未选中项原沿用 Bootstrap 主色 #0d6efd（浅底 4.30:1） ---- */
.nav-pills .nav-link { color: var(--fg-2); }
.nav-pills .nav-link:hover { color: var(--brand-dark); }
.nav-pills .nav-link.active { color: #fff; background: var(--brand-dark); }
html[data-bs-theme="dark"] .nav-pills .nav-link { color: var(--fg-2); }
html[data-bs-theme="dark"] .nav-pills .nav-link.active { color: #0b1220; background: var(--brand-light); }

/* ---- 收尾：三处实测仍未达标的组合 ---- */
/* 1) 浅色下 .table-secondary（已完成任务行）底色 #e2e3e5 上的 #5a6b80 仅 4.25:1 */
.table-secondary, .table-secondary > :not(caption) > * > * { color: var(--fg-2); }
/* 2) 页签选中态原用 --brand-dark（白底 3.77:1），改用更深的品牌色 */
.nav-tabs .nav-link.active { color: var(--brand-deep); }
/* 3) 暗色下 Bootstrap .text-bg-light 仍强制黑字 → 黑字压深底（1.23:1） */
html[data-bs-theme="dark"] .text-bg-light {
  background-color: #1a2740 !important; color: var(--fg-2) !important;
  border-color: #334155 !important;
}

/* ---- 页面描述（page_desc 块）：标题下的一行说明，补足「这页能做什么」 ---- */
.page-head { min-width: 0; }
.page-desc {
  font-size: 12.5px; color: var(--fg-4); line-height: 1.45; margin-top: 2px;
  display: flex; align-items: center; gap: 5px; flex-wrap: wrap;
}
.page-desc i { color: var(--brand-dark); font-size: 12px; }
html[data-bs-theme="dark"] .page-desc i { color: var(--brand-light); }
@media (max-width: 991.98px) { .page-desc { display: none; } }   /* 窄屏优先保证标题与搜索 */

/* ================================================================
   UI 3.0 · 主色按钮可读性

   实测：白字压在 .btn-primary / .btn-success 的渐变上，按钮本体中位对比度
   仅 2.67~3.05:1（渐变浅端 #10b981 对白字只有 2.54:1），主 CTA 偏难读。
   这里为每个主题补一档「深主色 --brand-strong」（白字 ≥4.5:1），
   主/成功按钮与选中态页签改用它，保留原有渐变方向与品牌色相。
   ================================================================ */
:root { --brand-strong: #047857; }                 /* 白字 5.48 */
html[data-theme="sky"]    { --brand-strong: #0369a1; }   /* 5.93 */
html[data-theme="indigo"] { --brand-strong: #4338ca; }   /* 7.90 */
html[data-theme="violet"] { --brand-strong: #6d28d9; }   /* 7.10 */
html[data-theme="rose"]   { --brand-strong: #be123c; }   /* 6.29 */
html[data-theme="orange"] { --brand-strong: #c2410c; }   /* 5.18 */
html[data-theme="teal"]   { --brand-strong: #0f766e; }   /* 5.47 */
html[data-theme="slate"]  { --brand-strong: #334155; }   /* 10.35 */
html[data-theme="amber"]  { --brand-strong: #a16207; }   /* 4.92 */

.btn-primary {
  background: linear-gradient(135deg, var(--brand-strong), var(--brand-deep));
  border: 0; color: #fff;
  box-shadow: 0 2px 8px rgba(var(--brand-rgb),.28);
}
.btn-primary:hover, .btn-primary:focus {
  background: linear-gradient(135deg, var(--brand-deep), var(--brand-strong));
  color: #fff; box-shadow: 0 4px 14px rgba(var(--brand-rgb),.36);
}
.btn-primary:disabled, .btn-primary.disabled { opacity: .55; }
.btn-success {
  background: linear-gradient(135deg, #15803d, #166534);
  border: 0; color: #fff; box-shadow: 0 2px 8px rgba(22,163,74,.24);
}
.btn-success:hover, .btn-success:focus {
  background: linear-gradient(135deg, #166534, #14532d); color: #fff;
}
/* 深色主题：按钮已足够深，保持白字即可 */
html[data-bs-theme="dark"] .btn-primary,
html[data-bs-theme="dark"] .btn-success { color: #fff; }

/* 选中态页签/胶囊：原 --brand-dark 白字仅 3.77:1 */
.nav-pills .nav-link.active { background: var(--brand-strong); color: #fff; }
.nav-tabs .nav-link.active { color: var(--brand-strong); }
html[data-bs-theme="dark"] .nav-tabs .nav-link.active { color: var(--brand-light); }

/* 已完成任务行（.table-secondary，#e2e3e5）内的次要文字 4.25:1 → 提到 AA */
.table-secondary .text-secondary,
.table-secondary .text-decoration-line-through,
.table-secondary .btn-outline-secondary { color: var(--fg-2) !important; }
.table-secondary .btn-outline-secondary { --bs-btn-color: var(--fg-2); }

/* ================================================================
   UI 3.1 · 外观（主题）功能增强

   配合 base.html 的三层主题结构：服务端按用户偏好渲染 <html> →
   localStorage 缓存（未登录页）→ 前端即时改写属性 + 后台保存。
   本段补：下拉里的选中勾、配色面板控件、界面密度。
   ================================================================ */

/* ---- 主题下拉：条目变多，限高可滚 + 选中打勾（原 active 背景写死浅绿，暗色下不协调） ---- */
.theme-menu { min-width: 196px; max-height: 76vh; overflow-y: auto; }
.theme-item { justify-content: flex-start; }
.theme-item .theme-tick { font-size: 13px; opacity: 0; }
.theme-item.active .theme-tick { opacity: 1; }
.theme-item.active { background: rgba(var(--brand-rgb), .09); font-weight: 600; color: var(--brand-dark); }
.theme-item.active .theme-dot { box-shadow: 0 0 0 2px #fff, 0 0 0 3px rgba(var(--brand-rgb), .5); }
html[data-bs-theme="dark"] .theme-item.active {
  background: rgba(var(--brand-light-rgb), .16); color: var(--brand-light);
}
html[data-bs-theme="dark"] .theme-item.active .theme-dot {
  box-shadow: 0 0 0 2px #131c2e, 0 0 0 3px rgba(var(--brand-light-rgb), .5);
}
.theme-item .bi-check2 { margin-left: auto; }

/* ---- 界面密度：紧凑模式整体缩小根字号（Bootstrap 的 rem 组件随之收紧） ---- */
html[data-density="compact"] { font-size: 13.5px; }
html[data-density="compact"] .content { padding: 15px 20px 38px; }
html[data-density="compact"] .topbar { padding: 8px 20px; }
html[data-density="compact"] .card-header { padding: 10px 14px; }
html[data-density="compact"] .card-body { padding: 12px 14px; }
html[data-density="compact"] .table > :not(caption) > * > * { padding: .46rem .68rem; }
html[data-density="compact"] .list-group-item { padding: .34rem .85rem; }
html[data-density="compact"] .kpi-card { padding: 12px 13px; gap: 10px; }
html[data-density="compact"] .kpi-card-value { font-size: 19px; }
html[data-density="compact"] .sidebar .nav-link { padding: 6px 12px; }
html[data-density="compact"] .side-group { padding: 13px 12px 5px; }
html[data-density="compact"] .pagination { margin-top: 12px; }

/* ---- 深色模式：表格状态行（.table-warning / .table-danger 等没有暗色变体）----
   实测：库存「低于预警」行、客户「跟进逾期」行、拜访「已逾期」行在暗色下仍是
   浅黄底 #fff3cd，而文字已切成暗色模式的浅色 → 对比度低到 1.34:1，几乎不可读。 */
html[data-bs-theme="dark"] .table-warning,
html[data-bs-theme="dark"] .table-warning > :not(caption) > * > * {
  background-color: #3a3116; color: var(--fg-1);
  --bs-table-bg: #3a3116; --bs-table-color: var(--fg-1);
  --bs-table-border-color: rgba(245,158,11,.28);
}
html[data-bs-theme="dark"] .table-danger,
html[data-bs-theme="dark"] .table-danger > :not(caption) > * > * {
  background-color: #3a1c22; color: var(--fg-1);
  --bs-table-bg: #3a1c22; --bs-table-color: var(--fg-1);
  --bs-table-border-color: rgba(239,68,68,.28);
}
html[data-bs-theme="dark"] .table-success,
html[data-bs-theme="dark"] .table-success > :not(caption) > * > * {
  background-color: #14301f; color: var(--fg-1);
  --bs-table-bg: #14301f; --bs-table-color: var(--fg-1);
}
html[data-bs-theme="dark"] .table-info,
html[data-bs-theme="dark"] .table-info > :not(caption) > * > * {
  background-color: #10303a; color: var(--fg-1);
  --bs-table-bg: #10303a; --bs-table-color: var(--fg-1);
}
html[data-bs-theme="dark"] .table-primary,
html[data-bs-theme="dark"] .table-primary > :not(caption) > * > * {
  background-color: #1a2740; color: var(--fg-1);
  --bs-table-bg: #1a2740; --bs-table-color: var(--fg-1);
}
html[data-bs-theme="dark"] .table-active,
html[data-bs-theme="dark"] .table-active > :not(caption) > * > * {
  background-color: #1e293b; color: var(--fg-1);
  --bs-table-bg: #1e293b; --bs-table-color: var(--fg-1);
}

/* ================================================================
   卡片内边距归一（卡片尺寸优化）

   实测：模板里大量用 Bootstrap 的 p-2 / py-2（0.5rem = 7.25px）当卡片内边距，
   与设计默认的 18px 相差 2.5 倍 —— 同一页面里有的卡片很挤、有的很松，节奏不统一。
   这里把「过紧」的两档收敛到统一尺度（12px 纵向 / 16px 横向），
   使卡片纵向内边距落在 12~18px 的同一量级。
   刻意留白的 py-4/py-5（空态占位卡片）与紧贴内容的 p-0（表格/列表卡）保持不变。
   ================================================================ */
/* 注意：Bootstrap 的内边距工具类带 !important，这里必须同样加 !important 才能生效 */
.card-body.py-2 { padding-top: 12px !important; padding-bottom: 12px !important; }
.card-body.p-2 { padding: 12px 16px !important; }
/* 部分卡片把 py-2 写在 .card 包裹层上 */
.card.py-2 > .card-body { padding-top: 12px !important; padding-bottom: 12px !important; }

/* ==================== 远程下拉选择器（.pick-wrap） ====================
   用于客户/合同/商机/产品等「候选量大」的下拉：原 select 隐藏后保留在
   表单里（提交逻辑不变），改用输入框按关键词远程检索，避免每次渲染
   全部候选（生产上客户 5810 家 → 单页 780KB）。 */
.pick-wrap { position: relative; }
.pick-list {
  position: absolute; z-index: 1085; left: 0; right: 0; top: 100%;
  max-height: 280px; overflow-y: auto; background: var(--bs-body-bg, #fff);
  border: 1px solid var(--bs-border-color, #dee2e6); border-radius: .5rem;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .14); margin-top: 2px;
}
.pick-item {
  padding: 7px 10px; cursor: pointer; font-size: 13.5px; line-height: 1.35;
  border-bottom: 1px solid rgba(148, 163, 184, .16);
}
.pick-item:last-child { border-bottom: 0; }
.pick-item:hover, .pick-item.active { background: rgba(56, 189, 248, .12); }
.pick-item .pick-sub { font-size: 11.5px; color: var(--bs-secondary-color, #64748b); }
.pick-empty { padding: 10px; font-size: 13px; color: var(--bs-secondary-color, #64748b); text-align: center; }
.pick-clear {
  position: absolute; right: 8px; top: 50%; transform: translateY(-50%);
  border: 0; background: transparent; color: var(--bs-secondary-color, #64748b);
  font-size: 15px; line-height: 1; padding: 2px 4px; cursor: pointer;
}