diff --git a/src/components/Chat/ChatDirect.tsx b/src/components/Chat/ChatDirect.tsx
index f975340..f935eff 100644
--- a/src/components/Chat/ChatDirect.tsx
+++ b/src/components/Chat/ChatDirect.tsx
@@ -360,7 +360,8 @@ console.log('isFocusedParent', isFocusedParent)
         <>
         <Spacer height="30px" />
                 <Input sx={{
-                  fontSize: '18px'
+                  fontSize: '18px',
+                  padding: '5px'
                 }} placeholder='Name or address' value={directToValue} onChange={(e)=> setDirectToValue(e.target.value)} />
 
         </>
diff --git a/src/components/Group/Forum/Thread.tsx b/src/components/Group/Forum/Thread.tsx
index 6b8f476..365c322 100644
--- a/src/components/Group/Forum/Thread.tsx
+++ b/src/components/Group/Forum/Thread.tsx
@@ -1,5 +1,5 @@
 import React, { FC, useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { Box, Button, IconButton, Skeleton } from "@mui/material";
+import { Box, Button, ButtonBase, IconButton, Skeleton } from "@mui/material";
 import { ShowMessage } from "./ShowMessageWithoutModal";
 import {
   ComposeP,
@@ -479,8 +479,9 @@ export const Thread = ({
         />
         <Box sx={{
           display: 'flex',
-          gap: isMobile ? '5px' : '25px',
-          alignItems: 'center'
+          gap: isMobile ? '45px' : '35px',
+          alignItems: 'center',
+          padding: isMobile && '5px'
         }}>
           <ShowMessageReturnButton
           sx={{
@@ -501,23 +502,26 @@ export const Thread = ({
           {/* Conditionally render the scroll buttons */}
           {showScrollButton && (
             isAtBottom ? (
+              <ButtonBase onClick={scrollToPosition}>
               <ArrowUpwardIcon
-                onClick={scrollToPosition}
                 sx={{
                   color: 'white',
                   cursor: 'pointer',
                   fontSize: isMobile ? '28px' : '36px',
                 }}
               />
+              </ButtonBase>
             ) : (
+              <ButtonBase onClick={scrollToPosition}>
               <ArrowDownwardIcon
-                onClick={scrollToPosition}
+                
                 sx={{
                   color: 'white',
                   cursor: 'pointer',
                   fontSize: isMobile ? '28px' : '36px',
                 }}
               />
+              </ButtonBase>
             )
           )}
         </Box>
@@ -701,51 +705,71 @@ export const Thread = ({
                 }}
               >
                 <Button
-                  onClick={() => {
-                    getMailMessages(currentThread, null, null, false);
-                  }}
-                  disabled={!hasFirstPage}
-                  variant="contained"
-                >
-                  First Page
-                </Button>
-                <Button
-                  onClick={() => {
-                    getMailMessages(
-                      currentThread,
-                      messages[0].created,
-                      null,
-                      false
-                    );
-                  }}
-                  disabled={!hasPreviousPage}
-                  variant="contained"
-                >
-                  Previous Page
-                </Button>
-                <Button
-                  onClick={() => {
-                    getMailMessages(
-                      currentThread,
-                      null,
-                      messages[messages.length - 1].created,
-                      false
-                    );
-                  }}
-                  disabled={!hasNextPage}
-                  variant="contained"
-                >
-                  Next page
-                </Button>
-                <Button
-                  onClick={() => {
-                    getMailMessages(currentThread, null, null, true);
-                  }}
-                  disabled={!hasLastPage}
-                  variant="contained"
-                >
-                  Last page
-                </Button>
+            sx={{
+              padding: isMobile && '5px',
+              fontSize: isMobile && '14px',
+              textTransformation: 'capitalize'
+            }}
+              onClick={() => {
+                getMailMessages(currentThread, null, null, false);
+              }}
+              disabled={!hasFirstPage}
+              variant="contained"
+            >
+              First
+            </Button>
+            <Button
+             sx={{
+              padding: isMobile && '5px',
+              fontSize: isMobile && '14px',
+              textTransformation: 'capitalize'
+            }}
+              onClick={() => {
+                getMailMessages(
+                  currentThread,
+                  messages[0].created,
+                  null,
+                  false
+                );
+              }}
+              disabled={!hasPreviousPage}
+              variant="contained"
+            >
+              Previous
+            </Button>
+            <Button
+             sx={{
+              padding: isMobile && '5px',
+              fontSize: isMobile && '14px',
+              textTransformation: 'capitalize'
+            }}
+              onClick={() => {
+                getMailMessages(
+                  currentThread,
+                  null,
+                  messages[messages.length - 1].created,
+                  false
+                );
+              }}
+              disabled={!hasNextPage}
+              variant="contained"
+            >
+              Next
+            </Button>
+            <Button
+             sx={{
+              padding: isMobile && '5px',
+              fontSize: isMobile && '14px',
+              textTransformation: 'capitalize'
+            }}
+              onClick={() => {
+                getMailMessages(currentThread, null, null, true);
+              }}
+              disabled={!hasLastPage}
+              variant="contained"
+            >
+              Last
+            </Button>
               </Box>
               <Spacer height="30px" />
             </>
diff --git a/src/components/Group/Group.tsx b/src/components/Group/Group.tsx
index 2f8c974..f382150 100644
--- a/src/components/Group/Group.tsx
+++ b/src/components/Group/Group.tsx
@@ -1358,6 +1358,7 @@ export const Group = ({
       }, 200);
     });
     setSelectedDirect(null);
+    setNewChat(false)
     setGroupSection("announcement");
     chrome?.runtime?.sendMessage({
       action: "addGroupNotificationTimestamp",
@@ -1379,6 +1380,7 @@ export const Group = ({
       }, 200);
     });
     setGroupSection("chat");
+    setNewChat(false)
     setSelectedDirect(null);
     if (selectedGroupRef.current) {
       chrome?.runtime?.sendMessage({
@@ -2241,6 +2243,7 @@ export const Group = ({
                 onClick={() => {
                   setGroupSection("forum");
                   setSelectedDirect(null);
+                  setNewChat(false)
                 }}
               >
                 <ForumIcon
@@ -2339,7 +2342,9 @@ export const Group = ({
           >
             {selectedGroup && (
               <>
-                <Grid item xs={4}>
+                <Grid item xs={4} sx={{
+                  display: 'flex'
+                }}>
                   <Button
                     fullWidth
                     size="small"
@@ -2381,7 +2386,9 @@ export const Group = ({
                     ANN
                   </Button>
                 </Grid>
-                <Grid item xs={4}>
+                <Grid item xs={4} sx={{
+                  display: 'flex'
+                }}>
                   <Button
                     fullWidth
                     size="small"
@@ -2422,7 +2429,9 @@ export const Group = ({
                     Chat
                   </Button>
                 </Grid>
-                <Grid item xs={4}>
+                <Grid item xs={4} sx={{
+                  display: 'flex'
+                }}>
                   <Button
                     fullWidth
                     size="small"
@@ -2445,13 +2454,16 @@ export const Group = ({
                     }}
                     onClick={() => {
                       setSelectedDirect(null);
+                      setNewChat(false)
                       setGroupSection("forum")
                     } }
                   >
                     Forum
                   </Button>
                 </Grid>
-                <Grid item xs={4}>
+                <Grid item xs={4} sx={{
+                  display: 'flex'
+                }}>
                   <Button
                     fullWidth
                     size="small"
@@ -2475,7 +2487,9 @@ export const Group = ({
             )}
 
             {/* Second row: Groups, Home, Profile */}
-            <Grid item xs={4}>
+            <Grid item xs={4} sx={{
+                  display: 'flex',
+                }}>
               <Button
                 fullWidth
                 size="small"
@@ -2516,7 +2530,10 @@ export const Group = ({
                 {chatMode === "groups" ? "Groups" : "Direct"}
               </Button>
             </Grid>
-            <Grid item xs={2}>
+            <Grid item xs={2} sx={{
+                  display: 'flex',
+                  justifyContent: 'center'
+                }}>
               <IconButton
                 sx={{ padding: "0", color: "white" }} // Reduce padding for icons
                 onClick={goToHome}
@@ -2524,7 +2541,10 @@ export const Group = ({
                 <HomeIcon />
               </IconButton>
             </Grid>
-            <Grid item xs={2}>
+            <Grid item xs={2} xs={2} sx={{
+                  display: 'flex',
+                  justifyContent: 'center'
+                }}>
               <IconButton
                 sx={{ padding: "0", color: "white" }} // Reduce padding for icons
                 onClick={() => setIsOpenDrawerProfile(true)}