{% extends "ecp_auth/base.html" %}

{% block title %}ECP Registration{% endblock %}
{% block header_title %}Register{% endblock %}
{% block header_subtitle %}Create an account with your digital certificate{% endblock %}

{% block content %}
<form method="post" enctype="multipart/form-data" class="ecp-form" id="ecp-register-form">
    {{ csrf_input }}

    <div class="ecp-form-group">
        <label for="id_username" class="ecp-label">👤 Username</label>
        {{ form.username }}
        {% if form.username.errors %}
        <div class="ecp-field-error">{{ form.username.errors[0] }}</div>
        {% endif %}
    </div>

    <div class="ecp-form-group">
        <label for="id_email" class="ecp-label">✉️ Email Address (optional)</label>
        {{ form.email }}
        {% if form.email.errors %}
        <div class="ecp-field-error">{{ form.email.errors[0] }}</div>
        {% endif %}
    </div>

    <div class="ecp-form-group">
        <label for="id_register_pkcs12_file" class="ecp-label">📄 Certificate File (.p12 / .pfx)</label>
        {{ form.pkcs12_file }}
        {% if form.pkcs12_file.errors %}
        <div class="ecp-field-error">{{ form.pkcs12_file.errors[0] }}</div>
        {% endif %}
        <p class="ecp-help-text">Upload your PKCS#12 certificate file</p>
    </div>

    <div class="ecp-form-group">
        <label for="id_register_pkcs12_password" class="ecp-label">🔑 Certificate Password</label>
        {{ form.pkcs12_password }}
        {% if form.pkcs12_password.errors %}
        <div class="ecp-field-error">{{ form.pkcs12_password.errors[0] }}</div>
        {% endif %}
        <p class="ecp-help-text">Leave blank if no password is set</p>
    </div>

    {% if form.non_field_errors() %}
    <div class="ecp-alert ecp-alert-error">
        {% for error in form.non_field_errors() %}
        <p>{{ error }}</p>
        {% endfor %}
    </div>
    {% endif %}

    <button type="submit" class="ecp-btn ecp-btn-primary" id="btn-register-submit">
        📝 Register
    </button>
</form>
{% endblock %}

{% block footer %}
<p class="ecp-footer-text">
    Already have an account?
    <a href="{{ url('ecp_auth:login') }}" class="ecp-link">Sign in with certificate</a>
</p>
{% endblock %}

{% block extra_scripts %}
<script src="{{ static('ecp_auth/js/ecp.js') }}"></script>
{% endblock %}