diff --git a/app/(app)/analytics/devices/page.tsx b/app/(app)/analytics/devices/page.tsx
index 6d7779f..4f8ab74 100644
--- a/app/(app)/analytics/devices/page.tsx
+++ b/app/(app)/analytics/devices/page.tsx
@@ -1,7 +1,6 @@
 "use client";
 
 import { useState, useEffect, useRef } from 'react';
-import { fetchData } from '@/app/api/utils';
 import { DeviceAnalytics } from '@/app/api/types';
 import { Chart, PieController, ArcElement, Tooltip, Legend, CategoryScale, LinearScale } from 'chart.js';
 
@@ -91,7 +90,7 @@ export default function DeviceAnalyticsPage() {
               legend: {
                 position: 'bottom',
                 labels: {
-                  color: 'white'
+                  color: 'currentColor'
                 }
               },
               tooltip: {
@@ -132,7 +131,7 @@ export default function DeviceAnalyticsPage() {
               legend: {
                 position: 'bottom',
                 labels: {
-                  color: 'white'
+                  color: 'currentColor'
                 }
               },
               tooltip: {
@@ -173,7 +172,7 @@ export default function DeviceAnalyticsPage() {
               legend: {
                 position: 'bottom',
                 labels: {
-                  color: 'white'
+                  color: 'currentColor'
                 }
               },
               tooltip: {
@@ -211,27 +210,27 @@ export default function DeviceAnalyticsPage() {
     <div className="container mx-auto px-4 py-8">
       {/* 页面标题 */}
       <div className="mb-8">
-        <h1 className="text-2xl font-bold text-white">Device Analytics</h1>
-        <p className="mt-2 text-white">Analyze visitor distribution by devices, browsers, and operating systems</p>
+        <h1 className="text-2xl font-bold text-foreground">Device Analytics</h1>
+        <p className="mt-2 text-foreground">Analyze visitor distribution by devices, browsers, and operating systems</p>
       </div>
 
       {/* 时间范围选择器 */}
       <div className="bg-card-bg rounded-xl p-6 mb-8">
         <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
           <div>
-            <label className="block text-sm font-medium text-text-secondary mb-1">Start Date</label>
+            <label className="block text-sm font-medium text-foreground mb-1">Start Date</label>
             <input
               type="date"
-              className="block w-full px-3 py-2 bg-background border border-card-border rounded-md text-sm"
+              className="block w-full px-3 py-2 bg-background border border-card-border rounded-md text-sm text-foreground"
               value={dateRange.from.toISOString().split('T')[0]}
               onChange={e => setDateRange(prev => ({ ...prev, from: new Date(e.target.value) }))}
             />
           </div>
           <div>
-            <label className="block text-sm font-medium text-text-secondary mb-1">End Date</label>
+            <label className="block text-sm font-medium text-foreground mb-1">End Date</label>
             <input
               type="date"
-              className="block w-full px-3 py-2 bg-background border border-card-border rounded-md text-sm"
+              className="block w-full px-3 py-2 bg-background border border-card-border rounded-md text-sm text-foreground"
               value={dateRange.to.toISOString().split('T')[0]}
               onChange={e => setDateRange(prev => ({ ...prev, to: new Date(e.target.value) }))}
             />
@@ -243,13 +242,13 @@ export default function DeviceAnalyticsPage() {
       <div className="grid grid-cols-1 lg:grid-cols-3 gap-8 mb-8">
         {/* 设备类型 */}
         <div className="bg-card-bg rounded-xl p-6">
-          <h3 className="text-lg font-medium text-white mb-4">Device Types</h3>
+          <h3 className="text-lg font-medium text-foreground mb-4">Device Types</h3>
           {deviceData && deviceData.deviceTypes.length > 0 ? (
             <div className="h-64">
               <canvas ref={deviceTypesChartRef} />
             </div>
           ) : (
-            <div className="flex justify-center items-center h-64 text-text-secondary">
+            <div className="flex justify-center items-center h-64 text-foreground">
               No data available
             </div>
           )}
@@ -257,13 +256,13 @@ export default function DeviceAnalyticsPage() {
 
         {/* 浏览器 */}
         <div className="bg-card-bg rounded-xl p-6">
-          <h3 className="text-lg font-medium text-white mb-4">Browsers</h3>
+          <h3 className="text-lg font-medium text-foreground mb-4">Browsers</h3>
           {deviceData && deviceData.browsers.length > 0 ? (
             <div className="h-64">
               <canvas ref={browsersChartRef} />
             </div>
           ) : (
-            <div className="flex justify-center items-center h-64 text-text-secondary">
+            <div className="flex justify-center items-center h-64 text-foreground">
               No data available
             </div>
           )}
@@ -271,13 +270,13 @@ export default function DeviceAnalyticsPage() {
 
         {/* 操作系统 */}
         <div className="bg-card-bg rounded-xl p-6">
-          <h3 className="text-lg font-medium text-white mb-4">Operating Systems</h3>
+          <h3 className="text-lg font-medium text-foreground mb-4">Operating Systems</h3>
           {deviceData && deviceData.operatingSystems.length > 0 ? (
             <div className="h-64">
               <canvas ref={osChartRef} />
             </div>
           ) : (
-            <div className="flex justify-center items-center h-64 text-text-secondary">
+            <div className="flex justify-center items-center h-64 text-foreground">
               No data available
             </div>
           )}
@@ -300,7 +299,7 @@ export default function DeviceAnalyticsPage() {
 
       {/* 无数据状态 */}
       {!isLoading && !error && !deviceData && (
-        <div className="flex justify-center items-center p-8 text-text-secondary">
+        <div className="flex justify-center items-center p-8 text-foreground">
           <p>No device data available</p>
         </div>
       )}
diff --git a/app/(app)/analytics/geo/page.tsx b/app/(app)/analytics/geo/page.tsx
index 7bccb5e..8cb0897 100644
--- a/app/(app)/analytics/geo/page.tsx
+++ b/app/(app)/analytics/geo/page.tsx
@@ -37,27 +37,27 @@ export default function GeoAnalyticsPage() {
     <div className="container mx-auto px-4 py-8">
       {/* 页面标题 */}
       <div className="mb-8">
-        <h1 className="text-2xl font-bold text-white">Geographic Analysis</h1>
-        <p className="mt-2 text-white">Analyze visitor distribution by location</p>
+        <h1 className="text-2xl font-bold text-foreground">Geographic Analysis</h1>
+        <p className="mt-2 text-foreground">Analyze visitor distribution by location</p>
       </div>
 
       {/* 时间范围选择器 */}
       <div className="bg-card-bg rounded-xl p-6 mb-8">
         <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
           <div>
-            <label className="block text-sm font-medium text-white mb-1">Start Date</label>
+            <label className="block text-sm font-medium text-foreground mb-1">Start Date</label>
             <input
               type="date"
-              className="block w-full px-3 py-2 bg-background border border-card-border rounded-md text-sm "
+              className="block w-full px-3 py-2 bg-background border border-card-border rounded-md text-sm text-foreground"
               value={dateRange.from.toISOString().split('T')[0]}
               onChange={e => setDateRange(prev => ({ ...prev, from: new Date(e.target.value) }))}
             />
           </div>
           <div>
-            <label className="block text-sm font-medium text-white mb-1">End Date</label>
+            <label className="block text-sm font-medium text-foreground mb-1">End Date</label>
             <input
               type="date"
-              className="block w-full px-3 py-2 bg-background border border-card-border rounded-md text-sm "
+              className="block w-full px-3 py-2 bg-background border border-card-border rounded-md text-sm text-foreground"
               value={dateRange.to.toISOString().split('T')[0]}
               onChange={e => setDateRange(prev => ({ ...prev, to: new Date(e.target.value) }))}
             />
@@ -71,33 +71,33 @@ export default function GeoAnalyticsPage() {
           <table className="min-w-full divide-y divide-card-border">
             <thead>
               <tr className="bg-background/50">
-                <th className="px-6 py-3 text-left text-xs font-medium text-white uppercase tracking-wider">Location</th>
-                <th className="px-6 py-3 text-left text-xs font-medium text-white uppercase tracking-wider">Visits</th>
-                <th className="px-6 py-3 text-left text-xs font-medium text-white uppercase tracking-wider">Unique Visitors</th>
-                <th className="px-6 py-3 text-left text-xs font-medium text-white uppercase tracking-wider">Percentage</th>
+                <th className="px-6 py-3 text-left text-xs font-medium text-foreground uppercase tracking-wider">Location</th>
+                <th className="px-6 py-3 text-left text-xs font-medium text-foreground uppercase tracking-wider">Visits</th>
+                <th className="px-6 py-3 text-left text-xs font-medium text-foreground uppercase tracking-wider">Unique Visitors</th>
+                <th className="px-6 py-3 text-left text-xs font-medium text-foreground uppercase tracking-wider">Percentage</th>
               </tr>
             </thead>
             <tbody className="divide-y divide-card-border">
               {geoData.map(item => (
                 <tr key={item.location} className="hover:bg-background/50">
-                  <td className="px-6 py-4 whitespace-nowrap text-sm text-white">
+                  <td className="px-6 py-4 whitespace-nowrap text-sm text-foreground">
                     {item.location}
                   </td>
-                  <td className="px-6 py-4 whitespace-nowrap text-sm text-white">
+                  <td className="px-6 py-4 whitespace-nowrap text-sm text-foreground">
                     {item.visits}
                   </td>
-                  <td className="px-6 py-4 whitespace-nowrap text-sm text-white">
+                  <td className="px-6 py-4 whitespace-nowrap text-sm text-foreground">
                     {item.visitors}
                   </td>
                   <td className="px-6 py-4 whitespace-nowrap text-sm">
                     <div className="flex items-center">
-                      <div className="w-full bg-background rounded-full h-2 mr-2">
+                      <span className="mr-2 text-foreground">{item.percentage.toFixed(1)}%</span>
+                      <div className="w-24 bg-gray-200 dark:bg-gray-700 rounded-full h-2">
                         <div
                           className="bg-blue-500 h-2 rounded-full"
                           style={{ width: `${item.percentage}%` }}
                         />
                       </div>
-                      <span className="text-white">{item.percentage.toFixed(1)}%</span>
                     </div>
                   </td>
                 </tr>
@@ -122,14 +122,14 @@ export default function GeoAnalyticsPage() {
 
         {/* 无数据状态 */}
         {!isLoading && !error && geoData.length === 0 && (
-          <div className="flex justify-center items-center p-8 text-white">
+          <div className="flex justify-center items-center p-8 text-foreground">
             <p>No geographic data available</p>
           </div>
         )}
       </div>
 
       {/* 提示信息 */}
-      <div className="mt-4 text-sm text-white">
+      <div className="mt-4 text-sm text-foreground">
         <p>Note: Geographic data is based on IP addresses and may not be 100% accurate.</p>
       </div>
     </div>
diff --git a/app/api/types.ts b/app/api/types.ts
index ce7e665..76a8970 100644
--- a/app/api/types.ts
+++ b/app/api/types.ts
@@ -93,13 +93,9 @@ export interface TimeSeriesData {
 }
 
 export interface GeoData {
-  location?: string;
-  country?: string;
-  region?: string;
-  city?: string;
+  location: string;
   visits: number;
-  uniqueVisitors?: number;
-  visitors?: number;
+  visitors: number;
   percentage: number;
 }
 
diff --git a/app/components/layout/Navbar.tsx b/app/components/layout/Navbar.tsx
index 573dc9b..807187b 100644
--- a/app/components/layout/Navbar.tsx
+++ b/app/components/layout/Navbar.tsx
@@ -1,7 +1,6 @@
 'use client';
 
 import Link from 'next/link';
-import ThemeToggle from "../ui/ThemeToggle";
 
 export default function Navbar() {
   return (
@@ -40,7 +39,6 @@ export default function Navbar() {
           </nav>
         </div>
         <div className="flex items-center space-x-3">
-          <ThemeToggle />
           <button className="p-2 text-sm text-foreground rounded-md gradient-border">
             Upgrade
           </button>
diff --git a/app/components/ui/ThemeToggle.tsx b/app/components/ui/ThemeToggle.tsx
deleted file mode 100644
index 1b6618c..0000000
--- a/app/components/ui/ThemeToggle.tsx
+++ /dev/null
@@ -1,64 +0,0 @@
-"use client";
-
-import { useState, useEffect } from 'react';
-
-export default function ThemeToggle() {
-  const [darkMode, setDarkMode] = useState(false);
-
-  // Initialize theme on component mount
-  useEffect(() => {
-    const isDarkMode = localStorage.getItem('darkMode') === 'true';
-    setDarkMode(isDarkMode);
-    
-    if (isDarkMode) {
-      document.documentElement.classList.add('dark');
-    } else {
-      document.documentElement.classList.remove('dark');
-    }
-  }, []);
-
-  // Update theme when darkMode state changes
-  const toggleTheme = () => {
-    const newDarkMode = !darkMode;
-    setDarkMode(newDarkMode);
-    localStorage.setItem('darkMode', newDarkMode.toString());
-    
-    if (newDarkMode) {
-      document.documentElement.classList.add('dark');
-    } else {
-      document.documentElement.classList.remove('dark');
-    }
-  };
-
-  return (
-    <button
-      onClick={toggleTheme}
-      className="p-2 rounded-md bg-card-bg border border-card-border hover:bg-card-bg/80 transition-colors"
-      aria-label={darkMode ? "Switch to light mode" : "Switch to dark mode"}
-    >
-      {darkMode ? (
-        <svg
-          className="w-5 h-5 text-accent-yellow"
-          fill="currentColor"
-          viewBox="0 0 20 20"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            fillRule="evenodd"
-            d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z"
-            clipRule="evenodd"
-          />
-        </svg>
-      ) : (
-        <svg
-          className="w-5 h-5 text-foreground"
-          fill="currentColor"
-          viewBox="0 0 20 20"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z" />
-        </svg>
-      )}
-    </button>
-  );
-} 
\ No newline at end of file
diff --git a/app/globals.css b/app/globals.css
index b739895..d568578 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -30,30 +30,6 @@
   --gradient-red: linear-gradient(135deg, #f43f5e, #e11d48);
 }
 
-.dark {
-  /* Dark Mode */
-  --background: #0f172a;
-  --foreground: #ffffff;
-  
-  /* Card colors */
-  --card-bg: #1e293b;
-  --card-border: #334155;
-  
-  /* Vibrant accent colors */
-  --accent-blue: #3b82f6;
-  --accent-green: #10b981;
-  --accent-red: #f43f5e;
-  --accent-yellow: #f59e0b;
-  --accent-purple: #8b5cf6;
-  --accent-pink: #ec4899;
-  --accent-teal: #14b8a6;
-  --accent-orange: #f97316;
-  
-  /* UI colors */
-  --text-secondary: #94a3b8;
-  --progress-bg: #334155;
-}
-
 @theme inline {
   --color-background: var(--background);
   --color-foreground: var(--foreground);
diff --git a/tailwind.config.ts b/tailwind.config.ts
index c43c707..dca00d8 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -6,7 +6,6 @@ const config: Config = {
     "./components/**/*.{js,ts,jsx,tsx,mdx}",
     "./app/**/*.{js,ts,jsx,tsx,mdx}",
   ],
-  darkMode: 'class',
   theme: {
     extend: {
       colors: {