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

<section class="signup_section top-space">
    <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="header_area">
                    <h1>Sign up</h1>
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam maximus orci at turpis suscipit rutrum.</p>
                    <div class="header_image1">
                        <img src="{{ url('frontend/images/vector1.png') }}" alt="..." />
                    </div>
                </div>
            </div>
            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                <div class="sign_up_form_start">
                    @include('user.partials.flash_messages')
                    <form action="{{ route('user.signup') }}" method="post" class="registration-validation">
                        <!--!! CSRF FIELD !!-->
                        {{ csrf_field() }}
                        <div class="row">
                            <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12">
                                <div class="signup_left_area">
                                    <div class="left_formd">
                                        <div class="row">
                                            <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12">
                                                <div class="form-group">
                                                    <label class="set_error">First name</label>
                                                    <input type="text" class="form-control alpha_space" name="first_name" value="{{ old('first_name') }}" placeholder="First name" autocomplete="off" required/>
                                                    <label id="first_name-error" class="error" for="first_name">@error('first_name') {{ $message }} @enderror</label>
                                                </div>
                                            </div>
                                            <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12">
                                                <div class="form-group">
                                                    <label class="set_error">Last name</label>
                                                    <input type="text" class="form-control alpha_no_space" name="last_name" placeholder="Last name" value="{{ old('last_name') }}" autocomplete="off" required/>
                                                    <label id="last_name-error" class="error" for="last_name">@error('last_name') {{ $message }} @enderror</label>
                                                </div>
                                            </div>
                                            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                                <div class="form-group">
                                                    <label class="set_error">Buyer/seller Type</label>
                                                    <select class="form-select" name="user_type" id="seller_type" required>
                                                        <option value="" selected>Select Buyer/seller Type</option>
                                                        <option value="buyer" @if(old('first_name') == 'buyer') {{ 'selected' }} @endif >Private buyer or seller</option>
                                                        <option value="seller" @if(old('first_name') == 'seller') {{ 'selected' }} @endif>Registered Seller (RS)</option>
                                                        <option value="rbe" @if(old('first_name') == 'rbe') {{ 'selected' }} @endif>Registered Breeding Establishment (RBE)</option>
                                                        <option value="rco" @if(old('first_name') == 'rco') {{ 'selected' }} @endif>Registered Charitable Organisation</option>
                                                    </select>
                                                    <label id="user_type-error" class="error" for="user_type">@error('user_type') {{ $message }} @enderror</label>
                                                </div>
                                            </div>
                                            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12 seller_group">
                                                <div class="form-group">
                                                    <label class="set_error">Seller ID</label>
                                                    <span class="text-danger"> *</span>
                                                    <input type="text" class="form-control alpha_number" name="seller_id" value="{{ old('seller_id') }}" placeholder="Seller ID" autocomplete="off" />
                                                    <label id="seller_id-error" class="error" for="seller_id">@error('seller_id') {{ $message }} @enderror</label>
                                                </div>
                                            </div>
                                            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12 rbe_group">
                                                <div class="form-group">
                                                    <label class="set_error">RBE number</label>
                                                    <span class="text-danger"> *</span>
                                                    <input type="text" class="form-control alpha_number rbe_group_input" name="rbe_number" value="{{ old('rbe_number') }}" placeholder="RBE No" autocomplete="off"  />
                                                    <label id="rbe_number-error" class="error" for="rbe_number">@error('rbe_number') {{ $message }} @enderror</label>
                                                </div>
                                            </div>
                                            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12 rbe_group">
                                                <div class="form-group">
                                                    <label class="set_error">Maximum number of breeding bitches </label><span class="text-danger"> *</span>
                                                    <input type="text" class="form-control number_only" name="rbe_breeding_bitches" value="{{ old('rbe_breeding_bitches') }}" placeholder="Max number of breeding bitches" autocomplete="off" />
                                                    <label id="rbe_breeding_bitches-error" class="error" for="rbe_breeding_bitches">@error('rbe_breeding_bitches') {{ $message }} @enderror</label>
                                                </div>
                                            </div>
                                            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12 charitable_group">
                                                <div class="form-group">
                                                    <label class="set_error">Charitable number </label>
                                                    <span class="text-danger"> *</span>
                                                    <input type="text" class="form-control alpha_number" name="charitable_number" value="{{ old('charitable_number') }}" placeholder="Charitable no" autocomplete="off" />
                                                    <label id="charitable_number-error" class="error" for="charitable_number">@error('charitable_number') {{ $message }} @enderror</label>
                                                </div>
                                            </div>
                                            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                                <div class="form-group">
                                                    <label class="set_error">Business name/ Kennel name</label>
                                                    <input type="text" class="form-control" name="business_name" value="{{ old('business_name') }}" placeholder="Enter name" required/>
                                                    <label id="business_name-error" class="error" for="business_name">@error('business_name') {{ $message }} @enderror</label>
                                                </div>
                                            </div>
                                            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                                <label class="set_error">Mobile number <span class="text-danger">*</span></label>
                                                <div class="row">
                                                    <div class="col-xxl-12 col-xl-9 col-lg-9 col-md-9 col-sm-9 col-8">
                                                        <div class="form-group">
                                                            <div class="col-12">
                                                                <input class="o-phone" type="hidden" name="phonenumber" value="{{ old('phonenumber') }}">
                                                                <input type="tel" id="phone-input" class="form-control" value="{{ old('phonenumber') }}" placeholder="Enter your mobile number" required/>
                                                            </div>
                                                            <label id="phone-input-error" class="error" for="phone-input">@error('phonenumber') {{ $message }} @enderror</label>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                                <div class="form-group">
                                                    <label class="set_error">Email address</label>
                                                    <input type="email" class="form-control" name="email" value="{{ old('email') }}" placeholder="Email address" autocomplete="off" required/>
                                                    <label id="email-error" class="error" for="email">@error('email') {{ $message }} @enderror</label>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="sign_wrap_img">
                                        <img src="{{ url('frontend/images/dfd.png') }}" alt=".." />
                                    </div>
                                </div>
                            </div>
                            <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12">
                                <div class="sign_up_form">
                                    <div class="row">
                                        <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12">
                                            <div class="form-group">
                                                <label class="set_error">Country</label>
                                                <select class="form-select select2" name="country_id" id="country_id" required>
                                                    <option value="" selected>Select Country</option>
                                                    @foreach($countries as $p)
                                                    <option value="{{ $p['id'] }}" @if(old('country_id') == $p['id']) {{ 'selected' }} @endif>{{ $p['short_name'] }}</option>
                                                    @endforeach
                                                </select>
                                                <label id="country_id-error" class="error" for="country_id">@error('country_id') {{ $message }} @enderror</label>
                                            </div>
                                        </div>
                                        <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12">
                                            <div class="form-group">
                                                <label class="set_error">County</label>
                                                <select class="form-select select2" name="state_id" id="state_id" required>
                                                    <option value="" selected>Select County</option>
                                                </select>
                                                <label id="state_id-error" class="error" for="state_id">@error('state_id') {{ $message }} @enderror</label>
                                            </div>
                                        </div>
                                        <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12">
                                            <div class="form-group">
                                                <label class="set_error">City/Town</label>
                                                <select class="form-select select2" name="city_id" id="city_id" >
                                                    <option value="" selected>Select City/Town</option>
                                                </select>
                                                <label id="city_id-error" class="error" for="city_id">@error('city_id') {{ $message }} @enderror</label>
                                            </div>
                                        </div>
                                         <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12">
                                            <div class="form-group">
                                                <label class="set_error">Postal code</label>
                                                <input type="text" class="form-control" placeholder="Postal code" name="zipcode">
                                                {{-- <select class="form-select select2" name="postal_code_id" id="postal_code_id" required>
                                                    <option value="" selected>Select Postal Code</option>
                                                </select> --}}
                                                <label id="postal_code_id-error" class="error" for="postal_code_id">@error('postal_code_id') {{ $message }} @enderror</label>
                                            </div>
                                        </div>
                                        <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                            <div class="form-group">
                                                <label class="set_error">Address</label>
                                                <input type="text" class="form-control" name="address" value="{{ old('address') }}" placeholder="Address" autocomplete="off"required/>
                                                <label id="address-error" class="error" for="address">@error('address') {{ $message }} @enderror</label>
                                            </div>
                                        </div>
                                        <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12">
                                            <div class="form-group">
                                                <label for="password">Password</label>
                                                <input type="password" class="form-control" name="password" value="{{ old('password') }}" placeholder="Password" autocomplete="off" required/>
                                                <label id="password-error" class="error" for="password">@error('password') {{ $message }} @enderror</label>
                                            </div>
                                        </div>
                                        <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12">
                                            <div class="form-group">
                                                <label for="password">Confirm Password</label>
                                                <input type="password" class="form-control" name="confirm_password" value="{{ old('confirm_password') }}" placeholder="Confirm password" autocomplete="off" required/>
                                                <label id="confirm_password-error" class="error" for="confirm_password">@error('confirm_password') {{ $message }} @enderror</label>
                                            </div>
                                        </div>
                                        <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                            <div class="form-group">
                                                <div class="custom-control custom-checkbox">
                                                    <input type="checkbox" class="custom-control-input" id="l-1" name="agree" value="1" @if(old('agree') == 1) {{ 'checked' }} @endif required>
                                                    <label class="custom-control-label" for="l-1">This is to certify that I have read and agreed to browse4dogs Terms of service.</label>
                                                </div>
                                                <label id="agree-error" class="error" for="agree">@error('agree') {{ $message }} @enderror</label>
                                            </div>
                                        </div>
                                        <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                            <div class="form-group">
                                                <div class="custom-control custom-checkbox">
                                                    <input type="checkbox" class="custom-control-input" id="l-2" name="preferences_type" value="1" @if(old('preferences_type') == 1) {{ 'checked' }} @endif required>
                                                    <label class="custom-control-label" for="l-2">I would like to subscribe to mailing list for offers & news</label>
                                                </div>
                                                <label id="preferences_type-error" class="error" for="preferences_type">@error('preferences_type') {{ $message }} @enderror</label>
                                            </div>
                                        </div>
                                        <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                            <div class="left">
                                                <div class="icon">
                                                    <i class="fal fa-exclamation-square"></i>
                                                </div>
                                            </div>
                                            <div class="right">
                                                <div class="content">
                                                    <p>
                                                        Once your account has been created, your Name, Phone Number, Seller ID and RBE Number (If applicable) cannot be changed. You will have to contact administrator if any changes are required.
                                                    </p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                            <div class="signup_btnn">
                                                <button type="submit" class="btn btn-primary w-100">Sign up</button>
                                            </div>
                                        </div>
                                        <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                            <div class="sign_up_button">
                                                <p>Already have an account? <a href="{{ route('user.login') }}">Login</a></p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <div class="image_2">
        <img src="{{ url('frontend/images/vector2.png') }}" alt="..." />
    </div>
</section>

@endsection