{{template "layout/header.html" .}}
<body>

{{template "layout/nav.html" .}}

<main class="auth-page">
    <div class="auth-card">
        {{if .IsMaintenance}}
        <h2>系统维护中</h2>
        <p class="auth-subtitle">社区正在维护升级，期间仅站长可访问</p>
        <div class="registration-closed">
            <p class="closed-message">请耐心等待，维护完成后将恢复注册与访问</p>
        </div>
        {{else if .RegistrationEnabled}}
        <h2>创建账号</h2>
        <p class="auth-subtitle">加入 MetaLab 开发者社区</p>
        <form id="registerForm" novalidate>
            <input type="hidden" name="csrf_token" value="{{.CSRFToken}}">
            <div class="form-group">
                <label for="email">邮箱地址</label>
                <input type="email" id="email" placeholder="your@email.com" required>
                <span class="form-error" id="emailError">请输入有效的邮箱地址</span>
            </div>
            <div class="form-group">
                <label for="password">密码</label>
                <input type="password" id="password" placeholder="至少 8 位，包含字母与数字" required minlength="8">
                <span class="form-error" id="passwordError">密码至少 8 位，需包含字母与数字</span>
            </div>
            <div class="form-group">
                <label for="confirmPassword">确认密码</label>
                <input type="password" id="confirmPassword" placeholder="请再次输入密码" required>
                <span class="form-error" id="confirmPasswordError">两次输入的密码不一致</span>
            </div>
            <div class="form-group remember-group">
                <label class="remember-label">
                    <input type="checkbox" id="rememberMe">
                    保持登录 30 天
                </label>
                <span class="remember-hint">非共享设备推荐</span>
            </div>
            <p class="guidelines-link">点击注册即表示同意 <a href="javascript:void(0)" id="openGuidelines">《MetaLab 社区用户准则》</a></p>
            <button type="submit" class="submit-btn" id="submitBtn">注 册</button>
        </form>
        {{else}}
        <h2>暂停注册</h2>
        <p class="auth-subtitle">新用户注册暂时关闭</p>
        <div class="registration-closed">
            <p class="closed-message">当前暂不开放注册，敬请期待</p>
            <p class="closed-subtitle">如需加入社区，请关注后续开放通知</p>
        </div>
        {{end}}
        <div class="auth-footer">
            已有账号？<a href="/auth/login">立即登录</a>
        </div>
    </div>
</main>

<!-- 社区准则模态框 -->
<div class="modal-overlay" id="modalOverlay">
    <div class="modal">
        <div class="modal-header">
            <h3>MetaLab 社区用户准则</h3>
            <button class="modal-close" id="modalClose">&times;</button>
        </div>
        <div class="modal-body" id="modalBody">
            {{.Guidelines}}
        </div>
        <div class="modal-footer">
            <div id="modalEnforce">
                <div class="timer" id="timer">
                    <span id="timerLabel">剩余阅读时间</span>
                    <span class="count" id="timerCount">60</span>
                    <span id="timerUnit">秒</span>
                    <span id="timerDone" style="display:none">✓ 阅读时间已满足</span>
                </div>
                <span class="scroll-hint" id="scrollHint">▼ 请滚动至底部完成阅读</span>
            </div>
            <button class="confirm-btn" id="confirmBtn" disabled>我已完整阅读并同意</button>
            <button class="confirm-btn" id="previewCloseBtn" style="display:none">关 闭</button>
        </div>
    </div>
</div>

<div class="toast" id="toast"></div>

{{template "layout/footer.html" .}}

<button class="scroll-top-btn" id="scrollTopBtn">
    <svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="12" y1="19" x2="12" y2="5"/><polyline points="5 12 12 5 19 12"/></svg>
</button>

<script src="/static/js/common.js?v={{assetV "/static/js/common.js"}}"></script>
<script src="/static/js/register.js?v={{assetV "/static/js/register.js"}}"></script>
</body>
</html>
