﻿/* ============================================================
   科纪通 · UI 设计系统增强层  (theme.css)
   ------------------------------------------------------------
   本文件在 style.css 之后加载，仅做「覆盖 + 增强」，
   不删除任何原规则。如不满意，删除 index.html 中对应的
   <link> 与 <script> 两行即可瞬间回滚到原始界面。
   设计原则：统一令牌 / 柔和层叠阴影 / 一致圆角节奏 /
   流畅微交互 / 无障碍焦点 / 浅色 + 深色双主题。
   UI Designer · 2026-07-18
   ============================================================ */

/* ---------- 1. 设计令牌（精炼） ---------- */
:root {
  /* 字体：现代中文友好栈（PingFang / 鸿蒙 / 雅黑 兜底系统字体） */
  --font-sans: "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei",
    -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;

  /* 主色：保留品牌蓝，补一档 hover 深蓝 + 浅底 */
  --primary-50:  #eff4ff;
  --primary-100: #dbeafe;
  --primary-500: #2563eb;
  --primary-600: #1d4ed8;
  --primary-700: #1e40af;

  /* 圆角尺度：xs→full 形成统一节奏 */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius:    14px;
  --radius-lg: 18px;
  --radius-xl: 22px;
  --radius-full: 999px;

  /* 阴影：更柔和的层叠阴影（双段式，去死黑） */
  --shadow-xs: 0 1px 2px rgba(15,23,42,.04), 0 1px 3px rgba(15,23,42,.06);
  --shadow-sm: 0 1px 2px rgba(15,23,42,.05), 0 2px 6px rgba(15,23,42,.06);
  --shadow:    0 2px 4px rgba(15,23,42,.04), 0 4px 12px rgba(15,23,42,.06);
  --shadow-md: 0 6px 16px rgba(15,23,42,.08), 0 2px 6px rgba(15,23,42,.05);
  --shadow-lg: 0 12px 32px rgba(15,23,42,.12), 0 4px 12px rgba(15,23,42,.06);

  /* 聚焦环（无障碍） */
  --ring: 0 0 0 3px rgba(37,99,235,.28);

  /* 缓动曲线 */
  --ease: cubic-bezier(.4,0,.2,1);
  --ease-out: cubic-bezier(.16,1,.3,1);

  /* 背景层次（浅色）：主内容区比卡片略浅的灰蓝，制造层次 */
  --app-bg: #f4f6fb;
  --surface: #ffffff;
  --surface-2: #f8fafc;
  --border: #e6e9f0;
  --border-soft: #eef1f6;
  --text: #0f172a;
  --text-muted: #64748b;
  --text-soft: #94a3b8;

  /* ===== 政府资源页扩展令牌（Extension Tokens） · 设计引擎 Phase 2 ===== */
  /* A. 级别语义色（市级/区县/市直机关，克制 tinted-badge） */
  --gov-tier-city-fg: #1d4ed8;   --gov-tier-city-bg: #eff4ff;  --gov-tier-city-dot: #2563eb;
  --gov-tier-district-fg: #0e7490; --gov-tier-district-bg: #ecfeff; --gov-tier-district-dot: #0891b2;
  --gov-tier-agency-fg: #4338ca;  --gov-tier-agency-bg: #eef2ff;  --gov-tier-agency-dot: #4f46e5;
  /* B. 重要度 / 活跃色（呼应 amber text-warning） */
  --gov-active: #d97706;         --gov-active-strong: #b45309; --gov-active-soft: #fef3c7;
  /* C. 指标块 Metric Tile */
  --gov-metric-bg: #f8fafc;      --gov-metric-bg-hover: #fff;   --gov-metric-radius: var(--radius-sm);
  --gov-metric-pad: 14px;        --gov-metric-gap: 10px;
  --gov-metric-num-fg: #0f172a;  --gov-metric-num-weight: 700;
  --gov-metric-num: 22px;        --gov-metric-num-lg: 28px;     --gov-metric-num-sm: 18px;
  --gov-metric-unit-fg: #64748b; --gov-metric-unit-size: 13px;
  --gov-metric-label-fg: #64748b; --gov-metric-label-size: 12px; --gov-metric-label-weight: 500;
  --gov-metric-icon-fg: #2563eb; --gov-metric-icon-bg: #eff4ff; --gov-metric-icon-size: 18px;
  --gov-metric-icon-chip: 32px;  --gov-metric-icon-radius: var(--radius-xs);
  /* D. 卡片升级 */
  --gov-card-bg: #fff;           --gov-card-border: #e6e9f0;    --gov-card-border-hover: #c9d4e8;
  --gov-card-radius: var(--radius); --gov-card-shadow: var(--shadow-sm); --gov-card-shadow-hover: var(--shadow-md);
  --gov-card-pad: 18px;          --gov-card-transition: all .2s var(--ease);
  --gov-card-ring-hover: 0 0 0 3px rgba(37,99,235,.12);
  --gov-accent-bar-h: 3px;       --gov-accent-bar: var(--primary-500); --gov-accent-bar-featured: #d97706;
  /* E. 区县内嵌板块 */
  --gov-district-bg: #f8fafc;    --gov-district-bg-hover: #f1f5f9; --gov-district-radius: var(--radius-sm);
  --gov-district-pad-y: 12px;    --gov-district-pad-x: 14px; --gov-district-divider: #eef1f6;
  --gov-district-name-fg: #0f172a; --gov-district-meta-fg: #64748b;
  --gov-district-count-fg: #2563eb; --gov-district-count-weight: 600;
  /* ===== 状态语义色（Status Semantic · 设计引擎 P1-3） ===== */
  /* 项目状态：与品牌令牌一一对应，作为单一可信源；Chart.js 画布处经 resolveToken() 解析为具体色值 */
  --status-pending: #9ca3af;        --status-pending-bg: #f1f5f9;
  --status-contacted: #0891b2;      --status-contacted-bg: #ecfeff;
  --status-deep: #2563eb;           --status-deep-bg: #eff4ff;
  --status-evaluating: #d97706;     --status-evaluating-bg: #fef3c7;
  --status-signed: #16a34a;         --status-signed-bg: #dcfce7;
  --status-paused: #dc2626;         --status-paused-bg: #fee2e2;
  --status-terminated: #475569;     --status-terminated-bg: #f1f5f9;
  /* 落地运营生命周期专用令牌（集中单一可信源；landing-library 与 dashboard 落地运营块共用，改色一处生效） */
  --status-land-signed: #1d4ed8;      --status-land-signed-bg: #eff4ff;
  --status-land-active: #0e7490;      --status-land-active-bg: #ecfeff;
  --status-land-operating: #15803d;   --status-land-operating-bg: #dcfce7;
  --status-land-moved: #6d28d9;       --status-land-moved-bg: #f5f3ff;
  --status-land-closed: #475569;      --status-land-closed-bg: #f1f5f9;

  /* ===== 组件状态色（零视觉差收编 JS 硬编码 · Tailwind 兼容）
     值精确等于原硬编码 hex，集中为此处单一可信源；暗色模式可在此统一覆盖 */
  --c-gray-500:    #6b7280;   /* 评分-低 / 次级灰 */
  --c-gray-900:    #111827;   /* 维护-正常深灰 */
  --c-red-500:     #ef4444;   /* 维护-超期红 */
  --c-amber-500:   #f59e0b;   /* 维护-临近琥珀 */
  --c-emerald-600: #059669;   /* 通知-确认绿 */
  --c-orange-600:  #ea580c;   /* 通知-审核橙 */
  --c-blue-bg:     #eff6ff;   /* 通知-免费蓝浅底 */
  --c-red-bg:      #fef2f2;   /* 通知-拒绝/超时红浅底 */
  --c-emerald-bg:  #ecfdf5;   /* 通知-确认绿浅底 */
  --c-emerald-border: #bbf7d0;   /* 匹配卡-绿边框（与 #bbf7d0 对齐） */
  --c-amber-bg:    #fff7ed;   /* 通知-审核橙浅底 */
  /* 本轮补全的缺口令牌（同为零视觉差、集中管理；对应 app.js 散落的浅底/浅边框/灰阶） */
  --c-gray-50:     #f9fafb;   /* 中性浅底 */
  --c-gray-100:    #f3f4f6;   /* widget/订单占位浅底 */
  --c-gray-200:    #e5e7eb;   /* 虚线/细边框灰 */
  --c-gray-300:    #d1d5db;   /* 二维码占位虚线边框 */
  --c-gray-700:    #374151;   /* 标签深灰字 */
  --c-green-bg:    #f0fdf4;   /* 绿浅底（成功/已入账） */
  --c-yellow-bg:   #fffbeb;   /* 黄浅底（临近/积分） */
  --c-red-border:  #fecaca;   /* 红浅边框 */
  --c-amber-border:#fde68a;   /* 琥珀浅边框（临近维护） */
  --c-amber-border-strong:#fcd34d; /* 琥珀边框（测试模式警示） */
  --c-blue-border: #bfdbfe;   /* 蓝浅边框（维护预览） */
}

/* ---------- 2. 全局排版与质感 ---------- */
html, body { font-family: var(--font-sans); }
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  background: var(--app-bg);
}
::selection { background: rgba(37,99,235,.16); color: inherit; }

/* 统一的可见焦点（键盘无障碍），仅作用于交互元素 */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
.nav-link:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: none;
  box-shadow: var(--ring);
  border-radius: var(--radius-sm);
}

/* 细滚动条（全局） */
* { scrollbar-width: thin; scrollbar-color: #c7cedb transparent; }
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-thumb { background: #c7cedb; border-radius: 8px; border: 2px solid transparent; background-clip: padding-box; }
*::-webkit-scrollbar-thumb:hover { background: #aab3c4; background-clip: padding-box; }

/* ---------- 3. 侧边栏（更深邃、精致） ---------- */
.sidebar {
  background: linear-gradient(180deg, #0f1b30 0%, #0a1120 100%);
  border-right: 1px solid rgba(255,255,255,.06);
  box-shadow: 2px 0 24px rgba(0,0,0,.22);
}
.sidebar-header { border-bottom-color: rgba(255,255,255,.07); padding: 18px 18px 14px; }
.logo i { background: linear-gradient(135deg, #60a5fa, #818cf8); -webkit-background-clip: text; background-clip: text; color: transparent; }
#tenantBrandIcon { background: none !important; -webkit-background-clip: border-box !important; background-clip: border-box !important; font-size: 18px; color: #60a5fa; } /* 认证图标用纯色，不要渐变方块 */
#tenantBrandName { font-size: 15px; font-weight: 700; letter-spacing: .2px; }

/* 模式切换按钮 → 精致胶囊 */
.mode-switch { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.07); border-radius: var(--radius-full); padding: 4px; }
.mode-btn {
  border-radius: var(--radius-full);
  padding: 6px 14px;
  font-weight: 600;
  box-shadow: none;
  background: transparent;
  color: #cbd5e1;
}
.mode-btn:hover { background: rgba(255,255,255,.1); color: #fff; }

/* 导航项 */
.nav-link {
  font-weight: 500;
  border-radius: var(--radius-sm);
  transition: background .18s var(--ease), color .18s var(--ease), transform .18s var(--ease);
}
.nav-link:hover { background: rgba(255,255,255,.07); color: #fff; transform: translateX(2px); }
.nav-link.active {
  background: linear-gradient(90deg, rgba(37,99,235,.95), rgba(37,99,235,.7));
  color: #fff;
  font-weight: 600;
  box-shadow: inset 3px 0 0 #fff, 0 6px 16px -6px rgba(37,99,235,.6);
}
.nav-link i { transition: transform .18s var(--ease); }
.nav-link:hover i { transform: scale(1.08); }

/* 侧栏滚动条 */
.sidebar ul::-webkit-scrollbar-thumb { background: rgba(255,255,255,.18); }
.sidebar ul:hover::-webkit-scrollbar-thumb { background: rgba(255,255,255,.28); }

/* 主菜单区：按内容自然高度排列，团队/系统管理紧跟其后；超高时内部滚动 */
#sideNav {
    flex: 0 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding-bottom: 6px;
}

/* 用户区 */
.user-avatar { background: linear-gradient(135deg, var(--primary-500), #7c3aed); box-shadow: 0 2px 8px rgba(37,99,235,.4); }
.sidebar-footer { border-top-color: rgba(255,255,255,.07); flex: 0 0 auto; margin-top: auto; }

/* 认证徽标 → 胶囊化（非行内覆盖项用样式补） */
#tenantVerifyBadge { padding: 2px 9px !important; border-radius: var(--radius-full) !important; font-weight: 600 !important; }

/* 主题切换按钮 */
.theme-toggle {
  flex: 0 0 auto;
  width: 34px; height: 34px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color: #cbd5e1;
  border-radius: var(--radius-full);
  cursor: pointer;
  font-size: 15px;
  transition: all .18s var(--ease);
}
.theme-toggle:hover { background: rgba(255,255,255,.14); color: #fff; transform: rotate(-12deg); }

/* ---------- 4. 主内容区 ---------- */
.main-content { background: var(--app-bg); padding: 28px 32px; }
.page-header { margin-bottom: 22px; }
.page-title { letter-spacing: .2px; }
.page-subtitle { color: var(--text-muted); }

/* ---------- 5. 卡片 ---------- */
.card {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  transition: box-shadow .25s var(--ease), border-color .25s var(--ease);
}
.card:hover { box-shadow: var(--shadow-md); }
.card-body { padding: 22px; }

.stat-card {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  transition: transform .22s var(--ease-out), box-shadow .22s var(--ease);
}
.stat-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.stat-icon { border-radius: var(--radius-sm); box-shadow: var(--shadow-xs); }
.stat-value { letter-spacing: -.5px; }

/* ---------- 6. 按钮 ---------- */
.btn {
  border-radius: var(--radius-sm);
  font-weight: 500;
  transition: background .18s var(--ease), box-shadow .18s var(--ease), transform .12s var(--ease), color .18s var(--ease);
}
.btn-sm { border-radius: var(--radius-xs); }
.btn-primary {
  background: linear-gradient(180deg, var(--primary-500), var(--primary-600));
  border-color: transparent;
  box-shadow: 0 1px 2px rgba(37,99,235,.4);
}
.btn-primary:hover {
  background: linear-gradient(180deg, var(--primary-600), var(--primary-700));
  transform: translateY(-1px);
  box-shadow: 0 8px 18px -6px rgba(37,99,235,.55);
}
.btn-primary:active { transform: translateY(0); }
.btn-outline-primary { border-color: var(--primary-500); }
.btn-outline-primary:hover { background: var(--primary-50); transform: translateY(-1px); }
.btn:disabled, .btn[disabled] { opacity: .55; cursor: not-allowed; transform: none !important; box-shadow: none !important; }

/* ---------- 7. 表单 ---------- */
.form-label { color: var(--text); letter-spacing: .2px; }
.form-control, .form-select {
  border-radius: var(--radius-sm);
  border-color: var(--border);
  color: var(--text);
  transition: border-color .15s var(--ease), box-shadow .15s var(--ease);
}
.form-control::placeholder { color: var(--text-soft); }
.form-control:focus, .form-select:focus {
  border-color: var(--primary-500);
  box-shadow: var(--ring);
}
.form-control:hover:not(:focus), .form-select:hover:not(:focus) { border-color: #cfd6e4; }

/* ---------- 8. 表格 ---------- */
.table-card { border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; }
th {
  position: sticky; top: 0; z-index: 2;
  background: var(--surface-2);
  color: var(--text-muted);
  border-bottom: 1px solid var(--border);
  letter-spacing: .3px;
}
td { color: var(--text); border-bottom: 1px solid var(--border-soft); }
tr:hover td { background: var(--surface-2); }

/* ---------- 9. 标签 / 徽章 ---------- */
.tag { border-radius: var(--radius-full); padding: 3px 10px; font-weight: 500; letter-spacing: .2px; }
.badge-round { border-radius: var(--radius-full); }

/* ---------- 10. 模态框（入场动画 + 背景模糊） ---------- */
.modal-backdrop { background: rgba(15,23,42,.45); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); }
.modal-content {
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  animation: modalIn .22s var(--ease-out);
}
@keyframes modalIn {
  from { opacity: 0; transform: translateY(10px) scale(.98); }
  to   { opacity: 1; transform: none; }
}
.modal-header { padding: 18px 22px; }
.modal-footer { padding: 14px 22px; }

/* 居中轻量弹窗 */
.center-alert-box { border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); }

/* ---------- 11. 登录页 ---------- */
.login-card {
  border-radius: var(--radius-xl);
  padding: 44px 40px;
  box-shadow: 0 24px 70px rgba(15,23,42,.25);
}
.login-logo i {
  background: linear-gradient(135deg, #60a5fa, #7c3aed);
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
  font-size: 52px;
}
.login-form .btn-primary { border-radius: var(--radius-sm); }

/* ---------- 12. AI 聊天 ---------- */
.chat-panel { border-radius: var(--radius-lg); border: 1px solid var(--border); }
.chat-fab { background: transparent; }
.chat-header { border-radius: var(--radius-lg) var(--radius-lg) 0 0; }

/* ---------- 13. 匹配结果 / 时间线 ---------- */
.match-card { border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); }

/* 项目详情页推荐地方政府/基金卡片：紧凑小卡（仅作用于 rec-cards 作用域，不影响匹配报告同名卡） */
/* 等高 + 底部按钮贴底：同一行卡片统一高度、按钮对齐 */
.rec-cards .match-card { padding: 7px 9px; display: flex; flex-direction: column; height: 100%; overflow: hidden; box-sizing: border-box; }
.rec-cards .match-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; margin-bottom: 4px; min-width: 0; }
.rec-cards .match-header > div:first-child { flex: 1; min-width: 0; overflow: hidden; }
.rec-cards .match-name { font-size: 12px; }
.rec-cards .match-score { font-size: 13px; padding: 1px 6px; flex-shrink: 0; }
.rec-cards .match-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; width: 100%; display: block; box-sizing: border-box; } /* 描述行单行缩略，hover 看 title */
.rec-cards .match-reasons { margin: 3px 0 0; overflow: hidden; }
.rec-cards .match-reasons li { font-size: 10px; padding: 1px 0; padding-left: 14px; }
.rec-cards .match-reasons li::before { font-size: 10px; }
.rec-cards .match-actions { margin-top: auto; } /* 按钮永远贴卡片底部，保证整齐 */
.rec-cards .btn-sm { padding: .15rem .4rem; font-size: .7rem; }
.match-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); transition: box-shadow .2s var(--ease), transform .2s var(--ease); }
.timeline-content { border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); }

/* ---------- 14. 招商看板 / 知识库（圆角节奏统一） ---------- */
.pipeline-col { border-radius: var(--radius); border: 1px solid var(--border); }
.pipeline-card { border-radius: var(--radius-sm); }
.kb-tree, .kb-project-item, .kb-link-item { border-radius: var(--radius-sm); }

/* ============================================================
   深色主题  (body.dark)  —— 实验性，可一键关闭
   仅重涂主要表面（背景/卡片/表/表单/弹窗/看板/知识库），
   与科纪广场（青绿主色）可叠加共存。
   ============================================================ */
body.dark {
  --app-bg: #0b1020;
  --surface: #121a2e;
  --surface-2: #18223a;
  --border: #243049;
  --border-soft: #1d2740;
  --text: #e6edf7;
  --text-muted: #9aa7bd;
  --text-soft: #6b7894;
  --gray-50: #121a2e;
  --gray-100: #18223a;
  --gray-200: #243049;
  --gray-300: #2f3c57;
  --gray-500: #9aa7bd;
  --gray-700: #c3cde0;
  --gray-900: #e6edf7;
  --primary-50: #18223a;
  --primary-100: #1e2d4d;
  --primary-light: #1e2d4d;
  --ring: 0 0 0 3px rgba(96,165,250,.35);
  --shadow: 0 2px 6px rgba(0,0,0,.4);
  --shadow-md: 0 8px 20px rgba(0,0,0,.5);
  --shadow-lg: 0 14px 36px rgba(0,0,0,.55);
}
body.dark { background: var(--app-bg); }
body.dark .main-content { background: var(--app-bg); }

/* 卡片 / 面板类（用字面色的组件统一重涂） */
body.dark .card,
body.dark .table-card,
body.dark .stat-card,
body.dark .match-card,
body.dark .timeline-content,
body.dark .broker-card,
body.dark .modal-content,
body.dark .center-alert-box,
body.dark .modal-box,
body.dark .kb-preview { background: var(--surface); border-color: var(--border); }

body.dark th { background: var(--surface-2); color: var(--text-muted); border-color: var(--border); }
body.dark td { color: var(--text); border-color: var(--border-soft); }
body.dark tr:hover td { background: var(--surface-2); }

body.dark .form-control,
body.dark .form-select { background-color: var(--surface-2); border-color: var(--border); color: var(--text); }
body.dark .form-select {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23adb5bd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 16px 12px;
}
body.dark .form-control::placeholder { color: var(--text-soft); }
body.dark .form-control:hover:not(:focus),
body.dark .form-select:hover:not(:focus) { border-color: #33415c; }

body.dark .pipeline-col { background: var(--surface-2); border-color: var(--border); }
body.dark .pipeline-card { background: var(--surface); border-color: var(--border); }
body.dark .kb-tree,
body.dark .kb-project-item,
body.dark .kb-link-item,
body.dark .add-widget-item { background: var(--surface-2); border-color: var(--border); }
body.dark .kb-tree-row .kb-tree-actions { background: var(--surface); box-shadow: 0 1px 4px rgba(0,0,0,.4); }

body.dark .message-card { border-color: var(--border); }
body.dark .message-card.unread { background: rgba(37,99,235,.14); border-left-color: var(--primary-500); }
body.dark .memo-item { border-color: var(--border); }
body.dark .memo-item.pinned { background: rgba(245,158,11,.12); }
body.dark .plan-card { background: var(--surface-2); border-color: var(--border); }

body.dark .chat-body { background: var(--surface-2); }
body.dark .chat-panel { background: var(--surface); border-color: var(--border); }
body.dark .text-muted,
body.dark .page-subtitle { color: var(--text-muted); }
body.dark .modal-header,
body.dark .modal-footer { border-color: var(--border); }
/* 暗色主题下 modal 关闭按钮（btn-close 默认黑色 SVG）反色为白色，保证在深色 modal 上可见 */
body.dark .modal .btn-close { filter: invert(1) grayscale(100%) brightness(220%); opacity: .8; }
body.dark .modal .btn-close:hover { opacity: 1; }

/* 深色下导航激活态保持品牌蓝（不与青绿经纪模式冲突） */
body.dark .sidebar .nav-link.active { background: linear-gradient(90deg, rgba(59,130,246,.95), rgba(59,130,246,.7)); }

/* 尊重「减少动态效果」偏好（无障碍） */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

/* ============================================================
   15. 盲区补强（Bootstrap 原生组件 + 自定义组件统一）
   ------------------------------------------------------------
   针对 app.js 动态渲染中 theme.css 尚未接管、仍呈默认皮肤的组件。
   多为 Bootstrap 原生（nav-tabs / dropdown-menu / pagination /
   progress / alert）或自定义（dashboard-menu / empty-state /
   section-title）。统一到本设计系统的圆角 / 阴影 / 主色节奏。
   nav-tabs 用 !important 压制 app.js 内联遗留的 border-bottom /
   padding，确保分段控件风格纯净统一。
   ============================================================ */

/* 15.1 现代分段控件式 nav-tabs（覆盖 Bootstrap 下划线风格） */
.nav-tabs {
  border-bottom: none !important;
  background: var(--surface-2);
  padding: 4px !important;
  gap: 4px !important;
  border-radius: var(--radius);
}
.nav-tabs .nav-item { margin: 0 !important; }
.nav-tabs .nav-link {
  border: none;
  border-radius: var(--radius-sm);
  color: var(--text-muted);
  font-weight: 500;
  font-size: 14px;
  padding: 8px 16px;
  transition: background .18s var(--ease), color .18s var(--ease);
}
.nav-tabs .nav-link:hover { color: var(--text); background: rgba(15,23,42,.05); }
.nav-tabs .nav-link.active {
  background: var(--surface);
  color: var(--primary-600);
  font-weight: 600;
  border-color: transparent;
  box-shadow: var(--shadow-xs);
}
.nav-tabs .nav-link:focus-visible { box-shadow: var(--ring); }
/* 15.1.1 系统管理 tab 分组标签（组名分隔条，不可点击） */
.nav-tabs .admin-tab-group-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .1em;
  color: var(--primary-600);
  background: rgba(37, 99, 235, .10);
  border-left: 3px solid #2563eb;
  border-radius: var(--radius-sm);
  padding: 8px 14px;
  margin-right: 6px;
  cursor: default;
  white-space: nowrap;
  opacity: 1;
}
.nav-tabs .admin-tab-group-label:hover {
  color: var(--primary-600);
  background: rgba(37, 99, 235, .16);
}

/* 15.2 精致下拉菜单（覆盖 Bootstrap 默认浅灰下拉） */
.dropdown-menu {
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-md);
  padding: 6px;
  font-size: 14px;
}
.dropdown-item {
  border-radius: var(--radius-xs);
  padding: 7px 12px;
  color: var(--text);
  transition: background .15s var(--ease), color .15s var(--ease);
}
.dropdown-item:hover, .dropdown-item:focus { background: var(--primary-50); color: var(--primary-700); }
.dropdown-item.active, .dropdown-item:active { background: var(--primary-500); color: #fff; }
.dropdown-divider { border-color: var(--border-soft); margin: 6px 4px; }

/* 15.3 圆角分页（覆盖 Bootstrap 默认分页） */
.pagination { gap: 4px; }
.page-item .page-link {
  border-radius: var(--radius-sm);
  border-color: var(--border);
  color: var(--text);
  padding: 7px 12px;
  transition: background .15s var(--ease), color .15s var(--ease), border-color .15s var(--ease);
}
.page-item .page-link:hover { background: var(--primary-50); color: var(--primary-700); border-color: var(--primary-100); }
.page-item.active .page-link { background: var(--primary-500); border-color: var(--primary-500); color: #fff; box-shadow: 0 1px 2px rgba(37,99,235,.4); }
.page-item.disabled .page-link { color: var(--text-soft); background: var(--surface-2); }

/* 15.4 进度条圆角 + 平滑（Bootstrap .progress 通用增强） */
.progress { border-radius: var(--radius-full); background: var(--surface-2); height: 8px; overflow: hidden; }
.progress-bar { border-radius: var(--radius-full); transition: width .5s var(--ease); }

/* 15.5 alert 圆角统一 */
.alert { border-radius: var(--radius-sm); border: 1px solid transparent; }

/* 15.6 空状态精致化（虚线卡片 + 渐变图标） */
.empty-state {
  border: 1px dashed var(--border);
  border-radius: var(--radius-lg);
  background: var(--surface-2);
  color: var(--text-muted);
}
.empty-state i {
  background: linear-gradient(135deg, var(--primary-500), var(--primary-700));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* 15.7 dashboard-menu 蓝色统一（旧 #4f46e5 → 设计令牌） */
.dashboard-menu { border-color: var(--border); box-shadow: var(--shadow-md); border-radius: var(--radius-sm); }
.dashboard-menu-item:hover { background: var(--surface-2); }
.dashboard-menu-item.active { background: var(--primary-50); color: var(--primary-600); }
.dashboard-menu-count { background: var(--surface-2); color: var(--text-muted); }
.dashboard-menu-new { color: var(--primary-600); }
.dashboard-selector .dropdown-toggle { border-radius: var(--radius-xs); }

/* 15.8 section-title 精致化（左侧主色条小标题，替代朴素下边框） */
.section-title {
  border-bottom: none;
  padding-bottom: 0;
  font-size: 15px;
  font-weight: 700;
  color: var(--text);
  position: relative;
  padding-left: 12px;
}
.section-title::before {
  content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 4px; height: 16px; border-radius: 2px;
  background: linear-gradient(180deg, var(--primary-500), var(--primary-700));
}

/* 15.9 登录页背景光晕（保留蓝渐变，加层次） */
.login-page {
  background:
    radial-gradient(1200px 600px at 12% 8%, rgba(96,165,250,.35), transparent 60%),
    radial-gradient(1000px 520px at 88% 92%, rgba(124,58,237,.30), transparent 55%),
    linear-gradient(135deg, #0f1b30 0%, #1e40af 55%, #2563eb 100%);
}

/* ============================================================
   16. 盲区组件 · 深色模式适配
   ============================================================ */
body.dark .nav-tabs { background: var(--surface-2); }
body.dark .nav-tabs .nav-link { color: var(--text-muted); }
body.dark .nav-tabs .nav-link:hover { background: rgba(255,255,255,.06); color: var(--text); }
body.dark .nav-tabs .nav-link.active { background: var(--surface); color: #93c5fd; }
body.dark .nav-tabs .admin-tab-group-label {
  color: #93c5fd;
  background: rgba(96, 165, 250, .16);
  border-left-color: #60a5fa;
}
body.dark .nav-tabs .admin-tab-group-label:hover {
  color: #bfdbfe;
  background: rgba(96, 165, 250, .22);
}
body.dark .dropdown-menu { background: var(--surface); border-color: var(--border); }
body.dark .dropdown-item { color: var(--text); }
body.dark .dropdown-item:hover { background: var(--surface-2); color: #93c5fd; }
body.dark .page-item .page-link { background: var(--surface); border-color: var(--border); color: var(--text); }
body.dark .page-item .page-link:hover { background: var(--surface-2); color: #93c5fd; }
body.dark .page-item.active .page-link { background: var(--primary-500); border-color: var(--primary-500); color: #fff; }
body.dark .page-item.disabled .page-link { background: var(--surface-2); }
body.dark .empty-state { background: var(--surface-2); border-color: var(--border); }
body.dark .section-title { color: var(--text); }
body.dark .section-title::before { background: linear-gradient(180deg, #60a5fa, #818cf8); }
body.dark .alert { background: var(--surface-2); }
body.dark .progress { background: var(--surface-2); }

/* ---------- 17. 招商看板（Pipeline）视觉打磨 ---------- */
.pipeline-board { padding: 4px 2px 12px; }
.pipeline-cols { gap: 14px; }
.pipeline-col {
  background: var(--surface-2);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius);
  padding: 12px 10px;
  box-shadow: var(--shadow-xs);
  transition: box-shadow .2s var(--ease), transform .2s var(--ease);
}
.pipeline-col:hover { box-shadow: var(--shadow-sm); }
.pipeline-col-header {
  background: linear-gradient(180deg, var(--surface), var(--surface-2));
  border-radius: var(--radius-sm) var(--radius-sm) 0 0;
  padding: 12px 10px;
  margin: -12px -10px 12px;
  box-shadow: 0 1px 0 var(--border-soft);
}
.pipeline-col-name { letter-spacing: .2px; }
.pipeline-col-count {
  background: var(--primary-50);
  color: var(--primary-600);
  font-weight: 700;
  box-shadow: var(--shadow-xs);
}
.pipeline-empty {
  color: var(--text-soft);
  border: 1px dashed var(--border);
  border-radius: var(--radius-sm);
  padding: 22px 0;
  margin: 4px 2px;
}
.pipeline-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 14px;
  box-shadow: var(--shadow-xs);
  transition: box-shadow .18s var(--ease), transform .18s var(--ease), border-color .18s var(--ease);
}
.pipeline-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
  border-color: var(--primary-100);
}
.pipeline-card-title { color: var(--text); font-size: 14.5px; line-height: 1.45; }
.pipeline-card-owner { color: var(--text-muted); }
.pipeline-card-actions .btn { border-radius: var(--radius-xs); }
.pipeline-due { font-weight: 600; }
.pipeline-due.ok { background: #ecfdf5; color: #059669; }
.pipeline-due.soon { background: #fffbeb; color: #d97706; }
.pipeline-due.overdue { background: #fef2f2; color: #dc2626; }

/* 统计 chips + 转化漏斗 */
.stat-chip {
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--primary-500);
  border-radius: var(--radius-xs);
  padding: 6px 12px;
  box-shadow: var(--shadow-xs);
  font-size: 13px;
}
.stat-chip b { color: var(--primary-600); }
.stat-overdue { border-left-color: #dc2626; color: #dc2626; }
.stat-overdue b { color: #dc2626; }
.pipeline-stats .stat-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.funnel-row { margin-top: 8px; font-size: 12.5px; }

/* 深色适配 */
body.dark .pipeline-col { background: var(--surface-2); border-color: var(--border); }
body.dark .pipeline-col-header { background: linear-gradient(180deg, var(--surface), var(--surface-2)); box-shadow: 0 1px 0 var(--border); }
body.dark .pipeline-col-count { background: rgba(37,99,235,.18); color: #93c5fd; }
body.dark .pipeline-empty { color: var(--text-soft); border-color: var(--border); }
body.dark .pipeline-card { background: var(--surface); border-color: var(--border); }
body.dark .pipeline-card-title { color: var(--text); }
body.dark .pipeline-card-owner { color: var(--text-muted); }
body.dark .stat-chip { background: var(--surface); border-color: var(--border); }
body.dark .stat-chip b { color: #93c5fd; }

/* ===== Section 18: 转化漏斗（看板复用） ===== */
.funnel-row { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.funnel-label { width: 96px; flex: 0 0 96px; font-size: .85rem; color: var(--text-muted); text-align: right; }
.funnel-bar-wrap { flex: 1; position: relative; background: rgba(148,163,184,.12); border-radius: 6px; height: 26px; overflow: hidden; }
.funnel-bar { height: 100%; border-radius: 6px; transition: width .4s ease; min-width: 2px; }
.funnel-num { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); font-size: .8rem; font-weight: 600; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.25); }
body.dark .funnel-label { color: var(--text-muted); }
body.dark .funnel-bar-wrap { background: rgba(255,255,255,.08); }

/* ============================================================
   19. 政府资源页（设计引擎 Phase 3 落地 · 沿用本系统令牌）
   仅作用于 .gov-* 作用域，不影响其他页面。
   ============================================================ */

/* 19.0 工具栏卡片（省份筛选 + 搜索） */
.toolbar-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 12px 14px;
  margin-bottom: 18px;
  box-shadow: var(--shadow-xs);
}
.toolbar-card .prov-select { width: 220px; flex: 0 0 auto; }
.toolbar-card .search-input { flex: 1; min-width: 220px; }
.toolbar-card .input-group-text { background: var(--surface); border-color: var(--border); color: var(--text-muted); }

/* 19.1 视图切换：分段控件 */
.gov-view-tabs {
  display: flex;
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-full);
  padding: 4px;
  gap: 4px;
  margin-bottom: 22px;
}
.gov-view-tabs .seg {
  border: none;
  background: transparent;
  color: var(--text-muted);
  font-size: 13px;
  font-weight: 500;
  padding: 8px 16px;
  border-radius: var(--radius-full);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  transition: all .15s var(--ease);
  white-space: nowrap;
}
.gov-view-tabs .seg:hover { color: var(--text); }
.gov-view-tabs .seg.active { background: var(--surface); color: var(--primary-600); box-shadow: var(--shadow-sm); }
.gov-view-tabs .seg .bi { font-size: 14px; }

/* 19.2 城市卡片 — 紧凑折叠型（设计引擎 Phase 6 落地） */
.gov-city-card {
  position: relative;
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid transparent;
  border-radius: var(--radius);
  box-shadow: var(--shadow-xs);
  transition: border-color .15s var(--ease), box-shadow .15s var(--ease);
  display: flex;
  flex-direction: column;
  cursor: pointer;
  overflow: hidden;
}
.gov-city-card:hover { border-color: var(--primary-500); box-shadow: var(--shadow-sm); }
.gov-city-card:focus-visible { outline: none; box-shadow: var(--ring); }
.gov-city-card.expanded { border-color: var(--primary-600); box-shadow: var(--shadow-md); }
.gov-city-card.featured { border-left-color: var(--gov-accent-bar-featured); }

/* 卡片头部 */
.gov-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; padding: 16px 16px 0; }
.gov-head-left { min-width: 0; flex: 1; }
.gov-prov { font-size: 12px; color: var(--text-muted); display: inline-flex; align-items: center; gap: 4px; }
.gov-card-head h6 { font-size: 18px; font-weight: 700; margin: 4px 0 6px; letter-spacing: -.01em; color: var(--text); cursor: pointer; }
.gov-card-head h6:hover { color: var(--primary-600); }
.tier-row { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.gov-chevron { color: var(--text-muted); font-size: 16px; transition: transform .25s var(--ease); flex: 0 0 auto; margin-top: 2px; }
.gov-city-card.expanded .gov-chevron { transform: rotate(180deg); }

/* 级别徽标 */
.tier-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 600; padding: 3px 8px; border-radius: var(--radius-full); line-height: 1; }
.tier-badge .dot { width: 6px; height: 6px; border-radius: 50%; flex: 0 0 auto; }
.tier-city { color: var(--gov-tier-city-fg); background: var(--gov-tier-city-bg); }
.tier-city .dot { background: var(--gov-tier-city-dot); }
.tier-district { color: var(--gov-tier-district-fg); background: var(--gov-tier-district-bg); }
.tier-district .dot { background: var(--gov-tier-district-dot); }
.tier-agency { color: var(--gov-tier-agency-fg); background: var(--gov-tier-agency-bg); }
.tier-agency .dot { background: var(--gov-tier-agency-dot); }

/* 活跃徽标（对接次数，琥珀） */
.active-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 600; color: var(--gov-active-strong); background: var(--gov-active-soft); padding: 4px 9px; border-radius: var(--radius-full); white-space: nowrap; flex: 0 0 auto; }

/* 折叠态内容 */
.gov-folded { padding: 10px 16px 0; display: flex; flex-direction: column; gap: 8px; }
.gov-desc { font-size: 14px; color: var(--text-muted); line-height: 1.5; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.gov-inline-metrics { display: flex; flex-wrap: wrap; gap: 10px; }
.gov-inline-metrics .im {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 12px; color: var(--text-muted);
  background: var(--gov-metric-bg);
  border-radius: var(--gov-metric-radius);
  padding: 5px 9px;
  transition: background .15s var(--ease);
}
.gov-inline-metrics .im .bi { color: var(--gov-metric-icon-fg); font-size: 13px; }
.gov-city-card:hover .gov-inline-metrics .im { background: var(--gov-metric-bg-hover); }

/* 展开态（grid 0fr→1fr 平滑过渡） */
.gov-expanded { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .25s var(--ease); padding: 0 16px; }
.gov-city-card.expanded .gov-expanded { grid-template-rows: 1fr; padding-top: 12px; padding-bottom: 4px; }
.gov-expanded-inner { min-height: 0; overflow: hidden; display: flex; flex-direction: column; gap: 10px; }

/* 资金上限突出行 */
.gov-funding { display: flex; align-items: center; justify-content: space-between; background: var(--primary-50); border-radius: var(--radius-xs); padding: 10px 12px; }
.gov-funding-label { color: #475569; font-size: 13px; font-weight: 500; }
.gov-funding-val { color: var(--primary-700); font-size: 16px; font-weight: 700; }

/* 对接联系人 */
.gov-contact { font-size: 12px; color: var(--text-muted); display: flex; align-items: center; flex-wrap: wrap; gap: 4px; }
.gov-contact .contact-badge { font-size: 11px; }

/* 区县内嵌面板 */
.gov-district-panel { background: var(--surface-2); border-radius: var(--radius-xs); padding: 4px 12px; display: flex; flex-direction: column; }
.district-item { display: flex; align-items: center; gap: 8px; padding: 9px 0; border-bottom: 1px solid var(--border-soft); cursor: pointer; }
.district-item:first-child { padding-top: 2px; }
.district-item:last-child { border-bottom: none; padding-bottom: 2px; }
.district-item:hover { background: var(--surface); }
.district-item .d-icon { font-size: 14px; color: var(--primary-500); flex: 0 0 auto; }
.district-item.agency .d-icon { color: var(--gov-tier-agency-dot); }
.district-item .d-name { font-weight: 600; font-size: 13px; color: var(--text); }
.district-item .d-meta { margin-left: auto; display: flex; gap: 6px; flex: 0 0 auto; }

/* 操作栏 */
.gov-action-bar { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: auto; border-top: 1px solid var(--border-soft); padding: 12px 16px 14px; }
.gov-action-bar .btn { font-size: 12px; padding: 5px 10px; border-radius: var(--radius-xs); display: inline-flex; align-items: center; gap: 4px; line-height: 1.2; transition: transform .12s var(--ease), background .15s var(--ease), border-color .15s var(--ease), color .15s var(--ease); }
.gov-action-bar .btn:hover { transform: translateY(-1px); }
.gov-action-bar .btn .bi { font-size: 12px; }
.btn-add-district { color: var(--primary-600); border: 1px solid var(--primary-100); background: #fff; }
.btn-add-district:hover { background: var(--primary-50); border-color: var(--primary-500); }
.btn-add-agency { color: var(--gov-tier-district-fg); border: 1px solid var(--gov-tier-district-dot); background: #fff; }
.btn-add-agency:hover { background: var(--gov-tier-district-bg); }
.btn-edit { color: var(--text-muted); border: 1px solid var(--border); background: #fff; }
.btn-edit:hover { background: var(--surface-2); color: var(--text); }
.btn-del { color: #dc2626; border: 1px solid transparent; background: transparent; padding: 5px 8px; }
.btn-del:hover { background: #fef2f2; }

/* 网格对齐：展开态不撑平同行 */
#govGrid .row { align-items: start; }

/* 无障碍：尊重「减少动效」系统偏好 */
@media (prefers-reduced-motion: reduce) {
  .gov-city-card, .gov-chevron, .gov-expanded, .gov-action-bar .btn { transition: none !important; animation: none !important; }
}

/* ============================================================
   19.D 政府资源页 · 深色模式适配
   ============================================================ */
body.dark {
  --gov-tier-city-fg: #93c5fd;   --gov-tier-city-bg: rgba(37,99,235,.16);  --gov-tier-city-dot: #60a5fa;
  --gov-tier-district-fg: #67e8f9; --gov-tier-district-bg: rgba(8,145,178,.16); --gov-tier-district-dot: #22d3ee;
  --gov-tier-agency-fg: #a5b4fc;  --gov-tier-agency-bg: rgba(79,70,229,.18);  --gov-tier-agency-dot: #818cf8;
  --gov-active-strong: #fcd34d; --gov-active-soft: rgba(217,119,6,.20);
}
body.dark .toolbar-card { background: var(--surface); border-color: var(--border); }
body.dark .gov-view-tabs { background: var(--surface-2); }
body.dark .gov-view-tabs .seg { color: var(--text-muted); }
body.dark .gov-view-tabs .seg:hover { color: var(--text); }
body.dark .gov-view-tabs .seg.active { background: var(--surface); color: #93c5fd; }
body.dark .toolbar-card .input-group-text { background: var(--surface); color: var(--text-muted); }
body.dark .gov-city-card { background: var(--surface); border-color: var(--border); }
body.dark .gov-city-card:hover { border-color: var(--primary-500); }
body.dark .gov-city-card.featured { border-left-color: var(--gov-accent-bar-featured); }
body.dark .gov-funding { background: rgba(37,99,235,.14); }
body.dark .gov-funding-label { color: #cbd5e1; }
body.dark .gov-funding-val { color: #93c5fd; }
body.dark .gov-district-panel { background: var(--surface-2); }
body.dark .gov-district-panel .district-item:hover { background: var(--surface); }
body.dark .btn-add-district { background: var(--surface); }
body.dark .btn-add-district:hover { background: var(--primary-50); }
body.dark .btn-add-agency { background: var(--surface); }
body.dark .btn-add-agency:hover { background: var(--gov-tier-district-bg); }
body.dark .btn-edit { background: var(--surface); }
body.dark .btn-edit:hover { background: var(--surface-2); }
body.dark .btn-del:hover { background: rgba(220,38,38,.16); }

/* ============================================================
   20. 列表密度偏好（个人偏好 · kjzst-density）
   - compact：紧凑，信息密；cozy：宽松，留白多；normal：默认
   ============================================================ */
body.density-compact .table { font-size: 12px; }
body.density-compact .table td,
body.density-compact .table th { padding: .3rem .5rem; }
body.density-compact .card-body { padding: .85rem 1.1rem; }
body.density-compact .list-group-item { padding: .5rem .9rem; }

body.density-cozy .table { font-size: 14px; }
body.density-cozy .table td,
body.density-cozy .table th { padding: .85rem 1rem; }
body.density-cozy .card-body { padding: 1.5rem 1.85rem; }
body.density-cozy .list-group-item { padding: 1rem 1.25rem; }

/* 机构库文档附件目录树（暗色） */
body.dark .kb-att-panel { border-top-color: #2e3037; }
body.dark .kb-att-row:hover { background: rgba(255,255,255,0.04); }
body.dark .kb-att-meta { color: #6e747c; }
body.dark .kb-att-actions a { color: #8b909a; }
body.dark .kb-att-actions a:hover { color: #6b8afd; }
body.dark .kb-att-empty { color: #6e747c; }
