@extends('layout.app')
@section('title','Sent OTP')
@section('body_class', 'bg-body')
@section('content')
<div class="d-flex flex-column flex-root">
	<!--begin::Authentication - Sign-in -->
	<div class="d-flex flex-column flex-column-fluid bgi-position-y-bottom position-x-center bgi-no-repeat bgi-size-contain bgi-attachment-fixed" >
		<!--begin::Content-->
		<div class="d-flex flex-center flex-column flex-column-fluid p-10 pb-lg-20">
			<!--begin::Logo-->
			<a href="{{ url('index') }}" class="py-10">
				<!--begin::Desktop modes-->
				<img alt="Logo" src="{{ URL::asset('/assets/media/logos/logo_7m.png') }}" class="d-none d-lg-inline-block h-70px" />
				<!--end::Desktop modes-->
				<!--begin::Table & mobile modes-->
				<img alt="Logo" src="{{ URL::asset('/assets/media/logos/logo_7m.png') }}" class="d-lg-none h-70px" />
				<!--end::Table & mobile modes-->
			</a>
			<!--end::Logo-->
			<!--begin::Wrapper-->
			<div class="w-lg-600px bg-body rounded shadow-sm p-10 p-lg-15 mx-auto">
				<!--begin::Form-->
				<form class="form w-100 mb-10" novalidate="novalidate" id="kt_sing_in_two_steps_form" method="" action="">
					{{ csrf_field() }}
					<!--begin::Icon-->
					<div class="text-center mb-10">
						<img alt="Logo" class="mh-125px" src="assets/media/svg/misc/smartphone.svg" />
					</div>
					<!--end::Icon-->
					<!--begin::Heading-->
					<div class="text-center mb-10">
						<!--begin::Title-->
						<h1 class="text-dark mb-3">Two Step Verification</h1>
						<!--end::Title-->
						<!--begin::Sub-title-->
						<div class="text-muted fw-bold fs-5 mb-5">Enter the verification code we sent to</div>
						<!--end::Sub-title-->
						<!--begin::Mobile no-->
						<div class="fw-bolder text-dark fs-3">******7859</div>
						<!--end::Mobile no-->
					</div>
					<!--end::Heading-->
					<!--begin::Section-->
					<div class="mb-10 px-md-10">
						<!--begin::Label-->
						<div class="fw-bolder text-start text-dark fs-6 mb-1 ms-1">Type your 6 digit security code</div>
						<!--end::Label-->
						<!--begin::Input group-->
						<div class="d-flex flex-wrap flex-stack">
							<input type="text" data-inputmask="'mask': '9', 'placeholder': ''" maxlength="1" class="form-control form-control-solid h-60px w-60px fs-2qx text-center border-primary border-hover mx-1 my-2" value="3" name="otp[]" />
							<input type="text" data-inputmask="'mask': '9', 'placeholder': ''" maxlength="1" class="form-control form-control-solid h-60px w-60px fs-2qx text-center border-primary border-hover mx-1 my-2" value="0" name="otp[]" />
							<input type="text" data-inputmask="'mask': '9', 'placeholder': ''" maxlength="1" class="form-control form-control-solid h-60px w-60px fs-2qx text-center border-primary border-hover mx-1 my-2" value="7" name="otp[]" />
							<input type="text" data-inputmask="'mask': '9', 'placeholder': ''" maxlength="1" class="form-control form-control-solid h-60px w-60px fs-2qx text-center border-primary border-hover mx-1 my-2" value="1" name="otp[]" />
							<input type="text" data-inputmask="'mask': '9', 'placeholder': ''" maxlength="1" class="form-control form-control-solid h-60px w-60px fs-2qx text-center border-primary border-hover mx-1 my-2" value="2" name="otp[]" />
							<input type="text" data-inputmask="'mask': '9', 'placeholder': ''" maxlength="1" class="form-control form-control-solid h-60px w-60px fs-2qx text-center border-primary border-hover mx-1 my-2" value="1" name="otp[]" />
						</div>
						<!--begin::Input group-->
					</div>
					<!--end::Section-->
					<!--begin::Submit-->
					<div class="fv-row mb-10">
						<a href="javascript:void(0)" class="link-primary fw-bolder fs-5 me-1">Resend OTP</a>
					</div>
					<div class="d-flex flex-center">
						<button type="submit" id="kt_sing_in_two_steps_submit" class="btn btn-lg btn-primary fw-bolder" onclick="location.href='{{ route('reset_password') }}';">
							<span class="indicator-label">
								Submit
							</span>
							<span class="indicator-progress">Please wait...
								<span class="spinner-border spinner-border-sm align-middle ms-2"></span>
							</span>
						</button>
					</div>
					<!--end::Submit-->
				</form>
				<!--end::Form-->
				<!--begin::Notice-->
				<div class="fv-row mb-10 text-center mx-5">
					<a href="{{ route('login') }}" class="link-primary fs-6 fw-bolder mx-20">Back to Login</a>
					<a href="{{ route('forgot_password') }}" class="link-primary fs-6 fw-bolder mx-20 text-nowrap">Change Email</a>
				</div>
				<!--end::Notice-->
				<p class="my-10 fs-3 fw-bolder">Call Ambulance</p>
				<div class="text-center">
					<a href="tel:+91108" class="mx-10 fs-4">
						<span class="fa fa-phone mx-2 fa-rotate-90" aria-hidden="true"></span>
						108
					</a>
					<a href="tel:+91112" class="mx-10 fs-4">
						<span class="fa fa-phone mx-2 fa-rotate-90" aria-hidden="true"></span>
						112
					</a>
				</div>
			</div>
			@include('layout.footer')
			<!--end::Wrapper-->
		</div>
		<!--end::Content-->
	</div>
	<!--end::Authentication - Sign-in-->
</div>
@endsection

@section('javascript')
<script src="assets/js/custom/authentication/sign-in/two-steps.js"></script>
@endsection