@extends('main_login')
 
@section('content')

<style>
.rbt-contact-form.contact-form-style-1 {
    padding: 50px;
    position: relative;
    z-index: 1;
    max-width: 490px;
    z-index: 2;
    background: #454d55;
    box-shadow: none;
    border-radius: var(--radius);
}
@media only screen and (max-width: 360px) {
    .icon-reverse-wrapper{
        font-size: 10px;

    }

    .rbt-contact-form.contact-form-style-1 {
        padding: 20px;
        padding-top: 0px;
        position: relative;
        z-index: 1;
        max-width: 490px;
        z-index: 2;
        background: #454d55;
        box-shadow: none;
        border-radius: var(--radius);
    }
}
</style>

        <div class="row">


            <div class="col-lg-6" style="margin-top: 150px; position: fixed; width: 50vw; height: 100vh; left: 0px;">
                <div class="rbt-splite-style">
                    <div class="split-inner">
                        <h4 class="title">BotV3 IA: el futuro de la Inteligencia Artificial Omnicanal</h4>
                        <p class="description">¡Genere hasta $10,000 más en ingresos por ventas! ¿Listo para una revolución? Conozca aBotV3 IA, su chatbot para whatsapp impulsado por IA que no solo habla, sino que comprende, interactúa y vende como nunca antes.</p>
                        <h5 class="subtitle mb--20">Lista de funciones del evento:</h5>
                        <div class="plan-offer-list-wrapper">
                            <ul class="plan-offer-list rbt-list-primary-opacity">
                                <li><i class="feather-check"></i> IA empática</li>
                                <li><i class="feather-check"></i> Alcance mundial</li>
                                <li><i class="feather-check"></i> Venta inteligente</li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-lg-6" style="padding-top: 0px;  right: 0px; background-color: #454d55; position: fixed; height: 100vh;">
                <div class="rbt-contact-form contact-form-style-1 max-width-auto" style="height: 100%; overflow-x: hidden; overflow-y: scroll;">
                    <div class="center">
                        <img class="MuiBox-root css-1iy0rzk" src="/images/logo/logo.png" alt="Orimon">
                    </div>
                    <div  class="rbt-btn btn-md hover-icon-reverse w-100" style="background-color: #387b49 !important; color: #fff !important;">
                        <a href="{{ url('authorized/google') }}">
                            <span class="icon-reverse-wrapper">
                                <span class="btn-text" style="color:#fff;"><img class="MuiBox-root css-1j1k4gw" src="/images/googleIcon.png" alt="login-with-google"> Registrar con Google</span>
                                <span class="btn-icon" style="color:#fff;"><i class="feather-arrow-right"></i></span>
                                <span class="btn-icon" style="color:#fff;"><i class="feather-arrow-right"></i></span>
                            </span>
                        </a>
                    </div>
                    <br><br>
                    <div class="row ">
                    <div class="col s12 m12 l12 ">
                        @if($errors->any())
                        <div class="alerta-errores">
                            <ul>
                            @foreach ($errors->all() as $error)
                                <li>{{ $error }}</li>
                            @endforeach
                            </ul>
                        </div>
                        @endif
                    </div>
                    </div>
                    @if(\Session::has('success'))
                    <div class="alert alert-success">
                            <ul>
                                <li>{!! \Session::get('success') !!}</li>
                            </ul>
                    </div>
                    @endif
                    <form action="/chatbot-register" name="forms_student" id="forms_student" method="POST" class="row row--15">
                    @csrf 
                        <label style="padding-bottom: 10px; color:#fff;">Nombre</label>
                        <div class="form-group">
                            <input name="name" type="text">
                            <span class="focus-border"></span>
                        </div>

                        <label style="padding-bottom: 10px; color:#fff;">Apellido</label>
                        <div class="form-group">
                            <input name="surname_first" type="text">
                            <span class="focus-border"></span>
                        </div>

                        <label style="padding-bottom: 10px; color:#fff;">Email</label>
                        <div class="form-group">
                            <input name="email" type="email">
                            <span class="focus-border"></span>
                        </div>

                        <label style="padding-bottom: 10px; color:#fff;">Password</label>
                        <div class="form-group">
                            <input name="password" type="password">
                            <span class="focus-border"></span>
                        </div>

                        <label style="padding-bottom: 10px; color:#fff;">Password Confirmation</label>
                        <div class="form-group">
                            <input name="confirm_password" type="password">
                            <span class="focus-border"></span>
                        </div>

                        <div class="row mb--30">
                            <div class="col-lg-4">
                            </div>
                            <div class="col-lg-4">
                            </div>
                            <div class="col-lg-4">
                                <div class="rbt-lost-password text-end">
                                    <a class="rbt-btn-link" href="/login"><span style="">Regresar al inicio.</span></a>
                                </div>
                            </div>
                        </div>

                        <div class="form-group">
                            <h5 > LEE NUESTROS TERMINOS Y CONDICIONES <a href="/terminos-y-condiciones" style="color: var(--color-primary);" target="_blank">AQUI</a> </h5>
                        </div>
                        
                        <h5> Confirma que leiste y aceptas nuestros términos y condiciones  </h5>
                        <div class="check-box">
                            <input type="checkbox" id="create_account" name="terminos">
                            <label for="create_account">Si</label>
                        </div>

                        <br>
                    
                        <div class="form-submit-group" style="margin-top: 20px;">
                            <button type="submit" class="rbt-btn btn-md btn-gradient hover-icon-reverse w-100" >
                                <span class="icon-reverse-wrapper">
                                    <span class="btn-text">Siguiente</span>
                                <span class="btn-icon"><i class="feather-arrow-right"></i></span>
                                <span class="btn-icon"><i class="feather-arrow-right"></i></span>
                                </span>
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
@endsection
    @section('vs')

     @if(isset($validator))
         {!! $validator->selector("#forms_login") !!}
    @endif
@endsection