@include('Layouts.main')
<head>
    @include("Layouts.title-meta")
    @yield('page-css')
    @include("Layouts.head-css")
</head>
<body>
    <div id="layout-wrapper">
        @include('Layouts.header')
        @include('Layouts.sidebar')
        <div class="vertical-overlay">
            <div class="d-flex align-items-center justify-content-center h-100">
                <div class="spinner-border text-warning" role="status">
                    <span class="sr-only">Loading...</span>
                </div>
            </div>
        </div>
        <div class="main-content">
            @yield('main-content')
            @include('Layouts.footer')
        </div>
        <!--start back-to-top-->
        <button onclick="topFunction()" class="btn btn-danger btn-icon" id="back-to-top">
            <i class="ri-arrow-up-line"></i>
        </button>
        <!--end back-to-top-->
    </div>

    @include("Layouts.vendor-scripts")
    @yield('page-js')
</body>
</html>