<!-- layout -->
{{ @extends("__app.crm.layout__") }}
<!-- /layout -->

<!-- Main Content -->
<main class="main-content"id="mainContent">
    <!-- navbar -->
    {{ @extends("__app.crm.navbar__") }}
    <!-- /navbar -->

    <div class="d-flex gap-0 content-section">
        <div class="col-2">
            <!-- sidebar -->
            {{ @extends("__app.crm.sidebar__") }}
            <!-- /sidebar -->
        </div>

        <!-- Dashboard Content -->
        <div class="col-10 p-2">
            <!-- Welcome Banner -->
            <div class="bg-light text-dark rounded-3 p-4 mb-2 border border-secondary">
                <div class="d-flex flex-column flex-md-row justify-content-between align-items-start align-items-md-center mb-3">
                    <div class="welcome-banner">
                        <h1 class="h2 mb-2">Welcome back, {{ Auth('username') }}! 👋</h1> 
                    </div> 
                </div>

                <!-- Quick Stats -->
                <div class="row mt-4">
                    <!-- ... -->
                </div>
            </div>

            <!-- Stats Cards -->
            <div class="row g-4 mb-2">
                <!-- ... -->
            </div> 
        </div>
    </div>
</main>

<!-- footer -->
{{ @extends("__app.crm.footer__") }}
<!-- /footer -->

<!-- dashboard js -->
<script type="text/javascript"src="<?= asset_path('js/modules/dashboard.js') ?>"></script>

<!-- closure -->
{{ @extends("__app.crm.closure__") }}
<!-- /closure -->