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

<section class="login_section top-space el">
    <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 mx-auto">
                <div class="login_wrap">
                    <div class="login_section_area">
                        <div class="header_area">
                            <h1>Verify your phone</h1>
                            <div class="header_image1">
                                <img src="{{ url('frontend/images/vector1.png') }}" alt="..." />
                            </div>
                        </div>
                        <div class="box_area otp">
                            <!--!! FLAST MESSAGES !!-->
                            {{-- @include('user.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:;" 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" class="btn btn-primary">Submit</button>
                                        </div>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="image_4">
        <img src="{{ url('frontend/images/vector2.png') }}" alt="..." />
    </div>
    <div class="image_5">
        <img src="{{ url('frontend/images/vector3.png') }}" alt="..." />
    </div>
</section>

@endsection