Refactor monthly comparison chart

Modify expense text and bar color in the monthly comparison chart legend from black to main green.

src/components/analytics/MonthlyComparisonChart.tsx

@@ -58,6 +58,9 @@ const MonthlyComparisonChart: React.FC<MonthlyComparisonChartProps> = ({
     return "#81c784"; // 기본 초록색
   };
 
+  // 지출 색상을 메인 그린으로 통일
+  const mainGreenColor = "#81c784";
+
   return (
     <div className="neuro-card h-72 w-full">
       {hasValidData ? (
@@ -77,15 +80,15 @@ const MonthlyComparisonChart: React.FC<MonthlyComparisonChartProps> = ({
               contentStyle={{ backgroundColor: 'white', border: 'none' }}
               cursor={{ fill: 'transparent' }}
             />
-            <Legend />
+            <Legend 
+              formatter={(value) => {
+                // 범례 텍스트 색상 설정
+                return <span style={{ color: value === '지출' ? mainGreenColor : undefined }}>{value}</span>;
+              }}
+            />
             <Bar dataKey="budget" name="예산" fill="#C8C8C9" radius={[4, 4, 0, 0]} />
-            <Bar dataKey="expense" name="지출" radius={[4, 4, 0, 0]}>
+            <Bar dataKey="expense" name="지출" fill={mainGreenColor} radius={[4, 4, 0, 0]}>
-              {monthlyData.map((entry, index) => (
+              {/* 개별 셀 색상 설정은 제거하고 통일된 메인 그린 색상 사용 */}
-                <Cell 
-                  key={`cell-${index}`} 
-                  fill={getExpenseColor(entry.budget, entry.expense)} 
-                />
-              ))}
             </Bar>
           </BarChart>
         </ResponsiveContainer>