From 9c76a68f64d93ac03d91b4c0db46475aa6798aab Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Fri, 30 Jan 2026 15:15:36 +0000
Subject: [PATCH] fix: Move sidebar outside z-30 container to fix navigation
 links

The sidebar links stopped working after navigating to Dashboard because
the sidebar was inside a z-30 stacking context container. Dashboard's
fixed inset-0 elements were interfering with click events due to the
nested stacking context hierarchy.

Fix: Move both desktop and mobile sidebar outside the z-30 container
so they're at the root stacking context level (like the header at z-50).
This ensures the sidebar's z-[45] is compared directly against other
root-level elements, making links always clickable.

https://claude.ai/code/session_01DQc3H42fPsRJbzRminACDF
---
 src/components/AppLayout.tsx | 36 ++++++++++++++++++------------------
 1 file changed, 18 insertions(+), 18 deletions(-)

diff --git a/src/components/AppLayout.tsx b/src/components/AppLayout.tsx
index 52c6e9056..9e9d4be56 100644
--- a/src/components/AppLayout.tsx
+++ b/src/components/AppLayout.tsx
@@ -233,26 +233,26 @@ export default function AppLayout({ children }: AppLayoutProps) {
         </div>
       </header>
 
-      {/* Layout with Sidebar */}
-      <div className="flex w-full flex-1 relative z-30 pt-16 overflow-x-hidden">
-        {/* Sidebar Desktop fixo - pointer-events-auto garante que cliques nos links funcionem */}
-        <div className="hidden md:block fixed left-0 top-16 h-[calc(100vh-4rem)] z-[45] pointer-events-auto">
-          <AppSidebar
-            isOpen={sidebarOpen}
-            onClose={() => setSidebarOpen(false)}
-            collapsed={sidebarCollapsed}
-          />
-        </div>
+      {/* Sidebar Desktop fixo - FORA do container z-30 para garantir stacking context correto */}
+      <div className="hidden md:block fixed left-0 top-16 h-[calc(100vh-4rem)] z-[45] pointer-events-auto">
+        <AppSidebar
+          isOpen={sidebarOpen}
+          onClose={() => setSidebarOpen(false)}
+          collapsed={sidebarCollapsed}
+        />
+      </div>
 
-        {/* Sidebar Mobile overlay */}
-        <div className="md:hidden">
-          <AppSidebar
-            isOpen={sidebarOpen}
-            onClose={() => setSidebarOpen(false)}
-            collapsed={false}
-          />
-        </div>
+      {/* Sidebar Mobile overlay - também fora do z-30 */}
+      <div className="md:hidden">
+        <AppSidebar
+          isOpen={sidebarOpen}
+          onClose={() => setSidebarOpen(false)}
+          collapsed={false}
+        />
+      </div>
 
+      {/* Layout with Main Content */}
+      <div className="flex w-full flex-1 relative z-30 pt-16 overflow-x-hidden">
         <main
           id="main-content"
           className={`flex-1 min-h-[calc(100vh-4rem)] overflow-y-auto overflow-x-hidden relative z-20 transition-all duration-300 ${!isMobile && !sidebarCollapsed ? 'md:ml-64' : !isMobile && sidebarCollapsed ? 'md:ml-16' : ''