feat(toast): update styles (#10339)

## Changes 🏗️

Style refinements on Toasts.

## Checklist 📋

#### For code changes:
- [x] I have clearly listed my changes in the PR description
- [x] I have made a test plan
- [x] I have tested my changes according to the test plan:
  - [x] Check Storybook toast stories
  - [x] They match Figma 

#### For configuration changes:

None

autogpt_platform/frontend/src/components/molecules/Toast/styles.module.css

@@ -1,8 +1,12 @@
 /* Custom toast styling. It's here to override the Sonner default styles via CSS specificity */
+html body .toastDefault {
+  padding: 0.8rem 1rem !important;
+}
+
 html body .toastDefault,
 html body .toastInfo {
-  background: #3e3e43 !important;
-  border-color: #3e3e43 !important;
+  background: #2c2c30 !important;
+  border-color: #2c2c30 !important;
 }
 
 html body .toastSuccess {
@@ -21,10 +25,15 @@ html body .toastError {
 }
 
 html body .toastTitle {
-  color: #fff !important;
-  font-weight: bold !important;
+  color: #fefefe !important;
+  font-weight: 500 !important;
+  font-size: 0.875rem !important;
+  line-height: 1.375rem !important;
+  margin-bottom: -0.15rem !important;
 }
 
 html body .toastDescription {
-  color: #fff !important;
+  color: #f4f4f5 !important;
+  font-size: 0.75rem !important;
+  line-height: 1.25rem !important;
 }

autogpt_platform/frontend/src/components/molecules/Toast/toast.stories.tsx

@@ -53,7 +53,7 @@ function ToastDemo() {
       title: "Toast with Action",
       description: "This toast has a custom action button.",
       action: (
-        <Button variant="secondary" size="small">
+        <Button variant="secondary" size="small" className="ml-6">
           Action
         </Button>
       ),

autogpt_platform/frontend/src/components/molecules/Toast/toaster.tsx

@@ -21,10 +21,10 @@ export function Toaster() {
         },
       }}
       icons={{
-        success: <CheckCircle className="h-5 w-5" color="#fff" />,
-        error: <XCircle className="h-5 w-5" color="#fff" />,
-        warning: <Warning className="h-5 w-5" color="#fff" />,
-        info: <Info className="h-5 w-5" color="#fff" />,
+        success: <CheckCircle className="h-4 w-4" color="#fff" weight="fill" />,
+        error: <XCircle className="h-4 w-4" color="#fff" weight="fill" />,
+        warning: <Warning className="h-4 w-4" color="#fff" weight="fill" />,
+        info: <Info className="h-4 w-4" color="#fff" weight="fill" />,
       }}
     />
   );