@extends('auth.app')
@push('title')
    {{$pageTitle}}
@endpush
@section('content')

    <section class=" p-3 h-100 d-flex align-items-center">
        <div class="bda-w-card">
            <div class="bda-mb-30">
                <a href="{{route('frontend-settings')}}">
                    <img class="bda-logo-main" src="{{ getImageUrl(getOption('white_logo')) }}" alt="logo">
                </a>
            </div>
            <h5 class="bda-fs-40 title-light bda-mb-10">{{__("Sign In")}}</h5>
            <p class="bda-mb-30">{{__("Welcome back! Please signing to continue.")}}</p>
            </p>
            <form method="POST" action="{{ route('login') }}" id="loginForm">
                @csrf
                <div class="bda-from-box">
                    <label for="emailInput" class="bda-text-label">{{__("Email")}}</label>
                    <input type="email" class="bda-from-control @error('email') is-invalid @enderror" name="email"
                           id="emailInput" placeholder="{{__("Enter your email")}}">
                    @error('email')
                    <span class="fst-normal invalid-feedback mb-3 ms-1 mt-0 mt-2 pt-0" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                    @enderror
                </div>
                <div class="bda-from-box">
                    <label for="passwordInput" class="bda-text-label">{{__("Password")}}</label>
                    <input type="password"
                           class="bda-from-control password-field @error('password') is-invalid @enderror"
                           id="passwordInput" name="password" placeholder="{{__("Enter your password")}}">
                    <i class="ri-eye-line fw"></i>
                    @error('password')
                    <span class="fst-normal invalid-feedback mb-3 ms-1 mt-0 mt-2 pt-0" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                    @enderror
                </div>
                <div class="bda-mb-30 bda-mt-10">
                    <a href="{{route('password.request')}}">{{__("Forgot password?")}}</a>
                </div>
                <input type="hidden" name="recaptcha_token" id="recaptchaToken" class="bda-mt-10">
                <div class="bda-mb-30 bda-mt-10">
                    <button type="submit" class="bda-btu-theme">{{__("Login")}}</button>
                </div>
                <p>{{__("Don't have an account?")}} <a class="title-light"
                                                       href="{{route('register')}}">{{__("Create an account")}}</a>
                <div class="row bda-mt-30">
                    <div class="col-md-6 {{ getOption('google_login_status') != ACTIVE ? 'd-none' : ''}}">
                        <a href="{{ route('login.google') }}" class="bda-social-login-social-btu">
                            <img src="{{getImageUrl('assets/images/google.png')}}" alt="">
                            <span>{{__("Google")}}</span>
                        </a>
                    </div>
                    <div class="col-md-6 {{ getOption('facebook_login_status') != ACTIVE ? 'd-none' : ''}}">
                        <a href="{{route('login.facebook')}}" class="bda-social-login-social-btu">
                            <img src="{{getImageUrl('assets/images/facebook.png')}}" alt="">
                            <span>{{__("Facebook")}}</span>
                        </a>
                    </div>
                </div>
            </form>
            @if(env('APP_DEMO', false))
                <div class="row p-3">
                    <table
                        class="accordion table-login-page-credential-color fs-16 table table-bordered table-dark table-responsive">
                        <tbody>
                        <tr>
                            <td class="bda-pt-12">admin@gmail.com</td>
                            <td class="bda-pt-12">12345678</td>
                            <td>
                                <button type="button"
                                        class="bd-social-submit  login-credential-copy-action p-1 upper-bg title-light rounded-4 bda-border-stroke w-100"
                                        data-user="admin">{{__("Copy")}}</button>
                            </td>
                        </tr>
                        <tr>
                            <td class="bda-pt-12">user@gmail.com</td>
                            <td class="bda-pt-12">12345678</td>
                            <td>
                                <button type="button"
                                        class="bd-social-submit login-credential-copy-action p-1 upper-bg title-light rounded-4 bda-border-stroke w-100"
                                        data-user="user">{{__("Copy")}}</button>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            @endif
        </div>
    </section>
@endsection

@push('script')
    @if(getOption('recaptcha_status') == ACTIVE)
        <script src="https://www.google.com/recaptcha/api.js?render={{ getOption('recaptcha_site_key') }}"></script>
        <script>
            grecaptcha.ready(function () {
                grecaptcha.execute('{{ getOption('recaptcha_site_key') }}', {action: 'login'}).then(function (token) {
                    document.getElementById('recaptchaToken').value = token;
                });
            });
        </script>
    @endif
    <script>
        $(document).ready(function () {
            $(document).on("click", ".login-credential-copy-action", function () {
                var user = $(this).data('user');
                $("#emailInput").val(user + '@gmail.com');
                $("#passwordInput").val(12345678);
            });
        });
    </script>
@endpush
