<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    @vite("resources/css/app.css")
</head>
<body class="flex flex-col min-h-screen">
    @include('partials.navbar')

    <!-- Main Content Wrapper -->
    <main class="relative min-h-screen flex flex-col justify-center bg-white overflow-hidden">
        <!--<div class="flex flex-1 min-h-screen">-->
        <div class="grid grid-cols-6 min-h-screen">    
            <!-- Sidebar -->
            <aside class="col-span-1">
                @include('partials.sidebar')
            </aside>

            <!-- Main content area -->
            <div class="col-span-5">
                @yield('content')
            </div>
        </div>   
    </main>
    <!-- Footer -->
    <footer class="mt-auto">
        @include('partials.footer')
    </footer>    
</body>
</html>