diff --git a/docs/.vitepress/theme/components/Switch.vue b/docs/.vitepress/theme/components/Switch.vue
index d5517bf90..a5284f143 100644
--- a/docs/.vitepress/theme/components/Switch.vue
+++ b/docs/.vitepress/theme/components/Switch.vue
@@ -50,8 +50,8 @@ const emit = defineEmits<{
 }
 
 .switch.disabled .thumb {
-  background-color: #000;
-  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), var(--vp-shadow-1);
+  background-color: #fff;
+  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.2), var(--vp-shadow-1);
 }
 
 .dark .switch.disabled {
@@ -67,12 +67,12 @@ const emit = defineEmits<{
 
 .thumb {
   display: inline-block;
-  background-color: #000;
+  background-color: #fff;
   transition: transform 0.25s;
   width: 20px;
   height: 20px;
   border-radius: 50%;
-  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.08), var(--vp-shadow-1);
+  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08), var(--vp-shadow-1);
 }
 
 .switch.enabled .thumb {
diff --git a/docs/.vitepress/theme/style.scss b/docs/.vitepress/theme/style.scss
index 3b6f73f8c..56730c65d 100644
--- a/docs/.vitepress/theme/style.scss
+++ b/docs/.vitepress/theme/style.scss
@@ -94,19 +94,24 @@
     filter: none;
   }
 
-  .switch .thumb {
-    background-color: #000 !important;
+  .switch {
+    background-color: #000;
+    border-color: #5a5a5a;
   }
 
-  /* Keep sidebar toggles legible in monochrome mode */
-  .switch,
-  .switch * {
-    filter: none;
+  .switch .thumb {
+    background-color: #fff !important;
+    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.25), var(--vp-shadow-1);
   }
 
-  /* Ensure toggle thumb stays black in grayscale */
-  .switch .thumb {
+  .switch.enabled {
+    background-color: #fff;
+    border-color: #5a5a5a;
+  }
+
+  .switch.enabled .thumb {
     background-color: #000 !important;
+    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.25), var(--vp-shadow-1);
   }
 }