{# account/index.html — the signed-in user's own account (milestone 490): who
   they are, the time zone every page writes its times in, their email
   (milestone 495) and a local account's password (milestone 497). One form,
   one Save. #}
{% extends "base.html" %}
{% from "_macros.html" import page_header, zone_select %}
{% from "account/_email_choices.html" import email_section with context %}
{% block title %}Your account — Steward{% endblock %}
{% block content %}
{{ page_header("Your account") }}

<p class="page-verdict">
  Signed in as <strong>{{ user.username }}</strong> ({{ user.role.value }}) with {{ source }}
  · times show in <strong>{{ zone_title }}</strong> ({{ zone_label }})
</p>

{% if error %}<div class="alert alert-error" role="alert">{{ error }}</div>
{% elif done %}<div class="alert alert-success" role="status">{{ done }}</div>{% endif %}

<form method="post" action="/account/" class="form-page">{{ csrf_field() }}
  <section class="card form-section" aria-labelledby="acct-time">
    <h2 id="acct-time" class="section-title">Time zone</h2>
    <div class="field">
      <label class="field-label" for="acct-tz">Show times in</label>
      {{ zone_select("time_zone", "acct-tz", zone_name, zones) }}
      <span class="field-hint">Every page writes its times in this zone, on a 24-hour clock.</span>
    </div>
  </section>

  {{ email_section(user, defaults, "your time zone") }}

  <section class="card form-section" aria-labelledby="acct-password">
    <h2 id="acct-password" class="section-title">Password</h2>
    {% if user.auth_source == "local" %}
    <p class="field-hint">Leave these empty to keep your password. A new one signs you out everywhere else you're signed in.</p>
    <div class="field">
      <label class="field-label" for="acct-pw-now">Current password</label>
      <input class="input" id="acct-pw-now" type="password" name="current_password" autocomplete="current-password">
    </div>
    <div class="field">
      <label class="field-label" for="acct-pw-new">New password</label>
      <input class="input" id="acct-pw-new" type="password" name="new_password" minlength="{{ min_password }}" autocomplete="new-password">
      <span class="field-hint">At least {{ min_password }} characters.</span>
    </div>
    <div class="field">
      <label class="field-label" for="acct-pw-again">New password again</label>
      <input class="input" id="acct-pw-again" type="password" name="new_confirm" autocomplete="new-password">
    </div>
    {% else %}
    <p class="field-hint">You sign in with {{ source }}, so your password is changed there, not in Steward.</p>
    {% endif %}
  </section>

  <div class="form-actions"><button type="submit" class="btn">Save</button></div>
</form>
{% endblock %}