Fix styling for Test Mode badge in block checkout (#11123)

Co-authored-by: Dat Hoang <[email protected]>

Author: rtio

changelog/fix-missing-badge

@@ -0,0 +1,5 @@
+Significance: patch
+Type: fix
+Comment: Fix regression caused by PR #11085
+
+

client/checkout/blocks/style.scss

@@ -45,7 +45,7 @@ button.wcpay-stripelink-modal-trigger:hover {
 .wc-block-checkout__payment-method {
 	input:checked ~ div {
 		/* stylelint-disable-next-line selector-id-pattern */
-		.wc-block-components-radio-control__label:where( #radio-control-wc-payment-method-options-woocommerce_payments__label ) {
+		.wc-block-components-radio-control__label:where( [id^='radio-control-wc-payment-method-options-woocommerce_payments'][id$='__label'] ) {
 			> .payment-method-label {
 				.test-mode.badge {
 					// hiding the badge when the payment method is not selected
@@ -56,7 +56,7 @@ button.wcpay-stripelink-modal-trigger:hover {
 	}
 
 	/* stylelint-disable-next-line selector-id-pattern */
-	.wc-block-components-radio-control__label:where( #radio-control-wc-payment-method-options-woocommerce_payments__label ) {
+	.wc-block-components-radio-control__label:where( [id^='radio-control-wc-payment-method-options-woocommerce_payments'][id$='__label'] ) {
 		width: 100%;
 		display: block !important;