@include('more.partials._header')

    <section class="section-padding-equal-70">
        <div class="container">
            <div class="row">
                <div class="col-lg-4">
                    <br />
                    <h4 class="item-title text-center">
                        <strong>
                            Create your More Classifieds Account now for <span class="text-danger">FREE</span>
                        </strong>
                    </h4>
                    {{-- <br /> --}}
                    <img src="/more/media/logo-dark.png" alt="logo" class="img-fluid">
                    {{-- <br /> --}}
                    <hr>
                    <br />
                    <p class="lead">
                        To protect and help you sell or buy safely, please register or login.
                    </p>
                    <ul class="list-unstyled" style="line-height: 2">
                    <li><span class="fa fa-check text-danger"></span> Set up your account for free!</li>
                        <li><span class="fa fa-check text-danger"></span> Post new ad listings</li>
                        <li><span class="fa fa-check text-danger"></span> Manage ad llistings</li>
                        <li><span class="fa fa-check text-danger"></span> Save your favorite ads</li>
                        <li><span class="fa fa-check text-danger"></span> Get a free ad listings analytics dashboard</li>
                        <li><span class="fa fa-check text-danger"></span> Promote your ad listings</li>
                        {{-- <li><a href="/read-more/"><u>Read more</u></a></li> --}}
                    </ul>
                    {{-- <p><a href="/new-customer/" class="btn btn-info btn-block">Yes please, register now!</a></p> --}}
                </div>
                <div class="col-lg-8 sidebar-break-sm sidebar-widget-area mt-0">
                    <div class="myaccount-login-form light-shadow-bg">
                        <div class="light-box-content">
                            <div class="row">
                                <div class="col-lg-12">
                                    <div class="form-box registration-form">
                                        <h3 class="item-title text-center">
                                            {{ $title }}
                                        </h3>

                                        <ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
                                            <li class="nav-item">
                                                <a class="nav-link active" id="pills-home-tab" data-toggle="pill" href="#pills-home" role="tab" aria-controls="pills-home" aria-selected="true">
                                                    As Seller
                                                </a>
                                            </li>
                                            <li class="nav-item">
                                                {{-- <a class="nav-link" id="pills-profile-tab" data-toggle="pill" href="#pills-profile" role="tab" aria-controls="pills-profile" aria-selected="false">Buyer</a> --}}
                                                {{-- join-as-buyer --}}
                                                <a class="nav-link" href="/join-as-buyer">As Buyer</a>
                                            </li>
                                          </ul>
                                          <div class="tab-content" id="pills-tabContent">
                                            <div class="tab-pane fade show active" id="pills-home" role="tabpanel" aria-labelledby="pills-home-tab">
                                                <form id="sellerRegisterForm" action="/rejestruj" method="POST" enctype="multipart/form-data" autocomplete="off">
                                                    @csrf
                                                    @if ($errors->any())
                                                        <div class="alert alert-danger alert-dismissible fade show" role="alert">
                                                            <ul>
                                                                @foreach ($errors->all() as $error)
                                                                    <li>{{ $error }}</li>
                                                                @endforeach
                                                            </ul>
                                                            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                                                <span aria-hidden="true">&times;</span>
                                                            </button>
                                                        </div>
                                                    @endif
        
                                                    @if (Session::has('error'))
                                                        <div class="alert alert-danger alert-dismissible fade show" role="alert">
                                                            {{ Session::get('error') }}
                                                            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                                                <span aria-hidden="true">&times;</span>
                                                            </button>
                                                        </div>
                                                    @endif
                                                    <!-- //success -->
                                                    @if (Session::has('success'))
                                                        <div class="alert alert-success alert-dismissible fade show" role="alert">
                                                            {{ Session::get('success') }}
                                                            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                                                <span aria-hidden="true">&times;</span>
                                                            </button>
                                                        </div>
                                                    @endif
                                                    <div class="row">
                                                        <div class="col-12">
                                                            <p>
                                                                <span style="color: #ff0000">*</span> Required Item
                                                            </p>
                                                        </div>
                                                        <div class="col-12">
                                                            <div class="form-group">
                                                                <label for="inputUserType">Type of business<span style="color: #ff0000">* (Choose the business type that suites you)</span></label>
                                                                <div class="row">
                                                                    <div class="col-lg-4 col-sm-12">
                                                                        <div class="form-check">
                                                                            <input style="width: 9%;" class="form-check-input" type="radio" name="user_type" id="individual" value="individual" checked>
                                                                            <label class="form-check-label" for="individual">
                                                                            Individual
                                                                            </label>
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-lg-4 col-sm-12">
                                                                        <div class="form-check">
                                                                            <input style="width: 9%;" class="form-check-input" type="radio" name="user_type" id="company" value="company">
                                                                            <label class="form-check-label" for="company">
                                                                                Company
                                                                            </label>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="row">
                                                        <div class="col-lg-6 col-sm-12">
                                                            <div class="form-group">
                                                                <label>Name<span style="color: #ff0000">*</span></label>
                                                                <input type="text" class="form-control" name="name" placeholder="What's your name?" id="registration-username" required >
                                                                <input type="hidden" name="role_id" value="2"/>
                                                                {{-- <div class="help-block">Username cannot be changed.</div> --}}
                                                            </div>
                                                        </div>
                                                        <div class="col-lg-6 col-sm-12">
                                                            <div class="form-group">
                                                                <label for="inputState">Receive message alerts<span style="color: #ff0000">*</span></label>
                                                                <select style="padding: 0 2%;" id="inputState" class="form-control" name="auth_field" required>
                                                                  <option selected>Select</option>
                                                                  <option value="email">Via E-mail</option>
                                                                  <option value="sms">Via SMS</option>
                                                                </select>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="form-group row">
                                                        <div class="col-lg-6 col-sm-12">
                                                            <label>Email</label>
                                                            <input type="email" class="form-control" placeholder="Enter your email address" name="email" id="registration-email">
                                                        </div>
                                                        <div class="col-lg-6 col-sm-12">
                                                            <label>Phone<span style="color: #ff0000">*</span></label>
                                                            <input type="text" class="form-control" name="phone" placeholder="Enter your phone number" id="registration-phone" required>
                                                        </div>
                                                    </div>
                                                    <div class="form-group row">
                                                        <div class="col-lg-6 col-md-12">
                                                            <label>Password<span style="color: #ff0000">*</span></label>
                                                            <input type="password" class="form-control" name="password" placeholder="Enter your password" id="registration-password" required>
                                                        </div>
                                                        <div class="col-lg-6">
                                                            <label>Confirm password<span style="color: #ff0000">*</span></label>
                                                            <input type="password" class="form-control" name="password_confirmation" id="confirm-password" placeholder="Re-type your password" required>
                                                        </div>
                                                    </div>
                                                    
                                                    <div class="row form-group">
                                                        <div class="location-selection col-lg-6 col-sm-12">
                                                            <div class="form-group">
                                                                <label>Your location<span style="color: #ff0000">*</span></label>
                                                                <input id="ploca" data-toggle="modal" data-target="#exloc1" class="form-control" type="text" placeholder="Select your location" name="location">
                                                                <div class="help-block">
                                                                    <span style="color: #ff0000;">Note: Click & choose a location from the list. Avoid entering manually.</span>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="col-lg-6 col-sm-12">
                                                            <div class="form-group">
                                                                <label>Address (<span class="help-block" style="color: #ff0000;">Indicate the exact location</span>)</label>
                                                                <input id="address" class="form-control" type="text" placeholder="Road, building, office no" name="address">
                                                                {{-- <div>
                                                                </div> --}}
                                                            </div>
                                                        </div>
                                                    </div>
                                                    {{-- <br /> --}}
                                                    
                                                    <div class="form-group">
                                                        <input type="submit" class="submit-btn" value="Register">
                                                    </div>
                                                    <div class="form-group">
                                                        Already joined More Classifieds? <a href="/access" class="forgot-password">Login</a>
                                                    </div>
        
                                                    <div class="form-group">
                                                        <p>
                                                            By registering, I agree to More Classifieds' <a href="/legal/terms-of-use" target="_blank" style="color: #f94f01">Terms of Use</a> and <a href="/legal/privacy-policy" target="_blank" style="color: #f94f01">Privacy Policy</a> and I consent to receiving marketing communications from More Classifieds.
                                                            {{-- By Signing up, you agree to More Classified's <a href="#" target="__blank">User Agreement</a>, <a href="#" target="__blank">Privacy Policy</a>, and <a href="#" target="__blank">Cookie Policy</a>. --}}
                                                        </p>
                                                        {{-- <br/> --}}
                                                    </div>
                                                </form>
                                            </div>
                                          </div>
                                          

                                        <div class="or-container"><div class="line-separator"></div> <div class="or-label">or</div><div class="line-separator"></div></div>
                                        
                                        <div class="kpx_login" style="text-align: center">
                                            {{-- <h3 class="kpx_authTitle">Sign up using: </h3> --}}
                                            <div class="row">
                                                
                                                {{-- <div class="col-xs-4 col-sm-4">
                                                    <a href="/facebook/redirect" class="btn-facebook"
                                                        data-toggle="tooltip" data-placement="top" title="Sign in with Facebook">
                                                        <i class="fab fa-facebook fa-4x"></i>
                                                        <span>Facebook sign in</span>
                                                    </a>
                                                </div> --}}
                                                <div class="col-xs-4 col-sm-4">
                                                    {{-- <a href="/google/redirect" class="btn-google" 
                                                    data-toggle="tooltip" data-placement="top" title="Sign in with Google">
                                                        <i class="fab fa-google fa-4x"></i>
                                                        <span>Google sign in</span>
                                                    </a> --}}

                                                    <a href="/google/redirect" class="btn-google login-with-google-btn" 
                                                        data-toggle="tooltip" data-placement="top" title="Sign in with Google">
                                                        {{-- <i class="fab fa-google fa-4x"></i> --}}
                                                        {{-- <span>Google sign in</span> --}}
                                                        Sign up with Google
                                                    </a>
    
                                                </div>
                                                {{-- <div class="col-xs-4 col-sm-4">
                                                    <a href="/twitter/redirect" class="btn-twitter"
                                                        data-toggle="tooltip" data-placement="top" title="Sign in with Twitter">
                                                        <i class="fab fa-twitter fa-4x"></i>
                                                        <span>Twitter sign in</span>
                                                    </a>
                                                </div> --}}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </section>

@include('more.partials._footer')