Add comprehensive backend features and mobile UI improvements

Backend:
- Add 2FA authentication with TOTP support
- Add API keys management system
- Add audit logging for security events
- Add file upload/management system
- Add notifications system with preferences
- Add session management
- Add webhooks integration
- Add analytics endpoints
- Add export functionality
- Add password policy enforcement
- Add new database migrations for core tables

Frontend:
- Add module position system (top/bottom sidebar sections)
- Add search and notifications module configuration tabs
- Add mobile logo replacing hamburger menu
- Center page title absolutely when no tabs present
- Align sidebar footer toggles with navigation items
- Add lighter icon color in dark theme for mobile
- Add API keys management page
- Add notifications page with context
- Add admin analytics and audit logs pages

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

frontend/src/styles/Layout.css

@@ -160,7 +160,7 @@
 
 /* Standard Section Title */
 .section-title {
-  margin: 0;
+  margin: 0 0 1rem 0;
   font-size: 0.8rem;
   font-weight: 600;
   text-transform: uppercase;
@@ -203,7 +203,7 @@
 }
 
 .mobile-menu-btn:hover {
-  background: rgba(var(--color-accent-rgb), 0.1);
+  background-color: rgba(var(--color-accent-rgb), 0.1);
   color: var(--color-accent);
 }
 
@@ -211,6 +211,7 @@
   font-size: var(--icon-lg);
 }
 
+
 /* ==========  ACTION BUTTONS IN SLIDER ========== */
 
 /* Action buttons that appear in the slider (like Add User) */
@@ -286,9 +287,30 @@
     margin-left: 0;
   }
 
-  /* Show mobile menu button */
+  /* Show mobile menu button with logo */
   .mobile-menu-btn {
     display: flex;
+    position: absolute;
+    left: 4px;
+    top: 50%;
+    transform: translateY(-50%);
+    z-index: 1;
+    background-image: url('/logo_black.svg');
+    background-size: 28px 28px;
+    background-repeat: no-repeat;
+    background-position: center;
+  }
+
+  .mobile-menu-btn .material-symbols-outlined {
+    display: none;
+  }
+
+  [data-theme='dark'] .mobile-menu-btn {
+    background-image: url('/logo_white.svg');
+  }
+
+  .mobile-menu-btn:hover {
+    background-color: transparent;
   }
 
   .page-tabs-container,
@@ -302,6 +324,7 @@
     flex-wrap: wrap;
     justify-content: flex-start;
     gap: 8px;
+    position: relative;
   }
 
   .page-title-section,
@@ -309,6 +332,7 @@
     flex: 1;
     justify-content: flex-start;
     padding: 0.5rem 0.75rem;
+    padding-left: 48px;
     font-size: 1rem;
   }
 
@@ -323,6 +347,35 @@
     display: none;
   }
 
+  /* Hide title section when tabs are present on mobile */
+  .page-tabs-slider:has(.page-tab-btn) .page-title-section,
+  .admin-tabs-slider:has(.admin-tab-btn) .admin-title-section {
+    display: none;
+  }
+
+  /* Center title section absolutely when no tabs are present on mobile */
+  .page-tabs-slider:not(:has(.page-tab-btn)),
+  .admin-tabs-slider:not(:has(.admin-tab-btn)) {
+    justify-content: center;
+    min-height: 48px;
+  }
+
+  .page-tabs-slider:not(:has(.page-tab-btn)) .page-title-section,
+  .admin-tabs-slider:not(:has(.admin-tab-btn)) .admin-title-section {
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    padding: 0.5rem 0.75rem;
+    flex: none;
+  }
+
+  /* Lighter icon color in dark theme when only title is shown */
+  .page-tabs-slider:not(:has(.page-tab-btn)) .page-title-section .material-symbols-outlined,
+  .admin-tabs-slider:not(:has(.admin-tab-btn)) .admin-title-section .material-symbols-outlined {
+    color: var(--color-text-secondary);
+  }
+
   /* Tabs on second row - full width */
   .page-tab-btn,
   .admin-tab-btn {