diff --git a/src/app/globals.css b/src/app/globals.css
index 5d0f6cb58..26d5320b4 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -8,10 +8,10 @@
 			90deg,
 			theme(colors.white) 0%,
 			theme(colors.white) 50%,
-			theme(colors.slate.300) calc(50%),
-			theme(colors.slate.300) calc(50% + 1px),
-			theme(colors.slate.50) calc(50% + 1px),
-			theme(colors.slate.50) 100%
+			theme(colors.gray.300) calc(50%),
+			theme(colors.gray.300) calc(50% + 1px),
+			theme(colors.gray.50) calc(50% + 1px),
+			theme(colors.gray.50) 100%
 		);
 	}
 }
diff --git a/src/checkout/hooks/useAlerts/consts.ts b/src/checkout/hooks/useAlerts/consts.ts
index 1cc5d1d84..a0ea5931b 100644
--- a/src/checkout/hooks/useAlerts/consts.ts
+++ b/src/checkout/hooks/useAlerts/consts.ts
@@ -2,7 +2,7 @@ import clsx from "clsx";
 import { type TypeOptions } from "react-toastify";
 
 export const alertsContainerProps = {
-	toastClassName: "rounded shadow-none mb-2 p-0 flex font-sans text-base text-slate-900 min-h-0 bg-white",
+	toastClassName: "rounded shadow-none mb-2 p-0 flex font-sans text-base text-gray-900 min-h-0 bg-white",
 	bodyClassName: (data?: { type?: TypeOptions }) =>
 		clsx("flex w-full items-start px-5 py-3", {
 			["bg-red-400"]: data?.type === "error",