x

apps/spa/src/components/Navbar.tsx

@@ -15,9 +15,10 @@ import { useMenuStore } from '../store/menuStore'
 interface NavbarProps {
   categories?: Category[]
   topOffsetClassName?: string
+  isTransparent?: boolean
 }
 
-export default function Navbar({ topOffsetClassName = 'top-0' }: NavbarProps) {
+export default function Navbar({ topOffsetClassName = 'top-0', isTransparent = false }: NavbarProps) {
   const isDesktop = useMediaQuery('(min-width: 768px)')
   
   const [searchOpen, setSearchOpen] = useState(false)
@@ -147,12 +148,18 @@ export default function Navbar({ topOffsetClassName = 'top-0' }: NavbarProps) {
 
   const logoUrl = settings?.logoUrl || ''
 
+  const shouldBeTransparent = isTransparent && !scrolled && !mobileOpen && !searchOpen && !langSheetOpen
+
   return (
     <>
       <nav
         ref={navRef}
-        className={`fixed ${finalTopClassName} z-50 w-full border-b border-pop-black/10 transition-all duration-300 ${
-          scrolled ? 'shadow-lg shadow-pop-black/10 backdrop-blur-xl bg-pop-bg/90' : 'shadow-none bg-pop-bg'
+        className={`fixed ${finalTopClassName} z-50 w-full transition-all duration-300 ${
+          scrolled
+            ? 'border-b border-pop-black/10 shadow-lg shadow-pop-black/10 backdrop-blur-xl bg-pop-bg/90'
+            : shouldBeTransparent
+              ? 'border-transparent shadow-none bg-transparent backdrop-blur-none'
+              : 'border-b border-pop-black/10 shadow-none bg-pop-bg'
         } px-4 py-3.5 md:px-6 md:py-4`}
       >
         {/* Single-row layout: Logo (left) | Menu (center, desktop) | Actions (right) */}