diff --git a/src/app/cart/page.tsx b/src/app/cart/page.tsx
index aa242ac..9030e4d 100644
--- a/src/app/cart/page.tsx
+++ b/src/app/cart/page.tsx
@@ -24,15 +24,17 @@ export default function CartPage() {
   const subtotal = cartItems.reduce((acc, item) => acc + item.price * item.quantity, 0);
 
   return (
-    <ThemeProvider>
-        <NavbarLayoutFloatingOverlay
-            navItems={[
-                { name: "Home", id: "/" },
-                { name: "Menu", id: "/#menu" },
-                { name: "Cart", id: "/cart" },
-            ]}
-            brandName="FreshEats"
-        />
+    <ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
+        <div id="nav" data-section="nav">
+            <NavbarLayoutFloatingOverlay
+                navItems={[
+                    { name: "Home", id: "/" },
+                    { name: "Menu", id: "/#menu" },
+                    { name: "Cart", id: "/cart" },
+                ]}
+                brandName="FreshEats"
+            />
+        </div>
         <main className="container mx-auto py-24 px-6">
             <h1 className="text-4xl font-light mb-12">Your Cart</h1>
             <div className="grid lg:grid-cols-3 gap-12">
diff --git a/src/app/checkout/page.tsx b/src/app/checkout/page.tsx
index 3cc86f3..743dda6 100644
--- a/src/app/checkout/page.tsx
+++ b/src/app/checkout/page.tsx
@@ -43,6 +43,7 @@ export default function CheckoutPage() {
             ]}
             textarea={{ name: "notes", placeholder: "Order Summary & Instructions" }}
             buttonText="Confirm Order"
+            useInvertedBackground={false}
           />
         </div>
 
@@ -58,4 +59,4 @@ export default function CheckoutPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}
\ No newline at end of file
diff --git a/src/app/orders/page.tsx b/src/app/orders/page.tsx
index 9716f37..06efc29 100644
--- a/src/app/orders/page.tsx
+++ b/src/app/orders/page.tsx
@@ -6,15 +6,17 @@ import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatin
 
 export default function OrdersPage() {
   return (
-    <ThemeProvider>
+    <ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
       <ReactLenis root>
-        <NavbarLayoutFloatingOverlay
-            navItems={[
-                { name: "Home", id: "/" },
-                { name: "Orders", id: "/orders" },
-            ]}
-            brandName="FreshEats"
-        />
+        <div id="nav" data-section="nav">
+            <NavbarLayoutFloatingOverlay
+                navItems={[
+                    { name: "Home", id: "/" },
+                    { name: "Orders", id: "/orders" },
+                ]}
+                brandName="FreshEats"
+            />
+        </div>
         <div className="min-h-screen pt-32 px-6 flex flex-col items-center">
           <h1 className="text-4xl font-bold mb-8">Your Orders</h1>
           <div className="w-full max-w-4xl p-8 rounded-xl border border-white/10 bg-white/5">