Enhance budget input display

- Display existing values in budget input fields.
- Remove recessed boxes from category inputs.
- Add icons to 식비, 생활비, and 교통비 categories.

src/components/BudgetTabContent.tsx

@@ -67,6 +67,21 @@ const BudgetTabContent: React.FC<BudgetTabContentProps> = ({
     setShowBudgetInput(false);
   };
 
+  // 기존 카테고리 예산 불러오기
+  useEffect(() => {
+    if (showBudgetInput) {
+      // 로컬 스토리지에서 카테고리 예산 불러오기
+      try {
+        const storedCategoryBudgets = localStorage.getItem('categoryBudgets');
+        if (storedCategoryBudgets) {
+          setCategoryBudgets(JSON.parse(storedCategoryBudgets));
+        }
+      } catch (error) {
+        console.error('카테고리 예산 불러오기 오류:', error);
+      }
+    }
+  }, [showBudgetInput]);
+
   return <div>
       {targetAmount > 0 ? <>
           <div className="flex justify-between items-center mb-3">
@@ -92,12 +107,12 @@ const BudgetTabContent: React.FC<BudgetTabContentProps> = ({
           <div className="mt-6">
             <button 
               onClick={() => setShowBudgetInput(true)} 
-              className="text-neuro-income hover:underline flex items-center text-base font-bold group"
+              className="text-neuro-income hover:underline flex items-center text-lg font-bold group"
             >
               <div className="mr-2 bg-neuro-income text-white rounded-full p-1 transition-transform group-hover:scale-110">
                 <CirclePlus size={20} className="animate-pulse" />
               </div> 
-              <span className="text-lg">예산 수정하기</span>
+              <span>예산 수정하기</span>
             </button>
           </div>
         </> : <div className="py-4 text-center">

src/components/CategoryBudgetInputs.tsx

@@ -1,7 +1,7 @@
 
 import React from 'react';
 import { Input } from '@/components/ui/input';
-import { EXPENSE_CATEGORIES } from '@/constants/categoryIcons';
+import { EXPENSE_CATEGORIES, categoryIcons } from '@/constants/categoryIcons';
 import { useIsMobile } from '@/hooks/use-mobile';
 
 interface CategoryBudgetInputsProps {
@@ -37,13 +37,16 @@ const CategoryBudgetInputs: React.FC<CategoryBudgetInputsProps> = ({
   return (
     <div className="space-y-3 w-full">
       {EXPENSE_CATEGORIES.map(category => (
-        <div key={category} className="flex items-center justify-between w-full p-2 neuro-pressed rounded-lg">
+        <div key={category} className="flex items-center justify-between w-full p-2 rounded-lg">
+          <div className="flex items-center space-x-2">
+            <span className="text-neuro-income">{categoryIcons[category]}</span>
             <label className="text-sm font-medium text-gray-700">{category}</label>
+          </div>
           <Input 
             value={formatWithCommas(categoryBudgets[category] || 0)} 
             onChange={(e) => handleInput(e, category)}
             placeholder="예산 입력"
-            className={`neuro-pressed transition-colors duration-300 ${isMobile ? 'w-[150px]' : 'max-w-[150px]'}`}
+            className={`transition-colors duration-300 ${isMobile ? 'w-[150px]' : 'max-w-[150px]'}`}
           />
         </div>
       ))}