From 42a60d14d5cca5bd88bdea76bfdbf8eca2d1cbd9 Mon Sep 17 00:00:00 2001
From: unknown <kate522@88.com>
Date: Wed, 12 Aug 2026 13:59:45 +0800
Subject: [PATCH] fix(nav): align VIP hover card titles

The shared VIP image style is block-level, so the hover-card title now uses explicit icon and label flex items to keep both vertically centered on one row.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 .../css/frontend/nav/header-menu-buttons.css  | 19 +++++++++++++++++--
 src/Content/VipServiceModal.php               |  2 +-
 2 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/assets/css/frontend/nav/header-menu-buttons.css b/assets/css/frontend/nav/header-menu-buttons.css
index 5b9c933c..b5297590 100644
--- a/assets/css/frontend/nav/header-menu-buttons.css
+++ b/assets/css/frontend/nav/header-menu-buttons.css
@@ -591,13 +591,28 @@ body.theme-dark body > .drop-newadd .newadd-btns__item {
 }
 
 .sub-vip-card .vip-name {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
   font-size: 16px;
   position: relative;
   z-index: 1;
 }
 
-.sub-vip-card .vip-name .mr6 {
-  margin-right: 6px;
+.sub-vip-card .vip-name__icon {
+  display: flex;
+  flex: 0 0 auto;
+  align-items: center;
+}
+
+.sub-vip-card .vip-name__icon .aksrt-vip-level-icon {
+  display: block;
+  height: 1.1em;
+  width: auto;
+}
+
+.sub-vip-card .vip-name__label {
+  min-width: 0;
 }
 
 .sub-vip-card .v-equity,
diff --git a/src/Content/VipServiceModal.php b/src/Content/VipServiceModal.php
index 2f992942..7308a189 100644
--- a/src/Content/VipServiceModal.php
+++ b/src/Content/VipServiceModal.php
@@ -170,7 +170,7 @@ trait VipServiceModal {
         $html .= '<div class="vip-baicon" aria-hidden="true">' . $icon . '</div>';
         $html .= '<div class="vip-img abs-right">' . $icon . '</div>';
         $html .= '<div class="relative">';
-        $html .= '<div class="vip-name mb10"><span class="mr6">' . $icon . '</span>' . esc_html($name) . '</div>';
+        $html .= '<div class="vip-name mb10"><span class="vip-name__icon">' . $icon . '</span><span class="vip-name__label">' . esc_html($name) . '</span></div>';
         if ($desc !== '') {
             $html .= '<div class="mb6 font-bold em09">' . esc_html($desc) . '</div>';
         }