From d2b6d891b2311e9d3763548953240f534a55f2da Mon Sep 17 00:00:00 2001
From: zdl <3489966805@qq.com>
Date: Tue, 11 Nov 2025 22:47:27 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0UI?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/index.js                     |  3 +++
 src/styles/bytedesk-override.css | 35 ++++++++++++++++++++++++++++++++
 2 files changed, 38 insertions(+)
 create mode 100644 src/styles/bytedesk-override.css

diff --git a/src/index.js b/src/index.js
index 510b097c..9d3dc670 100755
--- a/src/index.js
+++ b/src/index.js
@@ -6,6 +6,9 @@ import { BrowserRouter as Router } from 'react-router-dom';
 import './styles/brainwave.css';
 import './styles/brainwave-colors.css';
 
+// 导入 Bytedesk 客服系统 z-index 覆盖样式（必须在所有样式之后导入）
+import './styles/bytedesk-override.css';
+
 // Import the main App component
 import App from './App';
 
diff --git a/src/styles/bytedesk-override.css b/src/styles/bytedesk-override.css
new file mode 100644
index 00000000..b479b0b1
--- /dev/null
+++ b/src/styles/bytedesk-override.css
@@ -0,0 +1,35 @@
+/**
+ * Bytedesk 客服系统 z-index 覆盖样式
+ *
+ * 问题: Bytedesk 默认 z-index 为 10001，项目中部分元素使用 z-index: 99999
+ * 导致客服 iframe 在首页被内容区覆盖，不可见
+ *
+ * 解决方案: 将所有 Bytedesk 相关元素的 z-index 提升到 999999
+ * 确保客服窗口始终显示在最上层
+ */
+
+/* Bytedesk 主容器 - 客服图标按钮 */
+[class*="bytedesk"],
+[id*="bytedesk"],
+[class*="BytedeskWeb"] {
+  z-index: 999999 !important;
+}
+
+/* Bytedesk iframe - 聊天窗口 */
+iframe[src*="bytedesk"],
+iframe[src*="/chat/"],
+iframe[src*="/visitor/"] {
+  z-index: 999999 !important;
+}
+
+/* Bytedesk 覆盖层（如果存在） */
+.bytedesk-overlay,
+[class*="bytedesk-overlay"] {
+  z-index: 999998 !important;
+}
+
+/* Bytedesk 通知气泡 */
+.bytedesk-badge,
+[class*="bytedesk-badge"] {
+  z-index: 1000000 !important;
+}