diff --git a/src/components/DAKSelection.css b/src/components/DAKSelection.css
index a64976070f..935b6a6401 100644
--- a/src/components/DAKSelection.css
+++ b/src/components/DAKSelection.css
@@ -109,16 +109,25 @@ body.theme-light .dak-selection {
 }
 
 .documentation-info .doc-link {
-  color: #90caf9;
+  color: var(--who-blue-light);
   text-decoration: none;
   font-weight: 500;
 }
 
 .documentation-info .doc-link:hover {
-  color: white;
+  color: var(--who-text-primary);
   text-decoration: underline;
 }
 
+/* Dark theme adjustments for doc links */
+body.theme-dark .documentation-info .doc-link {
+  color: var(--who-light-blue);
+}
+
+body.theme-dark .documentation-info .doc-link:hover {
+  color: var(--who-text-primary);
+}
+
 .loading {
   text-align: center;
   padding: 3rem;
diff --git a/src/components/DocumentationViewer.css b/src/components/DocumentationViewer.css
index 26cb9fb4ea..706c781bf8 100644
--- a/src/components/DocumentationViewer.css
+++ b/src/components/DocumentationViewer.css
@@ -440,6 +440,11 @@ body.theme-dark .doc-article p {
   margin-bottom: 0.25rem;
 }
 
+/* Dark theme list adjustments */
+body.theme-dark .doc-article li {
+  color: var(--who-text-secondary);
+}
+
 .doc-article code {
   background: rgba(255, 255, 255, 0.2);
   padding: 0.125rem 0.25rem;
@@ -458,16 +463,38 @@ body.theme-dark .doc-article p {
   border: 1px solid rgba(255, 255, 255, 0.2);
 }
 
+/* Dark theme code adjustments */
+body.theme-dark .doc-article code {
+  background: var(--who-secondary-bg);
+  color: var(--who-text-primary);
+  border: 1px solid var(--who-border-color);
+}
+
+body.theme-dark .doc-article pre {
+  background: var(--who-secondary-bg);
+  border: 1px solid var(--who-border-color);
+  color: var(--who-text-primary);
+}
+
 .doc-article a {
-  color: #90caf9;
+  color: var(--who-blue-light);
   text-decoration: none;
 }
 
 .doc-article a:hover {
-  color: white;
+  color: var(--who-text-on-primary);
   text-decoration: underline;
 }
 
+/* Dark theme link adjustments */
+body.theme-dark .doc-article a {
+  color: var(--who-light-blue);
+}
+
+body.theme-dark .doc-article a:hover {
+  color: var(--who-text-primary);
+}
+
 .doc-article img {
   max-width: 100%;
   height: auto;
@@ -480,14 +507,15 @@ body.theme-dark .doc-article p {
   width: 100%;
   border-collapse: collapse;
   margin: 1.5rem 0;
-  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
+  box-shadow: 0 1px 3px var(--who-shadow-light);
   border-radius: 4px;
   overflow: hidden;
+  border: 1px solid var(--who-border-color);
 }
 
 .doc-table th {
-  background: #005eb8;
-  color: white;
+  background: var(--who-blue);
+  color: var(--who-text-on-primary);
   padding: 0.75rem 1rem;
   text-align: left;
   font-weight: 600;
@@ -496,18 +524,39 @@ body.theme-dark .doc-article p {
 
 .doc-table td {
   padding: 0.75rem 1rem;
-  border-bottom: 1px solid #e9ecef;
-  color: #333;
+  border-bottom: 1px solid var(--who-border-color);
+  color: var(--who-text-primary);
   font-size: 0.9rem;
   vertical-align: top;
+  background: var(--who-card-bg);
+}
+
+.doc-table tr:nth-child(even) td {
+  background: var(--who-hover-bg);
+}
+
+.doc-table tr:hover td {
+  background: var(--who-selected-bg);
 }
 
-.doc-table tr:nth-child(even) {
-  background: #f8f9fa;
+/* Dark theme table adjustments */
+body.theme-dark .doc-table th {
+  background: var(--who-blue);
+  color: var(--who-text-on-primary);
 }
 
-.doc-table tr:hover {
-  background: #e3f2fd;
+body.theme-dark .doc-table td {
+  background: var(--who-card-bg);
+  color: var(--who-text-primary);
+  border-bottom-color: var(--who-border-color);
+}
+
+body.theme-dark .doc-table tr:nth-child(even) td {
+  background: var(--who-hover-bg);
+}
+
+body.theme-dark .doc-table tr:hover td {
+  background: var(--who-selected-bg);
 }
 
 .loading, .error-state {
diff --git a/src/components/DocumentationViewer.js b/src/components/DocumentationViewer.js
index 64327a8c4e..a37ce1787c 100644
--- a/src/components/DocumentationViewer.js
+++ b/src/components/DocumentationViewer.js
@@ -5,6 +5,7 @@ import { PageLayout } from './framework';
 import documentationService from '../services/documentationService';
 import bookmarkService from '../services/bookmarkService';
 import githubService from '../services/githubService';
+import './DocumentationViewer.css';
 
 const DocumentationViewer = () => {
   const { docId } = useParams();