{% extends "base.html" %}
{% block title %}Change password{% endblock %}
{% block style %}
  .pw { max-width: 420px; }
  .pw label { display: block; margin: 0 0 12px; font-weight: 600; }
  .pw input { display: block; width: 100%; margin-top: 4px; }
{% endblock %}
{% block content %}
<div class="pw">
  <h1>Change password</h1>
  {% if user.ecare %}
  <p class="sub">You sign in with your Ecare office login, so this Portal
    keeps no password for you. Your password is your Ecare office password —
    change it in Ecare.</p>
  {% else %}
  {% if user.must_change %}<p class="sub">Choose your own password before
    going on (an Admin set the one you signed in with).</p>
  {% else %}<p class="sub">At least 10 characters, not your username.</p>{% endif %}
  {% if error %}<div class="msg bad" role="alert">{{ error }}</div>{% endif %}
  <form class="card" method="post" action="/account/password" autocomplete="off">
    <input type="hidden" name="token" value="{{ run_token }}">
    <label>Current password <input name="current" type="password" autocomplete="current-password" required></label>
    <label>New password <input name="new" type="password" autocomplete="new-password" minlength="10" required></label>
    <label>New password again <input name="confirm" type="password" autocomplete="new-password" minlength="10" required></label>
    <button type="submit">Change password</button>
  </form>
  {% endif %}
</div>
{% endblock %}