@php
    use Illuminate\Support\Facades\Route;
    use Illuminate\Support\Str;

    // ✅ MVP MENU ONLY
    $menuItems = [
        // Overview
        [
            'label' => 'Dashboard',
            'icon' => 'bi bi-speedometer2',
            'route' => 'dashboard',
        ],

        // Master Data Registration
        [
            'label' => 'Master Data',
            'icon' => 'bi bi-building',
            'children' => [
                ['label' => 'Owners List', 'icon' => 'bi bi-people', 'route' => 'owners-list'],
                ['label' => 'Business List', 'icon' => 'bi bi-shop', 'route' => 'business.index'],
            ],
        ],

        // Applications
        [
            'label' => 'Applications',
            'icon' => 'bi bi-ui-checks',
            'children' => [
                ['label' => 'Applications List', 'icon' => 'bi bi-card-list', 'route' => 'applications.index'],
                [
                    'label' => 'Create Application',
                    'icon' => 'bi bi-plus-circle',
                    'route' => 'applications.create',
                ],

                ['label' => 'Renewals', 'icon' => 'bi bi-card-list', 'route' => 'applications.renewals'],
                ['label' => 'Amendments', 'icon' => 'bi bi-card-list', 'route' => 'applications.amendments'],
                ['label' => 'Retirement/Closure', 'icon' => 'bi bi-card-list', 'route' => 'applications.retirements'],
                [
                    'label' => 'Endorsements (Health, Zoning, BFP, etc)',
                    'icon' => 'bi bi-card-list',
                    'route' => 'applications.endorsements',
                ],
            ],
        ],

        // Assessment & Billing
        [
            'label' => 'Assessment',
            'icon' => 'bi bi-calculator',
            'children' => [
                ['label' => 'Assessments', 'icon' => 'bi bi-list-check', 'route' => 'assessments.index'],
                ['label' => 'Compute Fees', 'icon' => 'bi bi-cash-coin', 'route' => 'assessments.computefees'],
                ['label' => 'Fee Schedules', 'icon' => 'bi bi-table', 'route' => 'assessments.fees'],
            ],
        ],

        // Receipts
        [
            'label' => 'Receipt',
            'icon' => 'bi bi-cash-stack',
            'children' => [
                ['label' => 'Post Payment', 'icon' => 'bi bi-journal-check', 'route' => 'receipt.postpayment'],
                ['label' => 'OR Register', 'icon' => 'bi bi-journal-text', 'route' => 'receipt.orregister'],
                ['label' => 'Void/Adjust', 'icon' => 'bi bi-slash-circle', 'route' => 'receipt.void'],
                ['label' => 'Cashier Shift / RCD', 'icon' => 'bi bi-slash-circle', 'route' => 'receipt.cashiershift'],
                ['label' => 'Deposits', 'icon' => 'bi bi-slash-circle', 'route' => 'receipt.deposits'],
            ],
        ],

        // Permits
        [
            'label' => 'Permits',
            'icon' => 'bi bi-badge-ad',
            'children' => [
                ['label' => 'Permit List', 'icon' => 'bi bi-card-checklist', 'route' => 'permits.index'],
                ['label' => 'Issue/Release', 'icon' => 'bi bi-printer', 'route' => 'permits.releases'],
                ['label' => 'QR Verification', 'icon' => 'bi bi-qr-code-scan', 'route' => 'permits.verify'],
                ['label' => 'Re-issue/Reprint', 'icon' => 'bi bi-qr-code-scan', 'route' => 'permits.reprint'],
            ],
        ],

        [
            'label' => 'Billing',
            'icon' => 'bi bi-receipt',
            'children' => [
                ['label' => 'Invoices', 'icon' => 'bi bi-file-earmark-text', 'route' => 'billing.invoices'],
                ['label' => 'Unpaid / Aging', 'icon' => 'bi bi-hourglass-split', 'route' => 'billing.unpaid'],
            ],
        ],

        // History
        [
            'label' => 'History',
            'icon' => 'bi bi-clock-history',
            'children' => [
                ['label' => 'Audit Trail', 'icon' => 'bi bi-activity', 'route' => 'history.audit'],
                ['label' => 'Business Ledger', 'icon' => 'bi bi-journal-richtext', 'route' => 'history.ledger'],
            ],
        ],

        // Reports (basic)
        [
            'label' => 'Reports',
            'icon' => 'bi bi-bar-chart',
            'children' => [
                ['label' => 'Collections (Daily/Monthly)', 'icon' => 'bi bi-cash', 'route' => 'reports.collections'],
                ['label' => 'Master List', 'icon' => 'bi bi-list-ul', 'route' => 'reports.masterlist'],
                ['label' => 'Permits Issued', 'icon' => 'bi bi-check2-circle', 'route' => 'reports.issuedpermits'],
                // ⛔ Delinquents (Phase 2)
            ],
        ],

        // Admin
        [
            'label' => 'Administration',
            'icon' => 'bi bi-gear',
            'children' => [
                ['label' => 'Users & Roles', 'icon' => 'bi bi-shield-lock', 'route' => 'admin.users'],
                ['label' => 'Ordinance Config', 'icon' => 'bi bi-sliders', 'route' => 'admin.ordinance'],
                ['label' => 'Number Series (Control/OR/Permit)', 'icon' => 'bi bi-hash', 'route' => 'admin.series'],
                ['label' => 'Integration (BFP/Barangay)', 'icon' => 'bi bi-diagram-3', 'route' => 'admin.integrations'],
            ],
        ],
    ];

    $slug = fn(string $label, int $i) => \Illuminate\Support\Str::slug($label) . '-' . $i;

    // Inline active route logic
    $isActive = function (?string $route, array $children = []): bool {
        if ($route && request()->routeIs($route)) {
            return true;
        }
        foreach ($children as $child) {
            if (!empty($child['route']) && request()->routeIs($child['route'])) {
                return true;
            }
        }
        return false;
    };
@endphp

<aside id="lguSidebar" class="sidebar lgu-sidebar">
    <div class="brand-block">
        <div>
            <img height="70" src="{{ asset('images/logo_small.png') }}" alt="LGU Seal">
        </div>
        <div class="brand-text">
            <div class="system-name">BPLS SYSTEM</div>
            <div class="system-sub">Business Permits & Licensing</div>
        </div>
    </div>

    <nav class="menu">
        <ul class="nav flex-column">
            @foreach ($menuItems as $i => $item)
                @php
                    $active = $isActive($item['route'] ?? null, $item['children'] ?? []);
                    $slugId = 'menu-' . $slug($item['label'] ?? 'menu', $i);
                @endphp

                @if (!empty($item['children']))
                    <li class="nav-item">
                        <a class="nav-link menu-parent d-flex justify-content-between align-items-center {{ $active ? '' : 'collapsed' }}"
                            data-bs-toggle="collapse" data-bs-target="#{{ $slugId }}" role="button"
                            aria-expanded="{{ $active ? 'true' : 'false' }}" aria-controls="{{ $slugId }}">
                            <span class="d-flex align-items-center gap-2">
                                @if (!empty($item['icon']))
                                    <i class="{{ $item['icon'] }}"></i>
                                @endif
                                <span class="label">{{ $item['label'] ?? '' }}</span>
                            </span>
                            <span class="chevron">
                                <i class="bi bi-plus-lg when-collapsed"></i>
                                <i class="bi bi-dash-lg when-expanded"></i>
                            </span>
                        </a>

                        <div class="collapse {{ $active ? 'show' : '' }}" id="{{ $slugId }}">
                            <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
                                @foreach ($item['children'] as $child)
                                    <li>
                                        <a class="nav-link menu-child {{ request()->routeIs($child['route'] ?? '') ? 'active' : '' }}"
                                            href="{{ isset($child['route']) && Route::has($child['route']) ? route($child['route']) : '#' }}">
                                            @if (!empty($child['icon']))
                                                <i class="{{ $child['icon'] }}"></i>
                                            @endif
                                            <span class="label">{{ $child['label'] ?? '' }}</span>
                                        </a>
                                    </li>
                                @endforeach
                            </ul>
                        </div>
                    </li>
                @else
                    <li class="nav-item">
                        <a class="nav-link menu-root {{ $active ? 'active' : '' }}"
                            href="{{ isset($item['route']) && Route::has($item['route']) ? route($item['route']) : '#' }}">
                            @if (!empty($item['icon']))
                                <i class="{{ $item['icon'] }}"></i>
                            @endif
                            <span class="label">{{ $item['label'] ?? '' }}</span>
                        </a>
                    </li>
                @endif
            @endforeach
        </ul>
    </nav>

    <div class="sidebar-footer">
        <div class="badge bg-warning-subtle text-warning-emphasis border border-warning-subtle">
            <i class="bi bi-shield-check me-1"></i> Official Use
        </div>
        <div class="version small text-muted">v1.0</div>
    </div>
</aside>


<style>
    /* ---------- Sidebar visual styles (HARD-SCOPED) ---------- */
    #lguSidebar {
        --lgu-bg: #0b1526;
        --lgu-bg-2: #0e1b33;
        --lgu-border: #1f3357;
        --lgu-accent: #e0b84f;
        --lgu-accent-2: #4ea3ff;
        --lgu-text: #e8edf7;
        --lgu-text-dim: #a9b4c7;

        position: sticky;
        top: 0;
        align-self: start;
        /* sits within grid, no overlap */
        height: 100dvh;
        color: var(--lgu-text);
        background: linear-gradient(180deg, var(--lgu-bg) 0%, var(--lgu-bg-2) 100%);
        border-right: 1px solid var(--lgu-border);
        box-shadow: 0 0 0 1px rgba(255, 255, 255, .02) inset, 0 10px 30px rgba(0, 0, 0, .35);
        padding: 16px 14px 12px 14px;
        overflow-y: auto;
        scrollbar-width: thin;
        scrollbar-color: #2a3e67 transparent;
        z-index: 1040;
    }

    /* Sidebar-only scrollbars */
    #lguSidebar::-webkit-scrollbar {
        width: 8px;
    }

    #lguSidebar::-webkit-scrollbar-track {
        background: transparent;
    }

    #lguSidebar::-webkit-scrollbar-thumb {
        background: #21345a;
        border-radius: 8px;
        border: 2px solid transparent;
        background-clip: content-box;
    }

    /* Header block */
    #lguSidebar .brand-block {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 10px 10px;
        margin: 4px 2px 14px;
        border-radius: 14px;
        background: linear-gradient(180deg, rgba(255, 255, 255, .03), rgba(255, 255, 255, .01));
        border: 1px solid var(--lgu-border);
    }

    #lguSidebar .brand-logo {
        display: grid;
        place-items: center;
        width: 64px;
        height: 64px;
        border-radius: 50%;
        background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, .14), rgba(255, 255, 255, .02));
        outline: 2px solid rgba(255, 255, 255, .05);
        box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .04);
    }

    #lguSidebar .brand-text .system-name {
        font-weight: 700;
        letter-spacing: .08em;
        font-size: .9rem;
        color: var(--lgu-text);
    }

    #lguSidebar .brand-text .system-sub {
        color: var(--lgu-text-dim);
        font-size: .78rem;
        letter-spacing: .03em;
    }

    /* Menu base */
    #lguSidebar .menu .nav {
        gap: 4px;
    }

    #lguSidebar .menu .nav-link {
        color: var(--lgu-text);
        padding: .625rem .75rem;
        border-radius: 10px;
        border: 1px solid transparent;
        transition: background .2s ease, color .2s ease, border-color .2s ease, transform .06s ease;
        outline: none;
    }

    #lguSidebar .menu .nav-link i {
        font-size: 1rem;
        opacity: .95;
    }

    #lguSidebar .menu .nav-link .label {
        margin-left: .35rem;
    }

    /* Root single links */
    #lguSidebar .menu-root {
        background: linear-gradient(180deg, rgba(255, 255, 255, .03), rgba(255, 255, 255, .01));
        border: 1px solid var(--lgu-border);
    }

    #lguSidebar .menu-root:hover {
        background: rgba(255, 255, 255, .06);
        transform: translateY(-1px);
    }

    #lguSidebar .menu-root.active {
        background: rgba(224, 184, 79, .12);
        border-color: rgba(224, 184, 79, .45);
        box-shadow: inset 3px 0 0 var(--lgu-accent);
    }

    /* Parent items */
    #lguSidebar .menu-parent {
        text-transform: uppercase;
        font-size: .78rem;
        letter-spacing: .06em;
        color: var(--lgu-text);
        border: 1px solid var(--lgu-border);
        background: linear-gradient(180deg, rgba(255, 255, 255, .02), rgba(255, 255, 255, .008));
    }

    #lguSidebar .menu-parent:hover {
        background: rgba(255, 255, 255, .06);
        transform: translateY(-1px);
    }

    #lguSidebar .menu-parent[aria-expanded="true"] {
        background: rgba(224, 184, 79, .10);
        border-color: rgba(224, 184, 79, .35);
    }

    #lguSidebar .menu-parent .chevron {
        opacity: .9;
    }

    /* Child links */
    #lguSidebar .menu-child {
        margin-left: .5rem;
        padding: .5rem .5rem .5rem 1.25rem;
        color: var(--lgu-text-dim);
        border-radius: 8px;
        position: relative;
    }

    #lguSidebar .menu-child::before {
        content: "";
        position: absolute;
        left: .6rem;
        top: 50%;
        transform: translateY(-50%);
        width: 6px;
        height: 6px;
        border-radius: 999px;
        background: #3b5385;
        opacity: .9;
    }

    #lguSidebar .menu-child:hover {
        background: rgba(255, 255, 255, .05);
        color: var(--lgu-text);
    }

    #lguSidebar .menu-child.active {
        color: var(--lgu-text);
        background: rgba(224, 184, 79, .12);
        box-shadow: inset 3px 0 0 var(--lgu-accent);
    }

    /* Expand/collapse icons (scoped) */
    #lguSidebar .nav-link .when-expanded {
        display: none;
    }

    #lguSidebar .nav-link[aria-expanded="true"] .when-expanded {
        display: inline-block;
    }

    #lguSidebar .nav-link[aria-expanded="true"] .when-collapsed {
        display: none;
    }

    /* Keyboard focus (scoped) */
    #lguSidebar .menu .nav-link:focus-visible {
        border-color: var(--lgu-accent-2);
        box-shadow: 0 0 0 3px rgba(78, 163, 255, .25);
    }

    /* Footer */
    #lguSidebar .sidebar-footer {
        margin-top: 10px;
        padding: 10px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        color: var(--lgu-text-dim);
        border-top: 1px dashed var(--lgu-border);
    }

    #lguSidebar .sidebar-footer .badge {
        background: rgba(224, 184, 79, .18) !important;
        border-color: rgba(224, 184, 79, .35) !important;
    }
</style>