<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}" >
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, viewport-fit=cover">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <title>{{ isset($title) ? $title.' - '.config('app.name') : config('app.name') }}</title>

    @vite(['resources/css/app.css', 'resources/js/app.js'])
</head>
<body class="min-h-screen font-sans antialiased bg-base-200">

    {{-- NAVBAR --}}
    <header role="banner">
        <livewire:navigation.navbar />
    </header>

    {{-- MAIN CONTENT --}}
    <main id="main-content" class="flex-1">
        <x-main full-width>

            {{-- SIDEBAR --}}
            <x-slot:sidebar drawer="main-drawer" collapsible class="bg-base-100 lg:bg-inherit lg:hidden">
                <livewire:navigation.sidebar />
            </x-slot:sidebar>

            {{-- SLOT --}}
            <x-slot:content>
                <div>
                    {{ $slot }}
                </div>
            </x-slot:content>

        </x-main>
    </main>

    {{-- FOOTER --}}
    <footer role="contentinfo" class="mt-auto">
        <livewire:navigation.footer />
    </footer>

    {{--  TOAST area --}}
    <x-toast />
</body>
</html>
