@extends("layout.login")

@section("styles")

@endsection

@section("content")
    <div class="login login-1 login-signin-on d-flex flex-column flex-lg-row flex-column-fluid bg-white" id="kt_login">
        <!--begin::Aside-->
        <div class="login-aside d-flex flex-row-auto bgi-size-cover bgi-no-repeat p-10 p-lg-10" style="background-image: url(assets/media/bg/bg-4.jpg);">
            <!--begin: Aside Container-->
            <div class="d-flex flex-row-fluid flex-column justify-content-between">
                <!--begin: Aside header-->
                <a href="#" class="flex-column-auto mt-5 pb-lg-0 pb-10">
                    <img src="assets/media/logos/logo-letter-1.png" class="max-h-60px max-h-sm-110px" alt="" />
                </a>
                <!--end: Aside header-->
                <!--begin: Aside content-->
                <div class="flex-column-fluid d-flex flex-column justify-content-center">
                    <h3 class="font-size-h1 mb-5 text-white">Bienvenido al sistema ARB</h3>
                    <p class="font-weight-lighter text-white opacity-80">Control completo de procesos internos.</p>
                </div>
                <!--end: Aside content-->
                <!--begin: Aside footer for desktop-->
                <div class="d-none flex-column-auto d-lg-flex justify-content-between mt-10">
                    <div class="opacity-75 font-weight-bold text-white">© 2021 <a href="http://jrtec.cl/" class="text-white h4 font-weight-bold">JRTEC</a></div>
                    <div class="d-flex">
                        <!--
                        <a href="#" class="text-white">Privacy</a>
                        <a href="#" class="text-white ml-10">Legal</a>
                        <a href="#" class="text-white ml-10">Contact</a>
                        -->
                    </div>
                </div>
                <!--end: Aside footer for desktop-->
            </div>
            <!--end: Aside Container-->
        </div>
        <!--begin::Aside-->
        <!--begin::Content-->
        <div class="d-flex flex-column flex-row-fluid position-relative p-7 overflow-hidden">
            <!--begin::Content header-->
            <!--end::Content header-->
            <!--begin::Content body-->
            <div class="d-flex flex-column-fluid flex-center mt-15 mt-lg-0">
                <!--begin::Signin-->
                <div class="login-form login-signin">
                    <div class="text-center mb-15 mb-lg-20">
                        <h3 class="font-size-h1">Iniciar sesion</h3>
                        <p class="text-muted font-weight-bold">Digite sus datos</p>
                    </div>
                    @if (\Session::has('error'))
                        <div class="alert alert-danger mb-10" style="margin-top: -20px;">
                            <i class="fas fa-exclamation-triangle mr-2 text-white"></i>{!! \Session::get('error') !!}
                        </div>
                    @endif
                    <!--begin::Form-->
                    <form class="form" id="frm_login" method="post" action="{{route("login.validar")}}">
                        @csrf
                        <div class="form-group">
                            <input class="form-control border border-dark bg-dark-o-25 h-auto py-5 px-6" type="text" placeholder="Correo" name="correo" autocomplete="off" />
                        </div>
                        <div class="form-group">
                            <input class="form-control border border-dark bg-dark-o-25 h-auto py-5 px-6" type="password" placeholder="Contraseña" name="password" autocomplete="off" />
                        </div>
                        <!--begin::Action-->
                        <div class="form-group d-flex flex-wrap justify-content-center align-items-center">
                            <!--
                            <div>
                            <div class="checkbox-inline mb-2">
                                    <label class="checkbox checkbox-outline m-0 text-dark-50">
                                        <input type="checkbox" name="remember" />
                                        <span></span>Recordar</label>
                                </div>
                                <a href="javascript:;" class="text-dark-50 text-hover-danger mr-2" id="kt_login_forgot">Olvidó su contrseña?</a>
                            </div>
                            -->
                            <button id="kt_login_signin_submit" class="btn btn-danger font-weight-bold px-9 py-4 my-3">Ingresar</button>
                        </div>
                        <!--end::Action-->
                    </form>
                    <!--end::Form-->
                </div>
                <!--end::Signin-->
                <!--begin::Forgot-->
                <div class="login-form login-forgot">
                    <div class="text-center mb-10 mb-lg-20">
                        <h3 class="font-size-h1">Forgotten Password ?</h3>
                        <p class="text-muted font-weight-bold">Enter your email to reset your password</p>
                    </div>
                    <!--begin::Form-->
                    <form class="form" novalidate="novalidate" id="kt_login_forgot_form">
                        <div class="form-group">
                            <input class="form-control form-control-solid h-auto py-5 px-6" type="email" placeholder="Correo" name="correo" autocomplete="off" />
                        </div>
                        <div class="form-group d-flex flex-wrap flex-center">
                            <button type="button" id="kt_login_forgot_submit" class="btn btn-primary font-weight-bold px-9 py-4 my-3 mx-4">Submit</button>
                            <button type="button" id="kt_login_forgot_cancel" class="btn btn-light-primary font-weight-bold px-9 py-4 my-3 mx-4">Cancel</button>
                        </div>
                    </form>
                    <!--end::Form-->
                </div>
                <!--end::Forgot-->
            </div>
            <!--end::Content body-->
            <!--begin::Content footer for mobile-->
            <div class="d-flex d-lg-none flex-column-auto flex-column flex-sm-row justify-content-between align-items-center mt-5 p-5">
                <div class="text-dark-50 font-weight-bold order-2 order-sm-1 my-2">© 2021 <a href="http://jrtec.cl/" class="text-danger font-weight-bold">JRTEC</a></div>
                <div class="d-flex order-1 order-sm-2 my-2">
                    <!--
                    <a href="#" class="text-dark-75 text-hover-primary">Privacy</a>
                    <a href="#" class="text-dark-75 text-hover-primary ml-4">Legal</a>
                    <a href="#" class="text-dark-75 text-hover-primary ml-4">Contact</a>
                    -->
                </div>
            </div>
            <!--end::Content footer for mobile-->
        </div>
        <!--end::Content-->
    </div>
@endsection


@section("scripts")

@endsection