强制头部白色背景

src/components/MobileHeader.vue

@@ -91,7 +91,7 @@ onMounted(() => {
 
 <style scoped>
 .mobile-header {
-  background: white;
+  background: white !important;
   border-bottom: 1px solid #f0f0f0;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
 }
@@ -99,7 +99,7 @@ onMounted(() => {
 /* 状态栏占位区域 - 固定30px */
 .status-bar-spacer {
   height: 30px;
-  background: white;
+  background: white !important;
 }
 
 /* header内容区域 - 固定60px */
@@ -109,34 +109,34 @@ onMounted(() => {
   justify-content: space-between;
   padding: 12px 16px;
   height: 60px;
-  background: white;
+  background: white !important;
 }
 
 .back-btn, .help-btn {
   width: 36px;
   height: 36px;
   border: none;
-  background: #f8f9fa;
+  background: #f8f9fa !important;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
-  color: #495057;
+  color: #495057 !important;
   cursor: pointer;
   transition: all 0.2s ease;
   border: 1px solid #e9ecef;
 }
 
 .back-btn:hover, .help-btn:hover {
-  background: #e9ecef;
-  color: #343a40;
+  background: #e9ecef !important;
+  color: #343a40 !important;
   transform: scale(1.05);
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
 }
 
 .back-btn:active, .help-btn:active {
   transform: scale(0.95);
-  background: #dee2e6;
+  background: #dee2e6 !important;
 }
 
 .back-icon, .help-icon {
@@ -150,7 +150,7 @@ onMounted(() => {
   font-size: 18px;
   font-weight: 600;
   margin: 0;
-  color: #212529;
+  color: #212529 !important;
   text-align: center;
   flex: 1;
   letter-spacing: 0.3px;
@@ -161,34 +161,72 @@ onMounted(() => {
   height: 36px;
 }
 
-/* 暗黑模式适配 */
+/* 强制覆盖任何暗黑模式样式 */
 @media (prefers-color-scheme: dark) {
   .mobile-header {
-    background: #1a1a1a;
-    border-bottom-color: #333;
+    background: white !important;
+    border-bottom-color: #f0f0f0 !important;
   }
   
   .status-bar-spacer {
-    background: #1a1a1a;
+    background: white !important;
   }
   
   .header-content {
-    background: #1a1a1a;
+    background: white !important;
   }
   
   .back-btn, .help-btn {
-    background: #2d2d2d;
-    border-color: #444;
-    color: #e0e0e0;
+    background: #f8f9fa !important;
+    border-color: #e9ecef !important;
+    color: #495057 !important;
   }
   
   .back-btn:hover, .help-btn:hover {
-    background: #404040;
-    color: #fff;
+    background: #e9ecef !important;
+    color: #343a40 !important;
   }
   
   .title {
-    color: #fff;
+    color: #212529 !important;
+  }
+}
+
+/* 强制针对移动设备的样式 */
+@media screen and (max-width: 768px) {
+  .mobile-header {
+    background: white !important;
+    color: #212529 !important;
+  }
+  
+  .mobile-header * {
+    color: inherit !important;
+  }
+  
+  .title {
+    color: #212529 !important;
+  }
+  
+  .back-btn, .help-btn {
+    background: #f8f9fa !important;
+    color: #495057 !important;
+    border-color: #e9ecef !important;
+  }
+}
+
+/* 针对特定手机浏览器的修复 */
+@supports (-webkit-touch-callout: none) {
+  .mobile-header {
+    background: white !important;
+  }
+  
+  .title {
+    color: #212529 !important;
+  }
+  
+  .back-btn, .help-btn {
+    background: #f8f9fa !important;
+    color: #495057 !important;
   }
 }
 </style>