Improve layout and remove unnecessary scrollbars from the application

Refactor Layout component to manage height and remove horizontal scrollbar. Update global CSS to hide vertical scrollbars on html, body, and root elements.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: d43bd811-9372-45a7-8ac9-4a954c0538e1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/1957c339-2757-4d1f-8e92-e9f71a1ce58e/d43bd811-9372-45a7-8ac9-4a954c0538e1/IhbIRSa

client/src/components/Layout.tsx

@@ -66,7 +66,7 @@ export default function Layout({ children }: LayoutProps) {
 
   return (
     <StoreContext.Provider value={{ selectedStoreId, setSelectedStoreId, stores, sidebarCollapsed, setSidebarCollapsed, mobileMenuOpen, setMobileMenuOpen }}>
-      <div className="layout-container flex h-screen overflow-hidden bg-gray-50">
+      <div className="layout-container flex bg-gray-50">
         {/* Mobile overlay */}
         {isMobile && mobileMenuOpen && (
           <div 
@@ -77,7 +77,7 @@ export default function Layout({ children }: LayoutProps) {
         
         <Sidebar />
         
-        <main className="flex-1 flex flex-col overflow-hidden max-w-full">
+        <main className="flex-1 flex flex-col h-full">
           {/* Header with mobile menu and store selector */}
           <header className="h-16 bg-white border-b border-gray-200 flex items-center justify-between px-4 sm:px-6">
             <div className="flex items-center gap-4">
@@ -157,10 +157,8 @@ export default function Layout({ children }: LayoutProps) {
             )}
           </header>
 
-          <div className="flex-1 overflow-y-auto overflow-x-hidden bg-gray-50 p-6 max-w-full">
-            <div className="max-w-full overflow-x-hidden">
-              {children}
-            </div>
+          <div className="flex-1 bg-gray-50 p-6 h-full overflow-y-auto">
+            {children}
           </div>
         </main>
       </div>