@extends('superadmin::layouts.master')

{{-- This section just to override the default content in the msater
    because login doesn't have any of these sections --}}
@section('navbar') @endsection
@section('sidebar') @endsection
@section('header') @endsection
@section('footer') @endsection

{{-- this to override the default body attributes then add the login page specfic attribnutes --}}
@section('custom_body_attr') data-col="1-column" class="vertical-layout vertical-menu 1-column blank-page blank-page
pace-done" @endsection
@section('title','Login')

@section('content')
<section class="flexbox-container logo-section">
    <div class="col-md-4 offset-md-4 col-xs-10 offset-xs-1  box-shadow-2 p-0">
        <div class="card border-grey border-lighten-3 m-0">
            <div class="card-header no-border">
                <li class="dropdown dropdown-language nav-item" style="list-style-type: none;">
                    <a id="dropdown-flag" href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
                        class="dropdown-toggle nav-link"><i
                            class="flag-icon @if(app()->getLocale() === 'en') flag-icon-us @else flag-icon-sa @endif"></i><span
                            class="selected-language"></span></a>
                    <div aria-labelledby="dropdown-flag" class="dropdown-menu">
                        <a href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale() === 'en' ? 'ar' : 'en') }}"
                            class="dropdown-item"><i
                                class="flag-icon @if(app()->getLocale() === 'en') flag-icon-sa @else flag-icon-us @endif"></i>
                            {{ LaravelLocalization::getCurrentLocale() === 'en' ? 'العربية' : 'English' }}</a>

                    </div>
                </li>
                <div class="card-title text-xs-center">
                    <div class="p-1">
                        <img src="{{asset('/assets/images/logo/colored-logo.png')}}" alt="Vom logo" class="logo">
                        <h1 class="login-title">{{ __('Administration') }}</h1>
                    </div>
                </div>
                <h6 class="card-subtitle line-on-side text-muted text-xs-center font-small-3 pt-2">
                    <span>@lang('Login')</span></h6>
            </div>

            <div class="card-body collapse in">
                <div class="card-block">
                    @include('superadmin::errors.lists')
                    <form class="form-horizontal form-simple" method="POST" action="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), 'superadmin/login') }}">
                        @csrf
                        <fieldset class="form-group position-relative has-icon-left mb-0">
                            <input type="text"
                                class="form-control form-control-lg input-lg @error('email') is-invalid @enderror "
                                name="email" value="{{ old('email') }}" id="user-name" required title="@lang('Please fill this input')"
                                placeholder="{{__('Enter Email Address')}}"
                                oninvalid="InvalidMsg(this);"
                   oninput="InvalidMsg(this);">
                            <div class="form-control-position">
                                <i class="ft-user"></i>
                            </div>
                            @error('email')
                            <span class="invalid-feedback" role="alert">
                                <p>{{ $message }}</p>
                            </span>
                            @enderror
                        </fieldset>
                        <fieldset class="form-group position-relative has-icon-left">
                            <input type="password"
                                class="form-control form-control-lg input-lg  @error('password') is-invalid @enderror"
                                name="password" id="user-password" required placeholder="@lang('Enter Password')" title="@lang('Please fill this input')"
                                oninvalid="InvalidMsg(this);"
                   oninput="InvalidMsg(this);">
                            <div class="form-control-position">
                                <i class="fa fa-key"></i>
                            </div>
                        </fieldset>
                        <button type="submit" class="btn btn-primary btn-lg btn-block"><i class="ft-unlock"></i>
                            @lang('Login')</button>
                    </form>
                </div>
            </div>
            <div class="card-footer">
                <div>
                    @if (Route::has('password.request'))
                    <p class="float-sm-left text-xs-center m-0">
                        <a class="card-link" href="{{ route('password.request') }}">
                            {{ __('Forgot Your Password') }}
                        </a>
                    </p>
                    @endif
                </div>
            </div>
        </div>
    </div>
</section>


@endsection


@section('extra_scripts')
<!-- BEGIN PAGE VENDOR JS-->
<script src="/assets/vendors/js/forms/icheck/icheck.min.js" type="text/javascript" defer></script>
<script src="/assets/vendors/js/forms/validation/jqBootstrapValidation.js" type="text/javascript" defer></script>
<!-- END PAGE VENDOR JS-->

<!-- BEGIN PAGE LEVEL JS-->
<script src="/assets/js/scripts/forms/form-login-register.js" type="text/javascript" defer></script>
<!-- END PAGE LEVEL JS-->

<script>
//client side validation
    function InvalidMsg(textbox) {
       if (textbox.value === '') {
            textbox.setCustomValidity("@lang('Please fill this input')");
        } else if (textbox.validity.typeMismatch) {
            textbox.setCustomValidity ("@lang('Please fill this input')");
        } else {
            textbox.setCustomValidity('');
        }
            return true;
    }
</script>
@endsection