Fix mobile navigation: visible toggle, overlay, and correct sidebar behavior

frontend/main.js

@@ -89,9 +89,10 @@ document.addEventListener('DOMContentLoaded', () => {
             overlay.classList.toggle('active');
             // Change icon based on sidebar state
             if (sidebar.classList.contains('active')) {
-                mobileSidebarToggle.querySelector('i').classList.remove('fa-bars');
-                mobileSidebarToggle.querySelector('i').classList.add('fa-times');
-            } else {
+                mobileSidebarToggle.querySelector('i').classList.remove('fa-times');
+                mobileSidebarToggle.querySelector('i').classList.add('fa-bars');
+            }
+        } else {
                 mobileSidebarToggle.querySelector('i').classList.remove('fa-times');
                 mobileSidebarToggle.querySelector('i').classList.add('fa-bars');
             }