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

{% block content %}
{% if mode == "create" %}
    <h2>Neuer Account: {{ username }}</h2>
    <p>Merk dir diesen Namen: <b>{{ username }}</b>. Du brauchst ihn beim nächsten Login.</p>
    <p>Wähl eine 3-stellige PIN.</p>
{% elif mode == "claim" %}
    <h2>Account übernehmen: {{ username }}</h2>
    <p>Dieser Account hat noch keine PIN und keine Buchungen. Setz jetzt eine 3-stellige PIN, um ihn zu übernehmen.</p>
{% else %}
    <h2>Hallo {{ username }}</h2>
    <p>Gib deine 3-stellige PIN ein.</p>
{% endif %}

{% if error %}<p class="error">{{ error }}</p>{% endif %}

<form method="post" action="{% url 'suff:pin' %}">
    {% csrf_token %}
    <label>
        PIN:
        <input type="text" name="pin" inputmode="numeric" pattern="[0-9]{3}" maxlength="3"
               minlength="3" required autofocus autocomplete="off" />
    </label>
    <button type="submit">
        {% if mode == "create" %}Account anlegen{% elif mode == "claim" %}Account übernehmen{% else %}Login{% endif %}
    </button>
</form>

<p>
    Nicht du / keine PIN / vergessen?
    <a href="{% url 'suff:name' %}">Zurück und neuen Namen wählen</a>
</p>
{% endblock %}