* { box-sizing: border-box; margin: 0; padding: 0; }
:root{
  --bg:#f5f6fa; --card:#fff; --line:#e5e7eb; --txt:#1f2937; --sub:#6b7280;
  --blue:#2563eb; --green:#059669; --red:#dc2626; --amber:#d97706;
}
body{ font-family:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif; background:var(--bg); color:var(--txt); }
#app{ display:flex; min-height:100vh; }

/* 侧边栏 */
#sidebar{ width:220px; background:#111827; color:#e5e7eb; flex-shrink:0; display:flex; flex-direction:column; }
.logo{ padding:20px 18px; font-size:18px; font-weight:700; color:#fff; border-bottom:1px solid #1f2937; }
#nav{ flex:1; padding:10px 0; }
#nav a{ display:block; padding:12px 20px; color:#9ca3af; cursor:pointer; text-decoration:none; font-size:15px; border-left:3px solid transparent; }
#nav a:hover{ background:#1f2937; color:#fff; }
#nav a.active{ background:#1f2937; color:#fff; border-left-color:var(--blue); }
.side-foot{ padding:14px 18px; font-size:12px; color:#6b7280; border-top:1px solid #1f2937; }

/* 主区 */
#main{ flex:1; padding:24px 28px; overflow-y:auto; }
.page{ display:none; }
.page.active{ display:block; }
h2{ font-size:22px; margin-bottom:18px; }
h3{ font-size:15px; margin-bottom:12px; color:var(--sub); }

/* 卡片 */
.cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:14px; margin-bottom:20px; }
.card{ background:var(--card); border:1px solid var(--line); border-radius:10px; padding:18px; }
.card .num{ font-size:26px; font-weight:700; margin-top:6px; }
.card .lbl{ font-size:13px; color:var(--sub); }
.blue{ color:var(--blue);} .green{ color:var(--green);} .red{ color:var(--red);} .amber{ color:var(--amber);}

.grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.panel{ background:var(--card); border:1px solid var(--line); border-radius:10px; padding:18px; }
@media(max-width:900px){ .grid-2{ grid-template-columns:1fr; } }

/* 列表 */
.cust-list{ display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:14px; }
.cust-card{ background:var(--card); border:1px solid var(--line); border-radius:10px; padding:16px; cursor:pointer; transition:.15s; }
.cust-card:hover{ box-shadow:0 4px 14px rgba(0,0,0,.08); }
.cust-card .name{ font-weight:700; font-size:16px; }
.cust-card .meta{ font-size:13px; color:var(--sub); margin-top:6px; white-space:pre-line; }
.cust-card .need{ font-size:13px; margin-top:8px; color:#374151; }
.badge{ display:inline-block; font-size:12px; padding:2px 8px; border-radius:20px; margin-left:6px; }
.badge.red{ background:#fee2e2; color:var(--red);} .badge.green{ background:#d1fae5; color:var(--green);}

.search{ width:100%; max-width:420px; padding:10px 14px; border:1px solid var(--line); border-radius:8px; margin-bottom:16px; font-size:14px; }
.search:focus{ outline:none; border-color:var(--blue); }

.table-wrap{ overflow-x:auto; background:var(--card); border:1px solid var(--line); border-radius:10px; }
table{ width:100%; border-collapse:collapse; font-size:13px; min-width:800px; }
th,td{ padding:9px 12px; text-align:left; border-bottom:1px solid var(--line); white-space:nowrap; }
th{ background:#f9fafb; font-weight:600; color:var(--sub); }
tr:hover td{ background:#f9fafb; }
.right{ text-align:right; }
.money-red{ color:var(--red); font-weight:600; }

.follow-item{ background:var(--card); border:1px solid var(--line); border-radius:10px; padding:14px 16px; margin-bottom:10px; }
.follow-item .fh{ font-weight:700; margin-bottom:6px; }
.follow-item .fc{ font-size:13px; color:#374151; white-space:pre-line; }
.follow-item .fm{ font-size:12px; color:var(--sub); margin-top:6px; }

.jl{ background:var(--card); border:1px solid var(--line); border-radius:10px; padding:14px 16px; margin-bottom:8px; font-size:14px; }
.jl b{ color:var(--blue); }

.empty{ color:var(--sub); padding:30px; text-align:center; }
canvas{ width:100%; max-height:240px; }

/* ===== 登录页 ===== */
.login-wrap{ min-height:100vh; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#111827,#1e3a8a); }
.login-box{ background:#fff; padding:36px 34px 28px; border-radius:14px; width:340px; box-shadow:0 20px 50px rgba(0,0,0,.3); }
.logo-lg{ font-size:22px; font-weight:800; text-align:center; color:#1f2937; margin-bottom:6px; }
.login-sub{ font-size:13px; color:#6b7280; text-align:center; margin-bottom:22px; }
.login-box .search{ margin-bottom:4px; }
.login-lbl{ display:block; font-size:12px; color:#6b7280; margin:10px 0 4px; font-weight:600; }
.login-btn{ width:100%; margin-top:22px; padding:12px 0; font-weight:700; letter-spacing:4px; }
.login-msg{ text-align:center; margin-top:12px; font-size:13px; color:#ef4444; min-height:18px; }
.btn-primary{ background:#2563eb; color:#fff; border:none; padding:11px 0; border-radius:8px; font-size:15px; cursor:pointer; }
.btn-primary:hover{ background:#1d4ed8; }
.btn-ghost{ background:transparent; border:none; font-size:18px; cursor:pointer; color:#6b7280; }
.login-msg{ font-size:13px; color:#dc2626; margin-top:10px; text-align:center; min-height:18px; }

/* ===== 用户信息 ===== */
.user-chip{ padding:10px 18px; font-size:13px; color:#e5e7eb; border-bottom:1px solid #1f2937; }
.user-chip .role{ display:inline-block; background:#2563eb; color:#fff; font-size:11px; padding:1px 8px; border-radius:10px; margin-left:6px; }

/* ===== 弹窗 ===== */
.modal{ position:fixed; inset:0; background:rgba(0,0,0,.5); display:flex; align-items:center; justify-content:center; z-index:100; }
.modal-box{ background:#fff; border-radius:12px; width:90%; max-width:720px; max-height:85vh; display:flex; flex-direction:column; }
.modal-box.small{ max-width:360px; }
.modal-head{ display:flex; justify-content:space-between; align-items:center; padding:16px 20px; border-bottom:1px solid var(--line); font-weight:700; }
.modal-body{ padding:20px; overflow-y:auto; }
.modal-body .search{ margin-bottom:10px; }

/* ===== 表单 ===== */
.form label{ display:block; font-size:14px; color:#374151; margin-bottom:12px; }
.form input,.form select{ width:100%; padding:9px 12px; border:1px solid var(--line); border-radius:8px; margin-top:5px; font-size:14px; box-sizing:border-box; }
.form input:focus,.form select:focus{ outline:none; border-color:var(--blue); }
.form-row{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.form-row .search{ margin-bottom:10px; }

/* ===== 链路预算结果 ===== */
.lb-result{ font-size:14px; }
.lb-result .big{ font-size:24px; font-weight:800; color:var(--blue); margin:8px 0; }
.lb-result .row{ display:flex; justify-content:space-between; padding:7px 0; border-bottom:1px dashed var(--line); }
.lb-result .lbl2{ color:var(--sub); }
.lb-result .val{ font-weight:600; }
.lb-result .ok{ color:var(--green); }

/* ===== 资料查看 ===== */
.file-nav{ background:var(--card); border:1px solid var(--line); border-radius:8px; padding:10px 14px; margin-bottom:12px; font-size:13px; color:var(--sub); }
.file-nav a{ color:var(--blue); text-decoration:none; cursor:pointer; }
.file-item{ display:flex; align-items:center; gap:10px; padding:9px 12px; border-bottom:1px solid var(--line); cursor:pointer; font-size:14px; }
.file-item:hover{ background:#f9fafb; }
.file-item .fname{ flex:1; }
.file-item .fsize{ color:var(--sub); font-size:12px; }
.file-item .fbadge{ font-size:11px; color:var(--blue); border:1px solid var(--blue); border-radius:10px; padding:0 6px; }
.file-item .fdel{ background:none;border:none;font-size:14px;cursor:pointer;opacity:.45;padding:2px 4px;line-height:1; }
.file-item .fdel:hover{ opacity:1; }

/* ===== 客户详情摘要 ===== */
.sum-item{ margin-bottom:12px; padding:10px 12px; background:#f9fafb; border-radius:8px; border:1px solid var(--line); }
.sum-title{ font-weight:700; font-size:13px; color:var(--blue); margin-bottom:5px; }
.sum-body{ font-size:13px; color:#374151; line-height:1.7; white-space:pre-wrap; }

/* ===== 跟进记录日期分组 ===== */
.date-group{ font-size:14px; color:#374151; margin-bottom:10px; }
.follow-date{ display:flex; align-items:center; gap:10px; padding:10px 12px; border:1px solid var(--line); border-radius:8px; margin-bottom:6px; cursor:pointer; background:#fff; }
.follow-date:hover{ background:#f3f4f6; }
.fdate{ font-weight:700; color:var(--blue); min-width:90px; }
.fsum{ flex:1; font-size:13px; color:#6b7280; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fcount{ font-size:12px; color:#9ca3af; }
.farrow{ color:var(--blue); }
.follow-day{ padding:6px 4px 12px; }
.frow{ padding:10px 12px; border-left:3px solid var(--blue); background:#fbfdff; margin-bottom:8px; border-radius:0 8px 8px 0; font-size:13px; line-height:1.7; color:#374151; }
.frow .f-label{ display:inline-block; background:var(--blue); color:#fff; font-size:11px; border-radius:4px; padding:1px 6px; margin-right:6px; }

/* ===== 客户分页 ===== */
.pager{ display:flex; align-items:center; justify-content:center; gap:14px; margin-top:16px; padding-top:14px; border-top:1px solid var(--line); }
.page-btn{ padding:7px 16px; border:1px solid var(--blue); background:#fff; color:var(--blue); border-radius:6px; cursor:pointer; font-size:13px; }
.page-btn:hover:not([disabled]){ background:var(--blue); color:#fff; }
.page-btn[disabled]{ opacity:.4; cursor:not-allowed; }
.page-info{ font-size:13px; color:#6b7280; }

/* ===== 客户添加/编辑表单 ===== */
.fld{ display:block; font-size:12px; color:#6b7280; margin:12px 0 4px; font-weight:600; }
#custFormModal .search{ margin-bottom:2px; }

/* ===== 客户视图切换 ===== */
.view-btn{ padding:9px 16px; border:none; background:#fff; color:#6b7280; cursor:pointer; font-size:13px; }
.view-btn.active{ background:var(--blue); color:#fff; }
/* 表格模式：解除 grid，铺满容器 */
.cust-list.cust-table-mode{ display:block; }
.cust-list.cust-table-mode .table-wrap{ overflow-x:auto; background:var(--card); border:1px solid var(--line); border-radius:10px; }
.cust-table{ width:100%; min-width:900px; border-collapse:collapse; font-size:13px; table-layout:fixed; }
.cust-table th,.cust-table td{ overflow:hidden; text-overflow:ellipsis; }
.cust-table th{ background:#f8fafc; color:#6b7280; text-align:left; padding:10px 12px; font-size:12px; border-bottom:1px solid var(--line); white-space:nowrap; }
.cust-table td{ padding:9px 12px; border-bottom:1px solid var(--line); color:#374151; vertical-align:top; white-space:nowrap; }
.cust-table tr:hover{ background:#f3f6ff; }
.cust-table .fbadge{ font-size:10px; }
.cust-table .table-wrap{ overflow-x:auto; }

/* ===== 客户表格列宽拖动 ===== */
.cust-table th{ position:relative; user-select:none; }
.cust-table th .col-resize{ position:absolute; top:0; right:-5px; width:10px; height:100%; cursor:col-resize; z-index:2; }
.cust-table th .col-resize:hover{ background:rgba(37,99,235,.15); }
.cust-table td{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* ===== 合同文件管理 ===== */
.ct-group{ background:var(--card); border:1px solid var(--line); border-radius:10px; margin-bottom:14px; overflow:hidden; }
.ct-head{ display:flex; align-items:center; justify-content:space-between; padding:10px 14px; background:#f8fafc; border-bottom:1px solid var(--line); }
.ct-cust{ font-weight:700; color:var(--blue); font-size:14px; }
.ct-count{ font-size:12px; color:#9ca3af; }
.ct-item{ display:flex; align-items:center; gap:12px; padding:9px 14px; border-bottom:1px solid var(--line); }
.ct-item:last-child{ border-bottom:none; }
.ct-ic{ font-size:18px; }
.ct-name{ flex:1; font-size:13px; color:#374151; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ct-meta{ font-size:11px; color:#9ca3af; white-space:nowrap; }
.ct-actions{ display:flex; gap:4px; white-space:nowrap; }
.ct-suggest{ padding:8px 12px; cursor:pointer; font-size:13px; border:1px solid var(--line); border-radius:6px; margin-bottom:4px; background:#fff; }
.ct-suggest:hover{ background:var(--blue); color:#fff; }

/* ===== 客户卡片内嵌合同区块 ===== */
.ct-inline{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin-top:8px; font-size:12px; color:var(--blue); background:#eef4ff; border:1px dashed #c7d8ff; border-radius:6px; padding:5px 8px; }

/* ===== AI 分析 ===== */
.ana-toolbar{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:16px; }
.ana-lbl{ font-size:13px; color:#6b7280; font-weight:600; }
.ana-table{ width:100%; border-collapse:collapse; }
.ana-table th,.ana-table td{ padding:8px 10px; border-bottom:1px solid var(--line); font-size:13px; text-align:left; }
.ana-table th{ background:#f8fafc; color:#6b7280; font-weight:600; }
.ana-table .right{ text-align:right; }
.ana-table .money-red{ color:#ef4444; font-weight:600; }
.ana-table tr:hover td{ background:#f8fafc; }
.ana-insight{ margin-top:14px; padding:12px 14px; background:#eef4ff; border:1px solid #c7d8ff; border-radius:8px; color:#1e40af; font-size:13px; }
#page-analysis{ overflow-x:auto; }

/* AI分析卡片入口提示 */
.card-hint{ margin-top:8px; font-size:12px; color:#2563eb; font-weight:600; }

/* AI 分析结论 */
.ana-concl{ margin-top:20px; }
.ana-concl h3{ font-size:15px; color:#1f2937; margin-bottom:12px; }
.ac-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media(max-width:760px){ .ac-grid{ grid-template-columns:1fr; } }
.ac-box{ border-radius:10px; padding:14px 16px; font-size:13px; line-height:1.7; }
.ac-find{ background:#eef2ff; border:1px solid #c7d8ff; color:#1e3a8a; }
.ac-sugg{ background:#eefaf6; border:1px solid #bfe8d8; color:#14532d; }
.ac-t{ font-weight:700; margin-bottom:8px; font-size:14px; }
.ac-box ul{ margin:0; padding-left:18px; }
.ac-box li{ margin-bottom:6px; }
