diff --git a/erpnext/public/scss/shopping_cart.scss b/erpnext/public/scss/shopping_cart.scss
index 126c6fd4a67..0279f2285c9 100644
--- a/erpnext/public/scss/shopping_cart.scss
+++ b/erpnext/public/scss/shopping_cart.scss
@@ -1,7 +1,5 @@
 @import "frappe/public/scss/common/mixins";
 
-$wish-red: #F47A7A;
-
 body.product-page {
 	background: var(--gray-50);
 }
@@ -210,13 +208,13 @@ body.product-page {
 
 	.btn-add-to-wishlist {
 		svg use {
-			stroke: var(--wish-red);
+			stroke: #F47A7A;
 		}
 	}
 
 	.btn-view-in-wishlist {
 		svg use {
-			fill: var(--wish-red);
+			fill: #F47A7A;
 			stroke: none;
 		}
 	}
@@ -602,16 +600,16 @@ body.product-page {
 
 .not-wished {
 	cursor: pointer;
-	stroke: var(--wish-red) !important;
+	stroke: #F47A7A !important;
 
 	&:hover {
-		fill: var(--wish-red);
+		fill: #F47A7A;
 	}
 }
 
 .wished {
 	stroke: none;
-	fill: var(--wish-red) !important;
+	fill: #F47A7A !important;
 }
 
 .list-row-checkbox {
@@ -687,6 +685,7 @@ body.product-page {
 }
 
 .remove-wish {
+	background-color: var(--gray-200);
 	position: absolute;
 	top:10px;
 	right: 20px;
@@ -694,10 +693,6 @@ body.product-page {
 	border: 1px solid var(--gray-100);
 	width: 25px;
 	height: 25px;
-
-	&:hover {
-		background-color: var(--gray-100);
-	}
 }
 
 .wish-removed {
diff --git a/erpnext/templates/includes/macros.html b/erpnext/templates/includes/macros.html
index 77c56495d3f..2d771b4c0ac 100644
--- a/erpnext/templates/includes/macros.html
+++ b/erpnext/templates/includes/macros.html
@@ -165,7 +165,7 @@
 
 
 {%- macro wishlist_card(item, settings) %}
-<div class="col-sm-3 item-card" style="min-width: 220px;">
+<div class="col-sm-3 item-card">
 	<div class="card text-center">
 		{% if item.image %}
 			<div class="card-img-container">