diff --git a/packages/client/public/locales/en/Settings.json b/packages/client/public/locales/en/Settings.json
index 0f32381247..97827b08fa 100644
--- a/packages/client/public/locales/en/Settings.json
+++ b/packages/client/public/locales/en/Settings.json
@@ -54,7 +54,9 @@
   "BrandingSubtitle": "Use this option to provide on-brand experience to users.",
   "BreakpointSmallText": "Your window is too small to display all page contents",
   "BreakpointSmallTextPrompt": "Please resize the window or enable full-screen mode",
+  "BreakpointMobileWarningText": "This section is unavailable in mobile version",
   "BreakpointWarningText": "This section is only available in the desktop version",
+  "BreakpointMobileWarningTextPrompt": "Please use the desktop or tablet to access the <1>{{sectionName}}</1>.",
   "BreakpointWarningTextPrompt": "Please use the desktop site to access <1>{{sectionName}}</1> settings.",
   "BruteForceProtection": "Brute Force Protection",
   "BruteForceProtectionDescription": "Set up the limit of unsuccessful login attempts by the user to protect the space against brute-force attacks. When the limit is reached, attempts coming from the associated IP address will be banned for specified period of time, or captcha will be requested if enabled.",
diff --git a/packages/client/src/components/BreakpointWarning/BreakpointWarning.js b/packages/client/src/components/BreakpointWarning/BreakpointWarning.js
index 57e0848ade..368a0c8694 100644
--- a/packages/client/src/components/BreakpointWarning/BreakpointWarning.js
+++ b/packages/client/src/components/BreakpointWarning/BreakpointWarning.js
@@ -38,13 +38,21 @@ const BreakpointWarning = ({
   tReady,
   theme,
   isSmallWindow,
+  isMobileUnavailableOnly,
 }) => {
   const textHeader = isSmallWindow
     ? t("BreakpointSmallText")
-    : t("BreakpointWarningText");
+    : isMobileUnavailableOnly
+      ? t("BreakpointMobileWarningText")
+      : t("BreakpointWarningText");
 
   const textPrompt = isSmallWindow ? (
     t("BreakpointSmallTextPrompt")
+  ) : isMobileUnavailableOnly ? (
+    <Trans t={t} i18nKey="BreakpointMobileWarningTextPrompt" ns="Settings">
+      "Please use the desktop site to access the {{ sectionName }}
+      settings."
+    </Trans>
   ) : (
     <Trans t={t} i18nKey="BreakpointWarningTextPrompt" ns="Settings">
       "Please use the desktop site to access the {{ sectionName }}
diff --git a/packages/client/src/components/FilesSelector/FilesSelector.types.ts b/packages/client/src/components/FilesSelector/FilesSelector.types.ts
index 8eab10d12d..f8f925dcf7 100644
--- a/packages/client/src/components/FilesSelector/FilesSelector.types.ts
+++ b/packages/client/src/components/FilesSelector/FilesSelector.types.ts
@@ -34,6 +34,7 @@ export type FilesSelectorProps = {
   isPanelVisible: boolean;
   // withoutImmediatelyClose: boolean;
   isThirdParty: boolean;
+  isSelectFolder: boolean;
   rootThirdPartyId?: string;
   isRoomsOnly: boolean;
   isUserOnly: boolean;
diff --git a/packages/client/src/components/FilesSelector/index.tsx b/packages/client/src/components/FilesSelector/index.tsx
index 9728e94ae2..99b2dad01e 100644
--- a/packages/client/src/components/FilesSelector/index.tsx
+++ b/packages/client/src/components/FilesSelector/index.tsx
@@ -62,6 +62,7 @@ const FilesSelectorWrapper = ({
   isRoomsOnly = false,
   isUserOnly = false,
   isEditorDialog = false,
+  isSelectFolder = false,
   rootThirdPartyId,
   filterParam,
 
@@ -273,7 +274,7 @@ const FilesSelectorWrapper = ({
     isSelect,
     filterParam,
     isRestore,
-    isThirdParty,
+    isSelectFolder,
   );
 
   const defaultAcceptButtonLabel = getAcceptButtonLabel(
@@ -285,6 +286,7 @@ const FilesSelectorWrapper = ({
     isSelect,
     filterParam,
     isRestore,
+    isSelectFolder,
   );
 
   const getIsDisabledAction = (
diff --git a/packages/client/src/components/FilesSelector/utils.ts b/packages/client/src/components/FilesSelector/utils.ts
index c647546057..7cc463398b 100644
--- a/packages/client/src/components/FilesSelector/utils.ts
+++ b/packages/client/src/components/FilesSelector/utils.ts
@@ -41,10 +41,10 @@ export const getHeaderLabel = (
   isSelect?: boolean,
   filterParam?: string,
   isRestore?: boolean,
-  isThirdParty?: boolean,
+  isSelectFolder?: boolean,
 ) => {
   if (isRestore) return t("Common:RestoreTo");
-  if (isThirdParty) return t("Common:SelectFolder");
+  if (isSelectFolder) return t("Common:SelectFolder");
   if (isMove) return t("Common:MoveTo");
   if (isCopy && !isEditorDialog) return t("Common:Copy");
   if (isRestoreAll) return t("Common:Restore");
@@ -68,12 +68,13 @@ export const getAcceptButtonLabel = (
   isSelect?: boolean,
   filterParam?: string,
   isRestore?: boolean,
+  isSelectFolder?: boolean,
 ) => {
   if (isRestore) return t("Common:RestoreHere");
   if (isMove) return t("Common:MoveHere");
   if (isCopy && !isEditorDialog) return t("Common:CopyHere");
   if (isRestoreAll) return t("Common:RestoreHere");
-  if (isSelect) return t("Common:SelectAction");
+  if (isSelect || isSelectFolder) return t("Common:SelectAction");
 
   if (filterParam === FilesSelectorFilterTypes.DOCX) return t("Common:Create");
   // if (filterParam === FilesSelectorFilterTypes.DOCXF) return t("Common:SubmitToGallery");
diff --git a/packages/client/src/components/FilesSelectorInput/index.js b/packages/client/src/components/FilesSelectorInput/index.js
index 2e98e1225f..80c28962b0 100644
--- a/packages/client/src/components/FilesSelectorInput/index.js
+++ b/packages/client/src/components/FilesSelectorInput/index.js
@@ -39,6 +39,7 @@ const FilesSelectorInput = (props) => {
     id,
     isThirdParty,
     isRoomsOnly,
+    isSelectFolder,
     setNewPath,
     newPath,
     onSelectFolder: setSelectedFolder,
@@ -126,6 +127,7 @@ const FilesSelectorInput = (props) => {
         rootThirdPartyId={rootThirdPartyId}
         isThirdParty={isThirdParty}
         isRoomsOnly={isRoomsOnly}
+        isSelectFolder={isSelectFolder}
         id={id}
         onClose={onClose}
         isPanelVisible={isPanelVisible}
diff --git a/packages/client/src/components/SpaceQuota/StyledComponent.js b/packages/client/src/components/SpaceQuota/StyledComponent.js
index 43f8b522d0..954882681c 100644
--- a/packages/client/src/components/SpaceQuota/StyledComponent.js
+++ b/packages/client/src/components/SpaceQuota/StyledComponent.js
@@ -31,12 +31,14 @@ const StyledBody = styled.div`
   overflow: hidden;
   width: 100%;
   max-width: max-content;
+  margin-left: 0px !important;
 
   display: flex;
   flex-wrap: nowrap;
+  height: 28px;
+  align-items: center;
 
   p {
-    padding-top: 8px;
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
diff --git a/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/ThirdPartyStorage/FolderInput.js b/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/ThirdPartyStorage/FolderInput.js
index 514d533357..70868b92f3 100644
--- a/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/ThirdPartyStorage/FolderInput.js
+++ b/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/ThirdPartyStorage/FolderInput.js
@@ -214,9 +214,9 @@ const FolderInput = ({
           isPanelVisible={isDialogOpen}
           onClose={onClose}
           isThirdParty
+          isSelectFolder
           onSelectTreeNode={setTreeNode}
           passedFoldersTree={[thirdpartyAccount]}
-          acceptButtonLabel={t("Common:SelectAction")}
           currentFolderId={treeNode ? treeNode.id : thirdpartyAccount.id}
         />
       )}
diff --git a/packages/client/src/pages/PortalSettings/Layout/Section/Header/index.js b/packages/client/src/pages/PortalSettings/Layout/Section/Header/index.js
index fbe671df7c..d0da4b48e4 100644
--- a/packages/client/src/pages/PortalSettings/Layout/Section/Header/index.js
+++ b/packages/client/src/pages/PortalSettings/Layout/Section/Header/index.js
@@ -37,7 +37,7 @@ import { IconButton } from "@docspace/shared/components/icon-button";
 import { TableGroupMenu } from "@docspace/shared/components/table";
 import { DropDownItem } from "@docspace/shared/components/drop-down-item";
 import LoaderSectionHeader from "../loaderSectionHeader";
-import { mobile, tablet, desktop } from "@docspace/shared/utils";
+import { mobile, tablet, desktop, isMobile } from "@docspace/shared/utils";
 import withLoading from "SRC_DIR/HOCs/withLoading";
 import { Badge } from "@docspace/shared/components/badge";
 import {
@@ -74,6 +74,8 @@ const HeaderContainer = styled.div`
       white-space: nowrap;
       overflow: hidden;
       color: ${(props) => props.theme.client.settings.headerTitleColor};
+      display: flex;
+      align-items: center;
     }
   }
   .action-wrapper {
@@ -331,6 +333,13 @@ const SectionHeaderContent = (props) => {
     },
   ];
 
+  const pathname = location.pathname;
+
+  const isServicePage =
+    pathname.includes("google") ||
+    pathname.includes("nextcloud") ||
+    pathname.includes("onlyoffice");
+
   return (
     <StyledContainer isHeaderVisible={isHeaderVisible}>
       {isHeaderVisible ? (
@@ -359,7 +368,18 @@ const SectionHeaderContent = (props) => {
           )}
           <Headline type="content" truncate={true}>
             <div className="settings-section_header">
-              <div className="header"> {t(header)}</div>
+              <div className="header">
+                {isMobile() && isServicePage && (
+                  <IconButton
+                    iconName={ArrowPathReactSvgUrl}
+                    size="17"
+                    isFill={true}
+                    onClick={onBackToParent}
+                    className="arrow-button"
+                  />
+                )}
+                {t(header)}
+              </div>
               {isNeedPaidIcon ? (
                 <Badge
                   backgroundColor="#EDC409"
diff --git a/packages/client/src/pages/PortalSettings/categories/data-import/GoogleWorkspace/index.js b/packages/client/src/pages/PortalSettings/categories/data-import/GoogleWorkspace/index.js
index fc7e75e4e5..3d51a39cc3 100644
--- a/packages/client/src/pages/PortalSettings/categories/data-import/GoogleWorkspace/index.js
+++ b/packages/client/src/pages/PortalSettings/categories/data-import/GoogleWorkspace/index.js
@@ -28,7 +28,9 @@ import { useState, useEffect } from "react";
 import { inject, observer } from "mobx-react";
 import { Trans, withTranslation } from "react-i18next";
 import { getStepTitle, getGoogleStepDescription } from "../../../utils";
-import { tablet, isMobile } from "@docspace/shared/utils/device";
+import { tablet } from "@docspace/shared/utils/device";
+
+import { isMobile } from "react-device-detect";
 import useViewEffect from "SRC_DIR/Hooks/useViewEffect";
 import styled, { css } from "styled-components";
 import { useNavigate } from "react-router-dom";
@@ -211,8 +213,13 @@ const GoogleWorkspace = ({
     return clearCheckedAccounts;
   }, []);
 
-  if (isMobile())
-    return <BreakpointWarning sectionName={t("Settings:DataImport")} />;
+  if (isMobile)
+    return (
+      <BreakpointWarning
+        isMobileUnavailableOnly
+        sectionName={t("Settings:DataImport")}
+      />
+    );
 
   if (!shouldRender) return <SelectFileLoader />;
 
diff --git a/packages/client/src/pages/PortalSettings/categories/data-import/NextCloudWorkspace/index.js b/packages/client/src/pages/PortalSettings/categories/data-import/NextCloudWorkspace/index.js
index 3528cff9c5..8209feff81 100644
--- a/packages/client/src/pages/PortalSettings/categories/data-import/NextCloudWorkspace/index.js
+++ b/packages/client/src/pages/PortalSettings/categories/data-import/NextCloudWorkspace/index.js
@@ -27,7 +27,7 @@
 import { useState, useEffect } from "react";
 import { inject, observer } from "mobx-react";
 import { withTranslation } from "react-i18next";
-import { isMobile } from "@docspace/shared/utils/device";
+import { isMobile } from "react-device-detect";
 import { useNavigate } from "react-router-dom";
 import useViewEffect from "SRC_DIR/Hooks/useViewEffect";
 import styled from "styled-components";
@@ -125,8 +125,13 @@ const NextcloudWorkspace = (props) => {
     return clearCheckedAccounts;
   }, []);
 
-  if (isMobile())
-    return <BreakpointWarning sectionName={t("Settings:DataImport")} />;
+  if (isMobile)
+    return (
+      <BreakpointWarning
+        isMobileUnavailableOnly
+        sectionName={t("Settings:DataImport")}
+      />
+    );
 
   if (!tReady || !shouldRender) return <SelectFileLoader />;
 
diff --git a/packages/client/src/pages/PortalSettings/categories/data-import/OnlyofficeWorkspace/index.js b/packages/client/src/pages/PortalSettings/categories/data-import/OnlyofficeWorkspace/index.js
index e2a4cda9a7..81717fbd5e 100644
--- a/packages/client/src/pages/PortalSettings/categories/data-import/OnlyofficeWorkspace/index.js
+++ b/packages/client/src/pages/PortalSettings/categories/data-import/OnlyofficeWorkspace/index.js
@@ -28,7 +28,8 @@ import { useState, useEffect } from "react";
 import { inject, observer } from "mobx-react";
 import { Trans, withTranslation } from "react-i18next";
 import { getStepTitle, getWorkspaceStepDescription } from "../../../utils";
-import { tablet, isMobile } from "@docspace/shared/utils/device";
+import { tablet } from "@docspace/shared/utils/device";
+import { isMobile } from "react-device-detect";
 import useViewEffect from "SRC_DIR/Hooks/useViewEffect";
 import styled, { css } from "styled-components";
 import { useNavigate } from "react-router-dom";
@@ -206,8 +207,13 @@ const OnlyofficeWorkspace = ({
     return clearCheckedAccounts;
   }, []);
 
-  if (isMobile()) {
-    return <BreakpointWarning sectionName={t("Settings:DataImport")} />;
+  if (isMobile) {
+    return (
+      <BreakpointWarning
+        isMobileUnavailableOnly
+        sectionName={t("Settings:DataImport")}
+      />
+    );
   }
 
   if (!shouldRender) return <SelectFileLoader />;
diff --git a/packages/client/src/pages/PortalSettings/categories/data-management/backup/StyledBackup.js b/packages/client/src/pages/PortalSettings/categories/data-management/backup/StyledBackup.js
index 1bc68118ef..49ebb53d3b 100644
--- a/packages/client/src/pages/PortalSettings/categories/data-management/backup/StyledBackup.js
+++ b/packages/client/src/pages/PortalSettings/categories/data-management/backup/StyledBackup.js
@@ -426,13 +426,13 @@ const StyledRestoreBackup = styled.div`
   }
 
   .restore-backup_button-container {
-    padding-block: 30px;
     position: sticky;
     bottom: 0;
-    margin-top: 32px;
+    margin-top: 24px;
     background-color: ${({ theme }) => theme.backgroundColor};
 
     @media ${mobile} {
+      padding-block: 30px;
       position: fixed;
       padding-inline: 16px;
       inset-inline: 0;
diff --git a/packages/client/src/pages/PortalSettings/categories/data-management/backup/auto-backup/sub-components/RoomsModule.js b/packages/client/src/pages/PortalSettings/categories/data-management/backup/auto-backup/sub-components/RoomsModule.js
index 0c7425904c..aae764884b 100644
--- a/packages/client/src/pages/PortalSettings/categories/data-management/backup/auto-backup/sub-components/RoomsModule.js
+++ b/packages/client/src/pages/PortalSettings/categories/data-management/backup/auto-backup/sub-components/RoomsModule.js
@@ -59,6 +59,7 @@ class RoomsModule extends React.PureComponent {
             isError={isError}
             isDisabled={isLoadingData}
             isRoomBackup
+            isSelectFolder
           />
         </div>
         <ScheduleComponent isLoadingData={isLoadingData} {...rest} />
diff --git a/packages/client/src/pages/PortalSettings/categories/data-management/backup/common-container/DirectThirdPartyConnection.js b/packages/client/src/pages/PortalSettings/categories/data-management/backup/common-container/DirectThirdPartyConnection.js
index 4791ec4517..abf316c099 100644
--- a/packages/client/src/pages/PortalSettings/categories/data-management/backup/common-container/DirectThirdPartyConnection.js
+++ b/packages/client/src/pages/PortalSettings/categories/data-management/backup/common-container/DirectThirdPartyConnection.js
@@ -70,6 +70,8 @@ const DirectThirdPartyConnection = (props) => {
     isMobileScale,
     accounts,
     setThirdPartyAccountsInfo,
+    isSelect,
+    isSelectFolder,
   } = props;
 
   const [state, setState] = useReducer(
@@ -261,6 +263,8 @@ const DirectThirdPartyConnection = (props) => {
               isError={isError}
               isDisabled={isDisabledSelector}
               isThirdParty
+              isSelectFolder={isSelectFolder}
+              isSelect={isSelect}
             />
           )}
         </>
diff --git a/packages/client/src/pages/PortalSettings/categories/data-management/backup/manual-backup/sub-components/RoomsModule.js b/packages/client/src/pages/PortalSettings/categories/data-management/backup/manual-backup/sub-components/RoomsModule.js
index 82507a7782..60843f3357 100644
--- a/packages/client/src/pages/PortalSettings/categories/data-management/backup/manual-backup/sub-components/RoomsModule.js
+++ b/packages/client/src/pages/PortalSettings/categories/data-management/backup/manual-backup/sub-components/RoomsModule.js
@@ -93,6 +93,7 @@ class RoomsModule extends React.Component {
             withoutInitPath={!selectedFolder}
             isDisabled={isModuleDisabled}
             isRoomBackup
+            isSelectFolder
           />
         </div>
         <div className="manual-backup_buttons">
diff --git a/packages/client/src/pages/PortalSettings/categories/data-management/backup/manual-backup/sub-components/ThirdPartyModule.js b/packages/client/src/pages/PortalSettings/categories/data-management/backup/manual-backup/sub-components/ThirdPartyModule.js
index 48c7a14042..307e37a615 100644
--- a/packages/client/src/pages/PortalSettings/categories/data-management/backup/manual-backup/sub-components/ThirdPartyModule.js
+++ b/packages/client/src/pages/PortalSettings/categories/data-management/backup/manual-backup/sub-components/ThirdPartyModule.js
@@ -128,6 +128,7 @@ class ThirdPartyModule extends React.Component {
           withoutInitPath={!selectedFolder}
           isError={isError}
           buttonSize={buttonSize}
+          isSelectFolder
         />
 
         {connectedThirdPartyAccount?.id && isTheSameThirdPartyAccount && (
diff --git a/packages/client/src/pages/PortalSettings/categories/data-management/backup/restore-backup/sub-components/RoomsModule.js b/packages/client/src/pages/PortalSettings/categories/data-management/backup/restore-backup/sub-components/RoomsModule.js
index 34efbe687c..859f567753 100644
--- a/packages/client/src/pages/PortalSettings/categories/data-management/backup/restore-backup/sub-components/RoomsModule.js
+++ b/packages/client/src/pages/PortalSettings/categories/data-management/backup/restore-backup/sub-components/RoomsModule.js
@@ -48,6 +48,7 @@ const RoomsModule = (props) => {
       onSelectFile={onSelectFile}
       filterParam={FilesSelectorFilterTypes.BackupOnly}
       descriptionText={t("SelectFileInGZFormat")}
+      isSelect
     />
   );
 };
diff --git a/packages/client/src/pages/PortalSettings/categories/data-management/backup/restore-backup/sub-components/ThirdPartyResourcesModule.js b/packages/client/src/pages/PortalSettings/categories/data-management/backup/restore-backup/sub-components/ThirdPartyResourcesModule.js
index 89f1f4131d..03ddffcd03 100644
--- a/packages/client/src/pages/PortalSettings/categories/data-management/backup/restore-backup/sub-components/ThirdPartyResourcesModule.js
+++ b/packages/client/src/pages/PortalSettings/categories/data-management/backup/restore-backup/sub-components/ThirdPartyResourcesModule.js
@@ -50,6 +50,7 @@ const ThirdPartyResources = (props) => {
         withoutInitPath
         buttonSize={buttonSize}
         isMobileScale
+        isSelect
       />
     </div>
   );
diff --git a/packages/client/src/pages/PortalSettings/categories/developer-tools/Webhooks/styled-components/Hint.js b/packages/client/src/pages/PortalSettings/categories/developer-tools/Webhooks/styled-components/Hint.js
index be2a6b1640..b3e16e0163 100644
--- a/packages/client/src/pages/PortalSettings/categories/developer-tools/Webhooks/styled-components/Hint.js
+++ b/packages/client/src/pages/PortalSettings/categories/developer-tools/Webhooks/styled-components/Hint.js
@@ -29,9 +29,8 @@ import styled, { css } from "styled-components";
 export const Hint = styled.div`
   box-sizing: border-box;
   padding: 8px 12px;
-  background: ${(props) =>
-    props.backgroundColor ? props.backgroundColor : "#f8f7bf"};
-  color: ${(props) => (props.color ? props.color : "initial")};
+  background: ${(props) => props.theme.tooltip.backgroundColor};
+  color: ${(props) => props.theme.tooltip.textColor};
   border-radius: 6px;
   font-weight: 400;
   font-size: ${(props) => props.theme.getCorrectFontSize("12px")};
diff --git a/packages/client/src/pages/PortalSettings/categories/developer-tools/Webhooks/sub-components/SecretKeyInput.js b/packages/client/src/pages/PortalSettings/categories/developer-tools/Webhooks/sub-components/SecretKeyInput.js
index 4f5ea64788..bf779f5ebd 100644
--- a/packages/client/src/pages/PortalSettings/categories/developer-tools/Webhooks/sub-components/SecretKeyInput.js
+++ b/packages/client/src/pages/PortalSettings/categories/developer-tools/Webhooks/sub-components/SecretKeyInput.js
@@ -44,6 +44,7 @@ const SecretKeyWrapper = styled.div`
   .link {
     display: inline-block;
     margin-top: 6px;
+    color: ${(props) => props.theme.tooltip.textColor};
   }
 
   .dotted {
@@ -159,7 +160,6 @@ const SecretKeyInput = (props) => {
             isHovered={true}
             onClick={hideReset}
             className="link"
-            color="#333333"
           >
             {t("ResetKey")}
           </Link>
diff --git a/packages/client/src/pages/PortalSettings/categories/integration/SMTPSettings/sub-components/CustomSettings.js b/packages/client/src/pages/PortalSettings/categories/integration/SMTPSettings/sub-components/CustomSettings.js
index 55051724a2..20639c5b73 100644
--- a/packages/client/src/pages/PortalSettings/categories/integration/SMTPSettings/sub-components/CustomSettings.js
+++ b/packages/client/src/pages/PortalSettings/categories/integration/SMTPSettings/sub-components/CustomSettings.js
@@ -114,7 +114,7 @@ const CustomSettings = (props) => {
 
       <div className="smtp-settings_title smtp-settings_login">
         <Text {...commonTextProps}>{t("HostLogin")}</Text>
-        <Text as="span" color="#F21C0E">
+        <Text as="span" {...requirementColor}>
           *
         </Text>
       </div>
@@ -130,7 +130,7 @@ const CustomSettings = (props) => {
 
       <div className="smtp-settings_title">
         <Text {...commonTextProps}>{t("HostPassword")}</Text>
-        <Text as="span" color="#F21C0E">
+        <Text as="span" {...requirementColor}>
           *
         </Text>
       </div>
diff --git a/packages/client/src/pages/PortalSettings/categories/payments/SaaS/BenefitsContainer.js b/packages/client/src/pages/PortalSettings/categories/payments/SaaS/BenefitsContainer.js
index be040e52af..7b7c7b26eb 100644
--- a/packages/client/src/pages/PortalSettings/categories/payments/SaaS/BenefitsContainer.js
+++ b/packages/client/src/pages/PortalSettings/categories/payments/SaaS/BenefitsContainer.js
@@ -25,7 +25,7 @@
 // International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
 
 import React from "react";
-import styled from "styled-components";
+import styled, { css } from "styled-components";
 import { Text } from "@docspace/shared/components/text";
 import { inject, observer } from "mobx-react";
 
@@ -54,12 +54,23 @@ const StyledBody = styled.div`
     p {
       margin-bottom: 0;
     }
-    svg {
-      path {
-        fill: ${(props) =>
-          props.theme.client.settings.payment.benefitsContainer
-            .iconsColor} !important;
-      }
+    .icons-container {
+      width: 24px;
+      height: 24px;
+
+      ${(props) =>
+        !props.theme.isBase &&
+        css`
+          svg {
+            path {
+              fill: #adadad !important;
+            }
+            mask + path {
+              fill: none !important;
+              stroke: #adadad !important;
+            }
+          }
+        `}
     }
   }
 `;
@@ -79,7 +90,10 @@ const BenefitsContainer = ({ t, features, theme }) => {
         if (!item.title || !item.image) return;
         return (
           <div className="payment-benefits" key={index}>
-            <div dangerouslySetInnerHTML={{ __html: item.image }} />
+            <div
+              dangerouslySetInnerHTML={{ __html: item.image }}
+              className="icons-container"
+            />
             <Text noSelect>{item.title}</Text>
           </div>
         );
diff --git a/packages/client/src/pages/PortalSettings/categories/storage-management/StyledComponent.js b/packages/client/src/pages/PortalSettings/categories/storage-management/StyledComponent.js
index cd59ccbd88..94a5c694af 100644
--- a/packages/client/src/pages/PortalSettings/categories/storage-management/StyledComponent.js
+++ b/packages/client/src/pages/PortalSettings/categories/storage-management/StyledComponent.js
@@ -220,6 +220,7 @@ const StyledMainInfo = styled.div`
   display: flex;
   flex-wrap: wrap;
   background: ${(props) => props.theme.client.settings.payment.backgroundColor};
+  border-radius: 6px;
 
   column-gap: 24px;
   row-gap: 12px;
diff --git a/packages/shared/themes/base.ts b/packages/shared/themes/base.ts
index 9c21b461e4..2dc1399172 100644
--- a/packages/shared/themes/base.ts
+++ b/packages/shared/themes/base.ts
@@ -1012,7 +1012,7 @@ export const getBaseTheme = () => {
       maxWidth: "340px",
       color: white,
       textColor: black,
-      backgroundColor: "#f8f7bf",
+      backgroundColor: "#F8F9F9",
 
       before: {
         border: "none",