@syncfusion/blazor-themes 31.1.22 → 31.2.2

package/SCSS-Themes/fabric.scss

@@ -29919,7 +29919,7 @@ $cbox-checked-ripple-bgcolo: rgba(0, 0, 0, .3) !default;
         bottom: $cbox-ripple-size;
         height: $cbox-ripple-height;
         left: $cbox-ripple-size;
-        pointer-events: none;
+        pointer-events: auto;
         position: absolute;
         right: $cbox-ripple-size;
         top: $cbox-ripple-size;
@@ -30109,6 +30109,10 @@ $cbox-checked-ripple-bgcolo: rgba(0, 0, 0, .3) !default;
     pointer-events: none;
   }
 
+  .e-overlay .e-checkbox-wrapper .e-ripple-container {
+    pointer-events: none;
+  }
+
   .e-small .e-checkbox-wrapper,
   .e-small.e-checkbox-wrapper,
   .e-small .e-css.e-checkbox-wrapper,
@@ -67629,7 +67633,7 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
       margin-top: $ddl-closer-margin-top-bigger;
     }
     @if $ddl-multiselect-skin-name == 'fluent2' {
-      margin-top: -2.5em;
+      margin-top: -32px;
     }
     @if $ddl-multiselect-skin-name == 'FluentUI' {
       margin-top: $ddl-bigger-clear-margin-top;
@@ -67640,7 +67644,7 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
     @if $ddl-multiselect-skin-name == 'bootstrap5' or $ddl-multiselect-skin-name == 'bootstrap5.3' {
       margin-top: -2.15em;
     }
-    @if $ddl-multiselect-skin-name == 'highcontrast' or $ddl-multiselect-skin-name == 'fabric' {
+    @if $ddl-multiselect-skin-name == 'fabric' {
       margin-top: -3.2em;
     }
     @if $ddl-multiselect-skin-name == 'tailwind' {
@@ -69407,7 +69411,7 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
   @if $skin-name == 'bootstrap4' {
     .e-bigger .e-input-group.e-multiselect.e-control-wrapper .e-input-group-icon.e-ddl-icon::before,
     .e-bigger.e-input-group.e-multiselect.e-control-wrapper .e-input-group-icon.e-ddl-icon::before {
-      font-size: 14px;
+      font-size: 16px;
     }
     .e-small.e-bigger .e-input-group.e-multiselect.e-control-wrapper .e-input-group-icon.e-ddl-icon::before,
     .e-small.e-bigger.e-input-group.e-multiselect.e-control-wrapper .e-input-group-icon.e-ddl-icon::before {
@@ -69456,7 +69460,7 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
   @if $skin-name == 'FluentUI' {
     .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper.e-down-icon .e-clear-icon,
     .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper.e-down-icon .e-clear-icon {
-      margin-top: -1.6em;
+      margin-top: -24px;
     }
   }
   @if $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
@@ -88235,7 +88239,7 @@ $grid-checkmark-color: $theme-primary-font !default;
       line-height: normal;
     }
   }
-  .e-grid.sf-grid.e-grid-min-height .e-virtualtable {
+  .e-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) {
     /* stylelint-disable declaration-no-important */
     .e-table {
       border-spacing: 0 !important;
@@ -88249,6 +88253,19 @@ $grid-checkmark-color: $theme-primary-font !default;
 }
 /* stylelint-enable function-url-quotes */
 
+/* Apply styles for Safari on macOS desktop and other Apple devices */
+/* stylelint-disable function-url-quotes */
+@supports (font: -apple-system-body) {
+  .e-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) {
+
+    /* stylelint-disable declaration-no-important */
+    .e-table {
+      border-spacing: 0 !important;
+    }
+  }
+}
+/* stylelint-enable function-url-quotes */
+
 
 @mixin background-color-styles($grid-skin, $bg, $bgcolor) {
   @if $grid-skin == 'material3' {
@@ -129670,6 +129687,8 @@ $qrybldr-drag-grp-big-icon-pad: 10px 10px 10px 5px !default;
 $qryblr-drag-icon-color: $neutral-light-font !default;
 $primary: $theme-primary !default;
 $primary-light: $theme-lighter !default;
+$spinner-border-light-color: $primary-light !default;
+$spinner-border-color: $primary !default;
 
 @mixin fluent2-small-round-btn {
   @if $theme-name == 'fluent2' {
@@ -130753,8 +130772,8 @@ $primary-light: $theme-lighter !default;
   transform: translateX(-50%);
   width: 16px;
   height: 16px;
-  border: 2px solid $primary-light;
-  border-top: 2px solid $primary;
+  border: 2px solid $spinner-border-light-color;
+  border-top: 2px solid $spinner-border-color;
   border-radius: 50%;
   animation: spin 1s linear infinite;
 }
@@ -144151,7 +144170,7 @@ $timeline-item-disabled-color: $neutral-tertiary !default;
     height: inherit;
     width: 100%;
 
-    [class ^= 'e-dot ']::before,
+    .e-dot:not([class *= ' e-dot']):not([class = 'e-dot'])::before,
     .e-dot-item,
     .e-dot {
       display: flex;
@@ -144159,7 +144178,7 @@ $timeline-item-disabled-color: $neutral-tertiary !default;
       justify-content: center;
     }
 
-    [class ^= 'e-dot ']::before {
+    .e-dot:not([class *= ' e-dot']):not([class = 'e-dot'])::before {
       min-width: $timeline-dot-icon-size;
       min-height: $timeline-dot-icon-size;
       border-radius: var(--dot-radius);
@@ -144466,7 +144485,7 @@ $timeline-item-disabled-color: $neutral-tertiary !default;
 @include export-module('timeline-bigger') {
   .e-bigger.e-timeline,
   .e-bigger .e-timeline {
-    [class ^= 'e-dot ']::before {
+    .e-dot:not([class *= ' e-dot']):not([class = 'e-dot'])::before {
       min-width: $timeline-bigger-dot-icon-size;
       min-height: $timeline-bigger-dot-icon-size;
       font-size: $timeline-bigger-dot-font-size;

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

@@ -21036,7 +21036,7 @@ $cbox-icon-color: $icon-color !default;
         bottom: $cbox-ripple-size;
         height: $cbox-ripple-height;
         left: $cbox-ripple-size;
-        pointer-events: none;
+        pointer-events: auto;
         position: absolute;
         right: $cbox-ripple-size;
         top: $cbox-ripple-size;
@@ -21226,6 +21226,10 @@ $cbox-icon-color: $icon-color !default;
     pointer-events: none;
   }
 
+  .e-overlay .e-checkbox-wrapper .e-ripple-container {
+    pointer-events: none;
+  }
+
   .e-small .e-checkbox-wrapper,
   .e-small.e-checkbox-wrapper,
   .e-small .e-css.e-checkbox-wrapper,
@@ -48472,7 +48476,7 @@ $ddl-delimview-bigger-padding-left: 12px !default;
 $ddl-closer-hooker-font: $text-xxs !default;
 $ddl-chip-font-family: $font-family !default;
 $ddl-closer-margin-top: -2.4em !default;
-$ddl-closer-margin-top-bigger: -2.7em !default;
+$ddl-closer-margin-top-bigger: -32px !default;
 $ddl-icon-margin-top: -1.68em !default;
 $ddl-clear-margin-top: -2em !default;
 $ddl-bigger-clear-margin-top: -2.25em !default;
@@ -66481,7 +66485,7 @@ $grid-checkmark-color: $primary-text-color !default;
       line-height: normal;
     }
   }
-  .e-grid.sf-grid.e-grid-min-height .e-virtualtable {
+  .e-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) {
     /* stylelint-disable declaration-no-important */
     .e-table {
       border-spacing: 0 !important;
@@ -66495,6 +66499,19 @@ $grid-checkmark-color: $primary-text-color !default;
 }
 /* stylelint-enable function-url-quotes */
 
+/* Apply styles for Safari on macOS desktop and other Apple devices */
+/* stylelint-disable function-url-quotes */
+@supports (font: -apple-system-body) {
+  .e-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) {
+
+    /* stylelint-disable declaration-no-important */
+    .e-table {
+      border-spacing: 0 !important;
+    }
+  }
+}
+/* stylelint-enable function-url-quotes */
+
 
 @mixin background-color-styles($grid-skin, $bg, $bgcolor) {
   @if $grid-skin == 'material3' {
@@ -99594,6 +99611,8 @@ $qrybldr-drag-grp-list-heg: 28px !default;
 $qrybldr-drag-grp-big-list-heg: 34px !default;
 $qrybldr-drag-grp-big-icon-pad: 10px 10px 10px 5px !default;
 $qryblr-drag-icon-color: $secondary-text-color !default;
+$spinner-border-light-color: $primary-light !default;
+$spinner-border-color: $primary !default;
 
 @mixin fluent2-small-round-btn {
   @if $theme-name == 'fluent2' {
@@ -100677,8 +100696,8 @@ $qryblr-drag-icon-color: $secondary-text-color !default;
   transform: translateX(-50%);
   width: 16px;
   height: 16px;
-  border: 2px solid $primary-light;
-  border-top: 2px solid $primary;
+  border: 2px solid $spinner-border-light-color;
+  border-top: 2px solid $spinner-border-color;
   border-radius: 50%;
   animation: spin 1s linear infinite;
 }
@@ -111822,7 +111841,7 @@ $timeline-item-disabled-color: $content-text-color-disabled !default;
     height: inherit;
     width: 100%;
 
-    [class ^= 'e-dot ']::before,
+    .e-dot:not([class *= ' e-dot']):not([class = 'e-dot'])::before,
     .e-dot-item,
     .e-dot {
       display: flex;
@@ -111830,7 +111849,7 @@ $timeline-item-disabled-color: $content-text-color-disabled !default;
       justify-content: center;
     }
 
-    [class ^= 'e-dot ']::before {
+    .e-dot:not([class *= ' e-dot']):not([class = 'e-dot'])::before {
       min-width: $timeline-dot-icon-size;
       min-height: $timeline-dot-icon-size;
       border-radius: var(--dot-radius);

package/SCSS-Themes/fluent-dark.scss

@@ -30234,7 +30234,7 @@ $cbox-icon-color: $icon-color !default;
         bottom: $cbox-ripple-size;
         height: $cbox-ripple-height;
         left: $cbox-ripple-size;
-        pointer-events: none;
+        pointer-events: auto;
         position: absolute;
         right: $cbox-ripple-size;
         top: $cbox-ripple-size;
@@ -30424,6 +30424,10 @@ $cbox-icon-color: $icon-color !default;
     pointer-events: none;
   }
 
+  .e-overlay .e-checkbox-wrapper .e-ripple-container {
+    pointer-events: none;
+  }
+
   .e-small .e-checkbox-wrapper,
   .e-small.e-checkbox-wrapper,
   .e-small .e-css.e-checkbox-wrapper,
@@ -65883,7 +65887,7 @@ $ddl-delimview-bigger-padding-left: 12px !default;
 $ddl-closer-hooker-font: $text-xxs !default;
 $ddl-chip-font-family: $font-family !default;
 $ddl-closer-margin-top: -2.4em !default;
-$ddl-closer-margin-top-bigger: -2.7em !default;
+$ddl-closer-margin-top-bigger: -32px !default;
 $ddl-icon-margin-top: -1.68em !default;
 $ddl-clear-margin-top: -2em !default;
 $ddl-bigger-clear-margin-top: -2.25em !default;
@@ -68179,7 +68183,7 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
       margin-top: $ddl-closer-margin-top-bigger;
     }
     @if $ddl-multiselect-skin-name == 'fluent2' {
-      margin-top: -2.5em;
+      margin-top: -32px;
     }
     @if $ddl-multiselect-skin-name == 'FluentUI' {
       margin-top: $ddl-bigger-clear-margin-top;
@@ -68190,7 +68194,7 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
     @if $ddl-multiselect-skin-name == 'bootstrap5' or $ddl-multiselect-skin-name == 'bootstrap5.3' {
       margin-top: -2.15em;
     }
-    @if $ddl-multiselect-skin-name == 'highcontrast' or $ddl-multiselect-skin-name == 'fabric' {
+    @if $ddl-multiselect-skin-name == 'fabric' {
       margin-top: -3.2em;
     }
     @if $ddl-multiselect-skin-name == 'tailwind' {
@@ -69957,7 +69961,7 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
   @if $skin-name == 'bootstrap4' {
     .e-bigger .e-input-group.e-multiselect.e-control-wrapper .e-input-group-icon.e-ddl-icon::before,
     .e-bigger.e-input-group.e-multiselect.e-control-wrapper .e-input-group-icon.e-ddl-icon::before {
-      font-size: 14px;
+      font-size: 16px;
     }
     .e-small.e-bigger .e-input-group.e-multiselect.e-control-wrapper .e-input-group-icon.e-ddl-icon::before,
     .e-small.e-bigger.e-input-group.e-multiselect.e-control-wrapper .e-input-group-icon.e-ddl-icon::before {
@@ -70006,7 +70010,7 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
   @if $skin-name == 'FluentUI' {
     .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper.e-down-icon .e-clear-icon,
     .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper.e-down-icon .e-clear-icon {
-      margin-top: -1.6em;
+      margin-top: -24px;
     }
   }
   @if $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
@@ -88886,7 +88890,7 @@ $grid-checkmark-color: $primary-text-color !default;
       line-height: normal;
     }
   }
-  .e-grid.sf-grid.e-grid-min-height .e-virtualtable {
+  .e-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) {
     /* stylelint-disable declaration-no-important */
     .e-table {
       border-spacing: 0 !important;
@@ -88900,6 +88904,19 @@ $grid-checkmark-color: $primary-text-color !default;
 }
 /* stylelint-enable function-url-quotes */
 
+/* Apply styles for Safari on macOS desktop and other Apple devices */
+/* stylelint-disable function-url-quotes */
+@supports (font: -apple-system-body) {
+  .e-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) {
+
+    /* stylelint-disable declaration-no-important */
+    .e-table {
+      border-spacing: 0 !important;
+    }
+  }
+}
+/* stylelint-enable function-url-quotes */
+
 
 @mixin background-color-styles($grid-skin, $bg, $bgcolor) {
   @if $grid-skin == 'material3' {
@@ -130333,6 +130350,8 @@ $qrybldr-drag-grp-list-heg: 28px !default;
 $qrybldr-drag-grp-big-list-heg: 34px !default;
 $qrybldr-drag-grp-big-icon-pad: 10px 10px 10px 5px !default;
 $qryblr-drag-icon-color: $secondary-text-color !default;
+$spinner-border-light-color: $primary-light !default;
+$spinner-border-color: $primary !default;
 
 @mixin fluent2-small-round-btn {
   @if $theme-name == 'fluent2' {
@@ -131416,8 +131435,8 @@ $qryblr-drag-icon-color: $secondary-text-color !default;
   transform: translateX(-50%);
   width: 16px;
   height: 16px;
-  border: 2px solid $primary-light;
-  border-top: 2px solid $primary;
+  border: 2px solid $spinner-border-light-color;
+  border-top: 2px solid $spinner-border-color;
   border-radius: 50%;
   animation: spin 1s linear infinite;
 }
@@ -144821,7 +144840,7 @@ $timeline-item-disabled-color: $content-text-color-disabled !default;
     height: inherit;
     width: 100%;
 
-    [class ^= 'e-dot ']::before,
+    .e-dot:not([class *= ' e-dot']):not([class = 'e-dot'])::before,
     .e-dot-item,
     .e-dot {
       display: flex;
@@ -144829,7 +144848,7 @@ $timeline-item-disabled-color: $content-text-color-disabled !default;
       justify-content: center;
     }
 
-    [class ^= 'e-dot ']::before {
+    .e-dot:not([class *= ' e-dot']):not([class = 'e-dot'])::before {
       min-width: $timeline-dot-icon-size;
       min-height: $timeline-dot-icon-size;
       border-radius: var(--dot-radius);
@@ -145136,7 +145155,7 @@ $timeline-item-disabled-color: $content-text-color-disabled !default;
 @include export-module('timeline-bigger') {
   .e-bigger.e-timeline,
   .e-bigger .e-timeline {
-    [class ^= 'e-dot ']::before {
+    .e-dot:not([class *= ' e-dot']):not([class = 'e-dot'])::before {
       min-width: $timeline-bigger-dot-icon-size;
       min-height: $timeline-bigger-dot-icon-size;
       font-size: $timeline-bigger-dot-font-size;

package/SCSS-Themes/fluent-lite.scss

@@ -21036,7 +21036,7 @@ $cbox-icon-color: $icon-color !default;
         bottom: $cbox-ripple-size;
         height: $cbox-ripple-height;
         left: $cbox-ripple-size;
-        pointer-events: none;
+        pointer-events: auto;
         position: absolute;
         right: $cbox-ripple-size;
         top: $cbox-ripple-size;
@@ -21226,6 +21226,10 @@ $cbox-icon-color: $icon-color !default;
     pointer-events: none;
   }
 
+  .e-overlay .e-checkbox-wrapper .e-ripple-container {
+    pointer-events: none;
+  }
+
   .e-small .e-checkbox-wrapper,
   .e-small.e-checkbox-wrapper,
   .e-small .e-css.e-checkbox-wrapper,
@@ -48472,7 +48476,7 @@ $ddl-delimview-bigger-padding-left: 12px !default;
 $ddl-closer-hooker-font: $text-xxs !default;
 $ddl-chip-font-family: $font-family !default;
 $ddl-closer-margin-top: -2.4em !default;
-$ddl-closer-margin-top-bigger: -2.7em !default;
+$ddl-closer-margin-top-bigger: -32px !default;
 $ddl-icon-margin-top: -1.68em !default;
 $ddl-clear-margin-top: -2em !default;
 $ddl-bigger-clear-margin-top: -2.25em !default;
@@ -66481,7 +66485,7 @@ $grid-checkmark-color: $primary-text-color !default;
       line-height: normal;
     }
   }
-  .e-grid.sf-grid.e-grid-min-height .e-virtualtable {
+  .e-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) {
     /* stylelint-disable declaration-no-important */
     .e-table {
       border-spacing: 0 !important;
@@ -66495,6 +66499,19 @@ $grid-checkmark-color: $primary-text-color !default;
 }
 /* stylelint-enable function-url-quotes */
 
+/* Apply styles for Safari on macOS desktop and other Apple devices */
+/* stylelint-disable function-url-quotes */
+@supports (font: -apple-system-body) {
+  .e-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) {
+
+    /* stylelint-disable declaration-no-important */
+    .e-table {
+      border-spacing: 0 !important;
+    }
+  }
+}
+/* stylelint-enable function-url-quotes */
+
 
 @mixin background-color-styles($grid-skin, $bg, $bgcolor) {
   @if $grid-skin == 'material3' {
@@ -99594,6 +99611,8 @@ $qrybldr-drag-grp-list-heg: 28px !default;
 $qrybldr-drag-grp-big-list-heg: 34px !default;
 $qrybldr-drag-grp-big-icon-pad: 10px 10px 10px 5px !default;
 $qryblr-drag-icon-color: $secondary-text-color !default;
+$spinner-border-light-color: $primary-light !default;
+$spinner-border-color: $primary !default;
 
 @mixin fluent2-small-round-btn {
   @if $theme-name == 'fluent2' {
@@ -100677,8 +100696,8 @@ $qryblr-drag-icon-color: $secondary-text-color !default;
   transform: translateX(-50%);
   width: 16px;
   height: 16px;
-  border: 2px solid $primary-light;
-  border-top: 2px solid $primary;
+  border: 2px solid $spinner-border-light-color;
+  border-top: 2px solid $spinner-border-color;
   border-radius: 50%;
   animation: spin 1s linear infinite;
 }
@@ -111822,7 +111841,7 @@ $timeline-item-disabled-color: $content-text-color-disabled !default;
     height: inherit;
     width: 100%;
 
-    [class ^= 'e-dot ']::before,
+    .e-dot:not([class *= ' e-dot']):not([class = 'e-dot'])::before,
     .e-dot-item,
     .e-dot {
       display: flex;
@@ -111830,7 +111849,7 @@ $timeline-item-disabled-color: $content-text-color-disabled !default;
       justify-content: center;
     }
 
-    [class ^= 'e-dot ']::before {
+    .e-dot:not([class *= ' e-dot']):not([class = 'e-dot'])::before {
       min-width: $timeline-dot-icon-size;
       min-height: $timeline-dot-icon-size;
       border-radius: var(--dot-radius);

package/SCSS-Themes/fluent.scss

@@ -30234,7 +30234,7 @@ $cbox-icon-color: $icon-color !default;
         bottom: $cbox-ripple-size;
         height: $cbox-ripple-height;
         left: $cbox-ripple-size;
-        pointer-events: none;
+        pointer-events: auto;
         position: absolute;
         right: $cbox-ripple-size;
         top: $cbox-ripple-size;
@@ -30424,6 +30424,10 @@ $cbox-icon-color: $icon-color !default;
     pointer-events: none;
   }
 
+  .e-overlay .e-checkbox-wrapper .e-ripple-container {
+    pointer-events: none;
+  }
+
   .e-small .e-checkbox-wrapper,
   .e-small.e-checkbox-wrapper,
   .e-small .e-css.e-checkbox-wrapper,
@@ -65883,7 +65887,7 @@ $ddl-delimview-bigger-padding-left: 12px !default;
 $ddl-closer-hooker-font: $text-xxs !default;
 $ddl-chip-font-family: $font-family !default;
 $ddl-closer-margin-top: -2.4em !default;
-$ddl-closer-margin-top-bigger: -2.7em !default;
+$ddl-closer-margin-top-bigger: -32px !default;
 $ddl-icon-margin-top: -1.68em !default;
 $ddl-clear-margin-top: -2em !default;
 $ddl-bigger-clear-margin-top: -2.25em !default;
@@ -68179,7 +68183,7 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
       margin-top: $ddl-closer-margin-top-bigger;
     }
     @if $ddl-multiselect-skin-name == 'fluent2' {
-      margin-top: -2.5em;
+      margin-top: -32px;
     }
     @if $ddl-multiselect-skin-name == 'FluentUI' {
       margin-top: $ddl-bigger-clear-margin-top;
@@ -68190,7 +68194,7 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
     @if $ddl-multiselect-skin-name == 'bootstrap5' or $ddl-multiselect-skin-name == 'bootstrap5.3' {
       margin-top: -2.15em;
     }
-    @if $ddl-multiselect-skin-name == 'highcontrast' or $ddl-multiselect-skin-name == 'fabric' {
+    @if $ddl-multiselect-skin-name == 'fabric' {
       margin-top: -3.2em;
     }
     @if $ddl-multiselect-skin-name == 'tailwind' {
@@ -69957,7 +69961,7 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
   @if $skin-name == 'bootstrap4' {
     .e-bigger .e-input-group.e-multiselect.e-control-wrapper .e-input-group-icon.e-ddl-icon::before,
     .e-bigger.e-input-group.e-multiselect.e-control-wrapper .e-input-group-icon.e-ddl-icon::before {
-      font-size: 14px;
+      font-size: 16px;
     }
     .e-small.e-bigger .e-input-group.e-multiselect.e-control-wrapper .e-input-group-icon.e-ddl-icon::before,
     .e-small.e-bigger.e-input-group.e-multiselect.e-control-wrapper .e-input-group-icon.e-ddl-icon::before {
@@ -70006,7 +70010,7 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
   @if $skin-name == 'FluentUI' {
     .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper.e-down-icon .e-clear-icon,
     .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper.e-down-icon .e-clear-icon {
-      margin-top: -1.6em;
+      margin-top: -24px;
     }
   }
   @if $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
@@ -88886,7 +88890,7 @@ $grid-checkmark-color: $primary-text-color !default;
       line-height: normal;
     }
   }
-  .e-grid.sf-grid.e-grid-min-height .e-virtualtable {
+  .e-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) {
     /* stylelint-disable declaration-no-important */
     .e-table {
       border-spacing: 0 !important;
@@ -88900,6 +88904,19 @@ $grid-checkmark-color: $primary-text-color !default;
 }
 /* stylelint-enable function-url-quotes */
 
+/* Apply styles for Safari on macOS desktop and other Apple devices */
+/* stylelint-disable function-url-quotes */
+@supports (font: -apple-system-body) {
+  .e-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) {
+
+    /* stylelint-disable declaration-no-important */
+    .e-table {
+      border-spacing: 0 !important;
+    }
+  }
+}
+/* stylelint-enable function-url-quotes */
+
 
 @mixin background-color-styles($grid-skin, $bg, $bgcolor) {
   @if $grid-skin == 'material3' {
@@ -130333,6 +130350,8 @@ $qrybldr-drag-grp-list-heg: 28px !default;
 $qrybldr-drag-grp-big-list-heg: 34px !default;
 $qrybldr-drag-grp-big-icon-pad: 10px 10px 10px 5px !default;
 $qryblr-drag-icon-color: $secondary-text-color !default;
+$spinner-border-light-color: $primary-light !default;
+$spinner-border-color: $primary !default;
 
 @mixin fluent2-small-round-btn {
   @if $theme-name == 'fluent2' {
@@ -131416,8 +131435,8 @@ $qryblr-drag-icon-color: $secondary-text-color !default;
   transform: translateX(-50%);
   width: 16px;
   height: 16px;
-  border: 2px solid $primary-light;
-  border-top: 2px solid $primary;
+  border: 2px solid $spinner-border-light-color;
+  border-top: 2px solid $spinner-border-color;
   border-radius: 50%;
   animation: spin 1s linear infinite;
 }
@@ -144821,7 +144840,7 @@ $timeline-item-disabled-color: $content-text-color-disabled !default;
     height: inherit;
     width: 100%;
 
-    [class ^= 'e-dot ']::before,
+    .e-dot:not([class *= ' e-dot']):not([class = 'e-dot'])::before,
     .e-dot-item,
     .e-dot {
       display: flex;
@@ -144829,7 +144848,7 @@ $timeline-item-disabled-color: $content-text-color-disabled !default;
       justify-content: center;
     }
 
-    [class ^= 'e-dot ']::before {
+    .e-dot:not([class *= ' e-dot']):not([class = 'e-dot'])::before {
       min-width: $timeline-dot-icon-size;
       min-height: $timeline-dot-icon-size;
       border-radius: var(--dot-radius);
@@ -145136,7 +145155,7 @@ $timeline-item-disabled-color: $content-text-color-disabled !default;
 @include export-module('timeline-bigger') {
   .e-bigger.e-timeline,
   .e-bigger .e-timeline {
-    [class ^= 'e-dot ']::before {
+    .e-dot:not([class *= ' e-dot']):not([class = 'e-dot'])::before {
       min-width: $timeline-bigger-dot-icon-size;
       min-height: $timeline-bigger-dot-icon-size;
       font-size: $timeline-bigger-dot-font-size;