diff --git a/src/app/admin/page.tsx b/src/app/admin/page.tsx
index 2ae3c82..9fcd7ce 100644
--- a/src/app/admin/page.tsx
+++ b/src/app/admin/page.tsx
@@ -49,6 +49,7 @@ export default function AdminPage() {
             title="Admin Panel"
             description="Manage your platform's users, content, settings, and subscriptions efficiently."
             className="container"
+            textboxLayout="default"
           >
             <div className="flex flex-col items-start gap-4 p-6 bg-card text-foreground rounded-lg shadow-lg">
               <Users className="w-8 h-8 text-primary-cta" />
diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx
index 2177e93..45f2bef 100644
--- a/src/app/dashboard/page.tsx
+++ b/src/app/dashboard/page.tsx
@@ -7,6 +7,7 @@ import FooterSimple from '@/components/sections/footer/FooterSimple';
 import ProductCatalog from '@/components/ecommerce/productCatalog/ProductCatalog';
 import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
 import { LayoutDashboard } from "lucide-react"; // Import necessary icons
+import { ThemeProviderProps, CTAButtonVariant, AnimationType, BorderRadiusPreset, ContentWidthPreset, SizingPreset, BackgroundType, CardStyleVariant, PrimaryButtonStyleVariant, SecondaryButtonStyleVariant, HeadingFontWeight } from "@/providers/themeProvider/config/types";
 
 export default function DashboardPage() {
   const commonNavItems = [
@@ -21,8 +22,9 @@ export default function DashboardPage() {
     { name: "Contact", id: "#contact" },
   ];
 
-  const themeProps = { // Copy from src/app/page.tsx
-    defaultButtonVariant: "bounce-effect",    defaultTextAnimation: "entrance-slide",    borderRadius: "soft",    contentWidth: "compact",    sizing: "largeSmallSizeMediumTitles",    background: "fluid",    cardStyle: "inset",    primaryButtonStyle: "radial-glow",    secondaryButtonStyle: "layered",    headingFontWeight: "semibold"};
+  const themeProps: ThemeProviderProps = { // Copy from src/app/page.tsx
+    defaultButtonVariant: "bounce-effect",    defaultTextAnimation: "entrance-slide",    borderRadius: "soft",    contentWidth: "compact",    sizing: "largeSmallSizeMediumTitles",    background: "fluid",    cardStyle: "inset",    primaryButtonStyle: "radial-glow",    secondaryButtonStyle: "layered",    headingFontWeight: "semibold"
+  };
 
   const dummyWatchlistProducts = [
     { id: "crypto1", name: "Bitcoin", category: "Cryptocurrency", price: "$65,000", rating: 5, reviewCount: "10k+", imageSrc: "http://img.b2bpic.net/free-vector/bitcoin-symbol-cryptocurrency-blockchain-technology-background_1017-32766.jpg" },
@@ -66,8 +68,6 @@ export default function DashboardPage() {
           <ProductCatalog
             layout="section"
             products={dummyWatchlistProducts}
-            title="Your Watchlist"
-            searchPlaceholder="Search your watchlist..."
           />
         </div>
 
diff --git a/src/app/login/page.tsx b/src/app/login/page.tsx
index 0b0205d..579190a 100644
--- a/src/app/login/page.tsx
+++ b/src/app/login/page.tsx
@@ -65,7 +65,6 @@ export default function LoginPage() {
                   <label htmlFor="email-address" className="sr-only">Email address</label>
                   <Input
                     id="email-address"
-                    name="email"
                     type="email"
                     required
                     placeholder="Email address"
@@ -78,7 +77,6 @@ export default function LoginPage() {
                   <label htmlFor="password" className="sr-only">Password</label>
                   <Input
                     id="password"
-                    name="password"
                     type="password"
                     required
                     placeholder="Password"
diff --git a/src/app/profile/page.tsx b/src/app/profile/page.tsx
index 454905a..50aef54 100644
--- a/src/app/profile/page.tsx
+++ b/src/app/profile/page.tsx
@@ -7,6 +7,7 @@ import FooterSimple from '@/components/sections/footer/FooterSimple';
 import SplitAbout from '@/components/sections/about/SplitAbout';
 import ContactCTA from '@/components/sections/contact/ContactCTA';
 import { User, ShieldCheck, Mail, Settings2 } from "lucide-react"; // Import necessary icons
+import { ThemeProviderProps, CTAButtonVariant, AnimationType, BorderRadiusPreset, ContentWidthPreset, SizingPreset, BackgroundType, CardStyleVariant, PrimaryButtonStyleVariant, SecondaryButtonStyleVariant, HeadingFontWeight } from "@/providers/themeProvider/config/types";
 
 export default function ProfilePage() {
   const commonNavItems = [
@@ -21,8 +22,9 @@ export default function ProfilePage() {
     { name: "Contact", id: "#contact" },
   ];
 
-  const themeProps = { // Copy from src/app/page.tsx
-    defaultButtonVariant: "bounce-effect",    defaultTextAnimation: "entrance-slide",    borderRadius: "soft",    contentWidth: "compact",    sizing: "largeSmallSizeMediumTitles",    background: "fluid",    cardStyle: "inset",    primaryButtonStyle: "radial-glow",    secondaryButtonStyle: "layered",    headingFontWeight: "semibold"};
+  const themeProps: ThemeProviderProps = { // Copy from src/app/page.tsx
+    defaultButtonVariant: "bounce-effect",    defaultTextAnimation: "entrance-slide",    borderRadius: "soft",    contentWidth: "compact",    sizing: "largeSmallSizeMediumTitles",    background: "fluid",    cardStyle: "inset",    primaryButtonStyle: "radial-glow",    secondaryButtonStyle: "layered",    headingFontWeight: "semibold"
+  };
 
   return (
     <ThemeProvider {...themeProps}>
diff --git a/src/app/register/page.tsx b/src/app/register/page.tsx
index 0ecd628..2747f09 100644
--- a/src/app/register/page.tsx
+++ b/src/app/register/page.tsx
@@ -70,7 +70,6 @@ export default function RegisterPage() {
                   <label htmlFor="email-address" className="sr-only">Email address</label>
                   <Input
                     id="email-address"
-                    name="email"
                     type="email"
                     required
                     placeholder="Email address"
@@ -83,7 +82,6 @@ export default function RegisterPage() {
                   <label htmlFor="password" className="sr-only">Password</label>
                   <Input
                     id="password"
-                    name="password"
                     type="password"
                     required
                     placeholder="Password"
@@ -96,7 +94,6 @@ export default function RegisterPage() {
                   <label htmlFor="confirm-password" className="sr-only">Confirm Password</label>
                   <Input
                     id="confirm-password"
-                    name="confirm-password"
                     type="password"
                     required
                     placeholder="Confirm Password"