/* 至简租房 · 租客端 H5 · 纯原生 CSS（全部选择器 .tn- 前缀，仅作用于租客端，避免与房东端 style.css 冲突） */

/* ============ 基础 ============ */
.tn-num,.tn-money{font-variant-numeric:tabular-nums}
.tn-c-brand{color:#8b1a1a}
.tn-muted{color:#888}
.tn-err{color:#c62828}
.tn-warn{color:#c07a12}
.tn-ok{color:#2e7d32}

.tn-loading{padding:34px 16px;text-align:center;color:#999;font-size:14px}
.tn-loading.sm{padding:16px;font-size:13px}

.tn-empty{padding:34px 16px;text-align:center;color:#999}
.tn-empty .tn-em-ic{font-size:34px;line-height:1;margin-bottom:8px}
.tn-empty .tn-em-t{font-size:15px;color:#666;font-weight:600;margin-bottom:4px}
.tn-empty .tn-em-d{font-size:13px;color:#999;margin-bottom:12px}

/* ============ 通用组件 ============ */
.tn-card{background:#fff;border-radius:12px;box-shadow:0 1px 3px rgba(0,0,0,.055),0 1px 2px rgba(0,0,0,.04);padding:14px;margin-bottom:12px}

.tn-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  border:1px solid #8b1a1a;background:#8b1a1a;color:#fff;font-family:inherit;
  font-size:14.5px;font-weight:600;padding:10px 16px;border-radius:10px;cursor:pointer;
  transition:opacity .15s,background .15s;
}
.tn-btn:active{opacity:.82}
.tn-btn:disabled{opacity:.55;cursor:default}
.tn-btn.ghost{background:#fff;color:#8b1a1a;border-color:#e0d9d3}
.tn-btn.danger{background:#c62828;border-color:#c62828}
.tn-btn.block{display:flex;width:100%}
.tn-btn.sm{font-size:13px;padding:7px 12px;border-radius:9px}

.tn-mini{
  border:1px solid #e3ddd7;background:#fff;color:#8b1a1a;font-family:inherit;
  font-size:12.5px;padding:6px 10px;border-radius:8px;cursor:pointer;
}
.tn-mini:active{background:#faf6f4}
.tn-mini.block{display:block;width:100%;text-align:center}
.tn-link{border:0;background:none;color:#8b1a1a;font-family:inherit;font-size:13px;cursor:pointer;text-decoration:underline;padding:0 2px}

.tn-badge{display:inline-block;font-size:11px;line-height:1;padding:3px 7px;border-radius:20px;font-weight:600;white-space:nowrap}
.tn-badge.ok{background:#e7f3e8;color:#2e7d32}
.tn-badge.warn{background:#fbf1df;color:#a9690a}
.tn-badge.err{background:#fbe9e9;color:#c62828}
.tn-badge.purple{background:#efe8f7;color:#6a3fa0}
.tn-badge.orange{background:#fdeede;color:#c26a12}

.tn-fld{display:block;margin-bottom:12px}
.tn-fld-l{display:block;font-size:12.5px;color:#777;margin-bottom:6px;font-weight:600}
.tn-inp{
  width:100%;border:1px solid #e0dbd5;border-radius:10px;background:#fdfcfb;
  font-family:inherit;font-size:15px;color:#333;padding:11px 12px;outline:none;
}
.tn-inp:focus{border-color:#8b1a1a;background:#fff}
.tn-inp.sm{padding:7px 9px;font-size:13.5px}
.tn-ta{resize:vertical;min-height:80px;line-height:1.5}

/* ============ 登录 ============ */
.tn-login{max-width:400px;margin:0 auto;padding-top:6px}
.tn-login-logo{text-align:center;font-size:34px;font-weight:800;letter-spacing:10px;color:#8b1a1a;padding-left:10px;margin:12px 0 4px}
.tn-login-slogan{text-align:center;font-size:12.5px;color:#8a7f78;letter-spacing:.5px}
.tn-login-sub{text-align:center;font-size:13px;color:#999;margin:6px 0 18px}
.tn-login-card{padding:18px 16px}
.tn-login-tip{font-size:12.5px;color:#8a8078;line-height:1.6;margin:6px 2px 0;background:#faf7f5;border-radius:9px;padding:9px 11px}
.tn-login-tip b{color:#8b1a1a}
.tn-login-foot{text-align:center;font-size:13px;color:#777;margin:16px 0 10px}
.tn-login-foot b{color:#8b1a1a}

/* ============ 首页 ============ */
.tn-hello{margin:2px 2px 12px}
.tn-hello-hi{font-size:19px;font-weight:700;color:#333}
.tn-hello-dt{font-size:12.5px;color:#999;margin-top:2px}

.tn-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}
.tn-stat{background:#fff;border-radius:12px;box-shadow:0 1px 3px rgba(0,0,0,.05);padding:12px 10px;text-align:center}
.tn-stat-v{font-size:19px;font-weight:800;color:#333;font-variant-numeric:tabular-nums;letter-spacing:-.3px}
.tn-stat-v.err{color:#c62828}
.tn-stat-v.ok{color:#2e7d32}
.tn-stat-l{font-size:12px;color:#999;margin-top:3px}

.tn-unit{padding:14px 14px 12px}
.tn-unit-hd{display:flex;align-items:center;gap:8px}
.tn-unit-t{font-size:15.5px;font-weight:700;color:#333;flex:1;min-width:0}
.tn-unit-t b{color:#c9bfb8;font-weight:400}
.tn-unit-sub{font-size:12.5px;color:#8a8078;margin-top:5px;line-height:1.5}
.tn-unit-sub .tn-warn{font-weight:700}
.tn-nums{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0 10px;padding:10px 0;border-top:1px solid #f0ece7;border-bottom:1px solid #f0ece7}
.tn-numcell{text-align:center}
.tn-numcell-v{font-size:16px;font-weight:800;color:#333;font-variant-numeric:tabular-nums}
.tn-numcell-v.err{color:#c62828}
.tn-numcell-v.ok{color:#2e7d32}
.tn-numcell-l{font-size:11.5px;color:#999;margin-top:3px}

.tn-unit-more{margin-top:12px;border-top:1px dashed #eee}

.tn-sec-h{font-size:13.5px;font-weight:700;color:#5a5a5a;margin:14px 0 10px;display:flex;align-items:center;justify-content:space-between}
.tn-sec-s{font-size:11.5px;color:#aaa;font-weight:400}

/* 抄表 */
.tn-mrow{padding:11px 0;border-bottom:1px solid #f4f1ee}
.tn-mrow:last-of-type{border-bottom:0}
.tn-mtop{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px}
.tn-mlabel{font-size:13.5px;font-weight:700;color:#444}
.tn-mprev{font-size:12px;color:#999;font-variant-numeric:tabular-nums}
.tn-minline{display:flex;align-items:center;gap:8px}
.tn-mininput{
  flex:1;min-width:0;border:1px solid #e0dbd5;border-radius:9px;background:#fdfcfb;
  font-family:inherit;font-size:15px;color:#333;padding:9px 11px;outline:none;font-variant-numeric:tabular-nums;
}
.tn-mininput:focus{border-color:#8b1a1a;background:#fff}
.tn-mininput.sm{padding:7px 9px;font-size:13.5px}
.tn-mu{font-size:13px;color:#888;white-space:nowrap}
.tn-mline{font-size:12.5px;color:#666;margin-top:6px;font-variant-numeric:tabular-nums}
.tn-mline b{color:#c62828}
.tn-mhint{font-size:12px;color:#999;margin-top:5px;font-variant-numeric:tabular-nums}
.tn-mhint.warn{color:#c26a12;font-weight:700;background:#fdf3e7;border-radius:8px;padding:7px 10px}
.tn-minline.loss{margin-top:8px}
.tn-minline.loss .tn-mu{color:#a99f98}

.tn-exrow{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.tn-sel{
  border:1px solid #e0dbd5;border-radius:9px;background:#fdfcfb;font-family:inherit;
  font-size:13.5px;color:#333;padding:8px 9px;outline:none;
}
.tn-subtotal{display:flex;align-items:baseline;justify-content:space-between;margin:14px 0 10px;font-size:13.5px;color:#666}
.tn-subtotal b{font-size:22px;font-weight:800;color:#8b1a1a;font-variant-numeric:tabular-nums}

/* ============ 账单 ============ */
.tn-sumpanel{background:linear-gradient(180deg,#fff,#fdfaf9);text-align:center;padding:18px 14px}
.tn-sum-l{font-size:12.5px;color:#999}
.tn-sum-big{font-size:32px;font-weight:800;color:#8b1a1a;font-variant-numeric:tabular-nums;letter-spacing:-.5px;margin:4px 0 6px}
.tn-sum-sub{font-size:12px;color:#8a8078;line-height:1.7;font-variant-numeric:tabular-nums}

.tn-chips{display:flex;gap:8px;overflow-x:auto;padding:2px 0 10px;-webkit-overflow-scrolling:touch}
.tn-chip{
  flex:none;border:1px solid #e6e0da;background:#fff;color:#666;font-family:inherit;
  font-size:13px;padding:6px 14px;border-radius:20px;cursor:pointer;white-space:nowrap;
}
.tn-chip.on{background:#8b1a1a;border-color:#8b1a1a;color:#fff;font-weight:600}

.tn-billlist{padding-bottom:8px}
.tn-billrow{background:#fff;border-radius:12px;box-shadow:0 1px 3px rgba(0,0,0,.05);margin-bottom:10px;overflow:hidden}
.tn-br-main{display:flex;align-items:flex-start;gap:10px;padding:13px 14px}
.tn-chk{
  flex:none;width:22px;height:22px;border-radius:6px;border:1.5px solid #d8d1cb;background:#fff;
  display:flex;align-items:center;justify-content:center;font-size:14px;color:#fff;margin-top:1px;cursor:pointer;
}
.tn-chk.on{background:#8b1a1a;border-color:#8b1a1a}
.tn-chk.dis{background:#f2efec;border-color:#e6e0da;cursor:default}
.tn-br-l{flex:1;min-width:0}
.tn-br-t{font-size:14px;font-weight:700;color:#333}
.tn-br-u{font-size:12.5px;color:#8a8078;font-weight:600}
.tn-br-s{font-size:12px;color:#999;margin-top:3px}
.tn-br-badges{margin-top:6px;display:flex;flex-wrap:wrap;gap:5px}
.tn-br-r{flex:none;text-align:right}
.tn-br-amt{font-size:16px;font-weight:800;color:#333;font-variant-numeric:tabular-nums}
.tn-br-x{font-size:11.5px;color:#8b1a1a;cursor:pointer;display:inline-block;margin-top:5px}
.tn-br-items{background:#faf8f6;border-top:1px solid #f0ece7;padding:6px 14px}
.tn-item{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12.5px;color:#666;padding:6px 0;border-bottom:1px dashed #eee}
.tn-item:last-child{border-bottom:0}
.tn-item .tn-item-m{color:#999;font-variant-numeric:tabular-nums}
.tn-item .tn-item-a{font-weight:700;color:#444;font-variant-numeric:tabular-nums}

.tn-batch{position:fixed;left:0;right:0;bottom:calc(56px + env(safe-area-inset-bottom));z-index:45;display:flex;justify-content:center;padding:0 12px}
.tn-batch-in{
  width:100%;max-width:936px;background:#fff;border-radius:12px;box-shadow:0 -2px 16px rgba(0,0,0,.12),0 2px 8px rgba(0,0,0,.06);
  display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 14px;
}
.tn-batch-l{font-size:13.5px;color:#666}
.tn-batch-l b{font-variant-numeric:tabular-nums;color:#333}
.tn-batch-l b:last-child{color:#c62828}
.tn-batch-in .tn-btn{flex:none}

/* ============ 报修 ============ */
.tn-pagehd{display:flex;align-items:center;justify-content:space-between;margin:2px 2px 12px}
.tn-pt{font-size:17px;font-weight:800;color:#333;margin:0}
.tn-repair{background:#fff;border-radius:12px;box-shadow:0 1px 3px rgba(0,0,0,.05);padding:14px;margin-bottom:10px}
.tn-rep-hd{display:flex;align-items:flex-start;gap:10px}
.tn-rep-t{flex:1;font-size:14.5px;font-weight:700;color:#333;line-height:1.5}
.tn-rep-s{font-size:12px;color:#999;margin-top:5px}
.tn-rep-c{font-size:12.5px;color:#c26a12;margin-top:5px;font-weight:600;font-variant-numeric:tabular-nums}
.tn-rep-n{font-size:12.5px;color:#7a736d;margin-top:6px;background:#faf7f5;border-radius:8px;padding:7px 10px}

/* ============ 我的 ============ */
.tn-profile{display:flex;align-items:center;gap:14px}
.tn-prof-av{
  flex:none;width:52px;height:52px;border-radius:50%;background:#8b1a1a;color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:800;
}
.tn-prof-n{font-size:18px;font-weight:800;color:#333}
.tn-prof-p{font-size:13px;color:#999;margin-top:2px;font-variant-numeric:tabular-nums}
.tn-mrow2{display:flex;align-items:center;justify-content:space-between;gap:10px}
.tn-mrow2-i{font-size:13px;color:#888}
.tn-mrow2-i b{font-size:20px;font-weight:800;color:#8b1a1a;margin-right:4px;font-variant-numeric:tabular-nums}
.tn-wxline{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:14px;color:#444}
.tn-wxline b{color:#8b1a1a;font-variant-numeric:tabular-nums}

.tn-prods{margin-top:6px}
.tn-prod{display:flex;align-items:flex-start;gap:12px;padding:12px 0;border-bottom:1px solid #f2eeea}
.tn-prod:last-child{border-bottom:0}
.tn-prod-ic{flex:none;font-size:24px;line-height:1.2;width:30px;text-align:center}
.tn-prod-n{font-size:14.5px;font-weight:700;color:#333}
.tn-prod-d{font-size:12.5px;color:#8a8078;margin-top:3px;line-height:1.5}
.tn-slogan{text-align:center;font-size:12.5px;color:#a99f98;letter-spacing:.5px;padding:12px 0 2px}
.tn-logout{margin-top:16px}

/* ============ 弹窗 / 确认 / Toast ============ */
.tn-mask{position:fixed;left:0;top:0;right:0;bottom:0;background:rgba(20,16,14,.46);z-index:120;display:flex;align-items:flex-end;justify-content:center}
.tn-modal{background:#fff;width:100%;max-width:480px;max-height:88vh;display:flex;flex-direction:column;border-radius:16px 16px 0 0;animation:tnup .22s ease}
.tn-modal-sm{max-width:340px;border-radius:14px;margin:0 14px}
.tn-modal-hd{display:flex;align-items:center;justify-content:space-between;padding:15px 16px 10px;font-size:16px;color:#333}
.tn-modal-bd{padding:4px 16px 8px;overflow-y:auto}
.tn-modal-ft{display:flex;gap:10px;padding:12px 16px calc(14px + env(safe-area-inset-bottom));border-top:1px solid #f2eeea}
.tn-modal-ft .tn-btn{flex:1}
.tn-modal-sm .tn-modal-ft{border-top:0;padding-top:0}
.tn-cf-t{font-size:15px;color:#444;line-height:1.6;margin:4px 0 14px}
.tn-x{border:0;background:none;color:#aaa;font-size:17px;line-height:1;cursor:pointer;padding:4px 6px}
@keyframes tnup{from{transform:translateY(14px);opacity:.6}to{transform:translateY(0);opacity:1}}

.tn-toast{
  background:rgba(35,30,28,.94);color:#fff;padding:10px 16px;border-radius:10px;
  font-size:13.5px;box-shadow:0 6px 22px rgba(0,0,0,.24);text-align:center;max-width:100%;
  animation:tnin .22s ease;
}
.tn-toast.err{background:rgba(150,26,26,.96)}
.tn-toast.ok{background:rgba(30,90,40,.95)}
.tn-toast.out{opacity:0;transform:translateY(6px);transition:all .24s}
@keyframes tnin{from{transform:translateY(8px);opacity:0}to{transform:translateY(0);opacity:1}}

/* ============ 宽屏 ============ */
@media(min-width:760px){
  .tn-mask{align-items:center}
  .tn-modal{border-radius:16px}
  .tn-batch{bottom:0;padding-bottom:16px}
  .tn-login{padding-top:24px}
  .tn-stats{gap:14px}
  .tn-stat-v{font-size:22px}
  .tn-sum-big{font-size:38px}
}

/* ================= 房东联系方式 / 收款账号 / 上月读数说明 / 给软件提建议 ================= */
.tn-owner,.tn-pay{border-left:3px solid #8b1a1a}
.tn-owner-hd{font-size:13.5px;font-weight:800;color:#8b1a1a;margin-bottom:6px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tn-crow{display:flex;align-items:center;gap:8px;padding:7px 0;border-bottom:1px dashed #eee6df}
.tn-crow:last-of-type{border-bottom:0}
.tn-crow-l{flex:0 0 58px;font-size:12px;color:#999}
.tn-crow-v{flex:1;font-size:14px;font-weight:700;color:#333;word-break:break-all;font-variant-numeric:tabular-nums}
.tn-crow-s{font-size:11.5px;color:#999;font-weight:400}
.tn-owner-call{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:10px;padding:10px;border-radius:9px;background:#8b1a1a;color:#fff;font-size:14px;font-weight:700;text-decoration:none}
.tn-hint2{font-size:12px;color:#8a7a6a;background:#fdf8f3;border:1px solid #f0e2d4;border-radius:8px;padding:9px 11px;margin-top:10px;line-height:1.75}
.tn-mhint2{font-size:11.5px;color:#9a8b7c;margin-top:6px;line-height:1.65}
.tn-mrow2-s{display:block;font-style:normal;font-size:11.5px;color:#aaa;margin-top:3px}
.tn-sugbtn{margin-top:10px}
.tn-pm-total{font-size:14px;color:#555;margin-bottom:8px}
.tn-pm-total b{font-size:20px;color:#2e7d32;font-variant-numeric:tabular-nums}
.tn-pm-sec{font-size:12.5px;font-weight:800;color:#8b1a1a;margin:14px 0 2px;border-top:1px dashed #eee6df;padding-top:10px}
.tn-pm-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 0;font-size:13.5px;color:#555}
.tn-pm-row b{color:#8b1a1a;font-variant-numeric:tabular-nums}
.tn-sugitem{padding:9px 0;border-bottom:1px dashed #eee6df}
.tn-sugitem:last-child{border-bottom:0}
.tn-sugitem-hd{display:flex;align-items:flex-start;gap:8px}
.tn-sugitem-t{flex:1;font-size:13.5px;line-height:1.6;word-break:break-word}
.tn-sugitem-s{font-size:11.5px;color:#999;margin-top:4px;line-height:1.6;word-break:break-word}