<div class="np-form-field {% if form.errors contains 'email' %}np-account-form-field-error{% endif %}">
  <label class="account-label" for="{{version}}_learner_email">
    <span class="lang-en">Email</span>
    <span class="lang-de">E-Mail</span>
    <span class="lang-es">Correo electrónico</span>
    <span class="lang-fr">E-mail</span>
    <span class="lang-br">Email</span> *
  </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="account-label" for="{{version}}_learner_first_name">
    <span class="lang-en">First name</span>
    <span class="lang-de">Vorname</span>
    <span class="lang-es">Nombre de pila</span>
    <span class="lang-fr">Prénom</span>
    <span class="lang-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="account-label" for="{{version}}_learner_last_name">
    <span class="lang-en">Last name</span>
    <span class="lang-de">Nachname</span>
    <span class="lang-es">Apellidos</span>
    <span class="lang-fr">Nom de famille</span>
    <span class="lang-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 %}" style="display: none">
  <label class="account-label" for="{{version}}_learner_display_name">
    <span class="lang-en">Display name</span>
    <span class="lang-de"></span>
    <span class="lang-es"></span>
    <span class="lang-fr"></span>
    <span class="lang-br"></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="account-label" for="{{version}}_learner_current_password">
      <span class="lang-en">Current password</span>
      <span class="lang-de">Aktuelles Passwort</span>
      <span class="lang-es">Contraseña actual</span>
      <span class="lang-fr">Mot de passe actuel</span>
      <span class="lang-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="account-label" for="{{version}}_learner_password">
      <span class="lang-en">New password</span>
      <span class="lang-de">Neues Passwort</span>
      <span class="lang-es">Nueva contraseña</span>
      <span class="lang-fr">Nouveau mot de passe</span>
      <span class="lang-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="account-label" for="{{version}}_learner_password_confirmation">
      <span class="lang-en">Confirm new password</span>
      <span class="lang-de">Passwort bestätigen</span>
      <span class="lang-es">Confirmar nueva contraseña</span>
      <span class="lang-fr">Confirmer le mot de passe</span>
      <span class="lang-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="account-label" for="{{version}}_learner_password">
      <span class="lang-en">Password</span>
      <span class="lang-de">Passwort</span>
      <span class="lang-es">Contraseña</span>
      <span class="lang-fr">Mot de passe</span>
      <span class="lang-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">
        <span class="lang-en">{% t .terms_of_service %}</span>
        <span class="lang-de"></span>
        <span class="lang-es"></span>
        <span class="lang-fr"></span>
        <span class="lang-br"></span>
      </div>
    </div>
  {% else %}
    <div class="np-margin-top">
      <span class="np-form-terms">
          <span class="lang-en">By submitting this form you agree to the </span>
          <span class="lang-de">Mit dem Absenden dieses Formulars erklären Sie sich mit den </span>
          <span class="lang-es">Al enviar este formulario acepta las </span>
          <span class="lang-fr">En soumettant ce formulaire, vous acceptez les </span>
          <span class="lang-br">Ao enviar este formulário, você concorda com os </span>
        <a
          class="np-form-link np-button-color"
          target="_blank"
          href={{ form.terms_of_service_url }}
        >
          <span class="lang-en">Terms of Use</span>
          <span class="lang-de">Nutzungsbedingungen einverstanden</span>
          <span class="lang-es">Condiciones de uso</span>
          <span class="lang-fr">conditions d'utilisation.</span>
          <span class="lang-br">Termos de Uso</span>
        </a>
      </span>
    </div>
  {% endif %}

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