{% extends "base.html" %}
{% block title %}Personalisierung — Tuxflotte{% endblock %}
{% block content %}
<article style="max-width: 30rem; margin: 3rem auto;">
    <h2>Persönliches Konto einrichten</h2>
    <p>{{ pruefung.organisation }}{% if pruefung.hostname %}, Gerät <strong>{{ pruefung.hostname }}</strong>{% endif %}</p>
    {% if fehler %}<p><mark>{{ fehler }}</mark></p>{% endif %}
    <form method="post" action="/personalisierung/einreichen">
        <input type="hidden" name="kiosk" value="{{ 1 if kiosk else 0 }}">
        <input type="hidden" name="code" value="{{ code }}">

        {% if pruefung.domaenen %}
        <label for="email_lokal">E-Mail-Adresse deiner Einrichtung</label>
        <fieldset role="group">
            <input type="text" id="email_lokal" name="email_lokal" required autocomplete="off"
                   value="{{ werte.email_lokal or '' }}" placeholder="vorname.nachname">
            {% if pruefung.domaenen | length == 1 %}
            <input type="hidden" name="email_domain" value="{{ pruefung.domaenen[0] }}">
            <input type="text" value="@{{ pruefung.domaenen[0] }}" readonly tabindex="-1" aria-label="Domäne">
            {% else %}
            <select name="email_domain" aria-label="Domäne">
                {% for d in pruefung.domaenen %}
                <option value="{{ d }}" {% if werte.email_domain == d %}selected{% endif %}>@{{ d }}</option>
                {% endfor %}
            </select>
            {% endif %}
        </fieldset>
        {% else %}
        <label for="email">E-Mail-Adresse</label>
        <input type="email" id="email" name="email" required autocomplete="off" value="{{ werte.email or '' }}">
        {% endif %}
        <small>Dorthin kommt ein Bestätigungslink. Die Verwaltung deiner Einrichtung sieht, wer dieses Gerät personalisiert hat.</small>

        <label for="anmeldename">Anmeldename</label>
        <input type="text" id="anmeldename" name="anmeldename" required autocomplete="off" spellcheck="false"
               pattern="[a-z][a-z0-9._\-]{1,30}" maxlength="31" value="{{ werte.anmeldename or '' }}">
        <small>Kleinbuchstaben, Ziffern, Punkt, Binde- und Unterstrich; beginnt mit einem Buchstaben.</small>

        <label for="passwort">Passwort</label>
        <input type="password" id="passwort" name="passwort" required minlength="8" maxlength="128" autocomplete="new-password">
        <small>Mindestens 8 Zeichen. Vergessen? Die Verwaltung kann es zurücksetzen.</small>
        <label for="passwort_wiederholung">Passwort (Wiederholung)</label>
        <input type="password" id="passwort_wiederholung" name="passwort_wiederholung" required minlength="8" maxlength="128" autocomplete="new-password">

        <button type="submit">Konto beantragen</button>
    </form>
    {% include "_personalisierung_abmelden.html" %}
</article>
{% endblock %}