/* ============================================================
   微信转账账单 1:1 复刻样式（照搬 vjietu.pro 原站 CSS raw 值）
   - 渲染链：.shot-content(逻辑尺寸+显示zoom) → .shot-zoom(zoom:1/3) → .shot-phone(3x raw 值)
   - 外框：border-radius 3px + box-shadow 0 0 10px rgba(0,0,0,.1)，无黑色边框
   - 状态栏三套：ios / emui(华为) / miui(小米)，图标全靠背景图 + text-indent
   ============================================================ */

/* ==================== 原站自托管字体（照搬 b86da267e15ab0bb.css 的 @font-face） ====================
   手机预览正文 SF Pro、金额数字 WeChatNum、¥ 符号 SansStd 均依赖这些字体，
   缺失时会回落系统 sans-serif，观感与原站差异极大，故必须自托管。 */
@font-face { font-family: SF Pro; font-style: normal; font-weight: 600; src: url('/assets/fonts/sf-pro-text_semibold.a0c74f8f.woff2') format('woff2'); }
@font-face { font-family: SF Pro; font-style: normal; font-weight: 500; src: url('/assets/fonts/sf-pro-text_medium.dcc28d6a.woff2') format('woff2'); }
@font-face { font-family: SF Pro; font-style: normal; font-weight: 400; src: url('/assets/fonts/sf-pro-text_regular.07bdfc6e.woff2') format('woff2'); }
@font-face { font-family: SansStdRegular; font-style: normal; font-weight: 400; src: url('/assets/fonts/SansStdRegular.a7cf7553.ttf'); }
@font-face { font-family: SansStdMedium; font-style: normal; font-weight: 400; src: url('/assets/fonts/SansStdMedium.ca6dff36.ttf'); }
@font-face { font-family: SansStdBold; font-style: normal; font-weight: 400; src: url('/assets/fonts/SansStdBold.85ab7df6.ttf'); }
@font-face { font-family: WeChatNum; font-style: normal; font-weight: 400; src: url('/assets/fonts/WeChatNum.04b083e1.ttf'); }

/* ==================== 屏幕外框与缩放链 ==================== */
.shot-wrap {
  display: flex;
  /* 原站 .shot_wrap 逐值：font-family 仅 SF Pro,PingFang SC，不得追加其它回退，
     否则 ¥(U+FFE5) 等缺字会落到与原站不同的系统 CJK 回退字体，导致字形高度/基线不一致 */
  font-family: SF Pro, PingFang SC;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  /* 原站全局(b86d)与 body 均无 line-height，预览内行盒计算为 normal；
     本站 body 为 chrome 设了 1.5，会渗入预览使金额行盒偏高(47.2 vs 31)，故预览根重置为 normal */
  line-height: normal;
}
.shot-content {
  margin: 0 auto;
  width: 375px;
  height: 812px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border-radius: 3px;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  position: relative;
}
.shot-zoom { zoom: 0.3333333333; flex: 1 1; height: 100%; }
.shot-phone {
  height: 100%;
  background-color: #ededed;
  display: flex;
  flex-direction: column;
}
.shot-main { flex: 1 1; display: flex; flex-direction: column; overflow: hidden; }

/* 底部 HOME 指示条（仅 iOS） */
.bottom-bar { height: 102px; display: flex; align-items: center; justify-content: center; position: relative; }
.bottom-bar i { width: 405px; height: 15px; border-radius: 7.5px; background: #191919; }

/* ==================== iOS 状态栏 ==================== */
.ios-dark { background-color: #ededed; position: relative; }
.ios-dark .ios-bar { height: 123px; align-items: center; display: flex; padding: 0 43px 0 95px; }
.ios-i14 .ios-bar { height: 175px; }
.ios-magic-bar {
  position: absolute; width: 360px; height: 105px; left: 50%; top: 50%;
  margin-top: -52.5px; margin-left: -180px; background-color: #000; border-radius: 52.5px;
}
.transfer-statusbar { background: #fff !important; }
.ios-left { flex: 1 1; display: flex; align-items: center; }
.ios-center { flex: 1 1; }
.ios-right { display: flex; align-items: center; }
.ios-time { font-size: 48px; font-weight: 500; margin-right: 15px; }
.ios-location {
  width: 40px; height: 40px; background-image: url('/assets/img/orig/ios-location-dark.7ac3ec59.png');
  background-repeat: no-repeat; text-indent: -9999px; display: block; margin-right: 15px;
}
/* 单卡信号 */
.ios-single {
  width: 54px; height: 36px; background: url('/assets/img/orig/ios-single-1-dark.3d6b4b6f.png') no-repeat;
  margin-left: 15px; text-indent: -9999px; display: block;
}
.ios-single-2 { background-image: url('/assets/img/orig/ios-single-2-dark.742ba797.png'); }
.ios-single-3 { background-image: url('/assets/img/orig/ios-single-3-dark.42f6377e.png'); }
.ios-single-4, .ios-single-5 { background-image: url('/assets/img/orig/ios-single-4-dark.493e36dc.png'); }
/* 双卡组 */
.ios-single-group { margin-left: 15px; display: flex; flex-direction: column; }
.ios-single-group .ios-single {
  width: 54px; height: 24px; margin-left: 0;
  background: url('/assets/img/orig/ios-single-1-double-dark.fb0dc8cc.png') no-repeat;
}
.ios-single-group .ios-single-2 { background-image: url('/assets/img/orig/ios-single-2-double-dark.2680c8c4.png'); }
.ios-single-group .ios-single-3 { background-image: url('/assets/img/orig/ios-single-3-double-dark.b6824a41.png'); }
.ios-single-group .ios-single-4,
.ios-single-group .ios-single-5 { background-image: url('/assets/img/orig/ios-single-4-double-dark.dfb0d016.png'); }
.ios-single-group .ios-single2 {
  width: 54px; height: 12px;
  background: url('/assets/img/orig/ios-single-1-double2-dark.caa5c67e.png') no-repeat;
}
.ios-single-group .ios-single2-2 { background-image: url('/assets/img/orig/ios-single-2-double2-dark.155f65d8.png'); }
.ios-single-group .ios-single2-3 { background-image: url('/assets/img/orig/ios-single-3-double2-dark.35854378.png'); }
.ios-single-group .ios-single2-4,
.ios-single-group .ios-single2-5 { background-image: url('/assets/img/orig/ios-single-4-double2-dark.0604ff0a.png'); }
/* WiFi（仅 网络1=wifi 时出现） */
.ios-wifi {
  width: 63px; height: 45px; background: url('/assets/img/orig/ios-wifi-1-dark.d2551627.png') no-repeat;
  margin-left: 15px; text-indent: -9999px;
}
.ios-wifi-2 { background-image: url('/assets/img/orig/ios-wifi-2-dark.ae84ed2a.png'); }
.ios-wifi-3, .ios-wifi-4 { background-image: url('/assets/img/orig/ios-wifi-3-dark.0b7e8265.png'); }
/* 网络制式文字 */
.ios-network { font-size: 36px; font-weight: 500; text-align: center; width: 63px; margin-left: 15px; }
/* 电池 */
.ios-battery {
  width: 83px; height: 41px; background: url('/assets/img/orig/ios-battery-dark.aa2825c5.png') no-repeat;
  display: flex; margin-left: 15px; position: relative; flex-direction: column;
}
.ios-battery span {
  margin-right: 10px; flex: 1 1; display: flex; flex-direction: column;
  overflow: hidden; border-radius: 14px; position: relative;
}
.ios-battery span em { display: flex; flex: 1 1; background-color: #000; text-indent: -9999px; }
.ios-battery span i {
  display: flex; align-items: center; font-size: 30px; font-weight: 500; position: absolute;
  width: 100%; height: 100%; font-style: normal; color: #fff; justify-content: center;
}
.ios-battery span i:after {
  display: none; content: ""; width: 19px; height: 26px;
  background: url('/assets/img/orig/ios-battery-charge-dark.ce261c86.png') no-repeat;
}
.ios-battery-charging span em { background: #34c759; }
.ios-battery-charging span i:after { display: block; }

/* ==================== EMUI 状态栏（华为） ==================== */
.emui-dark .emui-bar { height: 75px; padding: 0 90px; background-color: #ededed; display: flex; align-items: center; }
.emui-left, .emui-center, .emui-right { opacity: 0.8; }
.emui-left { display: flex; align-items: center; }
.emui-center { display: flex; align-items: center; flex: 1 1; }
.emui-right { width: 400px; display: flex; align-items: center; justify-content: flex-end; }
.emui-single {
  width: 53px; height: 34px; background-image: url('/assets/img/orig/network-4g-1-dark.2749d941.png');
  text-indent: -9999px; margin-left: 15px; background-size: cover; background-repeat: no-repeat;
}
.emui-single5g { background-image: url('/assets/img/orig/network-5g-1-dark.8195ef51.png'); }
.emui-single-2 { background-image: url('/assets/img/orig/network-4g-2-dark.e5f7e9ff.png'); }
.emui-single-2.emui-single5g { background-image: url('/assets/img/orig/network-5g-2-dark.0c7048b2.png'); }
.emui-single-3 { background-image: url('/assets/img/orig/network-4g-3-dark.33e86a83.png'); }
.emui-single-3.emui-single5g { background-image: url('/assets/img/orig/network-5g-3-dark.3cfceeb0.png'); }
.emui-single-4 { background-image: url('/assets/img/orig/network-4g-4-dark.3b672e80.png'); }
.emui-single-4.emui-single5g { background-image: url('/assets/img/orig/network-5g-4-dark.7cc8374b.png'); }
.emui-single-5 { background-image: url('/assets/img/orig/network-4g-5-dark.59fd4a7b.png'); }
.emui-single-5.emui-single5g { background-image: url('/assets/img/orig/network-5g-5-dark.a7305b4d.png'); }
.emui-wifi {
  width: 40px; height: 33px; margin-left: 15px; background-size: cover; background-repeat: no-repeat;
  background-image: url('/assets/img/orig/wifi-1-dark.b23ac9ad.png'); text-indent: -9999px;
}
.emui-wifi-2 { background-image: url('/assets/img/orig/wifi-2-dark.6a576aad.png'); }
.emui-wifi-3 { background-image: url('/assets/img/orig/wifi-3-dark.a8a990d2.png'); }
.emui-wifi-4 { background-image: url('/assets/img/orig/wifi-4-dark.3c55bbfe.png'); }
.emui-bluetooth {
  width: 21px; height: 32px; margin-left: 15px; background-size: cover; background-repeat: no-repeat;
  background-image: url('/assets/img/orig/bluetooth-dark.08edc89f.png'); text-indent: -9999px;
}
.emui-time, .emui-battery-persent { font-weight: 400; font-size: 36px; margin-left: 15px; opacity: 0.8; }
.emui-battery {
  width: 63px; height: 30px; margin-left: 15px; background-size: cover; background-repeat: no-repeat;
  background-image: url('/assets/img/orig/battery-dark.607111d0.png'); text-indent: -9999px;
  display: flex; align-items: center; padding-left: 4px; padding-right: 12px; position: relative;
}
.emui-battery em { background: #000; height: 20px; border-radius: 4px; opacity: 0.9; }
.emui-battery i { display: block; }
.emui-battery-charging em { opacity: 0.3; }
.emui-battery-charging i {
  width: 28px; height: 13px; background-image: url('/assets/img/orig/battery-charge-dark.4a8e8e60.png');
  background-size: cover; top: 50%; left: 50%; margin-top: -6px; margin-left: -18px; position: absolute;
}

/* ==================== MIUI 状态栏（小米） ==================== */
.miui-dark .miui-bar { height: 75px; padding: 0 90px 0 207px; background-color: #ededed; display: flex; align-items: center; }
.miui-left, .miui-center, .miui-right { opacity: 0.8; }
.miui-left { display: flex; align-items: center; }
.miui-center { display: flex; align-items: center; flex: 1 1; }
.miui-right { width: 400px; display: flex; align-items: center; justify-content: flex-end; }
.miui-single {
  width: 42px; height: 30px; background-image: url('/assets/img/orig/network-4g-1-dark.8e9cc90d.png');
  text-indent: -9999px; margin-left: 15px; background-size: cover; background-repeat: no-repeat;
}
.miui-single-2 { background-image: url('/assets/img/orig/network-4g-2-dark.28d7a721.png'); }
.miui-single-3 { background-image: url('/assets/img/orig/network-4g-3-dark.229e0fcb.png'); }
.miui-single-4 { background-image: url('/assets/img/orig/network-4g-4-dark.f72c0344.png'); }
.miui-single-5 { background-image: url('/assets/img/orig/network-4g-5-dark.65c6841a.png'); }
.miui-wifi {
  width: 40px; height: 33px; margin-left: 15px; background-size: cover; background-repeat: no-repeat;
  background-image: url('/assets/img/orig/wifi-1-dark.14395afb.png'); text-indent: -9999px;
}
.miui-wifi-2 { background-image: url('/assets/img/orig/wifi-2-dark.424a9c76.png'); }
.miui-wifi-3 { background-image: url('/assets/img/orig/wifi-3-dark.fe2026af.png'); }
.miui-wifi-4 { background-image: url('/assets/img/orig/wifi-4-dark.36752827.png'); }
.miui-bluetooth {
  width: 21px; height: 34px; margin-left: 15px; background-size: cover; background-repeat: no-repeat;
  background-image: url('/assets/img/orig/bluetooth-dark.e7c39d96.png'); text-indent: -9999px;
}
.miui-time { font-weight: 400; font-size: 36px; opacity: 0.8; }
.miui-battery-persent { font-weight: 400; font-size: 36px; opacity: 0.8; margin-left: 15px; }
.miui-battery {
  width: 66px; height: 30px; margin-left: 15px; background-size: cover; background-repeat: no-repeat;
  background-image: url('/assets/img/orig/battery-dark.b58ce6e2.png'); text-indent: -9999px;
  display: flex; align-items: center; padding-left: 6px; padding-right: 6px; position: relative;
}
.miui-battery em { background: #000; height: 20px; border-radius: 10px; opacity: 0.3; }
.miui-battery i { display: block; }
.miui-battery-charging em { background-color: #6ccc37; opacity: 1; }
.miui-battery-charging i {
  width: 19px; height: 30px; background-image: url('/assets/img/orig/battery-charge-dark.28fd606a.png');
  background-size: cover; top: 50%; left: 50%; margin-top: -15px; margin-left: -9px; position: absolute;
}

/* ==================== 微信导航栏 ==================== */
.navbar-wrap {
  display: flex; align-items: center; height: 132px; padding: 0 50px;
  position: relative; font-size: 48px; background-color: #ededed;
}
.navbar-wrap:after {
  content: ""; position: absolute; width: 100%; height: 0.67px;
  background: #d5d5d5; overflow: hidden; left: 0; bottom: 1px;
}
.transfer-nav { background: #fff; }
.transfer-nav:after { height: 0; }
.navbar-left { display: flex; width: 200px; align-items: center; }
.navbar-center { display: flex; flex: 1 1; align-items: center; justify-content: center; }
.navbar-right { display: flex; width: 200px; align-items: center; justify-content: flex-end; }
/* × 关闭按钮（原站 left-close.png 69×69，本地缺图用 CSS 绘制） */
.transfer-nav-close { width: 69px; height: 69px; display: block; position: relative; }
.transfer-nav-close::before,
.transfer-nav-close::after {
  content: ""; position: absolute; left: 50%; top: 50%;
  width: 62px; height: 5px; background: #000; border-radius: 2.5px;
}
.transfer-nav-close::before { transform: translate(-50%, -50%) rotate(45deg); }
.transfer-nav-close::after  { transform: translate(-50%, -50%) rotate(-45deg); }
.wechat-title { display: flex; }
.wechat-title .wechat-text { font-size: 51px; font-weight: 500; }

/* ==================== 转账页内容 ==================== */
.page-wrap { flex: 1 1; overflow: hidden; display: flex; flex-direction: column; }
.transfer-wrap { font-size: 42px; display: flex; flex-direction: column; flex: 1 1; }
.transfer-main { background-color: #fff; }
.transfer-main .transfer-content {
  margin: 0 90px; display: flex; flex-direction: column; align-items: center;
  padding-top: 96px; padding-bottom: 135px; border-bottom: 1px solid #e1e1e1;
}
.transfer-main .transfer-content .transfer-icon {
  width: 141px; height: 141px; background: #eee; border-radius: 50%; background-size: cover;
}
.transfer-main .transfer-content .transfer-title { margin-top: 36px; font-size: 48px; }
.transfer-main .transfer-content .transfer-money {
  font-size: 72px; margin-top: 60px; display: flex; align-items: center;
}
.transfer-main .transfer-content .transfer-money span { margin-top: -20px; font-weight: 500; }
.transfer-main .transfer-content .transfer-money em { font-style: normal; font-family: WeChatNum, SF Pro, PingFang SC, sans-serif; }
.transfer-main .transfer-list { margin: 0 90px; padding: 81px 0; }
.transfer-main .transfer-list .transfer-item { display: flex; margin-bottom: 42px; }
.transfer-main .transfer-list .transfer-item span { color: #7f7f7f; width: 264px; }
.transfer-main .transfer-list .transfer-item em { font-style: normal; color: #191919; flex: 1 1; word-break: break-all; }

/* ==================== 账单服务 ==================== */
.transfer-bill { background-color: #fff; margin-top: 27px; }
.transfer-bill .transfer-bill-list { margin: 0 90px; padding-bottom: 60px; }
.transfer-bill .transfer-bill-list .transfer-bill-title {
  height: 147px; display: flex; align-items: center;
  border-bottom: 1px solid #e1e1e1; font-size: 46px; color: #191919;
}
.transfer-bill .transfer-bill-list .transfer-bill-items { display: flex; flex-wrap: wrap; }
.transfer-bill .transfer-bill-list .transfer-bill-items .transfer-bill-item {
  margin-top: 60px; display: flex; align-items: center; width: 50%;
}
.transfer-bill .transfer-bill-list .transfer-bill-items .transfer-bill-item i {
  width: 60px; height: 60px; background-color: #ccc; background-size: cover;
  background-repeat: no-repeat;
}
.transfer-bill .transfer-bill-list .transfer-bill-items .transfer-bill-item span { color: #576b95; }

/* ==================== 底部财付通 ==================== */
.transfer-bottom { display: flex; flex: 1 1; align-items: flex-end; justify-content: center; }
.transfer-bottom span { margin-bottom: 60px; color: #a7a7a7; }

/* ==================== Toast ==================== */
.toast {
  position: fixed;
  top: 30px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0,0,0,0.85);
  color: #fff;
  padding: 10px 20px;
  border-radius: 8px;
  font-size: 14px;
  z-index: 9999;
  font-family: sans-serif;
}

/* ==================== 扫码账单收款方服务 ==================== */
.scan-pay-recipient-service { margin-top: 27px; }
