diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx
index 829584f..df6579f 100644
--- a/src/app/dashboard/page.tsx
+++ b/src/app/dashboard/page.tsx
@@ -1,151 +1,146 @@
 "use client";
 
-import Link from "next/link";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
-import FeatureCardTwelve from "@/components/sections/feature/FeatureCardTwelve";
-import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
-import ContactCenter from "@/components/sections/contact/ContactCenter";
-import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
-import { Zap, TrendingUp, Clock, AlertCircle, CheckCircle, Mail } from "lucide-react";
+import { BarChart3, Users, TrendingUp, Activity } from "lucide-react";
 
 export default function DashboardPage() {
-  const navItems = [
-    { name: "Dashboard", id: "dashboard" },
-    { name: "Features", id: "features" },
-    { name: "Security", id: "security" },
-    { name: "Contact", id: "contact" },
-  ];
-
-  const footerColumns = [
-    {
-      items: [
-        { label: "Dashboard", href: "/dashboard" },
-        { label: "Features", href: "#features" },
-        { label: "Pricing", href: "#" },
-      ],
-    },
-    {
-      items: [
-        { label: "About Us", href: "#about" },
-        { label: "Contact", href: "#contact" },
-        { label: "Support", href: "#" },
-      ],
-    },
-    {
-      items: [
-        { label: "Privacy Policy", href: "#" },
-        { label: "Terms of Service", href: "#" },
-        { label: "HIPAA Compliance", href: "#" },
-      ],
-    },
-    {
-      items: [
-        { label: "Twitter", href: "https://twitter.com" },
-        { label: "LinkedIn", href: "https://linkedin.com" },
-        { label: "Facebook", href: "https://facebook.com" },
-      ],
-    },
-  ];
-
   return (
     <ThemeProvider
       defaultButtonVariant="hover-magnetic"
       defaultTextAnimation="reveal-blur"
       borderRadius="rounded"
-      contentWidth="small"
-      sizing="largeSizeMediumTitles"
+      contentWidth="medium"
+      sizing="medium"
       background="circleGradient"
-      cardStyle="glass-depth"
-      primaryButtonStyle="radial-glow"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
       secondaryButtonStyle="glass"
-      headingFontWeight="extrabold"
+      headingFontWeight="normal"
     >
       <div id="nav" data-section="nav">
-        <NavbarStyleApple brandName="HealthCare Hub" navItems={navItems} />
-      </div>
-
-      <div id="features" data-section="features">
-        <FeatureCardTwelve
-          features={[
-            {
-              id: "records",
-              label: "Records",
-              title: "Complete Patient History & Medical Records",
-              items: [
-                "Digital patient profiles with complete medical history",
-                "Appointment and consultation logs",
-                "Prescription tracking and medication management",
-                "Lab results and diagnostic reports",
-              ],
-            },
-            {
-              id: "monitoring",
-              label: "Monitoring",
-              title: "Real-Time Patient Vital Signs Tracking",
-              items: [
-                "Live vital signs monitoring and alerts",
-                "Automated abnormality detection",
-                "Historical trend analysis",
-                "Emergency notification system",
-              ],
-            },
-            {
-              id: "scheduling",
-              label: "Scheduling",
-              title: "Intelligent Appointment Management",
-              items: [
-                "Automated appointment scheduling",
-                "Conflict prevention and optimization",
-                "Patient reminders and confirmations",
-                "Resource allocation and staff management",
-              ],
-            },
+        <NavbarStyleApple
+          brandName="HealthCare Hub"
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Features", id: "features" },
+            { name: "Login", id: "/login" },
+            { name: "Contact", id: "contact" },
           ]}
-          animationType="slide-up"
-          title="Dashboard Features Overview"
-          description="Access comprehensive patient management tools designed for modern healthcare providers"
-          tag="Key Capabilities"
-          tagIcon={Zap}
-          tagAnimation="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={true}
         />
       </div>
 
-      <div id="metrics" data-section="metrics">
-        <MetricCardThree
-          title="Dashboard Performance Metrics"
-          description="Real-time analytics showing system effectiveness and patient care improvements"
-          metrics={[
-            { id: "1", icon: TrendingUp, title: "Patient Satisfaction", value: "96%" },
-            { id: "2", icon: Clock, title: "Time Saved Daily", value: "4.5 hrs" },
-            { id: "3", icon: AlertCircle, title: "Error Reduction", value: "87%" },
-          ]}
-          animationType="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={false}
-        />
-      </div>
+      <div className="min-h-[calc(100vh-80px)] bg-background p-8">
+        <div className="max-w-7xl mx-auto">
+          {/* Header */}
+          <div className="mb-8">
+            <h1 className="text-4xl font-bold text-foreground mb-2">Dashboard</h1>
+            <p className="text-foreground/70">Welcome back! Here's your patient management overview.</p>
+          </div>
 
-      <div id="contact" data-section="contact">
-        <ContactCenter
-          tag="Get in Touch"
-          tagIcon={Mail}
-          tagAnimation="slide-up"
-          title="Ready to Access Your Dashboard?"
-          description="Get started with HealthCare Hub today. Schedule a personalized onboarding session with our support team."
-          background={{ variant: "rotated-rays-animated-grid" }}
-          useInvertedBackground={false}
-          inputPlaceholder="Enter your email address"
-          buttonText="Get Started"
-          termsText="We respect your privacy. Your information is secure and HIPAA-compliant. We'll follow up within 24 hours."
-        />
-      </div>
+          {/* Stats Grid */}
+          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
+            {[
+              { icon: Users, label: "Active Patients", value: "1,234", change: "+12%" },
+              { icon: Activity, label: "Appointments Today", value: "42", change: "+5%" },
+              { icon: TrendingUp, label: "System Uptime", value: "99.9%", change: "Stable" },
+              { icon: BarChart3, label: "Data Processed", value: "2.5 TB", change: "+8%" },
+            ].map((stat, idx) => {
+              const Icon = stat.icon;
+              return (
+                <div
+                  key={idx}
+                  className="rounded-lg border border-accent/20 bg-card p-6 backdrop-blur-sm shadow-lg hover:shadow-xl transition-shadow"
+                >
+                  <div className="flex items-start justify-between mb-4">
+                    <div className="w-12 h-12 rounded-lg bg-primary-cta/10 flex items-center justify-center">
+                      <Icon className="w-6 h-6 text-primary-cta" />
+                    </div>
+                    <span className="text-xs font-semibold text-accent">{stat.change}</span>
+                  </div>
+                  <h3 className="text-sm text-foreground/70 mb-1">{stat.label}</h3>
+                  <p className="text-2xl font-bold text-foreground">{stat.value}</p>
+                </div>
+              );
+            })}
+          </div>
 
-      <div id="footer" data-section="footer">
-        <FooterLogoEmphasis logoText="HealthCare Hub" columns={footerColumns} />
+          {/* Main Content Area */}
+          <div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
+            {/* Chart Section */}
+            <div className="lg:col-span-2">
+              <div className="rounded-lg border border-accent/20 bg-card p-6 backdrop-blur-sm shadow-lg">
+                <h2 className="text-xl font-bold text-foreground mb-4">Patient Activity Trend</h2>
+                <div className="h-64 flex items-end justify-around gap-2">
+                  {[65, 78, 90, 85, 92, 88, 75, 82].map((height, idx) => (
+                    <div
+                      key={idx}
+                      className="flex-1 bg-gradient-to-t from-primary-cta to-primary-cta/60 rounded-t-lg opacity-80 hover:opacity-100 transition-opacity"
+                      style={{ height: `${height}%` }}
+                    />
+                  ))}
+                </div>
+                <div className="mt-4 flex justify-between text-xs text-foreground/50">
+                  {["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun", "Today"].map((day) => (
+                    <span key={day}>{day}</span>
+                  ))}
+                </div>
+              </div>
+            </div>
+
+            {/* Quick Actions */}
+            <div className="rounded-lg border border-accent/20 bg-card p-6 backdrop-blur-sm shadow-lg">
+              <h2 className="text-xl font-bold text-foreground mb-4">Quick Actions</h2>
+              <div className="space-y-3">
+                {[
+                  "Add New Patient",                  "Schedule Appointment",                  "View Reports",                  "Export Data"].map((action, idx) => (
+                  <button
+                    key={idx}
+                    className="w-full py-2 px-4 rounded-lg border border-accent/30 hover:border-primary-cta/50 text-foreground text-sm font-medium transition-all hover:bg-accent/5"
+                  >
+                    {action}
+                  </button>
+                ))}
+              </div>
+            </div>
+          </div>
+
+          {/* Recent Patients */}
+          <div className="mt-8 rounded-lg border border-accent/20 bg-card p-6 backdrop-blur-sm shadow-lg">
+            <h2 className="text-xl font-bold text-foreground mb-4">Recent Patients</h2>
+            <div className="overflow-x-auto">
+              <table className="w-full text-sm">
+                <thead className="border-b border-accent/20">
+                  <tr>
+                    <th className="text-left py-3 px-4 text-foreground/70 font-semibold">Patient Name</th>
+                    <th className="text-left py-3 px-4 text-foreground/70 font-semibold">ID</th>
+                    <th className="text-left py-3 px-4 text-foreground/70 font-semibold">Last Visit</th>
+                    <th className="text-left py-3 px-4 text-foreground/70 font-semibold">Status</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  {[
+                    { name: "John Smith", id: "#PAT-001", visit: "Today", status: "Active" },
+                    { name: "Emma Johnson", id: "#PAT-002", visit: "Yesterday", status: "Follow-up" },
+                    { name: "Michael Chen", id: "#PAT-003", visit: "2 days ago", status: "Stable" },
+                  ].map((patient, idx) => (
+                    <tr key={idx} className="border-b border-accent/10 hover:bg-accent/5 transition-colors">
+                      <td className="py-3 px-4 text-foreground">{patient.name}</td>
+                      <td className="py-3 px-4 text-foreground/70">{patient.id}</td>
+                      <td className="py-3 px-4 text-foreground/70">{patient.visit}</td>
+                      <td className="py-3 px-4">
+                        <span className="inline-block px-3 py-1 rounded-full text-xs font-semibold bg-primary-cta/20 text-primary-cta">
+                          {patient.status}
+                        </span>
+                      </td>
+                    </tr>
+                  ))}
+                </tbody>
+              </table>
+            </div>
+          </div>
+        </div>
       </div>
     </ThemeProvider>
   );
-}
\ No newline at end of file
+}