@php
    // Get theme from user session or default to BLUE (REVAYAH Logo)
    $theme = session('revayah_theme', 'blue');
@endphp

<div x-data="{
    sidebarOpen: true,
    sidebarCollapsed: localStorage.getItem('sidebarCollapsed') === 'true',
    theme: '{{ $theme }}',
    tooltip: { show: false, label: '', y: 0 },
    showTooltip(label, el) {
        if (!this.sidebarCollapsed) return;
        const r = el.getBoundingClientRect();
        this.tooltip = { show: true, label, y: r.top + r.height / 2 };
    },
    hideTooltip() { this.tooltip.show = false; }
}"
x-init="
    theme = localStorage.getItem('revayah_theme') || 'blue';
    document.documentElement.setAttribute('data-theme', theme);
    $dispatch('sidebar-toggle', { collapsed: sidebarCollapsed });
"
@sidebar-toggle.window="sidebarCollapsed = $event.detail.collapsed"
class="h-full">

    <!-- Tooltip Portal — renderizado no body, acima de tudo -->
    <template x-teleport="body">
        <div x-show="tooltip.show"
             x-transition:enter="transition ease-out duration-150"
             x-transition:enter-start="opacity-0 translate-x-[-6px]"
             x-transition:enter-end="opacity-100 translate-x-0"
             x-transition:leave="transition ease-in duration-100"
             x-transition:leave-start="opacity-100 translate-x-0"
             x-transition:leave-end="opacity-0 translate-x-[-6px]"
             :style="`position:fixed; left:88px; top:${tooltip.y}px; transform:translateY(-50%); z-index:9999;`"
             class="pointer-events-none flex items-center gap-0">
            <!-- Seta -->
            <div class="w-0 h-0 border-y-[6px] border-y-transparent border-r-[7px] theme-tooltip-arrow"></div>
            <!-- Label -->
            <div class="theme-gradient-header px-3 py-2 rounded-lg shadow-xl text-sm font-semibold text-white whitespace-nowrap ring-1 ring-white/20">
                <span x-text="tooltip.label"></span>
            </div>
        </div>
    </template>

    <!-- Modern Sidebar - Dynamic Theme -->
    <aside :class="sidebarCollapsed ? 'w-20' : 'w-64'"
           class="fixed left-0 top-0 h-full theme-sidebar text-white transition-all duration-300 ease-in-out z-50 shadow-2xl flex flex-col">

        <!-- Logo Area -->
        <div x-show="!sidebarCollapsed" x-transition class="p-4 border-b border-white/15 dark:border-gray-800">
            <div class="flex items-center justify-between">
                <a href="{{route('home')}}" wire:navigate class="flex items-center space-x-3">
                    <div class="relative bg-white rounded-xl p-1 shadow-sm ring-1 ring-white/30">
                        <img src="{{asset('assets/images/logo-icone.png')}}" alt="REVAYAH"
                             class="h-12 w-12 rounded-lg">
                        <div class="absolute inset-0 rounded-xl bg-white/5 mix-blend-screen"></div>
                    </div>
                    <div x-show="!sidebarCollapsed" x-transition class="flex flex-col">
                        <span class="font-bold text-lg text-white drop-shadow">REVAYAH</span>
                        <span class="text-xs text-white/80">Gestão Secretaria</span>
                    </div>
                </a>
                <button @click="sidebarCollapsed = !sidebarCollapsed; localStorage.setItem('sidebarCollapsed', sidebarCollapsed); $dispatch('sidebar-toggle', { collapsed: sidebarCollapsed })"
                        class="p-2 rounded-lg bg-white/10 hover:bg-white/20 transition-colors">
                    <svg class="w-5 h-5 text-white" 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>
            </div>
        </div>

        <!-- Navigation Menu -->
        <nav class="flex-1 overflow-y-auto custom-scrollbar py-6 px-3 space-y-1 text-white/90">

            <!-- Collapsed Toggle -->
            <div x-show="sidebarCollapsed" x-transition class="flex items-center justify-center pb-2">
                <button @click="sidebarCollapsed = !sidebarCollapsed; localStorage.setItem('sidebarCollapsed', sidebarCollapsed); $dispatch('sidebar-toggle', { collapsed: sidebarCollapsed })"
                        class="p-2 rounded-lg bg-white/10 hover:bg-white/20 transition-colors"
                        title="Expandir menu">
                    <svg class="w-5 h-5 text-white" 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>
            </div>

            <!-- Dashboard -->
            <a href="{{route('secretaria')}}" wire:navigate
               @mouseenter="showTooltip('Dashboard', $el)"
               @mouseleave="hideTooltip()"
               class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                      {{ request()->routeIs('secretaria') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                <svg class="w-6 h-6 flex-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" x-transition class="font-medium">Dashboard</span>
            </a>

            <!-- Divisor -->
            <div x-show="!sidebarCollapsed" x-transition class="px-3 pt-4 pb-2">
                <p class="text-xs font-semibold text-white/60 uppercase tracking-wider">Gestão</p>
            </div>

            <!-- Alunos -->
            <a href="{{route('secretaria-alunos')}}" wire:navigate
               @mouseenter="showTooltip('Alunos', $el)"
               @mouseleave="hideTooltip()"
               class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                      {{ request()->routeIs('secretaria-alunos') || request()->routeIs('secretaria-alunos-uuid') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                <svg class="w-6 h-6 flex-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" x-transition class="font-medium">Alunos</span>
            </a>

            <!-- Cursos -->
            <a href="{{route('secretaria-curso')}}" wire:navigate
               @mouseenter="showTooltip('Cursos', $el)"
               @mouseleave="hideTooltip()"
               class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                      {{ request()->routeIs('secretaria-curso') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                <svg class="w-6 h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"/>
                </svg>
                <span x-show="!sidebarCollapsed" x-transition class="font-medium">Cursos</span>
            </a>

            <!-- Turmas -->
            <a href="{{route('secretaria-turma')}}" wire:navigate
               @mouseenter="showTooltip('Turmas', $el)"
               @mouseleave="hideTooltip()"
               class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                      {{ request()->routeIs('secretaria-turma') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                <svg class="w-6 h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197M13 7a4 4 0 11-8 0 4 4 0 018 0z"/>
                </svg>
                <span x-show="!sidebarCollapsed" x-transition class="font-medium">Turmas</span>
            </a>

            <!-- Matrículas -->
            <a href="{{route('secretaria-matricula')}}" wire:navigate
               @mouseenter="showTooltip('Matrículas', $el)"
               @mouseleave="hideTooltip()"
               class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                      {{ request()->routeIs('secretaria-matricula') || request()->routeIs('secretaria-matricula-uuid') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                <svg class="w-6 h-6 flex-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" x-transition class="font-medium">Matrículas</span>
            </a>

            <!-- Avisos -->
            <a href="{{route('secretaria.avisos')}}" wire:navigate
               @mouseenter="showTooltip('Avisos', $el)"
               @mouseleave="hideTooltip()"
               class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                      {{ request()->routeIs('secretaria.avisos*') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                <svg class="w-6 h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9"/>
                </svg>
                <span x-show="!sidebarCollapsed" x-transition class="font-medium">Avisos</span>
            </a>

            <!-- Divisor -->
            <div x-show="!sidebarCollapsed" x-transition class="px-3 pt-4 pb-2">
                <p class="text-xs font-semibold text-white/60 uppercase tracking-wider">Financeiro</p>
            </div>

            <!-- Financeiro -->
            <a href="{{route('secretaria-financeiro')}}" wire:navigate
               @mouseenter="showTooltip('Financeiro', $el)"
               @mouseleave="hideTooltip()"
               class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                      {{ request()->routeIs('secretaria-financeiro') || request()->routeIs('secretaria-financeiro-uuid') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                <svg class="w-6 h-6 flex-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" x-transition class="font-medium">Financeiro</span>
            </a>

            <!-- Notificações Financeiras -->
            <a href="{{route('secretaria-financeiro-notifica')}}" wire:navigate
               @mouseenter="showTooltip('Notificações', $el)"
               @mouseleave="hideTooltip()"
               class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                      {{ request()->routeIs('secretaria-financeiro-notifica') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                <svg class="w-6 h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/>
                </svg>
                <span x-show="!sidebarCollapsed" x-transition class="font-medium text-sm">Notificações</span>
            </a>

            <!-- Relatórios -->
            <a href="{{route('secretaria-financeiro-relatorios')}}" wire:navigate
               @mouseenter="showTooltip('Relatórios', $el)"
               @mouseleave="hideTooltip()"
               class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                      {{ request()->routeIs('secretaria-financeiro-relatorios') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                <svg class="w-6 h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 17v-2m3 2v-4m3 4v-6m2 10H7a2 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" x-transition class="font-medium">Relatórios</span>
            </a>

            <!-- Pacotes -->
            <a href="{{route('secretaria-financeiro-pacotes')}}" wire:navigate
               @mouseenter="showTooltip('Pacotes', $el)"
               @mouseleave="hideTooltip()"
               class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                      {{ request()->routeIs('secretaria-financeiro-pacotes') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                <svg class="w-6 h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 7l-8-4-8 4m16 0l-8 4m8-4v10l-8 4m0-10L4 7m8 4v10M4 7v10l8 4"/>
                </svg>
                <span x-show="!sidebarCollapsed" x-transition class="font-medium">Pacotes</span>
            </a>

            <!-- Cupons (Admin Only) -->
            @if (isAdmin())
                <a href="{{route('secretaria-financeiro-cupons')}}" wire:navigate
                   @mouseenter="showTooltip('Cupons', $el)"
                   @mouseleave="hideTooltip()"
                   class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                          {{ request()->routeIs('secretaria-financeiro-cupons') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                    <svg class="w-6 h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 5v2m0 4v2m0 4v2M5 5a2 2 0 00-2 2v3a2 2 0 110 4v3a2 2 0 002 2h14a2 2 0 002-2v-3a2 2 0 110-4V7a2 2 0 00-2-2H5z"/>
                    </svg>
                    <span x-show="!sidebarCollapsed" x-transition class="font-medium">Cupons</span>
                </a>
            @endif

            @if (isAdminPep())
                <!-- Divisor -->
                <div x-show="!sidebarCollapsed" x-transition class="px-3 pt-4 pb-2">
                    <p class="text-xs font-semibold text-white/60 uppercase tracking-wider"><span class="font-light">Admin</span> Ambiente AVA</p>
                </div>

                <!-- AVA - Dashboard -->
                <a href="{{route('secretaria-ava-dashboard')}}" wire:navigate
                   @mouseenter="showTooltip('Dashboard AVA', $el)"
                   @mouseleave="hideTooltip()"
                   class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                          {{ request()->routeIs('secretaria-ava-dashboard') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                    <svg class="w-6 h-6 flex-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" x-transition class="font-medium">Dashboard AVA</span>
                </a>

                <!-- AVA - Cursos -->
                <a href="{{route('secretaria-ava-cursos')}}" wire:navigate
                   @mouseenter="showTooltip('Cursos AVA', $el)"
                   @mouseleave="hideTooltip()"
                   class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                          {{ request()->routeIs('secretaria-ava-cursos') || request()->routeIs('secretaria-ava-curso-show') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                    <svg class="w-6 h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"/>
                    </svg>
                    <span x-show="!sidebarCollapsed" x-transition class="font-medium">Cursos AVA</span>
                </a>

                <!-- AVA - Alunos -->
                <a href="{{route('secretaria-ava-alunos')}}" wire:navigate
                   @mouseenter="showTooltip('Alunos AVA', $el)"
                   @mouseleave="hideTooltip()"
                   class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                          {{ request()->routeIs('secretaria-ava-alunos') || request()->routeIs('secretaria-ava-aluno-show') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                    <svg class="w-6 h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197M13 7a4 4 0 11-8 0 4 4 0 018 0z"/>
                    </svg>
                    <span x-show="!sidebarCollapsed" x-transition class="font-medium">Alunos AVA</span>
                </a>

                <!-- AVA - Relatórios -->
                <a href="{{route('secretaria-ava-relatorios')}}" wire:navigate
                   @mouseenter="showTooltip('Relatórios AVA', $el)"
                   @mouseleave="hideTooltip()"
                   class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                          {{ request()->routeIs('secretaria-ava-relatorios') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                    <svg class="w-6 h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 17v-2m3 2v-4m3 4v-6m2 10H7a2 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" x-transition class="font-medium">Relatórios AVA</span>
                </a>

                <!-- AVA - Sincronizar Cursos -->
                <a href="{{route('secretaria-ava-sincronizar-cursos')}}" wire:navigate
                   @mouseenter="showTooltip('Sincronizar Cursos', $el)"
                   @mouseleave="hideTooltip()"
                   class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                          {{ request()->routeIs('secretaria-ava-sincronizar-cursos') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                    <svg class="w-6 h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"/>
                    </svg>
                    <span x-show="!sidebarCollapsed" x-transition class="font-medium">Sincronizar Cursos</span>
                </a>

                <a href="{{route('secretaria-ava-sincronizar-cursos-exibir')}}" wire:navigate
                   @mouseenter="showTooltip('Visualizar & Mapear', $el)"
                   @mouseleave="hideTooltip()"
                   class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                          {{ request()->routeIs('secretaria-ava-sincronizar-cursos-exibir') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                    <svg class="w-6 h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"/>
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z"/>
                    </svg>
                    <span x-show="!sidebarCollapsed" x-transition class="font-medium">Visualizar & Mapear</span>
                </a>

                <!-- Divisor -->
                <div x-show="!sidebarCollapsed" x-transition class="px-3 pt-4 pb-2">
                    <p class="text-xs font-semibold text-white/60 uppercase tracking-wider"><span class="font-light">Admin</span> Sistema</p>
                </div>

                <a href="{{ route('secretaria-usuarios') }}" wire:navigate
                   @mouseenter="showTooltip('Usuários', $el)"
                   @mouseleave="hideTooltip()"
                   class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                          {{ request()->routeIs('secretaria-usuarios') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                    <svg class="w-6 h-6 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197M13 7a4 4 0 11-8 0 4 4 0 018 0z"/>
                    </svg>
                    <span x-show="!sidebarCollapsed" x-transition class="font-medium">Usuários</span>
                </a>

                <a href="{{ route('secretaria-configuracoes') }}" wire:navigate
                   @mouseenter="showTooltip('Configurações', $el)"
                   @mouseleave="hideTooltip()"
                   class="flex items-center space-x-3 px-3 py-3 rounded-lg transition-all duration-200
                          {{ request()->routeIs('secretaria-configuracoes') ? 'theme-active' : 'text-white/90 hover:text-white hover:bg-white/10' }}">
                    <svg class="w-6 h-6 flex-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" x-transition class="font-medium">Configurações</span>
                </a>
            @endif

        </nav>

    </aside>
</div>