{{-- section --}}
<section class="min-vh-100 h-100">
    <div class="container">
        <div class="row align-items-center min-vh-100" wire:ignore>




            {{-- leftCol --}}
            <div class="col-7">
                <div data-aos="zoom-in" data-aos-duration="600" data-aos-once="true" class="d-block text-center">
                    <img class="of-contain w-100 login--logo" src="{{url('assets/img/Logo/logo@2x.png')}}">
                    <img class="of-contain w-100 login--image" src="{{url('assets/img/Login/login@2x.png')}}">
                </div>
            </div>






            {{-- --------------------------------------------- --}}
            {{-- --------------------------------------------- --}}








            {{-- rightCol --}}
            <div class="col-5 col-xxl-4 offset-xxl-1 ">



                {{-- form --}}
                <form wire:submit='checkUser' data-aos="fade-left" data-aos-duration="600" data-aos-once="true"
                    class="login--form">




                    {{-- loading spinner --}}
                    <span wire:loading wire:target='checkUser'
                        class="spinner-border spinner-border-sm text-success spinner--float-right-top ar"
                        role="status"></span>



                    {{-- subHeading --}}
                    <h2 class="text-center fw-bold mb-4 pb-1 mt-2 text-login" data-aos="{{ __('flip-up') }}"
                        data-aos-duration="800" data-aos-delay="600" data-aos-once="true">{{ __('Login.') }}</h2>




                    {{-- email --}}
                    <input wire:model='email' class="form-control form--input mb-4" type="email" name='email' required
                        data-aos="{{ __('flip-up') }}" data-aos-duration="800" data-aos-delay="600" data-aos-once="true"
                        placeholder="{{ __('Email Address') }}">





                    {{-- password --}}
                    <input wire:model='password' class="form-control form--input mb-3" type="password" name='password'
                        required data-aos="{{ __('flip-up') }}" data-aos-duration="800" data-aos-delay="600"
                        data-aos-once="true" placeholder="{{ __('Password') }}">





                    {{-- cookies checkbox --}}
                    <div class="form-check d-flex align-items-center ms-1 pt-2 mb-5 ar--direction"
                        data-aos="{{ __('flip-up') }}" data-aos-duration="800" data-aos-delay="600"
                        data-aos-once="true">

                        <input class="form-check-input mt-0 checkbox--rounded" type="checkbox" id="formCheck-1">

                        <label class="form-check-label fs-14 ms-3 checkbox--login text-login" for="formCheck-1">
                            {{ __('Keep me logged-In') }}
                        </label>

                    </div>





                    {{-- ----------------------- --}}
                    {{-- ----------------------- --}}





                    {{-- submit --}}
                    <button wire:loading.attr='disabled' wire:target='checkUser' type="submit"
                        class="btn w-100 btn--scheme btn--scheme-login py-2 mb-1 scale--self-05"
                        data-aos="{{ __('flip-up') }}" data-aos-duration="800" data-aos-delay="600"
                        data-aos-once="true">{{ __('Sign In') }}</button>



                    {{-- forgot password --}}
                    <button class="btn w-100 btn--outline-login-link mb-3 scale--self-05 "
                        data-aos="{{ __('flip-up') }}" data-aos-duration="800" data-aos-delay="600" data-aos-once="true"
                        type="button">
                        {{ __('Forgot Password?') }}
                    </button>





                </form>
            </div>
            {{-- endCol --}}




        </div>
    </div>
</section>
{{-- end section --}}