@syncfusion/blazor-themes 25.1.35 → 25.1.38

package/SCSS-Themes/querybuilder/query-builder/material-dark.scss

@@ -895,7 +895,9 @@ $qrybldr-btngrp-brdr-radius: 2px !default;
     }
 
     & .e-group-header .e-dropdown-btn.e-add-btn,
-    .e-deletegroup {
+    .e-deletegroup,
+    .e-clone-grp-btn,
+    .e-lock-grp-btn {
       @if $skin-name == 'bootstrap5' {
         background: $qrybldr-btngroup-bgcolor;
         box-shadow: none;

package/SCSS-Themes/querybuilder/query-builder/material.scss

@@ -894,7 +894,9 @@ $qrybldr-btngrp-brdr-radius: 2px !default;
     }
 
     & .e-group-header .e-dropdown-btn.e-add-btn,
-    .e-deletegroup {
+    .e-deletegroup,
+    .e-clone-grp-btn,
+    .e-lock-grp-btn {
       @if $skin-name == 'bootstrap5' {
         background: $qrybldr-btngroup-bgcolor;
         box-shadow: none;

package/SCSS-Themes/querybuilder/query-builder/material3-dark.scss

@@ -900,7 +900,9 @@ $qrybldr-icon-color: rgba($icon-color) !default;
     }
 
     & .e-group-header .e-dropdown-btn.e-add-btn,
-    .e-deletegroup {
+    .e-deletegroup,
+    .e-clone-grp-btn,
+    .e-lock-grp-btn {
       @if $skin-name == 'bootstrap5' {
         background: $qrybldr-btngroup-bgcolor;
         box-shadow: none;

package/SCSS-Themes/querybuilder/query-builder/material3.scss

@@ -900,7 +900,9 @@ $qrybldr-icon-color: rgba($icon-color) !default;
     }
 
     & .e-group-header .e-dropdown-btn.e-add-btn,
-    .e-deletegroup {
+    .e-deletegroup,
+    .e-clone-grp-btn,
+    .e-lock-grp-btn {
       @if $skin-name == 'bootstrap5' {
         background: $qrybldr-btngroup-bgcolor;
         box-shadow: none;

package/SCSS-Themes/querybuilder/query-builder/tailwind-dark.scss

@@ -897,7 +897,9 @@ $qrybldr-collapse-brdr-color: $border-light !default;
     }
 
     & .e-group-header .e-dropdown-btn.e-add-btn,
-    .e-deletegroup {
+    .e-deletegroup,
+    .e-clone-grp-btn,
+    .e-lock-grp-btn {
       @if $skin-name == 'bootstrap5' {
         background: $qrybldr-btngroup-bgcolor;
         box-shadow: none;

package/SCSS-Themes/querybuilder/query-builder/tailwind.scss

@@ -897,7 +897,9 @@ $qrybldr-collapse-brdr-color: $border-light !default;
     }
 
     & .e-group-header .e-dropdown-btn.e-add-btn,
-    .e-deletegroup {
+    .e-deletegroup,
+    .e-clone-grp-btn,
+    .e-lock-grp-btn {
       @if $skin-name == 'bootstrap5' {
         background: $qrybldr-btngroup-bgcolor;
         box-shadow: none;

package/SCSS-Themes/ribbon/ribbon/bds-dark.scss

@@ -1251,7 +1251,7 @@ $ribbon-gallery-popup-box-shadow: $shadow-md !default;
   }
 
   .e-ribbon-group-overflow-ddb {
-    &.e-dropdown-popup {
+    &.e-dropdown-popup:has(.e-ribbon-overflow-target) {
       min-width: 190px;
     }
     .e-ribbon-of-tab:not(.e-ribbon-active) {

package/SCSS-Themes/ribbon/ribbon/bds.scss

@@ -1251,7 +1251,7 @@ $ribbon-gallery-popup-box-shadow: $shadow-md !default;
   }
 
   .e-ribbon-group-overflow-ddb {
-    &.e-dropdown-popup {
+    &.e-dropdown-popup:has(.e-ribbon-overflow-target) {
       min-width: 190px;
     }
     .e-ribbon-of-tab:not(.e-ribbon-active) {

package/SCSS-Themes/ribbon/ribbon/bootstrap-dark.scss

@@ -1251,7 +1251,7 @@ $ribbon-gallery-popup-box-shadow: 0 6px 12px rgba($grey-base, .175) !default;
   }
 
   .e-ribbon-group-overflow-ddb {
-    &.e-dropdown-popup {
+    &.e-dropdown-popup:has(.e-ribbon-overflow-target) {
       min-width: 190px;
     }
     .e-ribbon-of-tab:not(.e-ribbon-active) {

package/SCSS-Themes/ribbon/ribbon/bootstrap.scss

@@ -1251,7 +1251,7 @@ $ribbon-gallery-popup-box-shadow: 0 6px 12px rgba($grey-base, .175) !default;
   }
 
   .e-ribbon-group-overflow-ddb {
-    &.e-dropdown-popup {
+    &.e-dropdown-popup:has(.e-ribbon-overflow-target) {
       min-width: 190px;
     }
     .e-ribbon-of-tab:not(.e-ribbon-active) {

package/SCSS-Themes/ribbon/ribbon/bootstrap4.scss

@@ -1251,7 +1251,7 @@ $ribbon-gallery-popup-box-shadow: 0 6px 12px rgba($black, .175) !default;
   }
 
   .e-ribbon-group-overflow-ddb {
-    &.e-dropdown-popup {
+    &.e-dropdown-popup:has(.e-ribbon-overflow-target) {
       min-width: 190px;
     }
     .e-ribbon-of-tab:not(.e-ribbon-active) {

package/SCSS-Themes/ribbon/ribbon/bootstrap5-dark.scss

@@ -1251,7 +1251,7 @@ $ribbon-gallery-popup-box-shadow: $shadow-lg !default;
   }
 
   .e-ribbon-group-overflow-ddb {
-    &.e-dropdown-popup {
+    &.e-dropdown-popup:has(.e-ribbon-overflow-target) {
       min-width: 190px;
     }
     .e-ribbon-of-tab:not(.e-ribbon-active) {

package/SCSS-Themes/ribbon/ribbon/bootstrap5.scss

@@ -1251,7 +1251,7 @@ $ribbon-gallery-popup-box-shadow: $shadow-lg !default;
   }
 
   .e-ribbon-group-overflow-ddb {
-    &.e-dropdown-popup {
+    &.e-dropdown-popup:has(.e-ribbon-overflow-target) {
       min-width: 190px;
     }
     .e-ribbon-of-tab:not(.e-ribbon-active) {

package/SCSS-Themes/ribbon/ribbon/fabric-dark.scss

@@ -255,7 +255,7 @@ $ribbon-bigger-rtl-button-icon-padding: 11px 16px 11px 12px !default;
 $ribbon-bigger-caret-icon-padding: 0 12px !default;
 $ribbon-bigger-rtl-caret-icon-padding: 0 12px !default;
 
-$ribbon-header-bg-color: $neutral-light-font !default;
+$ribbon-header-bg-color: $neutral-lighter !default;
 $ribbon-border-color: unset !default;
 $ribbon-group-seperator-color: $neutral-quintenary !default;
 $ribbon-group-border-color: $neutral-quintenary !default;
@@ -1251,7 +1251,7 @@ $ribbon-gallery-popup-box-shadow: 0 2px 5px 0 rgba($shadow, .26) !default;
   }
 
   .e-ribbon-group-overflow-ddb {
-    &.e-dropdown-popup {
+    &.e-dropdown-popup:has(.e-ribbon-overflow-target) {
       min-width: 190px;
     }
     .e-ribbon-of-tab:not(.e-ribbon-active) {

package/SCSS-Themes/ribbon/ribbon/fabric.scss

@@ -1251,7 +1251,7 @@ $ribbon-gallery-popup-box-shadow: 0 0 10px 0 rgba($neutral-black, .2) !default;
   }
 
   .e-ribbon-group-overflow-ddb {
-    &.e-dropdown-popup {
+    &.e-dropdown-popup:has(.e-ribbon-overflow-target) {
       min-width: 190px;
     }
     .e-ribbon-of-tab:not(.e-ribbon-active) {

package/SCSS-Themes/ribbon/ribbon/fluent-dark.scss

@@ -1251,7 +1251,7 @@ $ribbon-gallery-popup-box-shadow: $shadow-lg !default;
   }
 
   .e-ribbon-group-overflow-ddb {
-    &.e-dropdown-popup {
+    &.e-dropdown-popup:has(.e-ribbon-overflow-target) {
       min-width: 190px;
     }
     .e-ribbon-of-tab:not(.e-ribbon-active) {

package/SCSS-Themes/ribbon/ribbon/fluent.scss

@@ -1251,7 +1251,7 @@ $ribbon-gallery-popup-box-shadow: $shadow-lg !default;
   }
 
   .e-ribbon-group-overflow-ddb {
-    &.e-dropdown-popup {
+    &.e-dropdown-popup:has(.e-ribbon-overflow-target) {
       min-width: 190px;
     }
     .e-ribbon-of-tab:not(.e-ribbon-active) {

package/SCSS-Themes/ribbon/ribbon/highcontrast.scss

@@ -1251,7 +1251,7 @@ $ribbon-gallery-popup-box-shadow: 0 6px 12px rgba($bg-base-0, .175) !default;
   }
 
   .e-ribbon-group-overflow-ddb {
-    &.e-dropdown-popup {
+    &.e-dropdown-popup:has(.e-ribbon-overflow-target) {
       min-width: 190px;
     }
     .e-ribbon-of-tab:not(.e-ribbon-active) {

package/SCSS-Themes/ribbon/ribbon/material-dark.scss

@@ -1251,7 +1251,7 @@ $ribbon-gallery-popup-box-shadow: 0 3px 8px 0 rgba($grey-black, .26) !default;
   }
 
   .e-ribbon-group-overflow-ddb {
-    &.e-dropdown-popup {
+    &.e-dropdown-popup:has(.e-ribbon-overflow-target) {
       min-width: 190px;
     }
     .e-ribbon-of-tab:not(.e-ribbon-active) {

package/SCSS-Themes/ribbon/ribbon/material.scss

@@ -1251,7 +1251,7 @@ $ribbon-gallery-popup-box-shadow: 0 5px 5px -3px rgba($grey-black, .2), 0 8px 10
   }
 
   .e-ribbon-group-overflow-ddb {
-    &.e-dropdown-popup {
+    &.e-dropdown-popup:has(.e-ribbon-overflow-target) {
       min-width: 190px;
     }
     .e-ribbon-of-tab:not(.e-ribbon-active) {

package/SCSS-Themes/ribbon/ribbon/material3-dark.scss

@@ -339,8 +339,8 @@ $ribbon-popup-common-box-shadow: $shadow-md !default;
 $ribbon-filemenu-popup-border-radius: 4px !default;
 $ribbon-contextual-tab-color: $ribbon-active-tab-indicator-color !default;
 $ribbon-contextual-tab-background: rgba($content-bg-color-selected) !default;
-$ribbon-keytip-background-color: rgba($black) !default;
-$ribbon-keytip-color: rgba($content-text-color-inverse) !default;
+$ribbon-keytip-background-color: rgba($tooltip-bg-color) !default;
+$ribbon-keytip-color: rgba($tooltip-text-color) !default;
 $ribbon-gallery-popup-background-color: rgba($content-bg-color) !default;
 $ribbon-gallery-item-background-color: $transparent !default;
 $ribbon-gallery-item-selected-color: rgba($content-bg-color-selected) !default;
@@ -1250,7 +1250,7 @@ $ribbon-gallery-popup-box-shadow: $shadow-sm !default;
   }
 
   .e-ribbon-group-overflow-ddb {
-    &.e-dropdown-popup {
+    &.e-dropdown-popup:has(.e-ribbon-overflow-target) {
       min-width: 190px;
     }
     .e-ribbon-of-tab:not(.e-ribbon-active) {

package/SCSS-Themes/ribbon/ribbon/material3.scss

@@ -339,8 +339,8 @@ $ribbon-popup-common-box-shadow: $shadow-md !default;
 $ribbon-filemenu-popup-border-radius: 4px !default;
 $ribbon-contextual-tab-color: $ribbon-active-tab-indicator-color !default;
 $ribbon-contextual-tab-background: rgba($content-bg-color-selected) !default;
-$ribbon-keytip-background-color: rgba($black) !default;
-$ribbon-keytip-color: rgba($content-text-color-inverse) !default;
+$ribbon-keytip-background-color: rgba($tooltip-bg-color) !default;
+$ribbon-keytip-color: rgba($tooltip-text-color) !default;
 $ribbon-gallery-popup-background-color: rgba($content-bg-color) !default;
 $ribbon-gallery-item-background-color: $transparent !default;
 $ribbon-gallery-item-selected-color: rgba($content-bg-color-selected) !default;
@@ -1250,7 +1250,7 @@ $ribbon-gallery-popup-box-shadow: $shadow-sm !default;
   }
 
   .e-ribbon-group-overflow-ddb {
-    &.e-dropdown-popup {
+    &.e-dropdown-popup:has(.e-ribbon-overflow-target) {
       min-width: 190px;
     }
     .e-ribbon-of-tab:not(.e-ribbon-active) {

package/SCSS-Themes/ribbon/ribbon/tailwind-dark.scss

@@ -1251,7 +1251,7 @@ $ribbon-gallery-popup-box-shadow: $shadow-md !default;
   }
 
   .e-ribbon-group-overflow-ddb {
-    &.e-dropdown-popup {
+    &.e-dropdown-popup:has(.e-ribbon-overflow-target) {
       min-width: 190px;
     }
     .e-ribbon-of-tab:not(.e-ribbon-active) {

package/SCSS-Themes/ribbon/ribbon/tailwind.scss

@@ -1251,7 +1251,7 @@ $ribbon-gallery-popup-box-shadow: $shadow-md !default;
   }
 
   .e-ribbon-group-overflow-ddb {
-    &.e-dropdown-popup {
+    &.e-dropdown-popup:has(.e-ribbon-overflow-target) {
       min-width: 190px;
     }
     .e-ribbon-of-tab:not(.e-ribbon-active) {

package/SCSS-Themes/richtexteditor/rich-text-editor/bds-dark.scss

@@ -1609,12 +1609,12 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
         @if $skin-name =='bootstrap' or $skin-name =='botstrap-dark' {
           &:hover,
           &:focus{
-            padding: 6px 2px;
+            padding: 7px 3px;
           }
         }
 
         @if $skin-name =='material' or $skin-name =='material-dark' {
-          padding: 3px;
+          padding: 0 6px;
         }
 
         .e-tbar-btn-text {
@@ -2009,7 +2009,7 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
     .e-rte-numberformatlist-dropdown.e-dropdown-btn.e-tbar-btn.e-btn.e-control,
     .e-rte-bulletformatlist-dropdown.e-dropdown-btn.e-tbar-btn.e-btn.e-control {
       @if $skin-name == 'tailwind' {
-        padding: 1px;
+        padding: 0;
       }
     }
   }
@@ -2455,10 +2455,6 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
       box-shadow: $rte-table-popup-box;
     }
 
-    .e-rte-elements.e-rte-quick-popup .e-toolbar .e-toolbar-items.e-toolbar-multirow:not(.e-tbar-pos) .e-toolbar-item:first-child {
-      margin-left: 6px;
-    }
-
     .e-rte-elements.e-rte-quick-popup .e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn .e-icons.e-btn-icon {
       min-width: 24px;
     }
@@ -2580,6 +2576,10 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
       display: block;
     }
   }
+  // Used to hide the Color picker during the rendering at the initial stage. Removed the class in the created event.
+  .e-rte-picker-init {
+    display: none !important; /* stylelint-disable-line declaration-no-important */
+  }
 }
 
 
@@ -2966,6 +2966,27 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
     .e-video-url-wrap textarea {
       height: 80px;
     }
+
+    @if $skin-name == 'FluentUI' {
+      .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn{
+        border: 1px solid transparent;
+        &:hover{
+          border: 1px solid transparent;
+        }
+      }
+      .e-toolbar .e-toolbar-item .e-tbar-btn{
+        border: 1px solid transparent;
+        &:hover{
+          border: 1px solid transparent;
+        }
+      }
+    }
+
+    @if $skin-name == 'bootstrap-dark' {
+      .e-toolbar-extended .e-toolbar-item:not(.e-active) .e-tbar-btn{
+        border: 1px solid transparent;
+      }
+    }
   }
 
   .e-rte-quick-popup {

package/SCSS-Themes/richtexteditor/rich-text-editor/bds.scss

@@ -1609,12 +1609,12 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
         @if $skin-name =='bootstrap' or $skin-name =='botstrap-dark' {
           &:hover,
           &:focus{
-            padding: 6px 2px;
+            padding: 7px 3px;
           }
         }
 
         @if $skin-name =='material' or $skin-name =='material-dark' {
-          padding: 3px;
+          padding: 0 6px;
         }
 
         .e-tbar-btn-text {
@@ -2009,7 +2009,7 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
     .e-rte-numberformatlist-dropdown.e-dropdown-btn.e-tbar-btn.e-btn.e-control,
     .e-rte-bulletformatlist-dropdown.e-dropdown-btn.e-tbar-btn.e-btn.e-control {
       @if $skin-name == 'tailwind' {
-        padding: 1px;
+        padding: 0;
       }
     }
   }
@@ -2455,10 +2455,6 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
       box-shadow: $rte-table-popup-box;
     }
 
-    .e-rte-elements.e-rte-quick-popup .e-toolbar .e-toolbar-items.e-toolbar-multirow:not(.e-tbar-pos) .e-toolbar-item:first-child {
-      margin-left: 6px;
-    }
-
     .e-rte-elements.e-rte-quick-popup .e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn .e-icons.e-btn-icon {
       min-width: 24px;
     }
@@ -2580,6 +2576,10 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
       display: block;
     }
   }
+  // Used to hide the Color picker during the rendering at the initial stage. Removed the class in the created event.
+  .e-rte-picker-init {
+    display: none !important; /* stylelint-disable-line declaration-no-important */
+  }
 }
 
 
@@ -2966,6 +2966,27 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
     .e-video-url-wrap textarea {
       height: 80px;
     }
+
+    @if $skin-name == 'FluentUI' {
+      .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn{
+        border: 1px solid transparent;
+        &:hover{
+          border: 1px solid transparent;
+        }
+      }
+      .e-toolbar .e-toolbar-item .e-tbar-btn{
+        border: 1px solid transparent;
+        &:hover{
+          border: 1px solid transparent;
+        }
+      }
+    }
+
+    @if $skin-name == 'bootstrap-dark' {
+      .e-toolbar-extended .e-toolbar-item:not(.e-active) .e-tbar-btn{
+        border: 1px solid transparent;
+      }
+    }
   }
 
   .e-rte-quick-popup {

package/SCSS-Themes/richtexteditor/rich-text-editor/bootstrap-dark.scss

@@ -169,7 +169,7 @@ $rte-colorpicker-parent-padding-hover: 1px !default;
 $rte-colorpicker-parent-padding-active-hover: 1px !default;
 $rte-overlay-color: #383838 !default;
 $rte-dropdown-btn-color-content-height: 30px !default;
-$rte-big-dropdown-btn-color-content-height: 30px !default;
+$rte-big-dropdown-btn-color-content-height: 35px !default;
 $rte-font-icon-width: 30px !default;
 $rte-font-arrow-width: 18px !default;
 $rte-font-arrow-touch-width: 20px !default;
@@ -274,9 +274,9 @@ $rte-big-tablecell-width : 16px;
 $rte-toolbar-item-frist-last-child-margin: 0;
 $rte-big-toolbar-item-frist-last-child-margin: 0 6px;
 $dropdown-btn-font-size: inherit !default;
-$rte-toolbar-expaned-padding: 2px 3.5px;
+$rte-toolbar-expaned-padding: 0 2.5px;
 $rte-toolbar-expaned-padding-hover: 0 2.5px;
-$rte-big-toolbar-expaned-padding: 0 6px;
+$rte-big-toolbar-expaned-padding: 0 7px;
 $rte-extended-toolbar-items-padding: 0;
 $rte-expand-tbar-hover-bg: transparent !default;
 $rte-big-insert-dialog-label-padding-top: 12px;
@@ -285,7 +285,7 @@ $rte-background-color-icon-fontsize: 14px;
 $rte-big-background-color-icon-fontsize: 18px;
 $rte-dropdown-btn-color-content-padding: 1px !default;
 $rte-big-dropdown-btn-color-content-padding: 1px !default;
-$rte-tb-expended-min-height: 44px !default;
+$rte-tb-expended-min-height: 40px !default;
 $rte-big-tb-expended-min-height: 49px !default;
 $rte-tb-expended-padding-left: 1px !default;
 $rte-tb-expended-hover-padding-left: 1px !default;
@@ -1611,12 +1611,12 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
         @if $skin-name =='bootstrap' or $skin-name =='botstrap-dark' {
           &:hover,
           &:focus{
-            padding: 6px 2px;
+            padding: 7px 3px;
           }
         }
 
         @if $skin-name =='material' or $skin-name =='material-dark' {
-          padding: 3px;
+          padding: 0 6px;
         }
 
         .e-tbar-btn-text {
@@ -2011,7 +2011,7 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
     .e-rte-numberformatlist-dropdown.e-dropdown-btn.e-tbar-btn.e-btn.e-control,
     .e-rte-bulletformatlist-dropdown.e-dropdown-btn.e-tbar-btn.e-btn.e-control {
       @if $skin-name == 'tailwind' {
-        padding: 1px;
+        padding: 0;
       }
     }
   }
@@ -2457,10 +2457,6 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
       box-shadow: $rte-table-popup-box;
     }
 
-    .e-rte-elements.e-rte-quick-popup .e-toolbar .e-toolbar-items.e-toolbar-multirow:not(.e-tbar-pos) .e-toolbar-item:first-child {
-      margin-left: 6px;
-    }
-
     .e-rte-elements.e-rte-quick-popup .e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn .e-icons.e-btn-icon {
       min-width: 24px;
     }
@@ -2582,6 +2578,10 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
       display: block;
     }
   }
+  // Used to hide the Color picker during the rendering at the initial stage. Removed the class in the created event.
+  .e-rte-picker-init {
+    display: none !important; /* stylelint-disable-line declaration-no-important */
+  }
 }
 
 
@@ -2968,6 +2968,27 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
     .e-video-url-wrap textarea {
       height: 80px;
     }
+
+    @if $skin-name == 'FluentUI' {
+      .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn{
+        border: 1px solid transparent;
+        &:hover{
+          border: 1px solid transparent;
+        }
+      }
+      .e-toolbar .e-toolbar-item .e-tbar-btn{
+        border: 1px solid transparent;
+        &:hover{
+          border: 1px solid transparent;
+        }
+      }
+    }
+
+    @if $skin-name == 'bootstrap-dark' {
+      .e-toolbar-extended .e-toolbar-item:not(.e-active) .e-tbar-btn{
+        border: 1px solid transparent;
+      }
+    }
   }
 
   .e-rte-quick-popup {

package/SCSS-Themes/richtexteditor/rich-text-editor/bootstrap.scss

@@ -273,7 +273,7 @@ $rte-big-tablecell-height : 16px;
 $rte-big-tablecell-width : 16px;
 $rte-toolbar-item-frist-last-child-margin: 0;
 $rte-big-toolbar-item-frist-last-child-margin: 0 6px;
-$rte-toolbar-expaned-padding: 2px 3.5px;
+$rte-toolbar-expaned-padding: 1px 2.5px;
 $dropdown-btn-font-size: inherit !default;
 $rte-toolbar-expaned-padding-hover: 1px 2.5px;
 $rte-big-toolbar-expaned-padding: 0 7px;
@@ -285,7 +285,7 @@ $rte-background-color-icon-fontsize: 14px;
 $rte-big-background-color-icon-fontsize: 18px;
 $rte-dropdown-btn-color-content-padding: 1px !default;
 $rte-big-dropdown-btn-color-content-padding: 1px !default;
-$rte-tb-expended-min-height: 44px !default;
+$rte-tb-expended-min-height: 40px !default;
 $rte-big-tb-expended-min-height: 49px !default;
 $rte-tb-expended-padding-left: 1px !default;
 $rte-tb-expended-hover-padding-left: 1px !default;
@@ -1667,12 +1667,12 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
         @if $skin-name =='bootstrap' or $skin-name =='botstrap-dark' {
           &:hover,
           &:focus{
-            padding: 6px 2px;
+            padding: 7px 3px;
           }
         }
 
         @if $skin-name =='material' or $skin-name =='material-dark' {
-          padding: 3px;
+          padding: 0 6px;
         }
 
         .e-tbar-btn-text {
@@ -2067,7 +2067,7 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
     .e-rte-numberformatlist-dropdown.e-dropdown-btn.e-tbar-btn.e-btn.e-control,
     .e-rte-bulletformatlist-dropdown.e-dropdown-btn.e-tbar-btn.e-btn.e-control {
       @if $skin-name == 'tailwind' {
-        padding: 1px;
+        padding: 0;
       }
     }
   }
@@ -2513,10 +2513,6 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
       box-shadow: $rte-table-popup-box;
     }
 
-    .e-rte-elements.e-rte-quick-popup .e-toolbar .e-toolbar-items.e-toolbar-multirow:not(.e-tbar-pos) .e-toolbar-item:first-child {
-      margin-left: 6px;
-    }
-
     .e-rte-elements.e-rte-quick-popup .e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn .e-icons.e-btn-icon {
       min-width: 24px;
     }
@@ -2638,6 +2634,10 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
       display: block;
     }
   }
+  // Used to hide the Color picker during the rendering at the initial stage. Removed the class in the created event.
+  .e-rte-picker-init {
+    display: none !important; /* stylelint-disable-line declaration-no-important */
+  }
 }
 
 
@@ -3024,6 +3024,27 @@ $rte-format-painter-cursor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiI
     .e-video-url-wrap textarea {
       height: 80px;
     }
+
+    @if $skin-name == 'FluentUI' {
+      .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn{
+        border: 1px solid transparent;
+        &:hover{
+          border: 1px solid transparent;
+        }
+      }
+      .e-toolbar .e-toolbar-item .e-tbar-btn{
+        border: 1px solid transparent;
+        &:hover{
+          border: 1px solid transparent;
+        }
+      }
+    }
+
+    @if $skin-name == 'bootstrap-dark' {
+      .e-toolbar-extended .e-toolbar-item:not(.e-active) .e-tbar-btn{
+        border: 1px solid transparent;
+      }
+    }
   }
 
   .e-rte-quick-popup {