<form class="form-login"
      [formGroup]="form" novalidate>
  <label class="font-weight-bold mb-0 text-uppercase">{{ registrationData.registrationType }}</label>
  <input [attr.aria-label]="'external-login-page.orcid-confirmation.netid.label' | translate"
         autocomplete="off"
         autofocus
         class="form-control form-control-lg position-relative mb-2"
         formControlName="netId"
         [placeholder]="'external-login-page.orcid-confirmation.netid.placeholder' | translate"
         type="text"
         [attr.data-test]="'netId' | dsBrowserOnly">
  <label class="font-weight-bold mb-0">{{"external-login-page.orcid-confirmation.lastname" | translate}}</label>
  <input [attr.aria-label]="'external-login-page.orcid-confirmation.lastname.label' | translate"
         autocomplete="off"
         class="form-control form-control-lg position-relative mb-2"
         formControlName="lastname"
         type="text"
         [attr.data-test]="'lastname' | dsBrowserOnly">
  <label class="font-weight-bold mb-0">{{"external-login-page.orcid-confirmation.firstname" | translate}}</label>
  <input [attr.aria-label]="'external-login-page.orcid-confirmation.firstname.label' | translate"
        autocomplete="off"
        class="form-control form-control-lg position-relative mb-2"
        formControlName="firstname"
        type="text"
        [attr.data-test]="'firstname' | dsBrowserOnly">
  @if (registrationData?.email) {
    <label class="font-weight-bold mb-0">{{"external-login-page.orcid-confirmation.email" | translate}}</label>
    <input [attr.aria-label]="'external-login-page.orcid-confirmation.email.label' | translate"
          autocomplete="off"
          class="form-control form-control-lg position-relative"
          formControlName="email"
          type="email"
          [attr.data-test]="'email' | dsBrowserOnly">
  }
</form>
