@syncfusion/ej2-navigations 28.2.12 → 29.1.34

package/styles/toolbar/bootstrap5.css

@@ -637,7 +637,7 @@
   color: #212529;
 }
 .e-toolbar .e-toolbar-item .e-tbar-btn.e-flat.e-active {
-  background: #565e64;
+  background: rgb(86.4, 93.6, 100);
   -webkit-box-shadow: none;
           box-shadow: none;
 }
@@ -645,18 +645,18 @@
   color: #fff;
 }
 .e-toolbar .e-toolbar-item .e-tbar-btn.e-flat.e-active:focus {
-  -webkit-box-shadow: 0 0 0 4px rgba(130, 138, 145, 0.5);
-          box-shadow: 0 0 0 4px rgba(130, 138, 145, 0.5);
+  -webkit-box-shadow: 0 0 0 4px rgba(130.05, 137.7, 144.5, 0.5);
+          box-shadow: 0 0 0 4px rgba(130.05, 137.7, 144.5, 0.5);
 }
 .e-toolbar .e-toolbar-item .e-tbar-btn:focus {
-  background: #5c636a;
+  background: rgb(91.8, 99.45, 106.25);
   border-radius: 4px;
   color: #6c757d;
   border-color: #6c757d;
   border-style: solid;
   border-width: 0;
-  -webkit-box-shadow: 0 0 0 4px rgba(130, 138, 145, 0.5);
-          box-shadow: 0 0 0 4px rgba(130, 138, 145, 0.5);
+  -webkit-box-shadow: 0 0 0 4px rgba(130.05, 137.7, 144.5, 0.5);
+          box-shadow: 0 0 0 4px rgba(130.05, 137.7, 144.5, 0.5);
 }
 .e-toolbar .e-toolbar-item .e-tbar-btn:focus .e-icons {
   color: #fff;
@@ -666,7 +666,7 @@
   color: #fff;
 }
 .e-toolbar .e-toolbar-item .e-tbar-btn:hover {
-  background: #5c636a;
+  background: rgb(91.8, 99.45, 106.25);
   border-color: #6c757d;
   border-style: solid;
   border-width: 0;
@@ -687,7 +687,7 @@
   color: #fff;
 }
 .e-toolbar .e-toolbar-item .e-tbar-btn:active {
-  background: #565e64;
+  background: rgb(86.4, 93.6, 100);
   border-color: #dee2e6;
   border-style: solid;
   border-width: 0;
@@ -753,7 +753,7 @@
   content: "";
 }
 .e-toolbar .e-hor-nav:hover {
-  background: #5c636a;
+  background: rgb(91.8, 99.45, 106.25);
   border-left: 0;
   color: #fff;
 }
@@ -766,13 +766,13 @@
   border-width: 0;
 }
 .e-toolbar .e-hor-nav:hover:active {
-  background: #5c636a;
+  background: rgb(91.8, 99.45, 106.25);
   border-color: #dee2e6;
   border-style: solid;
   border-width: 0;
 }
 .e-toolbar .e-hor-nav:focus {
-  background: #5c636a;
+  background: rgb(91.8, 99.45, 106.25);
   color: #fff;
   border-color: #6c757d;
   border-style: solid;
@@ -783,16 +783,16 @@
 }
 .e-toolbar.e-toolpop .e-hor-nav.e-nav-active,
 .e-toolbar.e-toolpop .e-hor-nav.e-nav-active:not(.e-expended-nav) {
-  background: #5c636a;
+  background: rgb(91.8, 99.45, 106.25);
   -webkit-box-shadow: none;
           box-shadow: none;
-  border-color: #5c636a;
+  border-color: rgb(91.8, 99.45, 106.25);
   border-style: solid;
   border-width: 0;
 }
 .e-toolbar.e-toolpop .e-hor-nav.e-nav-active:focus,
 .e-toolbar.e-toolpop .e-hor-nav.e-nav-active:not(.e-expended-nav):focus {
-  border-color: #5c636a;
+  border-color: rgb(91.8, 99.45, 106.25);
   border-style: solid;
   border-width: 0;
 }
@@ -814,7 +814,7 @@
   background: transparent;
 }
 .e-toolbar .e-toolbar-pop .e-toolbar-item .e-tbar-btn:hover {
-  background: #5c636a;
+  background: rgb(91.8, 99.45, 106.25);
   -webkit-box-shadow: none;
           box-shadow: none;
   border-color: #6c757d;
@@ -822,7 +822,7 @@
   border-width: 0;
 }
 .e-toolbar .e-toolbar-pop .e-toolbar-item .e-tbar-btn:active {
-  background: #565e64;
+  background: rgb(86.4, 93.6, 100);
   -webkit-box-shadow: none;
           box-shadow: none;
   border-color: #dee2e6;
@@ -830,7 +830,7 @@
   border-width: 0;
 }
 .e-toolbar .e-toolbar-pop .e-toolbar-item .e-tbar-btn:focus {
-  background: #5c636a;
+  background: rgb(91.8, 99.45, 106.25);
   border-color: #6c757d;
   border-style: solid;
   border-width: 0;
@@ -850,23 +850,23 @@
   border: none;
 }
 .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:focus {
-  background: #5c636a;
+  background: rgb(91.8, 99.45, 106.25);
   border-radius: 4px;
   border-color: #6c757d;
   border-style: solid;
   border-width: 0;
-  -webkit-box-shadow: 0 0 0 4px rgba(130, 138, 145, 0.5);
-          box-shadow: 0 0 0 4px rgba(130, 138, 145, 0.5);
+  -webkit-box-shadow: 0 0 0 4px rgba(130.05, 137.7, 144.5, 0.5);
+          box-shadow: 0 0 0 4px rgba(130.05, 137.7, 144.5, 0.5);
 }
 .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:hover {
-  background: #5c636a;
+  background: rgb(91.8, 99.45, 106.25);
   border-radius: 4px;
   border-color: #6c757d;
   border-style: solid;
   border-width: 0;
 }
 .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:active {
-  background: #565e64;
+  background: rgb(86.4, 93.6, 100);
   border-radius: 4px;
   -webkit-box-shadow: none;
           box-shadow: none;
@@ -890,7 +890,7 @@
   border-width: 0 0 0 0;
 }
 .e-toolbar.e-rtl .e-hor-nav:not(.e-nav-active):hover {
-  background: #5c636a;
+  background: rgb(91.8, 99.45, 106.25);
   color: #6c757d;
   border: solid #dee2e6;
   border-width: 0 0 0 0;

package/styles/toolbar/fabric.css

@@ -660,8 +660,8 @@
   color: #333;
 }
 .e-toolbar .e-toolbar-item .e-tbar-btn:active {
-  background: #d1ebff;
-  border-color: #d1ebff;
+  background: rgb(208.9, 234.7504672897, 255);
+  border-color: rgb(208.9, 234.7504672897, 255);
   border-style: solid;
   border-width: 0;
   border-radius: 0;
@@ -756,16 +756,16 @@
 }
 .e-toolbar.e-toolpop .e-hor-nav.e-nav-active,
 .e-toolbar.e-toolpop .e-hor-nav.e-nav-active:not(.e-expended-nav) {
-  background: #d1ebff;
+  background: rgb(208.9, 234.7504672897, 255);
   -webkit-box-shadow: none;
           box-shadow: none;
-  border-color: #d1ebff;
+  border-color: rgb(208.9, 234.7504672897, 255);
   border-style: solid;
   border-width: 0 0 0 1px;
 }
 .e-toolbar.e-toolpop .e-hor-nav.e-nav-active:focus,
 .e-toolbar.e-toolpop .e-hor-nav.e-nav-active:not(.e-expended-nav):focus {
-  border-color: #d1ebff;
+  border-color: rgb(208.9, 234.7504672897, 255);
   border-style: solid;
   border-width: 0 0 0 1px;
 }
@@ -795,10 +795,10 @@
   border-width: 0;
 }
 .e-toolbar .e-toolbar-pop .e-toolbar-item .e-tbar-btn:active {
-  background: #d1ebff;
+  background: rgb(208.9, 234.7504672897, 255);
   -webkit-box-shadow: none;
           box-shadow: none;
-  border-color: #d1ebff;
+  border-color: rgb(208.9, 234.7504672897, 255);
   border-style: solid;
   border-width: 0;
 }
@@ -839,11 +839,11 @@
   border-width: 0;
 }
 .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:active {
-  background: #d1ebff;
+  background: rgb(208.9, 234.7504672897, 255);
   border-radius: 0;
   -webkit-box-shadow: none;
           box-shadow: none;
-  border-color: #d1ebff;
+  border-color: rgb(208.9, 234.7504672897, 255);
   border-style: solid;
   border-width: 0;
 }

package/styles/treeview/_bigger.scss

@@ -174,7 +174,7 @@
 
     .e-list-text {
       line-height: $treeview-big-text-height;
-      @if $skin-name != 'bootstrap4' {
+      @if $skin-name != 'bootstrap4' or $skin-name != 'tailwind3' {
         min-height: $treeview-big-text-height;
       }
       @else if $skin-name == 'bootstrap4' {
@@ -182,6 +182,7 @@
       }
       @if $skin-name == 'tailwind3' {
         padding: $treeview-big-text-padding;
+        min-height: $treeview-big-item-height;
       }
 
       .e-input-group {
@@ -394,6 +395,9 @@
         @if $skin-name == 'bootstrap4' {
           padding: $treeview-big-drag-icon-padding;
         }
+        @else if $skin-name == 'bootstrap5.3' {
+          padding: $treeview-drag-icon-padding;
+        }
       }
 
       .e-list-text {

package/styles/treeview/_bootstrap4-definition.scss

@@ -1,3 +1,5 @@
+@use 'sass:color';
+
 //default
 /* stylelint-disable */
 $treeview-font-size: 14px !default;
@@ -16,14 +18,14 @@ $treeview-item-active-bg: $primary !default;
 $treeview-icon-active-color: $primary-font !default;
 $treeview-text-active-color: $primary-font !default;
 $treeview-item-active-border-color: $primary !default;
-$treeview-item-hover-bg: darken($gray-100,2%) !default;
+$treeview-item-hover-bg: color.adjust($gray-100, $lightness: -2%) !default;
 $treeview-icon-hover-color: $gray-700 !default;
 $treeview-text-hover-color: $gray-900 !default;
-$treeview-item-hover-border-color: darken( $gray-100, 2%)!default;
-$treeview-item-active-hover-bg: darken($primary,7.5%)!default;
+$treeview-item-hover-border-color: color.adjust( $gray-100, $lightness: -2%)!default;
+$treeview-item-active-hover-bg: color.adjust($primary, $lightness: -7.5%)!default;
 $treeview-icon-active-hover-color: $primary-font !default;
 $treeview-text-active-hover-color: $primary-font !default;
-$treeview-item-active-hover-border-color: darken($primary,7.5%) !default;
+$treeview-item-active-hover-border-color: color.adjust($primary, $lightness: -7.5%) !default;
 $treeview-text-disable-color:  $gray-600 !default;
 $treeview-icon-disable-color: $gray-600  !default;
 $treeview-drag-line-bg: $primary !default;

package/styles/treeview/_bootstrap5-definition.scss

@@ -1,3 +1,5 @@
+@use 'sass:color';
+
 /*! TreeView's bootstrap5 theme wise override definitions and variables */
 /* stylelint-disable */
 $treeview-font-size: $text-sm !default;
@@ -13,7 +15,7 @@ $treeview-rtl-child-ul-padding: 0 20px 0 0 !default;
 $treeview-text-wrap-padding: 0 0 0 20px !default;
 $treeview-rtl-text-wrap-padding: 0 20px 0 0 !default;
 $treeview-icon-size: 20px !default;
-$treeview-icon-margin: 0 4px 0 -25px !default;
+$treeview-icon-margin: 0 4px 0 -24px !default;
 $treeview-rtl-icon-margin: 0 -20px 0 0 !default;
 $treeview-icon-padding: 0px !default;
 $treeview-text-padding: 0 8px !default;
@@ -99,7 +101,7 @@ $treeview-item-hover-bg: $content-bg-color-hover !default;
 $treeview-icon-hover-color: $icon-color-hover !default;
 $treeview-text-hover-color: $content-text-color-hover !default;
 $treeview-item-hover-border-color: $content-bg-color-hover !default;
-$treeview-item-active-hover-bg: darken($treeview-item-active-bg, 5%) !default;
+$treeview-item-active-hover-bg: color.adjust($treeview-item-active-bg, $lightness: -5%) !default;
 $treeview-icon-active-hover-color: $content-text-color-selected !default;
 $treeview-text-active-hover-color: $content-text-color-selected !default;
 $treeview-item-active-hover-border-color: $content-bg-color-selected !default;

package/styles/treeview/_bootstrap5.3-definition.scss

@@ -13,7 +13,7 @@ $treeview-rtl-child-ul-padding: 0 20px 0 0 !default;
 $treeview-text-wrap-padding: 0 0 0 20px !default;
 $treeview-rtl-text-wrap-padding: 0 20px 0 0 !default;
 $treeview-icon-size: 20px !default;
-$treeview-icon-margin: 0 4px 0 -25px !default;
+$treeview-icon-margin: 0 4px 0 -24px !default;
 $treeview-rtl-icon-margin: 0 -20px 0 0 !default;
 $treeview-icon-padding: 0px !default;
 $treeview-text-padding: 0 8px !default;

package/styles/treeview/_fluent-definition.scss

@@ -1,3 +1,5 @@
+@use 'sass:color';
+
 /*! TreeView's bootstrap5 theme wise override definitions and variables */
 /* stylelint-disable */
 $treeview-font-size: $text-sm !default;
@@ -99,7 +101,7 @@ $treeview-item-hover-bg: $content-bg-color-hover !default;
 $treeview-icon-hover-color: $icon-color-hover !default;
 $treeview-text-hover-color: $content-text-color-hover !default;
 $treeview-item-hover-border-color: $content-bg-color-hover !default;
-$treeview-item-active-hover-bg: darken($treeview-item-active-bg, 5%) !default;
+$treeview-item-active-hover-bg: color.adjust($treeview-item-active-bg, $lightness: -5%) !default;
 $treeview-icon-active-hover-color: $content-text-color-selected !default;
 $treeview-text-active-hover-color: $content-text-color-selected !default;
 $treeview-item-active-hover-border-color: $content-bg-color-selected !default;

package/styles/treeview/_layout.scss

@@ -261,6 +261,10 @@
         width: calc(100% - 8px);
         margin-left: 4px;
       }
+
+      @supports (-webkit-overflow-scrolling: touch) {
+        z-index: -1;
+      }
     }
 
     .e-checkbox-wrapper {
@@ -292,7 +296,7 @@
       display: inline-block;
       line-height: $treeview-text-height;
       margin: $treeview-text-margin;
-      @if $skin-name == 'Material3' {
+      @if $skin-name == 'Material3' or $skin-name == 'tailwind3' {
         min-height: $treeview-item-height;
       }
       @else if $skin-name != 'bootstrap4' {
@@ -570,7 +574,7 @@
               margin: $treeview-drag-icon-margin;
             }
           }
-          @if ($skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' or $skin-name == 'FluentUI') {
+          @if ($skin-name == 'bootstrap5' or $skin-name == 'FluentUI') {
             box-sizing: content-box;
             padding-left: $treeview-drag-icon-padding;
           }

package/styles/treeview/_tailwind-definition.scss

@@ -1,3 +1,5 @@
+@use 'sass:color';
+
 /*! TreeView's tailwind theme wise override definitions and variables */
 /* stylelint-disable */
 $treeview-font-size: $text-sm !default;
@@ -106,7 +108,7 @@ $treeview-item-hover-bg: $content-bg-color-hover !default;
 $treeview-icon-hover-color: $icon-color-hover !default;
 $treeview-text-hover-color: $content-text-color-hover !default;
 $treeview-item-hover-border-color: $content-bg-color-hover !default;
-$treeview-item-active-hover-bg: darken($content-bg-color-hover, 10%) !default;
+$treeview-item-active-hover-bg: color.adjust($content-bg-color-hover, $lightness: -10%) !default;
 $treeview-icon-active-hover-color: $treeview-icon-hover-color !default;
 $treeview-text-active-hover-color: $treeview-text-hover-color !default;
 $treeview-item-active-hover-border-color: $treeview-item-hover-border-color !default;

package/styles/treeview/_theme.scss

@@ -1,3 +1,5 @@
+@use 'sass:color';
+
 /* stylelint-disable property-no-vendor-prefix */
 @mixin sibling-theme($left, $right) {
   @if $skin-name == 'material' {
@@ -16,7 +18,7 @@
 
 @mixin active-hover-theme {
   @if $theme-name =='fluentui-dark' {
-    background-color: lighten($treeview-item-active-bg, 5%);
+    background-color: color.adjust($treeview-item-active-bg, $lightness: 5%);
   }
   @else {
     @if ($skin-name == 'bootstrap5.3' or $skin-name == 'tailwind3') {

package/styles/treeview/bds.css

@@ -319,6 +319,11 @@
   position: absolute;
   width: 100%;
 }
+@supports (-webkit-overflow-scrolling: touch) {
+  .e-treeview .e-fullrow {
+    z-index: -1;
+  }
+}
 .e-treeview .e-checkbox-wrapper {
   margin: 0 0 0 6px;
   pointer-events: all;

package/styles/treeview/bootstrap-dark.css

@@ -166,6 +166,11 @@
   position: absolute;
   width: 100%;
 }
+@supports (-webkit-overflow-scrolling: touch) {
+  .e-treeview .e-fullrow {
+    z-index: -1;
+  }
+}
 .e-treeview .e-checkbox-wrapper {
   margin: 0 0 0 5px;
   pointer-events: all;

package/styles/treeview/bootstrap.css

@@ -167,6 +167,11 @@
   position: absolute;
   width: 100%;
 }
+@supports (-webkit-overflow-scrolling: touch) {
+  .e-treeview .e-fullrow {
+    z-index: -1;
+  }
+}
 .e-treeview .e-checkbox-wrapper {
   margin: 0 0 0 5px;
   pointer-events: all;

package/styles/treeview/bootstrap4.css

@@ -166,6 +166,11 @@
   position: absolute;
   width: 100%;
 }
+@supports (-webkit-overflow-scrolling: touch) {
+  .e-treeview .e-fullrow {
+    z-index: -1;
+  }
+}
 .e-treeview .e-checkbox-wrapper {
   margin: 0 0 0 5px;
   pointer-events: all;
@@ -493,8 +498,8 @@
   background: transparent;
 }
 .e-treeview .e-list-item.e-hover > .e-fullrow, .e-treeview .e-list-item.e-node-focus > .e-fullrow {
-  background-color: #f2f4f6;
-  border-color: #f2f4f6;
+  background-color: rgb(242.05, 243.9, 245.75);
+  border-color: rgb(242.05, 243.9, 245.75);
 }
 .e-treeview .e-list-item.e-hover > .e-text-content, .e-treeview .e-list-item.e-node-focus > .e-text-content {
   color: #212529;
@@ -540,8 +545,8 @@
   color: #007bff;
 }
 .e-treeview .e-list-item.e-active.e-hover > .e-fullrow, .e-treeview .e-list-item.e-active.e-node-focus > .e-fullrow {
-  background-color: #0069d9;
-  border-color: #0069d9;
+  background-color: rgb(0, 104.55, 216.75);
+  border-color: rgb(0, 104.55, 216.75);
 }
 .e-treeview .e-list-item.e-active.e-hover > .e-text-content, .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content {
   color: #fff;
@@ -600,16 +605,16 @@
   border-top-color: transparent;
 }
 .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content, .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-node-focus > .e-text-content {
-  background-color: #f2f4f6;
-  border-color: #f2f4f6;
+  background-color: rgb(242.05, 243.9, 245.75);
+  border-color: rgb(242.05, 243.9, 245.75);
 }
 .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active > .e-text-content {
   background-color: #007bff;
   border-color: #007bff;
 }
 .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content, .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-node-focus > .e-text-content {
-  background-color: #0069d9;
-  border-color: #0069d9;
+  background-color: rgb(0, 104.55, 216.75);
+  border-color: rgb(0, 104.55, 216.75);
 }
 .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-active > .e-text-content, .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content, .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-node-focus > .e-text-content {
   background-color: transparent;
@@ -715,7 +720,7 @@
 .e-bigger .e-treeview .e-list-text,
 .e-treeview.e-bigger .e-list-text {
   line-height: 36px;
-  min-height: 38px;
+  min-height: 36px;
 }
 .e-bigger .e-treeview .e-list-text .e-input-group,
 .e-treeview.e-bigger .e-list-text .e-input-group {

package/styles/treeview/bootstrap5-dark.css

@@ -167,6 +167,11 @@
   position: absolute;
   width: 100%;
 }
+@supports (-webkit-overflow-scrolling: touch) {
+  .e-treeview .e-fullrow {
+    z-index: -1;
+  }
+}
 .e-treeview .e-checkbox-wrapper {
   margin: 0 0 0 12px;
   pointer-events: all;
@@ -234,7 +239,7 @@
 .e-treeview .e-icon-expandable {
   display: inline-block;
   height: 20px;
-  margin: 0 4px 0 -25px;
+  margin: 0 4px 0 -24px;
   vertical-align: middle;
   width: 20px;
 }
@@ -493,8 +498,8 @@
   background: transparent;
 }
 .e-treeview .e-list-item.e-hover > .e-fullrow, .e-treeview .e-list-item.e-node-focus > .e-fullrow {
-  background-color: #31373d;
-  border-color: #31373d;
+  background-color: rgb(48.9202702703, 54.85, 60.7797297297);
+  border-color: rgb(48.9202702703, 54.85, 60.7797297297);
 }
 .e-treeview .e-list-item.e-hover > .e-text-content, .e-treeview .e-list-item.e-node-focus > .e-text-content {
   color: #fff;
@@ -541,7 +546,7 @@
   border-color: #fff;
 }
 .e-treeview .e-list-item.e-active.e-hover > .e-fullrow, .e-treeview .e-list-item.e-active.e-node-focus > .e-fullrow {
-  background-color: #0262ef;
+  background-color: rgb(1.9713114754, 97.5799180328, 238.5286885246);
   border-color: #0d6efd;
 }
 .e-treeview .e-list-item.e-active.e-hover > .e-text-content, .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content {
@@ -590,28 +595,28 @@
   background: #0d6efd;
 }
 .e-treeview .e-popup .e-content {
-  background-color: #31373d;
-  border-color: #31373d;
+  background-color: rgb(48.9202702703, 54.85, 60.7797297297);
+  border-color: rgb(48.9202702703, 54.85, 60.7797297297);
 }
 .e-treeview .e-popup.e-select .e-icons {
-  border-color: #31373d;
+  border-color: rgb(48.9202702703, 54.85, 60.7797297297);
 }
 .e-treeview .e-popup .e-downtail::before {
-  border-top-color: #31373d;
+  border-top-color: rgb(48.9202702703, 54.85, 60.7797297297);
 }
 .e-treeview .e-popup .e-downtail::after {
-  border-top-color: #31373d;
+  border-top-color: rgb(48.9202702703, 54.85, 60.7797297297);
 }
 .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content, .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-node-focus > .e-text-content {
-  background-color: #31373d;
-  border-color: #31373d;
+  background-color: rgb(48.9202702703, 54.85, 60.7797297297);
+  border-color: rgb(48.9202702703, 54.85, 60.7797297297);
 }
 .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active > .e-text-content {
   background-color: #0d6efd;
   border-color: #0d6efd;
 }
 .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content, .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-node-focus > .e-text-content {
-  background-color: #0262ef;
+  background-color: rgb(1.9713114754, 97.5799180328, 238.5286885246);
   border-color: #0d6efd;
 }
 .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-active > .e-text-content, .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content, .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-node-focus > .e-text-content {

package/styles/treeview/bootstrap5.3.css

@@ -171,6 +171,11 @@
   position: absolute;
   width: 100%;
 }
+@supports (-webkit-overflow-scrolling: touch) {
+  .e-treeview .e-fullrow {
+    z-index: -1;
+  }
+}
 .e-treeview .e-checkbox-wrapper {
   margin: 0 0 0 8px;
   pointer-events: all;
@@ -238,7 +243,7 @@
 .e-treeview .e-icon-expandable {
   display: inline-block;
   height: 20px;
-  margin: 0 4px 0 -25px;
+  margin: 0 4px 0 -24px;
   vertical-align: middle;
   width: 20px;
 }
@@ -358,12 +363,6 @@
 .e-treeview.e-drag-item .e-text-content .e-list-text {
   padding: 0 4px 8px 10px 12px;
 }
-.e-treeview.e-drag-item .e-icon-collapsible,
-.e-treeview.e-drag-item .e-icon-expandable {
-  -webkit-box-sizing: content-box;
-          box-sizing: content-box;
-  padding-left: 4px 8px 10px 12px;
-}
 .e-treeview.e-drag-item .e-icon-collapsible::before,
 .e-treeview.e-drag-item .e-icon-expandable::before {
   font-size: 14px;
@@ -790,4 +789,10 @@
 .e-treeview.e-bigger .e-icon-collapsible::before,
 .e-treeview.e-bigger .e-icon-expandable::before {
   font-size: 24px;
+}
+.e-bigger .e-treeview.e-drag-item .e-icon-collapsible,
+.e-bigger .e-treeview.e-drag-item .e-icon-expandable,
+.e-treeview.e-bigger.e-drag-item .e-icon-collapsible,
+.e-treeview.e-bigger.e-drag-item .e-icon-expandable {
+  padding: 4px 8px 10px 12px;
 }

package/styles/treeview/bootstrap5.css

@@ -167,6 +167,11 @@
   position: absolute;
   width: 100%;
 }
+@supports (-webkit-overflow-scrolling: touch) {
+  .e-treeview .e-fullrow {
+    z-index: -1;
+  }
+}
 .e-treeview .e-checkbox-wrapper {
   margin: 0 0 0 12px;
   pointer-events: all;
@@ -234,7 +239,7 @@
 .e-treeview .e-icon-expandable {
   display: inline-block;
   height: 20px;
-  margin: 0 4px 0 -25px;
+  margin: 0 4px 0 -24px;
   vertical-align: middle;
   width: 20px;
 }
@@ -541,7 +546,7 @@
   border-color: #fff;
 }
 .e-treeview .e-list-item.e-active.e-hover > .e-fullrow, .e-treeview .e-list-item.e-active.e-node-focus > .e-fullrow {
-  background-color: #0262ef;
+  background-color: rgb(1.9713114754, 97.5799180328, 238.5286885246);
   border-color: #0d6efd;
 }
 .e-treeview .e-list-item.e-active.e-hover > .e-text-content, .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content {
@@ -611,7 +616,7 @@
   border-color: #0d6efd;
 }
 .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content, .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-node-focus > .e-text-content {
-  background-color: #0262ef;
+  background-color: rgb(1.9713114754, 97.5799180328, 238.5286885246);
   border-color: #0d6efd;
 }
 .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-active > .e-text-content, .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content, .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-node-focus > .e-text-content {

package/styles/treeview/fabric-dark.css

@@ -166,6 +166,11 @@
   position: absolute;
   width: 100%;
 }
+@supports (-webkit-overflow-scrolling: touch) {
+  .e-treeview .e-fullrow {
+    z-index: -1;
+  }
+}
 .e-treeview .e-checkbox-wrapper {
   margin: 0 0 0 5px;
   pointer-events: all;