@extends('layout.appHome')

@section('content')

<section class="section login-banner">
    <div class="container">
        <div class="row">
            <div class="col-12">
                <div class="page-banner">
                    <div class="row justify-content-center">
                        <div class="col-xxl-4 col-xl-5 col-lg-6 col-md-6 col-sm-12">
                            <div class="align-middle">
                                <div class="headings">
                                    <h1 class="text-lightBlack">
                                        <span>The</span>
                                            <span>
                                                <font class="text-burntOrange">U</font><font class="text-darkOrange">World</font>
                                            </span>
                                        <span>Passport</span>
                                    </h1>
                                    <p class="text-lightBlack">One login across our entire ecosystem</p>
                                </div>
                            </div>
                        </div>
                        <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-12">
                            <div class="align-middle">
                                <div class="ucard mh-460 br-black margin-lr p-4">
                                    <div class="tab-menu left-align">
                                        <ul>
                                            <li class="active">Login</li>
                                            <li><a href="{{ url('register') }}">Signup</a></li>
                                        </ul>
                                    </div>
                                    <form name="login" class="uform" action="{{ route('login') }}" method="post">
                                        @csrf
                                        @include('common.notify')

                                        <div class="row">
                                            <div class="col">
                                                <label for="email">Email <span>*</span></label>
                                                <input type="email" id="email" class="form-control" name="email" value="" placeholder="yourname@domain.com" autocomplete="off" required />
                                                @if ($errors->has('email'))
                                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $errors->first('email') }}</strong>
                                    </span>
                                                @endif
                                            </div>
                                        </div>

                                        <div class="row">
                                            <div class="col">
                                                <label for="password">Password <span>*</span></label>
                                                <input type="password" id="password" class="form-control" name="password" value="" placeholder="**********" autocomplete="off" required />
                                                @if ($errors->has('password'))
                                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $errors->first('password') }}</strong>
                                    </span>
                                                @endif

                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col mb-3">
                                                <div class="g-recaptcha" data-sitekey="6LdVSiEhAAAAAL6knWMChNHwmjrQRI-VV92kMeMD"></div>
                                                <div class="capt_msg">Please check the recaptcha</div>
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col mb-4">
                                                <button type="submit" class="btn center btn-blue">Login</button>
                                            </div>
                                            <div class="col mb-4">
                                                <div class="align-middle align-items-end">
                                                    <a href="{{ url('password/forgot') }}" class="inline-link">Forgot Password?</a>
                                                </div>
                                            </div>
                                        </div>
                                    </form>
                                </div>

                            </div>
                        </div>
                    </div>
                    <div class="row justify-content-center">
                        <div class="col-lg-4 col-md-6 col-sm-12"></div>
                        <div class="col-lg-6 col-md-6 col-sm-10">
                            <p class="section-details margin-lr mt-4 text-white">
                                Don't have an account? <a href="{{ url('register') }}" class="inline-link text-white">Register Now</a>
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

<section class="section bg-white">
    <div class="container-fluid">
        <div class="row">
            <div class="col">
                <div class="section-heading mb-5">
                    <span class="tip">Explore</span>
                    <span class="title">Our Ecosystem</span>
                </div>
            </div>
        </div>
        <div class="row">

            <div class="ecosystems">
                <div class="ecowrap mb-4">
                    <a class="ecosystem-banner" href="https://uworld.ai/">
                        <img src="{{ asset('assets/images/banner/uworld.jpg') }}">
                    </a>
                </div>
                <div class="ecowrap mb-4">
                    <a class="ecosystem-banner" href="https://ufoundation.world/">
                        <img src="{{ asset('assets/images/banner/ufoundation.jpg') }}">
                    </a>
                </div>
                <div class="ecowrap mb-4">
                    <a class="ecosystem-banner" href="https://utokenize.world/">
                        <img src="{{ asset('assets/images/banner/utokenize.jpg') }}">
                    </a>
                </div>
                <div class="ecowrap mb-4">
                    <a class="ecosystem-banner" href="https://ucapital.world/">
                        <img src="{{ asset('assets/images/banner/ucapital.jpg') }}">
                    </a>
                </div>
                <div class="ecowrap mb-4">
                    <a class="ecosystem-banner" href="https://umoney.world/">
                        <img src="{{ asset('assets/images/banner/umoney.jpg') }}">
                    </a>
                </div>
                <div class="ecowrap mb-4">
                    <a class="ecosystem-banner" href="https://ustore.world/">
                        <img src="{{ asset('assets/images/banner/ustore.jpg') }}">
                    </a>
                </div>
                <div class="ecowrap mb-4">
                    <a class="ecosystem-banner" href="https://ugold.world/">
                        <img src="{{ asset('assets/images/banner/ugold.jpg') }}">
                    </a>
                </div>
            </div>

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

@endsection

@section('scripts')

<script>
$(document).ready(function() {
    $('.capt_msg').hide();
    $('form.uform').on('submit', function(e){
        $('.capt_msg').hide();
        var recaptcha=$("#g-recaptcha-response").val();
        if (recaptcha==="") {
            event.preventDefault();
            $('.capt_msg').show();
        }
    });
});
</script>

@endsection