/* ==========================================================================
   设计系统 — 现代效率工具风
   冷中性灰底 + 单一暖橙强调色；细描边代替厚重阴影；语义色只用于数字与状态。
   ========================================================================== */
:root{
  /* 品牌强调色（全局唯一强调色） */
  --primary:#E2663A; --primary-hover:#CC5A31; --primary-active:#B44E28;
  --primary-weak:#FDF1EB; --primary-light:#F08A5F;
  /* 语义色：仅用于数字、状态与危险操作 */
  --danger:#D64545; --danger-weak:#FDF2F2; --danger-light:#E37373;
  --ok:#1F9254; --ok-weak:#EDF7F1; --ok-light:#4FB07C;
  --warn:#B7791F; --warn-weak:#FCF6E8; --warn-light:#D9A23F;
  --info:#2C6FD1; --info-light:#5E93E0;
  --purple:#6D4FD1; --purple-weak:#F3F0FD;
  /* 背景与表面 */
  --bg:#F5F6F8; --card:#FFFFFF; --cream:#FFFFFF;
  --soft:#F8F9FB; --soft-2:#F2F4F7; --soft-3:#FAFBFC; --peach:#FDF1EB;
  --bg-soft:#F6F7F9; --input-bg:#FFFFFF; --hover:#F1F3F6;
  --sidebar-bg:#FFFFFF; --sidebar-text:#5B6371;
  /* 描边与分隔线 */
  --line:#E4E7EC; --line-soft:#EFF1F4; --line-dash:#E8EAEE; --line-warm:#E4E7EC;
  --line-strong:#D7DBE2; --line-hover:#C2C8D2; --line-hover-warm:#C2C8D2;
  --credential-line:#E4E7EC; --credential-bg-1:#FFFFFF; --credential-bg-2:#FFFFFF;
  /* 文字 */
  --text:#14161A; --muted:#5B6371; --light:#8B93A1;
  /* 排行名次 */
  --silver-1:#98A1AE; --silver-2:#98A1AE; --bronze-1:#B0763F; --bronze-2:#B0763F;
  /* 云端同步状态徽标 */
  --sync-ok-bg:#EDF7F1; --sync-ok-line:#C6E6D4; --sync-ok-text:#14603A;
  --sync-busy-bg:#EEF3FC; --sync-busy-line:#C6D8F5; --sync-busy-text:#1F4FA8;
  --sync-warn-bg:#FCF6E8; --sync-warn-line:#EBD9A8; --sync-warn-text:#7A5310;
  --sync-off-bg:#F2F4F7; --sync-off-line:#E4E7EC; --sync-off-text:#5B6371;
  /* 提示条 */
  --warn-line:#EBD9A8; --warn-text:#7A5310;
  /* 阴影（克制）+ 圆角 */
  --shadow-sm:0 1px 2px rgba(16,24,40,.04);
  --shadow-card:0 1px 2px rgba(16,24,40,.04);
  --shadow-card-hover:0 2px 8px rgba(16,24,40,.07);
  --shadow-popover:0 10px 30px rgba(16,24,40,.12);
  --radius:10px; --radius-sm:6px; --radius-lg:12px; --radius-xs:4px;
  --ring:0 0 0 3px rgba(226,102,58,.14);
}
*{margin:0;padding:0;box-sizing:border-box;}
html,body{height:100%;}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",system-ui,sans-serif;background:var(--bg);color:var(--text);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;}
.hidden{display:none !important;}
button{cursor:pointer;font-family:inherit;}
input,select,textarea{font-family:inherit;}
:focus-visible{outline:2px solid var(--primary);outline-offset:1px;}

/* ===== 登录页 ===== */
.login-wrap{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:var(--bg);overflow:hidden;}
.login-wrap::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 50% at 50% 0%,rgba(226,102,58,.07),transparent 70%);}
.login-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-lg);padding:32px 28px;width:380px;box-shadow:0 1px 2px rgba(16,24,40,.04),0 12px 32px rgba(16,24,40,.06);position:relative;z-index:1;animation:cardUp .28s ease;}
@keyframes cardUp{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
.login-logo{width:48px;height:48px;margin:0 auto;border-radius:var(--radius);background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(226,102,58,.28);}
.login-logo svg{width:24px;height:24px;}
.login-card h1{text-align:center;font-size:19px;margin:16px 0 4px;font-weight:650;letter-spacing:-.01em;}
.login-sub{text-align:center;color:var(--light);font-size:12px;margin-bottom:24px;}
.form-item{margin-bottom:14px;}
.form-item label{display:block;font-size:12px;font-weight:500;color:var(--muted);margin-bottom:6px;}
.form-item label .req{color:var(--danger);margin-left:2px;}
.form-item input,.form-item select,.form-item textarea{width:100%;min-height:34px;padding:6px 10px;border:1px solid var(--line);border-radius:var(--radius-sm);font-size:13px;outline:none;background:var(--input-bg);color:var(--text);transition:border-color .15s,box-shadow .15s;}
.form-item input:hover,.form-item select:hover,.form-item textarea:hover{border-color:var(--line-hover);}
.form-item input:focus,.form-item select:focus,.form-item textarea:focus{border-color:var(--primary);box-shadow:var(--ring);}
.form-item input:disabled,.form-item select:disabled{background:var(--soft-2);color:var(--light);cursor:not-allowed;}
.form-item textarea{resize:vertical;min-height:64px;padding:8px 10px;}
/* 可搜索客户下拉 */
.cust-picker{position:relative;}
.cust-picker-list{position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:60;max-height:240px;overflow-y:auto;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-popover);padding:4px;}
.cust-picker-list .cp-item{padding:7px 9px;border-radius:var(--radius-sm);font-size:13px;color:var(--text);cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;white-space:nowrap;}
.cust-picker-list .cp-item span:first-child{overflow:hidden;text-overflow:ellipsis;}
.cust-picker-list .cp-item:hover,.cust-picker-list .cp-item.active{background:var(--primary-weak);color:var(--primary);}
.cust-picker-list .cp-sub{color:var(--light);font-size:12px;flex-shrink:0;}
.cust-picker-list .cp-empty{padding:12px;font-size:13px;color:var(--light);text-align:center;}
.login-err{background:var(--danger-weak);color:var(--danger);border:1px solid #F5D5D5;border-radius:var(--radius-sm);padding:8px 10px;font-size:12px;margin-bottom:12px;}
.login-tip{text-align:center;color:var(--light);font-size:12px;margin-top:16px;}

/* ===== 按钮：扁平克制 ===== */
.btn{border:1px solid transparent;border-radius:var(--radius-sm);height:34px;padding:0 14px;font-size:13px;font-weight:500;display:inline-flex;align-items:center;justify-content:center;gap:5px;transition:background .15s,border-color .15s,color .15s;white-space:nowrap;}
.btn:disabled{opacity:.45;cursor:not-allowed;}
.btn-primary{background:var(--primary);color:#fff;box-shadow:0 1px 2px rgba(226,102,58,.24);}
.btn-primary:hover:not(:disabled){background:var(--primary-hover);}
.btn-primary:active:not(:disabled){background:var(--primary-active);}
.btn-danger{background:var(--danger);color:#fff;box-shadow:0 1px 2px rgba(214,69,69,.2);}
.btn-danger:hover:not(:disabled){filter:brightness(1.07);}
.btn-ghost{background:var(--card);border-color:var(--line);color:var(--muted);}
.btn-ghost:hover:not(:disabled){border-color:var(--line-hover);color:var(--text);background:var(--soft);}
.btn-sm{height:28px;padding:0 10px;font-size:12px;border-radius:var(--radius-sm);}
.btn-block{width:100%;height:40px;font-size:14px;}

/* ===== 布局外壳 ===== */
.app{display:flex;height:100vh;overflow:hidden;}
.sidebar{width:224px;background:var(--sidebar-bg);display:flex;flex-direction:column;flex-shrink:0;border-right:1px solid var(--line);overflow:hidden;}
.brand{display:flex;align-items:center;gap:10px;padding:0 14px;height:56px;border-bottom:1px solid var(--line);flex-shrink:0;}
.brand-mark{width:28px;height:28px;border-radius:8px;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.brand-mark svg{width:16px;height:16px;}
.brand-text{display:flex;flex-direction:column;min-width:0;line-height:1.25;}
.brand-text b{font-size:13px;font-weight:650;color:var(--text);letter-spacing:-.01em;white-space:nowrap;}
.brand-text em{font-style:normal;font-size:10px;color:var(--light);letter-spacing:.07em;text-transform:uppercase;white-space:nowrap;}
.nav-menu{padding:10px 8px 14px;flex:1;overflow-y:auto;}
.nav-group + .nav-group{margin-top:14px;}
.nav-group-label{padding:0 10px 6px;font-size:10.5px;font-weight:650;color:var(--light);letter-spacing:.09em;text-transform:uppercase;}
.nav-item{width:100%;border:0;background:transparent;font-family:inherit;padding:0 10px;height:34px;font-size:13px;cursor:pointer;display:flex;align-items:center;gap:9px;color:var(--sidebar-text);border-radius:var(--radius-sm);margin-bottom:1px;transition:background .13s,color .13s;font-weight:500;text-align:left;}
.nav-item:hover{background:var(--hover);color:var(--text);}
.nav-item.active{background:var(--primary-weak);color:var(--primary);font-weight:600;}
.nav-item .ico{opacity:.7;}
.nav-item:hover .ico,.nav-item.active .ico{opacity:1;}
.nav-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ico{width:16px;height:16px;flex-shrink:0;display:block;}
.sidebar-foot{margin-top:auto;padding:12px;border-top:1px solid var(--line);display:flex;align-items:center;gap:9px;flex-shrink:0;}
.su-avatar{width:28px;height:28px;border-radius:50%;background:var(--soft-2);color:var(--muted);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:650;flex-shrink:0;}
.su-main{min-width:0;display:flex;flex-direction:column;line-height:1.35;}
.su-main b{font-size:12.5px;font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.su-main em{font-style:normal;font-size:11px;color:var(--light);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.main{flex:1;display:flex;flex-direction:column;min-width:0;}
.topbar{height:56px;background:var(--card);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 20px;gap:12px;flex-shrink:0;}
.page-head{min-width:0;flex:1;}
.page-title{font-size:15px;font-weight:650;color:var(--text);letter-spacing:-.01em;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.page-sub{font-size:12px;color:var(--light);line-height:1.3;margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.topbar-right{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.user-badge{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);padding-right:10px;margin-right:2px;border-right:1px solid var(--line);}
.user-badge b{color:var(--text);font-weight:600;}
.avatar{width:24px;height:24px;border-radius:50%;background:var(--primary-weak);color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0;}
.role-tag{display:inline-block;font-size:11px;padding:1px 7px;border-radius:var(--radius-xs);background:var(--primary-weak);color:var(--primary);font-weight:600;}
.role-tag.sales{background:var(--soft-2);color:var(--muted);}
.view-root{flex:1;overflow-y:auto;padding:20px;background:var(--bg);}

/* ===== 卡片 ===== */
.card{background:var(--card);border-radius:var(--radius);padding:16px;border:1px solid var(--line);margin-bottom:12px;}
.card-title{font-size:14px;font-weight:650;margin-bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;color:var(--text);letter-spacing:-.01em;}
.card-title>span{display:inline-flex;align-items:center;gap:7px;}
.card-title .ico{color:var(--light);}
.card-desc{margin:0 0 12px;font-size:12px;color:var(--light);line-height:1.85;}
.btn-row{display:flex;gap:10px;flex-wrap:wrap;}
.tip-banner{display:flex;align-items:flex-start;gap:9px;background:var(--soft);border:1px solid var(--line);border-radius:var(--radius-sm);padding:11px 14px;font-size:13px;color:var(--muted);line-height:1.8;margin-bottom:12px;}
.tip-banner>.ico{margin-top:3px;color:var(--light);}

/* ===== 统计卡（销售人员页）：中性表面 + 语义数字 ===== */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(174px,1fr));gap:10px;margin-bottom:12px;}
.stat-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px;position:relative;overflow:hidden;transition:border-color .15s;min-width:0;}
.stat-card:hover{border-color:var(--line-hover);}
.stat-card::before,.stat-card::after{display:none;}
.stat-card .s-head{display:flex;align-items:center;gap:8px;min-width:0;}
.stat-card .s-icon{width:24px;height:24px;border-radius:var(--radius-xs);background:var(--soft-2);color:var(--muted);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;}
.stat-card .s-icon .ico{width:14px;height:14px;}
.stat-card .s-label{color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.stat-card .s-value{font-size:23px;font-weight:700;margin-top:8px;color:var(--text);letter-spacing:-.022em;font-variant-numeric:tabular-nums;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.stat-card .s-value.danger{color:var(--danger);}
.stat-card .s-sub{font-size:11.5px;color:var(--light);margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.stat-card.alert .s-icon{background:var(--danger-weak);color:var(--danger);}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 14px;}

/* ===== 数据总览：主 KPI / 细条指标带 / 轻量筛选条 / 双栏 ===== */
/* 主 KPI：核心指标（收款）独占视觉主体 */
.kpi-hero{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.5fr);background:var(--card);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:12px;overflow:hidden;}
.hero-main{padding:16px 18px;display:flex;flex-direction:column;justify-content:center;min-width:0;}
.hero-label{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12.5px;font-weight:600;color:var(--muted);}
.hero-value{margin-top:8px;font-size:34px;font-weight:750;line-height:1.12;letter-spacing:-.032em;color:var(--primary);font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.hero-sub{margin-top:7px;font-size:12px;color:var(--light);}
.hero-sub b{color:var(--muted);font-weight:650;font-variant-numeric:tabular-nums;}
/* 细条指标带：次要指标降级为紧凑单元 */
.metric-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:var(--soft-3);border-left:1px solid var(--line-soft);}
.metric-item{padding:14px 16px;display:flex;flex-direction:column;justify-content:center;gap:2px;min-width:0;}
.metric-item+.metric-item{border-left:1px solid var(--line-soft);}
.metric-item .m-label{font-size:11.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.metric-item .m-value{font-size:19px;font-weight:700;line-height:1.25;letter-spacing:-.02em;color:var(--text);font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.metric-item .m-sub{font-size:11px;color:var(--light);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.metric-item.alert .m-value{color:var(--danger);}

/* 日期筛选条：轻量条带（无卡片留白，控件降一档） */
.dash-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:var(--soft-3);border:1px solid var(--line-soft);border-radius:var(--radius);padding:8px 12px;margin-bottom:12px;}
.dash-bar-label{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--muted);}
.dash-bar-label .ico{color:var(--light);}
.dash-bar .chip-line{gap:4px;}
.dash-bar .chip{height:26px;padding:0 10px;font-size:12px;}
.dash-bar input,.dash-bar select{height:28px;padding:0 9px;border:1px solid var(--line);border-radius:var(--radius-sm);font-size:12.5px;outline:none;background:var(--input-bg);color:var(--text);transition:border-color .15s,box-shadow .15s;}
.dash-bar input:hover,.dash-bar select:hover{border-color:var(--line-hover);}
.dash-bar input:focus,.dash-bar select:focus{border-color:var(--primary);box-shadow:var(--ring);}
.dash-range{display:inline-flex;align-items:center;gap:6px;}
.dash-cols{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:12px;align-items:start;margin-bottom:12px;}
.dash-cols>.card,.dash-main>.card,.dash-side>.card{margin-bottom:0;min-width:0;}
.dash-main{display:flex;flex-direction:column;gap:12px;min-width:0;align-self:stretch;}
.dash-main>.card:last-child{flex-grow:1;}
.dash-side{display:flex;flex-direction:column;gap:12px;min-width:0;}
.dash-more{text-align:center;color:var(--light);font-size:12px;padding:10px 0 2px;}
.card .todo-row{margin:0 -8px;}
.todo-done{flex-shrink:0;height:26px;padding:0 9px;gap:5px;}
.todo-done .ico{width:13px;height:13px;}
.dash-log{cursor:default;}
.dash-log .todo-date{font-weight:400;color:var(--muted);}

/* ===== 工具栏 / 筛选 / 表格 ===== */
.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px;}
.toolbar .spacer{flex:1;}
.toolbar input,.toolbar select{height:32px;padding:0 10px;border:1px solid var(--line);border-radius:var(--radius-sm);font-size:13px;outline:none;background:var(--input-bg);color:var(--text);transition:border-color .15s,box-shadow .15s;}
.toolbar input:hover,.toolbar select:hover{border-color:var(--line-hover);}
.toolbar input:focus,.toolbar select:focus{border-color:var(--primary);box-shadow:var(--ring);}
/* 筛选栏：统一外观（浅底 + 细描边，控件与表格同密度） */
.filter-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px;margin-bottom:12px;background:var(--soft-3);border:1px solid var(--line);border-radius:var(--radius);}
.filter-bar .fb-label{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px 0 0;margin-right:2px;border-right:1px solid var(--line);color:var(--muted);font-size:12px;font-weight:600;white-space:nowrap;}
.filter-bar .fb-label .ico{width:14px;height:14px;color:var(--light);}
.filter-bar input,.filter-bar select{height:32px;padding:0 10px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--input-bg);color:var(--text);font-size:13px;outline:none;transition:border-color .15s,box-shadow .15s;}
.filter-bar select{padding-right:26px;}
.filter-bar input::placeholder{color:var(--light);}
.filter-bar input:hover,.filter-bar select:hover{border-color:var(--line-hover);}
.filter-bar input:focus,.filter-bar select:focus{border-color:var(--primary);box-shadow:var(--ring);}
.filter-bar .fb-sep{color:var(--light);font-size:12px;padding:0 1px;}
.filter-bar .fb-hint{color:var(--light);font-size:12px;white-space:nowrap;}
.filter-bar .fb-hint b{color:var(--text);}
/* 筛选控件固定宽度档位 */
.fw-2xs{width:74px;}
.fw-xs{width:104px;}
.fw-sm{width:136px;}
.fw-md{width:160px;}
.fw-lg{width:220px;}
.fw-xl{width:280px;}

/* 结果行：表格标题 + 计数 + 右侧操作 */
.list-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px;}
.list-head .lh-count{font-size:12.5px;color:var(--muted);}
.list-head .lh-count b{color:var(--text);font-weight:650;font-variant-numeric:tabular-nums;}
.list-head .spacer{flex:1;}
.list-note{margin-top:10px;font-size:12px;color:var(--light);line-height:1.7;}
.combo-wrap{position:relative;display:inline-flex;align-items:center;}
.combo-wrap input{padding-right:24px;}
.combo-wrap .combo-arrow{position:absolute;right:8px;top:50%;transform:translateY(-50%);color:var(--light);font-size:10px;pointer-events:auto;cursor:pointer;}
.table-wrap{overflow-x:auto;border-radius:var(--radius);}
table{width:100%;border-collapse:collapse;font-size:13px;}
th{background:var(--soft);text-align:left;padding:9px 12px;color:var(--muted);font-weight:600;border-bottom:1px solid var(--line);white-space:nowrap;font-size:11px;letter-spacing:.04em;text-transform:uppercase;}
td{padding:10px 12px;border-bottom:1px solid var(--line-soft);vertical-align:middle;color:var(--text);}
tbody tr{transition:background .12s;}
tbody tr:hover{background:var(--soft);}
tbody tr:last-child td{border-bottom:none;}
.credential-list{display:flex;flex-direction:column;gap:0;}
.credential-entry{min-height:32px;padding:6px 0;border-bottom:1px dashed var(--line-dash);display:flex;align-items:center;}
.credential-entry:last-child{border-bottom:none;}

/* 客户账号密码管理：密码列等宽字体 */
.credential-password .credential-entry{font-weight:600;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.02em;font-size:12.5px;}
th.th-money,td.td-money{text-align:right;}
th.th-ops,td.actions{text-align:right;}
td.actions{white-space:nowrap;}
td.actions .btn{margin-right:4px;}
td.actions .btn:last-child{margin-right:0;}
.col-check{width:36px;text-align:center;}
.col-check input{width:14px;height:14px;accent-color:var(--primary);cursor:pointer;vertical-align:middle;}
/* 行内操作：文字链接 + 图标，紧凑排列 */
.row-ops{display:inline-flex;align-items:center;gap:2px;justify-content:flex-end;}
.row-ops .link-btn{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;}
.row-ops .link-btn .ico{width:13px;height:13px;opacity:.75;}
.row-ops .link-btn:hover .ico{opacity:1;}
td.actions .row-ops .btn{margin:0;}
.td-strong{font-weight:600;}
.td-muted{color:var(--light);}
.td-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.5px;letter-spacing:.02em;}
.td-money{font-weight:600;color:var(--ok);font-variant-numeric:tabular-nums;}
.td-ellipsis{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.empty-tip{text-align:center;color:var(--light);padding:32px 0;font-size:13px;line-height:1.7;}
.empty-tip .ico{display:block;margin:0 auto 8px;width:22px;height:22px;opacity:.5;}
.link-name{color:var(--primary);cursor:pointer;font-weight:550;}
.link-name:hover{color:var(--primary-hover);text-decoration:underline;text-underline-offset:2px;}
.link-btn{border:none;background:transparent;color:var(--primary);font-size:12.5px;font-weight:550;cursor:pointer;padding:2px 6px;border-radius:var(--radius-xs);transition:background .15s;}
.link-btn:hover{background:var(--primary-weak);}
.link-btn.danger{color:var(--danger);}
.link-btn.danger:hover{background:var(--danger-weak);}

/* 徽标：小圆角、无装饰点 */
.badge{display:inline-flex;align-items:center;gap:4px;font-size:11px;padding:1px 7px;border-radius:var(--radius-xs);background:var(--soft-2);color:var(--muted);white-space:nowrap;font-weight:550;line-height:1.7;}
.badge::before{display:none;}
.badge.blue{background:var(--primary-weak);color:var(--primary);}
.badge.green{background:var(--ok-weak);color:var(--ok);}
.badge.orange{background:var(--warn-weak);color:var(--warn);}
.badge.red{background:var(--danger-weak);color:var(--danger);}
.badge.gray{background:var(--soft-2);color:var(--muted);}
.badge.purple{background:var(--purple-weak);color:var(--purple);}

/* chip：分段控件 */
.chip-line{display:flex;flex-wrap:wrap;gap:6px;}
.chip{display:inline-flex;align-items:center;height:28px;padding:0 11px;border-radius:var(--radius-sm);border:1px solid var(--line);background:var(--card);color:var(--muted);font-size:12.5px;font-weight:500;font-family:inherit;cursor:pointer;user-select:none;transition:background .15s,border-color .15s,color .15s;position:relative;}
.chip:focus-visible{outline:none;box-shadow:var(--ring);border-color:var(--primary);}
.chip input{position:absolute;opacity:0;width:0;height:0;pointer-events:none;}
.chip:hover{border-color:var(--line-hover);color:var(--text);}
.chip.on{background:var(--primary-weak);border-color:var(--primary);color:var(--primary);font-weight:600;}
.chip.on::after{content:'';display:none;}
.rule-tip{background:var(--soft);color:var(--muted);border:1px solid var(--line-soft);border-radius:var(--radius-sm);padding:8px 12px;font-size:12.5px;line-height:1.7;margin-bottom:12px;}
.bonus-green{color:var(--ok);font-variant-numeric:tabular-nums;}

/* 分页 */
.pager{display:flex;align-items:center;gap:10px;justify-content:flex-end;padding-top:12px;}
.pager-info{font-size:12px;color:var(--light);font-variant-numeric:tabular-nums;}

/* 排行 */
.rank-row{display:flex;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--line-soft);}
.rank-row:last-child{border-bottom:none;}
.rank-no{width:22px;height:22px;border-radius:var(--radius-xs);background:var(--soft-2);color:var(--muted);font-size:11px;display:flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0;font-variant-numeric:tabular-nums;}
.rank-no.top1{background:var(--primary);color:#fff;}
.rank-no.top2{background:var(--silver-1);color:#fff;}
.rank-no.top3{background:var(--bronze-1);color:#fff;}
.rank-main{flex:1;min-width:0;}
.rank-name{font-size:13px;display:flex;justify-content:space-between;gap:10px;margin-bottom:5px;}
.rank-name .r-money{color:var(--text);font-weight:650;font-variant-numeric:tabular-nums;}
.bar{height:6px;background:var(--soft-2);border-radius:3px;overflow:hidden;}
.bar i{display:block;height:100%;background:var(--primary);border-radius:3px;transition:width .4s ease;}
.bar i.zero{background:var(--line);}
/* 榜单限高：默认前 8 名，展开后在卡内滚动，避免人数增多把右栏撑高 */
.rank-scroll.open{max-height:min(50vh,400px);overflow-y:auto;margin-right:-6px;padding-right:6px;}
.rank-toggle{display:flex;align-items:center;justify-content:center;gap:5px;width:100%;margin-top:10px;padding:7px 0;border:1px solid var(--line-soft);background:var(--soft-3);border-radius:var(--radius-sm);font-family:inherit;font-size:12.5px;font-weight:600;color:var(--muted);cursor:pointer;transition:background .12s,color .12s,border-color .12s;}
.rank-toggle:hover{background:var(--soft);color:var(--text);border-color:var(--line-hover);}
.rank-toggle .ico{width:13px;height:13px;}
/* 近期收款（销售端=我的，管理员端=全公司并标注销售归属） */
.my-pay-row{display:flex;align-items:center;gap:10px;padding:9px 8px;border-bottom:1px solid var(--line-soft);font-size:13px;cursor:pointer;border-radius:var(--radius-sm);transition:background .12s;}
.my-pay-row:last-child{border-bottom:none;}
.my-pay-row:hover{background:var(--soft);}
.card .my-pay-row{margin:0 -8px;}
.my-pay-date{flex-shrink:0;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;}
.my-pay-cust{flex:0 1 auto;min-width:0;font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.my-pay-cust.grow{flex:1;}
.my-pay-remark{flex:1;min-width:0;color:var(--light);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.my-pay-owner{flex-shrink:0;max-width:96px;font-size:12px;font-weight:600;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.my-pay-amt{flex-shrink:0;font-weight:650;color:var(--primary);font-variant-numeric:tabular-nums;}
/* 左栏补高：卡片撑满左栏剩余高度，底部固定「查看全部」入口，
   这样「待跟进提醒」为空态时也不会在下方露出大片灰底 */
.my-pay-card{display:flex;flex-direction:column;}
.my-pay-list{min-height:0;}
.my-pay-foot{margin-top:auto;padding-top:10px;border-top:1px solid var(--line-soft);font-size:12.5px;text-align:right;}

/* 待跟进 / 行列表 */
.todo-row{display:flex;align-items:center;gap:10px;padding:9px 8px;border-bottom:1px solid var(--line-soft);font-size:13px;cursor:pointer;border-radius:var(--radius-sm);transition:background .12s;}
.todo-row:last-child{border-bottom:none;}
.todo-row:hover{background:var(--soft);}
.todo-date{flex-shrink:0;font-weight:600;font-variant-numeric:tabular-nums;}
.todo-date.overdue{color:var(--danger);}
.todo-content{flex:1;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* 弹窗（右侧抽屉） */
.modal-mask{position:fixed;inset:0;background:rgba(16,24,40,.32);display:flex;align-items:stretch;justify-content:flex-end;z-index:100;}
/* 宽度由 openModal 写入的 --modal-w 决定（不用行内 width，否则移动端断点无法覆盖） */
.modal-box{background:var(--card);width:var(--modal-w,560px);max-width:92vw;height:100%;max-height:100%;overflow-y:auto;padding:20px 24px;box-shadow:-12px 0 32px rgba(16,24,40,.12);animation:drawerIn .18s ease;}
.modal-box.drawer-sm{height:auto;max-height:86vh;align-self:center;border-radius:var(--radius-lg) 0 0 var(--radius-lg);}
.cloud-login-tip{font-size:12px;color:var(--light);text-align:center;margin-top:8px;}
.sync-badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:550;padding:2px 8px;border-radius:var(--radius-xs);background:var(--sync-ok-bg);border:1px solid var(--sync-ok-line);color:var(--sync-ok-text);white-space:nowrap;}
.sync-badge.sync-ok{background:var(--sync-ok-bg);border-color:var(--sync-ok-line);color:var(--sync-ok-text);}
.sync-badge.sync-busy{background:var(--sync-busy-bg);border-color:var(--sync-busy-line);color:var(--sync-busy-text);}
.sync-badge.sync-warn{background:var(--sync-warn-bg);border-color:var(--sync-warn-line);color:var(--sync-warn-text);}
.sync-badge.sync-offline{background:var(--sync-off-bg);border-color:var(--sync-off-line);color:var(--sync-off-text);}
@keyframes drawerIn{from{transform:translateX(20px);opacity:.6;}to{transform:none;opacity:1;}}
.modal-title{font-size:15px;font-weight:650;margin:-20px -24px 16px;padding:15px 24px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:8px;color:var(--text);background:var(--card);position:sticky;top:-20px;z-index:2;letter-spacing:-.01em;}
.modal-title>.ico{color:var(--light);}
.modal-close{border:none;background:transparent;width:26px;height:26px;border-radius:var(--radius-xs);font-size:13px;color:var(--light);margin-left:auto;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;}
.modal-close .ico{width:14px;height:14px;}
.modal-close:hover{background:var(--hover);color:var(--text);}
.modal-foot{position:sticky;bottom:-20px;display:flex;justify-content:flex-end;gap:8px;margin:16px -24px -20px;padding:12px 24px;background:var(--card);border-top:1px solid var(--line);z-index:2;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:0 14px;}
.confirm-msg{font-size:13.5px;line-height:1.7;padding:2px;word-break:break-all;color:var(--text);}

/* 弹窗内：横排字段、浅底面板、选项组 */
.inline-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:10px 0;}
.inline-row>b{font-size:12.5px;color:var(--muted);font-weight:600;}
.inline-row select,.inline-row input{height:32px;padding:0 10px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--input-bg);color:var(--text);font-size:13px;outline:none;transition:border-color .15s,box-shadow .15s;}
.inline-row select:hover,.inline-row input:hover{border-color:var(--line-hover);}
.inline-row select:focus,.inline-row input:focus{border-color:var(--primary);box-shadow:var(--ring);}
.panel{background:var(--soft);border:1px solid var(--line);border-radius:var(--radius-sm);padding:11px 13px;font-size:13px;color:var(--muted);line-height:1.8;}
.panel b{color:var(--text);font-weight:600;}
.panel-hint{font-size:12px;color:var(--light);margin-top:8px;line-height:1.7;}
.check-row{display:inline-flex;align-items:center;gap:6px;margin:4px 14px 4px 0;font-size:13px;color:var(--text);cursor:pointer;}
.check-row input[type=checkbox]{width:14px;height:14px;accent-color:var(--primary);cursor:pointer;}
.radio-card{display:flex;align-items:center;gap:8px;padding:9px 11px;margin:6px 0;background:var(--soft);border:1px solid var(--line);border-radius:var(--radius-sm);font-size:13px;cursor:pointer;transition:border-color .15s,background .15s;}
.radio-card:hover{border-color:var(--line-hover);background:var(--soft-2);}
.radio-card input{accent-color:var(--primary);cursor:pointer;}
.pick-list{margin:10px 0;max-height:260px;overflow:auto;}
.cell-input{height:32px;padding:0 8px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--input-bg);color:var(--text);font-size:13px;outline:none;transition:border-color .15s,box-shadow .15s;}
.cell-input:focus{border-color:var(--primary);box-shadow:var(--ring);}
.col-del{width:44px;text-align:right;}
.btn-icon{width:28px;height:28px;padding:0;display:inline-flex;align-items:center;justify-content:center;}
.btn-icon .ico{width:13px;height:13px;}
.num-xs{width:76px;height:30px;padding:0 8px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--input-bg);color:var(--text);font-size:13px;outline:none;transition:border-color .15s,box-shadow .15s;}
.num-xs:focus{border-color:var(--primary);box-shadow:var(--ring);}
.mb-0{margin-bottom:0;}
.card:last-child{margin-bottom:0;}
.d-note{margin-bottom:14px;}
.d-item.d-note .d-value{font-weight:400;color:var(--muted);}
.td-money.lg{font-size:15px;}

/* 客户详情 */
.detail-head{display:grid;grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:8px;margin-bottom:8px;}
.detail-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:10px 0 14px;}
.spacer{flex:1;}
.d-item{background:var(--soft);border:1px solid var(--line-soft);border-radius:var(--radius-sm);padding:9px 11px;}
.d-item .d-label{font-size:11px;color:var(--light);}
.d-item .d-value{font-size:13px;font-weight:600;margin-top:3px;word-break:break-all;color:var(--text);}
.d-item .d-value.money{color:var(--ok);font-size:18px;font-weight:700;font-variant-numeric:tabular-nums;}
.record-row{border:1px solid var(--line);border-radius:var(--radius-sm);padding:10px 12px;margin-bottom:8px;background:var(--card);transition:border-color .15s;}
.record-row:hover{border-color:var(--line-hover);}
.record-row .r-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;}
.record-row .r-time{color:var(--light);font-size:12px;}
.record-row .r-body{margin-top:6px;font-size:13px;color:var(--text);line-height:1.6;word-break:break-all;}
.record-row .r-foot{margin-top:8px;font-size:12px;color:var(--light);display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;}
.record-row .r-foot .r-ops{display:inline-flex;align-items:center;gap:2px;}
.record-row .r-foot .r-ops .link-btn{display:inline-flex;align-items:center;gap:4px;}
.record-row .r-foot .r-ops .link-btn .ico{width:13px;height:13px;opacity:.75;}
.record-row .r-foot .r-ops .link-btn:hover .ico{opacity:1;}

/* Tabs：下划线式 */
.tabs{display:flex;gap:20px;margin-bottom:12px;flex-wrap:wrap;border-bottom:1px solid var(--line);}
.tab{padding:0 0 9px;display:inline-flex;align-items:center;font-size:13px;font-weight:500;cursor:pointer;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .15s,border-color .15s;}
.tab:hover{color:var(--text);}
.tab.active{color:var(--primary);border-bottom-color:var(--primary);font-weight:600;}

/* Toast */
#toastWrap{position:fixed;top:16px;left:50%;transform:translateX(-50%);z-index:200;display:flex;flex-direction:column;gap:8px;align-items:center;}
.toast{background:var(--text);color:#fff;min-height:34px;padding:0 16px;display:flex;align-items:center;border-radius:var(--radius-sm);font-size:13px;box-shadow:var(--shadow-popover);animation:toastIn .18s;max-width:80vw;}
.toast.ok{background:#14603A;}
.toast.err{background:var(--danger);}
@keyframes toastIn{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:none;}}

/* 备份页 */
.backup-tip{background:var(--warn-weak);border:1px solid var(--warn-line);border-radius:var(--radius-sm);padding:11px 14px;font-size:13px;color:var(--warn-text);line-height:1.8;margin-bottom:12px;}
.storage-line{font-size:13px;color:var(--muted);margin:8px 0 14px;}

/* 滚动条 */
.view-root::-webkit-scrollbar,.nav-menu::-webkit-scrollbar,.modal-box::-webkit-scrollbar{width:8px;height:8px;}
.view-root::-webkit-scrollbar-thumb,.nav-menu::-webkit-scrollbar-thumb,.modal-box::-webkit-scrollbar-thumb{background:rgba(139,147,161,.32);border-radius:4px;border:2px solid transparent;background-clip:content-box;}
.view-root::-webkit-scrollbar-thumb:hover,.nav-menu::-webkit-scrollbar-thumb:hover,.modal-box::-webkit-scrollbar-thumb:hover{background:rgba(139,147,161,.55);background-clip:content-box;}
.view-root::-webkit-scrollbar-track,.nav-menu::-webkit-scrollbar-track,.modal-box::-webkit-scrollbar-track{background:transparent;}

/* ===== 响应式 =====
   断点必须放在基础规则之后，否则同优先级的基础规则会覆盖断点内的声明。
   顺序：1100 → 1024 → 900 → 768 → 390（窄屏在后，保证窄屏规则最终生效）。 */
.mobile-menu-btn,.nav-mask{display:none;}

/* 平板横向 / 小笔记本：双栏收缩为单栏 */
@media (max-width:1100px){
  .two-col{grid-template-columns:1fr;}
  .dash-cols{grid-template-columns:1fr;}
}

/* 平板：侧栏收窄、留白收紧、统计卡与筛选栏降一档 */
@media (max-width:1024px){
  .sidebar{width:196px;}
  .view-root{padding:16px 14px;}
  .stat-grid{grid-template-columns:repeat(auto-fit,minmax(156px,1fr));gap:10px;}
  .stat-card{padding:12px 14px;}
  .stat-card .s-value{font-size:21px;}
  .hero-main{padding:15px 16px;}
  .hero-value{font-size:30px;}
  .metric-item{padding:13px 14px;}
  .filter-bar{padding:9px 10px;}
  .fw-xl{width:200px;}
  .fw-lg{width:180px;}
}

/* 窄屏笔记本：主 KPI 与指标带改为上下堆叠 */
@media (max-width:900px){
  .kpi-hero{grid-template-columns:1fr;}
  .metric-strip{border-left:0;border-top:1px solid var(--line-soft);}
}

/* 手机：侧栏抽屉化、筛选栏整行排布、弹窗改底部抽屉 */
@media (max-width:768px){
  body{font-size:13px;overflow:hidden;}
  .app{height:100dvh;}
  .sidebar{position:fixed;z-index:100;inset:0 auto 0 0;width:min(78vw,280px);transform:translateX(-105%);box-shadow:var(--shadow-popover);transition:transform .22s ease;}
  .sidebar.is-open{transform:translateX(0);}
  .nav-mask{display:block;position:fixed;z-index:90;inset:0;background:rgba(16,24,40,.3);opacity:0;transition:opacity .2s;}
  .nav-mask.is-open{opacity:1;}
  .main{width:100%;min-width:0;}
  .topbar{height:54px;padding:0 12px;gap:8px;}
  .page-sub{display:none;}
  .mobile-menu-btn{display:flex;width:32px;height:32px;flex-direction:column;justify-content:center;align-items:center;gap:4px;border:0;border-radius:var(--radius-sm);background:var(--soft-2);flex-shrink:0;}
  .mobile-menu-btn span{display:block;width:15px;height:1.5px;border-radius:2px;background:var(--text);}
  .page-title{font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .topbar-right{margin-left:auto;gap:4px;}
  .user-badge{display:none;}
  .topbar-right .btn{padding:0 9px;}
  .view-root{padding:12px 10px 20px;}
  .card{padding:12px 10px;margin-bottom:10px;border-radius:var(--radius-sm);}
  .card-title{margin-bottom:10px;}
  .stat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:10px;}
  .stat-card{padding:11px 12px;border-radius:var(--radius-sm);}
  .stat-card .s-icon{display:none;}
  .stat-card .s-value{font-size:19px;margin-top:4px;}
  .stat-card .s-sub{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  /* 数据总览：指标带转为「标签 — 值」纵向列表，筛选条控件不再溢出 */
  .kpi-hero{border-radius:var(--radius-sm);margin-bottom:10px;}
  .hero-main{padding:13px 13px;}
  .hero-value{font-size:26px;margin-top:6px;}
  .hero-sub{font-size:11px;margin-top:5px;}
  .metric-strip{grid-template-columns:1fr;}
  .metric-item{flex-direction:row;align-items:baseline;gap:8px;padding:9px 13px;}
  .metric-item+.metric-item{border-left:0;border-top:1px solid var(--line-soft);}
  .metric-item .m-label{flex:1 1 auto;font-size:12px;}
  .metric-item .m-value{font-size:15px;}
  .metric-item .m-sub{flex:0 1 auto;text-align:right;}
  .dash-bar{padding:7px 10px;gap:7px;border-radius:var(--radius-sm);margin-bottom:10px;}
  .dash-bar .chip{height:26px;padding:0 9px;}
  .dash-bar input,.dash-bar select{max-width:100%;min-width:0;height:30px;}
  /* 我的近期收款：窄屏隐藏备注，保证客户名与金额不被挤压 */
  .my-pay-row{gap:8px;padding:9px 6px;font-size:12.5px;}
  .my-pay-remark{display:none;}
  .my-pay-amt{margin-left:auto;}
  /* 筛选栏：所有控件各占整行，触控目标更大、折行更可预期 */
  .toolbar,.filter-bar{gap:8px;margin-bottom:10px;}
  .filter-bar{padding:9px 10px;align-items:stretch;}
  .filter-bar .fb-label{width:100%;height:22px;margin:0;padding:0;border-right:0;}
  .filter-bar .fb-hint{white-space:normal;}
  .toolbar input,.toolbar select,.filter-bar input,.filter-bar select,.filter-bar .combo-wrap{max-width:100%;min-width:0;}
  .filter-bar input,.filter-bar select,.filter-bar .combo-wrap,
  .fw-2xs,.fw-xs,.fw-sm,.fw-md,.fw-lg,.fw-xl{flex:1 1 100%;width:auto;}
  .filter-bar .combo-wrap input{flex:1 1 auto;width:100%;}
  .list-head{gap:8px;}
  .list-head .lh-count{flex:1 1 100%;}
  .toolbar .spacer{display:none;}
  .table-wrap{margin:0 -2px;border-radius:var(--radius-sm);}
  table{min-width:760px;}
  th{padding:9px 10px;}
  td{padding:9px 10px;}
  .modal-mask{padding:0;align-items:flex-end;justify-content:center;}
  .modal-box{width:100%;max-width:100%;height:auto;max-height:92dvh;border-radius:var(--radius-lg) var(--radius-lg) 0 0;align-self:flex-end;padding:16px 16px;}
  .modal-box.drawer-sm{align-self:flex-end;border-radius:var(--radius-lg);max-height:86dvh;}
  .modal-title{margin:-16px -16px 14px;padding:14px 16px;top:-16px;}
  .modal-foot{margin:14px -16px -16px;padding:12px 16px;bottom:-16px;}
  .form-row,.form-grid,.two-col{grid-template-columns:1fr;gap:0;}
  .login-card{width:calc(100% - 28px);padding:26px 20px;border-radius:var(--radius);}
  .login-logo{width:44px;height:44px;font-size:22px;}
}

/* 小屏手机 */
@media (max-width:390px){
  .stat-grid{grid-template-columns:1fr;}
  .hero-value{font-size:23px;}
  .metric-item{padding:8px 12px;}
  .page-title{font-size:14px;}
  .topbar-right .btn{font-size:12px;padding:0 8px;}
}
