<!DOCTYPE html>
<html lang="{{ session('locale', 'en') }}" dir="{{ session('locale') === 'ar' ? 'rtl' : 'ltr' }}" class="h-full bg-slate-100" x-data="{ sidebarOpen: false, sidebarCollapsed: false, darkMode: false }">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@yield('title', 'Dashboard') - BrandX ERP</title>
    @vite(['resources/css/app.css', 'resources/js/app.js'])
    <style>
        body { font-family: Arial, Helvetica, sans-serif; }
        [x-cloak] { display: none !important; }
    </style>
</head>
<body class="h-full bg-slate-100 text-slate-800 antialiased selection:bg-orange-200 selection:text-slate-950" :class="{ 'govix-sidebar-collapsed': sidebarCollapsed }">

    <div class="govix-app-shell min-h-full flex flex-col">

        <!-- Impersonation Warning Banner (Requirement 42) -->
        @if(session()->has('impersonator_id'))
        <div class="bg-gradient-to-r from-amber-600 to-rose-600 text-white px-4 py-2 flex items-center justify-between text-xs font-bold shadow-md z-50 sticky top-0">
            <div class="flex items-center space-x-2 rtl:space-x-reverse">
                <svg class="w-4 h-4 animate-pulse shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"/></svg>
                <span>You are currently viewing this tenant as Platform Admin. (Impersonating: {{ session('impersonated_tenant_name', 'Tenant Workspace') }})</span>
            </div>
            <form action="{{ route('platform.impersonate.stop') }}" method="POST" class="inline">
                @csrf
                <button type="submit" class="px-3 py-1 bg-white text-rose-700 hover:bg-slate-100 font-extrabold rounded-lg shadow-sm transition-all">
                    Exit Impersonation
                </button>
            </form>
        </div>
        @endif

        <!-- Top Navigation Bar -->
        <header class="govix-topbar sticky top-0 z-30 bg-white border-b border-slate-200 shadow-sm">
            <div class="govix-topbar-inner px-4 sm:px-6 lg:px-8 h-16 flex items-center justify-between">

                <!-- Left: Sidebar Toggle & Tenant Info -->
                <div class="govix-header-card govix-context-card flex items-center space-x-3 rtl:space-x-reverse">
                    <button @click="sidebarOpen = !sidebarOpen" class="lg:hidden grid h-10 w-10 place-items-center rounded-xl border border-slate-200 text-slate-500 hover:text-orange-600">
                        <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"/></svg>
                    </button>
                    <button @click="sidebarCollapsed = !sidebarCollapsed" class="hidden lg:grid h-10 w-10 place-items-center rounded-xl border border-slate-200 text-slate-500 hover:border-orange-200 hover:text-orange-600">
                        <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h12M4 18h16"/></svg>
                    </button>

                    <div class="flex items-center space-x-3 rtl:space-x-reverse border-l rtl:border-r rtl:border-l-0 border-slate-200 pl-3 rtl:pl-0 rtl:pr-3">
                        <div class="w-9 h-9 rounded-xl bg-orange-50 border border-orange-100 p-0.5 shadow-sm shrink-0">
                            <div class="w-full h-full bg-white rounded-[9px] flex items-center justify-center font-bold text-orange-600 text-[10px]">
                                UAE
                            </div>
                        </div>
                        <div>
                            <h2 class="max-w-[170px] truncate text-xs font-bold text-slate-900 leading-tight">
                                {{ auth()->user()->tenant ? auth()->user()->tenant->company_name : 'SaaS Platform Admin' }}
                            </h2>
                            <div class="flex items-center space-x-2 rtl:space-x-reverse text-[10px] text-slate-500">
                                <span>{{ auth()->user()->getPrimaryRoleName() }}</span>
                                @if(auth()->user()->tenant && auth()->user()->tenant->subscription)
                                    <span class="px-1.5 py-0.2 rounded bg-orange-50 text-orange-600 font-medium">
                                        {{ auth()->user()->tenant->subscription->plan->name ?? 'Pro Plan' }}
                                    </span>
                                @endif
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Permission-scoped global ERP search -->
                <div class="govix-header-card govix-search-card hidden md:flex flex-1 max-w-md mx-6" x-data="{ searchOpen: false, query: '', results: [], loading: false, async search() { if (this.query.trim().length < 2) { this.results = []; return; } this.loading = true; try { const response = await fetch('{{ route('app.global_search') }}?q=' + encodeURIComponent(this.query), { headers: { 'Accept': 'application/json' } }); const data = await response.json(); this.results = data.results || []; } finally { this.loading = false; } } }">
                    <div class="relative w-full">
                        <div class="absolute inset-y-0 left-0 rtl:left-auto rtl:right-0 pl-3 rtl:pl-0 rtl:pr-3 flex items-center pointer-events-none text-slate-400">
                            <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"/></svg>
                        </div>
                        <input type="search" x-model="query" @input.debounce.300ms="searchOpen = true; search()" @focus="searchOpen = true; search()" @blur="setTimeout(() => searchOpen = false, 200)" placeholder="Search customer, mobile, application, invoice..." class="w-full pl-9 rtl:pl-3 rtl:pr-9 pr-3 py-1.5 bg-transparent border-0 rounded-xl text-xs text-slate-900 placeholder-slate-400 focus:outline-none focus:ring-0">

                        <div x-show="searchOpen" class="absolute top-full left-0 right-0 mt-3 p-3 bg-white rounded-xl shadow-xl border border-slate-200 text-xs z-50" x-cloak>
                            <div class="mb-2 flex items-center justify-between"><p class="font-semibold text-slate-500">Global ERP search</p><span x-show="loading" class="text-[9px] text-orange-500">Searching...</span></div>
                            <template x-for="result in results" :key="result.type + result.url"><a :href="result.url" class="flex items-center gap-3 rounded-lg px-2 py-2 hover:bg-orange-50"><span class="grid h-7 w-7 shrink-0 place-items-center rounded-lg bg-slate-100 text-[8px] font-bold text-slate-500" x-text="result.type.slice(0,2).toUpperCase()"></span><span class="min-w-0"><strong class="block truncate text-[10px] text-slate-800" x-text="result.title"></strong><small class="block truncate text-[8px] text-slate-400" x-text="result.subtitle"></small></span></a></template>
                            <div x-show="query.trim().length < 2" class="p-2 rounded bg-slate-50 text-slate-500">Type at least 2 characters to search customers, identities, applications, invoices and renewals.</div>
                            <div x-show="query.trim().length >= 2 && !loading && results.length === 0" class="p-2 rounded bg-slate-50 text-slate-500">No matching records in your permitted tenant scope.</div>
                        </div>
                    </div>
                </div>

                <div class="govix-header-card govix-date-card hidden xl:flex">
                    <span class="grid h-8 w-8 place-items-center rounded-lg bg-orange-50 text-orange-600">⌑</span>
                    <span>Today, {{ now()->format('d M Y') }}</span>
                </div>

                <!-- Right Top Navigation Items -->
                <div class="govix-header-card govix-actions-card flex items-center space-x-2 rtl:space-x-reverse">

                    <!-- Branch Switcher -->
                    @if(!auth()->user()->isPlatformUser())
                    <div class="relative" x-data="{ open: false }">
                        <button @click="open = !open" class="flex items-center space-x-1.5 rtl:space-x-reverse px-2.5 py-2 rounded-xl bg-slate-50 hover:bg-orange-50 text-xs font-semibold text-slate-700 transition-all">
                            <svg class="w-4 h-4 text-orange-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4"/></svg>
                            <span class="max-w-[120px] truncate">
                                @if(session('active_branch_id') === 'all')
                                    All Branches
                                @else
                                    {{ auth()->user()->defaultBranch ? auth()->user()->defaultBranch->name : 'Dubai Main Branch' }}
                                @endif
                            </span>
                            <svg class="w-3.5 h-3.5 text-slate-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/></svg>
                        </button>

                        <div x-show="open" @click.away="open = false" class="absolute right-0 rtl:right-auto rtl:left-0 mt-3 w-56 bg-white rounded-xl shadow-xl border border-slate-200 py-2 z-50" x-cloak>
                            <div class="px-3 py-1 text-[10px] font-bold text-slate-400 uppercase tracking-wider">Select Active Branch</div>
                            <form action="{{ route('app.switch_branch') }}" method="POST">
                                @csrf
                                @if(auth()->user()->canViewAllBranches())
                                <button type="submit" name="branch_id" value="all" class="w-full text-left rtl:text-right px-3 py-1.5 text-xs text-slate-700 hover:bg-emerald-50 font-semibold flex items-center justify-between">
                                    <span>All Branches</span>
                                    @if(session('active_branch_id') === 'all') <span class="text-sky-500">✓</span> @endif
                                </button>
                                @endif
                                @foreach(auth()->user()->accessibleBranches() as $branch)
                                    <button type="submit" name="branch_id" value="{{ $branch->id }}" class="w-full text-left rtl:text-right px-3 py-1.5 text-xs text-slate-700 hover:bg-emerald-50 flex items-center justify-between">
                                        <span class="truncate">{{ $branch->name }}</span>
                                        @if(session('active_branch_id') == $branch->id || (!session()->has('active_branch_id') && auth()->user()->default_branch_id == $branch->id)) <span class="text-sky-500">✓</span> @endif
                                    </button>
                                @endforeach
                            </form>
                        </div>
                    </div>
                    @endif

                    <!-- Quick Create Menu (+ New) -->
                    <div class="relative" x-data="{ open: false }">
                        <button @click="open = !open" class="govix-primary-action flex items-center space-x-1 rtl:space-x-reverse px-4 py-2.5 bg-orange-600 hover:bg-orange-700 text-white rounded-xl text-xs font-bold shadow-sm transition-all">
                            <span>{{ auth()->user()->isPlatformUser() ? '+ Create' : '+ New Application' }}</span>
                            <svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/></svg>
                        </button>
                        <div x-show="open" @click.away="open = false" class="absolute right-0 rtl:right-auto rtl:left-0 mt-3 w-56 bg-white rounded-xl shadow-xl border border-slate-200 py-2 z-50 text-xs" x-cloak>
                            @isPlatformUser
                                <a href="{{ route('platform.tenants.create') }}" class="block px-4 py-2 font-semibold text-slate-700 dark:text-slate-200 hover:bg-slate-100 dark:hover:bg-slate-700">+ New Tenant Wizard</a>
                                <a href="{{ route('platform.plans.create') }}" class="block px-4 py-2 text-slate-700 dark:text-slate-200 hover:bg-slate-100 dark:hover:bg-slate-700">+ New Plan</a>
                                <a href="{{ route('platform.billing.create_payment') }}" class="block px-4 py-2 text-slate-700 dark:text-slate-200 hover:bg-slate-100 dark:hover:bg-slate-700">+ Record Payment</a>
                            @else
                                @if(auth()->user()->hasPermission('applications.create'))
                                <a href="{{ route('app.applications.create') }}" class="block px-4 py-2 font-semibold text-slate-700 hover:bg-orange-50 hover:text-orange-600">+ New Application</a>
                                @endif
                                @if(auth()->user()->hasPermission('customers.create'))
                                <a href="{{ route('app.customers.create') }}" class="block px-4 py-2 text-slate-700 hover:bg-orange-50 hover:text-orange-600">+ Add Customer</a>
                                @endif
                                @if(auth()->user()->hasPermission('crm.manage'))
                                <a href="{{ route('app.crm') }}" class="block px-4 py-2 text-slate-700 hover:bg-orange-50 hover:text-orange-600">+ New CRM Lead</a>
                                @endif
                                @if(auth()->user()->hasPermission('appointments.manage'))
                                <a href="{{ route('app.queue.index') }}" class="block px-4 py-2 text-slate-700 hover:bg-orange-50 hover:text-orange-600">+ Book Appointment</a>
                                @endif
                                @if(auth()->user()->hasPermission('tasks.manage'))
                                <a href="{{ route('app.tasks.index') }}" class="block px-4 py-2 text-slate-700 hover:bg-orange-50 hover:text-orange-600">+ Assign Task</a>
                                @endif
                                @if(auth()->user()->hasPermission('employees.create'))
                                <a href="{{ route('app.employees.create') }}" class="block px-4 py-2 text-slate-700 hover:bg-emerald-50">+ New Employee</a>
                                <a href="{{ route('app.users.create') }}" class="block px-4 py-2 text-slate-700 hover:bg-emerald-50">+ New User Account</a>
                                @endif
                            @endisPlatformUser
                        </div>
                    </div>

                    @if(!auth()->user()->isPlatformUser())
                    @if(auth()->user()->hasPermission('tasks.view'))
                    @php($headerTaskCount = \App\Models\WorkflowTask::where('assigned_user_id', auth()->id())->whereIn('status', ['open', 'in_progress', 'waiting'])->count())
                    <a href="{{ route('app.tasks.index') }}" class="relative grid h-9 w-9 place-items-center rounded-xl border border-slate-200 bg-white text-slate-600 hover:border-emerald-200 hover:text-emerald-700" aria-label="Tasks and reminders" title="Tasks and reminders">
                        <svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 8l2 2 4-4"/></svg>
                        @if($headerTaskCount)<span class="absolute -right-1 -top-1 grid h-5 min-w-5 place-items-center rounded-full bg-violet-600 px-1 text-[9px] font-bold text-white">{{ $headerTaskCount }}</span>@endif
                    </a>
                    @endif
                    @php($headerNotifications = auth()->user()->unreadNotifications()->latest()->limit(6)->get())
                    <div class="relative" x-data="{ open: false }">
                        <button type="button" @click="open=!open" class="relative grid h-9 w-9 place-items-center rounded-xl border border-slate-200 bg-white text-slate-600 hover:border-emerald-200 hover:text-emerald-700" aria-label="Notifications">
                            <svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 17h5l-1.4-1.4A2 2 0 0118 14.2V11a6 6 0 10-12 0v3.2c0 .5-.2 1-.6 1.4L4 17h5m6 0a3 3 0 01-6 0h6z"/></svg>
                            @if($headerNotifications->isNotEmpty())<span class="absolute -right-1 -top-1 grid h-5 min-w-5 place-items-center rounded-full bg-emerald-600 px-1 text-[9px] font-bold text-white">{{ auth()->user()->unreadNotifications()->count() }}</span>@endif
                        </button>
                        <div x-show="open" x-cloak @click.away="open=false" class="absolute right-0 z-50 mt-3 w-80 overflow-hidden rounded-2xl border border-slate-200 bg-white shadow-xl">
                            <div class="flex items-center justify-between border-b border-slate-100 p-4"><div><strong class="text-sm text-slate-950">Notifications</strong><p class="text-[10px] text-slate-400">Workflow alerts requiring attention</p></div><a href="{{ route('app.notifications.index') }}" class="text-[10px] font-bold text-emerald-700">View all</a></div>
                            <div class="max-h-80 divide-y divide-slate-100 overflow-y-auto">
                                @forelse($headerNotifications as $notification)
                                <form method="POST" action="{{ route('app.notifications.read',$notification->id) }}" class="p-3 hover:bg-emerald-50">@csrf<button class="w-full text-left"><span class="text-[9px] font-bold uppercase text-emerald-700">{{ str($notification->data['category'] ?? 'system')->replace('_',' ') }}</span><strong class="mt-1 block text-xs text-slate-900">{{ $notification->data['title'] ?? 'Workflow alert' }}</strong><span class="mt-1 block line-clamp-2 text-[10px] text-slate-500">{{ $notification->data['message'] ?? '' }}</span></button></form>
                                @empty<div class="p-8 text-center text-xs text-slate-500">You are all caught up.</div>@endforelse
                            </div>
                            @if($headerNotifications->isNotEmpty())<form method="POST" action="{{ route('app.notifications.read_all') }}" class="border-t border-slate-100 p-3">@csrf<button class="w-full text-center text-[10px] font-bold text-slate-600">Mark all read</button></form>@endif
                        </div>
                    </div>
                    @endif

                    <!-- Language Switcher -->
                    <div class="hidden sm:flex items-center bg-slate-100 p-1 rounded-xl text-[10px] font-bold">
                        <form action="{{ route('app.switch_language', 'en') }}" method="POST">
                            @csrf
                            <button type="submit" class="px-2 py-1 rounded-lg {{ session('locale', 'en') === 'en' ? 'bg-white text-orange-600 shadow-sm' : 'text-slate-400' }}">EN</button>
                        </form>
                        <form action="{{ route('app.switch_language', 'ar') }}" method="POST">
                            @csrf
                            <button type="submit" class="px-2 py-1 rounded-lg {{ session('locale') === 'ar' ? 'bg-white text-orange-600 shadow-sm' : 'text-slate-400' }}">AR</button>
                        </form>
                    </div>

                    <!-- Profile Dropdown -->
                    <div class="relative" x-data="{ open: false }">
                        <button @click="open = !open" class="flex items-center space-x-2 rtl:space-x-reverse p-1 rounded-xl hover:bg-slate-100">
                            <div class="w-9 h-9 rounded-xl bg-slate-900 text-white flex items-center justify-center font-bold text-xs uppercase ring-2 ring-orange-100">
                                {{ substr(auth()->user()->name, 0, 2) }}
                            </div>
                            <span class="hidden 2xl:block min-w-0 text-left rtl:text-right">
                                <span class="block max-w-28 truncate text-[11px] font-bold text-slate-900">{{ auth()->user()->name }}</span>
                                <span class="block max-w-28 truncate text-[9px] text-slate-400">{{ auth()->user()->getPrimaryRoleName() }}</span>
                            </span>
                            <span class="hidden 2xl:block text-slate-400">⌄</span>
                        </button>
                        <div x-show="open" @click.away="open = false" class="absolute right-0 rtl:right-auto rtl:left-0 mt-3 w-56 bg-white rounded-2xl shadow-xl border border-slate-200 py-2 z-50 text-xs" x-cloak>
                            <div class="px-4 py-2 border-b border-slate-200 dark:border-slate-700">
                                <p class="font-bold text-slate-900 dark:text-white truncate">{{ auth()->user()->name }}</p>
                                <p class="text-slate-400 text-[11px] truncate">{{ auth()->user()->email }}</p>
                            </div>
                            <a href="{{ route('app.profile') }}" class="block px-4 py-2 text-slate-700 dark:text-slate-200 hover:bg-slate-100 dark:hover:bg-slate-700">My Profile & Security</a>
                            <form action="{{ route('logout') }}" method="POST">
                                @csrf
                                <button type="submit" class="w-full text-left rtl:text-right px-4 py-2 text-rose-600 font-semibold hover:bg-rose-50 dark:hover:bg-rose-950">
                                    Sign Out
                                </button>
                            </form>
                        </div>
                    </div>

                </div>
            </div>
        </header>

        <!-- Main Body Workspace -->
        <div class="govix-workspace flex-1 flex overflow-hidden">
            <div x-show="sidebarOpen" x-cloak x-transition.opacity @click="sidebarOpen = false" class="govix-mobile-overlay fixed inset-0 z-40 lg:hidden"></div>

            <!-- Sidebar Navigation -->
            <aside class="govix-sidebar bg-white border border-slate-200 flex-shrink-0 transition-all duration-200 z-20 flex flex-col justify-between"
                   :class="{ 'w-64': !sidebarCollapsed, 'w-20': sidebarCollapsed, 'hidden lg:flex': !sidebarOpen, 'fixed inset-y-0 left-0 rtl:left-auto rtl:right-0 w-64 shadow-2xl flex': sidebarOpen }">

                <div class="govix-sidebar-brand flex items-center justify-between gap-3 px-4">
                    <a href="{{ auth()->user()->isPlatformUser() ? route('platform.dashboard') : route('app.dashboard') }}" class="flex min-w-0 items-center gap-2.5">
                        <span class="govix-brand-symbol shrink-0"><span>B</span></span>
                        <span x-show="!sidebarCollapsed" class="min-w-0 leading-none">
                            <span class="block text-xl font-bold tracking-[-0.05em] text-slate-900">BRAND<span class="text-emerald-600">X</span></span>
                            <span class="mt-1 block whitespace-nowrap text-[6px] font-bold tracking-[0.2em] text-slate-400">UAE TYPING CENTER ERP</span>
                        </span>
                    </a>
                    <button type="button" @click="sidebarCollapsed = !sidebarCollapsed" x-show="!sidebarCollapsed" class="hidden lg:grid h-8 w-8 shrink-0 place-items-center rounded-lg border border-slate-200 bg-white text-slate-400 shadow-sm hover:border-orange-200 hover:text-orange-600" aria-label="Collapse sidebar">‹</button>
                    <button type="button" @click="sidebarOpen = false" class="grid h-8 w-8 shrink-0 place-items-center rounded-lg border border-slate-200 text-slate-500 lg:hidden" aria-label="Close sidebar">×</button>
                </div>

                <div class="govix-sidebar-scroll p-3 overflow-y-auto space-y-5">

                    <!-- Platform Super Admin Navigation Menu (Requirement 2 & 99) -->
                    @isPlatformUser
                    <div>
                        <div class="text-[10px] font-extrabold text-slate-400 uppercase tracking-wider px-3 mb-2" x-show="!sidebarCollapsed">Super Admin Control Center</div>
                        <nav class="space-y-1">
                            <a href="{{ route('platform.dashboard') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('platform.dashboard') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="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"/></svg>
                                <span x-show="!sidebarCollapsed">Dashboard</span>
                            </a>

                            <a href="{{ route('platform.tenants') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('platform.tenants*') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4"/></svg>
                                <span x-show="!sidebarCollapsed">Tenants Directory</span>
                            </a>

                            <a href="{{ route('platform.plans') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('platform.plans*') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>
                                <span x-show="!sidebarCollapsed">Plans & Pricing</span>
                            </a>

                            <a href="{{ route('platform.billing.invoices') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('platform.billing*') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 7h6m0 10v-3m-3 3h.01M9 17h.01M9 14h.01M12 14h.01M15 11h.01M12 11h.01M9 11h.01M7 21h10a2 2 0 002-2V5a2 2 0 00-2-2H7a2 2 0 00-2 2v14a2 2 0 002 2z"/></svg>
                                <span x-show="!sidebarCollapsed">SaaS Billing & Invoices</span>
                            </a>

                            <a href="{{ route('platform.usage') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('platform.usage*') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="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"/></svg>
                                <span x-show="!sidebarCollapsed">Usage & Credit Wallets</span>
                            </a>

                            <a href="{{ route('platform.support') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('platform.support*') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M18.364 5.636l-3.536 3.536m0 5.656l3.536 3.536M9.172 9.172L5.636 5.636m3.536 9.192l-3.536 3.536M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-5 0a4 4 0 11-8 0 4 4 0 018 0z"/></svg>
                                <span x-show="!sidebarCollapsed">Support Desk</span>
                            </a>

                            <a href="{{ route('platform.communications') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('platform.communications*') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5.882V19.24a1.76 1.76 0 01-3.417.592l-2.147-6.15M18 13a3 3 0 100-6M5.436 13.683A4.001 4.001 0 017 6h1.832c.41 0 .824-.132 1.157-.378l2.673-1.977a1.6 1.6 0 012.338 1.355v13.999a1.6 1.6 0 01-2.338 1.355l-2.673-1.977A1.996 1.996 0 008.832 16H7c-.943 0-1.815-.407-2.436-1.077z"/></svg>
                                <span x-show="!sidebarCollapsed">Communications</span>
                            </a>

                            <a href="{{ route('platform.security') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('platform.security*') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"/></svg>
                                <span x-show="!sidebarCollapsed">Security & Audit</span>
                            </a>

                            <a href="{{ route('platform.reports') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('platform.reports*') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 8v8m-4-5v5m-4-2v2m-2 4h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"/></svg>
                                <span x-show="!sidebarCollapsed">Analytics & Reports</span>
                            </a>

                            @if(auth()->user()->isPlatformSuperAdmin())
                            <a href="{{ route('platform.landing.edit') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('platform.landing.*') ? 'bg-orange-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-orange-50 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 5a2 2 0 012-2h12a2 2 0 012 2v14a2 2 0 01-2 2H6a2 2 0 01-2-2V5zm0 4h16M8 13h3m-3 4h8"/></svg>
                                <span x-show="!sidebarCollapsed">Landing Page CMS</span>
                            </a>
                            @endif

                            <a href="{{ route('platform.settings') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('platform.settings*') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="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"/><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"/></svg>
                                <span x-show="!sidebarCollapsed">Platform Settings</span>
                            </a>
                        </nav>
                    </div>
                    @endisPlatformUser

                    <!-- Tenant ERP Navigation Menu -->
                    @if(!auth()->user()->isPlatformUser())
                    @if(auth()->user()->hasRole('typist'))
                        @include('layouts.partials.typist-sidebar')
                    @else
                    <div>
                        <div class="text-[10px] font-extrabold text-slate-400 uppercase tracking-wider px-3 mb-2" x-show="!sidebarCollapsed">Operations Workspace</div>
                        <nav class="space-y-1">
                            <a href="{{ route('app.dashboard') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('app.dashboard') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2V6zM14 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V6zM4 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2v-2zM14 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z"/></svg>
                                <span x-show="!sidebarCollapsed">Owner Overview</span>
                            </a>

                            @canModule('customers.view')
                            <a href="{{ route('app.customers.index') }}" class="govix-module-link {{ request()->routeIs('app.customers.index', 'app.customers.show', 'app.customers.create') ? 'is-active' : '' }}"><span class="govix-nav-dot">CU</span><span x-show="!sidebarCollapsed">Customer 360</span></a>
                            <a href="{{ route('app.customers.families.index') }}" class="govix-module-link {{ request()->routeIs('app.customers.families.*') ? 'is-active' : '' }}"><span class="govix-nav-dot">FA</span><span x-show="!sidebarCollapsed">Families & Dependents</span></a>
                            <a href="{{ route('app.corporate.companies.index') }}" class="govix-module-link {{ request()->routeIs('app.corporate.*') ? 'is-active' : '' }}"><span class="govix-nav-dot">CO</span><span x-show="!sidebarCollapsed">Corporate Clients</span></a>
                            @endcanModule

                            @canModule('applications.view')
                            <a href="{{ route('app.applications.index') }}" class="govix-module-link {{ request()->routeIs('app.applications.*') ? 'is-active' : '' }}"><span class="govix-nav-dot">AP</span><span x-show="!sidebarCollapsed">Applications</span></a>
                            @endcanModule

                            @canModule('documents.view')
                            <a href="{{ route('app.customers.documents.index') }}" class="govix-module-link {{ request()->routeIs('app.customers.documents.*') ? 'is-active' : '' }}"><span class="govix-nav-dot">DO</span><span x-show="!sidebarCollapsed">Secure Documents</span></a>
                            @endcanModule

                            @canModule('dashboard.view')
                            <a href="{{ route('app.front_desk') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('app.front_desk') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"/></svg>
                                <span x-show="!sidebarCollapsed">Front Desk Reception</span>
                            </a>
                            @endcanModule

                            @canModule('applications.view')
                            <a href="{{ route('app.work_queue') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('app.work_queue') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4"/></svg>
                                <span x-show="!sidebarCollapsed">Typist Work Queue</span>
                            </a>
                            <a href="{{ route('app.processing') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('app.processing') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"/></svg>
                                <span x-show="!sidebarCollapsed">Supervisor Processing</span>
                            </a>
                            <a href="{{ route('app.pro') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('app.pro') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 13.255A23.931 23.931 0 0112 15c-3.183 0-6.22-.62-9-1.745M16 6V4a2 2 0 00-2-2h-4a2 2 0 00-2 2v2m4 6h.01M5 20h14a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/></svg>
                                <span x-show="!sidebarCollapsed">PRO Services</span>
                            </a>
                            @endcanModule

                            @canModule('payments.view')
                            <a href="{{ route('app.cashier') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('app.cashier') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 9V7a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2m2 4h10a2 2 0 002-2v-6a2 2 0 00-2-2H9a2 2 0 00-2 2v6a2 2 0 002 2zm7-5a2 2 0 11-4 0 2 2 0 014 0z"/></svg>
                                <span x-show="!sidebarCollapsed">Cashier & Counter</span>
                            </a>
                            @endcanModule

                            @canModule('invoices.view')
                            <a href="{{ route('app.accounting') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('app.accounting') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>
                                <span x-show="!sidebarCollapsed">Finance & Accounting</span>
                            </a>
                            @endcanModule

                            @canModule('renewals.view')
                            <a href="{{ route('app.renewals') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('app.renewals') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"/></svg>
                                <span x-show="!sidebarCollapsed">Renewal Center</span>
                            </a>
                            @endcanModule

                            @canModule('employees.view')
                            <a href="{{ route('app.employees.index') }}" class="govix-module-link {{ request()->routeIs('app.employees.*') ? 'is-active' : '' }}"><span class="govix-nav-dot">HR</span><span x-show="!sidebarCollapsed">Employees</span></a>
                            @endcanModule
                            @canModule('attendance.view')<a href="{{ route('app.attendance.index') }}" class="govix-module-link {{ request()->routeIs('app.attendance.*') ? 'is-active' : '' }}"><span class="govix-nav-dot">AT</span><span x-show="!sidebarCollapsed">Attendance</span></a>@endcanModule
                            @canModule('shifts.view')<a href="{{ route('app.shifts.index') }}" class="govix-module-link {{ request()->routeIs('app.shifts.*') ? 'is-active' : '' }}"><span class="govix-nav-dot">SH</span><span x-show="!sidebarCollapsed">Shifts</span></a>@endcanModule
                            @canModule('leave.view')<a href="{{ route('app.leave.index') }}" class="govix-module-link {{ request()->routeIs('app.leave.*') ? 'is-active' : '' }}"><span class="govix-nav-dot">LV</span><span x-show="!sidebarCollapsed">Leave</span></a>@endcanModule
                            @canModule('payroll.view')<a href="{{ route('app.payroll.index') }}" class="govix-module-link {{ request()->routeIs('app.payroll.*') ? 'is-active' : '' }}"><span class="govix-nav-dot">PR</span><span x-show="!sidebarCollapsed">Payroll & WPS</span></a>@endcanModule
                            @canModule('gratuity.view')<a href="{{ route('app.gratuity.index') }}" class="govix-module-link {{ request()->routeIs('app.gratuity.*') ? 'is-active' : '' }}"><span class="govix-nav-dot">GS</span><span x-show="!sidebarCollapsed">Gratuity</span></a>@endcanModule

                            @canModule('audit.view')
                            <a href="{{ route('app.audit') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('app.audit') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/></svg>
                                <span x-show="!sidebarCollapsed">Audit Logs</span>
                            </a>
                            @endcanModule
                        </nav>
                    </div>

                    <div>
                        <div class="text-[10px] font-extrabold text-slate-400 uppercase tracking-wider px-3 mb-2" x-show="!sidebarCollapsed">Advanced Operations</div>
                        <nav class="space-y-1">
                            @canModule('settings.view')
                            <a href="{{ route('app.services.dashboard') }}" class="govix-module-link {{ request()->routeIs('app.services.*') ? 'is-active' : '' }}"><span class="govix-nav-dot">SE</span><span x-show="!sidebarCollapsed">Service Engine</span></a>
                            @endcanModule
                            @canModule('queue.view')
                            <a href="{{ route('app.queue.index') }}" class="govix-module-link {{ request()->routeIs('app.queue.*', 'app.appointments.*') ? 'is-active' : '' }}"><span class="govix-nav-dot">Q</span><span x-show="!sidebarCollapsed">Queue & Appointments</span></a>
                            @endcanModule
                            @canModule('crm.view')
                            <a href="{{ route('app.crm') }}" class="govix-module-link {{ request()->routeIs('app.crm*') ? 'is-active' : '' }}"><span class="govix-nav-dot">CRM</span><span x-show="!sidebarCollapsed">CRM Pipeline</span></a>
                            @endcanModule
                            @canModule('communications.view')
                            <a href="{{ route('app.communications.index') }}" class="govix-module-link {{ request()->routeIs('app.communications.*') ? 'is-active' : '' }}"><span class="govix-nav-dot">CM</span><span x-show="!sidebarCollapsed">Communication Center</span></a>
                            @endcanModule
                            @canModule('tasks.view')
                            <a href="{{ route('app.tasks.index') }}" class="govix-module-link {{ request()->routeIs('app.tasks.*', 'app.approvals.*') ? 'is-active' : '' }}"><span class="govix-nav-dot">TK</span><span x-show="!sidebarCollapsed">Tasks & Approvals</span></a>
                            @endcanModule
                            @canModule('reports.view')
                            <a href="{{ route('app.reports.index') }}" class="govix-module-link {{ request()->routeIs('app.reports.*') ? 'is-active' : '' }}"><span class="govix-nav-dot">BI</span><span x-show="!sidebarCollapsed">Reports & Analytics</span></a>
                            @endcanModule
                        </nav>
                    </div>

                    <!-- Administration Section -->
                    @canModule('roles.view')
                    <div>
                        <div class="text-[10px] font-extrabold text-slate-400 uppercase tracking-wider px-3 mb-2" x-show="!sidebarCollapsed">Administration</div>
                        <nav class="space-y-1">
                            <a href="{{ route('app.users.index') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('app.users.*') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"/></svg>
                                <span x-show="!sidebarCollapsed">User Accounts</span>
                            </a>

                            <a href="{{ route('app.roles.index') }}" class="flex items-center space-x-3 rtl:space-x-reverse px-3 py-2 rounded-xl text-xs font-semibold {{ request()->routeIs('app.roles.*') ? 'bg-sky-600 text-white shadow-md' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700' }}">
                                <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"/></svg>
                                <span x-show="!sidebarCollapsed">Roles & Matrix</span>
                            </a>

                            @canModule('settings.view')
                            <a href="{{ route('app.settings.index') }}" class="govix-module-link {{ request()->routeIs('app.settings.*') ? 'is-active' : '' }}"><span class="govix-nav-dot">ST</span><span x-show="!sidebarCollapsed">ERP Settings</span></a>
                            @endcanModule
                        </nav>
                    </div>
                    @endcanModule

                    @endif
                    @endif

                </div>

                <!-- Sidebar Footer Status -->
                <div class="govix-sidebar-footer p-3 border border-slate-200" x-show="!sidebarCollapsed">
                    <div class="flex items-start gap-3">
                        <span class="grid h-8 w-8 shrink-0 place-items-center rounded-lg bg-orange-50 text-orange-600">✦</span>
                        <div class="min-w-0">
                            <p class="truncate text-[11px] font-bold text-slate-800">{{ auth()->user()->getPrimaryRoleName() }}</p>
                            <p class="mt-1 truncate text-[9px] text-slate-400">{{ auth()->user()->tenant?->subscription?->plan?->name ?? 'BrandX Enterprise' }}</p>
                        </div>
                        <span class="ml-auto mt-1 h-2 w-2 shrink-0 rounded-full bg-emerald-500"></span>
                    </div>
                </div>
            </aside>

            <!-- Main Content Area -->
            <main class="govix-main flex-1 overflow-y-auto p-4 sm:p-6 lg:p-8">
                @if(session('status'))
                    <div class="mb-6 p-4 rounded-2xl bg-emerald-50 dark:bg-emerald-950/60 border border-emerald-200 dark:border-emerald-800 text-emerald-800 dark:text-emerald-200 text-sm font-semibold flex items-center space-x-3 rtl:space-x-reverse">
                        <svg class="w-5 h-5 text-emerald-500 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>
                        <span>{{ session('status') }}</span>
                    </div>
                @endif

                @if($errors->any())
                    <div class="mb-6 p-4 rounded-2xl bg-rose-50 dark:bg-rose-950/60 border border-rose-200 dark:border-rose-800 text-rose-800 dark:text-rose-200 text-sm font-semibold space-y-1">
                        @foreach($errors->all() as $error)
                            <p class="flex items-center space-x-2 rtl:space-x-reverse">
                                <svg class="w-4 h-4 text-rose-500 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>
                                <span>{{ $error }}</span>
                            </p>
                        @endforeach
                    </div>
                @endif

                @yield('content')
            </main>
        </div>
    </div>

</body>
</html>
