<div class="container">

	<div class="login-box">

		<div class="login-box-logo">
			<a href="login">
				<img src="img/logo_transparent_200x75.png">
			</a>
		</div>

		<div class="login-inner-box">
			<div class="login-tab-header">
				<button class="btn-login-tab" class="active">
					Reset password
				</button>
			</div>

			<form name="sendResetForm" class="login-form" ng-show="mode === 'send'">
				<div class="tight-form last">
					<ul class="tight-form-list">
						<li class="tight-form-item" style="width: 78px">
							<strong>User</strong>
						</li>
						<li>
							<input type="text" name="username" class="tight-form-input last" required ng-model='formModel.userOrEmail' placeholder="email or username" style="width: 253px">
						</li>
					</ul>
					<div class="clearfix"></div>
				</div>

				<div class="login-submit-button-row">
					<button type="submit" class="btn" ng-click="sendResetEmail();" ng-class="{'btn-inverse': !sendResetForm.$valid, 'btn-primary': sendResetForm.$valid}">
						Send reset instructions
					</button>
				</div>
			</form>

			<h5 ng-if="mode === 'email-sent'" style="text-align: center; padding: 20px;">
				An email with a reset link as been sent to the email address, you should receive it shortly.
			</h5>

			<form name="resetForm" class="login-form" ng-show="mode === 'reset'">
				<div class="tight-form">
					<ul class="tight-form-list">
						<li class="tight-form-item" style="width: 125px">
							<strong>New Password</strong>
						</li>
						<li>
							<input type="password" name="NewPassword" class="tight-form-input last" required ng-minlength="4" ng-model='formModel.newPassword' placeholder="password" style="width: 207px" watch-change="formModel.newPassword = inputValue;">
						</li>
					</ul>
					<div class="clearfix"></div>
				</div>
				<div class="tight-form last">
					<ul class="tight-form-list">
						<li class="tight-form-item" style="width: 125px">
							<strong>Confirm Password</strong>
						</li>
						<li>
							<input type="password" name="ConfirmPassword" class="tight-form-input last" required ng-minlength="4" ng-model='formModel.confirmPassword' placeholder="confirm password" style="width: 207px">
						</li>
					</ul>
					<div class="clearfix"></div>
				</div>

				<div style="margin-left: 141px; width: 207px;">
					<password-strength password="formModel.newPassword"></password-strength>
				</div>

				<div class="login-submit-button-row">
					<button type="submit" class="btn" ng-click="submitReset();" ng-class="{'btn-inverse': !resetForm.$valid, 'btn-primary': resetForm.$valid}">
						Reset Password
					</button>
				</div>
			</form>

			<div class="clearfix"></div>
		</div>

		<div class="row" style="margin-top: 40px">
			<div class="text-center">
				<a href="login">
					Back to login
				</a>
			</div>
		</div>

	</div>
</div>

