<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
  <link rel="icon" href="{{ site_branding.favicon_url }}">
    <title>商家入驻申请 - {{ site_branding.browser_title }}</title>
    <style>
        * { box-sizing: border-box; }
        body { margin:0; font-family:Arial, "Microsoft YaHei", sans-serif; background:#f5f5f7; color:#222; }
        a { text-decoration:none; color:inherit; }

        .topbar { background:#111; color:#fff; padding:14px 24px; }
        .topbar-inner {
            width:1200px; max-width:calc(100vw - 48px); margin:0 auto;
            display:flex; justify-content:space-between; align-items:center; gap:24px;
        }
        .topbar-brand a { color:#fff; font-size:20px; font-weight:800; }
        .topbar-links { display:flex; align-items:center; gap:18px; flex-wrap:wrap; justify-content:flex-end; }
        .topbar-links a, .topbar-links span { color:#f3f3f3; font-size:14px; white-space:nowrap; }

        .container { width:900px; max-width:calc(100vw - 48px); margin:24px auto; }
        .card {
            background:#fff; border-radius:18px; padding:24px;
            box-shadow:0 2px 10px rgba(0,0,0,0.05); margin-bottom:18px;
        }
        .title { margin:0 0 16px; font-size:28px; font-weight:800; }
        .field { margin-bottom:14px; }
        .field label { display:block; margin-bottom:8px; font-size:14px; font-weight:700; }
        .field input, .field textarea {
            width:100%; border:1px solid #ddd; border-radius:10px; font-size:15px;
            padding:12px;
        }
        .field textarea { min-height:120px; resize:vertical; }
        .btn {
            display:inline-block; padding:10px 16px; border:none; border-radius:10px;
            background:#111; color:#fff; font-size:14px; cursor:pointer;
        }
        .msg { margin-bottom:14px; padding:12px 14px; border-radius:12px; font-size:14px; line-height:1.7; }
        .ok { background:#f2fff4; color:#157a28; border:1px solid #c9f0d0; }
        .err { background:#fff3f3; color:#c40000; border:1px solid #ffd0d0; }
        .muted { color:#666; font-size:14px; line-height:1.8; }
        .status {
            display:inline-block; padding:6px 10px; border-radius:999px; font-size:13px; font-weight:700;
            background:#f5f5f5;
        }
    </style>
</head>
<body>
    <div class="topbar">
        <div class="topbar-inner">
            <div class="topbar-brand"><a href="/">{{ site_branding.site_name }}</a></div>
            <div class="topbar-links">
                <a href="/">首页</a>
                <a href="/products">全部商品</a>
                <a href="/account">用户主页</a>
                <a href="/logout">退出</a>
            </div>
        </div>
    </div>

    <div class="container">
        <div class="card">
            <h1 class="title">商家入驻申请</h1>
            <div class="muted">提交入驻申请后，需要管理员审核通过，才能访问商家后台。</div>
        </div>

        {% if message %}
            <div class="msg ok">{{ message }}</div>
        {% endif %}
        {% if error %}
            <div class="msg err">{{ error }}</div>
        {% endif %}

        {% if app_row %}
        <div class="card">
            <h2 style="margin-top:0;">当前申请状态</h2>
            <p><strong>店铺名称：</strong>{{ app_row.shop_name }}</p>
            <p><strong>联系人：</strong>{{ app_row.contact_name }}</p>
            <p><strong>联系电话：</strong>{{ app_row.contact_phone }}</p>
            <p><strong>申请状态：</strong>
                <span class="status">
                    {% if app_row.status == 0 %}待审核{% elif app_row.status == 1 %}已通过{% else %}已拒绝{% endif %}
                </span>
            </p>
            <p><strong>审核备注：</strong>{{ app_row.review_remark or '暂无' }}</p>
            <p><strong>提交时间：</strong>{{ app_row.created_at }}</p>
            {% if app_row.status == 1 %}
                <p><a class="btn" href="/merchant/dashboard">进入商家后台</a></p>
            {% endif %}
        </div>
        {% endif %}

        {% if not app_row or app_row.status != 0 %}
        <div class="card">
            <h2 style="margin-top:0;">填写申请信息</h2>
            <form method="post">
                <div class="field">
                    <label>店铺名称</label>
                    <input type="text" name="shop_name" maxlength="100" required>
                </div>
                <div class="field">
                    <label>联系人</label>
                    <input type="text" name="contact_name" maxlength="50" required>
                </div>
                <div class="field">
                    <label>联系电话</label>
                    <input type="text" name="contact_phone" maxlength="30" required>
                </div>
                <div class="field">
                    <label>经营范围</label>
                    <input type="text" name="business_scope" maxlength="255">
                </div>
                <div class="field">
                    <label>申请理由</label>
                    <textarea name="application_reason" maxlength="500"></textarea>
                </div>
                <button class="btn" type="submit">提交申请</button>
            </form>
        </div>
        {% endif %}
    </div>
</body>
</html>
