diff --git a/src/components/react-hook-form/utils/cancel-button.js b/src/components/react-hook-form/utils/cancel-button.js
index 608688ac..a6727251 100644
--- a/src/components/react-hook-form/utils/cancel-button.js
+++ b/src/components/react-hook-form/utils/cancel-button.js
@@ -2,23 +2,18 @@ import React from 'react';
 import { Button } from '@mui/material';
 import { FormattedMessage } from 'react-intl';
 
-const styles = {
-    removeButtonTextColor: (theme) => ({
-        color: theme.palette.text.primary,
-    }),
-};
 const CancelButton = ({
     onClick,
     variant,
     disabled,
-    withCustomColor = true,
+    withCustomColor = false,
 }) => {
     return (
         <Button
             onClick={onClick}
             variant={variant}
             disabled={disabled}
-            sx={withCustomColor ? styles.removeButtonTextColor : null}
+            color={withCustomColor ? 'primary' : 'secondary'}
         >
             <FormattedMessage id="cancel" />
         </Button>