updates on the createorder page and preview page as well

src/pages/nearle/dispatch/Preview.js

@@ -664,7 +664,27 @@ const Preview = () => {
   };
 
   return (
-    <Box sx={{ display: 'flex', flexDirection: 'column', height: '100vh', overflow: 'hidden', position: 'relative' }}>
+    // Mirrors Dispatch.css's `.dispatch-container` sizing exactly (this page
+    // embeds that same component below) — MainLayout's `.main-content-area`
+    // has 24px left/right/bottom padding and no padding-top (AppTopNav sits
+    // above it in normal flow), and exposes its own measured height via the
+    // --appshell-header-height CSS var. A bare `height: '100vh'` here (the
+    // previous value) doesn't subtract the top nav's height or cancel the
+    // surrounding padding, so the page's real content was taller than the
+    // visible viewport by roughly the nav height + padding — turning the
+    // whole page (not just the intended internal panels) into a scroll
+    // container, which dragged the rider sidebar along with it instead of
+    // it staying in place.
+    <Box
+      sx={{
+        display: 'flex',
+        flexDirection: 'column',
+        height: 'calc(100vh - var(--appshell-header-height, 64px))',
+        margin: '0 -24px -24px -24px',
+        overflow: 'hidden',
+        position: 'relative'
+      }}
+    >
       <Backdrop
         sx={{ position: 'absolute', color: '#fff', zIndex: (theme) => theme.zIndex.modal + 1 }}
         open={isLoading}
@@ -742,7 +762,12 @@ const Preview = () => {
         </Tabs>
       </Box>
 
-      <Box sx={{ flex: 1, display: 'flex', flexDirection: 'column', overflow: 'hidden' }}>
+      {/* minHeight: 0 overrides the flex-item default of min-height: auto —
+          without it, this flex:1 child can grow past its allotted space to
+          fit its content's natural height instead of clipping to it, which
+          is what let the embedded Dispatch view (and its internal
+          overflow-y:auto sidebar) overflow into page-level scroll. */}
+      <Box sx={{ flex: 1, display: 'flex', flexDirection: 'column', overflow: 'hidden', minHeight: 0 }}>
         {tabValue === 0 && dispatchPreviewData && (
           <Dispatch
             // The key forces a full re-mount when the cache reference changes