@syncfusion/blazor-themes 31.1.22 → 31.1.23

package/SCSS-Themes/dropdowns/multi-select/bootstrap.scss

@@ -2287,7 +2287,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;
@@ -2298,7 +2298,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' {
@@ -4065,7 +4065,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 {
@@ -4114,7 +4114,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' {

package/SCSS-Themes/dropdowns/multi-select/bootstrap4-lite.scss

@@ -45,7 +45,7 @@ $ddl-icon-margin-top-bigger: -2.25em !default;
 $ddl-small-ddl-icon-top: -1.85em !default;
 $ddl-bigger-small-ddl-icon-top: -2.85em !default;
 $ddl-clear-margin-top: -2.9em !default;
-$ddl-closer-margin-top-bigger: -3.5em !default;
+$ddl-closer-margin-top-bigger: -32px !default;
 $ddl-chip-close-top: 8px !default;
 $ddl-chip-close-left: 0 !default;
 $ddl-chip-close-margin: 10px 10px 10px 0 !default;
@@ -2162,6 +2162,7 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
   }
 
   .e-multi-select-wrapper .e-close-hooker::before {
+    font-size: 16px;
     content: '\e745';
     cursor: pointer;
     height: $ddl-overall-close-top;

package/SCSS-Themes/dropdowns/multi-select/bootstrap4.scss

@@ -45,7 +45,7 @@ $ddl-icon-margin-top-bigger: -2.25em !default;
 $ddl-small-ddl-icon-top: -1.85em !default;
 $ddl-bigger-small-ddl-icon-top: -2.85em !default;
 $ddl-clear-margin-top: -2.9em !default;
-$ddl-closer-margin-top-bigger: -3.5em !default;
+$ddl-closer-margin-top-bigger: -32px !default;
 $ddl-chip-close-top: 8px !default;
 $ddl-chip-close-left: 0 !default;
 $ddl-chip-close-margin: 10px 10px 10px 0 !default;
@@ -2162,6 +2162,7 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
   }
 
   .e-multi-select-wrapper .e-close-hooker::before {
+    font-size: 16px;
     content: '\e745';
     cursor: pointer;
     height: $ddl-overall-close-top;
@@ -2338,7 +2339,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;
@@ -2349,7 +2350,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' {
@@ -4116,7 +4117,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 {
@@ -4165,7 +4166,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' {

package/SCSS-Themes/dropdowns/multi-select/bootstrap5-dark.scss

@@ -2329,7 +2329,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;
@@ -2340,7 +2340,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' {
@@ -4107,7 +4107,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 {
@@ -4156,7 +4156,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' {

package/SCSS-Themes/dropdowns/multi-select/bootstrap5.3-dark-lite.scss

@@ -48,7 +48,7 @@ $ddl-delimview-bigger-padding-left: 12px !default;
 $ddl-closer-hooker-font: $text-sm !default;
 $ddl-chip-font-family: $font-family !default;
 $ddl-closer-margin-top: -2em !default;
-$ddl-closer-margin-top-bigger: -2.25em !default;
+$ddl-closer-margin-top-bigger: -35px !default;
 $ddl-icon-margin-top: -2.1em !default;
 $ddl-clear-margin-top: -2em !default;
 $ddl-icon-margin-top-bigger: -2.25em !default;
@@ -2154,6 +2154,8 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
   }
 
   .e-multi-select-wrapper .e-close-hooker::before {
+    height: 16px;
+    font-size: 16px;
     content: '\e7e7';
     cursor: pointer;
     left: $ddl-overall-close-left;

package/SCSS-Themes/dropdowns/multi-select/bootstrap5.3-dark.scss

@@ -48,7 +48,7 @@ $ddl-delimview-bigger-padding-left: 12px !default;
 $ddl-closer-hooker-font: $text-sm !default;
 $ddl-chip-font-family: $font-family !default;
 $ddl-closer-margin-top: -2em !default;
-$ddl-closer-margin-top-bigger: -2.25em !default;
+$ddl-closer-margin-top-bigger: -35px !default;
 $ddl-icon-margin-top: -2.1em !default;
 $ddl-clear-margin-top: -2em !default;
 $ddl-icon-margin-top-bigger: -2.25em !default;
@@ -2154,6 +2154,8 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
   }
 
   .e-multi-select-wrapper .e-close-hooker::before {
+    height: 16px;
+    font-size: 16px;
     content: '\e7e7';
     cursor: pointer;
     left: $ddl-overall-close-left;
@@ -2329,7 +2331,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;
@@ -2340,7 +2342,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' {
@@ -4107,7 +4109,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 {
@@ -4156,7 +4158,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' {

package/SCSS-Themes/dropdowns/multi-select/bootstrap5.3-lite.scss

@@ -48,7 +48,7 @@ $ddl-delimview-bigger-padding-left: 12px !default;
 $ddl-closer-hooker-font: $text-sm !default;
 $ddl-chip-font-family: $font-family !default;
 $ddl-closer-margin-top: -2em !default;
-$ddl-closer-margin-top-bigger: -2.25em !default;
+$ddl-closer-margin-top-bigger: -35px !default;
 $ddl-icon-margin-top: -2.1em !default;
 $ddl-clear-margin-top: -2em !default;
 $ddl-icon-margin-top-bigger: -2.25em !default;
@@ -2154,6 +2154,8 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
   }
 
   .e-multi-select-wrapper .e-close-hooker::before {
+    height: 16px;
+    font-size: 16px;
     content: '\e7e7';
     cursor: pointer;
     left: $ddl-overall-close-left;

package/SCSS-Themes/dropdowns/multi-select/bootstrap5.3.scss

@@ -48,7 +48,7 @@ $ddl-delimview-bigger-padding-left: 12px !default;
 $ddl-closer-hooker-font: $text-sm !default;
 $ddl-chip-font-family: $font-family !default;
 $ddl-closer-margin-top: -2em !default;
-$ddl-closer-margin-top-bigger: -2.25em !default;
+$ddl-closer-margin-top-bigger: -35px !default;
 $ddl-icon-margin-top: -2.1em !default;
 $ddl-clear-margin-top: -2em !default;
 $ddl-icon-margin-top-bigger: -2.25em !default;
@@ -2154,6 +2154,8 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
   }
 
   .e-multi-select-wrapper .e-close-hooker::before {
+    height: 16px;
+    font-size: 16px;
     content: '\e7e7';
     cursor: pointer;
     left: $ddl-overall-close-left;
@@ -2329,7 +2331,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;
@@ -2340,7 +2342,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' {
@@ -4107,7 +4109,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 {
@@ -4156,7 +4158,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' {

package/SCSS-Themes/dropdowns/multi-select/bootstrap5.scss

@@ -2329,7 +2329,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;
@@ -2340,7 +2340,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' {
@@ -4107,7 +4107,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 {
@@ -4156,7 +4156,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' {

package/SCSS-Themes/dropdowns/multi-select/fabric-dark.scss

@@ -2290,7 +2290,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;
@@ -2301,7 +2301,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' {
@@ -4068,7 +4068,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 {
@@ -4117,7 +4117,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' {

package/SCSS-Themes/dropdowns/multi-select/fabric.scss

@@ -2281,7 +2281,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;
@@ -2292,7 +2292,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' {
@@ -4059,7 +4059,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 {
@@ -4108,7 +4108,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' {

package/SCSS-Themes/dropdowns/multi-select/fluent-dark-lite.scss

@@ -48,7 +48,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;

package/SCSS-Themes/dropdowns/multi-select/fluent-dark.scss

@@ -48,7 +48,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;
@@ -2344,7 +2344,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;
@@ -2355,7 +2355,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' {
@@ -4122,7 +4122,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 {
@@ -4171,7 +4171,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' {

package/SCSS-Themes/dropdowns/multi-select/fluent-lite.scss

@@ -48,7 +48,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;

package/SCSS-Themes/dropdowns/multi-select/fluent.scss

@@ -48,7 +48,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;
@@ -2344,7 +2344,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;
@@ -2355,7 +2355,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' {
@@ -4122,7 +4122,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 {
@@ -4171,7 +4171,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' {

package/SCSS-Themes/dropdowns/multi-select/fluent2-dark-lite.scss

@@ -50,7 +50,7 @@ $ddl-closer-hooker-font-small: $text-xs !default;
 $ddl-closer-hooker-font-bigger-small: $text-base !default;
 $ddl-chip-font-family: $font-family !default;
 $ddl-closer-margin-top: -2em !default;
-$ddl-closer-margin-top-bigger: -2.3em !default;
+$ddl-closer-margin-top-bigger: -36px !default;
 $ddl-icon-margin-top: -2.3em !default;
 $ddl-clear-margin-top: -2em !default;
 $ddl-icon-margin-top-bigger: -2.1em !default;
@@ -2159,6 +2159,8 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
   }
   
   .e-multi-select-wrapper .e-close-hooker::before {
+    height: 18px;
+    font-size: 18px;
     content: '\e7e7';
     cursor: pointer;
     margin: auto;

package/SCSS-Themes/dropdowns/multi-select/fluent2-dark.scss

@@ -50,7 +50,7 @@ $ddl-closer-hooker-font-small: $text-xs !default;
 $ddl-closer-hooker-font-bigger-small: $text-base !default;
 $ddl-chip-font-family: $font-family !default;
 $ddl-closer-margin-top: -2em !default;
-$ddl-closer-margin-top-bigger: -2.3em !default;
+$ddl-closer-margin-top-bigger: -36px !default;
 $ddl-icon-margin-top: -2.3em !default;
 $ddl-clear-margin-top: -2em !default;
 $ddl-icon-margin-top-bigger: -2.1em !default;
@@ -2159,6 +2159,8 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
   }
   
   .e-multi-select-wrapper .e-close-hooker::before {
+    height: 18px;
+    font-size: 18px;
     content: '\e7e7';
     cursor: pointer;
     margin: auto;
@@ -2651,7 +2653,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;
@@ -2662,7 +2664,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' {
@@ -4429,7 +4431,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 {
@@ -4478,7 +4480,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' {

package/SCSS-Themes/dropdowns/multi-select/fluent2-highcontrast-lite.scss

@@ -50,7 +50,7 @@ $ddl-closer-hooker-font-small: $text-xs !default;
 $ddl-closer-hooker-font-bigger-small: $text-base !default;
 $ddl-chip-font-family: $font-family !default;
 $ddl-closer-margin-top: -2em !default;
-$ddl-closer-margin-top-bigger: -2.3em !default;
+$ddl-closer-margin-top-bigger: -36px !default;
 $ddl-icon-margin-top: -2.3em !default;
 $ddl-clear-margin-top: -2em !default;
 $ddl-icon-margin-top-bigger: -2.1em !default;
@@ -2159,6 +2159,8 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
   }
   
   .e-multi-select-wrapper .e-close-hooker::before {
+    height: 18px;
+    font-size: 18px;
     content: '\e7e7';
     cursor: pointer;
     margin: auto;

package/SCSS-Themes/dropdowns/multi-select/fluent2-highcontrast.scss

@@ -50,7 +50,7 @@ $ddl-closer-hooker-font-small: $text-xs !default;
 $ddl-closer-hooker-font-bigger-small: $text-base !default;
 $ddl-chip-font-family: $font-family !default;
 $ddl-closer-margin-top: -2em !default;
-$ddl-closer-margin-top-bigger: -2.3em !default;
+$ddl-closer-margin-top-bigger: -36px !default;
 $ddl-icon-margin-top: -2.3em !default;
 $ddl-clear-margin-top: -2em !default;
 $ddl-icon-margin-top-bigger: -2.1em !default;
@@ -2159,6 +2159,8 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
   }
   
   .e-multi-select-wrapper .e-close-hooker::before {
+    height: 18px;
+    font-size: 18px;
     content: '\e7e7';
     cursor: pointer;
     margin: auto;
@@ -2651,7 +2653,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;
@@ -2662,7 +2664,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' {
@@ -4429,7 +4431,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 {
@@ -4478,7 +4480,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' {