From 4441b577c333a61a90a705f23e84c27aa2122a58 Mon Sep 17 00:00:00 2001
From: Zyy <zyycn@users.noreply.github.com>
Date: Sun, 6 Sep 2026 14:14:53 +0800
Subject: [PATCH] fix(theme): strengthen popover header separation

Promote structured popover headers from the tertiary fill to the secondary fill so they remain visually distinct from striped and hovered table rows in both light and dark themes.

Keep the health timeline arrow matched to its header surface when the popover placement flips.

Validated across all preset light and dark palettes, frontend lint, typecheck and production build.

Co-authored-by: Codex <noreply@openai.com>
---
 .../views/accounts/components/AccountQuotaSummaryCell/Entry.vue | 2 +-
 .../src/views/accounts/components/AccountStatusBadge/index.vue  | 2 +-
 .../views/dashboard/components/HealthTimelinePointPopover.vue   | 2 +-
 .../views/dashboard/components/RequestHealthTimelineCard.vue    | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/frontend/src/views/accounts/components/AccountQuotaSummaryCell/Entry.vue b/frontend/src/views/accounts/components/AccountQuotaSummaryCell/Entry.vue
index d1697afba..29b7dd467 100644
--- a/frontend/src/views/accounts/components/AccountQuotaSummaryCell/Entry.vue
+++ b/frontend/src/views/accounts/components/AccountQuotaSummaryCell/Entry.vue
@@ -104,7 +104,7 @@ function quotaWindowCode(windowSeconds: number | null, role: AccountQuotaWindow[
     </template>
 
     <section class="w-84 overflow-hidden rounded-cp-lg" role="dialog" :aria-label="`${detailTitle}详情`">
-      <header v-if="detailHeading" class="bg-cp-fill-tertiary px-3 py-2.5">
+      <header v-if="detailHeading" class="bg-cp-fill-secondary px-3 py-2.5">
         <h3 class="m-0 truncate text-cp leading-5 font-heavy text-cp-text" :title="detailHeading">
           {{ detailHeading }}
         </h3>
diff --git a/frontend/src/views/accounts/components/AccountStatusBadge/index.vue b/frontend/src/views/accounts/components/AccountStatusBadge/index.vue
index a17549923..c10c67370 100644
--- a/frontend/src/views/accounts/components/AccountStatusBadge/index.vue
+++ b/frontend/src/views/accounts/components/AccountStatusBadge/index.vue
@@ -68,7 +68,7 @@ const presentation = computed(() =>
     </template>
 
     <section class="w-88 overflow-hidden rounded-cp-lg">
-      <header class="flex items-start gap-3 bg-cp-fill-tertiary px-4 py-3">
+      <header class="flex items-start gap-3 bg-cp-fill-secondary px-4 py-3">
         <span
           class="inline-flex size-9 shrink-0 items-center justify-center rounded-cp"
           :class="presentation.statusStyle.icon"
diff --git a/frontend/src/views/dashboard/components/HealthTimelinePointPopover.vue b/frontend/src/views/dashboard/components/HealthTimelinePointPopover.vue
index b3b6918a5..d51c05827 100644
--- a/frontend/src/views/dashboard/components/HealthTimelinePointPopover.vue
+++ b/frontend/src/views/dashboard/components/HealthTimelinePointPopover.vue
@@ -62,7 +62,7 @@ const metricItems = outcomeMeta
     :aria-label="`${point.time} 请求健康详情`"
     class="overflow-hidden rounded-cp-lg bg-cp-bg-elevated"
   >
-    <header class="flex items-center justify-between gap-3 bg-cp-fill-tertiary px-3.5 py-3">
+    <header class="flex items-center justify-between gap-3 bg-cp-fill-secondary px-3.5 py-3">
       <div class="flex min-w-0 items-center gap-2">
         <span class="size-2 shrink-0 rounded-full" :class="status.cellClass" />
         <strong class="font-mono text-cp leading-none font-heavy text-cp-text">
diff --git a/frontend/src/views/dashboard/components/RequestHealthTimelineCard.vue b/frontend/src/views/dashboard/components/RequestHealthTimelineCard.vue
index 9aaec91fc..3aeebf600 100644
--- a/frontend/src/views/dashboard/components/RequestHealthTimelineCard.vue
+++ b/frontend/src/views/dashboard/components/RequestHealthTimelineCard.vue
@@ -14,7 +14,7 @@ const props = defineProps<{
 }>()
 
 const healthPopoverArrowSurfaceClasses = {
-  top: 'bg-cp-fill-tertiary',
+  top: 'bg-cp-fill-secondary',
   bottom: 'bg-cp-bg-elevated',
 }