{% import '_includes/forms' as forms %}

<h2>{{ 'Change your Password'|t('app') }}</h2>

<div>
  {{ forms.passwordField({
    label: 'New Password'|t('app'),
    id: 'newPassword',
    name: 'newPassword',
    autocomplete: 'new-password',
    errors: user.getErrors('newPassword'),
    inputAttributes: {
      data: {
        lpignore: user.isCurrent ? false : 'true',
      }|filter,
    },
  }) }}
</div>

<hr>

<h2>{{ 'Two-Step Verification'|t('app') }}</h2>
<p>{{ 'Improve your account’s security by adding a second verification step when signing in.'|t('app') }}</p>

{% include 'users/_auth-methods.twig' with {
  paneClass: 'hairline',
} %}

{% js %}
  new Craft.PasswordInput('#newPassword');
  new Craft.ElevatedSessionForm('#main-form', ['#newPassword']);

  Craft.authMethodSetup = new Craft.AuthMethodSetup();
{% endjs %}