<div data-ng-if="!Authentication.requireAuthCode">
  <div class="form-group">
    <div class="input-group">
      <div class="input-group-prepend">
        <span class="input-group-text"><i class="fa-solid fa-user"></i></span>
      </div>
      <input class="form-control" name="username" placeholder="{{'Username' | translate}}" data-ng-model="Authentication.loginData.loginUsername" type="text" required />
    </div>
  </div>

  <div class="form-group">
    <div class="input-group">
      <div class="input-group-prepend">
        <span class="input-group-text"><i class="fa-solid fa-lock"></i></span>
      </div>
      <input class="form-control" name="password" placeholder="{{'Password' | translate}}" data-ng-model="Authentication.loginData.loginPassword" type="password" required />
    </div>
  </div>

  <button id="login-button" class="btn btn-primary" data-ng-disabled="Authentication.loginInProgress || loginForm.$invalid" data-ng-click="Authentication.login(0, Authentication.loginData.loginUsername, Authentication.loginData.loginPassword)" type="submit">
    <i class="fa-solid fa-sign-in-alt"></i>
    <span data-translate>Log in</span>
  </button>

  <span id="forgot-button">
    <a class="btn btn-outline-secondary" href="#/login/passwordreset" data-translate>Forgot password?</a>
  </span>
</div>

<div data-ng-if="Authentication.requireAuthCode">
  <div class="form-group">
    <label data-translate>Enter the two factor authentication code</label>
  </div>

  <div class="input-group">
    <input class="form-control" data-ng-model="Authentication.loginData.loginAuthCode" type="text" size="6" maxlength="6" required />

    <div class="input-group-btn">
      <button id="login-button" class="btn btn-primary" data-ng-disabled="Authentication.loginInProgress || loginForm.$invalid" data-ng-click="Authentication.login(0, Authentication.loginData.loginUsername, Authentication.loginData.loginPassword, Authentication.loginData.loginAuthCode)" type="submit">
        <i class="fa-solid fa-sign-in-alt"></i>
        <span data-translate>Log in</span>
      </button>

      <a class="btn" data-ng-click="Utils.openSupportModal()" data-uib-tooltip="{{'Request support' | translate}}"><i class="fa-solid fa-life-ring"></i></a>
    </div>
  </div>
</div>
