入驻原型<body>
<h1 class="page-title" data-zh="客户端 - 店铺入驻流程" data-en="Client - Store Onboarding Flow">客户端 - 店铺入驻流程</h1>
<div class="lang-toggle">
<div class="lang-toggle-inner">
<button class="lang-btn active" data-lang="zh" onclick="switchLang('zh')">中文</button>
<button class="lang-btn" data-lang="en" onclick="switchLang('en')">EN</button>
</div>
</div>
<div class="screens">
<!-- ═══════════════ Page 1: 个人中心 ═══════════════ -->
<div class="screen-wrapper" id="screenAccount">
<div class="screen-label"><span>Page 1</span> <span data-zh="个人中心" data-en="Account">个人中心</span></div>
<div class="phone-frame">
<div class="acct-header">
<div class="acct-top">
<div class="acct-title" data-zh="Account" data-en="Account">Account</div>
<div class="acct-top-icons">
<div class="acct-top-icon">🔔<span class="badge">1</span></div>
<div class="acct-top-icon">🎧</div>
<div class="acct-top-icon">⚙</div>
</div>
</div>
<div class="acct-user">
<div class="acct-avatar">👤</div>
<div class="acct-user-info">
<div class="acct-username">user_11209</div>
<div class="acct-vip-tag"><span class="tag-icon">⭐</span><span data-zh="Test" data-en="Test">Test</span> ></div>
</div>
</div>
</div>
<div class="acct-quick">
<div class="acct-quick-item"><div class="aq-icon">🏢</div><span data-zh="收藏店铺" data-en="Favorite Shops">收藏店铺</span></div>
<div class="acct-quick-item"><div class="aq-icon">★</div><span data-zh="收藏商品" data-en="Favorite Products">收藏商品</span></div>
<div class="acct-quick-item"><div class="aq-icon">🕓</div><span data-zh="浏览历史" data-en="Recently Viewed">浏览历史</span></div>
</div>
<div class="acct-orders">
<div class="acct-orders-title"><span data-zh="My Orders" data-en="My Orders">My Orders</span><span class="acct-orders-all" data-zh="All >" data-en="All >">All ></span></div>
<div class="acct-order-tabs">
<div class="acct-order-tab"><div class="ao-icon">💳</div><span data-zh="待付款" data-en="Unpaid">待付款</span></div>
<div class="acct-order-tab"><div class="ao-icon">📦</div><span data-zh="待发货" data-en="To Ship">待发货</span></div>
<div class="acct-order-tab"><div class="ao-icon">🚚</div><span data-zh="待收货" data-en="To Receive">待收货</span></div>
<div class="acct-order-tab"><div class="ao-icon">🔄</div><span data-zh="退货" data-en="Return">退货</span></div>
</div>
</div>
<!-- Sell Banner -->
<div class="sell-entry-banner" onclick="scrollToPage('screenSell')">
<div class="sell-entry-icon">💼</div>
<div class="sell-entry-body">
<div class="sell-entry-title" data-zh="Sell on LULUFULO" data-en="Sell on LULUFULO">Sell on LULUFULO</div>
<div class="sell-entry-desc" data-zh="免费开店，触达更多客户" data-en="Open a free store, reach more customers">免费开店，触达更多客户</div>
</div>
<div class="sell-entry-arrow">></div>
</div>
<div class="acct-features">
<div class="acct-features-title" data-zh="Features" data-en="Features">Features</div>
<div class="acct-feature-item">
<div class="af-icon">🛒</div><div class="af-text" data-zh="采购市场" data-en="Sourcing Market">采购市场</div><div class="af-arrow">></div>
</div>
<div class="acct-feature-item">
<div class="af-icon">📄</div><div class="af-text" data-zh="采购单" data-en="Purchase Orders">采购单</div><div class="af-arrow">></div>
</div>
<div class="acct-feature-item">
<div class="af-icon">📄</div><div class="af-text" data-zh="需求单" data-en="Inquiries">需求单</div><div class="af-arrow">></div>
</div>
<div class="acct-feature-item">
<div class="af-icon">🎫</div><div class="af-text" data-zh="我的优惠券" data-en="My Vouchers">我的优惠券</div><div class="af-arrow">></div>
</div>
<div class="acct-feature-item">
<div class="af-icon">📄</div><div class="af-text" data-zh="发票中心" data-en="Invoice Center">发票中心</div><div class="af-arrow">></div>
</div>
<div class="acct-feature-item">
<div class="af-icon">📍</div><div class="af-text" data-zh="收货地址" data-en="Delivery Address">收货地址</div><div class="af-arrow">></div>
</div>
<div class="acct-feature-item">
<div class="af-icon">✎</div><div class="af-text" data-zh="意见反馈" data-en="Feedback">意见反馈</div><div class="af-arrow">></div>
</div>
</div>
<div class="acct-bottom-nav">
<div class="abn-item"><div class="abn-icon">🏠</div><span data-zh="Home" data-en="Home">Home</span></div>
<div class="abn-item"><div class="abn-icon">🚚</div><span data-zh="Delivery" data-en="Delivery">Delivery</span></div>
<div class="abn-item"><div class="abn-icon">💬</div><span data-zh="Chat" data-en="Chat">Chat</span></div>
<div class="abn-item"><div class="abn-icon">🛒</div><span data-zh="Cart" data-en="Cart">Cart</span></div>
<div class="abn-item active"><div class="abn-icon">👤</div><span data-zh="Account" data-en="Account">Account</span></div>
</div>
</div>
</div>
<!-- ═══════════════ Page 2: Sell on LULUFULO + Plans (merged) ═══════════════ -->
<div class="screen-wrapper" id="screenSell">
<div class="screen-label"><span>Page 2</span> <span data-zh="Sell on LULUFULO + 方案" data-en="Sell on LULUFULO + Plans">Sell on LULUFULO + 方案</span></div>
<div class="phone-frame">
<div class="app-bar">
<button class="back-arrow" onclick="scrollToPage('screenAccount')">←</button>
<div class="bar-title" data-zh="Sell on LULUFULO" data-en="Sell on LULUFULO">Sell on LULUFULO</div>
</div>
<!-- Scrollable body -->
<div class="sell-scroll">
<!-- Hero Banner -->
<div class="sell-hero">
<div class="sell-hero-title" data-zh="Sell on LULUFULO" data-en="Sell on LULUFULO">Sell on LULUFULO</div>
<div class="sell-hero-pill" data-zh="为商家而建，为顾客而生" data-en="Built For Businesses. Made For Customers">为商家而建，为顾客而生</div>
<div class="sell-hero-desc" data-zh="触达更多客户，突破地域限制。值得信赖的安全平台，助力业务增长。" data-en="Reach More Customers. Sell Beyond Your Location. Trusted & Secure Platform. Built for Business Growth.">触达更多客户，突破地域限制。值得信赖的安全平台，助力业务增长。</div>
<div class="sell-hero-trial" data-zh="免费试用（优惠截止 2026年12月31日）" data-en="GET FREE TRIAL (Offer Ends 31 December 2026).">免费试用（优惠截止 2026年12月31日）</div>
</div>
<!-- What You Need to Know -->
<div class="sell-card">
<div class="sell-card-title" data-zh="你需要了解的" data-en="What You Need to Know">你需要了解的</div>
<div class="sell-card-subtitle" data-zh="轻松入门" data-en="Getting Started is Easy.">轻松入门</div>
<div class="sell-steps">
<div data-zh="1. 下载并注册 LULUFULO。" data-en="1. Download and sign up on LULUFULO.">1. 下载并注册 LULUFULO。</div>
<div data-zh="2. 选择开店并验证邮箱。" data-en="2. Choose to open the store and verify your email.">2. 选择开店并验证邮箱。</div>
<div data-zh="3. 使用电脑/笔记本，用验证过的邮箱和密码登录 Merchant Dashboard。" data-en="3. Using a PC/Laptop, log in to the Merchant Dashboard with the verified email and password.">3. 使用电脑/笔记本，用验证过的邮箱和密码登录 Merchant Dashboard。</div>
<div data-zh="[https://shop.lulufulo.com]" data-en="[https://shop.lulufulo.com]">[https://shop.lulufulo.com]</div>
<div data-zh="4. 填写商户信息，上传所需文件并提交审核。" data-en="4. Fill in merchant information, upload required documents and submit for review.">4. 填写商户信息，上传所需文件并提交审核。</div>
<div data-zh="5. 审核通过后，缴纳保证金，发布商品并开始销售。如被拒绝，请查看反馈、更新申请后重新提交。" data-en="5. Once Approved, pay the Deposit Fee, post products, and start selling. If Rejected, review the feedback, update your application, and resubmit.">5. 审核通过后，缴纳保证金，发布商品并开始销售。如被拒绝，请查看反馈、更新申请后重新提交。</div>
</div>
<div class="sell-link">
<a href="#" data-zh="了解更多关于保证金" data-en="Learn more about deposit fee">了解更多关于保证金</a>
</div>
</div>
<!-- Sole Trader -->
<div class="sell-type-card">
<h3 data-zh="个体经营" data-en="Sole Trader">个体经营</h3>
<p data-zh="个体经营是一种简单的商业结构，由个人拥有和经营，所有者与企业之间不存在法律区分。" data-en="A sole trader is a simple business structure owned and operated by one individual, where no legal distinction exists between the owner and the business.">个体经营是一种简单的商业结构，由个人拥有和经营，所有者与企业之间不存在法律区分。</p>
<div class="sell-link"><a href="#" data-zh="文件清单" data-en="Document Checklist">文件清单</a></div>
</div>
<!-- Business/Enterprise -->
<div class="sell-type-card">
<h3 data-zh="企业/公司" data-en="Business/Enterprise">企业/公司</h3>
<p data-zh="企业是指从事经济活动的组织、商业或公司，通常有多位董事。" data-en="An enterprise is an organization, business, or company engaged in economic activity, with more than one directors.">企业是指从事经济活动的组织、商业或公司，通常有多位董事。</p>
<div class="sell-link"><a href="#" data-zh="文件清单" data-en="Document Checklist">文件清单</a></div>
</div>
<!-- ===== Plans Pricing (merged from old P3) ===== -->
<div class="sell-card" style="margin-bottom:16px;">
<div class="plans-free-banner">
<div class="plans-free-title" data-zh="免费商户注册" data-en="Free Merchant Registration">免费商户注册</div>
<div class="plans-free-desc">
<div data-zh="免费试用 — 优惠截止 2026年12月31日" data-en="GET FREE TRIAL – Offer Ends 31 December 2026">免费试用 — 优惠截止 2026年12月31日</div>
<div style="margin-top:6px;" data-zh="触达更多客户，突破地域限制。值得信赖的安全平台，助力业务增长。" data-en="Reach More Customers. Sell Beyond Your Location. Trusted & Secure Platform. Built for Business Growth.">触达更多客户，突破地域限制。值得信赖的安全平台，助力业务增长。</div>
</div>
</div>
<!-- Sole Trader Plan -->
<div class="plans-tier">
<h3 data-zh="个体经营" data-en="Sole Trader">个体经营</h3>
<div class="plans-price">USD 199 / year</div>
<p data-zh="面向个体经营者的入门级方案，提供基础工具。" data-en="An entry-level plan designed for Sole Traders that provides essential tools.">面向个体经营者的入门级方案，提供基础工具。</p>
</div>
<!-- Business Plan -->
<div class="plans-tier">
<h3 data-zh="企业" data-en="Business">企业</h3>
<div class="plans-price">USD 299 / year</div>
<div class="plans-benefits-title" data-zh="专属权益" data-en="Exclusive Benefits">专属权益</div>
<div class="plans-benefits">
<div data-zh="1. 专属可信商户徽章，展示在店铺名称下方，提升官方形象和用户信任。" data-en="1. Exclusive trusted merchant badge displayed below store name to enhance official image and user trust.">1. 专属可信商户徽章，展示在店铺名称下方，提升官方形象和用户信任。</div>
<div data-zh="2. 享受平台大促活动的优先审核权限，更快获得活动资格审批。" data-en="2. Enjoy priority review access for platform big promotions to get event qualification approved faster.">2. 享受平台大促活动的优先审核权限，更快获得活动资格审批。</div>
<div data-zh="3. 优先获得平台流量广告位，提升曝光和销售收入。" data-en="3. Gain priority access to platform traffic ad slots to boost exposure and sales revenue.">3. 优先获得平台流量广告位，提升曝光和销售收入。</div>
</div>
</div>
<div class="plans-contact">
<a href="#" data-zh="联系我们" data-en="Contact Us">联系我们</a>
</div>
</div>
</div>
<!-- Bottom bar (sticky, always visible outside scroll) -->
<div class="sell-bottom-bar">
<div class="sell-bottom-hint" data-zh="选择店铺类型加入我们" data-en="Select your store type to join us.">选择店铺类型加入我们</div>
<div class="sell-bottom-btns">
<button class="sell-btn-sole" onclick="scrollToPage('screenSetup')">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="8" r="4"></circle><path d="M6 21v-2a4 4 0 014-4h4a4 4 0 014 4v2"></path></svg>
<span data-zh="个体经营" data-en="Sole Trader">个体经营</span>
</button>
<button class="sell-btn-biz" onclick="scrollToPage('screenSetup')">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#fff" stroke-width="2"><rect x="3" y="7" width="18" height="13" rx="2"></rect><path d="M16 7V5a2 2 0 00-2-2h-4a2 2 0 00-2 2v2"></path></svg>
<span data-zh="企业" data-en="Business">企业</span>
</button>
</div>
</div>
</div>
</div>
<!-- ═══════════════ Page 3: Setup your account ═══════════════ -->
<div class="screen-wrapper" id="screenSetup">
<div class="screen-label"><span>Page 3</span> <span data-zh="注册账号" data-en="Setup Account">注册账号</span></div>
<div class="phone-frame">
<div class="app-bar">
<button class="back-arrow" onclick="scrollToPage('screenSell')">←</button>
<div class="bar-title" data-zh="Sell on LULUFULO" data-en="Sell on LULUFULO">Sell on LULUFULO</div>
</div>
<div class="setup-hero">
<div class="setup-hero-title" data-zh="设置您的账号" data-en="Setup your account">设置您的账号</div>
<div class="setup-hero-desc" data-zh="输入您的邮箱地址以创建卖家账号" data-en="Enter your email address to create your seller account">输入您的邮箱地址以创建卖家账号</div>
</div>
<div class="setup-form">
<!-- Country -->
<div class="setup-field">
<label class="setup-label"><span class="req">*</span><span data-zh="国家或地区" data-en="Country or Region">国家或地区</span></label>
<div class="setup-input-wrap">
<select class="setup-input setup-select" style="padding-right:12px;">
<option value="ZW" selected="" data-zh="津巴布韦" data-en="Zimbabwe">津巴布韦</option>
<option value="ZM" data-zh="赞比亚" data-en="Zambia">赞比亚</option>
<option value="ZA" data-zh="南非" data-en="South Africa">南非</option>
<option value="KE" data-zh="肯尼亚" data-en="Kenya">肯尼亚</option>
<option value="TZ" data-zh="坦桑尼亚" data-en="Tanzania">坦桑尼亚</option>
<option value="UG" data-zh="乌干达" data-en="Uganda">乌干达</option>
<option value="NG" data-zh="尼日利亚" data-en="Nigeria">尼日利亚</option>
<option value="MW" data-zh="马拉维" data-en="Malawi">马拉维</option>
<option value="BW" data-zh="博茨瓦纳" data-en="Botswana">博茨瓦纳</option>
<option value="NA" data-zh="纳米比亚" data-en="Namibia">纳米比亚</option>
<option value="OT" data-zh="其他" data-en="Other">其他</option>
</select>
</div>
</div>
<!-- Email -->
<div class="setup-field">
<label class="setup-label"><span class="req">*</span><span data-zh="邮箱" data-en="E-mail">邮箱</span></label>
<div class="setup-input-wrap">
<input type="email" class="setup-input has-value" value="qmnrt161278@atminmail.com" id="setupEmail">
<button class="setup-clear" onclick="clearInput('setupEmail')">×</button>
</div>
</div>
<!-- OTP -->
<div class="setup-field">
<label class="setup-label"><span class="req">*</span><span data-zh="验证码" data-en="OTP">验证码</span></label>
<div class="setup-input-wrap setup-otp-row">
<input type="text" class="setup-input has-value" value="446601" id="setupOtp" maxlength="6">
<button class="setup-clear" onclick="clearInput('setupOtp')" style="position:static;transform:none;">×</button>
<span class="setup-otp-timer" id="otpTimer" style="color: rgb(191, 191, 191);">0</span>
</div>
</div>
<!-- Password -->
<div class="setup-field">
<label class="setup-label"><span class="req">*</span><span data-zh="密码" data-en="Password">密码</span></label>
<div class="setup-input-wrap">
<input type="password" class="setup-input has-value" value="a12345678@" id="setupPwd">
<button class="setup-pwd-toggle" onclick="togglePwd('setupPwd', this)">👁</button>
</div>
<div class="setup-hint" data-zh="密码需要 6-20 位字符，必须包含字母、数字和符号。" data-en="Password needs 6–20 characters, must include letters, numbers, and symbols.">密码需要 6-20 位字符，必须包含字母、数字和符号。</div>
</div>
<!-- Confirm Password -->
<div class="setup-field">
<label class="setup-label"><span class="req">*</span><span data-zh="确认密码" data-en="Confirm Password">确认密码</span></label>
<div class="setup-input-wrap">
<input type="password" class="setup-input has-value" value="a12345678@" id="setupPwdConfirm">
<button class="setup-pwd-toggle" onclick="togglePwd('setupPwdConfirm', this)">👁</button>
</div>
</div>
<!-- Phone Number -->
<div class="setup-field">
<label class="setup-label"><span class="req">*</span><span data-zh="手机号" data-en="Phone Number">手机号</span></label>
<div class="setup-phone-row">
<select class="setup-input setup-country-code setup-select">
<option value="+263" selected="">+263</option>
<option value="+27">+27</option>
<option value="+260">+260</option>
<option value="+254">+254</option>
<option value="+255">+255</option>
<option value="+256">+256</option>
<option value="+234">+234</option>
<option value="+265">+265</option>
<option value="+267">+267</option>
<option value="+264">+264</option>
</select>
<input type="tel" class="setup-input setup-phone-input has-value" value="712 345 678" id="setupPhone" placeholder="请输入手机号" data-placeholder-zh="请输入手机号" data-placeholder-en="Enter phone number">
<button class="setup-clear" onclick="clearInput('setupPhone')">×</button>
</div>
</div>
<!-- WhatsApp -->
<div class="setup-field">
<label class="setup-label"><span data-zh="WhatsApp" data-en="WhatsApp">WhatsApp</span></label>
<div class="setup-input-wrap">
<input type="text" class="setup-input" id="setupWhatsapp" placeholder="请输入 WhatsApp 号码" data-placeholder-zh="请输入 WhatsApp 号码" data-placeholder-en="Enter WhatsApp number">
<button class="setup-clear" onclick="clearInput('setupWhatsapp')">×</button>
</div>
</div>
<!-- Agree -->
<div class="setup-agree">
<div class="setup-agree-check">✓</div>
<div class="setup-agree-text">
<span data-zh="我已阅读并同意" data-en="I confirm I have read and agree to the">我已阅读并同意</span>
<a href="#" data-zh="LULUFULO 商户平台接入协议" data-en="LULUFULO Merchant Platform Access Agreement">LULUFULO 商户平台接入协议</a>
</div>
</div>
<!-- Submit -->
<button class="setup-submit" onclick="scrollToPage('screenSuccess')" data-zh="提交" data-en="Submit">提交</button>
</div>
</div>
</div>
<!-- ═══════════════ Page 4: Success ═══════════════ -->
<div class="screen-wrapper" id="screenSuccess">
<div class="screen-label"><span>Page 4</span> <span data-zh="注册成功" data-en="Registration Success">注册成功</span></div>
<div class="phone-frame">
<div class="app-bar">
<button class="back-arrow" onclick="scrollToPage('screenAccount')">←</button>
<div class="bar-title" data-zh="已提交" data-en="Posted">已提交</div>
</div>
<div class="success-page">
<div class="success-icon">
<svg viewBox="0 0 24 24" fill="none" stroke="#fff" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"></polyline></svg>
</div>
<div class="success-title" data-zh="卖家账号已注册！" data-en="Registered seller account !">卖家账号已注册！</div>
<div class="success-steps">
<div class="success-step-title" data-zh="接下来请完成：" data-en="Next, please complete:">接下来请完成：</div>
<div class="success-step-item"><span class="ssi-num">1</span><span data-zh="填写店铺信息与资质资料" data-en="Fill in store information and credentials">填写店铺信息与资质资料</span></div>
<div class="success-step-item"><span class="ssi-num">2</span><span data-zh="提交审核，等待 1-7 个工作日" data-en="Submit for review, wait 1-7 business days">提交审核，等待 1-7 个工作日</span></div>
<div class="success-step-item"><span class="ssi-num">3</span><span data-zh="审核通过后在店铺后台激活店铺" data-en="Activate your store in the merchant backend after approval">审核通过后在店铺后台激活店铺</span></div>
</div>
<div class="doc-bottom-bar" style="position:static;width:100%;flex-shrink:0;margin-top:auto;">
<button class="doc-btn-primary" onclick="scrollToPage('screenDocSole')" data-zh="立即提交资料" data-en="Submit Documents">立即提交资料</button>
<button class="doc-btn-ghost" onclick="scrollToPage('screenAccount')" data-zh="先不提交，返回" data-en="Skip, Go Back">先不提交，返回</button>
</div>
</div>
</div>
</div>
<!-- ═══════════════ Page 5: 个体经营资质提交 ═══════════════ -->
<div class="screen-wrapper" id="screenDocSole">
<div class="screen-label"><span>Page 5</span> <span data-zh="个体经营资质提交" data-en="Sole Trader Documents">个体经营资质提交</span></div>
<div class="phone-frame">
<div class="app-bar">
<button class="back-arrow" onclick="scrollToPage('screenSuccess')">←</button>
<div class="bar-title" data-zh="资质提交" data-en="Documents">资质提交</div>
</div>
<div class="doc-form-scroll">
<!-- 店铺信息 -->
<div class="doc-section">
<div class="doc-section-label" data-zh="店铺信息" data-en="Store Info">店铺信息</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="店铺名称" data-en="Store name">店铺名称</span> <span class="req">*</span></label>
<input type="text" class="doc-input" placeholder="e.g. Tendai's Boutique">
</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="店铺 Logo" data-en="Store Logo">店铺 Logo</span> <span class="req">*</span></label>
<div class="doc-upload">
<div class="doc-upload-icon">📤</div>
<div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div>
<div class="doc-upload-sub" data-zh="800x800px, 3MB, JPG/PNG" data-en="800x800px, max 3MB, JPG/PNG">800x800px, 3MB, JPG/PNG</div>
<input type="file" accept=".jpg,.jpeg,.png">
</div>
</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="经营类目" data-en="Business category">经营类目</span> <span class="req">*</span></label>
<div class="doc-pills">
<label class="doc-pill"><input type="checkbox"><span data-zh="时尚服饰" data-en="Fashion & Apparel">时尚服饰</span></label>
<label class="doc-pill"><input type="checkbox"><span data-zh="电子产品" data-en="Electronics">电子产品</span></label>
<label class="doc-pill"><input type="checkbox"><span data-zh="家居生活" data-en="Home & Living">家居生活</span></label>
<label class="doc-pill"><input type="checkbox"><span data-zh="美妆健康" data-en="Beauty & Health">美妆健康</span></label>
<label class="doc-pill"><input type="checkbox"><span data-zh="食品杂货" data-en="Groceries">食品杂货</span></label>
<label class="doc-pill"><input type="checkbox"><span data-zh="母婴用品" data-en="Baby & Kids">母婴用品</span></label>
<label class="doc-pill"><input type="checkbox"><span data-zh="运动户外" data-en="Sports">运动户外</span></label>
<label class="doc-pill"><input type="checkbox"><span data-zh="艺术手工" data-en="Arts & Crafts">艺术手工</span></label>
</div>
</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="省/市/区" data-en="Province / City">省/市/区</span> <span class="req">*</span></label>
<select class="doc-input doc-select">
<option value="" data-zh="选择省份/城市" data-en="Select province / city">选择省份/城市</option>
<option>Harare</option><option>Bulawayo</option><option>Manicaland – Mutare</option><option>Mashonaland</option>
</select>
</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="详细地址" data-en="Detailed address">详细地址</span> <span class="req">*</span></label>
<input type="text" class="doc-input" placeholder="Start typing your address...">
<div class="doc-hint" data-zh="支持谷歌地址自动补全" data-en="Google address autocomplete supported">支持谷歌地址自动补全</div>
</div>
</div>
<!-- 收款账户 -->
<div class="doc-section">
<div class="doc-section-label" data-zh="收款账户" data-en="Payout Account">收款账户</div>
<!-- 收款方式:bankAccount(银行转账) / ecocash(手机钱包)— 对齐 Web 端 PayoutMethod -->
<div class="doc-field">
<label class="doc-field-label"><span data-zh="收款方式" data-en="Payout Method">收款方式</span> <span class="req">*</span></label>
<div class="doc-pills">
<label class="doc-pill checked"><input type="radio" name="solePayout" checked=""><span data-zh="银行账户" data-en="Bank Account">银行账户</span></label>
<label class="doc-pill"><input type="radio" name="solePayout"><span data-zh="EcoCash" data-en="EcoCash">EcoCash</span></label>
</div>
</div>
<!-- 银行账户字段(bankAccount 选中时显示) -->
<div class="doc-field-row">
<div class="doc-field"><label class="doc-field-label"><span data-zh="银行代码" data-en="Bank Code">银行代码</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="e.g. CBZ"></div>
<div class="doc-field"><label class="doc-field-label"><span data-zh="银行名称" data-en="Bank Name">银行名称</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="Bank name"></div>
</div>
<div class="doc-field-row">
<div class="doc-field"><label class="doc-field-label"><span data-zh="账户名称" data-en="Account Name">账户名称</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="Account holder name"></div>
<div class="doc-field"><label class="doc-field-label"><span data-zh="账号/卡号" data-en="Account / Card No.">账号/卡号</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="Account number"></div>
</div>
<!-- EcoCash 字段(ecocash 选中时显示) -->
<div class="doc-field-row">
<div class="doc-field"><label class="doc-field-label"><span data-zh="EcoCash 账户名" data-en="EcoCash Account Name">EcoCash 账户名</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="EcoCash account name"></div>
<div class="doc-field"><label class="doc-field-label"><span data-zh="EcoCash 号码" data-en="EcoCash Number">EcoCash 号码</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="EcoCash number"></div>
</div>
</div>
<!-- 商户信息 — 对齐 Web 端 PersonalDetails(legalPerson / idType / idNumber) -->
<div class="doc-section">
<div class="doc-section-label" data-zh="商户信息" data-en="Merchant Info">商户信息</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="法人姓名" data-en="Legal name">法人姓名</span> <span class="req">*</span></label>
<input type="text" class="doc-input" placeholder="e.g. Tendai Moyo">
</div>
<div class="doc-field-row">
<div class="doc-field">
<label class="doc-field-label"><span data-zh="证件类型" data-en="ID Type">证件类型</span> <span class="req">*</span></label>
<div class="doc-pills">
<label class="doc-pill checked"><input type="radio" name="soleIdType" checked=""><span data-zh="身份证" data-en="National ID">身份证</span></label>
<label class="doc-pill"><input type="radio" name="soleIdType"><span data-zh="护照" data-en="Passport">护照</span></label>
</div>
</div>
<div class="doc-field"><label class="doc-field-label"><span data-zh="证件号" data-en="ID Number">证件号</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="ID number"></div>
</div>
</div>
<!-- 文件上传 — 对齐 Web 端 SoleDocuments:
身份证正反面(idType=nationalId) / 护照(idType=passport)
+ 完税证明 + 完税时间段
+ 特许经营协议(选填) + 特许经营时间段(选填) -->
<div class="doc-section">
<div class="doc-section-label" data-zh="文件上传" data-en="Document Upload">文件上传</div>
<!-- 身份证(idType=nationalId 时显示) -->
<div class="doc-field-row">
<div class="doc-field">
<label class="doc-field-label"><span data-zh="身份证正面" data-en="ID Front">身份证正面</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="身份证反面" data-en="ID Back">身份证反面</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
</div>
<!-- 护照(idType=passport 时显示,替换身份证) -->
<div class="doc-field">
<label class="doc-field-label"><span data-zh="护照" data-en="Passport">护照</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
<!-- 完税时间段(必填) -->
<div class="doc-field-row">
<div class="doc-field"><label class="doc-field-label"><span data-zh="完税开始时间" data-en="Tax Payment Start">完税开始时间</span> <span class="req">*</span></label><input type="date" class="doc-input"></div>
<div class="doc-field"><label class="doc-field-label"><span data-zh="完税结束时间" data-en="Tax Payment End">完税结束时间</span> <span class="req">*</span></label><input type="date" class="doc-input"></div>
</div>
<!-- 完税证明(必填) -->
<div class="doc-field">
<label class="doc-field-label"><span data-zh="完税证明" data-en="Tax Payment Certificate">完税证明</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
<!-- 特许经营时间段(选填) -->
<div class="doc-field-row">
<div class="doc-field"><label class="doc-field-label"><span data-zh="特许经营开始时间" data-en="Franchise Start">特许经营开始时间</span> <span class="opt">(optional)</span></label><input type="date" class="doc-input"></div>
<div class="doc-field"><label class="doc-field-label"><span data-zh="特许经营结束时间" data-en="Franchise End">特许经营结束时间</span> <span class="opt">(optional)</span></label><input type="date" class="doc-input"></div>
</div>
<!-- 特许经营协议(选填) -->
<div class="doc-field">
<label class="doc-field-label"><span data-zh="特许经营协议" data-en="Franchise Agreement">特许经营协议</span> <span class="opt">(optional)</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
</div>
</div>
<div class="doc-bottom-bar">
<div class="doc-btn-row">
<button class="doc-btn-outline" onclick="scrollToPage('screenSuccess')" data-zh="上一步" data-en="Previous">上一步</button>
<button class="doc-btn-primary" data-zh="提交申请" data-en="Submit Application">提交申请</button>
</div>
</div>
</div>
</div>
<!-- ═══════════════ Page 6: 企业资质提交 ═══════════════ -->
<div class="screen-wrapper" id="screenDocBiz">
<div class="screen-label"><span>Page 6</span> <span data-zh="企业资质提交" data-en="Business Documents">企业资质提交</span></div>
<div class="phone-frame">
<div class="app-bar">
<button class="back-arrow" onclick="scrollToPage('screenSuccess')">←</button>
<div class="bar-title" data-zh="资质提交" data-en="Documents">资质提交</div>
</div>
<div class="doc-form-scroll">
<!-- 店铺信息 -->
<div class="doc-section">
<div class="doc-section-label" data-zh="店铺信息" data-en="Store Info">店铺信息</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="店铺名称" data-en="Store name">店铺名称</span> <span class="req">*</span></label>
<input type="text" class="doc-input" placeholder="e.g. Kadoma Home Essentials">
</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="店铺 Logo" data-en="Store Logo">店铺 Logo</span> <span class="req">*</span></label>
<div class="doc-upload">
<div class="doc-upload-icon">📤</div>
<div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div>
<div class="doc-upload-sub" data-zh="800x800px, 3MB, JPG/PNG" data-en="800x800px, max 3MB, JPG/PNG">800x800px, 3MB, JPG/PNG</div>
<input type="file" accept=".jpg,.jpeg,.png">
</div>
</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="经营类目" data-en="Business category">经营类目</span> <span class="req">*</span></label>
<div class="doc-pills">
<label class="doc-pill"><input type="checkbox"><span data-zh="时尚服饰" data-en="Fashion & Apparel">时尚服饰</span></label>
<label class="doc-pill"><input type="checkbox"><span data-zh="电子产品" data-en="Electronics">电子产品</span></label>
<label class="doc-pill"><input type="checkbox"><span data-zh="家居生活" data-en="Home & Living">家居生活</span></label>
<label class="doc-pill"><input type="checkbox"><span data-zh="美妆健康" data-en="Beauty & Health">美妆健康</span></label>
<label class="doc-pill"><input type="checkbox"><span data-zh="食品杂货" data-en="Groceries">食品杂货</span></label>
<label class="doc-pill"><input type="checkbox"><span data-zh="母婴用品" data-en="Baby & Kids">母婴用品</span></label>
<label class="doc-pill"><input type="checkbox"><span data-zh="运动户外" data-en="Sports">运动户外</span></label>
<label class="doc-pill"><input type="checkbox"><span data-zh="艺术手工" data-en="Arts & Crafts">艺术手工</span></label>
</div>
</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="省/市/区" data-en="Province / City">省/市/区</span> <span class="req">*</span></label>
<select class="doc-input doc-select">
<option value="" data-zh="选择省份/城市" data-en="Select province / city">选择省份/城市</option>
<option>Harare</option><option>Bulawayo</option><option>Manicaland – Mutare</option><option>Mashonaland</option>
</select>
</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="详细地址" data-en="Detailed address">详细地址</span> <span class="req">*</span></label>
<input type="text" class="doc-input" placeholder="Start typing your address...">
<div class="doc-hint" data-zh="支持谷歌地址自动补全" data-en="Google address autocomplete supported">支持谷歌地址自动补全</div>
</div>
</div>
<!-- 收款账户 — 对齐 Web 端 PayoutCard(bankAccount / ecocash) -->
<div class="doc-section">
<div class="doc-section-label" data-zh="收款账户" data-en="Payout Account">收款账户</div>
<!-- 收款方式:bankAccount(银行转账) / ecocash(手机钱包)— 对齐 Web 端 PayoutMethod -->
<div class="doc-field">
<label class="doc-field-label"><span data-zh="收款方式" data-en="Payout Method">收款方式</span> <span class="req">*</span></label>
<div class="doc-pills">
<label class="doc-pill checked"><input type="radio" name="bizPayout" checked=""><span data-zh="银行账户" data-en="Bank Account">银行账户</span></label>
<label class="doc-pill"><input type="radio" name="bizPayout"><span data-zh="EcoCash" data-en="EcoCash">EcoCash</span></label>
</div>
</div>
<!-- 银行账户字段(bankAccount 选中时显示) -->
<div class="doc-field-row">
<div class="doc-field"><label class="doc-field-label"><span data-zh="银行代码" data-en="Bank Code">银行代码</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="e.g. CBZ"></div>
<div class="doc-field"><label class="doc-field-label"><span data-zh="银行名称" data-en="Bank Name">银行名称</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="Bank name"></div>
</div>
<div class="doc-field-row">
<div class="doc-field"><label class="doc-field-label"><span data-zh="账户名称" data-en="Account Name">账户名称</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="Account holder name"></div>
<div class="doc-field"><label class="doc-field-label"><span data-zh="账号/卡号" data-en="Account / Card No.">账号/卡号</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="Account number"></div>
</div>
<!-- EcoCash 字段(ecocash 选中时显示) -->
<div class="doc-field-row">
<div class="doc-field"><label class="doc-field-label"><span data-zh="EcoCash 账户名" data-en="EcoCash Account Name">EcoCash 账户名</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="EcoCash account name"></div>
<div class="doc-field"><label class="doc-field-label"><span data-zh="EcoCash 号码" data-en="EcoCash Number">EcoCash 号码</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="EcoCash number"></div>
</div>
</div>
<!-- 公司信息 — 对齐 Web 端 BusinessDetails(companyName / businessLicenseNumber / taxZimraRef / taxRegistrationCertificate) -->
<div class="doc-section">
<div class="doc-section-label" data-zh="公司信息" data-en="Company Info">公司信息</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="公司名称" data-en="Company name">公司名称</span> <span class="req">*</span></label>
<input type="text" class="doc-input" placeholder="e.g. Kadoma Home Essentials (Pvt) Ltd">
</div>
<div class="doc-field-row">
<div class="doc-field"><label class="doc-field-label"><span data-zh="公司注册号" data-en="Business License Number">公司注册号</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="e.g. 1234/2023"></div>
<div class="doc-field"><label class="doc-field-label"><span data-zh="TIN 纳税人识别号" data-en="TIN (ZIMRA Ref)">TIN 纳税人识别号</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="ZIMRA Business Partner Number"></div>
</div>
<div class="doc-field"><label class="doc-field-label"><span data-zh="税务登记证号" data-en="Tax Registration Certificate">税务登记证号</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="Tax registration certificate number"></div>
</div>
<!-- 联系人信息 — 对齐 Web 端 BusinessDetails(primaryContactLegalName / primaryContactRole / primaryContactIdType / primaryContactIdNumber / primaryContactEmail) -->
<div class="doc-section">
<div class="doc-section-label" data-zh="联系人信息" data-en="Contact Person">联系人信息</div>
<div class="doc-field-row">
<div class="doc-field"><label class="doc-field-label"><span data-zh="联系人姓名" data-en="Contact Legal Name">联系人姓名</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="Director / authorised representative"></div>
<div class="doc-field"><label class="doc-field-label"><span data-zh="联系人职务" data-en="Contact Role">联系人职务</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="e.g. Managing Director"></div>
</div>
<div class="doc-field-row">
<div class="doc-field">
<label class="doc-field-label"><span data-zh="证件类型" data-en="ID Type">证件类型</span> <span class="req">*</span></label>
<div class="doc-pills">
<label class="doc-pill checked"><input type="radio" name="bizIdType" checked=""><span data-zh="身份证" data-en="National ID">身份证</span></label>
<label class="doc-pill"><input type="radio" name="bizIdType"><span data-zh="护照" data-en="Passport">护照</span></label>
</div>
</div>
<div class="doc-field"><label class="doc-field-label"><span data-zh="证件号" data-en="ID Number">证件号</span> <span class="req">*</span></label><input type="text" class="doc-input" placeholder="ID / Passport number"></div>
</div>
<div class="doc-field"><label class="doc-field-label"><span data-zh="联系人邮箱" data-en="Contact Email">联系人邮箱</span> <span class="req">*</span></label><input type="email" class="doc-input" placeholder="contact@company.com"></div>
</div>
<!-- 文件上传 — 联系人证件(对齐 Web 端 BusinessDocuments.contactIdFrontKey / contactIdBackKey / contactPassportKey) -->
<div class="doc-section">
<div class="doc-section-label" data-zh="联系人证件" data-en="Contact Person ID">联系人证件</div>
<!-- 身份证(idType=nationalId 时显示) -->
<div class="doc-field-row">
<div class="doc-field">
<label class="doc-field-label"><span data-zh="身份证正面" data-en="ID Front">身份证正面</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="身份证反面" data-en="ID Back">身份证反面</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
</div>
<!-- 护照(idType=passport 时显示,替换身份证) -->
<div class="doc-field">
<label class="doc-field-label"><span data-zh="护照" data-en="Passport">护照</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
</div>
<!-- 企业资质 -->
<div class="doc-section">
<div class="doc-section-label" data-zh="企业资质" data-en="Company Credentials">企业资质</div>
<div class="doc-field-row">
<div class="doc-field">
<label class="doc-field-label"><span data-zh="公司注册证书" data-en="Certificate of Incorporation">公司注册证书</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="CR 14 文件" data-en="CR 14 Document">CR 14 文件</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
</div>
<div class="doc-field-row">
<div class="doc-field">
<label class="doc-field-label"><span data-zh="企业章程" data-en="Company Bylaws">企业章程</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="VAT 文件" data-en="VAT Document">VAT 文件</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="地址证明" data-en="Proof of address">地址证明</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub" data-zh="水电账单等" data-en="Utility bill etc.">水电账单等</div><input type="file"></div>
</div>
</div>
<!-- 董事1 证件 — 对齐 Web 端 BusinessDocuments.director1IdFrontKey / director1IdBackKey / director1PassportKey -->
<div class="doc-section">
<div class="doc-section-label" data-zh="董事1 证件" data-en="Director 1 ID">董事1 证件</div>
<!-- 身份证(默认) -->
<div class="doc-field-row">
<div class="doc-field">
<label class="doc-field-label"><span data-zh="董事1 证件正面" data-en="Director 1 ID Front">董事1 证件正面</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="董事1 证件反面" data-en="Director 1 ID Back">董事1 证件反面</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
</div>
<!-- 护照(passport 时显示,替换身份证) -->
<div class="doc-field">
<label class="doc-field-label"><span data-zh="董事1 护照" data-en="Director 1 Passport">董事1 护照</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
</div>
<!-- 董事2 证件 — 对齐 Web 端 BusinessDocuments.director2IdFrontKey / director2IdBackKey / director2PassportKey -->
<div class="doc-section">
<div class="doc-section-label" data-zh="董事2 证件" data-en="Director 2 ID">董事2 证件</div>
<!-- 身份证(默认) -->
<div class="doc-field-row">
<div class="doc-field">
<label class="doc-field-label"><span data-zh="董事2 证件正面" data-en="Director 2 ID Front">董事2 证件正面</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="董事2 证件反面" data-en="Director 2 ID Back">董事2 证件反面</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
</div>
<!-- 护照(passport 时显示,替换身份证) -->
<div class="doc-field">
<label class="doc-field-label"><span data-zh="董事2 护照" data-en="Director 2 Passport">董事2 护照</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
</div>
<!-- 税务与特许经营 — 对齐 Web 端 BusinessDocuments.taxPaymentStart/End + taxPaymentCertificateKey + franchiseStart/End + franchiseAgreementKey -->
<div class="doc-section">
<div class="doc-section-label" data-zh="税务与特许经营" data-en="Tax & Franchise">税务与特许经营</div>
<!-- 完税时间段(必填) -->
<div class="doc-field-row">
<div class="doc-field">
<label class="doc-field-label"><span data-zh="完税开始时间" data-en="Tax Payment Start">完税开始时间</span> <span class="req">*</span></label>
<input type="date" class="doc-input">
</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="完税结束时间" data-en="Tax Payment End">完税结束时间</span> <span class="req">*</span></label>
<input type="date" class="doc-input">
</div>
</div>
<!-- 完税证明(必填) -->
<div class="doc-field">
<label class="doc-field-label"><span data-zh="完税证明" data-en="Tax Payment Certificate">完税证明</span> <span class="req">*</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
<!-- 特许经营时间段(选填) -->
<div class="doc-field-row">
<div class="doc-field">
<label class="doc-field-label"><span data-zh="特许经营开始时间" data-en="Franchise Start">特许经营开始时间</span> <span class="opt">(optional)</span></label>
<input type="date" class="doc-input">
</div>
<div class="doc-field">
<label class="doc-field-label"><span data-zh="特许经营结束时间" data-en="Franchise End">特许经营结束时间</span> <span class="opt">(optional)</span></label>
<input type="date" class="doc-input">
</div>
</div>
<!-- 特许经营协议(选填) -->
<div class="doc-field">
<label class="doc-field-label"><span data-zh="特许经营协议" data-en="Franchise Agreement">特许经营协议</span> <span class="opt">(optional)</span></label>
<div class="doc-upload"><div class="doc-upload-icon">📤</div><div class="doc-upload-label" data-zh="点击上传" data-en="Click to upload">点击上传</div><div class="doc-upload-sub">JPG, PNG, PDF</div><input type="file"></div>
</div>
</div>
</div>
<div class="doc-bottom-bar">
<div class="doc-btn-row">
<button class="doc-btn-outline" onclick="scrollToPage('screenSuccess')" data-zh="上一步" data-en="Previous">上一步</button>
<button class="doc-btn-primary" data-zh="提交申请" data-en="Submit Application">提交申请</button>
</div>
</div>
</div>
</div>
</div><!-- .screens -->
<script>
// ═══════════════ Language ═══════════════
var currentLang = 'zh';
function switchLang(lang) {
currentLang = lang;
document.querySelectorAll('.lang-btn').forEach(function(btn) {
btn.classList.toggle('active', btn.getAttribute('data-lang') === lang);
});
document.querySelectorAll('[data-' + lang + ']').forEach(function(el) {
var text = el.getAttribute('data-' + lang);
if (text) el.textContent = text;
});
document.querySelectorAll('[data-placeholder-' + lang + ']').forEach(function(el) {
var ph = el.getAttribute('data-placeholder-' + lang);
if (ph) el.placeholder = ph;
});
document.documentElement.lang = lang === 'zh' ? 'zh-CN' : 'en';
}
// ═══════════════ Navigation ═══════════════
function scrollToPage(id) {
var el = document.getElementById(id);
if (el) el.scrollIntoView({ behavior: 'smooth', block: 'start' });
}
// ═══════════════ Form Helpers ═══════════════
function clearInput(id) {
var input = document.getElementById(id);
if (!input) return;
input.value = '';
input.classList.remove('has-value');
input.focus();
}
function togglePwd(id, btn) {
var input = document.getElementById(id);
if (input.type === 'password') {
input.type = 'text';
btn.innerHTML = '👀';
} else {
input.type = 'password';
btn.innerHTML = '👁';
}
}
// ═══════════════ OTP Countdown ═══════════════
var otpSeconds = 63;
var otpInterval = setInterval(function() {
otpSeconds--;
var timerEl = document.getElementById('otpTimer');
if (timerEl) timerEl.textContent = otpSeconds;
if (otpSeconds <= 0) {
clearInterval(otpInterval);
if (timerEl) {
timerEl.textContent = '0';
timerEl.style.color = '#bfbfbf';
}
}
}, 1000);
// ═══════════════ Pill Toggle (for doc-pills) ═══════════════
document.addEventListener('click', function(e) {
var pill = e.target.closest('.doc-pill');
if (!pill) return;
var input = pill.querySelector('input');
if (!input) return;
if (input.type === 'radio') {
var name = input.name;
pill.parentElement.querySelectorAll('.doc-pill').forEach(function(p) {
p.classList.remove('checked');
});
pill.classList.add('checked');
input.checked = true;
} else if (input.type === 'checkbox') {
pill.classList.toggle('checked');
input.checked = !input.checked;
}
});
// Initialize language to Chinese on page load
switchLang('zh');
</script>
</body>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836