{% extends 'core/mobile/base_mobile.html' %}
{% block content %}
<div class="p-3">
    <div class="mb-4">
        <a href="{% url 'core:profile' %}" class="text-decoration-none text-secondary small"><i class="bi bi-chevron-left"></i> 返回</a>
        <h4 class="fw-bold mt-2">充值 USDT</h4>
    </div>

    <div class="glass-card p-3 mb-3">
        <div class="text-secondary x-small mb-2">选择币种</div>
        <div class="bg-dark p-2 rounded d-flex justify-content-between align-items-center mb-3">
            <span class="fw-bold">USDT</span>
            <span class="badge bg-warning text-dark">TRC20</span>
        </div>

        <div class="text-center py-4 bg-white rounded mb-3">
            <img src="https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=TFA7S7S7S7S7S7S7S7S7S7S7S7S7S7" alt="QR" style="width: 120px;">
        </div>

        <div class="text-secondary x-small mb-1">充值地址</div>
        <div class="input-group input-group-sm mb-3">
            <input type="text" class="form-control" value="TFA7S7S7S7S7S7S7S7S7S7S7S7S7S7" readonly>
            <button class="btn btn-warning" onclick="alert('已复制')">复制</button>
        </div>

        <div class="alert alert-dark x-small py-2">
            <i class="bi bi-info-circle me-1"></i> 请务必确认网络为 TRC20，否则资产将无法找回。
        </div>
    </div>

    <form method="POST" class="glass-card p-3">
        {% csrf_token %}
        <div class="mb-3">
            <label class="form-label small text-secondary">充值金额</label>
            <input type="number" name="amount" class="form-control" placeholder="请输入充值金额" required>
        </div>
        <div class="mb-3">
            <label class="form-label small text-secondary">交易哈希 (TXID)</label>
            <input type="text" name="tx_id" class="form-control" placeholder="请输入流水号" required>
        </div>
        <button type="submit" class="btn btn-warning w-100 fw-bold">提交充值申请</button>
    </form>
</div>
{% endblock %}