@syncfusion/blazor-themes 27.1.48 → 27.1.50

package/SCSS-Themes/highcontrast.scss

@@ -3755,9 +3755,7 @@ $ddl-bigger-small-list-font-size: 14px !default;
 
   .e-ddl.e-popup .e-filter-parent .e-input-group input.e-input-filter {
     border-color: transparent;
-    @if $skin-name == 'bootstrap4' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' or $skin-name == 'highcontrast' {
-      background: none;
-    }
+    background: none;
   }
 }
 
@@ -29896,6 +29894,13 @@ $cbox-checked-ripple-bgcolo: rgba(0, 0, 0, .3) !default;
           }
         }
       }
+
+      &:hover .e-checkbox:focus + .e-frame.e-check {
+        @if $theme-name == 'fluent2-highcontrast' {
+          background-color: $primary-border-color-hover !important; /* stylelint-disable-line declaration-no-important */
+          border-color: $primary-border-color-hover !important; /* stylelint-disable-line declaration-no-important */
+        }
+      }
     }
   }
 }
@@ -37658,7 +37663,7 @@ $cpicker-recent-color-tile-border: $border-alt !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }
@@ -48719,41 +48724,6 @@ $dialog-enable-resize-padding-bottom: 15px !default;
   .e-footer-content {
     background-color: $dialog-footer-bg-color;
 
-    @if $skin-name == 'material' or $skin-name == 'material-dark' {
-      .e-btn.e-primary {
-        background: none;
-        box-shadow: none;
-        color: $dialog-primary-button-color;
-      }
-
-      .e-btn:not(.e-primary) {
-        background: none;
-        box-shadow: none;
-        color: $dialog-secondary-button-color;
-      }
-    }
-
-    @if $skin-name == 'material' or $skin-name == 'material-dark' {
-      .e-btn.e-primary:not([DISABLED]):focus-visible,
-      .e-btn.e-primary:not([DISABLED]):focus {
-        background: $dialog-footer-primary-focus-btn-bg-color;
-      }
-      .e-btn.e-primary:not([DISABLED]):hover {
-        background: $dialog-footer-primary-hover-btn-bg-color;
-      }
-      .e-btn.e-primary:not([DISABLED]):active {
-        background: $dialog-footer-primary-active-btn-bg-color;
-      }
-      .e-btn:not([DISABLED]):focus-visible,
-      .e-btn:not(.e-primary):not([DISABLED]):focus,
-      .e-btn:not([DISABLED]):hover {
-        background: $dialog-footer-flat-hover-btn-bg-color;
-      }
-      .e-btn:not([DISABLED]):active {
-        background: $dialog-footer-flat-active-btn-bg-color;
-      }
-    }
-
     @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' or  $skin-name == 'Material3' or $skin-name == 'tailwind' or $skin-name == 'FluentUI' or $skin-name == 'fluent2' {
       .e-btn.e-primary.e-flat:not([DISABLED]) {
         background: $dialog-footer-btn-bg-color;
@@ -67865,6 +67835,7 @@ $listbox-ej2-filterselect-bigger-height: calc(100% - 104px) !default;
       }
     }
 
+    & .e-list-wrap:focus-visible,
     &:focus {
       outline: none;
     }
@@ -82377,28 +82348,18 @@ $grid-checkmark-color: $selection-font !default;
     }
 
     .e-bigger &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground,
-    &.e-bothlines.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground,
-    .e-bigger &.e-rtl td.e-rowcell.e-cellselectionbackground,
-    &.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground {
+    &.e-bothlines.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground {
       @if $grid-skin == 'material3' {
         border: 1px solid rgba($content-text-color);
       }
     }
 
-    .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
-    .e-bigger & td.e-cellselectionbackground,
-    &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
-    &.e-bigger td.e-cellselectionbackground {
-      @if $grid-skin == 'material3' {
-        padding-bottom: 13px;
-        @include grid-padding-left-right(11.5px, 11.5px);
-      }
-    }
-
-    .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
-    &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground {
+    .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell),
+    &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell) {
       @if $grid-skin == 'material3' {
-        padding-top: 13px;
+        padding-top: 0;
+        padding-bottom: 0;
+        @include grid-padding-left-right(12px, 12px);
       }
     }
 
@@ -83038,6 +82999,9 @@ $grid-checkmark-color: $selection-font !default;
   
         & .e-res-apply-btn:disabled {
           color: $grid-btn-disabled-bgcolor;
+          @if $grid-skin == 'fluent2' {
+            color: $primary-text-disabled;
+          }
         }
         & .e-btn {
           @if $grid-skin != 'fluent2' {
@@ -84136,6 +84100,18 @@ $grid-checkmark-color: $selection-font !default;
       }
     }
 
+    &:not(.sf-grid) .e-res-toolbar .e-toolbar-items .e-search-wrapper {
+      & .e-search-icon {
+        padding: $grid-res-toolbar-search-wrapper-icon-padding;
+        @if $grid-skin == 'bootstrap5.3' {
+          padding: 9px 8px;
+        }
+        @if $grid-skin == 'bootstrap4' {
+          padding: 9px 9.5px;
+        }
+      }
+    }
+
     .e-res-toolbar {
       border-bottom: 1px solid;
       border-bottom-color: $grid-header-border-color;
@@ -84236,18 +84212,6 @@ $grid-checkmark-color: $selection-font !default;
           }
         }
 
-        &:not(.sf-grid).e-search-wrapper {
-          & .e-search-icon {
-            padding: $grid-res-toolbar-search-wrapper-icon-padding;
-            @if $grid-skin == 'bootstrap5.3' {
-              padding: 9px 8px;
-            }
-            @if $grid-skin == 'bootstrap4' {
-              padding: 9px 9.5px;
-            }
-          }
-        }
-
         & .e-responsive-right {
           & .e-search-wrapper {
             padding-left: 0;
@@ -84444,8 +84408,11 @@ $grid-checkmark-color: $selection-font !default;
       }
     }
 
-    &.e-default .e-grouptopleftcell {
-      border-top: $grid-grouptopleftcell-border-top;
+    &.e-default {
+      .e-grouptopleftcell,
+      .e-rowdragheader {
+        border-top: $grid-grouptopleftcell-border-top;
+      }
     }
 
     &.e-default .e-gridheader .e-headercell.e-firstheader,
@@ -84453,10 +84420,13 @@ $grid-checkmark-color: $selection-font !default;
       border-left: 1px solid;
     }
 
-    &.e-default.e-verticallines .e-grouptopleftcell,
-    &.e-default.e-bothlines .e-grouptopleftcell,
-    &.e-default.e-hidelines .e-grouptopleftcell {
-      border-top-width: 0;
+    &.e-default.e-verticallines,
+    &.e-default.e-bothlines,
+    &.e-default.e-hidelines {
+      .e-grouptopleftcell,
+      .e-rowdragheader {
+        border-top-width: 0;
+      }
     }
 
     &.e-default.e-verticallines,
@@ -84717,6 +84687,12 @@ $grid-checkmark-color: $selection-font !default;
       width: auto;
     }
 
+    .e-rowcell.e-gridchkbox {
+      @if $grid-skin == 'fluent' {
+        padding-left: 8px;
+      }
+    }
+
     &.e-left-shadow,
     &.e-rtl.e-left-shadow,
     &.e-rtl.e-default.e-left-shadow,
@@ -85660,13 +85636,12 @@ $grid-checkmark-color: $selection-font !default;
       font-weight: $grid-selection-font-weight;
     }
 
-    &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
+    &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell),
     td.e-cellselectionbackground {
       font-weight: $grid-selection-font-weight;
       @if $grid-skin == 'material3' {
-        border: 1px solid rgba($content-text-color);
         padding-bottom: 7px;
-        @include grid-padding-left-right(7.5px, 7.5px);
+        @include grid-padding-left-right(8px, 8px);
       }
     }
 
@@ -85677,14 +85652,13 @@ $grid-checkmark-color: $selection-font !default;
     }
 
     &.e-bothlines td.e-rowcell.e-cellselectionbackground,
-    &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground,
-    &.e-rtl td.e-rowcell.e-cellselectionbackground {
+    &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground {
       @if $grid-skin == 'material3' {
         border: 1px solid rgba($content-text-color);
       }
     }
 
-    &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground {
+    &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell) {
       @if $grid-skin == 'material3' {
         padding-top: 7px;
       }
@@ -86764,7 +86738,8 @@ $grid-checkmark-color: $selection-font !default;
     }
 
     &.e-wrap {
-      & .e-rowcell,
+      & .e-gridheader .e-rowcell,
+      & .e-gridcontent .e-rowcell,
       & .e-columnheader .e-stackedheadercelldiv,
       & .e-columnheader .e-headercelldiv,
       & .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv {
@@ -86777,6 +86752,10 @@ $grid-checkmark-color: $selection-font !default;
           max-height: $grid-rowcell-wrap-max-height;
         }
       }
+
+      & .e-checkbox-wrapper {
+        vertical-align: middle;
+      }
     }
 
     &.e-wrap .e-columnheader {
@@ -86949,6 +86928,7 @@ $grid-checkmark-color: $selection-font !default;
     }
 
     &.sf-grid {
+      
       span.e-ungroupbutton.e-icons {
         margin-left: $grid-group-ungroupicon-margin-left;
         @if $grid-skin == 'material3' {
@@ -87627,10 +87607,12 @@ $grid-checkmark-color: $selection-font !default;
 
     .e-verticallines tr th,
     .e-grouptopleftcell,
+    .e-rowdragheader,
     .e-gridpopup .e-content,
     .e-filterbarcell,
     .e-filterbarcelldisabled,
     &.e-default .e-grouptopleftcell,
+    &.e-default .e-rowdragheader,
     .e-headercell,
     .e-summarycell,
     .e-detailheadercell,
@@ -95626,6 +95608,22 @@ $rte-dialog-upload-status-progress: #0056b3 !default;
         margin-block-start: 10px;
       }
 
+      .e-content ul {
+        list-style-type: disc;
+      }
+
+      .e-content ul ul,
+      .e-content ol ul {
+        list-style-type: circle;
+      }
+
+      .e-content ul ul ul,
+      .e-content ol ul ul,
+      .e-content ul ol ul,
+      .e-content ol ol ul {
+        list-style-type: square;
+      }
+
       .e-content h1 {
         font-size: 2.857em;
         font-weight: 600;
@@ -95694,7 +95692,7 @@ $rte-dialog-upload-status-progress: #0056b3 !default;
         word-break: inherit;
         word-wrap: break-word;
 
-        @if $skin-name == 'fluent2' or $skin-name == 'fluent2-highcontrast' or $skin-name == 'fluent2-dark' {
+        @if $skin-name == 'fluent2' or $theme-name == 'fluent2-highcontrast' or $skin-name == 'fluent2-dark' {
           background-color: $rte-pre-bg-color;
         }
       }
@@ -97535,6 +97533,12 @@ $rte-dialog-upload-status-progress: #0056b3 !default;
             color: $rte-drop-btn-active-color;
           }
         }
+
+        .e-tbar-btn:hover {
+          @if $theme-name == 'bootstrap5.3' {
+            color: $rte-drop-btn-active-color;
+          }
+        }
       }
 
       .e-toolbar-extended {
@@ -97561,6 +97565,12 @@ $rte-dialog-upload-status-progress: #0056b3 !default;
           background: $rte-drop-btn-active-bg;
         }
 
+        .e-toolbar-item .e-tbar-btn:hover {
+          @if $theme-name == 'bootstrap5.3' {
+            color: $rte-drop-btn-active-color;
+          }
+        }
+
         @if $skin-name == 'bootstrap5' {
           .e-toolbar-item .e-tbar-btn:focus,
           .e-toolbar-item .e-tbar-btn:hover {
@@ -97579,7 +97589,7 @@ $rte-dialog-upload-status-progress: #0056b3 !default;
       background: transparent;
       color: transparent;
     }
-    @if $skin-name == 'Material3'  or $skin-name == 'fluent2' or $skin-name == 'fluent2-highcontrast' or $skin-name == 'fluent2-dark' {
+    @if $skin-name == 'Material3'  or $skin-name == 'fluent2' or $theme-name == 'fluent2-highcontrast' or $skin-name == 'fluent2-dark' {
       ::selection {
         color: $rte-selection-color;
         background: $rte-selection-bg;
@@ -97697,7 +97707,7 @@ $rte-dialog-upload-status-progress: #0056b3 !default;
         .e-rte-list-primary-content {
 
           &:hover {
-            @if $skin-name == 'fluent2-highcontrast' {
+            @if $theme-name == 'fluent2-highcontrast' {
               background: $rte-split-btn-span-active-bg;
             }
             @else {
@@ -97717,7 +97727,7 @@ $rte-dialog-upload-status-progress: #0056b3 !default;
         .e-caret {
 
           &:hover {
-            @if $skin-name == 'fluent2-highcontrast' {
+            @if $theme-name == 'fluent2-highcontrast' {
               background: $rte-split-btn-span-active-bg;
             }
             @else {
@@ -97779,7 +97789,7 @@ $rte-dialog-upload-status-progress: #0056b3 !default;
               justify-content: center;
             }
             &:hover {
-              @if $skin-name == 'fluent2-highcontrast' {
+              @if $theme-name == 'fluent2-highcontrast' {
                 background: $rte-split-btn-span-active-bg;
               }
               @else {
@@ -97790,7 +97800,7 @@ $rte-dialog-upload-status-progress: #0056b3 !default;
 
           .e-caret {
             &:hover {
-              @if $skin-name == 'fluent2-highcontrast' {
+              @if $theme-name == 'fluent2-highcontrast' {
                 background: $rte-split-btn-span-active-bg;
               }
               @else {
@@ -98084,8 +98094,14 @@ $rte-dialog-upload-status-progress: #0056b3 !default;
       }
     }
   }
+  
   .e-richtexteditor .e-rte-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-active .e-icons {
-    color: $rte-tlbar-expand-active;
+    @if $theme-name == 'fluent2-highcontrast' {
+      color: $rte-drop-btn-active-color;
+    }
+    @else {
+      color: $rte-tlbar-expand-active;
+    }
   }
 
   .e-rte-emojipicker-popup.e-popup.e-popup-open {

package/SCSS-Themes/inputs/color-picker/bds-dark.scss

@@ -1796,7 +1796,7 @@ $cpicker-recent-color-tile-border: $gray-700 !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/bds.scss

@@ -1796,7 +1796,7 @@ $cpicker-recent-color-tile-border: $gray-700 !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/bootstrap-dark.scss

@@ -1781,7 +1781,7 @@ $cpicker-recent-color-tile-border: $grey-ad !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/bootstrap.scss

@@ -1781,7 +1781,7 @@ $cpicker-recent-color-tile-border: $grey-e6 !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/bootstrap4.scss

@@ -1780,7 +1780,7 @@ $cpicker-recent-color-tile-border: $gray-200 !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/bootstrap5-dark.scss

@@ -1785,7 +1785,7 @@ $cpicker-recent-color-tile-border: $border-light !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/bootstrap5.3.scss

@@ -1785,7 +1785,7 @@ $cpicker-recent-color-tile-border: $border-light !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/bootstrap5.scss

@@ -1785,7 +1785,7 @@ $cpicker-recent-color-tile-border: $border-light !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/fabric-dark.scss

@@ -1781,7 +1781,7 @@ $cpicker-recent-color-tile-border: $neutral-light !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/fabric.scss

@@ -1780,7 +1780,7 @@ $cpicker-recent-color-tile-border: $neutral-lighter !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/fluent-dark.scss

@@ -1785,7 +1785,7 @@ $cpicker-recent-color-tile-border: $border-light !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/fluent.scss

@@ -1785,7 +1785,7 @@ $cpicker-recent-color-tile-border: $border-light !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/fluent2-dark.scss

@@ -1796,7 +1796,7 @@ $cpicker-recent-color-tile-border: $border-light !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/fluent2.scss

@@ -1796,7 +1796,7 @@ $cpicker-recent-color-tile-border: $border-light !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/highcontrast.scss

@@ -1780,7 +1780,7 @@ $cpicker-recent-color-tile-border: $border-alt !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/material-dark.scss

@@ -1785,7 +1785,7 @@ $cpicker-recent-color-tile-border: $grey-700 !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/material.scss

@@ -1783,7 +1783,7 @@ $cpicker-recent-color-tile-border: $grey-200 !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/material3-dark.scss

@@ -1793,7 +1793,7 @@ $cpicker-recent-color-tile-border: $border-light !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/material3.scss

@@ -1793,7 +1793,7 @@ $cpicker-recent-color-tile-border: $border-light !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/tailwind-dark.scss

@@ -1784,7 +1784,7 @@ $cpicker-recent-color-tile-border: $border-light !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }

package/SCSS-Themes/inputs/color-picker/tailwind.scss

@@ -1784,7 +1784,7 @@ $cpicker-recent-color-tile-border: $border-light !default;
           color: $cpicker-handler-tooltip-color;
         }
         @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
-          background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+          background-color: $btn-hover-bgcolor;
           color: $cpicker-handler-tooltip-color;
         }
       }