{% extends 'base.html' %}
{% load allauth i18n %}

{% block head_title %}{% trans "Signup" %}{% endblock head_title %}

{% block content %}
<div class="container mx-auto max-w-md mt-6">
  <h1 class="text-3xl font-bold text-center mb-6">{% trans "Passkey Sign Up" %}</h1>
  <p class="mb-4 text-center">
    {% blocktranslate %}
      Already have an account? Then please <a href="{{ login_url }}" class="text-primary underline">{% trans "sign in" %}</a>.
    {% endblocktranslate %}
  </p>
  {% url 'account_signup_by_passkey' as action_url %}
  <form method="post" action="{{ action_url }}" class="space-y-4">
    {% csrf_token %}
    {{ form.non_field_errors }}
    {% for field in form %}
      <div>
        <label for="{{ field.id_for_label }}" class="block font-medium>{{ field.label }}</label>
        {{ field }}
        {{ field.errors }}
      </div>
    {% endfor %}
    {{ redirect_field }}
    <button type="submit" class="btn btn-primary w-full">{% trans "Sign Up" %}</button>
  </form>
  <hr class="my-6">
  <div class="text-center">
    <a href="{{ signup_url }}" class="btn btn-outline-primary">{% trans "Other options" %}</a>
  </div>
</div>
{% endblock content %}