diff --git a/apps/dashboard/src/app/globals.css b/apps/dashboard/src/app/globals.css
index 43e328de4..78711bdac 100644
--- a/apps/dashboard/src/app/globals.css
+++ b/apps/dashboard/src/app/globals.css
@@ -34,10 +34,10 @@
     --success: 120 40% 50%;
     --success-foreground: 0 0% 98%;
 
-    --border: 240 5.9% 90%;
-    --border-in-card: 240 5.9% 90%;
-    --input: 240 5.9% 90%;
-    --input-in-card: 240 5.9% 90%;
+    --border: 240 5.9% 80%;
+    --border-in-card: 240 5.9% 80%;
+    --input: 240 5.9% 80%;
+    --input-in-card: 240 5.9% 80%;
     --ring: 240 10% 3.9%;
 
     --radius: 0.5rem;
@@ -74,14 +74,54 @@
     --success: 120 40% 50%;
     --success-foreground: 0 0% 98%;
 
-    --border: 240 3.7% 15.9%;
-    --border-in-card: 240 3.7% 23.9%;
-    --input: 240 3.7% 15.9%;
-    --input-in-card: 240 3.7% 23.9%;
+    --border: 240 3.7% 35.9%;
+    --border-in-card: 240 3.7% 43.9%;
+    --input: 240 3.7% 25.9%;
+    --input-in-card: 240 3.7% 43.9%;
     --ring: 240 4.9% 83.9%;
   }
 }
 
+.stack-scope {
+  --background: inherit !important;
+  --foreground: inherit !important;
+
+  --card: inherit !important;
+  --card-foreground: inherit !important;
+
+  --popover: inherit !important;
+  --popover-foreground: inherit !important;
+
+  --primary: inherit !important;
+  --primary-foreground: inherit !important;
+
+  --secondary: inherit !important;
+  --secondary-in-card: inherit !important;
+  --secondary-foreground: inherit !important;
+
+  --muted: inherit !important;
+  --muted-in-card: inherit !important;
+  --muted-foreground: inherit !important;
+
+  --accent: inherit !important;
+  --accent-in-card: inherit !important;
+  --accent-foreground: inherit !important;
+
+  --destructive: inherit !important;
+  --destructive-foreground: inherit !important;
+
+  --success: inherit !important;
+  --success-foreground: inherit !important;
+
+  --border: inherit !important;
+  --border-in-card: inherit !important;
+  --input: inherit !important;
+  --input-in-card: inherit !important;
+  --ring: inherit !important;
+
+  --radius: inherit !important;
+}
+
 @layer base {
   * {
     @apply border-border;
diff --git a/apps/dashboard/src/components/payments/stripe-theme-variables.ts b/apps/dashboard/src/components/payments/stripe-theme-variables.ts
index eafc5baab..c7337a3ce 100644
--- a/apps/dashboard/src/components/payments/stripe-theme-variables.ts
+++ b/apps/dashboard/src/components/payments/stripe-theme-variables.ts
@@ -3,14 +3,14 @@ const darkAppearanceVariables = {
   colorText: "hsl(0, 0%, 98%)",
   colorBackground: "hsl(240, 10%, 3.9%)",
   colorSecondaryText: "hsl(240, 5%, 64.9%)",
-  colorBorder: "hsl(240, 3.7%, 15.9%)",
+  colorBorder: "hsl(240, 3.7%, 35.9%)",
   buttonSecondaryColorBackground: "hsl(240, 3.7%, 15.9%)",
   buttonSecondaryColorText: "hsl(0, 0%, 98%)",
   actionSecondaryColorText: "hsl(0, 0%, 98%)",
   actionSecondaryTextDecorationColor: "hsl(0, 0%, 98%)",
   colorDanger: "hsl(0, 62.8%, 50%)",
   badgeNeutralColorBackground: "hsl(240, 3.7%, 15.9%)",
-  badgeNeutralColorBorder: "hsl(240, 3.7%, 15.9%)",
+  badgeNeutralColorBorder: "hsl(240, 3.7%, 35.9%)",
   badgeNeutralColorText: "hsl(240, 5%, 64.9%)",
   badgeSuccessColorBackground: "hsl(120, 40%, 15%)",
   badgeSuccessColorBorder: "hsl(120, 40%, 25%)",