@extends('layouts.auth')

@section('content')
  
  
   <div class="app-container auth-container">
    <div class="auth-logo">
        <h1>{{$siteName}}</h1>
    </div>

    <form class="auth-form login-form" method="POST" action="{{ route('login') }}">
                        @csrf
        <div class="auth-header">
        <h2>Welcome Back</h2>
        <p>Fill the form to log in</p>
        </div>
        
        <div class="input-group">
            <label>Email Address</label>
            <input type="text" class="@error('email') is-invalid @enderror" name="email" value="{{ old('email') }}"  id="email1" placeholder="Enter Email Address" required>
             @error('email')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
        </div>
        <div class="input-group">
            <label>Password</label>
            <input type="password" class=" @error('password') is-invalid @enderror" name="password" placeholder="Enter password" required>
            <a href="{{ route('password.request') }}" class="forgot-password">Forgot Password?</a>
        </div>
        
       @if($settings->captcha_mode)
    <div class="input-group">
        <!-- Google reCAPTCHA -->
        <div class="g-recaptcha" data-sitekey="{{ $settings->google_site_key }}" data-callback="enableSubmit"></div>
    </div>

    <button type="submit" class="btn-auth" id="submitBtn" disabled>Login</button>

@else
    <button type="submit" class="btn-auth">Login</button>
@endif

<script>
    function enableSubmit() {
        document.getElementById('submitBtn').removeAttribute('disabled');
    }
</script>

        <div class="auth-divider">
            <span>or</span>
        </div>

        <div class="social-login">
            <button type="button" class="btn-google disabled" href="javascript:void(0)"  onclick="showlogAlert()">
                <i class="fab fa-google"></i> Continue with Google
            </button>
            <button type="button" class="btn-apple disabled" href="javascript:void(0)"  onclick="showlogAlert()">
                <i class="fab fa-apple"></i> Continue with Apple
            </button>
        </div>

        <div class="auth-footer">
            <p>Don't have an account? 
                <a href="{{ route('register') }}">Sign Up</a>
            </p>
        </div>
    </form>

@endsection
 