header rekated fixes

frontend/src/layout/AppSidebar.tsx

@@ -37,7 +37,7 @@ type MenuSection = {
 };
 
 const AppSidebar: React.FC = () => {
-  const { isExpanded, isMobileOpen, isHovered, setIsHovered } = useSidebar();
+  const { isExpanded, isMobileOpen, isHovered, setIsHovered, toggleSidebar } = useSidebar();
   const location = useLocation();
   const { user, isAuthenticated } = useAuthStore();
   const { isModuleEnabled, settings: moduleSettings } = useModuleStore();
@@ -452,6 +452,22 @@ const AppSidebar: React.FC = () => {
       onMouseEnter={() => !isExpanded && setIsHovered(true)}
       onMouseLeave={() => setIsHovered(false)}
     >
+      {/* Collapse/Expand Toggle Button - Attached to border */}
+      <button
+        onClick={toggleSidebar}
+        className="hidden lg:flex absolute -right-3 top-20 w-6 h-6 items-center justify-center bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700 rounded-full shadow-sm hover:bg-gray-50 dark:hover:bg-gray-800 transition-colors z-50"
+        aria-label={isExpanded ? "Collapse Sidebar" : "Expand Sidebar"}
+      >
+        <svg 
+          className={`w-3.5 h-3.5 text-gray-500 dark:text-gray-400 transition-transform duration-300 ${isExpanded || isHovered ? 'rotate-180' : ''}`} 
+          fill="none" 
+          stroke="currentColor" 
+          viewBox="0 0 24 24"
+        >
+          <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
+        </svg>
+      </button>
+      
       <div className="py-4 flex justify-center items-center">
         <Link to="/" className="flex justify-center items-center">
           {isExpanded || isHovered || isMobileOpen ? (