<form #twoFactorForm="ngForm" role="form" class="loginForm" (ngSubmit)="verifyTFACode()" novalidate>
  <div class="legend form-block center" translate>
    Two-factor authentication
  </div>

  <c8y-form-group>
    <label translate>Verification code</label>
    <input
      [(ngModel)]="model.smsToken"
      #sms_token="ngModel"
      type="text"
      name="sms_token"
      autocapitalize="off"
      autocorrect="off"
      class="form-control"
      placeholder="{{ 'e.g.' | translate }} 624327"
      required
    />
    <p *ngIf="!twoFactorForm.form.valid || isLoading " class="help-block" translate>
      Insert the code received via SMS.
    </p>
  </c8y-form-group>

  <button
    title="{{ 'Verify' | translate }}"
    [disabled]="!twoFactorForm.form.valid || isLoading"
    type="submit"
    class="btn btn-primary btn-lg btn-block form-group"
    translate
  >
    Verify
  </button>

  <div class="d-flex m-t-8">
    <a
      title="{{ 'Send new code' | translate }}"
      [ngClass]="{ disabled: isLoading }"
      class="small pointer m-r-auto"
      (click)="resendTFASms()"
      translate
    >
      Send new code
    </a>
    <a
      title="{{ 'Log in' | translate }}"
      class="small pointer m-l-auto"
      (click)="onCancel.emit()"
      translate
    >
      Log in
    </a>
  </div>
</form>