@extends('layouts.app-Auth')
@section('content')
    <div class="login-header py-10 flex-column-auto">
        <div class="container d-flex flex-column flex-md-row align-items-center justify-content-center justify-content-md-between">
            <!--begin::Logo-->
            <a href="{{get_setting('website_home_page')}}" class="flex-column-auto py-5 py-md-0">
                <img id="auth_logo" src="{{!empty(uploaded_asset(get_setting('auth_logo')))?uploaded_asset(get_setting('auth_logo')): my_asset('/assets/images/notfound.png')}}" alt="logo" class="h-50px" />
            </a>
            <!--end::Logo-->
            <span class="text-muted font-weight-bold font-size-h4">Already have an account?
						<a href="{{route('login')}}" id="kt_login_signup" class="text-primary font-weight-bolder">Login</a></span>
        </div>
    </div>
    <!--end::Header-->
    <!--begin::Body-->
    <div class="login-body d-flex flex-column-fluid align-items-stretch justify-content-center">
        <div class="container row">
            <div class="col-lg-6 d-flex align-items-center">
                <!--begin::Signin-->
                <div class="login-form login-signin">
                    <!--begin::Form-->
                        <form method="POST" action="{{ route('password.update') }}" class="form  p-10">
                            @csrf
                            <input type="hidden" name="token" value="{{ $token }}">
                        <!--begin::Title-->
                        <div class="pb-13 pt-lg-0 pt-5">
                            <h3 class="font-weight-bolder text-dark font-size-h4 font-size-h1-lg">Welcome to OMNI Stock</h3>

                        </div>
                        <!--begin::Title-->
                        <!--begin::Form group-->
                        <div class="form-group">
                            <label class="font-size-h6 font-weight-bolder text-dark">Email address</label>
                            <input id="email" type="email" class="form-control form-control-solid h-auto p-6 rounded-lg @error('email') is-invalid @enderror" name="email" value="{{ $email ?? old('email') }}" required autocomplete="email" autofocus>
                            @error('email')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                             </span>
                            @enderror
                        </div>
                        <div class="form-group">
                            <div class="d-flex justify-content-between mt-n5">
                                <label class="font-size-h6 font-weight-bolder text-dark pt-5">Password</label>
                            </div>
                            <input id="password" type="password" onchange="CheckPassword()" onkeyup="CheckPassword()" onpaste="CheckPassword()" class="form-control form-control-solid h-auto p-6 rounded-lg @error('password') is-invalid @enderror" name="password" required autocomplete="new-password">
                            @error('password')
                            <span class="invalid-feedback" role="alert">
                              <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                            <strong id="validate-length"></strong>
                        </div>
                        <div class="form-group">
                            <div class="d-flex justify-content-between mt-n5">
                                <label class="font-size-h6 font-weight-bolder text-dark pt-5">Confirm Password</label>
                            </div>
                            <input id="password_confirmation" type="password"    onkeyup="return validatePassword(event)" onpaste="return validatePassword(event)" onchange="return validatePassword(event)" class="form-control form-control form-control-solid h-auto p-6 rounded-lg" name="password_confirmation" required autocomplete="new-password">
                            <strong id="validate-status"></strong>
                        </div>

                        <!--end::Form group-->
                        <!--begin::Action-->
                        <div class="pb-lg-0 pb-5">
                            <button type="submit" id="kt_login_signin_submit" class="btn btn-primary font-weight-bolder font-size-h6 px-8 py-4 my-3 mr-3">Sign In</button>
                        </div>
                        <!--end::Action-->
                    </form>
                    <!--end::Form-->
                </div>
            </div>
            <div class="col-lg-6 bgi-size-contain bgi-no-repeat bgi-position-y-center bgi-position-x-center min-h-150px mt-10 m-md-0" style="background-image: url(https://preview.keenthemes.com/keen/theme/demo6/dist/assets/media/svg/illustrations/accomplishment.svg)"></div>
        </div>
    </div>
    <!--end::Body-->

    {{--    <div class="container-xxl mt-3">
            <!-- header rightbar icon -->
            <div class="row align-items-center">
                <div class="col">
                    <a href="javascript:void(0)" class="d-flex align-item-center">
                        <i class="fa fa-gg-circle fs-3"></i>
                        <h5 class="mb-0 mt-1 mx-2">Omni</h5>
                    </a>
                </div>
            </div>
        </div>
        <!-- Body: Body -->
        <div class="body d-flex p-0 p-xl-5">
            <div class="container-xxl">
                <div class="row g-3">
                    <div class="col-lg-12 d-flex justify-content-center align-items-center">
                        <div class="d-flex flex-column">
                            <h1>{{ __('Reset Password') }}</h1>
                            <div class="tab-content mt-4 mb-3">
                                <div class="tab-pane fade show active" id="Email">
                                    <div class="card">
                                        <div class="card-body p-4">
                                            <form method="POST" action="{{ route('password.update') }}">
                                                @csrf
                                                <input type="hidden" name="token" value="{{ $token }}">
                                                <div class="mb-3">
                                                    <label class="form-label fs-6">Email address</label>
                                                    <input id="email" type="email" class="form-control @error('email') is-invalid @enderror" name="email" value="{{ $email ?? old('email') }}" required autocomplete="email" autofocus>
                                                    @error('email')
                                                    <span class="invalid-feedback" role="alert">
                                                        <strong>{{ $message }}</strong>
                                                     </span>
                                                    @enderror
                                                </div>
                                                <div class="mb-3">
                                                    <label class="form-label fs-6">Password</label>
                                                    <input id="password" type="password" onchange="CheckPassword()" onkeyup="CheckPassword()" onpaste="CheckPassword()" class="form-control @error('password') is-invalid @enderror" name="password" required autocomplete="new-password">
                                                    @error('password')
                                                    <span class="invalid-feedback" role="alert">
                                                      <strong>{{ $message }}</strong>
                                                    </span>
                                                    @enderror
                                                    <strong id="validate-length"></strong>
                                                </div>
                                                <div class="mb-3">
                                                    <label class="form-label fs-6">Confirm Password</label>
                                                    <input id="password_confirmation" type="password"    onkeyup="return validatePassword(event)" onpaste="return validatePassword(event)" onchange="return validatePassword(event)" class="form-control" name="password_confirmation" required autocomplete="new-password">
                                                    <strong id="validate-status"></strong>
                                                </div>
                                                <button type="submit" class="btn btn-primary text-uppercase py-2 fs-5 w-100 mt-2" id="sign_up">  {{ __('Reset Password') }}</button>
                                            </form>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div> <!-- End Row -->
            </div>
        </div>--}}
@endsection
@push('custom-scripts')
    <script type="text/javascript">
        function validate(evt) {
            var theEvent = evt || window.event;

            // Handle paste
            if (theEvent.type === 'paste') {
                key = event.clipboardData.getData('text/plain');
            } else {
                // Handle key press
                var key = theEvent.keyCode || theEvent.which;
                key = String.fromCharCode(key);
            }
            var regex = /[0-9]|\./;
            if( !regex.test(key) ) {
                theEvent.returnValue = false;
                if(theEvent.preventDefault) theEvent.preventDefault();
            }
        }
        function checkEntry(e) {
            var k;
            document.all ? k = e.keyCode : k = e.which;
            return ((k > 64 && k < 91) || (k > 96 && k < 123) || k == 8 || k == 32 || (k >= 48 && k <= 57));
        }
        function CheckPassword() {
            pass = document.getElementById("password").value;
            regex = /^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/;
            if (regex.exec(pass) == null) {
                //return false;
                $("#validate-length").text("Password Minimum 8 character and One Upper case One lower case one digit and 0ne special character ");
                document.getElementById("validate-length").style.color = "#FF0000";
                document.getElementById("kt_login_signin_submit").style.cursor = "not-allowed";
                document.getElementById("kt_login_signin_submit").disabled = true;
                document. getElementById("validate-length"). style. display = "block";
            }
            else {
                document. getElementById("validate-length"). style. display = "none";
                document.getElementById("kt_login_signin_submit").removeAttribute('disabled');
                document.getElementById("kt_login_signin_submit").style.cursor = "pointer";
            }
        }
        $(document).ready(function() {
            $("#password_confirmation").keyup(validatePassword);
        });
        function validatePassword() {
            var password1 = $("#password").val();
            var password2 = $("#password_confirmation").val();
            if(password1 == password2) {
                $("#validate-status").text("Password Matched");
                document.getElementById("validate-status").style.color = "#52bb2a";
                document.getElementById("kt_login_signin_submit").removeAttribute('disabled');
                document.getElementById("kt_login_signin_submit").style.cursor = "pointer";
            }
            else {
                $("#validate-status").text("Password Not Matched");
                document.getElementById("validate-status").style.color = "#FF0000";
                document.getElementById("kt_login_signin_submit").style.cursor = "not-allowed";
                document.getElementById("kt_login_signin_submit").disabled = true;
            }
        }
    </script>
@endpush