Add payment categories with emoji icons and image upload support

- Add comprehensive category system: Groceries 🛒, Shopping 🛍️, Travel 🚆, Restaurant 🍽️, Utilities ⚡, Fun 🎉
- Create category utility functions with emoji and display name helpers
- Update Payment model and API validation to support categories
- Add category selectors to payment creation and edit forms
- Display category emojis prominently across all UI components:
  - Dashboard recent activities with category icons and names
  - Payment cards showing category in metadata
  - Payment modals and view pages with category information
- Add image upload/removal functionality to payment edit form
- Maintain responsive design and consistent styling across all components

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

src/routes/api/cospend/payments/+server.ts

@@ -38,7 +38,7 @@ export const POST: RequestHandler = async ({ request, locals }) => {
   }
 
   const data = await request.json();
-  const { title, description, amount, paidBy, date, image, splitMethod, splits } = data;
+  const { title, description, amount, paidBy, date, image, category, splitMethod, splits } = data;
 
   if (!title || !amount || !paidBy || !splitMethod || !splits) {
     throw error(400, 'Missing required fields');
@@ -52,6 +52,10 @@ export const POST: RequestHandler = async ({ request, locals }) => {
     throw error(400, 'Invalid split method');
   }
 
+  if (category && !['groceries', 'shopping', 'travel', 'restaurant', 'utilities', 'fun'].includes(category)) {
+    throw error(400, 'Invalid category');
+  }
+
   await dbConnect();
   
   try {
@@ -63,6 +67,7 @@ export const POST: RequestHandler = async ({ request, locals }) => {
       paidBy,
       date: date ? new Date(date) : new Date(),
       image,
+      category: category || 'groceries',
       splitMethod,
       createdBy: auth.user.nickname
     });

src/routes/api/cospend/payments/[id]/+server.ts

@@ -61,6 +61,7 @@ export const PUT: RequestHandler = async ({ params, request, locals }) => {
         paidBy: data.paidBy,
         date: data.date ? new Date(data.date) : payment.date,
         image: data.image,
+        category: data.category || payment.category,
         splitMethod: data.splitMethod
       },
       { new: true }