@syncfusion/blazor-themes 20.3.59 → 20.3.61

package/SCSS-Themes/bootstrap5-dark.scss

@@ -24115,8 +24115,8 @@ $sd-active-font-color: $content-text-color-focus !default;
 
 @include export-module('speed-dial-layout') {
   .e-speeddial-popup {
-    pointer-events: none;
     position: absolute;
+    z-index: 99999;
 
     &.e-speeddial-top {
       top: $sd-offset;
@@ -35584,9 +35584,6 @@ $cmenu-hover-icon-color: $cmenu-icon-color !default;
 
     & .e-menu-item  {
       @include bigger-li-size;
-      @if $skin-name == 'tailwind' or $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' {
-        padding: $cmenu-bigger-li-padding;
-      }
 
       & .e-caret {
         font-size: $cmenu-bigger-caret-font-size;
@@ -42983,7 +42980,7 @@ $drag-hover-border: 1px dashed $primary !default;
 
 
 //Layout Variables Start
-$dialog-close-button-left: 0 !default;
+$dialog-close-button-left: -5px !default;
 $dialog-header-border: 1px solid $border-light !default;
 $dialog-close-icon-font-size: 16px !default;
 $dialog-bigger-close-icon-font-size: 20px !default;
@@ -43023,7 +43020,7 @@ $dialog-bigger-close-icon-top: 0 !default;
 $dialog-bigger-close-icon-margin-left: 0 !default;
 $dialog-bigger-close-icon-margin-right: 0 !default;
 $dialog-bigger-close-button-bottom: 7px !default;
-$dialog-bigger-close-button-left: 0 !default;
+$dialog-bigger-close-button-left: -7px !default;
 $dialog-bigger-close-button-height: 20px !default;
 $dialog-bigger-close-button-width: 20px !default;
 $dialog-resize-handler-width: 15px;
@@ -54611,7 +54608,17 @@ $treeview-item-active-check-color: $primary !default;
 }
 
 @mixin active-hover-theme {
-  background-color: $treeview-item-active-hover-bg;
+  @if $theme-name =='fluentui-dark' {
+    background-color: lighten($treeview-item-active-bg, 5%);
+  }
+
+  @else if $theme-name =='tailwind' {
+    background-color: darken($treeview-item-active-hover-bg, 10%);
+  }
+
+  @else {
+    background-color: $treeview-item-active-hover-bg;
+  }
   border-color: $treeview-item-active-hover-border-color;
   @if $skin-name == 'bootstrap' or $skin-name == 'highcontrast' {
     -webkit-box-shadow: $treeview-border-shadow;
@@ -55996,7 +56003,7 @@ $menu-caret-color: $cmenu-caret-color !default;
 
     @at-root {
       & .e-menu {
-        @if $skin-name == 'bootstrap4' {
+        @if $skin-name == 'bootstrap4' or $skin-name == 'FluentUI' {
           background-color: $cmenu-ul-bgcolor;
         }
         @else {
@@ -57248,7 +57255,7 @@ $ddt-readonly-input-bg-color: $content-bg-color !default;
       position: absolute;
 
       .e-active .e-checkbox-wrapper {
-        .e-frame:not(.e-check) {
+        .e-frame:not(.e-check):not(.e-stop) {
           @if$ddt-skin-name == 'bootstrap5' {
             background-color: $ddt-readonly-input-bg-color;
           }
@@ -57256,7 +57263,7 @@ $ddt-readonly-input-bg-color: $content-bg-color !default;
       }
 
       .e-checkbox-wrapper {
-        .e-frame:not(.e-check) {
+        .e-frame:not(.e-check):not(.e-stop) {
           @if$ddt-skin-name == 'bootstrap5' {
             background-color: transparent;
           }
@@ -72985,7 +72992,7 @@ $grid-sortnumber-font-size: 14px !default;
 $grid-reorderarrow-margin-top: -7px !default;
 $grid-reorderdownarrow-margin-top: 4px !default;
 $grid-reorder-arrow-top-margin: 0 !default;
-$grid-reorder-downarrow-top-margin: 0 !default;
+$grid-reorder-downarrow-top-margin: -2px !default;
 $grid-bigger-toolbar-icon-size: $grid-bigger-icons-font-size !default;
 $grid-reorderarrow-margin-left: -3px !default;
 $grid-column-chooser-cancel-icon-size: $text-sm !default;
@@ -73955,6 +73962,18 @@ $grid-dropitems-count-margin-left: -4px !default;
       }
     }
 
+    & .e-toolbar-items{
+      & .e-input-group-icon.e-icons.e-sicon:hover:not(.e-clear-icon),
+      & .e-input-group-icon.e-icons.e-sicon:active:not(.e-clear-icon),
+      & .e-input-group-icon.e-icons.e-sicon:focus:not(.e-clear-icon) {
+          background: none;
+          box-shadow: none;
+      }
+      & .e-input-group-icon.e-icons.e-sicon:not(.e-clear-icon) {
+          border: none;
+      }
+  }
+
     .e-res-toolbar {
       border-bottom: 1px solid;
       border-bottom-color: $grid-header-border-color;
@@ -75507,14 +75526,12 @@ $grid-dropitems-count-margin-left: -4px !default;
       font-size: $grid-group-down-arrow-icon-font-size;
       padding: $grid-group-down-arrow-icon-padding;
       text-decoration: none;
-      text-indent: $group-collapse-icon-text-indent;
     }
 
     .e-icon-grightarrow {
       font-size: $grid-group-right-arrow-icon-font-size;
       padding: $grid-group-right-arrow-icon-padding;
       text-decoration: none;
-      text-indent: $group-expand-icon-text-indent;
     }
 
     .e-recordplusexpand {
@@ -76721,7 +76738,7 @@ $grid-dropitems-count-margin-left: -4px !default;
 
   .e-gridheader .e-headercontent .e-reorderuparrow {
     @if $grid-skin == 'fluent' or $grid-skin == 'bootstrap5' {
-      margin-top: -9px;
+      margin-top: -2px;
     }
   }
 
@@ -80308,6 +80325,15 @@ $fe-drop-folder-bg-color: $primary !default;
     }
   }
 
+  @media (min-width: 360px) and (max-width: 500px) {
+    @if $skin-name == 'FluentUI' {
+      .e-bigger .e-filemanager .e-grid .e-checkbox-wrapper .e-frame {
+        position: relative;
+        right: 10px;
+      }
+    }
+  }
+  
   .e-content-placeholder.e-filemanager.e-placeholder-filemanager {
     height: 100%;
     width: 100%;
@@ -87164,12 +87190,12 @@ $bigger-column-menu-size: 35px !default;
       }
 
       .e-zero-spacing {
-        border-spacing: 0;
+        border-spacing: .25px;
       }
 
       .e-chart-row:first-child .e-chart-row-border {
         //border-width: 0;
-        border-top-color: transparent;
+        border-top: 0;
       }
 
       .e-chart-row {
@@ -87449,6 +87475,7 @@ $bigger-column-menu-size: 35px !default;
 
       .e-task-table {
         overflow: hidden;
+        border-collapse: separate;
       }
 
       .e-left-resize-gripper,
@@ -96049,7 +96076,19 @@ $pv-eye-icon-margin-top: 3px !default;
     height: 30px;
     min-height: 30px;
   }
-  
+  .e-bigger .e-pv-signature-dialog-height .e-pv-clearbtn{
+    float: left;
+    height: 49px;
+    min-height: 49px;
+  }
+  .e-bigger .e-pv-signature-dialog-height .e-pv-cancelbtn{
+    height: 49px;
+    min-height: 49px;
+  }
+  .e-bigger .e-pv-signature-dialog-height .e-pv-createbtn{
+    height: 49px;
+    min-height: 49px;
+  }
   
 
   .e-tbar-btn.e-control.e-btn.e-lib.e-icon-btn.e-pv-bold.e-pv-tbar-btn.e-tooltip.textprop-option-active,

package/SCSS-Themes/bootstrap5.scss

@@ -24115,8 +24115,8 @@ $sd-active-font-color: $content-text-color-focus !default;
 
 @include export-module('speed-dial-layout') {
   .e-speeddial-popup {
-    pointer-events: none;
     position: absolute;
+    z-index: 99999;
 
     &.e-speeddial-top {
       top: $sd-offset;
@@ -35584,9 +35584,6 @@ $cmenu-hover-icon-color: $cmenu-icon-color !default;
 
     & .e-menu-item  {
       @include bigger-li-size;
-      @if $skin-name == 'tailwind' or $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' {
-        padding: $cmenu-bigger-li-padding;
-      }
 
       & .e-caret {
         font-size: $cmenu-bigger-caret-font-size;
@@ -42983,7 +42980,7 @@ $drag-hover-border: 1px dashed $primary !default;
 
 
 //Layout Variables Start
-$dialog-close-button-left: 0 !default;
+$dialog-close-button-left: -5px !default;
 $dialog-header-border: 1px solid $border-light !default;
 $dialog-close-icon-font-size: 16px !default;
 $dialog-bigger-close-icon-font-size: 20px !default;
@@ -43023,7 +43020,7 @@ $dialog-bigger-close-icon-top: 0 !default;
 $dialog-bigger-close-icon-margin-left: 0 !default;
 $dialog-bigger-close-icon-margin-right: 0 !default;
 $dialog-bigger-close-button-bottom: 7px !default;
-$dialog-bigger-close-button-left: 0 !default;
+$dialog-bigger-close-button-left: -7px !default;
 $dialog-bigger-close-button-height: 20px !default;
 $dialog-bigger-close-button-width: 20px !default;
 $dialog-resize-handler-width: 15px;
@@ -54611,7 +54608,17 @@ $treeview-item-active-check-color: $primary !default;
 }
 
 @mixin active-hover-theme {
-  background-color: $treeview-item-active-hover-bg;
+  @if $theme-name =='fluentui-dark' {
+    background-color: lighten($treeview-item-active-bg, 5%);
+  }
+
+  @else if $theme-name =='tailwind' {
+    background-color: darken($treeview-item-active-hover-bg, 10%);
+  }
+
+  @else {
+    background-color: $treeview-item-active-hover-bg;
+  }
   border-color: $treeview-item-active-hover-border-color;
   @if $skin-name == 'bootstrap' or $skin-name == 'highcontrast' {
     -webkit-box-shadow: $treeview-border-shadow;
@@ -55996,7 +56003,7 @@ $menu-caret-color: $cmenu-caret-color !default;
 
     @at-root {
       & .e-menu {
-        @if $skin-name == 'bootstrap4' {
+        @if $skin-name == 'bootstrap4' or $skin-name == 'FluentUI' {
           background-color: $cmenu-ul-bgcolor;
         }
         @else {
@@ -57248,7 +57255,7 @@ $ddt-readonly-input-bg-color: $content-bg-color !default;
       position: absolute;
 
       .e-active .e-checkbox-wrapper {
-        .e-frame:not(.e-check) {
+        .e-frame:not(.e-check):not(.e-stop) {
           @if$ddt-skin-name == 'bootstrap5' {
             background-color: $ddt-readonly-input-bg-color;
           }
@@ -57256,7 +57263,7 @@ $ddt-readonly-input-bg-color: $content-bg-color !default;
       }
 
       .e-checkbox-wrapper {
-        .e-frame:not(.e-check) {
+        .e-frame:not(.e-check):not(.e-stop) {
           @if$ddt-skin-name == 'bootstrap5' {
             background-color: transparent;
           }
@@ -72985,7 +72992,7 @@ $grid-sortnumber-font-size: 14px !default;
 $grid-reorderarrow-margin-top: -7px !default;
 $grid-reorderdownarrow-margin-top: 4px !default;
 $grid-reorder-arrow-top-margin: 0 !default;
-$grid-reorder-downarrow-top-margin: 0 !default;
+$grid-reorder-downarrow-top-margin: -2px !default;
 $grid-bigger-toolbar-icon-size: $grid-bigger-icons-font-size !default;
 $grid-reorderarrow-margin-left: -3px !default;
 $grid-column-chooser-cancel-icon-size: $text-sm !default;
@@ -73955,6 +73962,18 @@ $grid-dropitems-count-margin-left: -4px !default;
       }
     }
 
+    & .e-toolbar-items{
+      & .e-input-group-icon.e-icons.e-sicon:hover:not(.e-clear-icon),
+      & .e-input-group-icon.e-icons.e-sicon:active:not(.e-clear-icon),
+      & .e-input-group-icon.e-icons.e-sicon:focus:not(.e-clear-icon) {
+          background: none;
+          box-shadow: none;
+      }
+      & .e-input-group-icon.e-icons.e-sicon:not(.e-clear-icon) {
+          border: none;
+      }
+  }
+
     .e-res-toolbar {
       border-bottom: 1px solid;
       border-bottom-color: $grid-header-border-color;
@@ -75507,14 +75526,12 @@ $grid-dropitems-count-margin-left: -4px !default;
       font-size: $grid-group-down-arrow-icon-font-size;
       padding: $grid-group-down-arrow-icon-padding;
       text-decoration: none;
-      text-indent: $group-collapse-icon-text-indent;
     }
 
     .e-icon-grightarrow {
       font-size: $grid-group-right-arrow-icon-font-size;
       padding: $grid-group-right-arrow-icon-padding;
       text-decoration: none;
-      text-indent: $group-expand-icon-text-indent;
     }
 
     .e-recordplusexpand {
@@ -76721,7 +76738,7 @@ $grid-dropitems-count-margin-left: -4px !default;
 
   .e-gridheader .e-headercontent .e-reorderuparrow {
     @if $grid-skin == 'fluent' or $grid-skin == 'bootstrap5' {
-      margin-top: -9px;
+      margin-top: -2px;
     }
   }
 
@@ -80308,6 +80325,15 @@ $fe-drop-folder-bg-color: $primary !default;
     }
   }
 
+  @media (min-width: 360px) and (max-width: 500px) {
+    @if $skin-name == 'FluentUI' {
+      .e-bigger .e-filemanager .e-grid .e-checkbox-wrapper .e-frame {
+        position: relative;
+        right: 10px;
+      }
+    }
+  }
+  
   .e-content-placeholder.e-filemanager.e-placeholder-filemanager {
     height: 100%;
     width: 100%;
@@ -87164,12 +87190,12 @@ $bigger-column-menu-size: 35px !default;
       }
 
       .e-zero-spacing {
-        border-spacing: 0;
+        border-spacing: .25px;
       }
 
       .e-chart-row:first-child .e-chart-row-border {
         //border-width: 0;
-        border-top-color: transparent;
+        border-top: 0;
       }
 
       .e-chart-row {
@@ -87449,6 +87475,7 @@ $bigger-column-menu-size: 35px !default;
 
       .e-task-table {
         overflow: hidden;
+        border-collapse: separate;
       }
 
       .e-left-resize-gripper,
@@ -96049,7 +96076,19 @@ $pv-eye-icon-margin-top: 3px !default;
     height: 30px;
     min-height: 30px;
   }
-  
+  .e-bigger .e-pv-signature-dialog-height .e-pv-clearbtn{
+    float: left;
+    height: 49px;
+    min-height: 49px;
+  }
+  .e-bigger .e-pv-signature-dialog-height .e-pv-cancelbtn{
+    height: 49px;
+    min-height: 49px;
+  }
+  .e-bigger .e-pv-signature-dialog-height .e-pv-createbtn{
+    height: 49px;
+    min-height: 49px;
+  }
   
 
   .e-tbar-btn.e-control.e-btn.e-lib.e-icon-btn.e-pv-bold.e-pv-tbar-btn.e-tooltip.textprop-option-active,

package/SCSS-Themes/buttons/speed-dial/bootstrap-dark.scss

@@ -69,8 +69,8 @@ $sd-active-font-color: $grey-light-font !default;
 
 @include export-module('speed-dial-layout') {
   .e-speeddial-popup {
-    pointer-events: none;
     position: absolute;
+    z-index: 99999;
 
     &.e-speeddial-top {
       top: $sd-offset;

package/SCSS-Themes/buttons/speed-dial/bootstrap.scss

@@ -69,8 +69,8 @@ $sd-active-font-color: #000000 !default;
 
 @include export-module('speed-dial-layout') {
   .e-speeddial-popup {
-    pointer-events: none;
     position: absolute;
+    z-index: 99999;
 
     &.e-speeddial-top {
       top: $sd-offset;

package/SCSS-Themes/buttons/speed-dial/bootstrap4.scss

@@ -69,8 +69,8 @@ $sd-active-font-color: $secondary !default;
 
 @include export-module('speed-dial-layout') {
   .e-speeddial-popup {
-    pointer-events: none;
     position: absolute;
+    z-index: 99999;
 
     &.e-speeddial-top {
       top: $sd-offset;

package/SCSS-Themes/buttons/speed-dial/bootstrap5-dark.scss

@@ -70,8 +70,8 @@ $sd-active-font-color: $content-text-color-focus !default;
 
 @include export-module('speed-dial-layout') {
   .e-speeddial-popup {
-    pointer-events: none;
     position: absolute;
+    z-index: 99999;
 
     &.e-speeddial-top {
       top: $sd-offset;

package/SCSS-Themes/buttons/speed-dial/bootstrap5.scss

@@ -70,8 +70,8 @@ $sd-active-font-color: $content-text-color-focus !default;
 
 @include export-module('speed-dial-layout') {
   .e-speeddial-popup {
-    pointer-events: none;
     position: absolute;
+    z-index: 99999;
 
     &.e-speeddial-top {
       top: $sd-offset;

package/SCSS-Themes/buttons/speed-dial/fabric-dark.scss

@@ -69,8 +69,8 @@ $sd-active-font-color: $neutral-light-fontalt !default;
 
 @include export-module('speed-dial-layout') {
   .e-speeddial-popup {
-    pointer-events: none;
     position: absolute;
+    z-index: 99999;
 
     &.e-speeddial-top {
       top: $sd-offset;

package/SCSS-Themes/buttons/speed-dial/fabric.scss

@@ -69,8 +69,8 @@ $sd-active-font-color: $neutral-light-fontalt !default;
 
 @include export-module('speed-dial-layout') {
   .e-speeddial-popup {
-    pointer-events: none;
     position: absolute;
+    z-index: 99999;
 
     &.e-speeddial-top {
       top: $sd-offset;

package/SCSS-Themes/buttons/speed-dial/fluent-dark.scss

@@ -70,8 +70,8 @@ $sd-active-font-color: $secondary-text-color-pressed !default;
 
 @include export-module('speed-dial-layout') {
   .e-speeddial-popup {
-    pointer-events: none;
     position: absolute;
+    z-index: 99999;
 
     &.e-speeddial-top {
       top: $sd-offset;

package/SCSS-Themes/buttons/speed-dial/fluent.scss

@@ -70,8 +70,8 @@ $sd-active-font-color: $secondary-text-color-pressed !default;
 
 @include export-module('speed-dial-layout') {
   .e-speeddial-popup {
-    pointer-events: none;
     position: absolute;
+    z-index: 99999;
 
     &.e-speeddial-top {
       top: $sd-offset;

package/SCSS-Themes/buttons/speed-dial/highcontrast.scss

@@ -70,8 +70,8 @@ $sd-active-font-color: $selection-font !default;
 
 @include export-module('speed-dial-layout') {
   .e-speeddial-popup {
-    pointer-events: none;
     position: absolute;
+    z-index: 99999;
 
     &.e-speeddial-top {
       top: $sd-offset;

package/SCSS-Themes/buttons/speed-dial/material-dark.scss

@@ -69,8 +69,8 @@ $sd-active-font-color: $grey-dark-font !default;
 
 @include export-module('speed-dial-layout') {
   .e-speeddial-popup {
-    pointer-events: none;
     position: absolute;
+    z-index: 99999;
 
     &.e-speeddial-top {
       top: $sd-offset;

package/SCSS-Themes/buttons/speed-dial/material.scss

@@ -69,8 +69,8 @@ $sd-active-font-color: $base-font !default;
 
 @include export-module('speed-dial-layout') {
   .e-speeddial-popup {
-    pointer-events: none;
     position: absolute;
+    z-index: 99999;
 
     &.e-speeddial-top {
       top: $sd-offset;

package/SCSS-Themes/buttons/speed-dial/tailwind-dark.scss

@@ -70,8 +70,8 @@ $sd-active-font-color: $secondary-text-color !default;
 
 @include export-module('speed-dial-layout') {
   .e-speeddial-popup {
-    pointer-events: none;
     position: absolute;
+    z-index: 99999;
 
     &.e-speeddial-top {
       top: $sd-offset;

package/SCSS-Themes/buttons/speed-dial/tailwind.scss

@@ -70,8 +70,8 @@ $sd-active-font-color: $secondary-text-color !default;
 
 @include export-module('speed-dial-layout') {
   .e-speeddial-popup {
-    pointer-events: none;
     position: absolute;
+    z-index: 99999;
 
     &.e-speeddial-top {
       top: $sd-offset;

package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap-dark.scss

@@ -516,7 +516,7 @@ $ddt-remains-count-padding-top: 5.5px !default;
       position: absolute;
 
       .e-active .e-checkbox-wrapper {
-        .e-frame:not(.e-check) {
+        .e-frame:not(.e-check):not(.e-stop) {
           @if$ddt-skin-name == 'bootstrap5' {
             background-color: $ddt-readonly-input-bg-color;
           }
@@ -524,7 +524,7 @@ $ddt-remains-count-padding-top: 5.5px !default;
       }
 
       .e-checkbox-wrapper {
-        .e-frame:not(.e-check) {
+        .e-frame:not(.e-check):not(.e-stop) {
           @if$ddt-skin-name == 'bootstrap5' {
             background-color: transparent;
           }

package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap.scss

@@ -515,7 +515,7 @@ $ddt-remains-count-padding-top: 5.5px !default;
       position: absolute;
 
       .e-active .e-checkbox-wrapper {
-        .e-frame:not(.e-check) {
+        .e-frame:not(.e-check):not(.e-stop) {
           @if$ddt-skin-name == 'bootstrap5' {
             background-color: $ddt-readonly-input-bg-color;
           }
@@ -523,7 +523,7 @@ $ddt-remains-count-padding-top: 5.5px !default;
       }
 
       .e-checkbox-wrapper {
-        .e-frame:not(.e-check) {
+        .e-frame:not(.e-check):not(.e-stop) {
           @if$ddt-skin-name == 'bootstrap5' {
             background-color: transparent;
           }

package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap4.scss

@@ -516,7 +516,7 @@ $ddt-remains-count-padding-top: 4px !default;
       position: absolute;
 
       .e-active .e-checkbox-wrapper {
-        .e-frame:not(.e-check) {
+        .e-frame:not(.e-check):not(.e-stop) {
           @if$ddt-skin-name == 'bootstrap5' {
             background-color: $ddt-readonly-input-bg-color;
           }
@@ -524,7 +524,7 @@ $ddt-remains-count-padding-top: 4px !default;
       }
 
       .e-checkbox-wrapper {
-        .e-frame:not(.e-check) {
+        .e-frame:not(.e-check):not(.e-stop) {
           @if$ddt-skin-name == 'bootstrap5' {
             background-color: transparent;
           }

package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap5-dark.scss

@@ -504,7 +504,7 @@ $ddt-readonly-input-bg-color: $content-bg-color !default;
       position: absolute;
 
       .e-active .e-checkbox-wrapper {
-        .e-frame:not(.e-check) {
+        .e-frame:not(.e-check):not(.e-stop) {
           @if$ddt-skin-name == 'bootstrap5' {
             background-color: $ddt-readonly-input-bg-color;
           }
@@ -512,7 +512,7 @@ $ddt-readonly-input-bg-color: $content-bg-color !default;
       }
 
       .e-checkbox-wrapper {
-        .e-frame:not(.e-check) {
+        .e-frame:not(.e-check):not(.e-stop) {
           @if$ddt-skin-name == 'bootstrap5' {
             background-color: transparent;
           }

package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap5.scss

@@ -504,7 +504,7 @@ $ddt-readonly-input-bg-color: $content-bg-color !default;
       position: absolute;
 
       .e-active .e-checkbox-wrapper {
-        .e-frame:not(.e-check) {
+        .e-frame:not(.e-check):not(.e-stop) {
           @if$ddt-skin-name == 'bootstrap5' {
             background-color: $ddt-readonly-input-bg-color;
           }
@@ -512,7 +512,7 @@ $ddt-readonly-input-bg-color: $content-bg-color !default;
       }
 
       .e-checkbox-wrapper {
-        .e-frame:not(.e-check) {
+        .e-frame:not(.e-check):not(.e-stop) {
           @if$ddt-skin-name == 'bootstrap5' {
             background-color: transparent;
           }

package/SCSS-Themes/dropdowns/drop-down-tree/fabric-dark.scss

@@ -516,7 +516,7 @@ $ddt-remains-count-padding-top: 6px !default;
       position: absolute;
 
       .e-active .e-checkbox-wrapper {
-        .e-frame:not(.e-check) {
+        .e-frame:not(.e-check):not(.e-stop) {
           @if$ddt-skin-name == 'bootstrap5' {
             background-color: $ddt-readonly-input-bg-color;
           }
@@ -524,7 +524,7 @@ $ddt-remains-count-padding-top: 6px !default;
       }
 
       .e-checkbox-wrapper {
-        .e-frame:not(.e-check) {
+        .e-frame:not(.e-check):not(.e-stop) {
           @if$ddt-skin-name == 'bootstrap5' {
             background-color: transparent;
           }

package/SCSS-Themes/dropdowns/drop-down-tree/fabric.scss

@@ -516,7 +516,7 @@ $ddt-remains-count-padding-top: 6px !default;
       position: absolute;
 
       .e-active .e-checkbox-wrapper {
-        .e-frame:not(.e-check) {
+        .e-frame:not(.e-check):not(.e-stop) {
           @if$ddt-skin-name == 'bootstrap5' {
             background-color: $ddt-readonly-input-bg-color;
           }
@@ -524,7 +524,7 @@ $ddt-remains-count-padding-top: 6px !default;
       }
 
       .e-checkbox-wrapper {
-        .e-frame:not(.e-check) {
+        .e-frame:not(.e-check):not(.e-stop) {
           @if$ddt-skin-name == 'bootstrap5' {
             background-color: transparent;
           }