@php
    $items = [
        'user.dashboard' => ['title' => 'داشبورد', 'icon' => 'far fa-user'],
        'user.instagram-accounts.index' => ['title' => 'اکانت‌های اینستاگرام', 'icon' => 'fab fa-instagram'],
        'user.instagram-products.index' => ['title' => 'Products', 'icon' => 'far fa-box'],
        'user.instagram-conversations.index' => ['title' => 'Conversations', 'icon' => 'far fa-comments'],
        'user.profile' => ['title' => 'اطلاعات کاربری', 'icon' => 'far fa-id-card'],
        'user.wallet' => ['title' => 'کیف پول', 'icon' => 'far fa-wallet'],
        'user.friends' => ['title' => 'دوستان', 'icon' => 'far fa-user-friends'],
        'user.live.index' => ['title' => 'لایوهای من', 'icon' => 'far fa-video'],
        'user.chat' => ['title' => 'چت', 'icon' => 'far fa-comments'],
    ];
@endphp

@once
    <style>
        .profile-menu { margin-bottom: 18px; overflow-x: auto; padding-bottom: 4px; }
        .profile-menu__list { display: flex; gap: 8px; min-width: max-content; padding: 0; margin: 0; list-style: none; }
        .profile-menu__link { display: inline-flex; align-items: center; gap: 7px; min-height: 42px; padding: 9px 13px; border-radius: 8px; border: 1px solid rgba(255,255,255,.08); background: var(--bg2); color: var(--text); font-weight: 800; white-space: nowrap; }
        .profile-menu__link:hover, .profile-menu__link.active { color: #fff; border-color: rgba(73,88,165,.55); background: rgba(73,88,165,.22); }
        .profile-menu__link--logout { color: #fff; border-color: rgba(220,53,69,.45); background: rgba(220,53,69,.18); }
        .profile-menu__link--logout:hover { color: #fff; border-color: rgba(220,53,69,.75); background: rgba(220,53,69,.32); }
    </style>
@endonce

<nav class="profile-menu" aria-label="منوی کاربری">
    <ul class="profile-menu__list">
        @foreach($items as $route => $item)
            @php($isActive = request()->routeIs($route))
            <li>
                <a class="profile-menu__link {{ $isActive ? 'active' : '' }}" href="{{ localized_route($route) }}">
                    <i class="{{ $item['icon'] }}"></i>
                    <span>{{ $item['title'] }}</span>
                </a>
            </li>
        @endforeach
        <li>
            <a class="profile-menu__link profile-menu__link--logout" href="{{ localized_route('logout') }}">
                <i class="far fa-sign-out-alt"></i>
                <span>خروج</span>
            </a>
        </li>
    </ul>
</nav>