<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@yield('title')</title>
    @include('includes.head')

    @yield('style-section')
</head>

<body>

    {{-- <header> --}}
    <!-- Include header content here -->
    @include('includes.topbar')
    @include('includes.header')
    {{-- </header> --}}

    <main class="main">
        <!-- Define main content section -->
        @yield('content')
    </main>

    <footer>
        <!-- Include footer content here -->
        @include('includes.footer')
    </footer>
    @include('includes.alert')
    @include('includes.foot')
    @yield('script_area')

    @include('includes.script')

    <!-- Include your scripts here -->
</body>

</html>
