diff --git a/src/components/navagiation/mobile-header.tsx b/src/components/navagiation/mobile-header.tsx
index fcb9195..f853981 100644
--- a/src/components/navagiation/mobile-header.tsx
+++ b/src/components/navagiation/mobile-header.tsx
@@ -1,6 +1,11 @@
 "use client";
 import { usePathname } from "next/navigation";
-import { Sheet, SheetContent, SheetTrigger } from "@/components/ui/sheet";
+import {
+  Sheet,
+  SheetClose,
+  SheetContent,
+  SheetTrigger,
+} from "@/components/ui/sheet";
 import { Button, buttonVariants } from "@/components/ui/button";
 import { Icons } from "@/components/icons";
 import { header } from "@/config/general";
@@ -21,15 +26,17 @@ export const OpenMobileHeaderButtonAndMobileHeader = () => {
       <SheetContent>
         <nav className="flex flex-col">
           {header.map((navItem) => (
-            <Link href={navItem.url} key={navItem.url}>
-              <Button
-                variant={navItem.url === pathname ? "ghost-hovered" : "ghost"}
-                size="lg"
-                className="items-center"
-              >
-                {navItem.name}
-              </Button>
-            </Link>
+            <SheetClose asChild key={navItem.url}>
+              <Link href={navItem.url}>
+                <Button
+                  variant={navItem.url === pathname ? "ghost-hovered" : "ghost"}
+                  size="lg"
+                  className="items-center"
+                >
+                  {navItem.name}
+                </Button>
+              </Link>
+            </SheetClose>
           ))}
         </nav>
       </SheetContent>