diff --git a/packages/devextreme/scss/widgets/base/_dropDownEditor.scss b/packages/devextreme/scss/widgets/base/dropDownEditor/_index.scss
similarity index 94%
rename from packages/devextreme/scss/widgets/base/_dropDownEditor.scss
rename to packages/devextreme/scss/widgets/base/dropDownEditor/_index.scss
index 57f27bc1961c..49f831d8c7e9 100644
--- a/packages/devextreme/scss/widgets/base/_dropDownEditor.scss
+++ b/packages/devextreme/scss/widgets/base/dropDownEditor/_index.scss
@@ -1,9 +1,9 @@
+@use "../mixins" as *;
 @use "./mixins" as *;
-@use "./textEditor/mixins" as *;
+@use "../textEditor/mixins" as *;
 
 // adduse
 
-
 .dx-dropdowneditor {
   position: relative;
 
@@ -93,8 +93,4 @@
   .dx-dropdowneditor-button {
     cursor: inherit;
   }
-
-  .dx-dropdowneditor-icon {
-    opacity: 0.2;
-  }
 }
diff --git a/packages/devextreme/scss/widgets/base/dropDownEditor/_mixins.scss b/packages/devextreme/scss/widgets/base/dropDownEditor/_mixins.scss
new file mode 100644
index 000000000000..686991f74f45
--- /dev/null
+++ b/packages/devextreme/scss/widgets/base/dropDownEditor/_mixins.scss
@@ -0,0 +1,34 @@
+@use "../icons" as *;
+
+@mixin invalid-dropdowneditor-input-padding(
+  $invalid-badge-size,
+  $texteditor-underlined-input-horizontal-padding,
+  $texteditor-filled-input-horizontal-padding,
+) {
+  &.dx-dropdowneditor-button-visible {
+    &.dx-editor-underlined {
+      .dx-texteditor-input {
+        padding-inline-end: $invalid-badge-size + $texteditor-underlined-input-horizontal-padding;
+      }
+
+      .dx-start-datebox {
+        .dx-texteditor-input {
+          padding-inline-end: $texteditor-underlined-input-horizontal-padding;
+        }
+      }
+    }
+
+    &.dx-editor-filled,
+    &.dx-editor-outlined {
+      .dx-texteditor-input {
+        padding-inline-end: $invalid-badge-size + $texteditor-filled-input-horizontal-padding;
+      }
+      
+      .dx-start-datebox {
+        .dx-texteditor-input {
+          padding-inline-end: $texteditor-filled-input-horizontal-padding;
+        }
+      }
+    }
+  }
+}
diff --git a/packages/devextreme/scss/widgets/base/switch/_mixins.scss b/packages/devextreme/scss/widgets/base/switch/_mixins.scss
index aba9eaaba38d..28cbc87c95dc 100644
--- a/packages/devextreme/scss/widgets/base/switch/_mixins.scss
+++ b/packages/devextreme/scss/widgets/base/switch/_mixins.scss
@@ -172,8 +172,8 @@
 }
 
 @mixin dx-switch-states-fluent(
+  $switch-on-disabled-bg,
   $switch-handle-disabled-bg,
-  $switch-disabled-bg,
   $switch-shadow,
   $switch-bg,
   $switch-on-bg,
@@ -315,11 +315,8 @@
     &.dx-state-disabled,
     &.dx-state-readonly {
       .dx-switch-container::before {
-        background-color: $base-disabled-border-color;
-      }
-
-      .dx-switch-handle::before {
-        background-color: $switch-handle-disabled-bg;
+        border-color: $switch-on-disabled-bg;
+        background-color: $switch-on-disabled-bg;
       }
     }
   }
diff --git a/packages/devextreme/scss/widgets/base/textArea/_mixins.scss b/packages/devextreme/scss/widgets/base/textArea/_mixins.scss
index 92623a52db55..6f6be5b3da58 100644
--- a/packages/devextreme/scss/widgets/base/textArea/_mixins.scss
+++ b/packages/devextreme/scss/widgets/base/textArea/_mixins.scss
@@ -19,9 +19,13 @@
   
     &.dx-texteditor-with-label,
     &.dx-texteditor-with-floating-label {
-      .dx-placeholder::before,
-      .dx-texteditor-input {
-        padding-top: 0;
+      &.dx-editor-outlined,
+      &.dx-editor-filled,
+      &.dx-editor-underlined {
+        .dx-placeholder::before,
+        .dx-texteditor-input {
+          padding-top: 0;
+        }
       }
   
       &.dx-editor-outlined {
diff --git a/packages/devextreme/scss/widgets/base/textEditor/_mixins.scss b/packages/devextreme/scss/widgets/base/textEditor/_mixins.scss
index ee89f7e9b191..64e2092d0183 100644
--- a/packages/devextreme/scss/widgets/base/textEditor/_mixins.scss
+++ b/packages/devextreme/scss/widgets/base/textEditor/_mixins.scss
@@ -95,17 +95,20 @@
   }
 }
 
-@mixin dx-state-border-color($borderColor) {
+@mixin dx-state-border-color($borderColor, $border-bottom-color) {
   .dx-label {
     border-color: $borderColor;
+    border-bottom-color: $border-bottom-color;
   }
 
   .dx-label-before {
     border-color: $borderColor;
+    border-bottom-color: $border-bottom-color;
   }
 
   .dx-label-after {
     border-color: $borderColor;
+    border-bottom-color: $border-bottom-color;
   }
 }
 
@@ -124,7 +127,6 @@
 }
 
 @mixin dx-editor-outlined(
-  $texteditor-border-color,
   $texteditor-input-border-radius,
   $texteditor-label-font-size,
   $label-border-width,
@@ -137,9 +139,14 @@
   $label-before-min-width,
   $label-after-min-width,
   $base-bg,
+  $texteditor-border,
+  $texteditor-border-color,
+  $texteditor-border-bottom-color,
   $texteditor-disabled-color,
   $texteditor-hover-border-color,
+  $texteditor-hover-border-bottom-color,
   $texteditor-focused-border-color,
+  $texteditor-focused-border-bottom-color,
   $texteditor-invalid-faded-border-color,
   $texteditor-invalid-focused-border-color,
   $texteditor-label-transition,
@@ -158,7 +165,8 @@
       border-bottom-width: $label-border-width;
       border-inline-width: 0;
       border-style: solid;
-      border-color: $texteditor-border-color;
+      border-top-color: $texteditor-border-color;
+      border-bottom-color: $texteditor-border-bottom-color;
       margin-left: -2px;
       margin-right: -2px;
       border-radius: 1px;
@@ -180,7 +188,9 @@
       border-inline-start-width: $label-border-width;
       border-inline-end-width: 0;
       border-style: solid;
-      border-color: $texteditor-border-color;
+      border-top-color: $texteditor-border-color;
+      border-bottom-color: $texteditor-border-bottom-color;
+      border-inline-start-color: $texteditor-border-color;
       border-start-start-radius: $texteditor-input-border-radius;
       border-end-start-radius: $texteditor-input-border-radius;
       min-width: $label-before-min-width;
@@ -194,7 +204,9 @@
       border-inline-end-width: $label-border-width;
       border-inline-start-width: 0;
       border-style: solid;
-      border-color: $texteditor-border-color;
+      border-top-color: $texteditor-border-color;
+      border-bottom-color: $texteditor-border-bottom-color;
+      border-inline-end-color: $texteditor-border-color;
       border-start-end-radius: $texteditor-input-border-radius;
       border-end-end-radius: $texteditor-input-border-radius;
       clip-path: inset(-1px -1px -1px 1px);
@@ -238,38 +250,35 @@
       }
   
       &.dx-texteditor:not(.dx-daterangebox) {
-        border: none;
+        border: $texteditor-border;
         box-shadow: none;
       }
 
       &.dx-state-readonly {
         @include dx-state-border-style($label-readonly-border-style);
-        @include dx-state-border-color($texteditor-disabled-color);
+        @include dx-state-border-color($texteditor-disabled-color, $texteditor-disabled-color);
       }
   
       &.dx-state-disabled {
-        @include dx-state-border-color($texteditor-disabled-color);
+        @include dx-state-border-color($texteditor-disabled-color, $texteditor-disabled-color);
       }
   
       &.dx-invalid {
-        @include dx-state-border-color($texteditor-invalid-faded-border-color);
+        @include dx-state-border-color($texteditor-invalid-faded-border-color, $texteditor-invalid-faded-border-color);
+
+        &.dx-state-hover,
+        &.dx-state-focused {
+          @include dx-state-border-color($texteditor-invalid-focused-border-color, $texteditor-invalid-focused-border-color);
+        }
       }
   
       &.dx-state-hover {
-        @include dx-state-border-color($texteditor-hover-border-color);
-  
-        &.dx-invalid {
-          @include dx-state-border-color($texteditor-invalid-focused-border-color);
-        }
+        @include dx-state-border-color($texteditor-hover-border-color, $texteditor-hover-border-bottom-color);
       }
   
       &.dx-state-focused {
-        @include dx-state-border-color($texteditor-focused-border-color);
+        @include dx-state-border-color($texteditor-focused-border-color, $texteditor-focused-border-bottom-color);
         @include dx-state-border-width($label-active-border-width);
-  
-        &.dx-invalid {
-          @include dx-state-border-color($texteditor-invalid-focused-border-color);
-        }
       }
     }
 
@@ -380,7 +389,7 @@
           height: $texteditor-empty-label-height;
           line-height: $texteditor-empty-label-line-height;
           top: 50%;
-          margin-top: math.div(-$texteditor-label-height, 2);
+          margin-top: math.div(-$texteditor-empty-label-height, 2);
         }
 
         &.dx-textarea {
@@ -461,7 +470,7 @@
           height: $texteditor-empty-label-height;
           line-height: $texteditor-empty-label-line-height;
           top: 50%;
-          margin-top: math.div(-$texteditor-label-height, 2);
+          margin-top: math.div(-$texteditor-empty-label-height, 2);
         }
   
         &.dx-textarea {
@@ -605,13 +614,13 @@
         }
 
         > .dx-dropdowneditor-button:last-child,
-        > .dx-numberbox-spin-container:last-child {
+        > .dx-numberbox-spin-container:last-child,
+        > .dx-clear-button-area {
           margin-inline-end: $material-filled-texteditor-spin-button-horizontal-padding;
         }
 
-        > .dx-clear-button-area:last-child,
-        > .dx-clear-button-area + div:empty:last-child {
-          margin-inline-end: $material-filled-texteditor-input-button-horizontal-padding;
+        > div:empty:last-child {
+          display: none;
         }
       }
     }
diff --git a/packages/devextreme/scss/widgets/fluent/_colors.scss b/packages/devextreme/scss/widgets/fluent/_colors.scss
index c9faf04d42f8..7e05950d251b 100644
--- a/packages/devextreme/scss/widgets/fluent/_colors.scss
+++ b/packages/devextreme/scss/widgets/fluent/_colors.scss
@@ -19,7 +19,7 @@ $fluent-color-theme-modificator: null !default;
 * $name 10. Font family
 * $type text
 */
-$base-font-family: Bahnschrift, 'Segoe UI', 'Segoe UI Web (West European)', -apple-system, BlinkMacSystemFont, Roboto, 'Helvetica Neue', sans-serif !default; // stylelint-disable-line value-keyword-case
+$base-font-family: 'Segoe UI', 'Segoe UI Web (West European)', -apple-system, BlinkMacSystemFont, Roboto, 'Helvetica Neue', sans-serif !default; // stylelint-disable-line value-keyword-case
 
 /**
 * $name 20. Text color
@@ -50,18 +50,28 @@ $base-spin-icon-color: null !default;
 * $type color
 */
 $base-bg: null !default;
+$base-bg-hover: null !default;
+$base-neutral-background: null !default;
+$base-neutral-foreground: null !default;
+$base-neutral-background-hover: null !default;
 
 /**
 * $name 40. Border color
 * $type color
 */
 $base-border-color: null !default;
-$base-border-hover-color: null !default;
-$base-border-active-color: null !default;
+$base-border-color-hover: null !default;
+$base-border-color-focused: null !default;
+$base-border-color-accessible: null !default;
+$base-border-color-accessible-hover: null !default;
+$base-border-color-accessible-focused: null !default;
 $base-inverted-bg: null !default;
 $base-element-bg: null !default;
 $base-shadow-color: null !default;
 
+$base-foreground-disabled: null !default;
+$base-neutral-background-disabled: null !default;
+
 /**
 * $name 50. Success color
 * $type color
@@ -127,14 +137,23 @@ $scrollview-pulldown-path: null !default;
   $fluent-color-theme-modificator: "light" !default;
   $base-text-color: rgba(36, 36, 36, 1) !default;
   $base-label-color: rgba(0, 0, 0, 0.6) !default;
-  $base-disabled-color: rgba(0, 0, 0, $base-disabled-opacity) !default;
-  $base-disabled-border-color: rgba(240, 240, 240, 1) !default; // F0F0F0
-  $base-icon-color: color.change($base-text-color, $alpha: 0.54) !default;
-  $base-spin-icon-color: color.change($base-text-color, $alpha: 0.54) !default;
-  $base-bg: #fff !default;
+  $base-disabled-color: rgba(224, 224, 224, 1) !default; // e0e0e0 // rgba(0, 0, 0, $base-disabled-opacity) !default;
+  $base-disabled-border-color: rgba(224, 224, 224, 1) !default; // e0e0e0
+  $base-neutral-background-disabled: rgb(240, 240, 240) !default; // f0f0f0
+  $base-foreground-disabled: rgba(189, 189, 189, 1) !default; // bdbdbd
+  $base-neutral-foreground: rgba(97, 97, 97, 1) !default; // #616161;
+  $base-icon-color: $base-neutral-foreground !default; // color.change($base-text-color, $alpha: 0.54) !default;
+  $base-spin-icon-color: $base-neutral-foreground !default; // color.change($base-text-color, $alpha: 0.54) !default;
+  $base-bg: rgba(255, 255, 255, 1) !default; // #ffffff
+  $base-bg-hover: rgba(245, 245, 245, 1) !default; // #f5f5f5
+  $base-neutral-background: rgba(245, 245, 245, 1) !default; // #f5f5f5
+  $base-neutral-background-hover: rgba(235, 235, 235, 1) !default; // #ebebeb
   $base-border-color: rgba(209, 209, 209, 1) !default; // d1d1d1
-  $base-border-hover-color: darken($base-border-color, 3.92) !default; // c7c7c7
-  $base-border-active-color: darken($base-border-color, 11.76) !default; // b3b3b3
+  $base-border-color-hover: darken($base-border-color, 3.92) !default; // c7c7c7
+  $base-border-color-focused: darken($base-border-color, 11.76) !default; // b3b3b3
+  $base-border-color-accessible: rgba(97, 97, 97, 1) !default; // #616161
+  $base-border-color-accessible-hover: rgba(87, 87, 87, 1) !default; // #575757
+  $base-border-color-accessible-focused: rgba(77, 77, 77, 1) !default; // #4d4d4d
   $base-inverted-bg: darken($base-bg, 100%) !default;
   $base-element-bg: $base-bg !default;
   $base-shadow-color: $base-inverted-bg !default;
@@ -158,14 +177,23 @@ $scrollview-pulldown-path: null !default;
   $fluent-color-theme-modificator: "dark" !default;
   $base-text-color: #fff !default;
   $base-label-color: rgba(255, 255, 255, 0.6) !default;
-  $base-disabled-color: rgba(255, 255, 255, $base-disabled-opacity) !default;
-  $base-disabled-border-color: rgba(61, 61, 61, 1) !default; // 3d3d3d
-  $base-icon-color: color.change($base-text-color, $alpha: 0.54) !default;
-  $base-spin-icon-color: color.change($base-text-color, $alpha: 0.54) !default;
-  $base-bg: #363640 !default;
+  $base-disabled-color: rgba(66, 66, 66, 1) !default; // #424242 // rgba(255, 255, 255, $base-disabled-opacity) !default;
+  $base-disabled-border-color: rgba(66, 66, 66, 1) !default; // #424242
+  $base-neutral-background-disabled: rgba(20, 20, 20, 1) !default; // #141414
+  $base-foreground-disabled: rgba(92, 92, 92, 1) !default; // #5c5c5c
+  $base-neutral-foreground: rgba(173, 173, 173, 1) !default; // #adadad;
+  $base-icon-color: $base-neutral-foreground !default; // color.change($base-text-color, $alpha: 0.54) !default;
+  $base-spin-icon-color: $base-neutral-foreground !default; // color.change($base-text-color, $alpha: 0.54) !default;
+  $base-bg: rgba(41, 41, 41, 1) !default; // #292929
+  $base-bg-hover: rgba(61, 61, 61, 1) !default; // #3d3d3d
+  $base-neutral-background: rgba(20, 20, 20, 1) !default; // #f5f5f5
+  $base-neutral-background-hover: rgba(41, 41, 41, 1) !default; // #292929
   $base-border-color: rgba(102, 102, 102, 1) !default; // #666666
-  $base-border-hover-color: lighten( $base-border-color, 5.88) !default; // #757575
-  $base-border-active-color: lighten( $base-border-color, 1.96) !default; // #6b6b6b
+  $base-border-color-hover: lighten( $base-border-color, 5.88) !default; // #757575
+  $base-border-color-focused: lighten( $base-border-color, 1.96) !default; // #6b6b6b
+  $base-border-color-accessible: rgba(173, 173, 173, 1) !default; // #adadad
+  $base-border-color-accessible-hover: rgba(189, 189, 189, 1) !default; // #bdbdbd
+  $base-border-color-accessible-focused: rgba(179, 179, 179, 1) !default; // #b3b3b3
   $base-inverted-bg: lighten($base-bg, 100%) !default;
   $base-element-bg: $base-bg !default;
   $base-shadow-color: #000 !default;
diff --git a/packages/devextreme/scss/widgets/fluent/_sizes.scss b/packages/devextreme/scss/widgets/fluent/_sizes.scss
index abd9fe2fab1b..b0feb7abad33 100644
--- a/packages/devextreme/scss/widgets/fluent/_sizes.scss
+++ b/packages/devextreme/scss/widgets/fluent/_sizes.scss
@@ -47,7 +47,7 @@ $fluent-button-icon-margin: null !default;
   $fluent-base-inline-widget-height: 32px !default; // 48px !default;
   $fluent-base-inline-block-height: 20px !default; // 19px !default;
   $fluent-base-icon-size: 20px !default; // 24px !default
-  $fluent-base-inline-horizontal-padding: 10px !default;
+  $fluent-base-inline-horizontal-padding: 12px !default; // 10px !default;
   $fluent-base-border-radius: 4px !default;
   $fluent-base-dropdown-widgets-shadow: 0 2px 7px $base-dropdown-shadow-color !default;
   $fluent-accordion-item-opened-margin: 16px !default;
@@ -60,14 +60,14 @@ $fluent-button-icon-margin: null !default;
   $fluent-size-postfix: ".compact" !default;
 
   // Font sizes
-  $fluent-base-font-size: 13px !default;
+  $fluent-base-font-size: 12px !default; // 13px !default;
 
   // Base sizes
-  $fluent-base-inline-widget-height: 32px !default;
-  $fluent-base-inline-block-height: 15px !default;
+  $fluent-base-inline-widget-height: 24px !default; // 32px !default;
+  $fluent-base-inline-block-height: 16px !default;// 15px !default;
   $fluent-base-icon-size: 16px !default; // 18px !default;
   $fluent-base-inline-horizontal-padding: 8px !default;
-  $fluent-base-border-radius: 2px !default;
+  $fluent-base-border-radius: 4px !default; // 2px !default;
   $fluent-base-dropdown-widgets-shadow: 0 2px 4px $base-dropdown-shadow-color !default;
   $fluent-accordion-item-opened-margin: 8px !default;
   $fluent-button-height: 24px !default;
diff --git a/packages/devextreme/scss/widgets/fluent/common/_sizes.scss b/packages/devextreme/scss/widgets/fluent/common/_sizes.scss
index fbf20e25ce70..6bdbc5b01a15 100644
--- a/packages/devextreme/scss/widgets/fluent/common/_sizes.scss
+++ b/packages/devextreme/scss/widgets/fluent/common/_sizes.scss
@@ -3,7 +3,7 @@
 
 // adduse
 
-$fluent-line-height: 1.2857 !default;
+$fluent-line-height: null !default;
 
 $fluent-inline-borderedwidget-inner-size:
   $fluent-base-inline-widget-height -
@@ -14,3 +14,11 @@ $fluent-invalid-badge-horizontal-padding: math.div($fluent-inline-borderedwidget
 $fluent-invalid-badge-halfhorizontal-padding: math.div($fluent-invalid-badge-horizontal-padding, 2) !default;
 
 $fluent-valid-badge-font-size: $fluent-base-font-size + 6px !default;
+
+@if $size == "default" {
+  $fluent-line-height: 1.428571 !default;
+}
+
+@else if $size == "compact" {
+  $fluent-line-height: 1.3333 !default;
+}
\ No newline at end of file
diff --git a/packages/devextreme/scss/widgets/fluent/dateBox/_index.scss b/packages/devextreme/scss/widgets/fluent/dateBox/_index.scss
index 2cf72ad0352e..1d7b406fc05d 100644
--- a/packages/devextreme/scss/widgets/fluent/dateBox/_index.scss
+++ b/packages/devextreme/scss/widgets/fluent/dateBox/_index.scss
@@ -6,6 +6,7 @@
 @use "../sizes" as *;
 @use "../../base/icons" as *;
 @use "../dropDownEditor" as *;
+@use "../../base/dropDownEditor/mixins" as *;
 @use "../textEditor" as *;
 @use "../textEditor/sizes" as *;
 @use "../textEditor/colors" as *;
@@ -73,16 +74,6 @@
       background: $texteditor-hover-bg;
     }
   }
-
-  &.dx-rtl {
-    &.dx-dropdowneditor-active {
-      .dx-dropdowneditor-button {
-        .dx-dropdowneditor-icon {
-          opacity: 1;
-        }
-      }
-    }
-  }
 }
 
 .dx-datebox-wrapper-calendar {
@@ -143,7 +134,11 @@
   &,
   &:not(.dx-texteditor-empty) {
     &.dx-auto-width {
-      @include invalid-dropdowneditor-input-padding();
+      @include invalid-dropdowneditor-input-padding(
+        $fluent-dropdowneditor-invalid-badge-size,
+        $fluent-base-standard-texteditor-input-horizontal-padding,
+        $fluent-filled-texteditor-input-horizontal-padding
+      );
     }
   }
 }
diff --git a/packages/devextreme/scss/widgets/fluent/dateRangeBox/_index.scss b/packages/devextreme/scss/widgets/fluent/dateRangeBox/_index.scss
index d6254b31c4a8..2d00eb83977f 100644
--- a/packages/devextreme/scss/widgets/fluent/dateRangeBox/_index.scss
+++ b/packages/devextreme/scss/widgets/fluent/dateRangeBox/_index.scss
@@ -17,19 +17,22 @@ $fluent-editor-custom-button-margin: 5px;
 .dx-daterangebox {
   @include dx-dropdowneditor-button-icon-styling(eventall);
 
-  .dx-editor-outlined {
+  &.dx-editor-outlined,
+  &.dx-editor-filled {
     &::before {
-      display: block;
-      bottom: 1px;
+      content: none;
     }
   }
 
   .dx-editor-outlined,
   .dx-editor-filled {
-    &::before {
-      width: calc(100% - 2 * $fluent-daterangebox-active-bar-horizontal-margin);
-      margin: 0 $fluent-daterangebox-active-bar-horizontal-margin;
-    }
+    &.dx-datebox {
+      &::before {
+        border-radius: 0;
+        width: calc(100% - 2 * $fluent-daterangebox-active-bar-horizontal-margin);
+        margin: 0 $fluent-daterangebox-active-bar-horizontal-margin;
+      }
+    } 
   }
 
   &.dx-editor-underlined,
@@ -54,17 +57,6 @@ $fluent-editor-custom-button-margin: 5px;
         }
       }
     }
-
-    .dx-datebox {
-      &::before {
-        bottom: 1px;
-      }
-
-      &::after {
-        border-color: transparent;
-        bottom: 1px;
-      }
-    }
   }
 
   &.dx-editor-underlined {
@@ -101,14 +93,6 @@ $fluent-editor-custom-button-margin: 5px;
   }
 
   .dx-datebox {
-    &.dx-start-datebox {
-      &.dx-texteditor {
-        .dx-texteditor-input {
-          padding-inline-end: $fluent-filled-texteditor-input-horizontal-padding;
-        }
-      }
-    }
-
     &.dx-end-datebox {
       &.dx-texteditor {
         &.dx-invalid {
@@ -123,7 +107,7 @@ $fluent-editor-custom-button-margin: 5px;
 
 .dx-daterangebox-separator {
   padding-left: $fluent-filled-texteditor-input-horizontal-padding;
-  color: $texteditor-disabled-color;
+  color: $texteditor-disabled-text-color;
 
   .dx-icon {
     @include dx-icon-sizing($fluent-base-icon-size);
diff --git a/packages/devextreme/scss/widgets/fluent/dateRangeBox/_sizes.scss b/packages/devextreme/scss/widgets/fluent/dateRangeBox/_sizes.scss
index f5bf6b5b8376..492b886d1e57 100644
--- a/packages/devextreme/scss/widgets/fluent/dateRangeBox/_sizes.scss
+++ b/packages/devextreme/scss/widgets/fluent/dateRangeBox/_sizes.scss
@@ -5,9 +5,9 @@
 $fluent-daterangebox-active-bar-horizontal-margin: null !default;
 
 @if $size == "default" {
-  $fluent-daterangebox-active-bar-horizontal-margin: 15px !default;
+  $fluent-daterangebox-active-bar-horizontal-margin: 12px !default;
 }
 
 @else if $size == "compact" {
-  $fluent-daterangebox-active-bar-horizontal-margin: 11px !default;
+  $fluent-daterangebox-active-bar-horizontal-margin: 8px !default;
 }
diff --git a/packages/devextreme/scss/widgets/fluent/dropDownEditor/_index.scss b/packages/devextreme/scss/widgets/fluent/dropDownEditor/_index.scss
index 52af1e04bd87..3ea7ada4cf6d 100644
--- a/packages/devextreme/scss/widgets/fluent/dropDownEditor/_index.scss
+++ b/packages/devextreme/scss/widgets/fluent/dropDownEditor/_index.scss
@@ -8,6 +8,7 @@
 @use "../button/colors" as *;
 @use "../../base/icons" as *;
 @use "../../base/dropDownEditor";
+@use "../../base/dropDownEditor/mixins" as *;
 
 // adduse
 
@@ -35,12 +36,6 @@ $fluent-dropdowneditor-invalid-badge-size: $fluent-invalid-badge-size + $fluent-
   width: $fluent-dropdowneditor-container-button-size;
   min-width: $fluent-dropdowneditor-container-button-size;
 
-  .dx-state-disabled & {
-    .dx-dropdowneditor-icon {
-      opacity: 1;
-    }
-  }
-
   .dx-state-readonly & {
     .dx-dropdowneditor-icon {
       opacity: 1;
@@ -86,27 +81,14 @@ $fluent-dropdowneditor-invalid-badge-size: $fluent-invalid-badge-size + $fluent-
   }
 }
 
-@mixin invalid-dropdowneditor-input-padding() {
-  &.dx-dropdowneditor-button-visible {
-    &.dx-editor-underlined {
-      .dx-texteditor-input {
-        padding-inline-end: $fluent-dropdowneditor-invalid-badge-size + $fluent-base-standard-texteditor-input-horizontal-padding;
-      }
-    }
-
-    &.dx-editor-filled,
-    &.dx-editor-outlined {
-      .dx-texteditor-input {
-        padding-inline-end: $fluent-dropdowneditor-invalid-badge-size + $fluent-filled-texteditor-input-horizontal-padding;
-      }
-    }
-  }
-}
-
 .dx-invalid,
 .dx-valid,
 .dx-validation-pending {
-  @include invalid-dropdowneditor-input-padding();
+  @include invalid-dropdowneditor-input-padding(
+    $fluent-dropdowneditor-invalid-badge-size,
+    $fluent-base-standard-texteditor-input-horizontal-padding,
+    $fluent-filled-texteditor-input-horizontal-padding
+  );
 }
 
 .dx-dropdowneditor.dx-dropdowneditor-active,
diff --git a/packages/devextreme/scss/widgets/fluent/icons/_index.scss b/packages/devextreme/scss/widgets/fluent/icons/_index.scss
index 085159b502b2..66f3d64cca58 100644
--- a/packages/devextreme/scss/widgets/fluent/icons/_index.scss
+++ b/packages/devextreme/scss/widgets/fluent/icons/_index.scss
@@ -11,7 +11,7 @@
 @include dx-font-icons("dxiconsfluent", "DevExtreme Fluent Icons", "devextreme_fluent_icons", optimizeLegibility);
 
 .dx-icon {
-  font-size: 24px;
+  font-size: $fluent-base-icon-size;
   line-height: 1;
   white-space: nowrap;
   font-feature-settings: 'liga';
diff --git a/packages/devextreme/scss/widgets/fluent/lookup/_index.scss b/packages/devextreme/scss/widgets/fluent/lookup/_index.scss
index c43d1db97667..407382b69da6 100644
--- a/packages/devextreme/scss/widgets/fluent/lookup/_index.scss
+++ b/packages/devextreme/scss/widgets/fluent/lookup/_index.scss
@@ -80,8 +80,8 @@
 }
 
 .dx-lookup-field {
-  font-size: $fluent-lookup-font-size;
-  line-height: normal;
+  min-height: $lookup-field-height;
+  line-height: $fluent-texteditor-line-height;
 
   &::before {
     line-height: normal;
diff --git a/packages/devextreme/scss/widgets/fluent/lookup/_sizes.scss b/packages/devextreme/scss/widgets/fluent/lookup/_sizes.scss
index 7c369bf12953..dc11d4884a67 100644
--- a/packages/devextreme/scss/widgets/fluent/lookup/_sizes.scss
+++ b/packages/devextreme/scss/widgets/fluent/lookup/_sizes.scss
@@ -2,37 +2,20 @@
 
 // adduse
 
-$fluent-filled-lookup-height: null !default;
-$fluent-standard-lookup-height: null !default;
-$fluent-standard-lookup-with-label-height: null !default;
-$fluent-lookup-font-size: null !default;
+$lookup-field-height: null !default;
 $fluent-lookup-popup-content-padding: null !default;
 $fluent-lookup-list-top: null !default;
 
 $fluent-lookup-popup-content-top: 49px !default;
-$fluent-lookup-arrow-margin: -6px !default;
-$fluent-lookup-arrow-right: 10px !default;
-$fluent-lookup-arrow-left: 16px !default;
-$fluent-lookup-invalid-message-font-size: 14px !default;
-$fluent-lookup-invalid-message-padding-horizontal: 20px !default;
-$fluent-lookup-invalid-message-padding-top: 13px !default;
-$fluent-lookup-invalid-message-padding-bottom: 12px !default;
-$fluent-lookup-invalid-message-margin-bottom: 20px !default;
 
 @if $size == "default" {
-  $fluent-filled-lookup-height: 48px !default;
-  $fluent-standard-lookup-height: 32px !default;
-  $fluent-standard-lookup-with-label-height: 42px !default;
-  $fluent-lookup-font-size: 16px !default;
+  $lookup-field-height: 30px !default;
   $fluent-lookup-popup-content-padding: 20px !default;
   $fluent-lookup-list-top: 66px !default;
 }
 
 @else if $size == "compact" {
-  $fluent-filled-lookup-height: 32px !default;
-  $fluent-standard-lookup-height: 26px !default;
-  $fluent-standard-lookup-with-label-height: 30px !default;
-  $fluent-lookup-font-size: 12px !default;
+  $lookup-field-height: 22px !default;
   $fluent-lookup-popup-content-padding: 8px !default;
   $fluent-lookup-list-top: 36px !default;
 }
diff --git a/packages/devextreme/scss/widgets/fluent/numberBox/_index.scss b/packages/devextreme/scss/widgets/fluent/numberBox/_index.scss
index 5a1de1f3262a..30b2f2cabf97 100644
--- a/packages/devextreme/scss/widgets/fluent/numberBox/_index.scss
+++ b/packages/devextreme/scss/widgets/fluent/numberBox/_index.scss
@@ -41,25 +41,17 @@
 .dx-numberbox-spin-button {
   padding: $fluent-numberbox-spin-padding;
   height: 50%;
-}
 
-.dx-numberbox-spin.dx-numberbox-box {
-  &.dx-editor-underlined {
-    .dx-texteditor-input {
-      padding-right: $fluent-base-standard-texteditor-input-horizontal-padding;
+  &.dx-state-disabled {
+    .dx-numberbox-spin-up-icon,
+    .dx-numberbox-spin-down-icon {
+      color: $base-foreground-disabled;
     }
-
-    @include validation-icon-position();
   }
+}
 
-  &.dx-editor-filled,
-  &.dx-editor-outlined {
-    .dx-texteditor-input {
-      padding-right: $fluent-filled-texteditor-input-horizontal-padding;
-    }
-
-    @include validation-icon-position();
-  }
+.dx-numberbox-spin.dx-numberbox-box {
+  @include validation-icon-position();
 }
 
 .dx-numberbox-spin-touch-friendly {
@@ -67,59 +59,11 @@
 
   .dx-numberbox-spin-container {
     width: $fluent-numberbox-touch-friendly-spin-container-width;
-    border-left: none;
+    border-inline-start: none;
   }
 
   .dx-numberbox-spin-up-icon,
   .dx-numberbox-spin-down-icon {
     background-position: center;
   }
-
-  &.dx-editor-underlined {
-    &.dx-show-clear-button .dx-texteditor-input {
-      padding-right: $fluent-base-standard-texteditor-input-horizontal-padding;
-    }
-  }
-
-  &.dx-editor-filled,
-  &.dx-editor-outlined {
-    &.dx-show-clear-button .dx-texteditor-input {
-      padding-right: $fluent-filled-texteditor-input-horizontal-padding;
-    }
-  }
-}
-
-
-.dx-rtl .dx-numberbox,
-.dx-numberbox.dx-rtl {
-  &.dx-numberbox-spin-touch-friendly {
-    .dx-numberbox-spin-container {
-      border-right: none;
-    }
-
-    &.dx-show-clear-button .dx-texteditor-input {
-      padding-left: $fluent-numberbox-spin-container-width;
-    }
-  }
-
-  &.dx-numberbox-spin {
-    &.dx-show-clear-button {
-      .dx-texteditor-input {
-        padding-left: $fluent-numberbox-spin-container-width;
-      }
-    }
-
-    &.dx-editor-underlined {
-      .dx-texteditor-input {
-        padding-left: $fluent-base-standard-texteditor-input-horizontal-padding;
-      }
-    }
-
-    &.dx-editor-filled,
-    &.dx-editor-outlined {
-      .dx-texteditor-input {
-        padding-left: $fluent-filled-texteditor-input-horizontal-padding;
-      }
-    }
-  }
 }
diff --git a/packages/devextreme/scss/widgets/fluent/numberBox/_sizes.scss b/packages/devextreme/scss/widgets/fluent/numberBox/_sizes.scss
index 49294ad961ab..e6a4a165d1cb 100644
--- a/packages/devextreme/scss/widgets/fluent/numberBox/_sizes.scss
+++ b/packages/devextreme/scss/widgets/fluent/numberBox/_sizes.scss
@@ -2,7 +2,15 @@
 
 // adduse
 
-$fluent-numberbox-spin-container-width: 24px !default;
+$fluent-numberbox-spin-container-width: $fluent-base-icon-size !default;
 $fluent-numberbox-spin-padding: 1px !default;
-$fluent-numberbox-touch-friendly-spin-container-width: 74px !default;
-$fluent-numberbox-clear-button-area-width: 32px !default;
+$fluent-numberbox-touch-friendly-spin-container-width: null !default;
+
+@if $size == "default" {
+  $fluent-numberbox-touch-friendly-spin-container-width: 60px !default;
+}
+  
+@else if $size == "compact" {
+  $fluent-numberbox-touch-friendly-spin-container-width: 40px !default;
+}
+  
diff --git a/packages/devextreme/scss/widgets/fluent/switch/_colors.scss b/packages/devextreme/scss/widgets/fluent/switch/_colors.scss
index 280e4fc642d6..1effd966a4fd 100644
--- a/packages/devextreme/scss/widgets/fluent/switch/_colors.scss
+++ b/packages/devextreme/scss/widgets/fluent/switch/_colors.scss
@@ -14,7 +14,7 @@ $switch-bg: null !default;
 * $name 30. Handle 'OFF' background color
 * $type color
 */
-$switch-handle-off-bg: null !default;
+$switch-handle-off-bg: $base-border-color-accessible !default;
 
 /**
 * $name 40. Track 'ON' background color
@@ -29,29 +29,20 @@ $switch-on-bg: $base-accent !default; // color.change($base-accent, $alpha: 0.5)
 $switch-handle-on-bg: $base-bg !default; // $base-accent !default;
 $switch-handle-border-radius: 50% !default;
 $switch-hover-bg: transparent !default;
-$switch-handle-disabled-bg: null !default;
-$switch-off-border-color: null !default;
-$switch-off-border-hover-color: null !default;
-$switch-off-border-active-color: null !default;
+$switch-on-disabled-bg: $base-neutral-background-disabled !default;
+$switch-handle-disabled-bg: $base-foreground-disabled !default;
+$switch-off-border-color: $base-border-color-accessible !default;
+$switch-off-border-hover-color: $base-border-color-accessible-hover !default;
+$switch-off-border-active-color: $base-border-color-accessible-focused !default;
 $switch-on-border-color: $base-accent !default;
 $switch-invalid-handle-bg: $base-invalid-color !default;
 $switch-invalid-container-bg: $base-invalid-color !default;
 
 @if $mode == "light" {
   $switch-bg: transparent !default; // darken($base-element-bg, 38%) !default;
-  $switch-off-border-color: darken($base-border-color, 43.92) !default; // #616161
-  $switch-off-border-hover-color: darken($switch-off-border-color, 3.92) !default; // #575757
-  $switch-off-border-active-color: darken($switch-off-border-hover-color, 3.92) !default; // #4d4d4d
-  $switch-handle-off-bg: $switch-off-border-color !default;
-  $switch-handle-disabled-bg: #bdbdbd !default; // darken($base-element-bg, 26%) !default;
 }
 
 @if $mode == "dark" {
   $switch-bg: transparent !default; // lighten($base-element-bg, 38%) !default;
-  $switch-off-border-color: lighten($base-border-color, 27.84) !default; // #adadad
-  $switch-off-border-hover-color: lighten($switch-off-border-color, 6.27) !default; // #bdbdbd
-  $switch-off-border-active-color: darken($switch-off-border-hover-color, 3.92) !default; // #b3b3b3
-  $switch-handle-off-bg: $switch-off-border-color !default;
-  $switch-handle-disabled-bg: #707070 !default; // lighten($base-element-bg, 26%) !default;
 }
 
diff --git a/packages/devextreme/scss/widgets/fluent/switch/_index.scss b/packages/devextreme/scss/widgets/fluent/switch/_index.scss
index a0fe73393300..3585903def75 100644
--- a/packages/devextreme/scss/widgets/fluent/switch/_index.scss
+++ b/packages/devextreme/scss/widgets/fluent/switch/_index.scss
@@ -27,7 +27,7 @@ $fluent-invalid-switch-shadow: 0 0 0 $fluent-switch-shadow-blur-radius color.cha
   $fluent-switch-transition,
 );
 @include dx-switch-states-fluent(
-  rgba(189, 189, 189, 1),
+  $switch-on-disabled-bg,
   $switch-handle-disabled-bg,
   $fluent-switch-shadow,
   $switch-bg,
diff --git a/packages/devextreme/scss/widgets/fluent/tagBox/_colors.scss b/packages/devextreme/scss/widgets/fluent/tagBox/_colors.scss
index 9e88771d6477..412a0e3d96ab 100644
--- a/packages/devextreme/scss/widgets/fluent/tagBox/_colors.scss
+++ b/packages/devextreme/scss/widgets/fluent/tagBox/_colors.scss
@@ -28,7 +28,7 @@ $tagbox-tag-active-color: $base-text-color !default;
 * $name 40. Tag close button color
 * $type color
 */
-$tagbox-tag-button-remove-bg: rgba(0, 0, 0, 0.36) !default;
+$tagbox-tag-button-remove-bg: $base-icon-color !default;
 $tagbox-tag-button-remove-color: null !default;
 $tagbox-tag-focused-bg: null !default;
 $tagbox-select-all-border-color: $base-border-color !default;
diff --git a/packages/devextreme/scss/widgets/fluent/tagBox/_index.scss b/packages/devextreme/scss/widgets/fluent/tagBox/_index.scss
index 037fda52f03a..302aefaed56b 100644
--- a/packages/devextreme/scss/widgets/fluent/tagBox/_index.scss
+++ b/packages/devextreme/scss/widgets/fluent/tagBox/_index.scss
@@ -20,11 +20,23 @@
 
     .dx-texteditor-input {
       padding: 0;
+      min-height: 0;
     }
   }
 
-  .dx-texteditor-input {
-    height: $fluent-tagbox-tag-height;
+  &.dx-editor-underlined {
+    .dx-tag-container {
+      padding-top: $fluent-tagbox-tag-container-vertical-padding + 1px;
+      padding-bottom: $fluent-tagbox-tag-container-vertical-padding + 1px;
+    }
+  }
+
+  &.dx-editor-outlined,
+  &.dx-editor-filled,
+  &.dx-editor-underlined {
+    .dx-texteditor-input {
+      height: $fluent-tagbox-tag-height;
+    }
   }
 
   &.dx-editor-outlined,
@@ -34,10 +46,10 @@
     }
   }
 
-  &.dx-editor-filled,
-  &.dx-editor-underlined {
-    &.dx-texteditor-with-label,
-    &.dx-texteditor-with-floating-label {
+  &.dx-texteditor-with-label,
+  &.dx-texteditor-with-floating-label {
+    &.dx-editor-filled,
+    &.dx-editor-underlined {
       .dx-tag {
         margin: 0;
       }
@@ -45,13 +57,23 @@
       .dx-texteditor-input {
         padding: 0;
       }
+    }
 
+    &.dx-editor-filled {
       .dx-tag-container,
       .dx-placeholder::before {
         padding-top: $fluent-tagbox-filled-with-label-top-padding;
         padding-bottom: $fluent-tagbox-filled-with-label-bottom-padding;
       }
     }
+  
+    &.dx-editor-underlined {
+      .dx-tag-container,
+      .dx-placeholder::before {
+        padding-top: $fluent-tagbox-filled-with-label-top-padding + 1px;
+        padding-bottom: $fluent-tagbox-filled-with-label-bottom-padding + 1px;
+      }
+    }
   }
 
   &.dx-state-disabled {
@@ -91,23 +113,19 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  width: $fluent-tagbox-remove-button-width;
+  width: $fluent-tagbox-tag-height;
   height: 100%;
 
   @include dx-icon(clear);
 
-  font-size: $fluent-tagbox-tag-content-font-size - 4px;
+  font-size: $fluent-tagbox-tag-content-font-size + 2px;
 
   &::before {
+    content: "\f15f";
     display: flex;
     align-items: center;
     justify-content: center;
-    width: $fluent-tagbox-remove-button-icon-size;
-    height: $fluent-tagbox-remove-button-icon-size;
-    color: $tagbox-tag-button-remove-color;
-    background-color: $tagbox-tag-button-remove-bg;
-    border-radius: 50%;
-    transform: none;
+    color: $tagbox-tag-button-remove-bg;
   }
 }
 
diff --git a/packages/devextreme/scss/widgets/fluent/tagBox/_sizes.scss b/packages/devextreme/scss/widgets/fluent/tagBox/_sizes.scss
index 0887a069f525..f82dde353f26 100644
--- a/packages/devextreme/scss/widgets/fluent/tagBox/_sizes.scss
+++ b/packages/devextreme/scss/widgets/fluent/tagBox/_sizes.scss
@@ -10,11 +10,6 @@ $fluent-tagbox-tag-container-padding: null !default;
 $fluent-tagbox-tag-container-padding-left: null !default;
 $fluent-tagbox-tag-container-vertical-padding: null !default;
 $fluent-tagbox-tag-height: null !default;
-
-
-// $fluent-tagbox-remove-button-right: 4px !default;
-$fluent-tagbox-remove-button-width: null !default;
-$fluent-tagbox-remove-button-icon-size: null !default;
 $fluent-tagbox-select-all-padding-bottom: 12px !default;
 $fluent-tagbox-select-all-margin-bottom: 3px !default;
 $tagbox-tag-border-radius: 2em !default;
@@ -29,25 +24,21 @@ $fluent-tagbox-filled-with-label-bottom-padding: null !default;
   $fluent-tagbox-tag-content-font-size: 12px !default; // 14px !default;
   $fluent-tagbox-tag-container-padding: 0 12px 3px 16px !default; // 0 12px 11px 16px !default;
   $fluent-tagbox-tag-container-padding-left: 12px !default; // 16px !default;
-  $fluent-tagbox-tag-container-vertical-padding: 7px !default; // 11px !default;
+  $fluent-tagbox-tag-container-vertical-padding: 6px !default; // 11px !default;
   $fluent-tagbox-tag-height: 18px !default; // 26px !default; 
-  $fluent-tagbox-remove-button-width: 18px !default; // 26px !default;
-  $fluent-tagbox-remove-button-icon-size: 12px !default; // 16px !default;
   $fluent-tagbox-filled-with-label-top-padding: 10px !default; // 18px !default; 
-  $fluent-tagbox-filled-with-label-bottom-padding: 4px !default; // 4px !default;
+  $fluent-tagbox-filled-with-label-bottom-padding: 2px !default; // 4px !default;
 }
 
 @else if $size == "compact" {
-  $fluent-tagbox-tag-content-padding-left: 6px !default;
+  $fluent-tagbox-tag-content-padding-left: 4px !default;
   $fluent-tagbox-tag-content-padding-right: 20px !default;
   $fluent-tagbox-tag-content-vertical-padding: 2px !default;
-  $fluent-tagbox-tag-content-font-size: 12px !default;
+  $fluent-tagbox-tag-content-font-size: 10px !default;
   $fluent-tagbox-tag-container-padding: 0 8px 3px 11px !default;
   $fluent-tagbox-tag-container-padding-left: 12px !default;
-  $fluent-tagbox-tag-container-vertical-padding: 7px !default;
-  $fluent-tagbox-tag-height: 18px !default;
-  $fluent-tagbox-remove-button-width: 18px !default;
-  $fluent-tagbox-remove-button-icon-size: 12px !default;
-  $fluent-tagbox-filled-with-label-top-padding: 10px !default;
-  $fluent-tagbox-filled-with-label-bottom-padding: 4px !default;
+  $fluent-tagbox-tag-container-vertical-padding: 3px !default;
+  $fluent-tagbox-tag-height: 16px !default;
+  $fluent-tagbox-filled-with-label-top-padding: 5px !default;
+  $fluent-tagbox-filled-with-label-bottom-padding: 1px !default;
 }
diff --git a/packages/devextreme/scss/widgets/fluent/textArea/_sizes.scss b/packages/devextreme/scss/widgets/fluent/textArea/_sizes.scss
index 68223dc17322..ede206945fd0 100644
--- a/packages/devextreme/scss/widgets/fluent/textArea/_sizes.scss
+++ b/packages/devextreme/scss/widgets/fluent/textArea/_sizes.scss
@@ -5,9 +5,9 @@
 $textarea-content-line-height: null !default;
 
 @if $size == "default" {
-  $textarea-content-line-height: 24px !default;
+  $textarea-content-line-height: 20px !default;
 }
 
 @else if $size == "compact" {
-  $textarea-content-line-height: 20px !default;
+  $textarea-content-line-height: 16px !default;
 }
diff --git a/packages/devextreme/scss/widgets/fluent/textEditor/_colors.scss b/packages/devextreme/scss/widgets/fluent/textEditor/_colors.scss
index 44ad88d063eb..d906e1f8f146 100644
--- a/packages/devextreme/scss/widgets/fluent/textEditor/_colors.scss
+++ b/packages/devextreme/scss/widgets/fluent/textEditor/_colors.scss
@@ -21,7 +21,8 @@ $texteditor-label-color: $texteditor-placeholder-color;
 * $name 30. Background color
 * $type color
 */
-$texteditor-bg: color.change($base-text-color, $alpha: 0.04) !default;
+$texteditor-bg: $base-neutral-background !default; // color.change($base-text-color, $alpha: 0.04) !default;
+$texteditor-bg-hover: $base-neutral-background-hover !default;
 
 /**
 * $name 40. Focused background color
@@ -34,6 +35,8 @@ $texteditor-focused-bg: color.change($base-text-color, $alpha: 0.04) !default;
 * $type color
 */
 $texteditor-border-color: $base-border-color !default;
+$texteditor-border-color-hover: $base-border-color-hover !default;
+$texteditor-border-color-focused: $base-border-color-focused !default;
 
 /**
 * $name 60. Hovered border color
@@ -51,25 +54,15 @@ $texteditor-focused-border-color: $base-accent !default;
 * $name 40. Hovered background color
 * $type color
 */
-$texteditor-hover-bg: color.change($base-text-color, $alpha: 0.07) !default;
-$texteditor-button-clear-icon-color: null !default;
-$texteditor-button-clear-icon-color-bg: null !default;
+$texteditor-hover-bg: null !default; // color.change($base-text-color, $alpha: 0.07) !default;
+$texteditor-button-clear-icon-color: $base-neutral-foreground !default;
 $texteditor-invalid-focused-border-color: $base-invalid-color !default;
 $texteditor-invalid-faded-border-color: $base-invalid-faded-border-color !default;
 $texteditor-disabled-color: $base-disabled-color !default;
+$texteditor-disabled-text-color: $base-foreground-disabled !default;
 $texteditor-input-border-radius: $base-border-radius !default;
 $texteditor-label-transition:
   font-size 0.2s cubic-bezier(0, 0, 0.2, 1) 0ms,
   transform 0.2s cubic-bezier(0, 0, 0.2, 1) 0ms,
   top 0.2s cubic-bezier(0, 0, 0.2, 1) 0ms;
 
-@if $mode == "light" {
-  $texteditor-button-clear-icon-color: lighten($texteditor-color, 46%) !default;
-  $texteditor-button-clear-icon-color-bg: lighten($texteditor-color, 76%) !default;
-}
-
-@if $mode == "dark" {
-  $texteditor-button-clear-icon-color: darken($texteditor-color, 76%) !default;
-  $texteditor-button-clear-icon-color-bg: darken($texteditor-color, 34%) !default;
-}
-
diff --git a/packages/devextreme/scss/widgets/fluent/textEditor/_index.scss b/packages/devextreme/scss/widgets/fluent/textEditor/_index.scss
index 3fd5fb8b19ea..b2422dd27f27 100644
--- a/packages/devextreme/scss/widgets/fluent/textEditor/_index.scss
+++ b/packages/devextreme/scss/widgets/fluent/textEditor/_index.scss
@@ -19,14 +19,6 @@ $fluent-texteditor-icon-container-size: $fluent-base-icon-size - 2px;
 $fluent-texteditor-invalid-badge-size: $fluent-invalid-badge-size + 2 * $fluent-invalid-badge-horizontal-padding;
 $fluent-editor-custom-button-margin: 5px;
 
-@mixin dx-texteditor-icon() {
-  position: absolute;
-  top: 50%;
-  margin-top: math.div(-$fluent-texteditor-icon-container-size, 2);
-
-  @include dx-icon-sizing($fluent-texteditor-icon-container-size);
-}
-
 @mixin texteditor-input-padding-filled() {
   .dx-texteditor-input {
     padding-inline-end: $fluent-texteditor-invalid-badge-size + $fluent-filled-texteditor-input-horizontal-padding;
@@ -143,10 +135,39 @@ $fluent-editor-custom-button-margin: 5px;
     &::before {
       border-bottom: 2px solid $texteditor-focused-border-color;
       transform: scale(1);
-      transition: transform 0.6s cubic-bezier(0.4, 0, 0.02, 1);
+      transition-property: transform;
+      transition-duration: 0.2s;
+      transition-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1);
     }
   }
 
+  &.dx-state-disabled {
+    opacity: 1;
+    background-color: transparent;
+
+    .dx-texteditor-label,
+    .dx-placeholder::before,
+    .dx-texteditor-input,
+    .dx-lookup-field {
+      color: $texteditor-disabled-text-color;
+    }
+
+    .dx-lookup-arrow,
+    .dx-dropdowneditor-icon {
+      color: $texteditor-disabled-text-color;
+    }
+  }
+
+  &.dx-state-readonly {
+    .dx-lookup-arrow {
+      display: none;
+    }
+  }
+
+  .dx-texteditor-input {
+    min-height: $fluent-texteditor-input-height - 2px;
+  }
+
   @include validation-icon-position();
   @include pending-indicator-position();
 
@@ -160,26 +181,45 @@ $fluent-editor-custom-button-margin: 5px;
 
   &.dx-editor-filled {
     background-color: $texteditor-bg;
+    border-bottom-left-radius: $base-border-radius;
+    border-bottom-right-radius: $base-border-radius;
+    border: 1px solid transparent;
 
-    &::after {
-      border-bottom: 1px solid $texteditor-border-color;
+    .dx-placeholder::before,
+    .dx-texteditor-input {
+      padding-top: $fluent-filled-texteditor-input-top-padding;
+      padding-bottom: $fluent-filled-texteditor-input-bottom-padding;
     }
 
-    &.dx-state-hover {
-      background-color: $texteditor-hover-bg;
+    &::before {
+      left: -1px;
+      bottom: -1px;
+      right: -1px;
+      height: $texteditor-input-border-radius;
+      width: calc(100% + 2px);
+      border-bottom-left-radius: $texteditor-input-border-radius;
+      border-bottom-right-radius: $texteditor-input-border-radius;
+      border-bottom: 2px solid $texteditor-focused-border-color;
+      clip-path: inset(calc(100% - 2px) 0 0);
+    }
 
-      &::after {
-        border-bottom-color: $texteditor-hover-border-color;
-      }
+    &.dx-state-hover,
+    &.dx-state-active {
+      background-color: $texteditor-hover-bg;
     }
 
     &.dx-state-disabled,
-    &.dx-state-readonly,
-    &.dx-state-readonly.dx-state-hover {
-      background-color: color.change($texteditor-bg, $alpha: 0.12);
+    &.dx-state-readonly {
+      background-color: transparent;
+      border-color: $texteditor-disabled-color;
+    }
 
-      .dx-texteditor-input {
-        color: $texteditor-disabled-color;
+    &.dx-invalid {
+      border-color: $texteditor-invalid-faded-border-color;
+
+      &.dx-state-hover,
+      &.dx-state-focused {
+        border-color: $texteditor-invalid-focused-border-color;
       }
     }
   }
@@ -188,26 +228,32 @@ $fluent-editor-custom-button-margin: 5px;
     background-color: transparent;
 
     &::after {
-      border-bottom: 1px solid $texteditor-border-color;
+      border-bottom: 1px solid $base-border-color-accessible;
     }
 
     &.dx-state-hover {
       &::after {
-        border-bottom: 2px solid $texteditor-hover-border-color;
+        border-bottom: 1px solid $base-border-color-accessible-hover;
       }
     }
 
+    .dx-texteditor-input,
+    .dx-lookup-field {
+      min-height: $fluent-texteditor-input-height;
+    }
+
     .dx-texteditor-input,
     .dx-placeholder::before {
-      padding: $fluent-standard-texteditor-input-padding;
+      padding-top: $fluent-standard-texteditor-input-top-padding;
+      padding-bottom: $fluent-standard-texteditor-input-bottom-padding;
+      padding-left: $fluent-base-standard-texteditor-input-horizontal-padding;
+      padding-right: $fluent-base-standard-texteditor-input-horizontal-padding;
     }
 
     &.dx-state-disabled,
-    &.dx-state-readonly,
-    &.dx-state-readonly.dx-state-hover {
+    &.dx-state-readonly {
       &::after {
-        border-bottom-style: dotted;
-        border-bottom-width: 1px;
+        border-bottom-color: $texteditor-disabled-color;
       }
     }
 
@@ -215,41 +261,100 @@ $fluent-editor-custom-button-margin: 5px;
       &::after {
         border-bottom-color: $texteditor-invalid-faded-border-color;
       }
+
+      &.dx-state-hover {
+        &::after {
+          border-bottom-color: $texteditor-invalid-focused-border-color;
+        }
+      }
     }
   }
 
   &.dx-editor-outlined {
     background-color: transparent;
     border-radius: $texteditor-input-border-radius;
-    box-shadow: inset 0 0 0 1px $texteditor-border-color;
+    border: 1px solid $texteditor-border-color;
+    border-bottom: 1px solid $base-border-color-accessible;
 
     &::before {
-      display: none;
+      box-sizing: border-box;
+      content: "";
+      position: absolute;
+      left: -1px;
+      bottom: -1px;
+      right: -1px;
+      height: $texteditor-input-border-radius;
+      width: calc(100% + 2px);
+      border-bottom-left-radius: $texteditor-input-border-radius;
+      border-bottom-right-radius: $texteditor-input-border-radius;
+      border-bottom: 2px solid $texteditor-focused-border-color;
+      clip-path: inset(calc(100% - 2px) 0 0);
+      transform: scaleX(0);
+      transition-property: transform;
+      transition-duration: 50ms;
+      transition-timing-function: cubic-bezier(0.7, 0, 1, 0.5);
     }
 
-    &.dx-state-hover {
-      box-shadow: inset 0 0 0 1px $texteditor-hover-border-color;
-    }
+    &.dx-texteditor-with-label,
+    &.dx-texteditor-with-floating-label {
+      &::before {
+        width: 100%;
+        left: 0;
+        right: 0;
+      }
 
-    &.dx-state-disabled,
-    &.dx-state-readonly {
-      box-shadow: inset 0 0 0 1px $texteditor-disabled-color;
+      .dx-texteditor-label {
+        inset-block: -1px;
+      }
 
+      .dx-datebox {
+        border: none;
+      }
+
+      .dx-placeholder::before,
       .dx-texteditor-input {
-        color: $texteditor-disabled-color;
+        padding-top: $fluent-filled-texteditor-input-top-padding;
+        padding-bottom: $fluent-filled-texteditor-input-bottom-padding;
       }
     }
 
-    &.dx-state-focused {
-      box-shadow: inset 0 0 0 2px $texteditor-focused-border-color;
+    &.dx-state-disabled,
+    &.dx-state-readonly {
+      border-color: $texteditor-disabled-color;
+    }
+   
+    &.dx-invalid {
+      border-color: $texteditor-invalid-faded-border-color;
 
-      &.dx-invalid {
-        box-shadow: inset 0 0 0 2px $texteditor-invalid-focused-border-color;
+      &.dx-state-hover,
+      &.dx-state-focused {
+        border-color: $texteditor-invalid-focused-border-color;
+      }
+
+      &::before {        
+        border-color: $texteditor-invalid-faded-border-color;
       }
     }
 
-    &.dx-invalid {
-      box-shadow: inset 0 0 0 1px $texteditor-invalid-faded-border-color;
+    &.dx-state-hover {
+      border-left-color: $texteditor-border-color-hover;
+      border-right-color: $texteditor-border-color-hover;
+      border-top-color: $texteditor-border-color-hover;
+      border-bottom-color: $base-border-color-accessible-hover;
+    }
+
+    &.dx-state-focused {
+      border-left-color: $texteditor-border-color-focused;
+      border-right-color: $texteditor-border-color-focused;
+      border-top-color: $texteditor-border-color-focused;
+      border-bottom-color: $base-border-color-accessible-focused;
+
+      &::before {        
+        transform: scaleX(1);
+        transition-property: transform;
+        transition-duration: 200ms;
+        transition-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1);
+      }
     }
   }
 }
@@ -259,15 +364,28 @@ $fluent-editor-custom-button-margin: 5px;
     width: $fluent-texteditor-icon-container-size;
     min-width: $fluent-texteditor-icon-container-size;
     right: 0;
+    display: flex;
+    align-items: center;
+  }
+
+  &.dx-texteditor-empty {
+    .dx-clear-button-area {
+      display: none;
+    }
   }
 
   .dx-icon-clear {
+    &::before {
+      content: '\f15f';
+    }
+
     color: $texteditor-button-clear-icon-color;
-    background-color: $texteditor-button-clear-icon-color-bg;
-    border-radius: 50%;
+  }
 
-    @include dx-texteditor-icon();
-    @include dx-icon-font-centered-sizing($fluent-texteditor-clear-icon-size);
+  &.dx-state-disabled {
+    .dx-icon-clear {
+      color: $base-foreground-disabled;
+    }
   }
 
   &:not(.dx-texteditor-empty) {
@@ -276,7 +394,6 @@ $fluent-editor-custom-button-margin: 5px;
   }
 }
 
-
 /* B231111 */
 .dx-placeholder {
   color: $texteditor-placeholder-color;
@@ -289,6 +406,7 @@ $fluent-editor-custom-button-margin: 5px;
   background-color: transparent;
   color: $texteditor-color;
   font-size: $fluent-texteditor-font-size;
+  line-height: $fluent-texteditor-line-height;
 }
 
 .dx-invalid.dx-texteditor {
@@ -345,28 +463,32 @@ $fluent-editor-custom-button-margin: 5px;
 }
 
 @include dx-editor-outlined(
-  $texteditor-border-color,
   $texteditor-input-border-radius,
   $fluent-texteditor-label-font-size,
   1px,
-  2px,
+  1px,
   solid,
-  $fluent-texteditor-label-font-size + 2,
   $fluent-base-inline-block-height,
-  math.div(1px + $fluent-texteditor-label-font-size, 2),
-  0.5px,
+  $fluent-base-inline-block-height,
+  math.div(1px + $fluent-texteditor-font-size, 2),
+  1.5px,
   $fluent-filled-texteditor-input-horizontal-padding,
   $fluent-filled-texteditor-input-horizontal-padding,
   $base-bg,
+  1px solid transparent,
+  $texteditor-border-color,
+  $base-border-color-accessible,
   $texteditor-disabled-color,
-  $texteditor-hover-border-color,
-  $texteditor-focused-border-color,
+  $texteditor-border-color-hover,
+  $base-border-color-accessible-hover,
+  $texteditor-border-color-focused,
+  $base-border-color-accessible-focused,
   $texteditor-invalid-faded-border-color,
   $texteditor-invalid-focused-border-color,
   $texteditor-label-transition,
   $fluent-texteditor-font-size,
   $fluent-filled-texteditor-input-top-padding,
-  0,
+  1px,
 );
 @include dx-editor-filled(
   $texteditor-label-transition,
diff --git a/packages/devextreme/scss/widgets/fluent/textEditor/_sizes.scss b/packages/devextreme/scss/widgets/fluent/textEditor/_sizes.scss
index 95ea2fb58e54..6ba07821b534 100644
--- a/packages/devextreme/scss/widgets/fluent/textEditor/_sizes.scss
+++ b/packages/devextreme/scss/widgets/fluent/textEditor/_sizes.scss
@@ -2,8 +2,10 @@
 
 // adduse
 
+$fluent-texteditor-line-height: null !default;
 $fluent-texteditor-font-size: null !default;
-$fluent-texteditor-clear-icon-size: null !default;
+$fluent-texteditor-input-height: null !default;
+$fluent-texteditor-clear-icon-size: $fluent-base-icon-size !default;
 $fluent-texteditor-label-top-offset: null !default;
 $fluent-filled-texteditor-input-horizontal-padding: null !default;
 $fluent-filled-texteditor-input-top-padding: null !default;
@@ -18,36 +20,38 @@ $fluent-filled-texteditor-input-with-label-top-padding: null !default;
 $fluent-filled-texteditor-input-with-label-bottom-padding: null !default;
 
 @if $size == "default" {
-  $fluent-texteditor-font-size: 16px !default;
+  $fluent-texteditor-line-height: 1.428571 !default;
+  $fluent-texteditor-font-size: 14px !default; // 16px
+  $fluent-texteditor-input-height: 32px !default;
   $fluent-texteditor-label-font-size: 12px !default; // 12px !default;
-  $fluent-texteditor-clear-icon-size: 12px !default; // 12px !default;
-  $fluent-texteditor-label-top-offset: 0 !default; // 4px !default;
-  $fluent-filled-texteditor-input-horizontal-padding: 16px !default; // 16px !default;
-  $fluent-filled-texteditor-input-top-padding: 7px; // 15px !default;
+  $fluent-texteditor-label-top-offset: -1px !default; // 4px !default;
+  $fluent-filled-texteditor-input-horizontal-padding: 12px !default; // 16px !default;
+  $fluent-filled-texteditor-input-top-padding: 5px; // 15px !default;
   $fluent-filled-texteditor-input-with-label-top-padding: 10px !default; // 21px;
-  $fluent-filled-texteditor-input-bottom-padding: 6px; // 14px !default;
+  $fluent-filled-texteditor-input-bottom-padding: 5px; // 14px !default;
   $fluent-filled-texteditor-input-with-label-bottom-padding: 3px; // 8px;
-  $fluent-standard-texteditor-input-top-padding: 7px !default; // 15px !default;
-  $fluent-standard-texteditor-input-bottom-padding: 6px !default; // 14px !default;
+  $fluent-standard-texteditor-input-top-padding: 5px !default; // 15px !default;
+  $fluent-standard-texteditor-input-bottom-padding: 5px !default; // 14px !default;
   $fluent-standard-texteditor-with-label-input-top-padding: 9px !default; // 21px !default;
   $fluent-standard-texteditor-with-label-input-bottom-padding: 4px !default; // 8px !default;
   $fluent-underlined-editor-button-height: 22px !default; // 28px !default;
 }
 
 @else if $size == "compact" {
+  $fluent-texteditor-line-height: 1.3333 !default;
   $fluent-texteditor-font-size: 12px !default;
+  $fluent-texteditor-input-height: 24px !default; // 32px !default;
   $fluent-texteditor-label-font-size: 10px !default;
-  $fluent-texteditor-clear-icon-size: 10px !default;
-  $fluent-texteditor-label-top-offset: 0 !default;
-  $fluent-filled-texteditor-input-horizontal-padding: 12px !default;
-  $fluent-filled-texteditor-input-top-padding: 9px;
-  $fluent-filled-texteditor-input-with-label-top-padding: 15px;
-  $fluent-filled-texteditor-input-bottom-padding: 9px;
-  $fluent-filled-texteditor-input-with-label-bottom-padding: 3px;
-  $fluent-standard-texteditor-input-top-padding: 9px !default;
-  $fluent-standard-texteditor-input-bottom-padding: 9px !default;
-  $fluent-standard-texteditor-with-label-input-top-padding: 14px !default;
-  $fluent-standard-texteditor-with-label-input-bottom-padding: 4px !default;
+  $fluent-texteditor-label-top-offset: -1px !default;
+  $fluent-filled-texteditor-input-horizontal-padding: 8px !default; // 12px !default;
+  $fluent-filled-texteditor-input-top-padding: 3px !default; // 9px !default;
+  $fluent-filled-texteditor-input-with-label-top-padding: 6px !default; // 15px !default;
+  $fluent-filled-texteditor-input-bottom-padding: 3px !default; // 9px !default;
+  $fluent-filled-texteditor-input-with-label-bottom-padding: 0 !default; // 3px;
+  $fluent-standard-texteditor-input-top-padding: 3px !default; // 9px !default;
+  $fluent-standard-texteditor-input-bottom-padding: 3px !default; // 9px !default;
+  $fluent-standard-texteditor-with-label-input-top-padding: 6px !default; // 14px !default;
+  $fluent-standard-texteditor-with-label-input-bottom-padding: 2px !default; // 4px !default;
   $fluent-underlined-editor-button-height: 22px !default;
 }
 
@@ -62,4 +66,4 @@ $fluent-standard-texteditor-input-padding:
   $fluent-standard-texteditor-input-bottom-padding !default;
 
 $fluent-filled-texteditor-input-button-horizontal-padding: $fluent-filled-texteditor-input-horizontal-padding - 4px;
-$fluent-filled-texteditor-spin-button-horizontal-padding: $fluent-filled-texteditor-input-horizontal-padding - 8px;
+$fluent-filled-texteditor-spin-button-horizontal-padding: $fluent-filled-texteditor-input-horizontal-padding - 2px;
diff --git a/packages/devextreme/scss/widgets/generic/dropDownEditor/_index.scss b/packages/devextreme/scss/widgets/generic/dropDownEditor/_index.scss
index f307c66f0dda..8c43d48e9d00 100644
--- a/packages/devextreme/scss/widgets/generic/dropDownEditor/_index.scss
+++ b/packages/devextreme/scss/widgets/generic/dropDownEditor/_index.scss
@@ -49,12 +49,6 @@ $generic-dropdowneditor-invalid-badge-size: $generic-invalid-badge-size + $gener
     background: transparent;
   }
 
-  .dx-state-disabled & {
-    .dx-dropdowneditor-icon {
-      opacity: 1;
-    }
-  }
-
   .dx-state-readonly & {
     .dx-dropdowneditor-icon {
       opacity: 1;
diff --git a/packages/devextreme/scss/widgets/generic/lookup/_sizes.scss b/packages/devextreme/scss/widgets/generic/lookup/_sizes.scss
index 6d08eccce810..e36404104ab1 100644
--- a/packages/devextreme/scss/widgets/generic/lookup/_sizes.scss
+++ b/packages/devextreme/scss/widgets/generic/lookup/_sizes.scss
@@ -5,43 +5,15 @@
 $generic-lookup-popup-content-top: null !default;
 $generic-lookup-popup-content-padding: null !default;
 $generic-lookup-list-top: null !default;
-$generic-lookup-arrow-margin: null !default;
-$generic-lookup-arrow-right: null !default;
-$generic-lookup-arrow-left: null !default;
-$generic-lookup-invalid-message-font-size: null !default;
-$generic-lookup-invalid-message-padding-horizontal: null !default;
-$generic-lookup-invalid-message-padding-top: null !default;
-$generic-lookup-invalid-message-padding-bottom: null !default;
-$generic-lookup-invalid-message-margin-bottom: null !default;
 
 @if $size == "default" {
   $generic-lookup-popup-content-top: 49px !default;
   $generic-lookup-popup-content-padding: 20px !default;
   $generic-lookup-list-top: 70px !default;
-
-  $generic-lookup-arrow-margin: -6px !default;
-  $generic-lookup-arrow-right: 10px !default;
-  $generic-lookup-arrow-left: 16px !default;
-
-  $generic-lookup-invalid-message-font-size: 14px !default;
-  $generic-lookup-invalid-message-padding-horizontal: 20px !default;
-  $generic-lookup-invalid-message-padding-top: 13px !default;
-  $generic-lookup-invalid-message-padding-bottom: 12px !default;
-  $generic-lookup-invalid-message-margin-bottom: 20px !default;
 }
 
 @else if $size == "compact" {
   $generic-lookup-popup-content-top: 36px !default;
   $generic-lookup-popup-content-padding: 10px !default;
   $generic-lookup-list-top: 40px !default;
-
-  $generic-lookup-arrow-margin: -5px !default;
-  $generic-lookup-arrow-right: 5px !default;
-  $generic-lookup-arrow-left: 11px !default;
-
-  $generic-lookup-invalid-message-font-size: 12px !default;
-  $generic-lookup-invalid-message-padding-horizontal: 10px !default;
-  $generic-lookup-invalid-message-padding-top: 7px !default;
-  $generic-lookup-invalid-message-padding-bottom: 10px !default;
-  $generic-lookup-invalid-message-margin-bottom: 10px !default;
 }
diff --git a/packages/devextreme/scss/widgets/generic/numberBox/_index.scss b/packages/devextreme/scss/widgets/generic/numberBox/_index.scss
index 52a271ffdcea..9e9b1c7e5ed3 100644
--- a/packages/devextreme/scss/widgets/generic/numberBox/_index.scss
+++ b/packages/devextreme/scss/widgets/generic/numberBox/_index.scss
@@ -66,7 +66,7 @@
 .dx-numberbox-spin-touch-friendly {
   .dx-numberbox-spin-container {
     width: $generic-numberbox-touch-friendly-spin-container-width;
-    border-left: none;
+    border-inline-start: none;
   }
 
   .dx-numberbox-spin-up-icon,
@@ -75,18 +75,3 @@
   }
 }
 
-
-.dx-rtl .dx-numberbox,
-.dx-numberbox.dx-rtl {
-  &.dx-numberbox-spin-touch-friendly {
-    .dx-numberbox-spin-container {
-      border-right: none;
-    }
-  }
-
-  &.dx-numberbox-spin {
-    .dx-texteditor-input {
-      padding-left: $generic-base-inline-borderedwidget-horizontal-padding;
-    }
-  }
-}
diff --git a/packages/devextreme/scss/widgets/generic/numberBox/_sizes.scss b/packages/devextreme/scss/widgets/generic/numberBox/_sizes.scss
index c4e571050295..ffcc11c2b77b 100644
--- a/packages/devextreme/scss/widgets/generic/numberBox/_sizes.scss
+++ b/packages/devextreme/scss/widgets/generic/numberBox/_sizes.scss
@@ -4,18 +4,15 @@
 
 $generic-numberbox-spin-container-width: null !default;
 $generic-numberbox-touch-friendly-spin-container-width: null !default;
-$generic-numberbox-clear-button-area-width: null !default;
 
 $generic-numberbox-spin-padding: 1px !default;
 
 @if $size == "default" {
   $generic-numberbox-spin-container-width: 34px !default;
   $generic-numberbox-touch-friendly-spin-container-width: 74px !default;
-  $generic-numberbox-clear-button-area-width: 32px !default;
 }
 
 @else if $size == "compact" {
   $generic-numberbox-spin-container-width: 20px !default;
   $generic-numberbox-touch-friendly-spin-container-width: 60px !default;
-  $generic-numberbox-clear-button-area-width: 20px !default;
 }
diff --git a/packages/devextreme/scss/widgets/generic/textEditor/_index.scss b/packages/devextreme/scss/widgets/generic/textEditor/_index.scss
index 8788839f6d0b..9a26ad5edb8f 100644
--- a/packages/devextreme/scss/widgets/generic/textEditor/_index.scss
+++ b/packages/devextreme/scss/widgets/generic/textEditor/_index.scss
@@ -227,7 +227,6 @@ $generic-texteditor-invalid-badge-size: $generic-invalid-badge-size + 2 * $gener
 }
 
 @include dx-editor-outlined(
-  $texteditor-border-color,
   $texteditor-input-border-radius,
   $generic-texteditor-label-size,
   1px,
@@ -240,8 +239,13 @@ $generic-texteditor-invalid-badge-size: $generic-invalid-badge-size + 2 * $gener
   $generic-base-inline-borderedwidget-horizontal-padding,
   $generic-base-inline-borderedwidget-horizontal-padding,
   $base-bg,
+  none,
+  $texteditor-border-color,
+  $texteditor-border-color,
   color.change($texteditor-color, $alpha: 0.5),
   $texteditor-hover-border-color,
+  $texteditor-hover-border-color,
+  $texteditor-focused-border-color,
   $texteditor-focused-border-color,
   $texteditor-invalid-faded-border-color,
   $texteditor-invalid-focused-border-color,
diff --git a/packages/devextreme/scss/widgets/material/dateBox/_index.scss b/packages/devextreme/scss/widgets/material/dateBox/_index.scss
index 81d5404a1f9d..8c78afd35002 100644
--- a/packages/devextreme/scss/widgets/material/dateBox/_index.scss
+++ b/packages/devextreme/scss/widgets/material/dateBox/_index.scss
@@ -6,6 +6,7 @@
 @use "../sizes" as *;
 @use "../../base/icons" as *;
 @use "../dropDownEditor" as *;
+@use "../../base/dropDownEditor/mixins" as *;
 @use "../textEditor" as *;
 @use "../textEditor/sizes" as *;
 @use "../textEditor/colors" as *;
@@ -73,16 +74,6 @@
       background: $texteditor-hover-bg;
     }
   }
-
-  &.dx-rtl {
-    &.dx-dropdowneditor-active {
-      .dx-dropdowneditor-button {
-        .dx-dropdowneditor-icon {
-          opacity: 1;
-        }
-      }
-    }
-  }
 }
 
 .dx-datebox-wrapper-calendar {
@@ -143,7 +134,11 @@
   &,
   &:not(.dx-texteditor-empty) {
     &.dx-auto-width {
-      @include invalid-dropdowneditor-input-padding();
+      @include invalid-dropdowneditor-input-padding(
+        $material-dropdowneditor-invalid-badge-size,
+        $material-base-standard-texteditor-input-horizontal-padding,
+        $material-filled-texteditor-input-horizontal-padding
+      );
     }
   }
 }
diff --git a/packages/devextreme/scss/widgets/material/dropDownEditor/_index.scss b/packages/devextreme/scss/widgets/material/dropDownEditor/_index.scss
index 45575746fdf7..586458df6d7f 100644
--- a/packages/devextreme/scss/widgets/material/dropDownEditor/_index.scss
+++ b/packages/devextreme/scss/widgets/material/dropDownEditor/_index.scss
@@ -8,6 +8,7 @@
 @use "../button/colors" as *;
 @use "../../base/icons" as *;
 @use "../../base/dropDownEditor";
+@use "../../base/dropDownEditor/mixins" as *;
 
 // adduse
 
@@ -35,12 +36,6 @@ $material-dropdowneditor-invalid-badge-size: $material-invalid-badge-size + $mat
   width: $material-dropdowneditor-container-button-size;
   min-width: $material-dropdowneditor-container-button-size;
 
-  .dx-state-disabled & {
-    .dx-dropdowneditor-icon {
-      opacity: 1;
-    }
-  }
-
   .dx-state-readonly & {
     .dx-dropdowneditor-icon {
       opacity: 1;
@@ -86,27 +81,14 @@ $material-dropdowneditor-invalid-badge-size: $material-invalid-badge-size + $mat
   }
 }
 
-@mixin invalid-dropdowneditor-input-padding() {
-  &.dx-dropdowneditor-button-visible {
-    &.dx-editor-underlined {
-      .dx-texteditor-input {
-        padding-inline-end: $material-dropdowneditor-invalid-badge-size + $material-base-standard-texteditor-input-horizontal-padding;
-      }
-    }
-
-    &.dx-editor-filled,
-    &.dx-editor-outlined {
-      .dx-texteditor-input {
-        padding-inline-end: $material-dropdowneditor-invalid-badge-size + $material-filled-texteditor-input-horizontal-padding;
-      }
-    }
-  }
-}
-
 .dx-invalid,
 .dx-valid,
 .dx-validation-pending {
-  @include invalid-dropdowneditor-input-padding();
+  @include invalid-dropdowneditor-input-padding(
+    $material-dropdowneditor-invalid-badge-size,
+    $material-base-standard-texteditor-input-horizontal-padding,
+    $material-filled-texteditor-input-horizontal-padding
+  );
 }
 
 .dx-dropdowneditor.dx-dropdowneditor-active,
diff --git a/packages/devextreme/scss/widgets/material/lookup/_sizes.scss b/packages/devextreme/scss/widgets/material/lookup/_sizes.scss
index a6a701c8b660..066833a702ab 100644
--- a/packages/devextreme/scss/widgets/material/lookup/_sizes.scss
+++ b/packages/devextreme/scss/widgets/material/lookup/_sizes.scss
@@ -2,36 +2,19 @@
 
 // adduse
 
-$material-filled-lookup-height: null !default;
-$material-standard-lookup-height: null !default;
-$material-standard-lookup-with-label-height: null !default;
 $material-lookup-font-size: null !default;
 $material-lookup-popup-content-padding: null !default;
 $material-lookup-list-top: null !default;
 
 $material-lookup-popup-content-top: 49px !default;
-$material-lookup-arrow-margin: -6px !default;
-$material-lookup-arrow-right: 10px !default;
-$material-lookup-arrow-left: 16px !default;
-$material-lookup-invalid-message-font-size: 14px !default;
-$material-lookup-invalid-message-padding-horizontal: 20px !default;
-$material-lookup-invalid-message-padding-top: 13px !default;
-$material-lookup-invalid-message-padding-bottom: 12px !default;
-$material-lookup-invalid-message-margin-bottom: 20px !default;
 
 @if $size == "default" {
-  $material-filled-lookup-height: 48px !default;
-  $material-standard-lookup-height: 32px !default;
-  $material-standard-lookup-with-label-height: 42px !default;
   $material-lookup-font-size: 16px !default;
   $material-lookup-popup-content-padding: 20px !default;
   $material-lookup-list-top: 66px !default;
 }
 
 @else if $size == "compact" {
-  $material-filled-lookup-height: 32px !default;
-  $material-standard-lookup-height: 26px !default;
-  $material-standard-lookup-with-label-height: 30px !default;
   $material-lookup-font-size: 12px !default;
   $material-lookup-popup-content-padding: 8px !default;
   $material-lookup-list-top: 36px !default;
diff --git a/packages/devextreme/scss/widgets/material/numberBox/_index.scss b/packages/devextreme/scss/widgets/material/numberBox/_index.scss
index 68c88da0bed6..fe0713948831 100644
--- a/packages/devextreme/scss/widgets/material/numberBox/_index.scss
+++ b/packages/devextreme/scss/widgets/material/numberBox/_index.scss
@@ -44,22 +44,7 @@
 }
 
 .dx-numberbox-spin.dx-numberbox-box {
-  &.dx-editor-underlined {
-    .dx-texteditor-input {
-      padding-right: $material-base-standard-texteditor-input-horizontal-padding;
-    }
-
-    @include validation-icon-position();
-  }
-
-  &.dx-editor-filled,
-  &.dx-editor-outlined {
-    .dx-texteditor-input {
-      padding-right: $material-filled-texteditor-input-horizontal-padding;
-    }
-
-    @include validation-icon-position();
-  }
+  @include validation-icon-position();
 }
 
 .dx-numberbox-spin-touch-friendly {
@@ -67,59 +52,12 @@
 
   .dx-numberbox-spin-container {
     width: $material-numberbox-touch-friendly-spin-container-width;
-    border-left: none;
+    border-inline-start: none;
   }
 
   .dx-numberbox-spin-up-icon,
   .dx-numberbox-spin-down-icon {
     background-position: center;
   }
-
-  &.dx-editor-underlined {
-    &.dx-show-clear-button .dx-texteditor-input {
-      padding-right: $material-base-standard-texteditor-input-horizontal-padding;
-    }
-  }
-
-  &.dx-editor-filled,
-  &.dx-editor-outlined {
-    &.dx-show-clear-button .dx-texteditor-input {
-      padding-right: $material-filled-texteditor-input-horizontal-padding;
-    }
-  }
 }
 
-
-.dx-rtl .dx-numberbox,
-.dx-numberbox.dx-rtl {
-  &.dx-numberbox-spin-touch-friendly {
-    .dx-numberbox-spin-container {
-      border-right: none;
-    }
-
-    &.dx-show-clear-button .dx-texteditor-input {
-      padding-left: $material-numberbox-spin-container-width;
-    }
-  }
-
-  &.dx-numberbox-spin {
-    &.dx-show-clear-button {
-      .dx-texteditor-input {
-        padding-left: $material-numberbox-spin-container-width;
-      }
-    }
-
-    &.dx-editor-underlined {
-      .dx-texteditor-input {
-        padding-left: $material-base-standard-texteditor-input-horizontal-padding;
-      }
-    }
-
-    &.dx-editor-filled,
-    &.dx-editor-outlined {
-      .dx-texteditor-input {
-        padding-left: $material-filled-texteditor-input-horizontal-padding;
-      }
-    }
-  }
-}
diff --git a/packages/devextreme/scss/widgets/material/numberBox/_sizes.scss b/packages/devextreme/scss/widgets/material/numberBox/_sizes.scss
index 888213bd9713..d7e7dad31767 100644
--- a/packages/devextreme/scss/widgets/material/numberBox/_sizes.scss
+++ b/packages/devextreme/scss/widgets/material/numberBox/_sizes.scss
@@ -5,4 +5,3 @@
 $material-numberbox-spin-container-width: 24px !default;
 $material-numberbox-spin-padding: 1px !default;
 $material-numberbox-touch-friendly-spin-container-width: 74px !default;
-$material-numberbox-clear-button-area-width: 32px !default;
diff --git a/packages/devextreme/scss/widgets/material/textEditor/_index.scss b/packages/devextreme/scss/widgets/material/textEditor/_index.scss
index 1a997c1aceb5..fe1705de716a 100644
--- a/packages/devextreme/scss/widgets/material/textEditor/_index.scss
+++ b/packages/devextreme/scss/widgets/material/textEditor/_index.scss
@@ -227,10 +227,6 @@ $material-editor-custom-button-margin: 5px;
       display: none;
     }
 
-    &.dx-state-hover {
-      box-shadow: inset 0 0 0 1px $texteditor-hover-border-color;
-    }
-
     &.dx-state-disabled,
     &.dx-state-readonly {
       box-shadow: inset 0 0 0 1px $texteditor-disabled-color;
@@ -240,6 +236,10 @@ $material-editor-custom-button-margin: 5px;
       }
     }
 
+    &.dx-state-hover {
+      box-shadow: inset 0 0 0 1px $texteditor-hover-border-color;
+    }
+
     &.dx-state-focused {
       box-shadow: inset 0 0 0 2px $texteditor-focused-border-color;
 
@@ -345,7 +345,6 @@ $material-editor-custom-button-margin: 5px;
 }
 
 @include dx-editor-outlined(
-  $texteditor-border-color,
   $texteditor-input-border-radius,
   $material-texteditor-label-font-size,
   1px,
@@ -358,8 +357,13 @@ $material-editor-custom-button-margin: 5px;
   $material-filled-texteditor-input-horizontal-padding,
   $material-filled-texteditor-input-horizontal-padding,
   $base-bg,
+  none,
+  $texteditor-border-color,
+  $texteditor-border-color,
   $texteditor-disabled-color,
   $texteditor-hover-border-color,
+  $texteditor-hover-border-color,
+  $texteditor-focused-border-color,
   $texteditor-focused-border-color,
   $texteditor-invalid-faded-border-color,
   $texteditor-invalid-focused-border-color,
@@ -376,7 +380,7 @@ $material-editor-custom-button-margin: 5px;
   $material-texteditor-label-top-offset,
   $material-texteditor-font-size,
   $material-texteditor-font-size,
-  $material-texteditor-font-size,
+  $material-texteditor-font-size + 1px,
   $material-filled-texteditor-input-horizontal-padding,
   $material-filled-texteditor-input-with-label-top-padding,
   $material-filled-texteditor-input-with-label-bottom-padding,
@@ -389,7 +393,7 @@ $material-editor-custom-button-margin: 5px;
   $material-texteditor-label-top-offset,
   $material-texteditor-font-size,
   $material-texteditor-font-size,
-  $material-texteditor-font-size,
+  $material-texteditor-font-size + 1px,
   $material-standard-texteditor-with-label-input-top-padding,
   $material-standard-texteditor-with-label-input-bottom-padding,
 );
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/DateBox render with buttons container, isValid=false (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/DateBox render with buttons container, isValid=false (material-blue-light).png
index 22f28657f8c2..e1b2dba29c7f 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/DateBox render with buttons container, isValid=false (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/DateBox render with buttons container, isValid=false (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/DateBox render with buttons container, isValid=false (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/DateBox render with buttons container, isValid=false (material-blue-light-compact).png
index 3ae56c0dcd48..e48449aabbbc 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/DateBox render with buttons container, isValid=false (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/DateBox render with buttons container, isValid=false (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/DateBox render with buttons container, isValid=true (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/DateBox render with buttons container, isValid=true (material-blue-light).png
index 91ddffb4993c..a5fd50a00191 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/DateBox render with buttons container, isValid=true (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/DateBox render with buttons container, isValid=true (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/DateBox render with buttons container, isValid=true (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/DateBox render with buttons container, isValid=true (material-blue-light-compact).png
index a8e88634a62a..c8bb88c804c1 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/DateBox render with buttons container, isValid=true (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/DateBox render with buttons container, isValid=true (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=filled (material-blue-light).png
index cfed0ad756e9..7e9d3cac9351 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=filled (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=filled (material-blue-light-compact).png
index 9476aaf1d7ce..574badf6bbd3 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=filled (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=filled (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=outlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=outlined (material-blue-light).png
index 494896be377b..7fe20d240e4e 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=outlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=outlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=outlined (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=outlined (material-blue-light-compact).png
index fa6d503c7ca7..036bcb53b8bb 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=outlined (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=outlined (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=underlined (material-blue-light).png
index 077c80d93129..e2808593cd9e 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=underlined (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=underlined (material-blue-light-compact).png
index 94d0cd7e2970..e2b5387d53e0 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=underlined (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox active stylingMode=underlined (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=filled (material-blue-light).png
index 92921d16ac92..5beff84d12a9 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=filled (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=filled (material-blue-light-compact).png
index 6cebfff764f7..abe21fa06fd5 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=filled (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=filled (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=outlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=outlined (material-blue-light).png
index 31e191f51960..2267327bed5c 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=outlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=outlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=outlined (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=outlined (material-blue-light-compact).png
index bfef99b5fbe9..8b56684a31bf 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=outlined (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=outlined (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=underlined (material-blue-light).png
index 1dc31bee8df9..9715134f9ccc 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=underlined (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=underlined (material-blue-light-compact).png
index c4874a676d75..a2df00b7ae17 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=underlined (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox focused stylingMode=underlined (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=filled (material-blue-light).png
index e607dbf20b7c..6e8771064fcd 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=filled (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=filled (material-blue-light-compact).png
index 36b9e3e8de73..7db661601d1a 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=filled (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=filled (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=outlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=outlined (material-blue-light).png
index 195848c4bcec..dd20c419d62e 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=outlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=outlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=outlined (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=outlined (material-blue-light-compact).png
index fa6d503c7ca7..036bcb53b8bb 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=outlined (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=outlined (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=underlined (material-blue-light).png
index 077c80d93129..e2808593cd9e 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=underlined (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=underlined (material-blue-light-compact).png
index 94d0cd7e2970..e2b5387d53e0 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=underlined (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateBox/etalons/Datebox stylingMode=underlined (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=filled isValid=false (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=filled isValid=false (material-blue-light).png
index 17adc12cf77e..4d6f36a5cfe2 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=filled isValid=false (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=filled isValid=false (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=filled isValid=false (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=filled isValid=false (material-blue-light-compact).png
index 59d8320a0c45..4a01f8e67db8 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=filled isValid=false (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=filled isValid=false (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=filled isValid=true (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=filled isValid=true (material-blue-light).png
index 265698df3204..fe476e136e49 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=filled isValid=true (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=filled isValid=true (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=filled isValid=true (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=filled isValid=true (material-blue-light-compact).png
index f271e8537ebf..e48d6b6c6c8f 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=filled isValid=true (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=filled isValid=true (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=underlined isValid=false (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=underlined isValid=false (material-blue-light).png
index 675ea2e59348..8a931f38a947 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=underlined isValid=false (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=underlined isValid=false (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=underlined isValid=false (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=underlined isValid=false (material-blue-light-compact).png
index 59603cc7e75e..c1c42d1b4c5d 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=underlined isValid=false (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=underlined isValid=false (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=underlined isValid=true (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=underlined isValid=true (material-blue-light).png
index c59e2cd9e52f..e663eb6e3f12 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=underlined isValid=true (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=underlined isValid=true (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=underlined isValid=true (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=underlined isValid=true (material-blue-light-compact).png
index f130ec1e7b61..831492ef7521 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=underlined isValid=true (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox disabled stylingMode=underlined isValid=true (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=filled isValid=false (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=filled isValid=false (material-blue-light).png
index 6f56851eecf0..97c83b41adab 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=filled isValid=false (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=filled isValid=false (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=filled isValid=false (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=filled isValid=false (material-blue-light-compact).png
index a92e5c59cf67..609b513e99de 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=filled isValid=false (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=filled isValid=false (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=filled isValid=true (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=filled isValid=true (material-blue-light).png
index 2b4b4a2fcfb0..b82808649d21 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=filled isValid=true (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=filled isValid=true (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=filled isValid=true (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=filled isValid=true (material-blue-light-compact).png
index f1b6dd54e301..a76fd37503e0 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=filled isValid=true (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=filled isValid=true (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=underlined isValid=false (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=underlined isValid=false (material-blue-light).png
index fa1399f8400b..5f4367354a1c 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=underlined isValid=false (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=underlined isValid=false (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=underlined isValid=false (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=underlined isValid=false (material-blue-light-compact).png
index bdc98da3e12d..175ac5f44fa0 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=underlined isValid=false (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=underlined isValid=false (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=underlined isValid=true (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=underlined isValid=true (material-blue-light).png
index 7ca283fc60a2..9be6b5eb3b6d 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=underlined isValid=true (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=underlined isValid=true (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=underlined isValid=true (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=underlined isValid=true (material-blue-light-compact).png
index a7e483a04ece..ff7ada1761d9 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=underlined isValid=true (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox readonly stylingMode=underlined isValid=true (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=filled isValid=false (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=filled isValid=false (material-blue-light).png
index f4f9fff38be4..b38551e86e94 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=filled isValid=false (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=filled isValid=false (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=filled isValid=false (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=filled isValid=false (material-blue-light-compact).png
index 022c79b3798b..28df88088c99 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=filled isValid=false (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=filled isValid=false (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=filled isValid=true (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=filled isValid=true (material-blue-light).png
index 41230c7c3eff..653e1e790ce2 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=filled isValid=true (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=filled isValid=true (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=filled isValid=true (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=filled isValid=true (material-blue-light-compact).png
index 0c7be18b7086..595ddef0ea5e 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=filled isValid=true (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=filled isValid=true (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=underlined isValid=false (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=underlined isValid=false (material-blue-light).png
index dbcdaedf0b3e..60933940b266 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=underlined isValid=false (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=underlined isValid=false (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=underlined isValid=false (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=underlined isValid=false (material-blue-light-compact).png
index 45454f45dadb..1794610e005b 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=underlined isValid=false (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=underlined isValid=false (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=underlined isValid=true (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=underlined isValid=true (material-blue-light).png
index fb7b5a29920d..debc50f0d571 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=underlined isValid=true (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=underlined isValid=true (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=underlined isValid=true (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=underlined isValid=true (material-blue-light-compact).png
index 278766987cd6..01e85f51a054 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=underlined isValid=true (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/DateRangeBox stylingMode=underlined isValid=true (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/Placeholder and label by default labelMode=floating (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/Placeholder and label by default labelMode=floating (material-blue-light).png
index 906626e908de..001945769bd3 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/Placeholder and label by default labelMode=floating (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/dateRangeBox/etalons/Placeholder and label by default labelMode=floating (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/lookup/etalons/Lookup label with labelMode=floating-styleMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/lookup/etalons/Lookup label with labelMode=floating-styleMode=filled (material-blue-light).png
index 8ab7f39a0087..510c495a1bf4 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/lookup/etalons/Lookup label with labelMode=floating-styleMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/lookup/etalons/Lookup label with labelMode=floating-styleMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/lookup/etalons/Lookup label with labelMode=floating-styleMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/lookup/etalons/Lookup label with labelMode=floating-styleMode=underlined (material-blue-light).png
index bf857a0e4553..49c897116e6c 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/lookup/etalons/Lookup label with labelMode=floating-styleMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/lookup/etalons/Lookup label with labelMode=floating-styleMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox label with stylingMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox label with stylingMode=filled (material-blue-light).png
index a70108222b3e..fe1270caff3f 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox label with stylingMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox label with stylingMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox label with stylingMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox label with stylingMode=underlined (material-blue-light).png
index 2150a9c3d1c3..32001fa659a8 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox label with stylingMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox label with stylingMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=false (generic-light).png b/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=false (generic-light).png
index f9aff43fbbd5..63420bb656fd 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=false (generic-light).png and b/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=false (generic-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=false (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=false (material-blue-light).png
index 5dbe2f707854..8421b9a3feda 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=false (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=false (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=false (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=false (material-blue-light-compact).png
index f0c5ba0bddae..0923b0fbceba 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=false (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=false (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=true (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=true (material-blue-light).png
index f4a45882b4fe..54c24410dbc9 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=true (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=true (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=true (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=true (material-blue-light-compact).png
index 37387a187860..2432e76cf5a6 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=true (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/numberBox/etalons/NumberBox render with buttons container, isValid=true (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/selectBox/etalons/SelectBox with label-labelMode=floating-stylingMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/selectBox/etalons/SelectBox with label-labelMode=floating-stylingMode=filled (material-blue-light).png
index e324f9007c4d..19f4cb0c713b 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/selectBox/etalons/SelectBox with label-labelMode=floating-stylingMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/selectBox/etalons/SelectBox with label-labelMode=floating-stylingMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/selectBox/etalons/SelectBox with label-labelMode=floating-stylingMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/selectBox/etalons/SelectBox with label-labelMode=floating-stylingMode=underlined (material-blue-light).png
index b91122eab424..4b06b2c1c90a 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/selectBox/etalons/SelectBox with label-labelMode=floating-stylingMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/selectBox/etalons/SelectBox with label-labelMode=floating-stylingMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render hover,stylingMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render hover,stylingMode=filled (material-blue-light).png
index 2947692303dc..0f455ff883d9 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render hover,stylingMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render hover,stylingMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render hover,stylingMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render hover,stylingMode=underlined (material-blue-light).png
index 9ded36efc945..00e4d31ad8c4 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render hover,stylingMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render hover,stylingMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render invalid,stylingMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render invalid,stylingMode=filled (material-blue-light).png
index 62fd70d01d7c..f168590b27f4 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render invalid,stylingMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render invalid,stylingMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render invalid,stylingMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render invalid,stylingMode=underlined (material-blue-light).png
index fe6be23d021a..93dfed3b37a9 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render invalid,stylingMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render invalid,stylingMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render stylingMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render stylingMode=filled (material-blue-light).png
index a71d26bdf404..72137005aa19 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render stylingMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render stylingMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render stylingMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render stylingMode=underlined (material-blue-light).png
index d4e9f0adc835..1e173f9cdf5d 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render stylingMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render stylingMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render with buttons container (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render with buttons container (material-blue-light).png
index cc7afa45a5b9..df9a1da147c8 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render with buttons container (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render with buttons container (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render with buttons container (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render with buttons container (material-blue-light-compact).png
index 311329b53f57..c70c5b164dea 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render with buttons container (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render with buttons container (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render with limited width stylingMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render with limited width stylingMode=filled (material-blue-light).png
index 2ad392a0ca3f..9ab7aca1c879 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render with limited width stylingMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render with limited width stylingMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render with limited width stylingMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render with limited width stylingMode=underlined (material-blue-light).png
index 9de87bd4169e..2e435b928966 100644
Binary files a/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render with limited width stylingMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/editors/textBox/etalons/Textbox render with limited width stylingMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=false,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=false,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png
index 770ae2f5f82f..238a3e643744 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=false,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=false,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=false,lAl=left,e.lMode=undefined,e.sMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=false,lAl=left,e.lMode=undefined,e.sMode=filled (material-blue-light).png
index 770ae2f5f82f..238a3e643744 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=false,lAl=left,e.lMode=undefined,e.sMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=false,lAl=left,e.lMode=undefined,e.sMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=center,e.lMode=undefined,e.sMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=center,e.lMode=undefined,e.sMode=filled (material-blue-light).png
index e483b90127ac..5bdded60eeb0 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=center,e.lMode=undefined,e.sMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=center,e.lMode=undefined,e.sMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=center,e.lMode=undefined,e.sMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=center,e.lMode=undefined,e.sMode=underlined (material-blue-light).png
index 8e3e99ddb3b2..de8d59255250 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=center,e.lMode=undefined,e.sMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=center,e.lMode=undefined,e.sMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png
index 51eaa084260c..1413cd5dc5df 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=left,e.lMode=undefined,e.sMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=left,e.lMode=undefined,e.sMode=filled (material-blue-light).png
index 51eaa084260c..1413cd5dc5df 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=left,e.lMode=undefined,e.sMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=left,e.lMode=undefined,e.sMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=left,e.lMode=undefined,e.sMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=left,e.lMode=undefined,e.sMode=underlined (material-blue-light).png
index cef4485df4ea..3a23a2038790 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=left,e.lMode=undefined,e.sMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=left,e.lMode=undefined,e.sMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=right,e.lMode=undefined,e.sMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=right,e.lMode=undefined,e.sMode=filled (material-blue-light).png
index 6bf3c4c44e96..d52a77ccdd83 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=right,e.lMode=undefined,e.sMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=right,e.lMode=undefined,e.sMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=right,e.lMode=undefined,e.sMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=right,e.lMode=undefined,e.sMode=underlined (material-blue-light).png
index a076fbc9781f..8d6b6e55ccdc 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=right,e.lMode=undefined,e.sMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=left,lVis=true,lAl=right,e.lMode=undefined,e.sMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=center,e.lMode=undefined,e.sMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=center,e.lMode=undefined,e.sMode=filled (material-blue-light).png
index f45deb00b726..1730f4067b93 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=center,e.lMode=undefined,e.sMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=center,e.lMode=undefined,e.sMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=center,e.lMode=undefined,e.sMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=center,e.lMode=undefined,e.sMode=underlined (material-blue-light).png
index 8b0015e1db59..ff283f85d116 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=center,e.lMode=undefined,e.sMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=center,e.lMode=undefined,e.sMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=left,e.lMode=undefined,e.sMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=left,e.lMode=undefined,e.sMode=filled (material-blue-light).png
index e6616697809f..89d8c45a19fb 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=left,e.lMode=undefined,e.sMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=left,e.lMode=undefined,e.sMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=left,e.lMode=undefined,e.sMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=left,e.lMode=undefined,e.sMode=underlined (material-blue-light).png
index d543922d7f71..de0ffccbe5cd 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=left,e.lMode=undefined,e.sMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=left,e.lMode=undefined,e.sMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=right,e.lMode=undefined,e.sMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=right,e.lMode=undefined,e.sMode=filled (material-blue-light).png
index c68afcc7735b..065f3bcb77a4 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=right,e.lMode=undefined,e.sMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=right,e.lMode=undefined,e.sMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=right,e.lMode=undefined,e.sMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=right,e.lMode=undefined,e.sMode=underlined (material-blue-light).png
index d447d41fb7e2..74ddc3e0885d 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=right,e.lMode=undefined,e.sMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=right,lVis=true,lAl=right,e.lMode=undefined,e.sMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=center,e.lMode=undefined,e.sMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=center,e.lMode=undefined,e.sMode=filled (material-blue-light).png
index d26d350d1370..e33874abc599 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=center,e.lMode=undefined,e.sMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=center,e.lMode=undefined,e.sMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=center,e.lMode=undefined,e.sMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=center,e.lMode=undefined,e.sMode=underlined (material-blue-light).png
index 54c97214993a..6776f4c0facb 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=center,e.lMode=undefined,e.sMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=center,e.lMode=undefined,e.sMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=left,e.lMode=undefined,e.sMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=left,e.lMode=undefined,e.sMode=filled (material-blue-light).png
index f6f4f4800040..435ac469dca1 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=left,e.lMode=undefined,e.sMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=left,e.lMode=undefined,e.sMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=left,e.lMode=undefined,e.sMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=left,e.lMode=undefined,e.sMode=underlined (material-blue-light).png
index cdf6a2bc3301..049859a9799e 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=left,e.lMode=undefined,e.sMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=left,e.lMode=undefined,e.sMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=right,e.lMode=undefined,e.sMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=right,e.lMode=undefined,e.sMode=filled (material-blue-light).png
index 875ce09c1d4b..fd8d87f8d5b2 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=right,e.lMode=undefined,e.sMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=right,e.lMode=undefined,e.sMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=right,e.lMode=undefined,e.sMode=underlined (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=right,e.lMode=undefined,e.sMode=underlined (material-blue-light).png
index f964fd68fcb5..13a9c036f2b9 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=right,e.lMode=undefined,e.sMode=underlined (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=floating,lLoc=top,lVis=true,lAl=right,e.lMode=undefined,e.sMode=underlined (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=hidden,lLoc=left,lVis=false,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=hidden,lLoc=left,lVis=false,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png
index 770ae2f5f82f..238a3e643744 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=hidden,lLoc=left,lVis=false,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=hidden,lLoc=left,lVis=false,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=hidden,lLoc=left,lVis=true,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=hidden,lLoc=left,lVis=true,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png
index 51eaa084260c..1413cd5dc5df 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=hidden,lLoc=left,lVis=true,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=hidden,lLoc=left,lVis=true,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=outside,lLoc=left,lVis=false,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=outside,lLoc=left,lVis=false,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png
index 770ae2f5f82f..238a3e643744 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=outside,lLoc=left,lVis=false,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=outside,lLoc=left,lVis=false,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=outside,lLoc=left,lVis=true,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=outside,lLoc=left,lVis=true,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png
index 51eaa084260c..1413cd5dc5df 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=outside,lLoc=left,lVis=true,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=outside,lLoc=left,lVis=true,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=static,lLoc=left,lVis=false,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=static,lLoc=left,lVis=false,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png
index 770ae2f5f82f..238a3e643744 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=static,lLoc=left,lVis=false,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=static,lLoc=left,lVis=false,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=static,lLoc=left,lVis=true,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=static,lLoc=left,lVis=true,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png
index 51eaa084260c..1413cd5dc5df 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=static,lLoc=left,lVis=true,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/Form,lMode=static,lLoc=left,lVis=true,lAl=left,e.lMode=floating,e.sMode=filled (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_false,optMark_false,labelMode_floating,colon_false (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_false,optMark_false,labelMode_floating,colon_false (material-blue-light).png
index 2dd60199e43e..e67ad29c5339 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_false,optMark_false,labelMode_floating,colon_false (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_false,optMark_false,labelMode_floating,colon_false (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_false,optMark_false,labelMode_floating,colon_true (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_false,optMark_false,labelMode_floating,colon_true (material-blue-light).png
index 2dd60199e43e..e67ad29c5339 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_false,optMark_false,labelMode_floating,colon_true (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_false,optMark_false,labelMode_floating,colon_true (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_false,optMark_true,labelMode_floating,colon_false (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_false,optMark_true,labelMode_floating,colon_false (material-blue-light).png
index 7e68fab18fcf..86d3e999f13b 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_false,optMark_true,labelMode_floating,colon_false (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_false,optMark_true,labelMode_floating,colon_false (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_false,optMark_true,labelMode_floating,colon_true (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_false,optMark_true,labelMode_floating,colon_true (material-blue-light).png
index 7e68fab18fcf..86d3e999f13b 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_false,optMark_true,labelMode_floating,colon_true (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_false,optMark_true,labelMode_floating,colon_true (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_true,optMark_false,labelMode_floating,colon_false (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_true,optMark_false,labelMode_floating,colon_false (material-blue-light).png
index aaf4082f40d0..2eb30f8636d1 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_true,optMark_false,labelMode_floating,colon_false (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_true,optMark_false,labelMode_floating,colon_false (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_true,optMark_false,labelMode_floating,colon_true (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_true,optMark_false,labelMode_floating,colon_true (material-blue-light).png
index aaf4082f40d0..2eb30f8636d1 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_true,optMark_false,labelMode_floating,colon_true (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_true,optMark_false,labelMode_floating,colon_true (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_true,optMark_true,labelMode_floating,colon_false (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_true,optMark_true,labelMode_floating,colon_false (material-blue-light).png
index 4f6d52206b33..e5c566a9bd36 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_true,optMark_true,labelMode_floating,colon_false (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_true,optMark_true,labelMode_floating,colon_false (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_true,optMark_true,labelMode_floating,colon_true (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_true,optMark_true,labelMode_floating,colon_true (material-blue-light).png
index 4f6d52206b33..e5c566a9bd36 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_true,optMark_true,labelMode_floating,colon_true (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/SimpleItem,rtl_true,optMark_true,labelMode_floating,colon_true (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/align items,lblMode=floating,alignInAllGrp=false,alignInGrp=false (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/align items,lblMode=floating,alignInAllGrp=false,alignInGrp=false (material-blue-light).png
index e2b63f301019..597f0c2d42a3 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/align items,lblMode=floating,alignInAllGrp=false,alignInGrp=false (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/align items,lblMode=floating,alignInAllGrp=false,alignInGrp=false (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/align items,lblMode=floating,alignInAllGrp=false,alignInGrp=true (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/align items,lblMode=floating,alignInAllGrp=false,alignInGrp=true (material-blue-light).png
index e2b63f301019..597f0c2d42a3 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/align items,lblMode=floating,alignInAllGrp=false,alignInGrp=true (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/align items,lblMode=floating,alignInAllGrp=false,alignInGrp=true (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/align items,lblMode=floating,alignInAllGrp=true,alignInGrp=false (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/align items,lblMode=floating,alignInAllGrp=true,alignInGrp=false (material-blue-light).png
index e2b63f301019..597f0c2d42a3 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/align items,lblMode=floating,alignInAllGrp=true,alignInGrp=false (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/align items,lblMode=floating,alignInAllGrp=true,alignInGrp=false (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/align items,lblMode=floating,alignInAllGrp=true,alignInGrp=true (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/align items,lblMode=floating,alignInAllGrp=true,alignInGrp=true (material-blue-light).png
index e2b63f301019..597f0c2d42a3 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/align items,lblMode=floating,alignInAllGrp=true,alignInGrp=true (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/align items,lblMode=floating,alignInAllGrp=true,alignInGrp=true (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/label properties, lblMode=floating (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/label properties, lblMode=floating (material-blue-light).png
index 46f965ea232f..537dcdefa866 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/label properties, lblMode=floating (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/label properties, lblMode=floating (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/show semicolon, lblMode=floating, shwSmclnAfterlbl=false (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/show semicolon, lblMode=floating, shwSmclnAfterlbl=false (material-blue-light).png
index 78cb7db9bf06..e55c391c7af6 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/show semicolon, lblMode=floating, shwSmclnAfterlbl=false (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/show semicolon, lblMode=floating, shwSmclnAfterlbl=false (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/form/etalons/show semicolon, lblMode=floating, shwSmclnAfterlbl=true (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/form/etalons/show semicolon, lblMode=floating, shwSmclnAfterlbl=true (material-blue-light).png
index fca7dea2db17..658abc8a716d 100644
Binary files a/packages/devextreme/testing/testcafe/tests/form/etalons/show semicolon, lblMode=floating, shwSmclnAfterlbl=true (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/form/etalons/show semicolon, lblMode=floating, shwSmclnAfterlbl=true (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar all widgets appearance (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar all widgets appearance (material-blue-light).png
index 127ab83ca8df..cd7c30567435 100644
Binary files a/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar all widgets appearance (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar all widgets appearance (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar nested widgets render in multiline rtl=false (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar nested widgets render in multiline rtl=false (material-blue-light).png
index 98ff68181ee4..7c87a146a928 100644
Binary files a/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar nested widgets render in multiline rtl=false (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar nested widgets render in multiline rtl=false (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar nested widgets render in multiline rtl=false (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar nested widgets render in multiline rtl=false (material-blue-light-compact).png
index e539a43c36ef..353d66c79ad5 100644
Binary files a/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar nested widgets render in multiline rtl=false (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar nested widgets render in multiline rtl=false (material-blue-light-compact).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar nested widgets render in multiline rtl=true (material-blue-light).png b/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar nested widgets render in multiline rtl=true (material-blue-light).png
index 623995f78892..221cbd5dd90b 100644
Binary files a/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar nested widgets render in multiline rtl=true (material-blue-light).png and b/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar nested widgets render in multiline rtl=true (material-blue-light).png differ
diff --git a/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar nested widgets render in multiline rtl=true (material-blue-light-compact).png b/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar nested widgets render in multiline rtl=true (material-blue-light-compact).png
index 4a68ae3f8659..48e68aab9eab 100644
Binary files a/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar nested widgets render in multiline rtl=true (material-blue-light-compact).png and b/packages/devextreme/testing/testcafe/tests/navigation/toolbar/etalons/Toolbar nested widgets render in multiline rtl=true (material-blue-light-compact).png differ