diff --git a/app/templates/base.html b/app/templates/base.html
index bb0fb20..a3bf7d4 100644
--- a/app/templates/base.html
+++ b/app/templates/base.html
@@ -59,8 +59,9 @@
          :class="{ collapsed: sidebarCollapsed, 'mobile-open': mobileSidebarOpen }"
          id="sidebar"
          x-init="$nextTick(() => { if(typeof initTreeSortable==='function') initTreeSortable(); })">
-    <!-- Workspace header styled like Notion -->
-    <div class="sidebar-workspace-header" @click="toggleWorkspaceMenu" @mouseenter="wsHeaderHover=true" @mouseleave="wsHeaderHover=false"
+    <!-- Header + dropdown wrapper -->
+    <div style="position:relative;">
+    <div class="sidebar-workspace-header" @click="workspaceMenuOpen = !workspaceMenuOpen" @mouseenter="wsHeaderHover=true" @mouseleave="wsHeaderHover=false"
          :class="{ hover: wsHeaderHover || workspaceMenuOpen }">
       <div class="workspace-info">
         <div class="workspace-avatar">{{ workspaceInitial }}</div>
@@ -71,8 +72,7 @@
         <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="11 17 6 12 11 7"/><polyline points="18 17 13 12 18 7"/></svg>
       </button>
     </div>
-    <!-- User menu dropdown -->
-    <div class="user-menu-dropdown" x-show="workspaceMenuOpen" @click.outside="workspaceMenuOpen=false" x-transition>
+    <div class="user-menu-dropdown" x-show="workspaceMenuOpen" @click.away="workspaceMenuOpen = false" x-transition>
       <div class="um-user-info">
         <div class="um-avatar">{{ workspaceInitial }}</div>
         <div>
@@ -86,6 +86,7 @@
       <div class="um-sep"></div>
       <a href="/auth/logout" class="um-item um-danger" @click="workspaceMenuOpen=false">🚪 Log out</a>
     </div>
+    </div>
 
     <!-- Navigation icons row -->
     <div class="sidebar-nav-row">