From 9c8f7704dfc882d1d59cfce385734132bba3a173 Mon Sep 17 00:00:00 2001
From: Francis Cao <franciscao@gmail.com>
Date: Tue, 24 Mar 2026 15:29:13 -0700
Subject: [PATCH] Fix tooltip in darkmode

---
 src/components/charts/ChartTooltip.tsx   | 3 +--
 src/components/metrics/WeeklyTraffic.tsx | 5 ++++-
 src/components/metrics/WorldMap.tsx      | 3 +--
 3 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/src/components/charts/ChartTooltip.tsx b/src/components/charts/ChartTooltip.tsx
index 1ce96e395..4389584ca 100644
--- a/src/components/charts/ChartTooltip.tsx
+++ b/src/components/charts/ChartTooltip.tsx
@@ -14,10 +14,9 @@ export function ChartTooltip({
     <FloatingTooltip>
       <Column
         gap="3"
-        color="inverted"
         padding="4"
         borderRadius="md"
-        style={{ backgroundColor: 'rgba(0,0,0,0.8)' }}
+        style={{ backgroundColor: 'rgba(0,0,0,0.8)', color: 'white' }}
       >
         {title && <Text size="sm">{title}</Text>}
         <Row alignItems="center">
diff --git a/src/components/metrics/WeeklyTraffic.tsx b/src/components/metrics/WeeklyTraffic.tsx
index 8c49b915a..7db54eddf 100644
--- a/src/components/metrics/WeeklyTraffic.tsx
+++ b/src/components/metrics/WeeklyTraffic.tsx
@@ -97,7 +97,10 @@ export function WeeklyTraffic({ websiteId }: { websiteId: string }) {
                             />
                           </Row>
                         </Focusable>
-                        <Tooltip placement="right" style={{ backgroundColor: 'rgba(0,0,0,0.8)' }}>
+                        <Tooltip
+                          placement="right"
+                          style={{ backgroundColor: 'rgba(0,0,0,0.8)', color: 'white' }}
+                        >
                           <Text size="base">{`${t(labels.visitors)}: ${count}`}</Text>
                         </Tooltip>
                       </TooltipTrigger>
diff --git a/src/components/metrics/WorldMap.tsx b/src/components/metrics/WorldMap.tsx
index 646903068..9601b7b20 100644
--- a/src/components/metrics/WorldMap.tsx
+++ b/src/components/metrics/WorldMap.tsx
@@ -102,8 +102,7 @@ export function WorldMap({ websiteId, data, ...props }: WorldMapProps) {
       {tooltip && (
         <FloatingTooltip>
           <Box
-            style={{ backgroundColor: 'rgba(0,0,0,0.8)' }}
-            color="inverted"
+            style={{ backgroundColor: 'rgba(0,0,0,0.8)', color: 'white' }}
             padding
             borderRadius="md"
           >