style(toaster): add default offset settings for desktop and mobile views

- Introduced `DEFAULT_OFFSET` and `DEFAULT_MOBILE_OFFSET` constants to define the positioning of the toaster notifications.
- Updated the `Toaster` component to utilize these new offset settings, enhancing the layout and responsiveness of notifications across different devices.

src/components/ui/sonner.tsx

@@ -1,10 +1,26 @@
 import { Toaster as Sonner, type ToasterProps } from "sonner";
 
+const DEFAULT_OFFSET = {
+  top: "3rem",
+  right: "1.5rem",
+  bottom: "1.5rem",
+  left: "1.5rem",
+} satisfies ToasterProps["offset"];
+
+const DEFAULT_MOBILE_OFFSET = {
+  top: "3rem",
+  right: "1rem",
+  bottom: "1rem",
+  left: "1rem",
+} satisfies ToasterProps["mobileOffset"];
+
 const Toaster = ({ ...props }: ToasterProps) => {
   return (
     <Sonner
       theme="dark"
       position="top-right"
+      offset={DEFAULT_OFFSET}
+      mobileOffset={DEFAULT_MOBILE_OFFSET}
       className="toaster group"
       richColors
       style={