diff --git a/frontend/components/MainPage/index.tsx b/frontend/components/MainPage/index.tsx
index f97acf159..d2702d794 100644
--- a/frontend/components/MainPage/index.tsx
+++ b/frontend/components/MainPage/index.tsx
@@ -17,6 +17,7 @@ import { MainNeedsFunds } from './sections/NeedsFundsSection';
 import { NewStakingProgramAlertSection } from './sections/NewStakingProgramAlertSection';
 import { MainOlasBalance } from './sections/OlasBalanceSection';
 import { MainRewards } from './sections/RewardsSection';
+import { StakingContractUpdate } from './sections/stakingContractUpdate';
 
 export const Main = () => {
   const { goto } = usePageState();
@@ -59,6 +60,7 @@ export const Main = () => {
         <MainOlasBalance />
         <MainRewards />
         <KeepAgentRunningSection />
+        <StakingContractUpdate />
         <GasBalanceSection />
         <MainNeedsFunds />
         <AddFundsSection />
diff --git a/frontend/components/MainPage/sections/StakingContractUpdate.tsx b/frontend/components/MainPage/sections/StakingContractUpdate.tsx
new file mode 100644
index 000000000..764eb22e2
--- /dev/null
+++ b/frontend/components/MainPage/sections/StakingContractUpdate.tsx
@@ -0,0 +1,49 @@
+import { RightOutlined } from '@ant-design/icons';
+import { Button, Flex, Skeleton, Typography } from 'antd';
+
+import { Pages } from '@/enums/PageState';
+import { usePageState } from '@/hooks/usePageState';
+import { useStakingProgram } from '@/hooks/useStakingProgram';
+
+import { CardSection } from '../../styled/CardSection';
+
+const { Text } = Typography;
+
+export const StakingContractUpdate = () => {
+  const { goto } = usePageState();
+  const { activeStakingProgramMeta, isLoadedActiveStakingProgram } =
+    useStakingProgram();
+
+  return (
+    <CardSection bordertop="true" padding="16px 24px">
+      <Flex
+        gap={16}
+        justify="space-between"
+        align="center"
+        style={{ width: '100%' }}
+      >
+        <Text type="secondary">Staking contract</Text>
+
+        {isLoadedActiveStakingProgram ? (
+          <Button
+            type="link"
+            className="p-0"
+            onClick={() => goto(Pages.ManageStaking)}
+          >
+            {activeStakingProgramMeta ? (
+              <>
+                {activeStakingProgramMeta.name}
+                &nbsp;
+                <RightOutlined />
+              </>
+            ) : (
+              'Not staked'
+            )}
+          </Button>
+        ) : (
+          <Skeleton.Input />
+        )}
+      </Flex>
+    </CardSection>
+  );
+};
diff --git a/frontend/components/ManageStakingPage/StakingContractSection/StakingContractTag.tsx b/frontend/components/ManageStakingPage/StakingContractSection/StakingContractTag.tsx
index b09c11a05..0b6569fe4 100644
--- a/frontend/components/ManageStakingPage/StakingContractSection/StakingContractTag.tsx
+++ b/frontend/components/ManageStakingPage/StakingContractSection/StakingContractTag.tsx
@@ -10,7 +10,7 @@ export const StakingContractTag = ({
   if (status === StakingProgramStatus.New) {
     return <Tag color="blue">New</Tag>;
   } else if (status === StakingProgramStatus.Selected) {
-    return <Tag>Selected</Tag>;
+    return <Tag color="purple">Active</Tag>;
   }
   return null;
 };
diff --git a/frontend/components/ManageStakingPage/StakingContractSection/index.tsx b/frontend/components/ManageStakingPage/StakingContractSection/index.tsx
index 801b4557e..d49298595 100644
--- a/frontend/components/ManageStakingPage/StakingContractSection/index.tsx
+++ b/frontend/components/ManageStakingPage/StakingContractSection/index.tsx
@@ -23,7 +23,7 @@ import { getMinimumStakedAmountRequired } from '@/utils/service';
 import { AlertInsufficientMigrationFunds, AlertNoSlots } from './alerts';
 import { StakingContractTag } from './StakingContractTag';
 
-// const { Text } = Typography;
+const { Title } = Typography;
 
 const { useToken } = theme;
 
@@ -94,22 +94,24 @@ export const StakingContractSection = ({
     [serviceTemplate, stakingProgram],
   );
 
+  // Check if there are enough OLAS to migrate
   const hasEnoughOlasToMigrate = useMemo(() => {
     if (safeBalance?.OLAS === undefined || totalOlasStakedBalance === undefined)
       return false;
 
     const balanceForMigration = safeBalance.OLAS + totalOlasStakedBalance;
-
     if (minimumOlasRequiredToMigrate === undefined) return false;
 
     return balanceForMigration >= minimumOlasRequiredToMigrate;
   }, [minimumOlasRequiredToMigrate, safeBalance?.OLAS, totalOlasStakedBalance]);
 
-  const hasEnoughSlots =
-    stakingContractInfoForStakingProgram?.maxNumServices &&
-    stakingContractInfoForStakingProgram?.serviceIds &&
-    stakingContractInfoForStakingProgram?.maxNumServices >
-      stakingContractInfoForStakingProgram?.serviceIds?.length;
+  // Check if there are enough SLOTS available
+  const hasEnoughSlots = useMemo(() => {
+    if (!stakingContractInfoForStakingProgram) return false;
+
+    const { maxNumServices, serviceIds } = stakingContractInfoForStakingProgram;
+    return maxNumServices && serviceIds && maxNumServices > serviceIds.length;
+  }, [stakingContractInfoForStakingProgram]);
 
   const activeStakingContractSupportsMigration =
     !activeStakingProgram ||
@@ -240,6 +242,14 @@ export const StakingContractSection = ({
     return;
   }, [activeStakingProgram, defaultStakingProgram, stakingProgram]);
 
+  const cardStyle = useMemo(() => {
+    if (isSelected || !activeStakingProgram) {
+      return { background: token.colorPrimaryBg };
+    }
+    return {};
+  }, [isSelected, activeStakingProgram, token.colorPrimaryBg]);
+
+  // If the staking program is deprecated, don't render the section
   if (STAKING_PROGRAM_META[stakingProgram].deprecated) {
     return null;
   }
@@ -247,27 +257,21 @@ export const StakingContractSection = ({
   return (
     <>
       <CardSection
-        style={
-          isSelected || !activeStakingProgram
-            ? { background: token.colorBgContainerDisabled }
-            : {}
-        }
+        style={cardStyle}
         bordertop="true"
         borderbottom="true"
         vertical
         gap={16}
       >
-        {/* Title */}
         <Flex gap={12}>
-          <Typography.Title
+          <Title
             level={5}
             className="m-0"
-          >{`${stakingProgramMeta?.name} contract`}</Typography.Title>
+          >{`${stakingProgramMeta?.name} contract`}</Title>
           <StakingContractTag status={contractTagStatus} />
         </Flex>
 
         {/* TODO: redisplay once bugs resolved */}
-
         {/* 
           {stakingContractInfo?.availableRewards && (
             <ContractParameter
@@ -283,6 +287,7 @@ export const StakingContractSection = ({
             />
           )} 
        */}
+
         <a
           href={`https://gnosisscan.io/address/${stakingContractAddress}`}
           target="_blank"
@@ -290,6 +295,7 @@ export const StakingContractSection = ({
           View contract details {UNICODE_SYMBOLS.EXTERNAL_LINK}
         </a>
         {activeStakingContractSupportsMigration && cantMigrateAlert}
+
         {/* Switch to program button */}
         {![activeStakingProgram, defaultStakingProgram].includes(
           stakingProgram,
@@ -322,10 +328,12 @@ export const StakingContractSection = ({
                 }
               }}
             >
-              Switch
+              Switch and run agent
             </Button>
           </Popover>
         )}
+
+        {/* show funding address */}
         {!isSelected &&
           activeStakingContractSupportsMigration &&
           !hasEnoughOlasToMigrate && (
diff --git a/frontend/components/SettingsPage/SettingsStakingContractSection.tsx b/frontend/components/SettingsPage/SettingsStakingContractSection.tsx
deleted file mode 100644
index 121b36476..000000000
--- a/frontend/components/SettingsPage/SettingsStakingContractSection.tsx
+++ /dev/null
@@ -1,58 +0,0 @@
-import { Button, Flex, Skeleton, Typography } from 'antd';
-
-import { Chain } from '@/client';
-import { SERVICE_STAKING_TOKEN_MECH_USAGE_CONTRACT_ADDRESSES } from '@/constants/contractAddresses';
-import { UNICODE_SYMBOLS } from '@/constants/symbols';
-import { Pages } from '@/enums/PageState';
-import { usePageState } from '@/hooks/usePageState';
-import { useStakingProgram } from '@/hooks/useStakingProgram';
-
-import { CardSection } from '../styled/CardSection';
-
-const { Text } = Typography;
-
-export const SettingsStakingContractSection = () => {
-  const { goto } = usePageState();
-  const {
-    activeStakingProgram,
-    activeStakingProgramMeta,
-    defaultStakingProgram,
-    isLoadedActiveStakingProgram,
-  } = useStakingProgram();
-
-  const stakingContractAddress =
-    SERVICE_STAKING_TOKEN_MECH_USAGE_CONTRACT_ADDRESSES[Chain.GNOSIS][
-      activeStakingProgram ?? defaultStakingProgram
-    ];
-
-  if (!isLoadedActiveStakingProgram) {
-    return <Skeleton style={{ height: 100 }} />;
-  }
-
-  return (
-    <CardSection vertical gap={8} align="start" borderbottom="true">
-      <Text strong>Staking contract</Text>
-      <Flex gap={16}>
-        <Text type="secondary">
-          {activeStakingProgramMeta
-            ? activeStakingProgramMeta.name
-            : 'Not staked'}
-        </Text>
-        <a
-          href={`https://gnosisscan.io/address/${stakingContractAddress}`}
-          target="_blank"
-        >
-          Contract details {UNICODE_SYMBOLS.EXTERNAL_LINK}
-        </a>
-      </Flex>
-      <Button
-        type="primary"
-        ghost
-        size="large"
-        onClick={() => goto(Pages.ManageStaking)}
-      >
-        Manage
-      </Button>
-    </CardSection>
-  );
-};
diff --git a/frontend/components/SettingsPage/index.tsx b/frontend/components/SettingsPage/index.tsx
index 3170d1e54..9a87a50b9 100644
--- a/frontend/components/SettingsPage/index.tsx
+++ b/frontend/components/SettingsPage/index.tsx
@@ -16,7 +16,6 @@ import { CardTitle } from '../Card/CardTitle';
 import { CardSection } from '../styled/CardSection';
 import { AddBackupWalletPage } from './AddBackupWalletPage';
 import { DebugInfoSection } from './DebugInfoSection';
-import { SettingsStakingContractSection } from './SettingsStakingContractSection';
 
 const { Text, Paragraph } = Typography;
 
@@ -76,6 +75,7 @@ const SettingsMain = () => {
           <Text style={{ lineHeight: 1 }}>********</Text>
         </Flex>
       </CardSection>
+
       {/* Wallet backup */}
       <CardSection borderbottom="true" vertical gap={8}>
         <Text strong>Backup wallet</Text>
@@ -91,8 +91,7 @@ const SettingsMain = () => {
           <NoBackupWallet />
         )}
       </CardSection>
-      {/* Staking contract section */}
-      <SettingsStakingContractSection />
+
       {/* Debug info */}
       <DebugInfoSection />
     </Card>