Issue #3332701: Refactor Claro's tablesort-indicator stylesheet

core/themes/claro/css/components/tablesort-indicator.css

@@ -14,9 +14,9 @@
   position: absolute;
   top: 50%;
   inset-inline-end: 1rem;
-  width: 0.875rem; /* 14px */
+  width: 0.875rem;
   height: var(--space-m);
-  margin-block-start: -0.5rem; /* -8px */
+  margin-block-start: -0.5rem;
   opacity: 0.5;
   background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8'%3e%3cpath d='M1.75.25v1.5h10.5V.25zm0 3v1.5h7.5v-1.5zm0 3v1.5h4.5v-1.5z' fill='%23000f33'/%3e%3c/svg%3e");
   background-repeat: no-repeat;
@@ -38,7 +38,8 @@
 }
 
 [dir="rtl"] .tablesort {
-  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8'%3e%3cpath d='M12.25.25v1.5H1.75V.25zm0 3v1.5h-7.5v-1.5zm0 3v1.5h-4.5v-1.5z' fill='%23000f33'/%3e%3c/svg%3e");
+  /* Horizontally flip the element. */
+  transform: scaleX(-1);
 }
 
 .tablesort--asc {