refactor: improve checkbox styling and remove popup

- Update photo save checkbox to match app design (border-slate-600, htmlFor label)
- Remove success popup overlay - modal closes immediately after save
- Simplify confirmSingleItem to remove setTimeout logic
- Toast notification used for user feedback instead

frontend/components/AIOnboarding.tsx

@@ -29,7 +29,6 @@ export default function AIOnboarding({ onCancel, onComplete, categories, invento
     fileInputRef,
     existingTypes,
     existingBoxes,
-    savingIndex,
     startLiveCamera,
     stopLiveCamera,
     captureSnapshot,
@@ -238,15 +237,18 @@ export default function AIOnboarding({ onCancel, onComplete, categories, invento
               </div>
               <div className="p-3 space-y-2">
                 <p className="text-xs text-muted font-normal">Extracted Photo</p>
-                <label className="flex items-center gap-2 cursor-pointer">
+                <div className="flex items-center gap-2">
                   <input
                     type="checkbox"
+                    id="save-photo-check"
                     checked={!extractedItems[editingIndex]._skipPhoto}
                     onChange={(e) => updateEditingItem({ _skipPhoto: !e.target.checked })}
-                    className="w-4 h-4 accent-primary cursor-pointer"
+                    className="w-4 h-4 rounded border-slate-600 accent-primary cursor-pointer"
                   />
-                  <span className="text-xs text-secondary font-normal">Save this photo with the item</span>
-                </label>
+                  <label htmlFor="save-photo-check" className="text-xs text-slate-300 font-normal cursor-pointer">
+                    Save this photo with the item
+                  </label>
+                </div>
               </div>
             </div>
           )}
@@ -485,26 +487,6 @@ export default function AIOnboarding({ onCancel, onComplete, categories, invento
         </div>
       )}
 
-      {/* Success confirmation overlay */}
-      {savingIndex !== null && image && (
-        <div className="fixed inset-0 bg-black/70 flex items-center justify-center z-50 animate-in fade-in duration-200">
-          <div className="flex flex-col items-center gap-4">
-            <div className="w-48 h-48 rounded-3xl overflow-hidden border-4 border-green-500 shadow-2xl">
-              <img
-                src={image}
-                alt="Saved item photo"
-                className="w-full h-full object-contain bg-black"
-              />
-            </div>
-            <div className="text-center">
-              <p className="text-white text-lg font-normal mb-2">Item saved!</p>
-              <p className="text-secondary text-xs font-normal">
-                {extractedItems[savingIndex]?.Item || extractedItems[savingIndex]?.name || "New item"} added to catalog
-              </p>
-            </div>
-          </div>
-        </div>
-      )}
     </div>
   );
 }

frontend/hooks/useAIExtraction.ts

@@ -11,7 +11,6 @@ export function useAIExtraction(inventory: Item[], onComplete: (itemData: any) =
   const [mode, setMode] = useState<'item' | 'box'>('item');
   const [isLive, setIsLive] = useState(false);
   const [extractedImageBlob, setExtractedImageBlob] = useState<Blob | null>(null);
-  const [savingIndex, setSavingIndex] = useState<number | null>(null);
 
   const videoRef = useRef<HTMLVideoElement>(null);
   const canvasRef = useRef<HTMLCanvasElement>(null);
@@ -159,23 +158,17 @@ export function useAIExtraction(inventory: Item[], onComplete: (itemData: any) =
       })
     };
 
-    // Show success briefly before closing
-    setSavingIndex(index);
     onComplete(newItem);
 
-    // Reset UI after brief delay so user sees the success
-    setTimeout(() => {
-      if (extractedItems.length > 1) {
-        const remaining = [...extractedItems];
-        remaining.splice(index, 1);
-        setExtractedItems(remaining);
-        setEditingIndex(null);
-      } else {
-        setExtractedItems([]);
-        setEditingIndex(null);
-      }
-      setSavingIndex(null);
-    }, 1500);
+    if (extractedItems.length > 1) {
+      const remaining = [...extractedItems];
+      remaining.splice(index, 1);
+      setExtractedItems(remaining);
+      setEditingIndex(null);
+    } else {
+      setExtractedItems([]);
+      setEditingIndex(null);
+    }
   };
 
   const confirmAllItems = async () => {
@@ -263,7 +256,6 @@ export function useAIExtraction(inventory: Item[], onComplete: (itemData: any) =
     existingBoxes,
     extractedImageBlob,
     setExtractedImageBlob,
-    savingIndex,
     startLiveCamera,
     stopLiveCamera,
     captureSnapshot,