@extends('layout.base-auth')

@section('title')
    {{ __('Login') }}
@endsection

@section('content')
    <div class="d-flex flex-column flex-lg-row flex-column-fluid">
        <!--begin::Body-->
        <div class="d-flex flex-column flex-lg-row-fluid w-lg-50 p-10 order-2 order-lg-1">
            <!--begin::Form-->
            <div class="d-flex flex-center flex-column flex-lg-row-fluid">
                <!--begin::Wrapper-->
                <div class="w-lg-500px p-10">
                    <!--begin::Form-->
                    <form class="form w-100" novalidate="novalidate"  action="{{ url('login/proses') }}" method="POST">
                        @csrf
                        <!--begin::Heading-->
                        <div class="text-center mb-11">
                            <img src="{{ asset('') }}assets/media/logos/logo_rpl.jpg" alt="" height="170px">
                            <!--begin::Title-->
                            {{-- <h1 class="text-dark fw-bolder mb-3">{{ __('Login') }}</h1> --}}
                            <!--end::Title-->
                        </div>
                        <div class="text-center mb-11">
                            <!--begin::Title-->
                            <h1 class="text-dark fw-bolder mb-3">{{ __('Sign In') }} </h1>
                            
                            <!--end::Title-->
                            <!--begin::Subtitle-->
                            {{-- <div class="text-gray-500 fw-semibold fs-6">Your Social Campaigns</div> --}}
                            
                            <!--end::Subtitle=-->
                        </div>
                        <!--begin::Heading-->
                        <!--begin::Login options-->
                        
                        <!--end::Login options-->
                        <!--begin::Separator-->
                       
                        <!--end::Separator-->
                        <!--begin::Input group=-->
                        <div class="fv-row mb-8">
                            <!--begin::Email-->
                            <input autofocus type="text" placeholder="Username" name="username" autocomplete="off" value="{{ old('username') }}" class="form-control bg-transparent
                            @error('username')
                                is-invalid
                            @enderror
                            " />

                            @error('username')
                                <div id="validationServer03Feedback" class="invalid-feedback">
                                    {{ $message }}
                                </div>
                            @enderror
                            <!--end::Email-->
                        </div>
                        <!--end::Input group=-->
                        <div class="fv-row mb-3">
                            <!--begin::Password-->
                            <input type="password" placeholder="Password" name="password" autocomplete="off" class="form-control bg-transparent
                            @error('password')
                                is-invalid
                            @enderror
                            " />
                            @error('password')
                                <div id="validationServer03Feedback" class="invalid-feedback">
                                    {{ $message }}
                                </div>
                            @enderror
                            <!--end::Password-->
                        </div>
                        <!--end::Input group=-->
                        <!--begin::Wrapper-->
                        <div class="d-flex flex-stack flex-wrap gap-3 fs-base fw-semibold mb-8">
                            <div></div>
                            <!--begin::Link-->
                            <a href="../../demo14/dist/authentication/layouts/corporate/reset-password.html" class="link-primary">{{ __('Forgot Password ?') }}</a>
                            <!--end::Link-->
                        </div>
                        <!--end::Wrapper-->
                        <!--begin::Submit button-->
                        

                        <div class="d-grid mb-10">
                            <button type="submit" id="kt_sign_in_submit" class="btn btn-primary">
                                <!--begin::Indicator label-->
                                <span class="indicator-label">{{ __('Sign In') }}</span>
                                <!--end::Indicator label-->
                                <!--begin::Indicator progress-->
                                <span class="indicator-progress">Please wait...
                                <span class="spinner-border spinner-border-sm align-middle ms-2"></span></span>
                                <!--end::Indicator progress-->
                            </button>
                        </div>
                        <!--end::Submit button-->
                        <!--begin::Sign up-->
                       
                        <!--end::Sign up-->
                    </form>
                    <!--end::Form-->
                </div>
                <!--end::Wrapper-->
            </div>
            <!--end::Form-->
            <!--begin::Footer-->
            <div class="w-lg-500px d-flex flex-stack px-10 mx-auto">
                <!--begin::Languages-->
                <div class="me-10">
                    <!--begin::Toggle-->
                    <button class="btn btn-flex btn-link btn-color-gray-700 btn-active-color-primary rotate fs-base" data-kt-menu-trigger="click" data-kt-menu-placement="bottom-start" data-kt-menu-offset="0px, 0px">
                        <img data-kt-element="current-lang-flag" class="w-20px h-20px rounded me-3"  src="assets/media/flags/{{ config('app.locale') }}.svg"  alt="" />
                        <span data-kt-element="current-lang-name" class="me-1">Language
                            {{-- <span class="fs-8 rounded bg-light px-3 py-2 position-absolute translate-middle-y top-50 end-0">
                                {{ __(config('app.locale')) }}
                                <img class="w-15px h-15px rounded-1 ms-2" src="assets/media/flags/{{ config('app.locale') }}.svg" alt="" />
                            </span> --}}
                        </span>
                        <span class="d-flex flex-center rotate-180">
                            <i class="ki-duotone ki-down fs-5 text-muted m-0"></i>
                        </span>
                    </button>
                    <!--end::Toggle-->
                    <!--begin::Menu-->
                    <div class="menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-800 menu-state-bg-light-primary fw-semibold w-200px py-4 fs-7" data-kt-menu="true" id="kt_auth_lang_menu">
                        <!--begin::Menu item-->
                        <div class="menu-item px-3">
                            <a href="{{ url('/lang/en') }}" class="menu-link d-flex px-5">
                                <span class="symbol symbol-20px me-4">
                                <img class="rounded-1" src="{{ asset('') }}assets/media/flags/en.svg" alt="" />
                                </span>English
                            </a>
                        </div>
                        <!--end::Menu item-->
                        <!--begin::Menu item-->
                        <div class="menu-item px-3">
                            <a href="{{ url('/lang/id') }}" class="menu-link d-flex px-5">
                                <span class="symbol symbol-20px me-4">
                                    <img class="rounded-1" src="{{ asset('') }}assets/media/flags/id.svg" alt="" />
                                </span>Indonesia
                            </a>
                        </div>
                        <!--end::Menu item-->
                       
                    </div>
                    <!--end::Menu-->
                </div>
                <!--end::Languages-->
                <!--begin::Links-->
                
                <!--end::Links-->
            </div>
            <!--end::Footer-->
        </div>
        <!--end::Body-->
        <!--begin::Aside-->
        <div class="d-flex flex-lg-row-fluid w-lg-50 bgi-size-cover bgi-position-center order-1 order-lg-2" style="background-image: url(assets/media/misc/auth-bg.png)">
            <!--begin::Content-->
            <div class="d-flex flex-column flex-center py-0 py-lg-10 px-25 px-md-30 w-150">
                <!--begin::Logo-->
            
                {{-- <img alt="Logo" src="{{ asset('') }}assets/media/logos/rpllogo.png" class="h-80px h-lg-80px" /> --}}
               
                <!--end::Logo-->
                <!--begin::Image-->
                {{-- <img class="d-none d-lg-block mx-auto w-275px w-md-50 w-xl-500px mb-10 mb-lg-20" src="{{ asset('') }}assets/media/misc/auth-screens.png" alt="" /> --}}
                <!--end::Image-->
                <!--begin::Title-->
                <!--end::Text-->
            </div>
            <!--end::Content-->
        </div>
        <!--end::Aside-->
    </div>
@endsection