{{ define "content" }}
<div class="page-head">
  <h1>{{ T "auth.change_pin" }}</h1>
</div>

<div class="card" style="max-width:24rem">
  <p class="muted">{{ T "auth.change_pin.help" }}</p>
  <form method="post" action="/api/pin/change">
    <label>{{ T "auth.change_pin.current" }}
      <input type="password" name="current_pin" inputmode="numeric" autocomplete="current-password" required autofocus>
    </label>
    <label>{{ T "auth.change_pin.new" }}
      <input type="password" name="new_pin" inputmode="numeric" autocomplete="new-password" required>
    </label>
    <label>{{ T "auth.change_pin.confirm" }}
      <input type="password" name="new_pin2" inputmode="numeric" autocomplete="new-password" required>
    </label>
    {{ if .errKey }}<p class="muted" style="color:#b91c1c">{{ T .errKey }}</p>{{ end }}
    <button class="btn primary" type="submit" style="margin-top:.5rem">{{ T "auth.change_pin.submit" }}</button>
  </form>
</div>
{{ end }}