@syncfusion/blazor-themes 31.1.22 → 31.2.2

package/Compiled-Themes/tailwind3-dark-lite.css

@@ -12395,7 +12395,7 @@ ejs-calendar {
   bottom: -9px;
   height: 36px;
   left: -9px;
-  pointer-events: none;
+  pointer-events: auto;
   position: absolute;
   right: -9px;
   top: -9px;
@@ -12544,6 +12544,10 @@ ejs-calendar {
   pointer-events: none;
 }
 
+.e-overlay .e-checkbox-wrapper .e-ripple-container {
+  pointer-events: none;
+}
+
 .e-small .e-checkbox-wrapper .e-frame,
 .e-small.e-checkbox-wrapper .e-frame,
 .e-small .e-css.e-checkbox-wrapper .e-frame,
@@ -28664,6 +28668,8 @@ ejs-multiselect {
 }
 
 .e-multi-select-wrapper .e-close-hooker::before {
+  height: 16px;
+  font-size: 16px;
   content: "\e7e7";
   cursor: pointer;
   left: 6px;
@@ -39339,18 +39345,29 @@ li.e-separator.e-menu-item.e-excel-separator {
     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 */
     /* stylelint-enable declaration-no-important */
   }
-  .e-grid.sf-grid.e-grid-min-height .e-virtualtable .e-table {
+  .e-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) .e-table {
     border-spacing: 0 !important;
   }
-  .e-grid.sf-grid.e-grid-min-height .e-virtualtable .e-rowcell {
+  .e-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) .e-rowcell {
     line-height: 1;
   }
 }
 /* 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-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) .e-table {
+    border-spacing: 0 !important;
+  }
+}
+/* stylelint-enable function-url-quotes */
 .e-grid .e-icons:not(.e-btn-icon, .e-check, .e-stop),
 .e-grid-popup .e-icons:not(.e-btn-icon, .e-check, .e-stop) {
   color: var(--color-sf-icon-color);
@@ -68745,14 +68762,14 @@ div > .e-pv-bookmark-icon.e-pv-icon.e-right {
   height: inherit;
   width: 100%;
 }
-.e-timeline [class^="e-dot "]::before,
+.e-timeline .e-dot:not([class*=" e-dot"]):not([class=e-dot])::before,
 .e-timeline .e-dot-item,
 .e-timeline .e-dot {
   display: flex;
   align-items: center;
   justify-content: center;
 }
-.e-timeline [class^="e-dot "]::before {
+.e-timeline .e-dot:not([class*=" e-dot"]):not([class=e-dot])::before {
   min-width: 32px;
   min-height: 32px;
   border-radius: var(--dot-radius);

package/Compiled-Themes/tailwind3-dark.css

@@ -17924,7 +17924,7 @@ ejs-calendar {
   bottom: -9px;
   height: 36px;
   left: -9px;
-  pointer-events: none;
+  pointer-events: auto;
   position: absolute;
   right: -9px;
   top: -9px;
@@ -18073,6 +18073,10 @@ ejs-calendar {
   pointer-events: none;
 }
 
+.e-overlay .e-checkbox-wrapper .e-ripple-container {
+  pointer-events: none;
+}
+
 .e-small .e-checkbox-wrapper .e-frame,
 .e-small.e-checkbox-wrapper .e-frame,
 .e-small .e-css.e-checkbox-wrapper .e-frame,
@@ -39042,6 +39046,8 @@ ejs-multiselect {
 }
 
 .e-multi-select-wrapper .e-close-hooker::before {
+  height: 16px;
+  font-size: 16px;
   content: "\e7e7";
   cursor: pointer;
   left: 6px;
@@ -39075,12 +39081,12 @@ ejs-multiselect {
 }
 
 .e-bigger .e-multi-select-wrapper .e-chips-close.e-close-hooker {
-  margin-top: -2.25em;
+  margin-top: -36px;
 }
 
 .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
 .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
-  margin-top: -2.25em;
+  margin-top: -36px;
 }
 
 .e-bigger .e-multi-select-wrapper input[type=text],
@@ -51386,18 +51392,29 @@ li.e-separator.e-menu-item.e-excel-separator {
     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 */
     /* stylelint-enable declaration-no-important */
   }
-  .e-grid.sf-grid.e-grid-min-height .e-virtualtable .e-table {
+  .e-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) .e-table {
     border-spacing: 0 !important;
   }
-  .e-grid.sf-grid.e-grid-min-height .e-virtualtable .e-rowcell {
+  .e-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) .e-rowcell {
     line-height: 1;
   }
 }
 /* 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-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) .e-table {
+    border-spacing: 0 !important;
+  }
+}
+/* stylelint-enable function-url-quotes */
 .e-grid .e-icons:not(.e-btn-icon, .e-check, .e-stop),
 .e-grid-popup .e-icons:not(.e-btn-icon, .e-check, .e-stop) {
   color: var(--color-sf-icon-color);
@@ -88356,14 +88373,14 @@ div > .e-pv-bookmark-icon.e-pv-icon.e-right {
   height: inherit;
   width: 100%;
 }
-.e-timeline [class^="e-dot "]::before,
+.e-timeline .e-dot:not([class*=" e-dot"]):not([class=e-dot])::before,
 .e-timeline .e-dot-item,
 .e-timeline .e-dot {
   display: flex;
   align-items: center;
   justify-content: center;
 }
-.e-timeline [class^="e-dot "]::before {
+.e-timeline .e-dot:not([class*=" e-dot"]):not([class=e-dot])::before {
   min-width: 32px;
   min-height: 32px;
   border-radius: var(--dot-radius);
@@ -88549,8 +88566,8 @@ div > .e-pv-bookmark-icon.e-pv-icon.e-right {
   color: var(--color-sf-content-text-color-disabled);
 }
 
-.e-bigger.e-timeline [class^="e-dot "]::before,
-.e-bigger .e-timeline [class^="e-dot "]::before {
+.e-bigger.e-timeline .e-dot:not([class*=" e-dot"]):not([class=e-dot])::before,
+.e-bigger .e-timeline .e-dot:not([class*=" e-dot"]):not([class=e-dot])::before {
   min-width: 40px;
   min-height: 40px;
   font-size: 18px;

package/Compiled-Themes/tailwind3-lite.css

@@ -12799,7 +12799,7 @@ ejs-calendar {
   bottom: -9px;
   height: 36px;
   left: -9px;
-  pointer-events: none;
+  pointer-events: auto;
   position: absolute;
   right: -9px;
   top: -9px;
@@ -12948,6 +12948,10 @@ ejs-calendar {
   pointer-events: none;
 }
 
+.e-overlay .e-checkbox-wrapper .e-ripple-container {
+  pointer-events: none;
+}
+
 .e-small .e-checkbox-wrapper .e-frame,
 .e-small.e-checkbox-wrapper .e-frame,
 .e-small .e-css.e-checkbox-wrapper .e-frame,
@@ -29068,6 +29072,8 @@ ejs-multiselect {
 }
 
 .e-multi-select-wrapper .e-close-hooker::before {
+  height: 16px;
+  font-size: 16px;
   content: "\e7e7";
   cursor: pointer;
   left: 6px;
@@ -39742,18 +39748,29 @@ li.e-separator.e-menu-item.e-excel-separator {
     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 */
     /* stylelint-enable declaration-no-important */
   }
-  .e-grid.sf-grid.e-grid-min-height .e-virtualtable .e-table {
+  .e-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) .e-table {
     border-spacing: 0 !important;
   }
-  .e-grid.sf-grid.e-grid-min-height .e-virtualtable .e-rowcell {
+  .e-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) .e-rowcell {
     line-height: 1;
   }
 }
 /* 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-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) .e-table {
+    border-spacing: 0 !important;
+  }
+}
+/* stylelint-enable function-url-quotes */
 .e-grid .e-icons:not(.e-btn-icon, .e-check, .e-stop),
 .e-grid-popup .e-icons:not(.e-btn-icon, .e-check, .e-stop) {
   color: var(--color-sf-icon-color);
@@ -69147,14 +69164,14 @@ div > .e-pv-bookmark-icon.e-pv-icon.e-right {
   height: inherit;
   width: 100%;
 }
-.e-timeline [class^="e-dot "]::before,
+.e-timeline .e-dot:not([class*=" e-dot"]):not([class=e-dot])::before,
 .e-timeline .e-dot-item,
 .e-timeline .e-dot {
   display: flex;
   align-items: center;
   justify-content: center;
 }
-.e-timeline [class^="e-dot "]::before {
+.e-timeline .e-dot:not([class*=" e-dot"]):not([class=e-dot])::before {
   min-width: 32px;
   min-height: 32px;
   border-radius: var(--dot-radius);

package/Compiled-Themes/tailwind3.css

@@ -18328,7 +18328,7 @@ ejs-calendar {
   bottom: -9px;
   height: 36px;
   left: -9px;
-  pointer-events: none;
+  pointer-events: auto;
   position: absolute;
   right: -9px;
   top: -9px;
@@ -18477,6 +18477,10 @@ ejs-calendar {
   pointer-events: none;
 }
 
+.e-overlay .e-checkbox-wrapper .e-ripple-container {
+  pointer-events: none;
+}
+
 .e-small .e-checkbox-wrapper .e-frame,
 .e-small.e-checkbox-wrapper .e-frame,
 .e-small .e-css.e-checkbox-wrapper .e-frame,
@@ -39446,6 +39450,8 @@ ejs-multiselect {
 }
 
 .e-multi-select-wrapper .e-close-hooker::before {
+  height: 16px;
+  font-size: 16px;
   content: "\e7e7";
   cursor: pointer;
   left: 6px;
@@ -39479,12 +39485,12 @@ ejs-multiselect {
 }
 
 .e-bigger .e-multi-select-wrapper .e-chips-close.e-close-hooker {
-  margin-top: -2.25em;
+  margin-top: -36px;
 }
 
 .e-bigger .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
 .e-bigger.e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
-  margin-top: -2.25em;
+  margin-top: -36px;
 }
 
 .e-bigger .e-multi-select-wrapper input[type=text],
@@ -51789,18 +51795,29 @@ li.e-separator.e-menu-item.e-excel-separator {
     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 */
     /* stylelint-enable declaration-no-important */
   }
-  .e-grid.sf-grid.e-grid-min-height .e-virtualtable .e-table {
+  .e-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) .e-table {
     border-spacing: 0 !important;
   }
-  .e-grid.sf-grid.e-grid-min-height .e-virtualtable .e-rowcell {
+  .e-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) .e-rowcell {
     line-height: 1;
   }
 }
 /* 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-grid.sf-grid .e-virtualtable:has(tr.e-masked-row) .e-table {
+    border-spacing: 0 !important;
+  }
+}
+/* stylelint-enable function-url-quotes */
 .e-grid .e-icons:not(.e-btn-icon, .e-check, .e-stop),
 .e-grid-popup .e-icons:not(.e-btn-icon, .e-check, .e-stop) {
   color: var(--color-sf-icon-color);
@@ -88754,14 +88771,14 @@ div > .e-pv-bookmark-icon.e-pv-icon.e-right {
   height: inherit;
   width: 100%;
 }
-.e-timeline [class^="e-dot "]::before,
+.e-timeline .e-dot:not([class*=" e-dot"]):not([class=e-dot])::before,
 .e-timeline .e-dot-item,
 .e-timeline .e-dot {
   display: flex;
   align-items: center;
   justify-content: center;
 }
-.e-timeline [class^="e-dot "]::before {
+.e-timeline .e-dot:not([class*=" e-dot"]):not([class=e-dot])::before {
   min-width: 32px;
   min-height: 32px;
   border-radius: var(--dot-radius);
@@ -88947,8 +88964,8 @@ div > .e-pv-bookmark-icon.e-pv-icon.e-right {
   color: var(--color-sf-content-text-color-disabled);
 }
 
-.e-bigger.e-timeline [class^="e-dot "]::before,
-.e-bigger .e-timeline [class^="e-dot "]::before {
+.e-bigger.e-timeline .e-dot:not([class*=" e-dot"]):not([class=e-dot])::before,
+.e-bigger .e-timeline .e-dot:not([class*=" e-dot"]):not([class=e-dot])::before {
   min-width: 40px;
   min-height: 40px;
   font-size: 18px;

package/SCSS-Themes/base/bds-lite.scss

@@ -33,7 +33,7 @@
   --color-sf-text-tertiary: #{#475467};
   --color-sf-text-tertiary-hover: #{#344054};
   --color-sf-text-tertiary-on-brand: #{#eaecf0};
-  --color-sf-text-quarterary: #{#101828};
+  --color-sf-text-quarterary: #{#667085};
   --color-sf-text-quarterary-on-brand: #{#101828};
   --color-sf-text-white: #{#fff};
   --color-sf-text-disabled: #{#667085};

package/SCSS-Themes/base/bds.scss

@@ -33,7 +33,7 @@
   --color-sf-text-tertiary: #{#475467};
   --color-sf-text-tertiary-hover: #{#344054};
   --color-sf-text-tertiary-on-brand: #{#eaecf0};
-  --color-sf-text-quarterary: #{#101828};
+  --color-sf-text-quarterary: #{#667085};
   --color-sf-text-quarterary-on-brand: #{#101828};
   --color-sf-text-white: #{#fff};
   --color-sf-text-disabled: #{#667085};

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

@@ -22117,7 +22117,7 @@ $cbox-border-style: solid !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;
@@ -22307,6 +22307,10 @@ $cbox-border-style: solid !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,
@@ -67656,7 +67660,7 @@ $grid-checkmark-color: $primary !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;
@@ -67670,6 +67674,19 @@ $grid-checkmark-color: $primary !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' {
@@ -100767,6 +100784,8 @@ $qrybldr-drag-grp-list-heg: 29px !default;
 $qrybldr-drag-grp-big-list-heg: 35px !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' {
@@ -101850,8 +101869,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;
 }
@@ -113003,7 +113022,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;
@@ -113011,7 +113030,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/bds-dark.scss

@@ -31315,7 +31315,7 @@ $cbox-border-style: solid !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;
@@ -31505,6 +31505,10 @@ $cbox-border-style: solid !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,
@@ -69345,7 +69349,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;
@@ -69356,7 +69360,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' {
@@ -71123,7 +71127,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 {
@@ -71172,7 +71176,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' {
@@ -90061,7 +90065,7 @@ $grid-checkmark-color: $primary !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;
@@ -90075,6 +90079,19 @@ $grid-checkmark-color: $primary !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' {
@@ -131506,6 +131523,8 @@ $qrybldr-drag-grp-list-heg: 29px !default;
 $qrybldr-drag-grp-big-list-heg: 35px !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' {
@@ -132589,8 +132608,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;
 }
@@ -146002,7 +146021,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;
@@ -146010,7 +146029,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);
@@ -146317,7 +146336,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;