@extends('frontLayout.frontlayout')
@section('content')
@php
    use App\Libraries\GoogleLib;
    use App\Libraries\Facebook;
    use App\Models\Admin\Settings;
@endphp
<!-- ==== login === -->
<section class="login_wrap register">
    <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="login_inner">
                    <div class="row align-items-lg-center">
                        <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-12 col-12">
                            <div class="left-side">
                                <div class="content">
                                    <h4>
                                        <span>Welcome!</span> Join {{ Settings::get('company_name') }} in few minutes!
                                    </h4>
                                </div>
                                <div class="logi-banner">
                                    <img src="{{url('assets/frontend/images/login_banner.png')}}" alt="" />
                                </div>
                            </div>
                        </div>
                        <div class="offset-xl-1 col-xxl-5 col-xl-5 col-lg-6 col-md-6 col-sm-12 col-12">
                            <div class="right-side">
                                <div class="form-head-line">
                                    <h4>
                                        Create Account
                                    </h4>
                                </div>
                                @include('user.partials.flash_messages')
                                <form method="post" id="registration" class="registration">
                                    <!--!! CSRF FIELD !!-->
                                    @csrf
                                    <div class="shifte">
                                        <div class="form-inner-tbs">
                                            <div class="tab-content" id="nav-tabContent">
                                                <div class="tab-pane fade show active" id="nav-user" role="tabpanel" aria-labelledby="nav-user-tab">
                                                    <div class="tbs-inner-form">
                                                        <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="first_name">First name</label>
                                                                    <input type="text" class="form-control" name="first_name" id="first_name" placeholder="Enter your first name">
                                                                    @error('first_name')
                                                                        <small class="text-danger">{{ $message }}</small>
                                                                    @enderror
                                                                </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 for="last_name">Last name</label>
                                                                    <input type="text" class="form-control" name="last_name" id="last_name" placeholder="Enter your last name">
                                                                    @error('last_name')
                                                                        <small class="text-danger">{{ $message }}</small>
                                                                    @enderror
                                                                </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 for="email">Email</label>
                                                                    <input type="email" class="form-control" name="email" id="email" placeholder="Enter your email">
                                                                    @error('email')
                                                                        <small class="text-danger">{{ $message }}</small>
                                                                    @enderror
                                                                </div>
                                                               
                                                            </div>
                                                            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                                                <div class="login-clck">
                                                                    <button type="submit" class="btn btn-primary w-100 d-block">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="login-option-head">
                                                                    <p>or Sign up with</p>
                                                                </div>
                                                            </div>
                                                            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                                                <div class="login-option">
                                                                    <ul>
                                                                        <li>
                                                                            <a href="{{GoogleLib::loginURL()}}">
                                                                                <i class="fab fa-google"></i>
                                                                            </a>
                                                                        </li>
                                                                        <li>
                                                                            <a href="{{Facebook::loginUrl()}}">
                                                                                <i class="fab fa-facebook-f"></i>
                                                                            </a>
                                                                        </li>                                                                        
                                                                    </ul>
                                                                </div>
                                                            </div>
                                                            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                                                <div class="dont-have-acc">
                                                                    <p>Already have an account?<a href="{{route('user.login')}}"> Sign In</a></p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

@endsection