<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>{{$title ?? ''}}</title>

    <link href="{{ asset('assets') }}/css/bootstrap.min.css" rel="stylesheet">
    <link href="{{ asset('assets') }}/vendor/nucleo/css/nucleo.css" rel="stylesheet">

    <style>
        body{
            background-color: #f0f0f0;
        }

        .form-group {
            margin-bottom: 1.5rem;
        }
        .form-control:focus{
            background-color: #f5f5f5 !important;
        }
        .input-group-prepend {
            margin-right: -1px;
        }
        .input-group-prepend, .input-group-append {
            display: flex;
        }
        .input-group-alternative .form-control, .input-group-alternative .input-group-text {
            border: 0;
            box-shadow: none;
        }
        .input-group > .form-control, .input-group > .custom-select, .input-group > .custom-file {
            position: relative;
            width: 1%;
            margin-bottom: 0;
            flex: 1 1 auto;
        }
        .form-control {
            font-size: .875rem;
        }
        .form-control {
            font-size: 1rem;
            line-height: 1.5;
            display: block;
            width: 100%;
            height: calc(2.75rem + 2px);
            padding: .625rem .75rem;
            transition: all .2s cubic-bezier(.68, -.55, .265, 1.55);
            color: #000;
            border: 1px solid #cad1d7;
            border-radius: .375rem;
            background-color: #f5f5f5;
            background-clip: padding-box;
            box-shadow: none;
        }
        input, button, select, optgroup, textarea {
            font-family: inherit;
            font-size: inherit;
            line-height: inherit;
            margin: 0;
        }
        .input-group .form-control:not(:first-child) {
            padding-left: 0;
            border-left: 0;
        }
        .input-group-text {
            font-size: 1rem;
            font-weight: 400;
            line-height: 1.5;
            display: flex;
            margin-bottom: 0;
            padding: .625rem .75rem;
            text-align: center;
            white-space: nowrap;
            color: #adb5bd;
            border: 1px solid #cad1d7;
            border-radius: .375rem;
            background-color: #f5f5f5;
            align-items: center;
        }
        input:-webkit-autofill,
        input:-webkit-autofill:hover,
        input:-webkit-autofill:focus,
        textarea:-webkit-autofill,
        textarea:-webkit-autofill:hover,
        textarea:-webkit-autofill:focus,
        select:-webkit-autofill,
        select:-webkit-autofill:hover,
        select:-webkit-autofill:focus {
        border: none;
        -webkit-text-fill-color: none;
        -webkit-box-shadow: none;
        transition: background-color 5000s ease-in-out 0s;
        }
        .shadow{
            box-shadow: 0 2px 4px 0 rgba(181,181,181,.7);
        }
        .btn-primary{
            background-color: #5e72e4;
        }
        .login-title h2{
            color: #404040;
        }
        .navbar{
            background-color: #fafafa;
        }
        .navbar-brand img{
            height: 46px;
        }
        .login-title img{
            height: 50px;
        }
        .login-title h3{
            font-weight: 700;
            font-size: 1.5em;
        }
        .join{
            width: 75%;
            font-size: 14px;
            line-height: normal;
            margin: auto;
            display: flex;
            align-items: center;
            padding: 2rem 0;
        }
        .join .text{
            color: #7c7c7c;
            line-height: normal;
            width: 50%;
        }
        .join .line{
                display: inline-block;
                border: .5px solid rgba(0, 0, 0, 0.16);
                width: 30%;
        }
        .vh-100{
            height: 100vh;
        }
    </style>
</head>
<body>

        <div class="container vh-100">
            <div class="row justify-content-center align-items-center h-100">
                <div class="col-lg-6">
                    <div class="login-box p-5 shadow bg-white rounded text-center">
                        <div class="login-title text-center">
                        <!-- <a class="navbar-brand" href="#"><img src="{{ asset('assets') }}/img/logo/logo-pmi.svg" class="navbar-brand-img mb-4" alt="..."></a> -->
                        <h2>Logo</h2>
                        <h3 class="font-weight-normal mb-5">Login Admin</h3>

                        </div>
                        <div class="d-flex justify-content-center align-items-center">

                            <form class="w-75" role="form" method="POST"  action="{{ route('auth.action_login') }}">
                                @csrf

                                @if(session('message'))
                                    {!! session('message') !!}
                                @endif
                                <div class="form-group{{ $errors->has('email') ? ' has-danger' : '' }} mb-3">
                                    <div class="input-group input-group-alternative">
                                        <div class="input-group-prepend">
                                            <span class="input-group-text"><i class="ni ni-email-83"></i></span>
                                        </div>
                                        <input name="email" class="pl-1 form-control{{ $errors->has('email') ? ' is-invalid' : '' }}" placeholder="{{ __('Email') }}" type="text" name="email" value="{{ old('email') }}" value="admin@argon.com" required autofocus>
                                    </div>
                                </div>
                                <div class="form-group{{ $errors->has('password') ? ' has-danger' : '' }} mb-2">
                                    <div class="input-group input-group-alternative">
                                        <div class="input-group-prepend">
                                            <span class="input-group-text"><i class="ni ni-lock-circle-open"></i></span>
                                        </div>
                                        <input class="pl-1 form-control{{ $errors->has('password') ? ' is-invalid' : '' }}" name="password" placeholder="{{ __('Password') }}" type="password"  required>
                                    </div>
                                </div>
                                <div class="text-right mb-2">
                                    <a href="{{ route('password.request') }}" >
                                        <small>Lupa Password?</small>
                                    </a>
                                </div>
                                {{-- <div class="custom-control custom-control-alternative custom-checkbox">
                                    <input class="custom-control-input" name="remember" id="customCheckLogin" type="checkbox" {{ old('remember') ? 'checked' : '' }}>
                                    <label class="custom-control-label" for="customCheckLogin">
                                        <span class="text-muted">{{ __('Remember me') }}</span>
                                    </label>
                                </div> --}}
                                <div class="text-center">
                                    <button type="submit" class="btn btn-primary py-2 w-100">{{ __('Masuk') }}</button>
                                </div>
                            </form>

                        </div>
                       <!-- <div class="join text-center">
                                <span class="line"></span>
                                <span class="text">Belum memiliki akun?</span>
                                <span class="line"></span>
                        </div>
                        <a href="https://wa.link/r2j794" class="btn btn-success w-75 py-2">{{ __('Hubungi Kami Sekarang') }}</a> -->
                    </div>
                </div>
            </div>
        </div>

        <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
        <link href="{{ asset('assets') }}/js/bootstrap.min.js">

</body>
</html>


