Commit 52e59ddd7ea for woocommerce

commit 52e59ddd7ea8f8980d3418908454a1ea6abf159b
Author: Jana Hernandez <71137829+JanaMW27@users.noreply.github.com>
Date:   Mon Aug 24 14:28:11 2026 +0200

    Fix dropdown icon overlap on WP 7.0+ admin screens (#67918)

    * Reserve room for the dropdown icons on WP 7.0+

    The WP 7.0 block resets the selection text to `padding: 0 12px` so
    dropdowns line up with native inputs, but the chevron is 20px wide and
    sits in that space, so text and the clear (x) run under it.

    Reserve 40px at the end instead, one value for every single select so
    text always ends in the same place. The same reset appears three times:
    the two Order edit rules carry an ID and outrank the shared one, so
    Country, State and Customer need it too.

    Logical properties throughout, including the modal override, which is
    more specific than the new rule and would otherwise keep reserving the
    space on the wrong side in RTL.

    Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

    * Add changelog entry for the dropdown icon overlap fix

    Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

    ---------

    Co-authored-by: Claude Opus 5 <noreply@anthropic.com>

diff --git a/plugins/woocommerce/changelog/67632-fix-select-icon-overlap-wp70 b/plugins/woocommerce/changelog/67632-fix-select-icon-overlap-wp70
new file mode 100644
index 00000000000..1c7650413a3
--- /dev/null
+++ b/plugins/woocommerce/changelog/67632-fix-select-icon-overlap-wp70
@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Fix dropdown text and the clear icon running under the chevron in admin single selects on WP 7.0+, including the Order edit Country, State and Customer fields.
diff --git a/plugins/woocommerce/client/legacy/css/admin.scss b/plugins/woocommerce/client/legacy/css/admin.scss
index 79613737d57..19db97ad399 100644
--- a/plugins/woocommerce/client/legacy/css/admin.scss
+++ b/plugins/woocommerce/client/legacy/css/admin.scss
@@ -8061,18 +8061,17 @@ table.bar_chart {
 		width: 100% !important;
 	}

-	// Reserve room for the clear (x) and chevron icons; .wc-backbone-modal-content lifts specificity
-	// to 0,5,0 so the later, equal-specificity WP 7.0 reset (`.wc-wp-version-gte-70 ... padding: 0 12px`)
-	// no longer wins the right padding.
+	// Reserve the end of the field for the clear (x) and chevron inside modals on every WP
+	// version; the .wc-wp-version-gte-70 rule below only reaches WP 7.0+.
 	.wc-backbone-modal-content .select2-container .select2-selection--single {
 		.select2-selection__rendered {
-			padding-right: 40px;
+			padding-inline-end: 40px;
 		}

 		// Pull the clear (x) into the 40px padding zone so it sits beside the chevron
 		// rather than at the text edge.
 		.select2-selection__clear {
-			margin-right: -10px;
+			margin-inline-end: -10px;
 		}
 	}
 }
@@ -8531,7 +8530,15 @@ table.bar_chart {

 			.select2-selection__rendered {
 				line-height: 38px;
-				padding: 0 12px; // Match WP 7.0 native input padding so text aligns with sibling inputs.
+				padding-block: 0;
+				// 12px matches WP 7.0 native input padding; 40px reserves the end for the chevron and the clear (x).
+				padding-inline: 12px 40px;
+			}
+
+			// Pull the clear (x) into the reserved zone so it sits beside the chevron
+			// rather than out at the text edge.
+			.select2-selection__clear {
+				margin-inline-end: -10px;
 			}

 			.select2-selection__arrow {
@@ -8566,7 +8573,8 @@ table.bar_chart {

 		.select2-selection__rendered {
 			line-height: 38px;
-			padding: 0 12px; // Match WP 7.0 native input padding.
+			padding-block: 0;
+			padding-inline: 12px 40px; // Match WP 7.0 native input padding, reserving the end for the icons.
 		}

 		.select2-selection__arrow {
@@ -8582,7 +8590,8 @@ table.bar_chart {

 		.select2-selection__rendered {
 			line-height: 38px;
-			padding: 0 12px;
+			padding-block: 0;
+			padding-inline: 12px 40px; // Match WP 7.0 native input padding, reserving the end for the icons.
 		}

 		.select2-selection__arrow {