@extends('web.secciones.layout')
@section('titulo', config('app.name') . ' - Registro')


@section('head')
    <style>
        .authentication-form {
            background-size: 100% auto;
        }
    </style>
@endsection

@section('bodytags', '')

@section('contenido')

    <section class="authentication-form">
        <div class="innerpage-decor">
            <div class="innerpage-circle1"><img src="../assets/images/Testimonial2.png" alt=""></div>
            <div class="innerpage-circle2"><img src="../assets/images/Testimonial1.png" alt=""></div>
        </div>
        <div>
            <h2 class="title text-center">Únete <span>Gratis</span></h2>
            <p class="text-center">Y comienza a disfrutar de todas las funcionalidades que ofrecemos.</p>
            <div class="card">

                @if ($errors->any())
                    <div class="alert alert-danger">
                        <ul class="p-2 m-0">
                            @foreach ($errors->all() as $error)
                                <li>{{ $error }}</li>
                            @endforeach
                        </ul>
                    </div>
                @endif

                <form class="theme-form" method="POST" action="{{ url('registro') }}">
                    @csrf
                    <div class="form-group">
                        <div class="md-fgrup-margin">
                            <input class="form-control @error('name') is-invalid @enderror" name="name"
                                value="{{ old('name') }}" type="text" placeholder="Nombre">
                        </div>
                    </div>
                    <div class="form-group">
                        <input class="form-control @error('phone') is-invalid @enderror" name="phone"
                            value="{{ old('phone') }}" type="number" placeholder="Teléfono" required>
                    </div>
                    <div class="form-group">
                        <input class="form-control @error('email') is-invalid @enderror" name="email"
                            value="{{ old('email') }}" type="email" placeholder="Correo electrónico" required>
                    </div>

                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group mt-0">
                                <input class="form-control @error('password') is-invalid @enderror" name="password"
                                    type="password" placeholder="Contraseña" required>
                                <div class="show-hide"><span class="show"></span></div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group mt-0">
                                <input class="form-control @error('password_confirmation') is-invalid @enderror"
                                    name="password_confirmation" type="password" placeholder="Confirmar contraseña"
                                    required>

                            </div>
                        </div>
                    </div>




                    <div class="form-button text-center">

                        <button class="btn btn-custom theme-color" type="submit">Regístrate</button><br><br>
                        <small><a class="text-right col-6 theme-link" href="{{ url('/iniciar-sesion') }}">¿Ya tienes
                                cuenta?</a></small>
                    </div>
                    <div class="or-saparator"><span>o</span></div>
                    <h6 class="text-center mt-0 mb-3">Regístrate con:</h6>
                    <div class="form-button text-center social-btns">
                        <button class="btn btn-custom fb" type="submit">Facebook</button>
                        <button class="btn btn-custom ggl" type="submit">Google</button>
                    </div>
                </form>

            </div>
            <p class="text-center mt-4">
                <a href="{{ url('/') }}" class="theme-link"> Volver Atras</a>
            </p>
        </div>
    </section>

@endsection

@section('scripts')
@endsection