<div class="np-resource-title">
  <span class="lang-en-US">{% t.header %}</span>
  <span class="lang-es">Mi Perfil</span>
  <span class="lang-fr">Mon Profil</span>
  <span class="lang-de">Mein Profil</span>
  <span class="lang-en-GB">My Profile</span>
  <span class="lang-nl">Mijn Profiel</span>
  <span class="lang-pt-BR">Meu Perfil</span>
</div>
<div class="np-form-field {% if form.errors contains 'email' %}np-account-form-field-error{% endif %}">
  <label class="np-input-label" for="{{version}}_learner_email">{% t shared.email %} *</label>
  <input
    {% if form.options.invite? %}
    disabled
    {% endif %}
    autofocus="autofocus"
    class="np-input"
    id="{{version}}_learner_email"
    name="learner[email]"
    type="email"
    value="{{ form.email }}" />
</div>
<div class="np-form-field {% if form.errors contains 'first_name' %}np-account-form-field-error{% endif %}">
  <label class="np-input-label" for="{{version}}_learner_first_name">
    <span class="lang-en-US">{% t shared.first_name %}</span>
    <span class="lang-es">Nombre</span>
    <span class="lang-fr">Prénom</span>
    <span class="lang-de">Vorname</span>
    <span class="lang-en-GB">First Name</span>
    <span class="lang-nl">Voornaam</span>
    <span class="lang-pt-BR">Nome</span>
    *
  </label>
  <input
    class="np-input"
    id="{{version}}_learner_first_name"
    name="learner[first_name]"
    value="{{ form.first_name }}" />
</div>
<div class="np-form-field {% if form.errors contains 'last_name' %}np-account-form-field-error{% endif %}">
  <label class="np-input-label" for="{{version}}_learner_last_name">
    <span class="lang-en-US">{% t shared.last_name %}</span>
    <span class="lang-es">Apellido</span>
    <span class="lang-fr">Nom</span>
    <span class="lang-de">Nachname</span>
    <span class="lang-en-GB">Last Name</span>
    <span class="lang-nl">Achternaam</span>
    <span class="lang-pt-BR">Sobrenome</span>
    *
  </label>
  <input
    class="np-input"
    id="{{version}}_learner_last_name"
    name="learner[last_name]"
    value="{{ form.last_name }}" />
</div>
<div class="np-form-field {% if form.errors contains 'display_name' %}np-account-form-field-error{% endif %}">
  <label class="np-input-label" for="{{version}}_learner_display_name">
    <span class="lang-en-US">{% t.display_name %}</span>
    <span class="lang-es">Nombre de pantalla</span>
    <span class="lang-fr">Nom d'affichage</span>
    <span class="lang-de">Anzeigename</span>
    <span class="lang-en-GB">Display Name</span>
    <span class="lang-nl">Weergavenaam</span>
    <span class="lang-pt-BR">Nome de exibição</span>
  </label>
  <input
    class="np-input"
    id="{{version}}_learner_display_name"
    name="learner[display_name]"
    value="{{ form.display_name }}" />
</div>

{% unless form.options.invite? %}
  <div class="np-form-field {% if form.errors contains 'current_password' %}np-account-form-field-error{% endif %}">
    <label class="np-input-label" for="{{version}}_learner_current_password">
      <span class="lang-en-US">{% t.current_password %}</span>
      <span class="lang-es">Contraseña actual</span>
      <span class="lang-fr">Mot de passe actuel</span>
      <span class="lang-de">Aktuelle Passwort</span>
      <span class="lang-en-GB">Current Password</span>
      <span class="lang-nl">Huidig wachtwoord</span>
      <span class="lang-pt-BR">Senha atual</span>
      *
    </label>
    <input
      class="np-input"
      id="{{version}}_learner_current_password"
      name="learner[current_password]"
      type="password" />
  </div>

  <div class="np-form-field {% if form.errors contains 'password' %}np-account-form-field-error{% endif %}">
    <label class="np-input-label" for="{{version}}_learner_password">
      <span class="lang-en-US">{% t.new_password %}</span>
      <span class="lang-es">Nueva contraseña</span>
      <span class="lang-fr">Nouveau mot de passe</span>
      <span class="lang-de">Neues Passwort</span>
      <span class="lang-en-GB">New Password</span>
      <span class="lang-nl">Nieuw wachtwoord</span>
      <span class="lang-pt-BR">Nova senha</span>
      *
    </label>
    <input
      class="np-input"
      id="{{version}}_learner_password"
      name="learner[password]"
      type="password" />
  </div>

  <div class="np-form-field {% if form.errors contains 'password_confirmation' %}np-account-form-field-error{% endif %}">
    <label class="np-input-label" for="{{version}}_learner_password_confirmation">
      <span class="lang-en-US">{% t.confirm_new_password %}</span>
      <span class="lang-es">Confirmar nueva contraseña</span>
      <span class="lang-fr">Confirmer le nouveau mot de passe</span>
      <span class="lang-de">Neues Passwort bestätigen</span>
      <span class="lang-en-GB">Confirm New Password</span>
      <span class="lang-nl">Nieuw wachtwoord bevestigen</span>
      <span class="lang-pt-BR">Confirmar nova senha</span>
      *
    </label>
    <input
      class="np-input"
      id="{{version}}_learner_password_confirmation"
      name="learner[password_confirmation]"
      type="password" />
  </div>
{% endunless %}

{% if form.options.invite? %}
  <div class="np-form-field {% if form.errors contains 'password' %}np-account-form-field-error{% endif %}">
    <label class="np-input-label" for="{{version}}_learner_password">
      <span class="lang-en-US">{% t shared.password %}</span>
      <span class="lang-es">Contraseña</span>
      <span class="lang-fr">Mot de passe</span>
      <span class="lang-de">Passwort</span>
      <span class="lang-en-GB">Password</span>
      <span class="lang-nl">Wachtwoord</span>
      <span class="lang-pt-BR">Senha</span>
      *
    </label>
    <input
      class="np-input"
      id="{{version}}_learner_password"
      name="learner[password]"
      type="password" />
  </div>

  {% if form.terms_of_service_required? %}
    <div class="np-form-field terms-of-service {% if form.errors contains 'terms_of_service_accepted' %}np-account-form-field-error{% endif %}">
      <input
        id="{{version}}_learner_terms_of_service"
        name="learner[terms_of_service_accepted]"
        type="checkbox" />
      <div class="label">
        {% t.terms_of_service %}
        <a target="_blank" href={{ form.terms_of_service_url }}>
          {% t.terms_link %}
        </a>
      </div>
    </div>
  {% else %}
    <div class="np-margin-top">
      <span class="np-form-terms ">
        {% t.terms %}
        <a
          class="np-form-link np-button-color"
          target="_blank"
          href={{ form.terms_of_service_url }}>
          {% t.terms_link %}
        </a>
      </span>
    </div>
  {% endif %}

  <input
    id="{{version}}_invite_token"
    name="learner[token]"
    value="{{ form.invite_token }}"
    type="hidden" />
{% endif %}