Fix user dropdown accessibility in mobile/tablet menu

- Prevent sidebar from closing when clicking user dropdown toggle
- Exclude user dropdown from auto-close behavior on navigation clicks
- Position user dropdown modal correctly on mobile/tablet screens
- Increase z-index to ensure dropdown appears above mobile overlay
- Center dropdown modal on mobile/tablet for better accessibility
- Add proper event handling to prevent unwanted closures

static/js/user-dropdown.js

@@ -31,6 +31,10 @@ document.addEventListener('DOMContentLoaded', function() {
     // Close dropdown when clicking outside
     document.addEventListener('click', function(e) {
         if (userDropdownModal && !userDropdownModal.contains(e.target) && !userDropdownToggle.contains(e.target)) {
+            // Don't close if we're clicking on the mobile overlay
+            if (e.target.id === 'mobile-nav-overlay' || e.target.classList.contains('mobile-overlay')) {
+                return;
+            }
             userDropdownModal.classList.remove('active');
         }
     });