优化 职务图标文字提示

public/css/chat.css

@@ -452,21 +452,50 @@ a:hover {
     line-height: 1;
 }
 
-.chat-hover-tooltip {
-    position: fixed;
+.user-badge-icon::after {
+    content: attr(data-instant-tooltip);
+    position: absolute;
+    left: calc(100% + 8px);
+    top: 50%;
     z-index: 10030;
-    max-width: min(220px, calc(100vw - 16px));
-    padding: 5px 8px;
+    min-width: max-content;
+    max-width: 200px;
+    padding: 4px 8px;
     border: 1px solid #244d77;
     border-radius: 4px;
     background: linear-gradient(to bottom, #fffef2, #fff6c9);
     color: #243b53;
     font-size: 11px;
-    line-height: 1.4;
+    line-height: 1.35;
+    white-space: nowrap;
     box-shadow: 0 6px 18px rgba(17, 34, 51, 0.24);
+    transform: translateY(-50%);
+    opacity: 0;
+    visibility: hidden;
     pointer-events: none;
-    white-space: normal;
-    word-break: break-word;
+}
+
+.user-badge-icon::before {
+    content: '';
+    position: absolute;
+    left: calc(100% + 4px);
+    top: 50%;
+    z-index: 10031;
+    width: 6px;
+    height: 6px;
+    border-left: 1px solid #244d77;
+    border-bottom: 1px solid #244d77;
+    background: #fff9d8;
+    transform: translateY(-50%) rotate(45deg);
+    opacity: 0;
+    visibility: hidden;
+    pointer-events: none;
+}
+
+.user-badge-icon:hover::after,
+.user-badge-icon:hover::before {
+    opacity: 1;
+    visibility: visible;
 }
 
 /* 在线人数统计 */