[4.0] Media browser rtl (#34830)

Various fixes for the media manager when in RTL using css logical properties instead of adding new classes just for rtl. Media breadcrumbs needs some more rtl love but thats for another pr.

Author: brianteeman

build/media_source/com_media/scss/components/_media-browser.scss

@@ -2,7 +2,7 @@
 .media-browser {
   position: relative;
   min-height: 70vh;
-  border-left: 1px solid $border-color;
+  border-inline-start: 1px solid $border-color;
   transition: width .3s cubic-bezier(.4, 0, .2, 1);
 }
 

build/media_source/com_media/scss/components/_media-infobar.scss

@@ -12,7 +12,7 @@ $fa-css-prefix:    fa;
   padding: $gutter-width;
   overflow-y: auto;
   background-color: $info-bg;
-  border-left: 1px solid $border-color;
+  border-inline-start: 1px solid $border-color;
   h2 {
     padding: 8px ($gutter-width + 15px) 8px ($gutter-width - 5px);
     margin: (-$gutter-width) (-$gutter-width) $gutter-width;

build/media_source/com_media/scss/components/_media-toolbar.scss

@@ -5,7 +5,7 @@
   padding: 0;
   background-color: $toolbar-bg;
   border-bottom: 1px solid $border-color;
-  border-left: 1px solid $border-color;
+  border-inline-start: 1px solid $border-color;
   border-radius: $border-radius $border-radius 0 0;
   box-shadow: 0 -1px 0 0  $border-color;
   input {
@@ -20,7 +20,7 @@
     text-align: center;
     background-color: transparent;
     border: 0;
-    border-left: 1px solid $border-color;
+    border-inline-start: 1px solid $border-color;
     box-shadow: 1px 0 #fefefe inset;
     &:hover {
       background-color: $toolbar-icon-bg-hover;