diff --git a/client/src/components/layout/NavHeader.tsx b/client/src/components/layout/NavHeader.tsx
index 7727ed3..b782a80 100644
--- a/client/src/components/layout/NavHeader.tsx
+++ b/client/src/components/layout/NavHeader.tsx
@@ -3,7 +3,6 @@ import { useTheme } from "@/hooks/use-theme";
 import { Search, Moon, Sun, Menu } from "lucide-react";
 import { useState } from "react";
 import { Button } from "@/components/ui/button";
-import { theme as themeStyles } from "@/lib/theme";
 import {
   DropdownMenu,
   DropdownMenuContent,
@@ -16,23 +15,23 @@ export function NavHeader() {
   const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
 
   return (
-    <header className={`navigation-header border-b ${themeStyles.border.muted} bg-background dark:bg-background sticky top-0 z-10 shadow-sm`}>
+    <header className="navigation-header border-b border-border/30 bg-background dark:bg-background sticky top-0 z-10 shadow-sm">
       <div className="flex items-center justify-between px-4 py-3 md:px-6 max-w-[var(--content-width)] mx-auto">
         <div className="flex items-center space-x-4">
-          <Link href="/" className={`font-serif text-2xl font-semibold tracking-tight ${themeStyles.text.heading}`}>
+          <Link href="/" className="font-serif text-2xl font-semibold tracking-tight text-primary dark:text-primary-foreground">
             Tercul
           </Link>
           <nav className="hidden md:flex items-center space-x-6">
-            <Link href="/explore" className={themeStyles.nav.link}>
+            <Link href="/explore" className="text-foreground/80 dark:text-foreground/80 hover:text-primary dark:hover:text-primary/90 transition-colors font-sans text-sm font-medium">
               Explore
             </Link>
-            <Link href="/authors" className={themeStyles.nav.link}>
+            <Link href="/authors" className="text-foreground/80 dark:text-foreground/80 hover:text-primary dark:hover:text-primary/90 transition-colors font-sans text-sm font-medium">
               Authors
             </Link>
-            <Link href="/collections" className={themeStyles.nav.link}>
+            <Link href="/collections" className="text-foreground/80 dark:text-foreground/80 hover:text-primary dark:hover:text-primary/90 transition-colors font-sans text-sm font-medium">
               Collections
             </Link>
-            <Link href="/blog" className={themeStyles.nav.link}>
+            <Link href="/blog" className="text-foreground/80 dark:text-foreground/80 hover:text-primary dark:hover:text-primary/90 transition-colors font-sans text-sm font-medium">
               Blog
             </Link>
           </nav>
@@ -42,7 +41,7 @@ export function NavHeader() {
             <Button 
               variant="ghost" 
               size="icon"
-              className="btn-feedback p-2 rounded-full text-navy/70 dark:text-cream/70 hover:bg-sage/20 dark:hover:bg-sage/20"
+              className="p-2 rounded-full text-foreground/70 dark:text-foreground/70 hover:bg-accent/20 dark:hover:bg-accent/20"
             >
               <Search className="h-5 w-5" />
               <span className="sr-only">Search</span>
@@ -54,7 +53,7 @@ export function NavHeader() {
               <Button 
                 variant="ghost" 
                 size="icon"
-                className="btn-feedback p-2 rounded-full text-navy/70 dark:text-cream/70 hover:bg-sage/20 dark:hover:bg-sage/20"
+                className="p-2 rounded-full text-foreground/70 dark:text-foreground/70 hover:bg-accent/20 dark:hover:bg-accent/20"
               >
                 {theme === 'dark' ? (
                   <Moon className="h-5 w-5" />
@@ -77,11 +76,11 @@ export function NavHeader() {
             </DropdownMenuContent>
           </DropdownMenu>
           
-          <div className="h-6 w-px bg-sage/20 dark:bg-sage/20 mx-1"></div>
+          <div className="h-6 w-px bg-accent/20 dark:bg-accent/20 mx-1"></div>
           
           <Link href="/profile">
             <Button
-              className="btn-feedback flex items-center space-x-2 py-1 px-3 text-sm font-sans font-medium rounded-full bg-sage/20 dark:bg-sage/20 text-navy dark:text-cream/90 hover:bg-sage/30 dark:hover:bg-sage/30 transition-colors"
+              className="flex items-center space-x-2 py-1 px-3 text-sm font-sans font-medium rounded-full bg-accent/20 dark:bg-accent/20 text-foreground dark:text-foreground/90 hover:bg-accent/30 dark:hover:bg-accent/30 transition-colors"
             >
               <span>Sign In</span>
             </Button>
@@ -90,7 +89,7 @@ export function NavHeader() {
           <Button 
             variant="ghost" 
             size="icon"
-            className="md:hidden btn-feedback p-2 rounded-full text-navy/70 dark:text-cream/70 hover:bg-sage/20 dark:hover:bg-sage/20"
+            className="md:hidden p-2 rounded-full text-foreground/70 dark:text-foreground/70 hover:bg-accent/20 dark:hover:bg-accent/20"
             onClick={() => setMobileMenuOpen(!mobileMenuOpen)}
           >
             <Menu className="h-5 w-5" />
@@ -100,18 +99,18 @@ export function NavHeader() {
       </div>
       
       {mobileMenuOpen && (
-        <div className="md:hidden px-4 py-3 bg-cream dark:bg-paper border-t border-sage/20 dark:border-sage/20">
+        <div className="md:hidden px-4 py-3 bg-background dark:bg-background border-t border-border/30 dark:border-border/30">
           <nav className="flex flex-col space-y-3">
-            <Link href="/explore" className="text-ink/80 dark:text-cream/80 hover:text-navy dark:hover:text-navy/90 font-sans text-sm font-medium transition-colors">
+            <Link href="/explore" className="text-foreground/80 dark:text-foreground/80 hover:text-primary dark:hover:text-primary/90 font-sans text-sm font-medium transition-colors">
               Explore
             </Link>
-            <Link href="/authors" className="text-ink/80 dark:text-cream/80 hover:text-navy dark:hover:text-navy/90 font-sans text-sm font-medium transition-colors">
+            <Link href="/authors" className="text-foreground/80 dark:text-foreground/80 hover:text-primary dark:hover:text-primary/90 font-sans text-sm font-medium transition-colors">
               Authors
             </Link>
-            <Link href="/collections" className="text-ink/80 dark:text-cream/80 hover:text-navy dark:hover:text-navy/90 font-sans text-sm font-medium transition-colors">
+            <Link href="/collections" className="text-foreground/80 dark:text-foreground/80 hover:text-primary dark:hover:text-primary/90 font-sans text-sm font-medium transition-colors">
               Collections
             </Link>
-            <Link href="/blog" className="text-ink/80 dark:text-cream/80 hover:text-navy dark:hover:text-navy/90 font-sans text-sm font-medium transition-colors">
+            <Link href="/blog" className="text-foreground/80 dark:text-foreground/80 hover:text-primary dark:hover:text-primary/90 font-sans text-sm font-medium transition-colors">
               Blog
             </Link>
           </nav>
diff --git a/client/src/lib/theme.ts b/client/src/lib/theme.ts
deleted file mode 100644
index ec747fa..0000000
--- a/client/src/lib/theme.ts
+++ /dev/null
@@ -1 +0,0 @@
-null
\ No newline at end of file