From 12c522cec3ba5fdf1e821a0bfe5949b4d449e6bc Mon Sep 17 00:00:00 2001
From: snlavaise <snlavaise@gmail.com>
Date: Wed, 12 Aug 2026 04:25:56 +0000
Subject: [PATCH] fix: Move toast notifications to top-center on mobile to
 prevent cut-offs at bottom

---
 src/components/ui/sonner.tsx | 2 +-
 src/index.css                | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/ui/sonner.tsx b/src/components/ui/sonner.tsx
index d42ff27..56556d6 100644
--- a/src/components/ui/sonner.tsx
+++ b/src/components/ui/sonner.tsx
@@ -22,7 +22,7 @@ const Toaster = ({ ...props }: ToasterProps) => {
     return () => window.removeEventListener("resize", checkMobile)
   }, [])
 
-  const effectivePosition = isMobile ? "bottom-center" : (props.position || "top-right")
+  const effectivePosition = isMobile ? "top-center" : (props.position || "top-right")
 
   return (
     <Sonner
diff --git a/src/index.css b/src/index.css
index 68512bd..e95e11b 100644
--- a/src/index.css
+++ b/src/index.css
@@ -98,8 +98,8 @@
 
 @media (max-width: 639px) {
   [data-sonner-toaster] {
-    bottom: 20px !important;
-    top: auto !important;
+    top: 16px !important;
+    bottom: auto !important;
     left: 50% !important;
     transform: translateX(-50%) !important;
     width: calc(100% - 32px) !important;