From 0f9549556c9ccab2de87c85f3192cd8893a72d59 Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Fri, 27 Jun 2025 15:51:18 +0000
Subject: [PATCH] Fix: Increase menu icon size

Increased menu icon size in `src/components/ui/modern-sidebar.tsx` to `h-14 w-14` with padding and hover effect.
---
 src/components/ui/modern-sidebar.tsx | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/components/ui/modern-sidebar.tsx b/src/components/ui/modern-sidebar.tsx
index aaa494e..2f250a4 100644
--- a/src/components/ui/modern-sidebar.tsx
+++ b/src/components/ui/modern-sidebar.tsx
@@ -131,10 +131,12 @@ export const MobileSidebar = ({
           <span className="text-lg font-semibold text-blue-700">Finance Home</span>
         </div>
         <div className="flex justify-end z-20">
-          <Menu
-            className="text-neutral-800 dark:text-neutral-200 h-6 w-6 cursor-pointer"
+          <div 
+            className="p-2 rounded-lg hover:bg-gray-100 active:bg-gray-200 transition-colors cursor-pointer"
             onClick={() => setOpen(!open)}
-          />
+          >
+            <Menu className="text-neutral-800 dark:text-neutral-200 h-14 w-14" />
+          </div>
         </div>
         <AnimatePresence>
           {open && (
@@ -152,10 +154,10 @@ export const MobileSidebar = ({
               )}
             >
               <div
-                className="absolute right-6 top-6 z-50 text-neutral-800 dark:text-neutral-200 cursor-pointer"
+                className="absolute right-6 top-6 z-50 text-neutral-800 dark:text-neutral-200 cursor-pointer p-2 rounded-lg hover:bg-gray-100 active:bg-gray-200 transition-colors"
                 onClick={() => setOpen(!open)}
               >
-                <X className="h-6 w-6" />
+                <X className="h-8 w-8" />
               </div>
               <div className="mt-12">
                 {children}