Improve menu item card design

- Larger white cards with rounded corners and soft shadows
- Bigger item images (90x90) with shadow effect
- Gradient placeholder for items without images
- Material wrapper for better touch ripple effect
- Better spacing and layout for card content

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

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

lib/screens/menu_browse_screen.dart

@@ -1,4 +1,4 @@
-import "package:flutter/material.dart";
+import "package:flutter/material.dart";
 import "package:provider/provider.dart";
 
 import "../app/app_router.dart";
@@ -397,11 +397,21 @@ class _MenuBrowseScreenState extends State<MenuBrowseScreen> {
   }
 
   Widget _buildItemImage(int itemId) {
-    return ClipRRect(
+    return Container(
-      borderRadius: BorderRadius.circular(8),
+      width: 90,
-      child: SizedBox(
+      height: 90,
-        width: 64,
+      decoration: BoxDecoration(
-        height: 64,
+        borderRadius: BorderRadius.circular(12),
+        boxShadow: [
+          BoxShadow(
+            color: Colors.black.withOpacity(0.1),
+            blurRadius: 8,
+            offset: const Offset(0, 2),
+          ),
+        ],
+      ),
+      child: ClipRRect(
+        borderRadius: BorderRadius.circular(12),
         child: Image.network(
           "$_imageBaseUrl/items/$itemId.png",
           fit: BoxFit.cover,
@@ -411,16 +421,20 @@ class _MenuBrowseScreenState extends State<MenuBrowseScreen> {
               "$_imageBaseUrl/items/$itemId.jpg",
               fit: BoxFit.cover,
               errorBuilder: (context, error, stackTrace) {
-                // Show placeholder if no image
                 return Container(
                   decoration: BoxDecoration(
-                    color: Theme.of(context).colorScheme.primaryContainer,
+                    gradient: LinearGradient(
-                    borderRadius: BorderRadius.circular(8),
+                      begin: Alignment.topLeft,
+                      end: Alignment.bottomRight,
+                      colors: [Colors.grey.shade200, Colors.grey.shade300],
+                    ),
                   ),
-                  child: Icon(
+                  child: Center(
-                    Icons.restaurant,
+                    child: Icon(
-                    color: Theme.of(context).colorScheme.onPrimaryContainer,
+                      Icons.restaurant_menu,
-                    size: 28,
+                      color: Colors.grey.shade500,
+                      size: 36,
+                    ),
                   ),
                 );
               },
@@ -555,16 +569,27 @@ class _MenuBrowseScreenState extends State<MenuBrowseScreen> {
     final hasModifiers = _itemsByParent.containsKey(item.itemId);
 
     return Container(
-      margin: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
+      margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
       decoration: BoxDecoration(
-        color: Theme.of(context).colorScheme.surface,
+        color: Colors.white,
-        borderRadius: BorderRadius.circular(12),
+        borderRadius: BorderRadius.circular(16),
-        border: Border.all(
+        boxShadow: [
-          color: Theme.of(context).colorScheme.outlineVariant.withAlpha(128),
+          BoxShadow(
-        ),
+            color: Colors.black.withOpacity(0.08),
+            blurRadius: 12,
+            offset: const Offset(0, 4),
+          ),
+          BoxShadow(
+            color: Colors.black.withOpacity(0.04),
+            blurRadius: 4,
+            offset: const Offset(0, 2),
+          ),
+        ],
       ),
-      child: InkWell(
+      child: Material(
-        borderRadius: BorderRadius.circular(12),
+        color: Colors.transparent,
+        child: InkWell(
+          borderRadius: BorderRadius.circular(16),
         onTap: () {
           if (hasModifiers) {
             _showItemCustomization(item);
@@ -573,13 +598,14 @@ class _MenuBrowseScreenState extends State<MenuBrowseScreen> {
           }
         },
         child: Padding(
-          padding: const EdgeInsets.all(16),
+          padding: const EdgeInsets.all(12),
-          child: Row(
+            child: Row(
-            children: [
+              crossAxisAlignment: CrossAxisAlignment.start,
-              // Item image or placeholder
+              children: [
-              _buildItemImage(item.itemId),
+              // Item image with shadow
-              const SizedBox(width: 16),
+                _buildItemImage(item.itemId),
-              // Item details
+                const SizedBox(width: 14),
+                // Item details
               Expanded(
                 child: Column(
                   crossAxisAlignment: CrossAxisAlignment.start,
@@ -634,7 +660,8 @@ class _MenuBrowseScreenState extends State<MenuBrowseScreen> {
                   ),
                 ],
               ),
-            ],
+              ],
+            ),
           ),
         ),
       ),
@@ -1065,7 +1092,7 @@ class _ItemCustomizationSheetState extends State<_ItemCustomizationSheet> {
                   ],
                   const SizedBox(height: 12),
                   Container(
-                    padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
+                    padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
                     decoration: BoxDecoration(
                       color: Theme.of(context).colorScheme.primaryContainer,
                       borderRadius: BorderRadius.circular(20),