@php
    $links = [
        ['route' => 'dashboard', 'label' => 'Dashboard', 'can' => null, 'icon' => 'M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6'],
        ['route' => 'products.index', 'label' => 'Products', 'can' => 'products.view', 'icon' => 'M20 7l-8-4-8 4m16 0l-8 4m8-4v10l-8 4m0-10L4 7m8 4v10M4 7v10l8 4'],
        ['route' => 'categories.index', 'label' => 'Categories', 'can' => 'categories.view', 'icon' => 'M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10'],
        ['route' => 'suppliers.index', 'label' => 'Suppliers', 'can' => 'suppliers.view', 'icon' => 'M3 7h18M3 7l2 13h14l2-13M3 7l2-4h14l2 4M9 11v6m6-6v6'],
        ['route' => 'purchases.index', 'label' => 'Purchases', 'can' => 'purchases.view', 'icon' => 'M16 11V7a4 4 0 00-8 0v4M5 9h14l1 12H4L5 9z'],
        ['route' => 'customers.index', 'label' => 'Customers', 'can' => 'customers.view', 'icon' => 'M17 20h5v-2a4 4 0 00-3-3.87M9 20H4v-2a4 4 0 013-3.87m6-6a4 4 0 11-8 0 4 4 0 018 0zm6 3a4 4 0 10-8 0 4 4 0 008 0z'],
        ['route' => 'sales.index', 'label' => 'Sales', 'can' => 'sales.view', 'icon' => 'M9 14l6-6m-5.5-1a1.5 1.5 0 11-3 0 1.5 1.5 0 013 0zm7 7a1.5 1.5 0 11-3 0 1.5 1.5 0 013 0zM5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z'],
        ['route' => 'warehouses.index', 'label' => 'Warehouses', 'can' => 'warehouses.view', 'icon' => 'M5 8h14M5 8a2 2 0 01-2-2V5a2 2 0 012-2h14a2 2 0 012 2v1a2 2 0 01-2 2M5 8v10a2 2 0 002 2h10a2 2 0 002-2V8'],
        ['route' => 'inventory.index', 'label' => 'Inventory', 'can' => 'inventory.view', 'icon' => 'M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z'],
        ['route' => 'reports.index', 'label' => 'Reports', 'can' => 'reports.view', 'icon' => 'M9 17v-2a2 2 0 012-2h2a2 2 0 012 2v2m-8 0h10a2 2 0 002-2V7a2 2 0 00-2-2H7a2 2 0 00-2 2v8a2 2 0 002 2zm3-8V7m4 2V7'],
        ['route' => 'assistant.index', 'label' => 'AI Assistant', 'can' => 'ai.use', 'icon' => 'M13 10V3L4 14h7v7l9-11h-7z'],
        ['route' => 'users.index', 'label' => 'Users', 'can' => 'users.manage', 'icon' => 'M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197M13 7a4 4 0 11-8 0 4 4 0 018 0z'],
        ['route' => 'roles.index', 'label' => 'Roles', 'can' => 'roles.manage', 'icon' => 'M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z'],
        ['route' => 'settings.edit', 'label' => 'Settings', 'can' => 'settings.manage', 'icon' => 'M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z'],
    ];
@endphp

<aside
    x-data="{ open: false }"
    class="lg:w-64 lg:flex-shrink-0"
>
    <!-- Mobile toggle -->
    <div class="lg:hidden flex items-center justify-between px-4 py-3 bg-white dark:bg-gray-800 border-b border-gray-100 dark:border-gray-700">
        <a href="{{ route('dashboard') }}" class="font-semibold text-gray-800 dark:text-gray-100">
            {{ config('app.name') }}
        </a>
        <button @click="open = !open" class="p-2 text-gray-500 dark:text-gray-400">
            <svg class="h-6 w-6" stroke="currentColor" fill="none" viewBox="0 0 24 24">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
            </svg>
        </button>
    </div>

    <nav
        :class="{ 'block': open, 'hidden': !open }"
        class="hidden lg:block lg:h-screen lg:sticky lg:top-0 w-full lg:w-64 bg-white dark:bg-gray-800 border-r border-gray-100 dark:border-gray-700 overflow-y-auto"
    >
        <div class="hidden lg:flex items-center h-16 px-6 border-b border-gray-100 dark:border-gray-700">
            <a href="{{ route('dashboard') }}" class="font-semibold text-lg text-gray-800 dark:text-gray-100">
                {{ config('app.name') }}
            </a>
        </div>

        <div class="px-3 py-4 space-y-1">
            @foreach ($links as $link)
                @if (Route::has($link['route']) && (is_null($link['can']) || auth()->user()?->can($link['can'])))
                    <a
                        href="{{ route($link['route']) }}"
                        @class([
                            'flex items-center gap-3 px-3 py-2 rounded-lg text-sm font-medium transition',
                            'bg-indigo-50 text-indigo-700 dark:bg-indigo-500/10 dark:text-indigo-300' => request()->routeIs(explode('.', $link['route'])[0] . '.*') || request()->routeIs($link['route']),
                            'text-gray-600 hover:bg-gray-50 hover:text-gray-900 dark:text-gray-300 dark:hover:bg-gray-700/50 dark:hover:text-white' => ! (request()->routeIs(explode('.', $link['route'])[0] . '.*') || request()->routeIs($link['route'])),
                        ])
                    >
                        <svg class="h-5 w-5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="{{ $link['icon'] }}" />
                        </svg>
                        {{ $link['label'] }}
                    </a>
                @endif
            @endforeach
        </div>
    </nav>
</aside>