diff --git a/frontend/src/pages/GroceryList.jsx b/frontend/src/pages/GroceryList.jsx
index ec1f42e..e86ae13 100644
--- a/frontend/src/pages/GroceryList.jsx
+++ b/frontend/src/pages/GroceryList.jsx
@@ -7,6 +7,7 @@ import GroceryListItem from "../components/items/GroceryListItem";
 import AddItemWithDetailsModal from "../components/modals/AddItemWithDetailsModal";
 import EditItemModal from "../components/modals/EditItemModal";
 import SimilarItemModal from "../components/modals/SimilarItemModal";
+import { ZONE_FLOW } from "../constants/classifications";
 import { ROLES } from "../constants/roles";
 import { AuthContext } from "../context/AuthContext";
 import "../styles/pages/GroceryList.css";
@@ -62,19 +63,31 @@ export default function GroceryList() {
     if (sortMode === "qty-low") sorted.sort((a, b) => a.quantity - b.quantity);
     if (sortMode === "zone") {
       sorted.sort((a, b) => {
-        if (!a.item_type && b.item_type) return 1;
-        if (a.item_type && !b.item_type) return -1;
-        if (!a.item_type && !b.item_type) return a.item_name.localeCompare(b.item_name);
+        // Items without classification go to the end
+        if (!a.zone && b.zone) return 1;
+        if (a.zone && !b.zone) return -1;
+        if (!a.zone && !b.zone) return a.item_name.localeCompare(b.item_name);
 
+        // Sort by ZONE_FLOW order
+        const aZoneIndex = ZONE_FLOW.indexOf(a.zone);
+        const bZoneIndex = ZONE_FLOW.indexOf(b.zone);
+
+        // If zone not in ZONE_FLOW, put at end
+        const aIndex = aZoneIndex === -1 ? ZONE_FLOW.length : aZoneIndex;
+        const bIndex = bZoneIndex === -1 ? ZONE_FLOW.length : bZoneIndex;
+
+        const zoneCompare = aIndex - bIndex;
+        if (zoneCompare !== 0) return zoneCompare;
+
+        // Then by item_type
         const typeCompare = (a.item_type || "").localeCompare(b.item_type || "");
         if (typeCompare !== 0) return typeCompare;
 
+        // Then by item_group
         const groupCompare = (a.item_group || "").localeCompare(b.item_group || "");
         if (groupCompare !== 0) return groupCompare;
 
-        const zoneCompare = (a.zone || "").localeCompare(b.zone || "");
-        if (zoneCompare !== 0) return zoneCompare;
-
+        // Finally by name
         return a.item_name.localeCompare(b.item_name);
       });
     }