@php
    $user = Auth::user();
    $isSuper = $user->isSuperAdmin();
    $isTechnician = $user->isTechnician();
    $isIsp = $user->isIspAdmin() || $user->isIspStaff();
    $tenantIsp = request()->attributes->get(\App\Http\Middleware\LoadTenantIsp::ATTRIBUTE);
    $ispName = $tenantIsp?->name ?? optional($user->isp)->name ?? ($isSuper ? 'PrimeBilling Admin' : 'Your ISP');
    $homeRoute = $isSuper
        ? route('admin.dashboard')
        : ($isTechnician ? route('isp.technician.inventory.index') : route('isp.dashboard'));

    /**
     * Helper closures for active-state matching.
     * - $active(routes...) returns true if the current route name matches any of the given patterns
     */
    $active = function (...$patterns) {
        foreach ($patterns as $p) {
            if (request()->routeIs($p)) return true;
        }
        return false;
    };

    $auditActivityActive = $active('admin.audit.activity', 'admin.audit.activity.show');
    $auditSecurityActive = $active('admin.audit.security');
@endphp

<aside
    data-turbo-permanent
    :class="[
        $store.sidebar.collapsed ? 'md:!w-16' : '',
        $store.sidebar.mobileOpen ? '!translate-x-0' : '',
    ]"
    class="pb-sidebar fixed top-0 bottom-0 left-0 z-40 flex w-64 -translate-x-full flex-col transition-all duration-300 ease-in-out md:translate-x-0"
>
    {{-- Brand (ISP logo + workspace title when configured) --}}
    @php
        $ib = $ispBranding ?? null;
        $brandTitle = $ib['workspace_title'] ?? 'PrimeBilling';
        $brandTag = $ib['workspace_tagline'] ?? $ispName;
        $logoUrl = $ib['logo_url'] ?? null;
    @endphp
    <a href="{{ $homeRoute }}"
       class="pb-sidebar-brand group shrink-0 flex h-20 items-center border-b border-white/5 no-underline outline-none transition-colors hover:bg-white/5 focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-indigo-400/50"
       :class="$store.sidebar.collapsed ? 'justify-center px-2' : 'gap-3 px-4'"
       title="{{ $brandTitle }}">
        <span
            class="pb-sidebar-brand-mark h-9 w-9 shrink-0 rounded-xl border border-white/10 bg-slate-900/40 shadow-[0_8px_18px_-8px_rgba(99,102,241,0.55),inset_0_1px_0_rgba(255,255,255,0.12)] bg-cover bg-center"
            @if ($logoUrl)
                style="background-image: url('{{ e($logoUrl) }}');"
            @else
                style="background-image: url('{{ asset('images/primebilling-mark.svg') }}'), linear-gradient(135deg, #6366f1 0%, #7c3aed 50%, #22d3ee 100%);"
            @endif
            aria-hidden="true"></span>
        <span class="flex min-w-0 flex-col leading-tight text-left" x-show="!$store.sidebar.collapsed" x-cloak>
            <span class="truncate text-sm font-bold tracking-tight text-white">{{ $brandTitle }}</span>
            <span class="truncate text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-400">{{ $brandTag }}</span>
        </span>
    </a>

    {{-- Scroll area --}}
    <div class="flex-1 overflow-y-auto overflow-x-hidden py-4">
        <nav class="space-y-5"
             :class="$store.sidebar.collapsed ? 'px-2' : 'px-3'">

            @if($isSuper)
                {{-- ============= SUPER ADMIN ============= --}}
                <div>
                    <div class="pb-sidebar-section-label mb-2" x-show="!$store.sidebar.collapsed">Platform</div>
                    <div class="space-y-1">
                        <a href="{{ route('admin.dashboard') }}"
                           data-nav-active-routes="admin.dashboard"
                           class="pb-nav-item {{ $active('admin.dashboard') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="7" height="9" rx="1.5"/><rect x="14" y="3" width="7" height="5" rx="1.5"/><rect x="14" y="12" width="7" height="9" rx="1.5"/><rect x="3" y="16" width="7" height="5" rx="1.5"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Dashboard</span>
                        </a>
                        <a href="{{ route('admin.isps.index') }}"
                           data-nav-active-routes="admin.isps.*"
                           class="pb-nav-item {{ $active('admin.isps.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 21h18"/><path d="M5 21V7l7-4 7 4v14"/><path d="M9 21v-6h6v6"/></svg>
                            <span x-show="!$store.sidebar.collapsed">All ISPs</span>
                        </a>
                        <a href="{{ route('admin.finance.index') }}"
                           data-nav-active-routes="admin.finance.*"
                           class="pb-nav-item {{ $active('admin.finance.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="12" y1="1" x2="12" y2="23"/><path d="M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Finance</span>
                        </a>
                        <a href="{{ route('admin.helpdesk.index') }}"
                           data-nav-active-routes="admin.helpdesk.*"
                           class="pb-nav-item {{ $active('admin.helpdesk.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"/></svg>
                            <span x-show="!$store.sidebar.collapsed">ISP helpdesk</span>
                        </a>
                        <a href="{{ route('admin.users.index') }}"
                           data-nav-active-routes="admin.users.index,admin.users.create,admin.users.show,admin.users.edit"
                           class="pb-nav-item {{ $active('admin.users.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="7" r="4"/><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Operators</span>
                        </a>
                        <a href="{{ route('admin.platform-saas-plans.index') }}"
                           data-nav-active-routes="admin.platform-saas-plans.*"
                           class="pb-nav-item {{ $active('admin.platform-saas-plans.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 7h16"/><path d="M6 7v10a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V7"/><path d="M9 21h6"/></svg>
                            <span x-show="!$store.sidebar.collapsed">SaaS plans</span>
                        </a>
                        <a href="{{ route('admin.settings.index') }}"
                           data-nav-active-routes="admin.settings.index,admin.settings.forms.*,admin.integrations.*,admin.portal-settings.*,admin.audit.security,admin.promo-codes.*"
                           data-turbo-frame="pb-main"
                           data-turbo-action="advance"
                           class="pb-nav-item {{ $active('admin.settings.index', 'admin.settings.forms.*', 'admin.integrations.*', 'admin.portal-settings.*', 'admin.audit.security', 'admin.promo-codes.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Settings' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="3"/><path d="M12 1v2M12 21v2M4.22 4.22l1.42 1.42M18.36 18.36l1.42 1.42M1 12h2M21 12h2M4.22 19.78l1.42-1.42M18.36 5.64l1.42-1.42"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Settings</span>
                        </a>
                        <a href="{{ route('admin.network.index') }}"
                           data-nav-active-routes="admin.network.*"
                           class="pb-nav-item {{ $active('admin.network.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="11" width="18" height="9" rx="2"/><path d="M7 7v4M17 7v4M5 7h14"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Network NOC</span>
                        </a>
                        <a href="{{ route('admin.system-health.index') }}"
                           data-nav-active-routes="admin.system-health.*"
                           class="pb-nav-item {{ $active('admin.system-health.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 12h-4"/><path d="M6 12H2"/><path d="M12 6V2"/><path d="M12 22v-4"/><circle cx="12" cy="12" r="3"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Fleet health</span>
                        </a>
                        <a href="{{ route('admin.audit.activity') }}"
                           data-nav-active-routes="admin.audit.activity,admin.audit.activity.show"
                           class="pb-nav-item {{ $auditActivityActive ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="9" y1="15" x2="15" y2="15"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Global audit</span>
                        </a>
                        <a href="{{ route('admin.announcements.index') }}"
                           data-nav-active-routes="admin.announcements.*"
                           class="pb-nav-item {{ $active('admin.announcements.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 8a6 6 0 0 0-12 0c0 7-3 9-3 9h18s-3-2-3-9"/><path d="M13.73 21a2 2 0 0 1-3.46 0"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Announcements</span>
                        </a>
                        <a href="{{ route('admin.intelligence.index') }}"
                           data-nav-active-routes="admin.intelligence.*"
                           class="pb-nav-item {{ $active('admin.intelligence.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 3v18h18"/><path d="M7 14l3-3 4 4 5-5"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Intelligence</span>
                        </a>
                        <a href="{{ route('admin.marketing.index') }}"
                           data-nav-active-routes="admin.marketing.*"
                           class="pb-nav-item {{ $active('admin.marketing.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16v12H4z"/><path d="M8 20h8"/><path d="M12 16v4"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Marketing</span>
                        </a>
                        <a href="{{ route('admin.communications.index') }}"
                           data-nav-active-routes="admin.communications.*"
                           class="pb-nav-item {{ $active('admin.communications.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/><path d="M8 10h.01M12 10h.01M16 10h.01"/></svg>
                            <span x-show="!$store.sidebar.collapsed">SMS control</span>
                        </a>
                    </div>
                </div>
            @elseif($isTechnician)

                <div>
                    <div class="pb-sidebar-section-label mb-2" x-show="!$store.sidebar.collapsed">Field</div>
                    <div class="space-y-1">
                        <a href="{{ route('isp.technician.inventory.index') }}"
                           class="pb-nav-item {{ $active('isp.technician.inventory.index', 'isp.technician.inventory.show') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73L12 22l8.27-4.77A2 2 0 0 0 22 16V8z"/></svg>
                            <span x-show="!$store.sidebar.collapsed">My devices</span>
                        </a>
                        <a href="{{ route('isp.technician.inventory.scan') }}"
                           class="pb-nav-item {{ $active('isp.technician.inventory.scan') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 7V5a2 2 0 0 1 2-2h2"/><path d="M17 3h2a2 2 0 0 1 2 2v2"/><path d="M21 17v2a2 2 0 0 1-2 2h-2"/><path d="M7 21H5a2 2 0 0 1-2-2v-2"/><rect x="7" y="7" width="10" height="10" rx="1"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Scan device</span>
                        </a>
                    </div>
                </div>

            @elseif($isIsp)

                {{-- ============= MAIN (daily workflow) ============= --}}
                <div>
                    <div class="pb-sidebar-section-label mb-2" x-show="!$store.sidebar.collapsed">Main</div>
                    <div class="space-y-1">
                        <a href="{{ route('isp.dashboard') }}"
                           class="pb-nav-item {{ $active('isp.dashboard') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Dashboard' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="7" height="9" rx="1.5"/><rect x="14" y="3" width="7" height="5" rx="1.5"/><rect x="14" y="12" width="7" height="9" rx="1.5"/><rect x="3" y="16" width="7" height="5" rx="1.5"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Dashboard</span>
                        </a>
                        <a href="{{ route('isp.customers.index') }}"
                           class="pb-nav-item {{ $active('isp.customers.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Customers' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="7" r="4"/><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><path d="M22 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Customers</span>
                        </a>
                        <a href="{{ route('isp.subscriptions.index') }}"
                           class="pb-nav-item {{ $active('isp.subscriptions.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Subscriptions' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12a9 9 0 1 1-3-6.7"/><polyline points="21 4 21 10 15 10"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Subscriptions</span>
                        </a>
                        <a href="{{ route('isp.payments.index') }}"
                           class="pb-nav-item {{ $active('isp.payments.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Payments' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="5" width="20" height="14" rx="2"/><line x1="2" y1="10" x2="22" y2="10"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Payments</span>
                        </a>
                        <a href="{{ route('isp.invoices.index') }}"
                           class="pb-nav-item {{ $active('isp.invoices.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Invoices' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="9" y1="13" x2="15" y2="13"/><line x1="9" y1="17" x2="13" y2="17"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Invoices</span>
                        </a>
                        <a href="{{ route('isp.plans.index') }}"
                           class="pb-nav-item {{ $active('isp.plans.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Plans' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 7H4a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2Z"/><path d="M16 7V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v2"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Plans &amp; Vouchers</span>
                        </a>
                    </div>
                </div>

                {{-- ============= NETWORK (monitoring first) ============= --}}
                <div>
                    <div class="pb-sidebar-section-label mb-2" x-show="!$store.sidebar.collapsed">Network</div>
                    <div class="space-y-1">
                        <a href="{{ route('isp.provisioning-hub.index') }}"
                           class="pb-nav-item {{ $active('isp.provisioning-hub.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Provisioning hub' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="7" height="7" rx="1"/><rect x="14" y="3" width="7" height="7" rx="1"/><rect x="3" y="14" width="7" height="7" rx="1"/><path d="M14 14h7v7h-7z"/><path d="M17.5 14v7M14 17.5h7"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Provisioning hub</span>
                        </a>
                        <a href="{{ route('isp.router-migration.index') }}"
                           class="pb-nav-item {{ $active('isp.router-migration.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Router migration' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M7 7h10v10H7z"/><path d="M17 7l3-3"/><path d="M7 17l-3 3"/><path d="m14 10-4 4"/><path d="m10 10 4 4"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Router migration</span>
                        </a>
                        <a href="{{ route('isp.active-users.index') }}"
                           class="pb-nav-item {{ $active('isp.active-users.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Active users' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="3"/><path d="M2 12a10 10 0 0 1 20 0"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Active users</span>
                        </a>
                        <a href="{{ route('isp.sessions.index') }}"
                           class="pb-nav-item {{ $active('isp.sessions.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Sessions' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 12h4l3 9 4-18 3 9h4"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Live sessions</span>
                        </a>
                        <a href="{{ route('isp.data-usage.index') }}"
                           class="pb-nav-item {{ $active('isp.data-usage.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Data usage' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 20V10"/><path d="M12 20V4"/><path d="M6 20v-6"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Data usage</span>
                        </a>
                        <a href="{{ route('isp.communications.index') }}"
                           class="pb-nav-item {{ $active('isp.communications.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Communications' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Communications</span>
                        </a>
                        <a href="{{ route('isp.routers.index') }}"
                           class="pb-nav-item {{ $active('isp.routers.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Routers' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="11" width="18" height="9" rx="2"/><path d="M7 7v4M17 7v4M5 7h14"/><circle cx="8" cy="16" r="0.6" fill="currentColor"/><circle cx="12" cy="16" r="0.6" fill="currentColor"/><circle cx="16" cy="16" r="0.6" fill="currentColor"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Routers</span>
                        </a>
                        <a href="{{ route('isp.hotspot-servers.index') }}"
                           class="pb-nav-item {{ $active('isp.hotspot-servers.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Hotspot servers' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12.55a11 11 0 0 1 14 0"/><path d="M2 9.32a16 16 0 0 1 20 0"/><path d="M8.5 16.43a6 6 0 0 1 7 0"/><circle cx="12" cy="20" r="1" fill="currentColor"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Hotspot servers</span>
                        </a>
                        <a href="{{ route('isp.user-connections.index') }}"
                           class="pb-nav-item {{ $active('isp.user-connections.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'PPPoE / Connections' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.72"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.72-1.72"/></svg>
                            <span x-show="!$store.sidebar.collapsed">PPPoE &amp; Connections</span>
                        </a>
                        <a href="{{ route('isp.ip-pools.index') }}"
                           class="pb-nav-item {{ $active('isp.ip-pools.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'IP pools' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16Z"/><path d="m3.27 6.96 8.73 5.05 8.73-5.05"/><path d="M12 22.08V12"/></svg>
                            <span x-show="!$store.sidebar.collapsed">IP pools</span>
                        </a>
                        <a href="{{ route('isp.bandwidth-profiles.index') }}"
                           class="pb-nav-item {{ $active('isp.bandwidth-profiles.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Bandwidth profiles' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 12c-2.5 0-3.5-3-6-3s-3.5 3-6 3-3.5-3-6-3-3.5 3-2 3"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Bandwidth profiles</span>
                        </a>
                        <a href="{{ route('isp.outages.index') }}"
                           class="pb-nav-item {{ $active('isp.outages.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Outages' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"/><line x1="12" y1="9" x2="12" y2="13"/><line x1="12" y1="17" x2="12.01" y2="17"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Outages</span>
                        </a>
                        <a href="{{ route('isp.inventory.index') }}"
                           class="pb-nav-item {{ $active('isp.inventory.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Inventory' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73L12 22l8.27-4.77A2 2 0 0 0 22 16V8z"/><path d="m3.27 6.96 8.73 5.05 8.73-5.05"/><path d="M12 22.08V12"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Inventory</span>
                        </a>
                    </div>
                </div>

                {{-- ============= SUPPORT ============= --}}
                <div>
                    <div class="pb-sidebar-section-label mb-2" x-show="!$store.sidebar.collapsed">Support</div>
                    <div class="space-y-1">
                        <a href="{{ route('isp.tickets.index') }}"
                           class="pb-nav-item {{ $active('isp.tickets.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Tickets' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Support tickets</span>
                        </a>
                        <a href="{{ route('isp.vouchers.index') }}"
                           class="pb-nav-item {{ $active('isp.vouchers.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Vouchers' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 12V7H4v10h16v-5"/><path d="M16 12h2"/><path d="M8 7v10"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Vouchers</span>
                        </a>
                        <a href="{{ route('isp.helpdesk.index') }}"
                           class="pb-nav-item {{ $active('isp.helpdesk.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'PrimeBilling helpdesk' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/><path d="m9 12 2 2 4-4"/></svg>
                            <span x-show="!$store.sidebar.collapsed">PrimeBilling helpdesk</span>
                        </a>
                    </div>
                </div>

                {{-- ============= ANALYTICS ============= --}}
                <div>
                    <div class="pb-sidebar-section-label mb-2" x-show="!$store.sidebar.collapsed">Analytics</div>
                    <div class="space-y-1">
                        <a href="{{ route('isp.reports.index') }}"
                           class="pb-nav-item {{ $active('isp.reports.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Reports' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 3v18h18"/><path d="M7 14l3-3 4 4 5-5"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Reports</span>
                        </a>
                        <a href="{{ route('isp.reports.index', ['focus' => 'revenue-per-plan']) }}#revenue-per-plan"
                           class="pb-nav-item"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Revenue' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="12" y1="1" x2="12" y2="23"/><path d="M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Revenue</span>
                        </a>
                        <a href="{{ route('isp.reports.index', ['focus' => 'monthly-collections']) }}#monthly-collections"
                           class="pb-nav-item"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Collections' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><line x1="8" y1="3" x2="8" y2="21"/><line x1="16" y1="3" x2="16" y2="21"/><line x1="3" y1="12" x2="21" y2="12"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Collections</span>
                        </a>
                        <a href="{{ route('isp.reports.index', ['focus' => 'customer-growth']) }}#customer-growth"
                           class="pb-nav-item"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Customer growth' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 17 9 11 13 15 21 7"/><polyline points="14 7 21 7 21 14"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Customer growth</span>
                        </a>
                    </div>
                </div>

                {{-- ============= SYSTEM ============= --}}
                <div>
                    <div class="pb-sidebar-section-label mb-2" x-show="!$store.sidebar.collapsed">System</div>
                    <div class="space-y-1">
                        <a href="{{ route('isp.settings.index') }}"
                           data-nav-active-routes="isp.settings.index,isp.settings.company*,isp.settings.custom-fields*,isp.settings.branches*,isp.settings.forms.*,isp.settings.payment*,isp.settings.payment-gateways*,isp.settings.notifications*,isp.settings.users*,isp.settings.roles*,isp.settings.security*,isp.settings.billing*,isp.settings.router-defaults*,isp.settings.pppoe-defaults*,isp.settings.hotspot*,isp.settings.backups*,isp.settings.maintenance*,isp.settings.api-integrations*,isp.payment-settings.*,isp.logs.*"
                           data-turbo-frame="pb-main"
                           data-turbo-action="advance"
                           class="pb-nav-item {{ $active('isp.settings.*', 'isp.payment-settings.*', 'isp.logs.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Settings' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="3"/><path d="M12 1v2M12 21v2M4.22 4.22l1.42 1.42M18.36 18.36l1.42 1.42M1 12h2M21 12h2M4.22 19.78l1.42-1.42M18.36 5.64l1.42-1.42"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Settings</span>
                        </a>
                        <a href="{{ route('isp.notifications.index') }}"
                           class="pb-nav-item {{ $active('isp.notifications.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'Notifications' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 8a6 6 0 0 0-12 0c0 7-3 9-3 9h18s-3-2-3-9"/><path d="M13.73 21a2 2 0 0 1-3.46 0"/></svg>
                            <span x-show="!$store.sidebar.collapsed">Notifications</span>
                        </a>
                        <a href="{{ route('isp.platform-subscription.index') }}"
                           class="pb-nav-item {{ $active('isp.platform-subscription.*') ? 'is-active' : '' }}"
                           :class="$store.sidebar.collapsed ? 'justify-center' : ''"
                           :title="$store.sidebar.collapsed ? 'PrimeBilling subscription' : ''">
                            <svg class="pb-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="5" width="20" height="14" rx="2"/><line x1="2" y1="10" x2="22" y2="10"/></svg>
                            <span x-show="!$store.sidebar.collapsed">PrimeBilling subscription</span>
                        </a>
                    </div>
                </div>
            @endif

        </nav>
    </div>

    {{-- Footer / Status --}}
    <div class="border-t border-white/5 p-3" x-show="!$store.sidebar.collapsed">
        <div class="rounded-xl bg-white/5 p-3">
            <div class="flex items-center gap-2">
                <span class="pb-pulse-dot"></span>
                <span class="text-[11px] font-semibold text-emerald-300">All systems operational</span>
            </div>
            <p class="mt-1 text-[10px] text-slate-400 leading-relaxed">
                {{ $user->isp?->name ?? 'PrimeBilling' }} · v{{ config('app.version', '1.0') }}
            </p>
        </div>
    </div>

    <div class="border-t border-white/5 p-2" x-show="$store.sidebar.collapsed" x-cloak>
        <div class="flex items-center justify-center" title="All systems operational">
            <span class="pb-pulse-dot"></span>
        </div>
    </div>
</aside>
