@extends('layouts.frontend')

@section('title', 'Iniciar sesión')

@section('content')
    <article class="page" id="login">
        <div class="breadcrumb">
            <div class="container d-flex align-items-center">
                <a href="{{ url('/') }}">Inicio</a>
                <span>@yield('title')</span>
            </div>
        </div>
        <section class="content">
            <div class="container">
                @if($errors->any())
                    <div class="alert alert-danger form-group">
                        @foreach($errors->all() as $error)
                            {{ $error }}<br>
                        @endforeach
                    </div>
                @endif
                @if($status)
                    <div class="alert alert-success form-group">
                        {{ $status }}
                    </div>
                @endif
                <div class="row">
                    <div class="col-lg-6">
                        <div class="bg-light">
                            <div class="inner-container">
                                <h2>Ingresar</h2>
                                <p>¡Genial tenerte de vuelta!</p>
                                {!! Form::open([
                                    'route' => 'login'
                                ]) !!}
                                <div class="form-group">
                                    <label for="username" class="form-label">Email o usuario</label>
                                    {!! Form::text('username', null, ['placeholder' => '', 'required', 'class' => 'form-control']) !!}
                                </div>
                                <div class="form-group">
                                    <label for="password" class="form-label">Contraseña</label>
                                    {!! Form::password('password', ['placeholder' => '', 'required', 'class' => 'form-control']) !!}
                                </div>
                                <div class="form-group">
                                    <div class="g-recaptcha" data-sitekey="{{ env('RECAPTCHA_SITEKEY') }}"></div>
                                </div>
                                <div class="form-group">
                                    <button type="submit" class="btn">
                                        <span>Ingresar</span>
                                        <i class="far fa-arrow-right"></i>
                                    </button>
                                </div>
                                <div class="form-group">
                                    <input type="checkbox" class="form-check-input" id="remember">
                                    <label class="form-check-label" for="remember">Recordarme</label>
                                </div>
                                <div class="form-group">
                                    <p><a href="{{ route('password.request') }}">¿Olvidaste tu contraseña?</a></p>
                                </div>
                                {!! Form::close() !!}
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6">
                        <div class="inner-container">
                            <h2>Registrarse</h2>
                            <p>Si todavía no tenés una cuenta, registrate!</p>
                            {!! Form::open([
                                'route' => 'register'
                            ]) !!}
                            <div class="form-group">
                                <label class="form-label">Nombre</label>
                                {!! Form::text('user_data[first_name]', null, ['placeholder' => '', 'required', 'class' => 'form-control']) !!}
                            </div>
                            <div class="form-group">
                                <label class="form-label">Apellido</label>
                                {!! Form::text('user_data[last_name]', null, ['placeholder' => '', 'required', 'class' => 'form-control']) !!}
                            </div>
                            <div class="form-group">
                                <label class="form-label">Email</label>
                                {!! Form::email('email', null, ['placeholder' => '', 'required', 'class' => 'form-control']) !!}
                            </div>
                            <div class="form-group">
                                <label class="form-label">Contraseña </label>
                                {!! Form::password('password', ['placeholder' => '', 'required', 'class' => 'form-control']) !!}
                            </div>
                            <div class="form-group">
                                <label class="form-label">Confirmar contraseña </label>
                                {!! Form::password('password_confirmation', ['placeholder' => '', 'required', 'class' => 'form-control']) !!}
                            </div>
                            <div class="form-group">
                                <div class="g-recaptcha" data-sitekey="{{ env('RECAPTCHA_SITEKEY') }}"></div>
                            </div>
                            @if($options->register_text)
                                <div class="form-group">
                                    <p>{!! $options->register_text !!}</p>
                                </div>
                            @endif
                            <div class="form-group">
                                <button type="submit" class="btn">
                                    <span>Registrarse</span>
                                    <i class="far fa-arrow-right"></i>
                                </button>
                            </div>
                            {!! Form::close() !!}
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </article>
@endsection

@push('scripts')
    <script src="https://www.google.com/recaptcha/api.js" async defer></script>
@endpush