@extends('main')
@section('styles')
	<style media="screen">
	label.error {
	display: block;
	text-align: center;
	color: red;
	vertical-align: top;
	position: absolute;
	z-index: 99;
	left: 6px;
	top: 5px;
	}
	</style>
@endsection
@section('content')
	<div class="breadcrumbs">
		<div class="container">
			<div class="row">
				<div class="col-xs-12">
					<ul>
						<li class="home">
							<a href="{{ Route('site.home.page') }}">{{ __('Home') }}</a>
							<span>/</span>
						</li>
						<li>
							<a href="{{ Route('site.account.home') }}">{{ __('My Account') }}</a>
							<span>/</span>
						</li>
						<li >
							{{ __('Reset Password') }}
						</li>
					</ul>
				</div>
			</div>
		</div>
	</div>
	<section class="main-container col1-layout">
		<div class="main container">
			<div class="col-main">
				<div class="cart">
					<div class="cart-collaterals row">
						<div class="col-md-4 col-md-push-4 ">
							<div class="empty-sm-25 empty-xs-25"></div>
							<div class="block-title text-center">
								<h2>{{ __('Reset Password') }}</h2>
							</div>
							<div class="shipping">
								<div class="shipping-form">
									{{-- <form  class="form-horizontal" role="form"  method="POST" action="{{ route('password.email') }}"> --}}
									<form class="chk-form"  role="form" method="POST" action="{{ Route('password.email') }}">
										{{ csrf_field() }}
										@if (session('status'))
											<div class="alert empty-sm-0 empty-xs-0"></div>
											<div class="alert alert-success" role="alert">
												{{ __('Please check email') }}
											</div>
										@endif
										@error('email')
											<div class="alert empty-sm-0 empty-xs-0"></div>
											<div class="alert alert-warning" role="alert">
												{{ $message }}
											</div>
										@enderror
										<div class="empty-sm-10 empty-xs-10"></div>
										<div class="form-group row">
											<div class="col-sm-12 col-xs-12">
												<div class="input-group">
													<span class="input-group-addon"><i class="fa fa-envelope" aria-hidden="true"></i></span>
													<input name="email" size="60" class="form-control @error('email') error @enderror" placeholder="{!! __('Email') !!}" type="email" required value="{{ old('email') }}">
													</div>
												</div>
											</div>
											<div class="empty-sm-5 empty-xs-5"></div>
											<div class="form-group row mb-0">
												<div class="col-md-12 text-center">
													<div class="d-flex justify-content-between">
														<div class="simple-text xs forgot fl color-3">
															<button type="submit" class="btn btn-primary">
																<span class="txt">	{{ __('Request activation code') }}</span>
															</button>
														</div>
														<div class="simple-text xs reg-now fr">
															<a href="{!! route('email.code.otp') !!}" class="button btn-default">
																<span class="txt">{{ __('Have activation code') }}</span>
															</a>
														</div>
													</div>
												</div>
											</div>
											<div class="empty-sm-5 empty-xs-5"></div>
											<div class="form-group row mb-0">
												<div class="col-md-12 text-center">
													<a href="{!! route('otp.password.reset') !!}" class="button btn-default">
														<span class="txt">{{ __('Alternate way phone number') }}</span>
													</a>
												</div>
											</div>
										</form>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</section>
	@endsection
	@section('scripts')
		{!! Html::script(Theme::current()->assetPath.'/js/jquery.validate.js') !!}
		<script type="text/javascript">
			(function(){
				$.validator.messages.required = "{{ __('This field is required.') }}";
				$.validator.messages.digits 	= "{{ __('Please enter only digits') }}";
				$.validator.messages.email 		= "{{ __('Please enter a valid email address.') }}";
				$.validator.messages.equalTo 	= "{{ __('Please enter the same value again.') }}";
				$(".register-form").validate({
					invalidHandler: function(event, validator) {
						var errors = validator.numberOfInvalids();
						if (errors) {
							var message = errors == 1
							? 'You missed 1 field. It has been highlighted'
							: 'You missed ' + errors + ' fields. They have been highlighted';
							$("div.error span").html(message);
							$("div.error").show();
						} else {
							$("div.error").hide();
						}
					}
				});
				$(".chk-form").validate({
					invalidHandler: function(event, validator) {
						var errors = validator.numberOfInvalids();
						if (errors) {
							var message = errors == 1
							? 'You missed 1 field. It has been highlighted'
							: 'You missed ' + errors + ' fields. They have been highlighted';
							$("div.error span").html(message);
							$("div.error").show();
						} else {
							$("div.error").hide();
						}
					}
				});
			})();
		</script>
	@endsection