diff --git a/src/components/shopping/ShoppingListItem.vue b/src/components/shopping/ShoppingListItem.vue
index bcabd2d..db2b9f0 100644
--- a/src/components/shopping/ShoppingListItem.vue
+++ b/src/components/shopping/ShoppingListItem.vue
@@ -77,7 +77,6 @@
     color: white;
     font-weight: bold;
     z-index: 1000;
-    opacity: 0.6;
 }
 
 .found-marker.found {
diff --git a/src/components/shopping/shopping.js b/src/components/shopping/shopping.js
index e2de8e8..62ed9a7 100644
--- a/src/components/shopping/shopping.js
+++ b/src/components/shopping/shopping.js
@@ -103,7 +103,20 @@ function groupBy(groups, keyFn) {
     return grouped;
 }
 
+function convertToBaseUnits(total) {
+    const baseUnits = {};
+    for (const unit in total) {
+        const conversion = units.getConversionFactor(unit) ?? { unit, factor: 1 };
+        baseUnits[conversion.unit] = (baseUnits[conversion.unit] ?? 0) + total[unit] / conversion.factor;
+    }
+
+    return baseUnits;
+}
+
 function getRemainingIngredients(requiredTotals, foundTotals) {
+    requiredTotals = convertToBaseUnits(requiredTotals);
+    foundTotals = convertToBaseUnits(foundTotals);
+    
     const remaining = {};
     for (const unit in requiredTotals) {
         const required = requiredTotals[unit];