From e85e7140763451a784f37608229662f27c25580a Mon Sep 17 00:00:00 2001
From: 0xjjjjjj <0xjjjjjj@users.noreply.github.com>
Date: Sat, 7 Mar 2026 18:51:53 -0800
Subject: [PATCH] fix: bump mobile sidebar z-index above sticky page headers

Sidebar and backdrop were z-30, same as sticky page headers (live feed,
boards, etc.), causing the hamburger menu to render behind page content.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 frontend/src/components/organisms/DashboardSidebar.tsx | 2 +-
 frontend/src/components/templates/DashboardShell.tsx   | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/organisms/DashboardSidebar.tsx b/frontend/src/components/organisms/DashboardSidebar.tsx
index ace1900e..6f616e86 100644
--- a/frontend/src/components/organisms/DashboardSidebar.tsx
+++ b/frontend/src/components/organisms/DashboardSidebar.tsx
@@ -58,7 +58,7 @@ export function DashboardSidebar() {
         : "System degraded";
 
   return (
-    <aside className="fixed inset-y-0 left-0 z-30 flex w-[280px] -translate-x-full flex-col border-r border-slate-200 bg-white pt-16 shadow-lg transition-transform duration-200 ease-in-out [[data-sidebar=open]_&]:translate-x-0 md:relative md:inset-auto md:z-auto md:w-64 md:translate-x-0 md:pt-0 md:shadow-none md:transition-none">
+    <aside className="fixed inset-y-0 left-0 z-40 flex w-[280px] -translate-x-full flex-col border-r border-slate-200 bg-white pt-16 shadow-lg transition-transform duration-200 ease-in-out [[data-sidebar=open]_&]:translate-x-0 md:relative md:inset-auto md:z-auto md:w-64 md:translate-x-0 md:pt-0 md:shadow-none md:transition-none">
       <div className="flex-1 px-3 py-4">
         <p className="px-3 text-xs font-semibold uppercase tracking-wider text-slate-500">
           Navigation
diff --git a/frontend/src/components/templates/DashboardShell.tsx b/frontend/src/components/templates/DashboardShell.tsx
index ec979b6e..4b37ac53 100644
--- a/frontend/src/components/templates/DashboardShell.tsx
+++ b/frontend/src/components/templates/DashboardShell.tsx
@@ -116,7 +116,7 @@ export function DashboardShell({ children }: { children: ReactNode }) {
       {/* Mobile sidebar overlay */}
       {sidebarOpen ? (
         <div
-          className="fixed inset-0 z-30 bg-black/30 md:hidden"
+          className="fixed inset-0 z-40 bg-black/30 md:hidden"
           onClick={toggleSidebar}
           onKeyDown={(e) => e.key === "Escape" && toggleSidebar()}
           role="button"