{% extends "base.html" %}
{% block title %}Create New Account - QuantVAT{% endblock %} 
{% block description %}Register new account to access QuantVAT and start performing crypto cross-market analysis and generate PDF reports free
{% endblock %} 
{% block og_title %}Create New Account - QuantVAT{% endblock %} 
{% block og_description %}Register new account to access QuanrVAT and start performing crypto cross-market analysis and generate PDF reports free{% endblock %} 
{% block keywords %}register, secure access, crypto dashboard, cryptovat, trading tools{% endblock %} 
{% block content %}
<div class="container">
    <h1>📝 Create New Account</h1>
    <div class="card">
       <p>Create account to be part of this community where we use cross-market data to our advantage. It is fast, easy, and free.</p>
    </div>
    <div class="card">
        {% if error %}
        <div class="error-message">⚠️ {{ error }}</div>
        {% endif %}
        
        <form method="POST">
            <label>Email Address</label>
            <input type="email" name="email" required placeholder="email@example.com" autocomplete="email">
            
            <label style="margin-top:15px; display:block;">Password</label>
            <div class="password-wrapper">
                <input type="password" id="reg-pass" name="password" required minlength="6" autocomplete="new-password">
                <button type="button" class="toggle-btn" onclick="togglePassword('reg-pass', this)" title="Show Password">
                    <svg class="icon-eye" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path><circle cx="12" cy="12" r="3"></circle></svg>
                    <svg class="icon-eye-off" style="display:none;" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24"></path><line x1="1" y1="1" x2="23" y2="23"></line></svg>
                </button>
            </div>
            <button type="submit" class="btn btn-green">CREATE ACCOUNT</button>
        </form>
    </div>
    
    <div style="text-align:center; margin-top:20px; display:flex; justify-content:center; gap:15px;">
        <a href="{{ url_for('auth.login') }}" class="link" style="float:none;">Already have an account?</a>
    </div>
</div>
{% include 'includes/partials/pwa_prompt.html' %}
{% endblock %}