<div class="login-box">
    <div class="login-logo">
        <i class="fa fa-shield"></i> <b>bit</b>warden
    </div>
    <div class="login-box-body">
        <p class="login-box-msg">
            In the event that you cannot access your account through your normal two-step login methods, you can use your
            two-step login recovery code to disable all two-step providers on your account.
            <a href="https://help.bitwarden.com/article/lost-two-step-device/" target="_blank">Learn more</a>
        </p>
        <div class="text-center" ng-show="success">
            <div class="callout callout-success">
                Two-step login has been successfully disabled on your account.
            </div>
            <a ui-sref="frontend.login.info">Ready to log in?</a>
        </div>
        <form name="recoverForm" ng-submit="recoverForm.$valid && submit(model)" ng-show="!success"
              api-form="submitPromise">
            <div class="callout callout-danger validation-errors" ng-show="recoverForm.$errors">
                <h4>Errors have occurred</h4>
                <ul>
                    <li ng-repeat="e in recoverForm.$errors">{{e}}</li>
                </ul>
            </div>
            <div class="form-group has-feedback" show-errors>
                <label for="email" class="sr-only">Email</label>
                <input type="email" id="email" name="Email" class="form-control" placeholder="Email" ng-model="model.email"
                       required api-field />
                <span class="fa fa-envelope form-control-feedback"></span>
            </div>
            <div class="form-group has-feedback" show-errors>
                <label for="masterPassword" class="sr-only">Master Password</label>
                <input type="password" id="masterPassword" name="MasterPasswordHash" class="form-control" placeholder="Master Password"
                       ng-model="model.masterPassword"
                       required api-field />
                <span class="fa fa-lock form-control-feedback"></span>
            </div>
            <div class="form-group has-feedback" show-errors>
                <label for="code" class="sr-only">Recovery code</label>
                <input type="text" id="code" name="RecoveryCode" class="form-control" placeholder="Recovery code"
                       ng-model="model.code" required api-field />
                <span class="fa fa-key form-control-feedback"></span>
            </div>
            <div class="row">
                <div class="col-xs-7">
                    <a ui-sref="frontend.login.info">Ready to log in?</a>
                </div>
                <div class="col-xs-5">
                    <button type="submit" class="btn btn-primary btn-block btn-flat" ng-disabled="recoverForm.$loading">
                        <i class="fa fa-refresh fa-spin loading-icon" ng-show="recoverForm.$loading"></i>Submit
                    </button>
                </div>
            </div>
        </form>
    </div>
</div>
