@extends('frontend.layouts.frontend_design') 

@section('content')

<div class="login-page-outer">
	<div class="login-block-outer register-page">
        <div class="login-page">
            {{ Form::open(['url'=> route('customer_register'), 'class'=>"push--top-small forward","method"=>"POST", "id"=>"signup-form"]) }}
                <input type="hidden" name="member_id" value="{{ rand() }}" />
                <h4 id="input-title" data-reactid="17">Let's get started</h4>
                <label class="label" id="input-label" for="useridInput" data-reactid="18">
                    {{__('lbl.FirstName')}} (required)
                </label>
                <div style="margin-bottom:24px;" data-reactid="19">
                    <div data-reactid="20">
                        <div data-reactid="22">
                            <input type="text" id="useridInput" name="first_name" value="{{old('first_name')}}"
                                title="{{__('lbl.FirstName')}}" class="text-input req"
                                placeholder="" required />
                        </div>
                    </div>
                    <div id="error-caption"
                        style="font-weight:500;font-size:12px;line-height:24px;color:rgb(203, 56, 11);box-sizing:border-box;"
                        data-reactid="24">
                        <div data-reactid="25"></div>
                    </div>
                </div>

                <label class="label" id="input-label" for="useridInput" data-reactid="18">
                    {{__('lbl.LastName')}} (required)
                </label>
                <div style="margin-bottom:24px;" data-reactid="19">
                    <div data-reactid="20">
                        <div data-reactid="22">
                            <input type="text" id="useridInput" name="last_name" value="{{old('last_name')}}"
                                title="{{__('lbl.LastName')}}" class="text-input req"
                                placeholder="" required />
                        </div>
                    </div>
                    <div id="error-caption"
                        style="font-weight:500;font-size:12px;line-height:24px;color:rgb(203, 56, 11);box-sizing:border-box;"
                        data-reactid="24">
                        <div data-reactid="25"></div>
                    </div>
                </div>

                <label class="label" id="input-label" for="useridInput" data-reactid="18">
                    {{__('lbl.Email')}} (required)
                </label>
                <div style="margin-bottom:24px;" data-reactid="19">
                    <div data-reactid="20">
                        <div data-reactid="22">
                            <input type="email" id="useridInput" name="email" value="{{old('email')}}"
                                title="{{__('lbl.Email')}}" class="text-input req"
                                placeholder="" required />
                        </div>
                    </div>
                    <div id="error-caption"
                        style="font-weight:500;font-size:12px;line-height:24px;color:rgb(203, 56, 11);box-sizing:border-box;"
                        data-reactid="24">
                        <div data-reactid="25"></div>
                    </div>
                </div>

                <label class="label" id="input-label" for="useridInput" data-reactid="18">
                    {{__('lbl.PhoneNumber')}}  (required)
                </label>
                <div style="margin-bottom:24px;" data-reactid="19">
                    <div data-reactid="20">
                        <div data-reactid="22">
                            <input type="number" id="useridInput" name="phone_number" value="{{old('phone_number')}}"
                                title="{{__('lbl.PhoneNumber')}}" class="text-input"
                                placeholder="" required /> <!-- pattern="[0-9]{3}-[0-9]{2}-[0-9]{3}" -->
                        </div>
                    </div>
                    <div id="error-caption"
                        style="font-weight:500;font-size:12px;line-height:24px;color:rgb(203, 56, 11);box-sizing:border-box;"
                        data-reactid="24">
                        <div data-reactid="25"></div>
                    </div>
                </div>
                
                <div class="next-button-wrapper">
                    <input type="submit" class="btn submit-btn" value="Submit" />
                </div>
				<div class="push-small--top" data-reactid="30">
                    <div id="login-recaptcha" data-reactid="31"></div>
                </div>
                <div class="small push-small--bottom push-small--top" id="sign-up-link-only" data-reactid="32">
                    <p class=" display--inline" data-reactid="33">{{__('lbl.AlreadyUser')}} <a href="{{ route('customer_login') }}">{{__('lbl.Signin')}}</a>
                    </p>
                </div>
            {{ Form::close()}}
        </div>
	</div>
</div>

@endsection