@extends('layouts.frontlayout')
@section('content')

<section class="success_section">
    <div class="container">
        <div class="row">
            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                <div class="succes">
                    <div class="row">
                        <div class="col-xxl-5 col-xl-5 col-lg-5 col-md-6 col-sm-8 col-12 m-auto text-center"> 
                            <div class="succes_inner text-center">
                                <div class="sign">
                                    <i class="far fa-phone-alt"></i>
                                </div>
                                <div class="dspt">
                                    <h5>Verify your phone</h5>
                                </div>
                                @include('frontend.partials.flash_messages')
                                <form method="post" class="otp_validate">
                                    <!--!! CSRF FIELD !!-->
                                    {{ csrf_field() }}
                                    <div class="row">
                                        <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                            <div class="form-group">
                                                <label for="user_name"> OTP</label>
                                                <p>OTP has been sent on your phone. Please check. </p>
                                                <div class="passcode-wrapper">
                                                    <input type="text" name="otp1" maxlength="1" />
                                                    <input type="text" name="otp2" maxlength="1"/>
                                                    <input type="text" name="otp3" maxlength="1"/>
                                                    <input type="text" name="otp4" maxlength="1"/>
                                                    <input type="text" name="otp5" maxlength="1"/>
                                                    <input type="text" name="otp6" maxlength="1"/>
                                                </div>
                                                <div class="otp_error"></div>
                                            </div>
                                        </div>
                                        <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                            <div class="resend_otp_row">
                                                Didn't receive OTP? <a href="javascript:;" aria-label="Resend OTP" data-token="{{ isset($token) && $token ? $token : '' }}" data-url="{{ route('user.resendOtp') }}" class="resend_otp">Resend OTP</a>
                                            </div>
                                            <div class="login_button">
                                                <button type="button" id="rj_verify_phone" aria-label="Verify Phone" class="btn btn-primary">Submit</button>
                                            </div>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

@endsection