/* 绵阳易厚科技 财务管理系统 v2 */
:root{
  --navy:#0E2A47; --accent:#00A8B5; --bg:#f2f5f8; --line:#dde4ec;
  --red:#d93026; --green:#188038; --amber:#b58105;
}
*{box-sizing:border-box; margin:0; padding:0}
/* 禁用移动端字体自动放大(切页面后忽大忽小) */
html{-webkit-text-size-adjust:100%; text-size-adjust:100%}
body{font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif; background:var(--bg); color:#22303e; font-size:14px}
.topbar{background:var(--navy); color:#fff; display:flex; align-items:center; gap:18px; padding:0 18px; height:52px; flex-wrap:wrap}
.topbar .brand{font-weight:700; font-size:16px; white-space:nowrap}
.topbar .brand small{color:#9db8d4; font-weight:400; margin-left:6px}
.topbar nav{display:flex; gap:2px; flex:1; flex-wrap:wrap}
.topbar nav a{color:#c9d8e8; text-decoration:none; padding:6px 10px; border-radius:6px; white-space:nowrap}
.topbar nav a:hover{background:#1d4466}
.topbar nav a.on{background:var(--accent); color:#fff; font-weight:600}
.topbar .who{color:#9db8d4; font-size:13px}
main{padding:16px; max-width:1400px; margin:0 auto}
h1.pg{margin:4px 0 14px; font-size:20px; display:flex; align-items:center; gap:12px; flex-wrap:wrap}
h1.pg small{color:#6a7d90; font-weight:400; font-size:13px}
h2{font-size:15px; margin-bottom:10px; display:flex; justify-content:space-between; align-items:center; gap:8px}
h2 a{font-size:12px}
.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:10px; margin-bottom:14px}
.card{background:#fff; border:1px solid var(--line); border-radius:10px; padding:12px 14px}
.card .k{color:#6a7d90; font-size:12px; margin-bottom:6px}
.card .v{font-size:20px; font-weight:700}
.card .v small{font-size:12px; color:#6a7d90; font-weight:400}
.card .v.ok{color:var(--green)}
.card.warn{border-color:#f2d3a0}
.money{font-variant-numeric:tabular-nums}
.grid2{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:12px}
@media(max-width:900px){.grid2{grid-template-columns:1fr}}
.tbl{width:100%; border-collapse:collapse; font-size:13px}
.tbl th{background:#eef3f8; text-align:left; padding:7px 8px; border-bottom:2px solid var(--line); white-space:nowrap}
.tbl td{padding:6px 8px; border-bottom:1px solid #eef1f5; vertical-align:top; word-break:break-word}
.tbl tr.total td{background:#eef7f7; font-weight:700; border-top:2px solid var(--accent)}
.tbl td.m, .tbl th.m{text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap}
.tbl td.code{white-space:nowrap}
.tbl tr:hover td{background:#f7fafd}
.red{color:var(--red); font-weight:600}
.green{color:var(--green)}
.amber{color:var(--amber)}
tr.red td{background:#fdf1f0}
tr.amber td{background:#fdf9ee}
.empty{text-align:center; color:#93a5b6; padding:18px !important}
small{color:#6a7d90}
.hint{color:#8a9bad; font-size:12px; margin-top:10px}
.dim{color:#8a9bad; font-size:12px}
.table-wrap{overflow-x:auto}
.op{white-space:nowrap; width:120px}
.op .inline{display:inline}
/* 按钮 */
.btn{display:inline-block; background:#eef3f8; color:#22303e; border:1px solid var(--line);
  border-radius:6px; padding:6px 12px; text-decoration:none; font-size:13px; cursor:pointer}
.btn:hover{background:#e2eaf2}
.btn.primary{background:var(--accent); border-color:var(--accent); color:#fff; font-weight:600}
.btn.primary:hover{background:#00919c}
.btn.danger{color:var(--red); border-color:#f3c9c5}
.btn.danger:hover{background:#fdf1f0}
.btn.sm{padding:3px 8px; font-size:12px}
.btn.block{display:block; width:100%; padding:10px; font-size:15px}
/* 表单 */
.filter{display:flex; gap:8px; margin-bottom:12px; flex-wrap:wrap; align-items:center}
.filter input[type=search]{flex:1; min-width:180px}
input,select,textarea{font:inherit; padding:8px 10px; border:1px solid #c9d4e0; border-radius:6px; background:#fff; width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid #a5e3e8; border-color:var(--accent)}
.filter input,.filter select{width:auto; padding:6px 10px}
label{display:block; margin-bottom:12px; color:#41586d; font-size:13px}
label b.req{color:var(--red)}
.form-card{max-width:640px}
.form-card label input,.form-card label select,.form-card label textarea{margin-top:5px}
.form-actions{display:flex; gap:10px; margin-top:6px}
.stack label{margin-bottom:12px}
.login-wrap{display:flex; justify-content:center; align-items:center; min-height:70vh}
.login{max-width:340px; width:100%; padding:26px}
.login h1{font-size:20px; text-align:center; margin-bottom:4px}
.login .sub{text-align:center; color:#6a7d90; font-size:13px; margin-bottom:16px}
.flash{padding:9px 12px; border-radius:8px; margin-bottom:10px; font-size:13px}
.flash.ok{background:#e7f4ea; color:var(--green); border:1px solid #bfe3c8}
.flash.err{background:#fdf1f0; color:var(--red); border:1px solid #f3c9c5}
.foot{text-align:center; color:#93a5b6; font-size:12px; padding:18px 0 26px}
ul.plain{list-style:none}
ul.plain li{padding:7px 0; border-bottom:1px dashed var(--line)}
code{background:#eef3f8; padding:1px 6px; border-radius:4px}
/* 财务系统 v2 增强 */
.filter.yr{display:inline-flex; margin:0; margin-left:auto}
.tbl th.no,.tbl td.no{width:auto; text-align:center; color:#6a7d90; font-variant-numeric:tabular-nums; white-space:nowrap}
tr.grp td{background:#eaf1f8; color:#0E2A47; font-weight:700; padding:6px 10px; border-top:2px solid #c8d8e8}
.op .quick{margin-top:5px; padding-top:5px; border-top:1px dashed var(--line); white-space:nowrap; font-size:12px}
.op .quick a{color:var(--accent); text-decoration:none; margin-right:7px}
.op .quick a:hover{text-decoration:underline}
/* 发票: 销项=橙色系 进项=蓝色系 */
tr.sale td{background:#fff7ec}
tr.buy td{background:#eef5fd}
.badge{display:inline-block; padding:1px 8px; border-radius:10px; font-size:12px; white-space:nowrap}
.badge.sale-b{background:#fde8c8; color:#9a5b00; border:1px solid #f7cf93}
.badge.buy-b{background:#d6e9fb; color:#1a5f9e; border:1px solid #b3d5f5}
.sale-t{color:#9a5b00}
.buy-t{color:#1a5f9e}
td.sale-t{font-weight:600}
td.buy-t{font-weight:600}
/* 项目序号徽标 */
.pno{display:inline-block; background:#0E2A47; color:#fff; font-size:11px; padding:0 6px; border-radius:8px; margin-right:5px; white-space:nowrap; font-variant-numeric:tabular-nums}
td.code .pno{vertical-align:middle}
td.no .pno{margin-right:0; font-size:10px; padding:0 5px}
.btn.ok{background:#188038; border-color:#188038; color:#fff}
.btn.ok:hover{background:#146b2e}
.btn.exp{background:#fff; border:1px solid #0E2A47; color:#0E2A47}
.btn.exp:hover{background:#0E2A47; color:#fff}
/* 利润表紧凑 */
.profit .tbl.prof td, .profit .tbl.prof th{font-size:12px; padding:5px 6px; white-space:nowrap}
.profit .tbl.prof td:nth-child(2){white-space:normal; min-width:120px}
.profit h1 .btn.exp{margin-left:auto}
@media(max-width:720px){
  .topbar{height:auto; padding:8px 10px; gap:8px}
  .topbar nav a{padding:5px 7px; font-size:13px}
  main{padding:10px}
  .tbl{font-size:12px}
}

/* 应收/应付: 同项目多笔合并展示 */
tr.merge-row td{background:#eef6fb; font-weight:600; border-top:2px solid #b9d7ea; cursor:pointer}
tr.merge-row:hover td{background:#e2f0f9}
tr.merge-row.open td{background:#e2f0f9}
tr.merge-row td.op .merge-x{color:#1a5f9e; font-size:12px; font-weight:400; border:1px solid #b3d5f5; background:#fff; border-radius:4px; padding:1px 6px; white-space:nowrap}
tr.merge-sub{display:none}
tr.merge-sub.show{display:table-row}
tr.merge-sub td{background:#fbfdff; border-top:1px dashed #dbe6f0}
tr.merge-sub td.op{border-left:1px solid #eef1f5}
tr.merge-sub .sub-ind{color:#93a5b6}
tr.merge-sub:hover td{background:#f2f8fd}

/* 发票汇总: 张数可点击跳转 */
.tbl a.inv-link{text-decoration:none; font-weight:700; border-bottom:1px dashed currentColor; cursor:pointer}
.tbl a.inv-link:hover{opacity:.65}


/* ===== CRM 追加样式(移动优先 + 时间线/阶段/拜访) ===== */
.topbar nav{overflow-x:auto; flex-wrap:nowrap; -webkit-overflow-scrolling:touch}
.topbar nav a{flex:0 0 auto}
.pg-actions{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px}
.badge{display:inline-block; padding:1px 8px; border-radius:10px; font-size:12px; background:#e2f0f9; color:#1d4466; white-space:nowrap}
.badge.amber{background:#fdf3e0; color:#8a5a00}
.badge.green{background:#e7f4ea; color:#188038}
.badge.red{background:#fdf1f0; color:#d93026}
.badge.blue{background:#e8f4ff; color:#0e5a9c}
.tag{display:inline-block; background:#eef1f5; border-radius:4px; padding:1px 6px; font-size:12px; color:#41586d; margin-right:4px}
.owner{color:#0e5a9c; font-size:12px}
/* 客户/商机 卡片列表(移动端友好) */
.clist .citem{background:#fff; border:1px solid var(--line); border-radius:10px; padding:10px 12px; margin-bottom:8px; display:block; text-decoration:none; color:inherit}
.clist .citem:hover{border-color:var(--accent)}
.citem .t1{display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.citem .t1 b{font-size:15px}
.citem .t2{color:#6a7d90; font-size:12px; margin-top:4px; display:flex; gap:10px; flex-wrap:wrap}
.citem .t3{margin-top:6px; display:flex; justify-content:space-between; align-items:center; font-size:12px; color:#8a9bad}
/* 时间线 */
.tl{border-left:2px solid #dde4ec; margin:6px 0 6px 8px; padding-left:16px}
.tl .item{position:relative; margin-bottom:14px}
.tl .item::before{content:''; position:absolute; left:-21px; top:4px; width:8px; height:8px; border-radius:50%; background:var(--accent)}
.tl .item.visit::before{background:var(--amber)}
.tl .item.done::before{background:#b9d7ea}
.tl .meta{font-size:12px; color:#6a7d90; display:flex; gap:8px; flex-wrap:wrap; align-items:center}
.tl .body{background:#fff; border:1px solid var(--line); border-radius:8px; padding:8px 10px; margin-top:4px; font-size:13px}
.photos{display:flex; gap:6px; flex-wrap:wrap; margin-top:6px}
.photos img{height:64px; width:auto; border-radius:6px; object-fit:cover}
.act-tag{font-size:11px; padding:1px 6px; border-radius:8px; background:#eef3f8; color:#41586d}
.act-tag.visit{background:#fdf3e0; color:#8a5a00}
.int-a{color:#d93026; font-weight:700}
.int-b{color:#b58105; font-weight:600}
.int-c{color:#6a7d90}
/* 阶段进度条 */
.stagebar{display:flex; flex-wrap:wrap; gap:4px; margin:8px 0 12px}
.stagebar .st{background:#eef1f5; color:#8a9bad; padding:4px 10px; border-radius:14px; font-size:12px}
.stagebar .st.on{background:var(--navy); color:#fff; font-weight:600}
.stagebar .st.pass{background:#e7f4ea; color:#188038}
.stagebar .st.end{background:#eef1f5; color:#8a9bad; text-decoration:line-through}
/* 拜访历史卡 */
.visit-item{background:#fff; border:1px solid var(--line); border-left:4px solid var(--amber); border-radius:10px; padding:10px 12px; margin-bottom:8px}
.visit-item .addr{color:#6a7d90; font-size:12px}
.visit-item .addr::before{content:'📍 '}
/* 详情信息行 */
.kv{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:8px 20px; font-size:13px}
.kv div b{color:#6a7d90; font-weight:400; margin-right:6px}
.done-btn{color:var(--green); font-size:12px; text-decoration:none}
.done-btn:hover{text-decoration:underline}
a.link{color:#0e5a9c; text-decoration:none}
a.link:hover{text-decoration:underline}
.section{background:#fff; border:1px solid var(--line); border-radius:10px; padding:12px 14px; margin-bottom:12px}
.section h3{font-size:14px; margin-bottom:8px; display:flex; justify-content:space-between; align-items:center}
.pill-btn{display:inline-block; background:var(--accent); color:#fff; border-radius:16px; padding:10px 22px; font-size:15px; font-weight:700; text-decoration:none; text-align:center}
.pill-btn:hover{background:#00919c}
.visit-form-note{font-size:12px; color:#8a9bad; margin:6px 0 10px}
@media(max-width:700px){ main{padding:10px} .tbl{font-size:12px} }


/* ===== CRM 移动端底部导航(替代顶部横滑) ===== */
.tabbar{display:none}
@media(max-width:820px){
  .topbar{padding:0 12px; gap:10px}
  .topbar .brand{font-size:15px}
  .topbar .brand small{display:none}
  .topnav{display:none}
  .topbar .who{display:none}
  .tabbar{display:flex; position:fixed; left:0; right:0; bottom:0;
    background:#fff; border-top:1px solid var(--line); box-shadow:0 -2px 10px rgba(15,42,71,.06); z-index:999}
  .tabbar a{flex:1; display:flex; flex-direction:column; align-items:center; gap:1px;
    padding:7px 0 8px; color:#7a8ba0; text-decoration:none; font-size:11px; -webkit-tap-highlight-color:transparent}
  .tabbar a i{font-style:normal; font-size:19px; line-height:1.3}
  .tabbar a.on{color:var(--accent); font-weight:600}
  main{padding-bottom:76px}
  .foot{padding-bottom:88px}
}

/* 移动端横向晃动修复: 页面禁止横向滚动/回弹, 宽表格只在自身容器内横滑 */
html,body{overflow-x:hidden}
.table-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch; overscroll-behavior-x:contain}

/* 移动端右上角"设置"入口(底部导航的"设置"已替换为"打卡") */
.top-set{display:none}
@media(max-width:820px){
  .top-set{display:flex; align-items:center; color:#fff; font-size:19px; text-decoration:none;
    margin-left:auto; padding:2px 4px; -webkit-tap-highlight-color:transparent}
}
