@extends('layouts.app')

@section('styles')
    {{-- Style Here --}}
    @vite(['resources/scss/light/assets/authentication/auth-cover.scss'])
    @vite(['resources/scss/dark/assets/authentication/auth-cover.scss'])
@endsection
@section('content')
<div class="auth-container d-flex justify-content-center align-items-center min-vh-100 bg-black">
    <div class="col-xxl-4 col-xl-5 col-lg-5 col-md-8 col-12">
        <div class="card shadow-lg border-0 bg-dark text-white">
            <div class="card-body p-4">
                <h2 class="text-center mb-4 text-white">Litigation Case Tracker</h2>

                {{-- Display validation errors --}}
                @if ($errors->any())
                    <div class="alert alert-danger">
                        <ul class="mb-0">
                            @foreach ($errors->all() as $error)
                                <li>{{ $error }}</li>
                            @endforeach
                        </ul>
                    </div>
                @endif

                {{-- Login Form --}}
                <form method="POST" action="{{ route('login.submit') }}">
                    @csrf
                    <div class="mb-3">
                        <label class="form-label text-white">Email</label>
                        <input type="email" name="email" class="form-control bg-secondary text-white border-0" required value="{{ old('email') }}">
                    </div>

                    <div class="mb-4">
                        <label class="form-label text-white">Password</label>
                        <input type="password" name="password" class="form-control bg-secondary text-white border-0" required>
                    </div>

                    <div class="mb-3 d-flex justify-content-between align-items-center">
                        <div class="form-check form-check-primary form-check-inline">
                            <input class="form-check-input me-2" type="checkbox" name="remember" id="form-check-default">
                            <label class="form-check-label text-white" for="form-check-default">Remember me</label>
                        </div>
                        <a href="{{ route('PasswordReset') }}" class="text-info text-decoration-none">Forgot Password?</a>
                    </div>

                    <div class="mb-3">
                        <button type="submit" class="btn btn-light w-100 fw-bold">SIGN IN</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection


@section('scripts')
    {{-- Scripts Here --}}
@endsection