Fix RTL issue on date selector in lower resolutions & color slider (#13326)

src/components/date-range-picker.ts

@@ -221,6 +221,10 @@ class DateRangePickerElement extends WrappedElement {
           .calendar-table {
             padding: 0 !important;
           }
+          .daterangepicker.ltr {
+            direction: ltr;
+            text-align: left;
+          }
         `;
     const shadowRoot = this.shadowRoot!;
     shadowRoot.appendChild(style);

src/components/ha-selector/ha-selector-color-temp.ts

@@ -47,7 +47,7 @@ export class HaColorTempSelector extends LitElement {
   static styles = css`
     ha-labeled-slider {
       --ha-slider-background: -webkit-linear-gradient(
-        right,
+        var(--float-end),
         rgb(255, 160, 0) 0%,
         white 50%,
         rgb(166, 209, 255) 100%

src/dialogs/more-info/controls/more-info-light.ts

@@ -579,7 +579,7 @@ class MoreInfoLight extends LitElement {
 
       .color_temp {
         --ha-slider-background: -webkit-linear-gradient(
-          right,
+          var(--float-end),
           rgb(255, 160, 0) 0%,
           white 50%,
           rgb(166, 209, 255) 100%