@extends('layouts' . '.' . get_frontend_settings('theme'))
@push('title', get_phrase('Log In'))
@push('meta')@endpush
@push('css')
    <style>
        .form-icons .right {
            right: 20px;
            cursor: pointer !important;
        }
        .alert {
            border-radius: 8px;
            margin-bottom: 20px;
        }
    </style>
@endpush
@section('content')
    @if (get_frontend_settings('theme') == 'default')
        <!------------------- Login Area Start  ------>
        <section class="login-area">
            <div class="container">
                <div class="row">
                    <div class="col-lg-7 col-md-6">
                        <div class="login-img">
                            <img src="{{ asset('assets/frontend/default/image/login.gif') }}" alt="...">
                        </div>
                    </div>
                    <div class="col-lg-5 col-md-6">
                        <form action="{{ route('login') }}" class="global-form login-form mt-25" id="login-form" method="POST">
                            @csrf
                            <h4 class="g-title">{{ get_phrase('Login') }}</h4>
                            <p class="description">{{ get_phrase('See your growth and get consulting support!') }} </p>
                            <div class="form-group">
                                <label for="email" class="form-label">{{ get_phrase('Email') }}</label>
                                <input type="email" id="email" name="email" class="form-control @error('email') is-invalid @enderror" placeholder="{{ get_phrase('Your Email') }}" value="{{ old('email') }}" required>
                                @error('email')
                                    <div class="invalid-feedback">
                                        {{ $message == 'validation.required' ? get_phrase('Email is required') : $message }}
                                    </div>
                                @enderror
                            </div>
                            <div class="form-group">
                                <label for="" class="form-label">{{ get_phrase('Password') }}</label>
                                <input type="password" id="password" name="password" class="form-control @error('password') is-invalid @enderror" placeholder="*********" required>
                                @error('password')
                                    <div class="invalid-feedback">
                                        {{ $message == 'validation.required' ? get_phrase('Password is required') : $message }}
                                    </div>
                                @enderror
                            </div>
                            <div class="form-group mb-25 d-flex justify-content-between align-items-center remember-me">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" name="remember" id="flexCheckChecked" {{ old('remember') ? 'checked' : '' }}>
                                    <label class="form-check-label hover-color-1" for="flexCheckChecked">{{ get_phrase('Remember Me') }}</label>
                                </div>
                                <a class="hover-color-2" href="{{route('password.request')}}">{{ get_phrase('Forget Password?') }}</a>
                            </div>

                            @if(get_frontend_settings('recaptcha_status'))
                                <button class="eBtn gradient w-100 g-recaptcha" data-sitekey="{{ get_frontend_settings('recaptcha_sitekey') }}" data-callback='onLoginSubmit' data-action='submit'>{{ get_phrase('Login') }}</button>
                            @else
                                <button type="submit" class="eBtn gradient w-100">{{ get_phrase('Login') }}</button>
                            @endif

                            @if(get_settings('google_login'))
                                {{-- Or Divider --}}
                                <div class="divider mt-4 mb-4">
                                    <span>{{ get_phrase('Or') }}</span>
                                </div>

                                {{-- Google Login Button --}}
                                <a href="{{ route('google.redirect') }}" class="google-login-btn w-100">
                                    <img src="{{ asset('assets/frontend/default/image/Google.png') }}" alt="Google Logo">
                                    {{ get_phrase('Login with Google') }}
                                </a>
                            @endif

                            <p class="mt-20">{{ get_phrase('Not have an account yet?') }}
                                <a class="hover-color-1" href="{{ route('register.form') }}">{{ get_phrase('Create Account') }}</a>
                            </p>
                        </form>
                    </div>
                </div>
            </div>
        </section>
    @endif
@endsection
