Separator block: Reduce default border styles to avoid conflicts with…

… global styles (#60740)

Unlinked contributors: dashkevych.

Co-authored-by: andrewserong <andrewserong@git.wordpress.org>
Co-authored-by: ramonjd <ramonopoly@git.wordpress.org>
Co-authored-by: tellthemachines <isabel_brison@git.wordpress.org>

packages/block-library/src/separator/style.scss

@@ -1,12 +1,4 @@
 .wp-block-separator {
-	border-top: 2px solid currentColor;
-	// Default, thin style, is stored in theme.scss so it can be opted out of
-
-	// Unset the left, right and bottom borders by default, otherwise some browsers will render them as "inset".
-	border-left: none;
-	border-right: none;
-	border-bottom: none;
-
 	// Dots style
 	&.is-style-dots {
 		// Override any background themes often set on the hr tag for this style.
@@ -28,3 +20,14 @@
 		}
 	}
 }
+
+// Lowest specificity to avoid overriding global styles.
+:where(.wp-block-separator) {
+	border-top: 2px solid currentColor;
+	// Default, thin style, is stored in theme.scss so it can be opted out of
+
+	// Unset the left, right and bottom borders by default, otherwise some browsers will render them as "inset".
+	border-left: none;
+	border-right: none;
+	border-bottom: none;
+}