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

{% block head_title %}{% trans "Phone Verification" %}{% 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 "Enter Phone Verification Code" %}</h1>
  <p class="text-center mb-4">
    <a class="text-primary underline" href="tel:{{ phone }}">{{ phone }}</a>
  </p>
  {% url 'account_verify_phone' as action_url %}
  <form method="post" action="{{ action_url }}" class="space-y-4">
    {% csrf_token %}
    {{ form.non_field_errors }}
    <div>
      <label for="{{ form.code.id_for_label }}" class="block font-medium>{% trans "Verification Code" %}</label>
      {{ form.code }}
      {{ form.code.errors }}
    </div>
    <button type="submit" class="btn btn-primary w-full">{% trans "Confirm" %}</button>
  </form>
</div>
{% endblock content %}