{% extends "cabinet/base_auth.html" %}
{% load i18n %}

{% block title %}{% trans "Create Account" %}{% endblock %}

{% block cabinet_content %}
<div class="cab-auth__wrap">
  <div class="cab-auth__card">

    <div class="cab-auth__logo">
      <span class="cab-auth__logo-icon">&#9670;</span>
      <span class="cab-auth__logo-name">{{ SITE_NAME|default:"Cabinet" }}</span>
    </div>

    <p class="cab-auth__title">{% trans "Create Account" %}</p>

    {% if form.non_field_errors %}
    <div class="cab-auth__alert">{{ form.non_field_errors }}</div>
    {% endif %}

    <form class="cab-auth__form" method="post" action="{% url 'account_signup' %}">
      {% csrf_token %}

      {% for field in form %}
      <div class="cab-auth__field">
        <div class="cab-auth__label-row">
          <label class="cab-auth__label" for="{{ field.id_for_label }}">{{ field.label }}</label>
        </div>
        <input
          class="cab-auth__input{% if field.errors %} cab-auth__input--error{% endif %}"
          type="{{ field.field.widget.input_type }}"
          name="{{ field.html_name }}"
          id="{{ field.id_for_label }}"
          {% if field.value %}value="{{ field.value }}"{% endif %}
          autocomplete="{{ field.field.widget.attrs.autocomplete|default:'' }}"
        >
        {% if field.errors %}
        <span class="cab-auth__error">{{ field.errors.0 }}</span>
        {% endif %}
      </div>
      {% endfor %}

      {{ redirect_field }}

      <button type="submit" class="cab-auth__submit">
        {% trans "Create Account" %}
      </button>
    </form>

    <div class="cab-auth__footer">
      <a class="cab-auth__link" href="{% url 'account_login' %}">
        {% trans "Already have an account? Sign in" %}
      </a>
    </div>

  </div>
</div>
{% endblock %}