refactor: update layout styles for AppHeader and AppSidebarLayout components

resources/js/components/app-header.tsx

@@ -70,7 +70,7 @@ export function AppHeader({ breadcrumbs = [] }: Props) {
     const { isCurrentUrl, whenCurrentUrl } = useCurrentUrl();
 
     return (
-        <>
+        <div className="sticky top-0 z-50 bg-background">
             <div className="border-b border-sidebar-border/80">
                 <div className="mx-auto flex h-16 items-center px-4 md:max-w-7xl">
                     {/* Mobile Menu */}
@@ -243,6 +243,6 @@ export function AppHeader({ breadcrumbs = [] }: Props) {
                     </div>
                 </div>
             )}
-        </>
+        </div>
     );
 }

resources/js/components/app-shell.tsx

@@ -17,5 +17,5 @@ export function AppShell({ children, variant = 'sidebar' }: Props) {
         );
     }
 
-    return <SidebarProvider defaultOpen={isOpen}>{children}</SidebarProvider>;
+    return <SidebarProvider defaultOpen={isOpen} className="h-screen overflow-hidden">{children}</SidebarProvider>;
 }

resources/js/layouts/app/app-sidebar-layout.tsx

@@ -13,7 +13,7 @@ export default function AppSidebarLayout({
             <AppSidebar />
             <AppContent
                 variant="sidebar"
-                className="min-h-svh overflow-x-hidden overflow-y-auto"
+                className="flex-1 overflow-y-auto overflow-x-hidden"
             >
                 <AppSidebarHeader breadcrumbs={breadcrumbs} />
                 {children}