diff --git a/app/help/page.tsx b/app/help/page.tsx
index 5dd39e7..a86e3e8 100644
--- a/app/help/page.tsx
+++ b/app/help/page.tsx
@@ -172,11 +172,11 @@ export default function HelpPage() {
                 ? "text-yellow-400 fill-yellow-400"
                 : i === fullStars && hasHalfStar
                   ? "text-yellow-400 fill-yellow-400"
-                  : "text-slate-300"
+                  : "text-slate-300 dark:text-slate-600"
             }`}
           />
         ))}
-        <span className="ml-1 text-sm text-slate-600">{rating.toFixed(1)}</span>
+        <span className="ml-1 text-sm text-slate-600 dark:text-slate-400">{rating.toFixed(1)}</span>
       </div>
     )
   }
@@ -194,15 +194,15 @@ export default function HelpPage() {
     <div className="container mx-auto p-4 md:p-6">
       <div className="max-w-5xl mx-auto">
         <div className="text-center mb-8">
-          <h1 className="text-3xl font-bold text-navy-900">Find Legal Help</h1>
-          <p className="text-slate-600 mt-2">Connect with legal aid providers, lawyers, and clinics across India</p>
+          <h1 className="text-3xl font-bold text-navy-900 dark:text-white">Find Legal Help</h1>
+          <p className="text-slate-600 dark:text-slate-400 mt-2">Connect with legal aid providers, lawyers, and clinics across India</p>
         </div>
 
         {/* Search and Filters */}
-        <div className="bg-white rounded-2xl p-6 shadow-sm mb-8">
+        <div className="bg-white dark:bg-slate-800 rounded-2xl p-6 shadow-sm mb-8">
           <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
             <div className="relative">
-              <Search className="absolute left-2.5 top-2.5 h-4 w-4 text-slate-500" />
+              <Search className="absolute left-2.5 top-2.5 h-4 w-4 text-slate-500 dark:text-slate-400" />
               <Input
                 placeholder="Search by name, specialization, or location..."
                 className="pl-8"
@@ -213,7 +213,7 @@ export default function HelpPage() {
             </div>
 
             <div className="flex items-center space-x-2">
-              <Filter className="h-4 w-4 text-slate-500" />
+              <Filter className="h-4 w-4 text-slate-500 dark:text-slate-400" />
               <Select value={stateFilter} onValueChange={setStateFilter}>
                 <SelectTrigger>
                   <SelectValue placeholder="Filter by state" />
@@ -230,7 +230,7 @@ export default function HelpPage() {
             </div>
 
             <div className="flex items-center space-x-2">
-              <Filter className="h-4 w-4 text-slate-500" />
+              <Filter className="h-4 w-4 text-slate-500 dark:text-slate-400" />
               <Select value={typeFilter} onValueChange={setTypeFilter}>
                 <SelectTrigger>
                   <SelectValue placeholder="Filter by type" />
@@ -289,8 +289,8 @@ export default function HelpPage() {
                         <AvatarFallback>{provider.name.charAt(0)}</AvatarFallback>
                       </Avatar>
                       <div>
-                        <CardTitle className="text-xl">{provider.name}</CardTitle>
-                        <CardDescription>
+                        <CardTitle className="text-xl dark:text-white">{provider.name}</CardTitle>
+                        <CardDescription className="dark:text-slate-400">
                           <Badge variant="outline" className="mr-1">
                             {provider.type}
                           </Badge>
@@ -303,9 +303,9 @@ export default function HelpPage() {
                     <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
                       <div className="space-y-2">
                         <div className="flex items-start">
-                          <MapPin className="h-4 w-4 text-slate-500 mt-0.5 mr-2" />
+                          <MapPin className="h-4 w-4 text-slate-500 dark:text-slate-400 mt-0.5 mr-2" />
                           <div>
-                            <p className="text-sm text-slate-700">
+                            <p className="text-sm text-slate-700 dark:text-slate-300">
                               {provider.location}, {provider.state}
                             </p>
                           </div>
@@ -313,22 +313,22 @@ export default function HelpPage() {
 
                         {provider.contact.phone && (
                           <div className="flex items-start">
-                            <Phone className="h-4 w-4 text-slate-500 mt-0.5 mr-2" />
-                            <p className="text-sm text-slate-700">{provider.contact.phone}</p>
+                            <Phone className="h-4 w-4 text-slate-500 dark:text-slate-400 mt-0.5 mr-2" />
+                            <p className="text-sm text-slate-700 dark:text-slate-300">{provider.contact.phone}</p>
                           </div>
                         )}
 
                         {provider.contact.email && (
                           <div className="flex items-start">
-                            <Mail className="h-4 w-4 text-slate-500 mt-0.5 mr-2" />
-                            <p className="text-sm text-slate-700">{provider.contact.email}</p>
+                            <Mail className="h-4 w-4 text-slate-500 dark:text-slate-400 mt-0.5 mr-2" />
+                            <p className="text-sm text-slate-700 dark:text-slate-300">{provider.contact.email}</p>
                           </div>
                         )}
                       </div>
 
                       <div className="space-y-2">
                         <div>
-                          <p className="text-sm font-medium text-slate-700">Specialization</p>
+                          <p className="text-sm font-medium text-slate-700 dark:text-slate-300">Specialization</p>
                           <div className="flex flex-wrap gap-1 mt-1">
                             {provider.specialization.map((spec, i) => (
                               <Badge key={i} variant="secondary" className="text-xs">
@@ -339,13 +339,13 @@ export default function HelpPage() {
                         </div>
 
                         <div>
-                          <p className="text-sm font-medium text-slate-700">Languages</p>
-                          <p className="text-sm text-slate-600">{provider.languages.join(", ")}</p>
+                          <p className="text-sm font-medium text-slate-700 dark:text-slate-300">Languages</p>
+                          <p className="text-sm text-slate-600 dark:text-slate-400">{provider.languages.join(", ")}</p>
                         </div>
 
                         <div>
-                          <p className="text-sm font-medium text-slate-700">Availability</p>
-                          <p className="text-sm text-slate-600">{provider.availability}</p>
+                          <p className="text-sm font-medium text-slate-700 dark:text-slate-300">Availability</p>
+                          <p className="text-sm text-slate-600 dark:text-slate-400">{provider.availability}</p>
                         </div>
                       </div>
                     </div>
@@ -356,25 +356,25 @@ export default function HelpPage() {
             ))
           ) : (
             <div className="text-center py-12">
-              <p className="text-slate-500">No legal help providers found matching your criteria.</p>
-              <p className="text-slate-500 mt-2">Try adjusting your search or filters.</p>
+              <p className="text-slate-500 dark:text-slate-400">No legal help providers found matching your criteria.</p>
+              <p className="text-slate-500 dark:text-slate-400 mt-2">Try adjusting your search or filters.</p>
             </div>
           )}
         </div>
 
         {/* Additional Information */}
-        <div className="mt-12 bg-slate-50 rounded-2xl p-6">
-          <h2 className="text-xl font-semibold text-navy-900 mb-4">Need Immediate Legal Assistance?</h2>
-          <p className="text-slate-700 mb-4">
+        <div className="mt-12 bg-slate-50 dark:bg-slate-800 rounded-2xl p-6">
+          <h2 className="text-xl font-semibold text-navy-900 dark:text-white mb-4">Need Immediate Legal Assistance?</h2>
+          <p className="text-slate-700 dark:text-slate-300 mb-4">
             If you're facing an emergency legal situation, you can contact the National Legal Services Authority (NALSA)
-            helpline at <span className="font-medium">1516</span> for free legal aid and advice.
+            helpline at <span className="font-medium text-slate-900 dark:text-white">1516</span> for free legal aid and advice.
           </p>
-          <p className="text-slate-700">
-            For women in distress, the Women Helpline number is <span className="font-medium">1091</span> or{" "}
-            <span className="font-medium">181</span>.
+          <p className="text-slate-700 dark:text-slate-300">
+            For women in distress, the Women Helpline number is <span className="font-medium text-slate-900 dark:text-white">1091</span> or{" "}
+            <span className="font-medium text-slate-900 dark:text-white">181</span>.
           </p>
         </div>
       </div>
     </div>
   )
-}
+}
\ No newline at end of file
diff --git a/app/page.tsx b/app/page.tsx
index a8eedc7..ea2b0dc 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -12,19 +12,19 @@ import { TestimonialCard } from "@/components/testimonial-card"
 export default function LandingPage() {
   const features = [
     {
-      icon: <MessageSquare className="h-10 w-10 text-blue-600" />,
+      icon: <MessageSquare className="h-10 w-10 text-blue-600 dark:text-blue-400" />,
       title: "AI Legal Chatbot",
       description: "Get instant answers to your legal questions from our AI-powered chatbot.",
       link: "/chat",
     },
     {
-      icon: <Search className="h-10 w-10 text-blue-600" />,
+      icon: <Search className="h-10 w-10 text-blue-600 dark:text-blue-400" />,
       title: "Case Tracker",
       description: "Track your legal cases in real-time with updates on status and next steps.",
       link: "/dashboard",
     },
     {
-      icon: <Scale className="h-10 w-10 text-blue-600" />,
+      icon: <Scale className="h-10 w-10 text-blue-600 dark:text-blue-400" />,
       title: "Legal Rights Visualizer",
       description: "Understand your legal rights in simple language with interactive visualizations.",
       link: "/rights",
@@ -58,7 +58,7 @@ export default function LandingPage() {
   return (
     <div className="flex flex-col min-h-screen">
       {/* Hero Section */}
-      <section className="w-full py-12 md:py-24 lg:py-32 bg-gradient-to-b from-slate-50 to-white">
+      <section className="w-full py-12 md:py-24 lg:py-32 bg-gradient-to-b from-slate-50 to-white dark:from-slate-900 dark:to-slate-800">
         <div className="container px-4 md:px-6">
           <div className="grid gap-6 lg:grid-cols-2 lg:gap-12 items-center">
             <motion.div
@@ -68,22 +68,22 @@ export default function LandingPage() {
               transition={{ duration: 0.5 }}
             >
               <div className="space-y-2">
-                <h1 className="text-3xl font-bold tracking-tighter sm:text-5xl xl:text-6xl/none text-navy-900">
+                <h1 className="text-3xl font-bold tracking-tighter sm:text-5xl xl:text-6xl/none text-navy-900 dark:text-slate-100">
                   Simplifying Legal Access for All Indians
                 </h1>
-                <p className="max-w-[600px] text-slate-700 md:text-xl">
+                <p className="max-w-[600px] text-slate-700 dark:text-slate-300 md:text-xl">
                   LegalEase makes the justice system accessible through AI-powered tools, plain language explanations,
                   and personalized guidance.
                 </p>
               </div>
               <div className="flex flex-col gap-2 min-[400px]:flex-row">
-                <Button asChild size="lg" className="bg-teal-600 hover:bg-teal-700">
+                <Button asChild size="lg" className="bg-teal-600 hover:bg-teal-700 dark:bg-teal-500 dark:hover:bg-teal-600">
                   <Link href="/chat">
                     Get Started Free
                     <ArrowRight className="ml-2 h-4 w-4" />
                   </Link>
                 </Button>
-                <Button asChild variant="outline" size="lg">
+                <Button asChild variant="outline" size="lg" className="border-slate-300 dark:border-slate-600 text-slate-700 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-700">
                   <Link href="/help">Find Legal Help</Link>
                 </Button>
               </div>
@@ -99,7 +99,7 @@ export default function LandingPage() {
                 width={500}
                 height={500}
                 alt="Legal assistance illustration"
-                className="rounded-2xl"
+                className="rounded-2xl shadow-lg dark:shadow-slate-800/50"
               />
             </motion.div>
           </div>
@@ -107,7 +107,7 @@ export default function LandingPage() {
       </section>
 
       {/* Mission Statement */}
-      <section className="w-full py-12 md:py-16 bg-white">
+      <section className="w-full py-12 md:py-16 bg-white dark:bg-slate-900">
         <div className="container px-4 md:px-6">
           <motion.div
             className="mx-auto text-center space-y-4 max-w-[800px]"
@@ -116,8 +116,8 @@ export default function LandingPage() {
             viewport={{ once: true }}
             transition={{ duration: 0.5 }}
           >
-            <h2 className="text-2xl font-bold tracking-tighter sm:text-3xl text-navy-900">Our Mission</h2>
-            <p className="text-slate-700 md:text-xl">
+            <h2 className="text-2xl font-bold tracking-tighter sm:text-3xl text-navy-900 dark:text-slate-100">Our Mission</h2>
+            <p className="text-slate-700 dark:text-slate-300 md:text-xl">
               We believe that legal knowledge should be accessible to everyone, not just those who can afford expensive
               lawyers. LegalEase uses AI and plain language to demystify the legal system, empowering citizens to
               understand and exercise their rights.
@@ -127,12 +127,12 @@ export default function LandingPage() {
       </section>
 
       {/* Features */}
-      <section className="w-full py-12 md:py-24 bg-slate-50">
+      <section className="w-full py-12 md:py-24 bg-slate-50 dark:bg-slate-800">
         <div className="container px-4 md:px-6">
           <div className="flex flex-col items-center justify-center space-y-4 text-center">
             <div className="space-y-2">
-              <h2 className="text-3xl font-bold tracking-tighter sm:text-4xl text-navy-900">Core Features</h2>
-              <p className="max-w-[700px] text-slate-700 md:text-xl">
+              <h2 className="text-3xl font-bold tracking-tighter sm:text-4xl text-navy-900 dark:text-slate-100">Core Features</h2>
+              <p className="max-w-[700px] text-slate-700 dark:text-slate-300 md:text-xl">
                 Powerful tools designed to simplify your legal journey
               </p>
             </div>
@@ -146,14 +146,14 @@ export default function LandingPage() {
                 viewport={{ once: true }}
                 transition={{ duration: 0.5, delay: index * 0.1 }}
               >
-                <Card className="h-full transition-all hover:shadow-lg">
+                <Card className="h-full transition-all hover:shadow-lg dark:hover:shadow-slate-700/50 bg-white dark:bg-slate-700 border-slate-200 dark:border-slate-600">
                   <CardHeader>
-                    <div className="p-2 rounded-full bg-blue-50 w-fit mb-4">{feature.icon}</div>
-                    <CardTitle className="text-xl">{feature.title}</CardTitle>
-                    <CardDescription className="text-slate-700">{feature.description}</CardDescription>
+                    <div className="p-2 rounded-full bg-blue-50 dark:bg-blue-900/30 w-fit mb-4">{feature.icon}</div>
+                    <CardTitle className="text-xl text-slate-900 dark:text-slate-100">{feature.title}</CardTitle>
+                    <CardDescription className="text-slate-700 dark:text-slate-300">{feature.description}</CardDescription>
                   </CardHeader>
                   <CardContent>
-                    <Button asChild variant="ghost" className="group">
+                    <Button asChild variant="ghost" className="group text-slate-700 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-600">
                       <Link href={feature.link}>
                         Explore
                         <ArrowRight className="ml-2 h-4 w-4 transition-transform group-hover:translate-x-1" />
@@ -168,12 +168,12 @@ export default function LandingPage() {
       </section>
 
       {/* Testimonials */}
-      <section className="w-full py-12 md:py-24 bg-white">
+      <section className="w-full py-12 md:py-24 bg-white dark:bg-slate-900">
         <div className="container px-4 md:px-6">
           <div className="flex flex-col items-center justify-center space-y-4 text-center">
             <div className="space-y-2">
-              <h2 className="text-3xl font-bold tracking-tighter sm:text-4xl text-navy-900">What Our Users Say</h2>
-              <p className="max-w-[700px] text-slate-700 md:text-xl">
+              <h2 className="text-3xl font-bold tracking-tighter sm:text-4xl text-navy-900 dark:text-slate-100">What Our Users Say</h2>
+              <p className="max-w-[700px] text-slate-700 dark:text-slate-300 md:text-xl">
                 Real stories from people who have used LegalEase to navigate their legal challenges
               </p>
             </div>
@@ -195,7 +195,7 @@ export default function LandingPage() {
       </section>
 
       {/* CTA Section */}
-      <section className="w-full py-12 md:py-24 bg-gradient-to-b from-slate-50 to-white">
+      <section className="w-full py-12 md:py-24 bg-gradient-to-b from-slate-50 to-white dark:from-slate-800 dark:to-slate-900">
         <div className="container px-4 md:px-6">
           <motion.div
             className="mx-auto flex flex-col items-center justify-center space-y-4 text-center max-w-3xl"
@@ -205,37 +205,37 @@ export default function LandingPage() {
             transition={{ duration: 0.5 }}
           >
             <div className="space-y-2">
-              <h2 className="text-3xl font-bold tracking-tighter sm:text-4xl text-navy-900">
+              <h2 className="text-3xl font-bold tracking-tighter sm:text-4xl text-navy-900 dark:text-slate-100">
                 Ready to Simplify Your Legal Journey?
               </h2>
-              <p className="max-w-[700px] text-slate-700 md:text-xl">
+              <p className="max-w-[700px] text-slate-700 dark:text-slate-300 md:text-xl">
                 Join thousands of Indians who are using LegalEase to understand their rights and navigate the legal
                 system with confidence.
               </p>
             </div>
             <div className="flex flex-col gap-2 min-[400px]:flex-row pt-4">
-              <Button asChild size="lg" className="bg-teal-600 hover:bg-teal-700">
+              <Button asChild size="lg" className="bg-teal-600 hover:bg-teal-700 dark:bg-teal-500 dark:hover:bg-teal-600">
                 <Link href="/chat">
                   Get Started Free
                   <ArrowRight className="ml-2 h-4 w-4" />
                 </Link>
               </Button>
-              <Button asChild variant="outline" size="lg">
+              <Button asChild variant="outline" size="lg" className="border-slate-300 dark:border-slate-600 text-slate-700 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-700">
                 <Link href="/help">Find Legal Help</Link>
               </Button>
             </div>
             <div className="flex items-center justify-center space-x-4 pt-4">
               <div className="flex items-center space-x-1">
-                <Check className="h-4 w-4 text-teal-600" />
-                <span className="text-sm text-slate-700">No credit card required</span>
+                <Check className="h-4 w-4 text-teal-600 dark:text-teal-400" />
+                <span className="text-sm text-slate-700 dark:text-slate-300">No credit card required</span>
               </div>
               <div className="flex items-center space-x-1">
-                <Check className="h-4 w-4 text-teal-600" />
-                <span className="text-sm text-slate-700">Free basic access</span>
+                <Check className="h-4 w-4 text-teal-600 dark:text-teal-400" />
+                <span className="text-sm text-slate-700 dark:text-slate-300">Free basic access</span>
               </div>
               <div className="flex items-center space-x-1">
-                <Check className="h-4 w-4 text-teal-600" />
-                <span className="text-sm text-slate-700">Cancel anytime</span>
+                <Check className="h-4 w-4 text-teal-600 dark:text-teal-400" />
+                <span className="text-sm text-slate-700 dark:text-slate-300">Cancel anytime</span>
               </div>
             </div>
           </motion.div>
@@ -243,4 +243,4 @@ export default function LandingPage() {
       </section>
     </div>
   )
-}
+}
\ No newline at end of file
diff --git a/app/rights/page.tsx b/app/rights/page.tsx
index 4581e4a..22c5295 100644
--- a/app/rights/page.tsx
+++ b/app/rights/page.tsx
@@ -245,8 +245,8 @@ export default function RightsPage() {
     <div className="container mx-auto p-4 md:p-6">
       <div className="max-w-4xl mx-auto">
         <div className="text-center mb-8">
-          <h1 className="text-3xl font-bold text-navy-900">Legal Rights Visualizer</h1>
-          <p className="text-slate-600 mt-2">Explore your legal rights in simple, easy-to-understand language</p>
+          <h1 className="text-3xl font-bold text-navy-900 dark:text-white">Legal Rights Visualizer</h1>
+          <p className="text-slate-600 dark:text-slate-400 mt-2">Explore your legal rights in simple, easy-to-understand language</p>
         </div>
 
         <Tabs value={selectedCategory} onValueChange={setSelectedCategory} className="w-full">
@@ -268,15 +268,15 @@ export default function RightsPage() {
               >
                 <Card>
                   <CardHeader>
-                    <CardTitle>{category.title}</CardTitle>
-                    <CardDescription>{category.description}</CardDescription>
+                    <CardTitle className="dark:text-white">{category.title}</CardTitle>
+                    <CardDescription className="dark:text-slate-400">{category.description}</CardDescription>
                   </CardHeader>
                   <CardContent>
                     <Accordion type="single" collapsible className="w-full">
                       <AnimatePresence>
                         {category.rights.map((right, index) => (
                           <AccordionItem key={right.id} value={right.id}>
-                            <AccordionTrigger className="text-left">{right.title}</AccordionTrigger>
+                            <AccordionTrigger className="text-left dark:text-white">{right.title}</AccordionTrigger>
                             <motion.div
                               initial={{ opacity: 0 }}
                               animate={{ opacity: 1 }}
@@ -285,7 +285,7 @@ export default function RightsPage() {
                             >
                               <AccordionContent>
                                 <div className="space-y-4">
-                                  <p className="text-slate-700">{right.content}</p>
+                                  <p className="text-slate-700 dark:text-slate-300">{right.content}</p>
                                   <div className="flex space-x-2">
                                     <Button variant="outline" size="sm" onClick={() => handleCopy(right.content)}>
                                       <Copy className="h-3.5 w-3.5 mr-1.5" />
@@ -314,7 +314,7 @@ export default function RightsPage() {
           ))}
         </Tabs>
 
-        <div className="mt-8 bg-slate-50 dark:bg-gray-900 rounded-2xl p-6">
+        <div className="mt-8 bg-slate-50 dark:bg-slate-800 rounded-2xl p-6">
           <h2 className="text-xl font-semibold text-navy-900 dark:text-white mb-4">
             Understanding Your Rights
           </h2>
@@ -336,4 +336,4 @@ export default function RightsPage() {
       </div>
     </div>
   )
-}
+}
\ No newline at end of file