From 7132b6c65deb17dec2ea2c5a636123c526cde63c Mon Sep 17 00:00:00 2001
From: Shivam Mishra <scm.mymail@gmail.com>
Date: Tue, 21 Jul 2026 16:50:14 +0530
Subject: [PATCH] feat: always show hint icons and adjust overview card spacing

---
 .../captain/pageComponents/overview/KnowledgeCard.vue         | 4 ++--
 .../captain/pageComponents/overview/MetricCard.vue            | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/app/javascript/dashboard/components-next/captain/pageComponents/overview/KnowledgeCard.vue b/app/javascript/dashboard/components-next/captain/pageComponents/overview/KnowledgeCard.vue
index 80c7ae69d..c796ac264 100644
--- a/app/javascript/dashboard/components-next/captain/pageComponents/overview/KnowledgeCard.vue
+++ b/app/javascript/dashboard/components-next/captain/pageComponents/overview/KnowledgeCard.vue
@@ -57,13 +57,13 @@ const stats = computed(() => [
         {{ $t('CAPTAIN.OVERVIEW.KNOWLEDGE.COVERAGE', { pct: approvedPct }) }}
       </span>
     </div>
-    <div class="w-full h-2 overflow-hidden rounded-full bg-n-alpha-2">
+    <div class="w-full h-2 mt-4 overflow-hidden rounded-full bg-n-alpha-2">
       <div
         class="h-full rounded-full bg-n-brand"
         :style="{ width: `${approvedPct}%` }"
       />
     </div>
-    <div class="grid grid-cols-3 gap-3">
+    <div class="grid grid-cols-3 gap-3 mt-4">
       <RouterLink
         v-for="stat in stats"
         :key="stat.key"
diff --git a/app/javascript/dashboard/components-next/captain/pageComponents/overview/MetricCard.vue b/app/javascript/dashboard/components-next/captain/pageComponents/overview/MetricCard.vue
index 9a68b71ce..834383510 100644
--- a/app/javascript/dashboard/components-next/captain/pageComponents/overview/MetricCard.vue
+++ b/app/javascript/dashboard/components-next/captain/pageComponents/overview/MetricCard.vue
@@ -26,7 +26,7 @@ const onActivate = () => {
 
 <template>
   <div
-    class="flex flex-col gap-3 p-5 group bg-n-solid-1"
+    class="flex flex-col gap-3 p-5 bg-n-solid-1"
     :class="
       clickable
         ? 'cursor-pointer transition-colors hover:bg-n-slate-2/50 focus-visible:outline focus-visible:outline-2 focus-visible:outline-n-brand'
@@ -43,7 +43,7 @@ const onActivate = () => {
       <span
         v-if="hint"
         v-tooltip="hint"
-        class="transition-opacity opacity-0 cursor-help i-lucide-info size-3.5 text-n-slate-10 group-hover:opacity-100"
+        class="cursor-help i-lucide-info size-3.5 text-n-slate-9"
       />
     </div>
     <div v-if="loading" class="flex items-end justify-between gap-2">