Refactor TemplatePreview for Improved Layout and Responsiveness

- Replaced a div with a Flex component to enhance layout and alignment of the TemplatePreview.
- Adjusted styles to ensure minimum width and proper cursor behavior during panning.
- Streamlined iframe rendering within the new structure for better responsiveness and user experience.

src/components/Dashboard/common/TemplatePreview.jsx

@@ -613,12 +613,25 @@ const TemplatePreview = ({
               cursor: panMode ? (isPanning ? 'grabbing' : 'grab') : undefined,
               touchAction: panMode ? 'none' : undefined
             }}
+          >
+            <Flex
+              justify='center'
+              align='center'
+              style={{
+                minWidth: '100%',
+                width: iframeSize.width,
+                height: iframeSize.height
+              }}
             >
               <div
                 style={{
                   width: iframeSize.width,
                   height: iframeSize.height,
-                cursor: panMode ? (isPanning ? 'grabbing' : 'grab') : undefined
+                  cursor: panMode
+                    ? isPanning
+                      ? 'grabbing'
+                      : 'grab'
+                    : undefined
                 }}
               >
                 <iframe
@@ -637,6 +650,7 @@ const TemplatePreview = ({
                   }}
                 />
               </div>
+            </Flex>
           </ScrollBox>
         ) : (
           <PDFViewer