{% extends "base.html" %}
{% load i18n %}

{% block title %}
  {% trans "Changer de mot de passe" %}
{% endblock %}

{% block content %}
{% if validlink %}
<div class="segment full whitespace-normal form">

  <form class="segment half sm-full whitespace-normal" method="POST" action=".">
    {% csrf_token %}

    <div class="segment margin-bottom-medium full padding-right-small sm-padding-none text-small text-semibold text-uppercase text-color-heading">
      <label for="id_new_password1">NEW PASSWORD</label>
      {{ form.new_password1 }}
    </div>
    <div class="segment margin-bottom-medium full padding-right-small sm-padding-none text-small text-semibold text-uppercase text-color-heading">
      <label for="id_new_password2">NEW PASSWORD CONFIRMATION</label>
      {{ form.new_password2 }}
    </div>

    {% if form.errors and not form.non_field_errors %}
    <div class='segment full margin-bottom-xsmall whitespace-normal'>
      <span class='text-bold text-color-primary'>{% if form.errors.items|length == 1 %}Passwords do not match. Please retype.{% endif %}</span>
    </div>
    {% endif %}

    {% if form.non_field_errors %}
    {% for error in form.non_field_errors %}
    <div class='segment full margin-bottom-xsmall whitespace-normal'>
      <span class='text-bold text-color-primary'>{{ error }}</span>
    </div>
    {% endfor %}
    {% endif %}

    <div class="submit-button segment full margin-top-xsmall text-xsmall children-link-button children-button-icon children-link-text-bold children-link-text-uppercase color-secondary bordered children-icon-rocket children-icon-small children-icon-margin-right-xsmall">
      <button style="background-color: var(--color-primary); color: white" type="submit">Submit</button>
    </div>
  </form>
  <div class="segment full margin-top-large">
    <a class="link" style="color: var(--color-primary); font-size: 0.8em;" href="https://bsgn.spacecoop.eu/legal_T&C.html">Terms & Conditions</a>&nbsp;-&nbsp;<a class="link" style="color: var(--color-primary); font-size: 0.8em;" href="https://bsgn.spacecoop.eu/legal_DPP.html">Privacy Policy</a>
  </div>
</div>
{% else %}
<p class="text-semibold text-color-heading">
  {% trans "Lien invalide" %}
  <div class="segment full margin-top-xsmall">
    <a class="link" style="color: var(--color-primary);" href="{% url 'login' %}">{% trans "Retour" %}</a>
  </div>
</p>
{% endif %}
{% endblock %}
