From bcb659c5707566ebecc08a13a868f93746e03808 Mon Sep 17 00:00:00 2001
From: suryac <surya.c@getzino.com>
Date: Fri, 7 Aug 2026 16:09:02 +0530
Subject: [PATCH] graph fix

---
 src/components/reusable/AnalyticsChart.tsx | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/components/reusable/AnalyticsChart.tsx b/src/components/reusable/AnalyticsChart.tsx
index 6022102..2f4c81f 100644
--- a/src/components/reusable/AnalyticsChart.tsx
+++ b/src/components/reusable/AnalyticsChart.tsx
@@ -133,11 +133,13 @@ export function AnalyticsChart({ data, gridCols }: AnalyticsChartProps) {
                 tickLine={false}
                 tick={{ fontSize: 12, fill: '#64748B' }}
                 allowDecimals={false}
+                width={80}
               />
               <Tooltip 
                 cursor={{ fill: '#F8FAFC', stroke: '#E2E8F0', strokeWidth: 1, strokeDasharray: '3 3' }}
                 contentStyle={{ borderRadius: '8px', border: '1px solid #E2E8F0', boxShadow: '0 4px 6px -1px rgb(0 0 0 / 0.1)', fontSize: '14px', fontFamily: 'inherit' }}
                 labelStyle={{ fontWeight: 'bold', color: '#0F172A', marginBottom: '4px' }}
+                wrapperStyle={{ zIndex: 1000 }}
               />
               {hasSeries && <Legend wrapperStyle={{ paddingTop: '20px' }} />}
               {seriesKeys.map((key, i) => {
@@ -220,6 +222,7 @@ export function AnalyticsChart({ data, gridCols }: AnalyticsChartProps) {
                         <Tooltip 
                           contentStyle={{ borderRadius: '8px', border: '1px solid #E2E8F0', boxShadow: '0 4px 6px -1px rgb(0 0 0 / 0.1)', fontSize: '14px', fontFamily: 'inherit' }}
                           itemStyle={{ color: '#0F172A', fontWeight: '500' }}
+                          wrapperStyle={{ zIndex: 1000 }}
                         />
                         <Legend wrapperStyle={{ paddingTop: '20px' }} />
                         <Pie
@@ -240,15 +243,15 @@ export function AnalyticsChart({ data, gridCols }: AnalyticsChartProps) {
                         </Pie>
                       </PieChart>
                     ) : chartType === 1 ? (
-                      <LineChart data={finalData} margin={{ top: 10, right: 10, left: -20, bottom: 0 }} className="focus:outline-none outline-none" style={{ outline: 'none' }}>
+                      <LineChart data={finalData} margin={{ top: 10, right: 10, left: 0, bottom: 10 }} className="focus:outline-none outline-none" style={{ outline: 'none' }}>
                         {renderChartContent()}
                       </LineChart>
                     ) : chartType === 2 ? (
-                      <AreaChart data={finalData} margin={{ top: 10, right: 10, left: -20, bottom: 0 }} className="focus:outline-none outline-none" style={{ outline: 'none' }}>
+                      <AreaChart data={finalData} margin={{ top: 10, right: 10, left: 0, bottom: 10 }} className="focus:outline-none outline-none" style={{ outline: 'none' }}>
                         {renderChartContent()}
                       </AreaChart>
                     ) : (
-                      <BarChart data={finalData} margin={{ top: 10, right: 10, left: -20, bottom: 0 }} className="focus:outline-none outline-none" style={{ outline: 'none' }}>
+                      <BarChart data={finalData} margin={{ top: 10, right: 10, left: 0, bottom: 10 }} className="focus:outline-none outline-none" style={{ outline: 'none' }}>
                         {renderChartContent()}
                       </BarChart>
                     )}