@extends('layouts.partials.auth')

@section('title', 'Login')

@push('styles')
    <link href="{{ asset('assets/css/forms.css') }}" rel="stylesheet" type="text/css">
    <link href="{{ asset('assets/css/cards.css') }}" rel="stylesheet" type="text/css">
@endpush

@push('scripts')
    <script src="https://www.google.com/recaptcha/api.js" async defer></script>
    <script>
        function onSubmit(token) {
            document.getElementById("formLogin").submit();
        }
    </script>
@endpush

@section('content')
    <form action="{{ route('auth.authenticate') }}" method="POST" id="formLogin">
        @csrf
        <div class="d-grid p-5 gap-3">
            @if ($logo)
                <div class="text-center mb-3">
                    <img src="{{ $logo }}" alt="Logótipo" style="max-width: 100%" />
                </div>
            @else
                <p class="text-center"><b>Login</b></p>
            @endif

            <div>
                <input type="email" name="email" class="form-control" placeholder="Email" value="{{ old('email') }}"
                    required />
                @if ($errors->has('email'))
                    <div class="error handle-error">{{ $errors->first('email') }}</div>
                @endif
            </div>

            <div>
                <input type="password" name="password" class="form-control" placeholder="Palavra-passe" required />
                @if ($errors->has('password'))
                    <div class="error handle-error">{{ $errors->first('password') }}</div>
                @endif
            </div>

            @if ($errors->has('g-recaptcha-response'))
                <div class="error handle-error">{{ $errors->first('g-recaptcha-response') }}</div>
            @endif

            <button class="btn btn-primary" type="submit" id="btnLogin">
                Login
            </button>

            {{--
            <button class="btn btn-primary g-recaptcha" type="submit" id="btnLogin"
                data-sitekey="{{ config('services.recaptcha.site_key') }}" data-callback='onSubmit' data-action='submit'>
                Login
            </button>
            --}}
        </div>
    </form>
@endsection