@section('title', config('app.name', 'Streamline') .' - '. __('Login'))
@section('description', __('Login to your account'))

<x-guest-layout>
    <x-t-section>
        <x-t-container
            size="xs"
            border="false"
            hollow
            class="overflow-visible"
        >
            <form method="POST" action="{{ route('login') }}" class="max-w-lg mx-auto">
                @csrf
                <x-t-card
                    variant="light"
                    border="false"
                    size="xl"
                    shadow
                >
                    <x-slot:header>
                        <x-t-heading
                            variant="light"
                            level="3"
                            size="sm"
                            class="mb-0 text-center"
                        >
                            {{ __('Login to your account') }}
                        </x-t-heading>
                    </x-slot:header>
                    <x-slot:body>
                        @if (session('message'))
                            <x-t-alert
                                variant="warning"
                                dismissible
                                border="false"
                                shadow
                                class="mb-5"
                            >
                                <ul class="list-none">
                                    <li>{{ session('message') }}</li>
                                </ul>
                            </x-t-alert>
                        @endif
                        @if ($errors->any()) 
                            <x-t-alert
                                variant="danger"
                                dismissible
                                border="false"
                                shadow
                                class="mb-5"
                            >
                                <ul class="list-none">
                                    @foreach ($errors->all() as $error)
                                        <li>{{ $error }}</li>
                                    @endforeach
                                </ul>
                            </x-t-alert>
                        @endif
                        <x-t-input
                            variant="{{ $errors->get('email') ? 'danger' : '' }}"
                            type="email"
                            name="email"
                            id="email"
                            label="{{ __('Email') }}"
                            autofocus
                            autocomplete="username"
                            :value="old('email')"
                            required
                        />
                        <x-t-input
                            variant="{{ $errors->get('password') ? 'danger' : '' }}"
                            type="password"
                            name="password"
                            id="password"
                            label="{{ __('Password') }}"
                            autocomplete="current-password"
                            required
                        />
                        <x-t-toggle
                            variant="secondary"
                            name="remember"
                            id="remember_me"
                            label="{{ __('Remember me') }}"
                        />
                        <x-t-grid cols="2" gap="sm" class="mt-10">
                            <x-t-button
                                type="submit"
                                variant="success"
                            >
                                {{ __('Log In') }}
                            </x-t-button>
                            @if (Route::has('password.request'))
                                <div class="flex justify-center items-center md:order-first">
                                    <x-t-link
                                        href="{{ route('password.request') }}"
                                    >
                                        {{ __('Forgot your password?') }}
                                    </x-t-link>
                                </div>
                            @endif
                        </x-t-grid>
                    </x-slot:body>
                    @if (config('streamline.social_login.enabled'))
                        <x-slot:footer>
                            <x-t-text
                                variant="light"
                                size="sm"
                                class="uppercase text-center"
                            >
                                {{ __('Or') }}
                            </x-t-text>
                            <x-t-grid cols="1" gap="sm">
                                @includeIf('auth.partials.social-logins')
                            </x-t-grid> 
                        </x-slot:footer>
                    @endif
                </x-t-card>
            </form>
        </x-t-container>
    </x-t-section>
</x-guest-layout>