diff --git a/src/pages/More.tsx b/src/pages/More.tsx
index eac4ca39..465e8de4 100644
--- a/src/pages/More.tsx
+++ b/src/pages/More.tsx
@@ -162,7 +162,9 @@ const MorePage: React.FC = () => {
             <div className="bg-gray-50 p-4 rounded-lg shadow-md">
               {/* Category Navigation */}
               <div className="mb-6">
-                <h3 className="font-bold text-xl mb-2">Categories</h3>
+                <h3 className="font-bold text-xl mb-2 text-gray-900">
+                  Categories
+                </h3>
                 <div className="flex flex-wrap gap-2">
                   {categories.map((category) => (
                     <button
@@ -181,7 +183,7 @@ const MorePage: React.FC = () => {
               </div>
 
               {/* Page Links */}
-              <h3 className="font-bold text-xl mb-4">
+              <h3 className="font-bold text-xl mb-4 text-gray-900">
                 {activeCategory === 'All'
                   ? 'All Pages'
                   : activeCategory + ' Pages'}
diff --git a/src/utils/MarkdownRenderer.tsx b/src/utils/MarkdownRenderer.tsx
index 7c267019..252419e3 100644
--- a/src/utils/MarkdownRenderer.tsx
+++ b/src/utils/MarkdownRenderer.tsx
@@ -311,12 +311,12 @@ const MarkdownRenderer: React.FC<MarkdownRendererProps> = ({
 
   // Component definitions with shared styles
   const headingClasses = {
-    h1: 'text-3xl font-bold my-6 text-gray-900 dark:text-gray-100 group flex items-center border-b border-gray-200 dark:border-gray-700 pb-2',
-    h2: 'text-2xl font-semibold my-5 text-gray-900 dark:text-gray-100 group flex items-center border-b border-gray-200 dark:border-gray-700 pb-1',
-    h3: 'text-xl font-semibold my-4 text-gray-900 dark:text-gray-100 group flex items-center',
-    h4: 'text-lg font-semibold my-3 text-gray-900 dark:text-gray-100',
-    h5: 'text-base font-semibold my-3 text-gray-900 dark:text-gray-100',
-    h6: 'text-sm font-semibold my-3 text-gray-600 dark:text-gray-300 uppercase tracking-wide',
+    h1: 'text-3xl font-bold my-6 text-gray-900 group flex items-center border-b border-gray-200 dark:border-gray-700 pb-2',
+    h2: 'text-2xl font-semibold my-5 text-gray-900 group flex items-center border-b border-gray-200 dark:border-gray-700 pb-1',
+    h3: 'text-xl font-semibold my-4 text-gray-900 group flex items-center',
+    h4: 'text-lg font-semibold my-3 text-gray-900',
+    h5: 'text-base font-semibold my-3 text-gray-900',
+    h6: 'text-sm font-semibold my-3 text-gray-600 uppercase tracking-wide',
   };
 
   const createHeading =
@@ -344,10 +344,7 @@ const MarkdownRenderer: React.FC<MarkdownRendererProps> = ({
     h6: createHeading('h6'),
 
     p: ({ children, ...props }) => (
-      <p
-        {...props}
-        className="my-4 text-gray-700 dark:text-gray-300 leading-relaxed"
-      >
+      <p {...props} className="my-4 text-gray-700 leading-relaxed">
         {children}
       </p>
     ),
@@ -531,10 +528,7 @@ const MarkdownRenderer: React.FC<MarkdownRendererProps> = ({
       </ol>
     ),
     li: ({ children, ...props }) => (
-      <li
-        {...props}
-        className="text-gray-700 dark:text-gray-300 leading-relaxed"
-      >
+      <li {...props} className="text-gray-700 leading-relaxed">
         {children}
       </li>
     ),
@@ -573,15 +567,12 @@ const MarkdownRenderer: React.FC<MarkdownRendererProps> = ({
     },
 
     strong: ({ children, ...props }) => (
-      <strong
-        {...props}
-        className="font-semibold text-gray-900 dark:text-gray-100"
-      >
+      <strong {...props} className="font-semibold text-gray-900">
         {children}
       </strong>
     ),
     em: ({ children, ...props }) => (
-      <em {...props} className="italic text-gray-700 dark:text-gray-300">
+      <em {...props} className="italic text-gray-700">
         {children}
       </em>
     ),