From dad3a41caac36432114c33a72f55f765689eb636 Mon Sep 17 00:00:00 2001
From: Karol Manijak <20098064+kmanijak@users.noreply.github.com>
Date: Fri, 25 Aug 2023 16:26:18 +0200
Subject: [PATCH] Fix UI misalignment of Filter by Price in TT1 theme
 (https://github.com/woocommerce/woocommerce-blocks/pull/10732)

* Fix UI misalignment of Filter by Price in TT1 theme

* Fix frontend Firefox styles

* Simplify the styles and fix them in Editor (Firefox/Safari)

* Align the background color and sizing in Firefox
---
 .../base/components/price-slider/style.scss   | 20 ++++++++++++++-----
 1 file changed, 15 insertions(+), 5 deletions(-)

diff --git a/plugins/woocommerce-blocks/assets/js/base/components/price-slider/style.scss b/plugins/woocommerce-blocks/assets/js/base/components/price-slider/style.scss
index 714d23c9fa6..feb3a2e8514 100644
--- a/plugins/woocommerce-blocks/assets/js/base/components/price-slider/style.scss
+++ b/plugins/woocommerce-blocks/assets/js/base/components/price-slider/style.scss
@@ -331,11 +331,10 @@
 	}
 	.wc-block-components-price-slider__range-input-progress {
 		--range-color: currentColor;
-		margin: -$border-width;
 	}
 	.wc-block-price-filter__range-input {
 		background: transparent;
-		margin: -$border-width;
+		height: 0;
 		width: calc(100% + #{$border-width * 2});
 		&:hover,
 		&:focus {
@@ -350,13 +349,24 @@
 			}
 		}
 		&::-webkit-slider-thumb {
-			margin-top: -9px;
+			background: $white;
+			margin-top: -6px;
+			width: 12px;
+			height: 12px;
 		}
 		&.wc-block-components-price-slider__range-input--max::-moz-range-thumb {
-			transform: translate(2px, 1px);
+			background: $white;
+			transform: translate(2px, 2px);
+			width: 12px;
+			height: 12px;
+			box-sizing: content-box;
 		}
 		&.wc-block-components-price-slider__range-input--min::-moz-range-thumb {
-			transform: translate(-2px, 1px);
+			background: $white;
+			transform: translate(-2px, 2px);
+			width: 12px;
+			height: 12px;
+			box-sizing: content-box;
 		}
 		&::-ms-track {
 			border-color: transparent !important;