@syncfusion/blazor-themes 26.1.35 → 26.1.40

package/SCSS-Themes/material3-dark.scss

@@ -2650,9 +2650,15 @@ $acrdn-item-exp-not-selected-hdr-focus-border-color: initial !default;
 
         &:focus {
           border: $acrdn-item-header-focus-border;
-          box-shadow: $acrdn-item-header-focus-box-shadow;
           background: $acrdn-item-header-focus-bg;
 
+          @if ($skin-name == 'fluent2') {
+            box-shadow: none;
+          }
+          @else {
+            box-shadow: $acrdn-item-header-focus-box-shadow;
+          }
+
           &:active {
 
             .e-icons,
@@ -2662,6 +2668,12 @@ $acrdn-item-exp-not-selected-hdr-focus-border-color: initial !default;
             }
           }
         }
+
+        @if ($skin-name == 'fluent2') {
+          &:focus-visible {
+            box-shadow: $acrdn-item-header-focus-box-shadow;
+          }
+        }
       }
 
       &.e-select {
@@ -2768,9 +2780,21 @@ $acrdn-item-exp-not-selected-hdr-focus-border-color: initial !default;
           }
 
           &:focus {
-            box-shadow: $acrdn-item-header-focus-box-shadow;
             position: relative;
             z-index: 2;
+
+            @if ($skin-name == 'fluent2') {
+              box-shadow: none;
+            }
+            @else {
+              box-shadow: $acrdn-item-header-focus-box-shadow;
+            }
+          }
+
+          @if ($skin-name == 'fluent2') {
+            &:focus-visible {
+              box-shadow: $acrdn-item-header-focus-box-shadow;
+            }
           }
         }
 
@@ -15451,11 +15475,15 @@ $filled-input-clear-icon-active-color: rgba($icon-color) !default;
     @if $input-skin-name == 'bootstrap4'  {
       transition: $input-transition-shadow;
     }
-    @if $input-skin-name == 'tailwind' or $input-skin-name == 'bootstrap5' or $input-skin-name == 'FluentUI' {
+    @if $input-skin-name == 'tailwind' or $input-skin-name == 'bootstrap5' {
       border-color: $input-group-border-color-focus;
       border-radius: $input-groupo-focus-border-radius;
       box-shadow: $input-group-focus-box-shadow;
     }
+    @if $input-skin-name == 'FluentUI' {
+      border-radius: $input-groupo-focus-border-radius;
+      border-width: 2px;
+    }
   }
 
   .e-input-group.e-input-focus:not(.e-error):not(.e-warning).e-success,
@@ -15544,14 +15572,14 @@ $filled-input-clear-icon-active-color: rgba($icon-color) !default;
    
   .e-input-group:not(.e-disabled):active:not(.e-success):not(.e-warning):not(.e-error),
   .e-input-group.e-control-wrapper:not(.e-disabled):active:not(.e-success):not(.e-warning):not(.e-error) {
-    @if $input-skin-name == 'fabric' or $input-skin-name == 'FluentUI' or $input-skin-name == 'bootstrap' or $input-skin-name == 'bootstrap4' or $input-skin-name == 'bootstrap5' or $input-skin-name == 'highcontrast' {
+    @if $input-skin-name == 'fabric' or $input-skin-name == 'bootstrap' or $input-skin-name == 'bootstrap4' or $input-skin-name == 'bootstrap5' or $input-skin-name == 'highcontrast' {
       border-color: $input-active-border-color;
     }
     @if $input-skin-name == 'bootstrap' or $input-skin-name == 'bootstrap4'  {
       -webkit-box-shadow: $input-border-shadow;
       box-shadow: $input-border-shadow;
     }
-    @if $input-skin-name == 'bootstrap5' or $input-skin-name == 'FluentUI' {
+    @if $input-skin-name == 'bootstrap5' {
       box-shadow: $input-group-focus-box-shadow;
     }
   }
@@ -23946,7 +23974,7 @@ $sd-active-li-bg: $content-bg-color-alt4 !default;
 $sd-active-li-border-color: $content-bg-color-alt4 !default;
 $sd-active-font-color: $sd-font-color !default;
 
-@mixin speeddial-popup-styles($padding, $li-margin, $li-text-margin, $speeddial-li-text-height, $li-icon-height, $li-icon-width, $li-icon-font-size, $ul-padding, $sd-li-margin) {
+@mixin speeddial-popup-styles($padding, $li-margin, $li-text-margin, $speeddial-li-text-height, $li-icon-height, $li-icon-width, $li-icon-font-size, $ul-padding, $sd-li-margin, $speeddial-text-li-padding) {
   .e-speeddial-ul {
     padding: $padding;
   }
@@ -23959,6 +23987,14 @@ $sd-active-font-color: $sd-font-color !default;
     margin: $li-text-margin;
   }
 
+  .e-speeddial-li.e-speeddial-text-li .e-speeddial-li-text {
+    @if ($skin-name == 'fluent2') {
+      font-size: $li-icon-font-size;
+      line-height: $speeddial-li-text-height;
+      padding: $speeddial-text-li-padding;
+    }
+  }
+
   .e-speeddial-li-text {
     height: $speeddial-li-text-height;
     line-height: $speeddial-li-text-height;
@@ -24082,6 +24118,16 @@ $sd-active-font-color: $sd-font-color !default;
       &:not(.e-speeddial-text-li) .e-speeddial-li-text {
         margin: $sd-li-text-margin;
       }
+
+      &.e-speeddial-text-li .e-speeddial-li-text {
+        @if ($skin-name == 'fluent2') {
+          border: 1px solid;
+          border-radius: 20px;
+          font-size: 12px;
+          line-height: 16px;
+          padding: 8px 16px;
+        }
+      }
     }
 
     .e-speeddial-li-text {
@@ -24219,19 +24265,19 @@ $sd-active-font-color: $sd-font-color !default;
 
   .e-small.e-speeddial-popup,
   .e-small .e-speeddial-popup {
-    @include speeddial-popup-styles($sd-small-vert-ul-padding, $sd-small-vert-li-margin, $sd-small-li-text-margin, $sd-small-li-text-height, $sd-small-li-icon-height, $sd-small-li-icon-width, $sd-small-li-icon-font-size, $sd-small-horz-ul-padding, $sd-small-horz-li-margin);
+    @include speeddial-popup-styles($sd-small-vert-ul-padding, $sd-small-vert-li-margin, $sd-small-li-text-margin, $sd-small-li-text-height, $sd-small-li-icon-height, $sd-small-li-icon-width, $sd-small-li-icon-font-size, $sd-small-horz-ul-padding, $sd-small-horz-li-margin, 5px 16px);
   }
 
   .e-bigger.e-speeddial-popup,
   .e-bigger .e-speeddial-popup {
-    @include speeddial-popup-styles($sd-bigger-vert-ul-padding, $sd-bigger-vert-li-margin, $sd-bigger-li-text-margin, $sd-bigger-li-text-height, $sd-bigger-li-icon-height, $sd-bigger-li-icon-width, $sd-bigger-li-icon-font-size, $sd-bigger-horz-ul-padding, $sd-bigger-horz-li-margin);
+    @include speeddial-popup-styles($sd-bigger-vert-ul-padding, $sd-bigger-vert-li-margin, $sd-bigger-li-text-margin, $sd-bigger-li-text-height, $sd-bigger-li-icon-height, $sd-bigger-li-icon-width, $sd-bigger-li-icon-font-size, $sd-bigger-horz-ul-padding, $sd-bigger-horz-li-margin, 10px 28px);
   }
 
   .e-bigger.e-small.e-speeddial-popup,
   .e-bigger.e-small .e-speeddial-popup,
   .e-bigger .e-small.e-speeddial-popup,
   .e-small .e-bigger.e-speeddial-popup {
-    @include speeddial-popup-styles($sd-bigger-small-vert-ul-padding, $sd-bigger-small-vert-li-margin, $sd-bigger-li-text-margin, $sd-bigger-small-li-text-height, $sd-bigger-small-li-icon-height, $sd-bigger-small-li-icon-width, $sd-bigger-small-li-icon-font-size, $sd-bigger-small-horz-ul-padding, $sd-bigger-small-horz-li-margin);
+    @include speeddial-popup-styles($sd-bigger-small-vert-ul-padding, $sd-bigger-small-vert-li-margin, $sd-bigger-li-text-margin, $sd-bigger-small-li-text-height, $sd-bigger-small-li-icon-height, $sd-bigger-small-li-icon-width, $sd-bigger-small-li-icon-font-size, $sd-bigger-small-horz-ul-padding, $sd-bigger-small-horz-li-margin, 8px 24px);
   }
 
   .e-speeddial-overlay {
@@ -24295,6 +24341,13 @@ $sd-active-font-color: $sd-font-color !default;
           border-color: $sd-li-border-color;
         }
       }
+      &.e-speeddial-text-li .e-speeddial-li-text {
+        @if ($skin-name == 'fluent2') {
+          background: $secondary-bg-color;
+          box-shadow: $shadow-lg;
+          border-color: $secondary-border-color;
+        }
+      }
     }
     .e-speeddial-li.e-disabled {
       @include speeddial-text-icon-colors($sd-disabled-font-color, $sd-disabled-li-bg, $sd-disabled-li-border-color);
@@ -25442,7 +25495,7 @@ $calendar-small-font-size: $text-xs !default;
         }
       }
       #{if(&, '&', '*')} .e-content.e-year,
-      #{if(&, '&', '*')} .e-content.e-decade, {
+      #{if(&, '&', '*')} .e-content.e-decade {
         #{if(&, '&', '*')} td.e-selected span.e-day {
           @if $skin-name == 'fluent2' {
             font-weight: 600;
@@ -44392,12 +44445,6 @@ $zero-value: 0 !default;
     .e-dlg-header-content {
       border-radius: $header-content-border-radius;
       line-height: $dialog-header-line-height;
-
-      .e-dlg-closeicon-btn.e-btn.e-icon-btn {
-        @if $skin-name =='fluent2' {
-          line-height: 2;
-        }
-      }
     }
 
     .e-dlg-header-content + .e-dlg-content {
@@ -44571,6 +44618,9 @@ $zero-value: 0 !default;
       @if $skin-name == 'Material3' {
         padding: $zero-value;
       }
+      @if $skin-name == 'fluent2' {
+        padding: $dialog-bigger-header-btn-padding;
+      }
     }
 
     .e-btn .e-btn-icon.e-icon-dlg-close {
@@ -44676,6 +44726,9 @@ $zero-value: 0 !default;
     @if $skin-name == 'Material3' {
       padding: $zero-value;
     }
+    @if $skin-name == 'fluent2' {
+      padding: $dialog-header-btn-padding;
+    }
   }
 
   .e-rtl {
@@ -53668,7 +53721,7 @@ $treeview-drag-icon-color: rgba($content-text-color-alt1) !default;
       @if $skin-name == 'bootstrap4' {
         font-size: $treeview-big-image-font-size;
       }
-      @if ($skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' or $skin-name == 'Material3') {
+      @if ($skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' or $skin-name == 'Material3' or $skin-name == 'fluent2') {
         & + .e-list-text {
           padding: $treeview-big-image-text-padding;
         }
@@ -56533,6 +56586,16 @@ $step-selected-active-color: $primary-bg-color-pressed !default;
         font-weight: $stepper-font-weight;
       }
     }
+    &.e-linear {
+      .e-step-container {
+        pointer-events: none;
+      }
+      .e-previous:not(.e-step-disabled),
+      .e-next:not(.e-step-disabled),
+      .e-step-selected:not(.e-step-disabled) {
+        pointer-events: auto;
+      }
+    }
     &.e-stepper-readonly,
     .e-step-disabled {
       cursor: default;
@@ -58011,6 +58074,7 @@ $ddt-item-hover-bg: $content-bg-color-hover !default;
 
       &.e-chip-input {
         width: 0;
+        display: none;
       }
     }
 
@@ -74865,7 +74929,7 @@ $grid-xlfl-skin: 'material3' !default;
       .e-frame {
         margin-bottom: 1px;
         @if $grid-xlfl-skin == 'fluent2' {
-          margin: 0 0 1px 4px;
+          margin-bottom: 8px;
         }
       }
     }
@@ -75013,6 +75077,7 @@ $grid-xlfl-skin: 'material3' !default;
     @if $grid-xlfl-skin == 'fluent2' {
       .e-ftrchk.e-infinitescroll {
         margin-left: 0;
+        padding-left: 0;
       }
     }
 
@@ -75412,7 +75477,7 @@ $grid-columnchooser-toolbar-div-padding: 0 10px !default;
 $grid-columnchooser-toolbar-icon-line-height: 1.9 !default;
 $grid-columnchooser-toolbar-icon-font-size: 15px !default;
 $grid-columnchooser-btn-font-size: 14px !default;
-$grid-columnchooser-toolbardiv-padding: 3px !default;
+$grid-columnchooser-toolbardiv-padding: 8px !default;
 $grid-columnchooser-toolbardiv-margin-top: 0 !default;
 $grid-columnchooser-toolbar-icon-vertical-align: middle !default;
 $grid-columnchooser-cancel-icon-content-f-opactiy: 1 !default;
@@ -76248,7 +76313,8 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
 
     @if $grid-skin == 'fluent2' {
       &.e-device .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
-        margin-left: -4px;
+        margin-left: -5px;
+        margin-top: 4px;
       }
       &.e-rtl.e-device .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
         margin-right: -2px;
@@ -76259,7 +76325,7 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
       .e-headercell .e-headercelldiv.e-headerchkcelldiv {
         @if $grid-skin == 'fluent2' {
           margin-bottom: 2px;
-          margin-left: 6px;
+          margin-left: 7px;
         }
       }
 
@@ -76386,8 +76452,9 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
     }
 
     @if $grid-skin == 'fluent2' {
-      .e-ftrchk.e-infinitescroll {
+      .e-checkboxfilter .e-ftrchk.e-infinitescroll {
         margin-left: 0;
+        padding-left: 0;
       }
     }
 
@@ -78050,7 +78117,9 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
         padding: $grid-group-caption-header-padding $grid-content-right-padding;
       }
       white-space: normal;
-      word-wrap: break-word;
+      text-wrap: nowrap;
+      text-overflow: ellipsis;
+      overflow: hidden;
       &.e-lastrowcell {
         border-bottom-width: 1px;
       }
@@ -78791,7 +78860,7 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
     }
 
     @if $grid-skin == 'fluent2' {
-      .e-ftrchk.e-infinitescroll {
+      .e-checkboxfilter .e-ftrchk.e-infinitescroll {
         padding-left: 0;
         margin-left: 0;
       }
@@ -79974,7 +80043,7 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
 
       &.e-default {
         & tr td:last-child:not(.e-xlsel-left-border, .e-addfreezefirstchildborder),
-        & .e-gridheader table tr th:last-child {
+        & .e-gridheader table tr th:last-child:not(.e-firstcell) {
           border-left: 0;
         }
       }
@@ -80803,7 +80872,7 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
   }
 
   .e-gridcontent .e-groupcaption {
-    @include grid-line-height-padding-styles(normal, .7em);
+    @include grid-line-height-padding-styles(normal, 0 .7em);
   }
 
   .e-summarycell {
@@ -81395,9 +81464,6 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
           background: none;
           border: 0;
           color: $grid-responsive-custom-header-btn-color;
-          @if $grid-skin == 'fluent2' {
-            padding-top: 6px;
-          }
         }
       }
     }
@@ -81484,6 +81550,22 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
       & .e-dlg-content {
         padding: 16px;
       }
+
+      @if $grid-xlfl-skin == 'fluent2' {
+        .e-checkbox-wrapper .e-frame {
+          @if $grid-xlfl-skin == 'fluent2' {
+            margin: 0 0 1px 4px;
+          }
+        }
+  
+        .e-radio + label {
+          margin: 0;
+        }
+
+        .e-radio-wrapper .e-xlfl-radio-or {
+          margin-left: 18px;
+        }
+      }
     }
 
     & .e-ressortbutton-parent {
@@ -81578,6 +81660,14 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
               min-height: 160px;
               overflow-y: auto;
 
+              &.e-checkbox-infinitescroll {
+                border-top-style: solid;
+                border-top-color: $grid-columnchooser-footer-border-color;
+                border-top-width: 1px;
+                margin-top: 0;
+                overflow-x: hidden;
+              }
+
               & .e-ftrchk {
                 @include grid-top-bottom-padding($grid-bigger-checkbox-padding-topbottom, $grid-bigger-checkbox-padding-topbottom);
                 @if $grid-skin == 'fluent2' {
@@ -81586,6 +81676,29 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
               }
             }
           }
+
+          & .e-ftrchk {
+            & .e-chk-hidden {
+              -moz-appearance: none; /* stylelint-disable-line property-no-vendor-prefix */
+              height: 1px;
+              opacity: 0;
+              width: 1px;
+            }
+
+            & .e-mask {
+              display: inline-block;
+              height: 10px;
+              width: 80%;
+
+              &.e-mask-checkbox-filter-intent {
+                width: 13px;
+              }
+
+              &.e-mask-checkbox-filter-span-intent {
+                margin-left: 8px;
+              }
+            }
+          }
         }
       }
     }
@@ -81600,10 +81713,9 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
           & .e-searchbox {
             padding-left: 0;
           }
-          & .e-spinner {
-            & .e-checkboxlist {
-              margin-left: -7px;
-            }
+          & .e-ftrchk.e-infinitescroll,
+          & .e-spinner .e-checkboxlist {
+            margin-left: -7px;
           }
         }
       }
@@ -81651,6 +81763,9 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
     @if $grid-skin == 'fluent' {
       padding-top: 3px;
     }
+    @if $grid-skin == 'fluent' {
+      padding-top: 1px;
+    }
     @if $grid-skin == 'bootstrap4' or $grid-skin == 'material' {
       padding-top: 2px;
     }
@@ -81979,6 +82094,11 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
       border-color: $grid-header-border-color;
     }
 
+    .e-headercell,
+    .e-detailheadercell {
+      background-color: $grid-header-bg-color;
+    }
+
     .e-gridcontent {
       background-color: $grid-content-bg-color;
     }
@@ -88713,8 +88833,8 @@ $rte-tbar-default-bg: $content-bg-color-alt2 !default;
 $rte-extended-toolbar-items-padding: 0;
 $rte-expand-tbar-hover-bg: $content-bg-color-hover !default;
 $rte-big-insert-dialog-label-padding-top: 12px;
-$rte-tbar-icon-size: 14px;
-$rte-background-color-icon-fontsize: 18px;
+$rte-tbar-icon-size: 16px;
+$rte-background-color-icon-fontsize: 16px;
 $rte-big-background-color-icon-fontsize: 20px;
 $rte-dropdown-btn-color-content-padding: 0 !default;
 $rte-big-dropdown-btn-color-content-padding: 9.5px !default;
@@ -89938,14 +90058,24 @@ $rte-big-img-upload-abort-icon-btn-padding: 18px;
           font-size: 2em;
           font-weight: bold;
           height: 40px;
-          line-height: 40px;
+          @if $skin-name =='fluent2' {
+            line-height: 25px;
+          }
+          @else {
+            line-height: 40px;
+          }
         }
 
         &.e-h2 {
           font-size: 1.5em;
           font-weight: bold;
           height: 40px;
-          line-height: 40px;
+          @if $skin-name =='fluent2' {
+            line-height: 25px;
+          }
+          @else {
+            line-height: 40px;
+          }
         }
 
         &.e-h3 {
@@ -91287,7 +91417,7 @@ $rte-big-img-upload-abort-icon-btn-padding: 18px;
       .e-rte-dropdown-btn-text,
       .e-background-color,
       .e-rte-font-color {
-        font-size: 14px;
+        font-size: 16px;
       }
     }
     .e-bigger {
@@ -91296,27 +91426,27 @@ $rte-big-img-upload-abort-icon-btn-padding: 18px;
         .e-rte-dropdown-btn-text,
         .e-background-color,
         .e-rte-font-color {
-          font-size: 16px;
+          font-size: 18px;
         }
       }
     }
     .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn {
       .e-background-color,
-      .e-rte-font-color{
-        font-size: 14px;
+      .e-rte-font-color {
+        font-size: 16px;
       }
     }
     .e-bigger {
       .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn {
         .e-background-color,
-        .e-rte-font-color{
-          font-size: 16px;
+        .e-rte-font-color {
+          font-size: 18px;
         }
       }
-      .e-rte-container{
+      .e-rte-container {
         border-radius: 4px;
       }
-      .e-richtexteditor{
+      .e-richtexteditor {
         border-radius: 4px;
         .e-toolbar {
           border-radius: 4px 4px 0 0;
@@ -97840,7 +97970,7 @@ $kanban-col-expand-collapse-box-shadow: $secondary-shadow-focus !default;
 
   .e-kanban-dialog .e-dialog-edit.e-primary{
     background: $primary-bg-color-hover;
-    color: $primary-border-color-hover;
+    color: $primary-text-color;
   }
 }
 
@@ -107000,6 +107130,12 @@ $field-list-device-footer-button-box-shadow: $shadow-lg !default;
         &:not(.e-active) {
           .e-list-icon {
             color: $field-list-tree-icon-color;
+
+            @if ($skin-name == 'fluent2') {
+              &:hover {
+                color: $field-list-icon-hover-color;
+              }
+            }
           }
         }
 
@@ -107011,6 +107147,15 @@ $field-list-device-footer-button-box-shadow: $shadow-lg !default;
           float: right !important;
           margin: 0 12px 0 0;
           /* stylelint-enable */
+
+          @if ($skin-name == 'fluent2') {
+            &:hover {
+              color: $field-list-icon-hover-color;
+            }
+            &:active {
+              color: $field-list-icon-hover-color;
+            }
+          }
         }
       }
 
@@ -107075,6 +107220,11 @@ $field-list-device-footer-button-box-shadow: $shadow-lg !default;
         margin-right: 4px;
         pointer-events: auto;
         width: 20px;
+
+        @if ($skin-name == 'fluent2') {
+          font-size: 16px;
+          margin-top: 3px;
+        }
       }
       @if ($skin-name == 'tailwind') {
         &.e-active {
@@ -107442,7 +107592,11 @@ $field-list-device-footer-button-box-shadow: $shadow-lg !default;
             position: relative;
             top: 3px;
           }
-    
+
+          @if ($skin-name == 'fluent2') {
+            font-size: 20px;
+          }
+          
           @if ($skin-name == 'tailwind') {
             position: relative;
             top: 1px;
@@ -108984,6 +109138,10 @@ $field-list-device-footer-button-box-shadow: $shadow-lg !default;
                 vertical-align: bottom;
                 width: 20px;
 
+                @if ($skin-name =='fluent2') {
+                  font-size: 16px;
+                }
+
                 @if ($skin-name =='bootstrap5') or ($skin-name =='FluentUI') {
                   margin-right: 4px;
                   padding-left: 8px;
@@ -109264,6 +109422,10 @@ $field-list-device-footer-button-box-shadow: $shadow-lg !default;
                   height: 20px;
                   width: 20px;
 
+                  @if ($skin-name =='fluent2') {
+                    font-size: 16px;
+                  }
+
                   &.e-disable-drag {
                     cursor: not-allowed;
                     opacity: .4;
@@ -110242,6 +110404,11 @@ $field-list-device-footer-button-box-shadow: $shadow-lg !default;
           margin-bottom: $field-list-treeview-drag-bigger-padding !important;
           margin-right: 4px !important;
           width: 24px !important;
+
+          @if ($skin-name =='fluent2') {
+            font-size: 20px !important;
+            margin-bottom: 5px !important;
+          }
         }
 
         .e-calc-measure-icon,
@@ -110343,6 +110510,10 @@ $field-list-device-footer-button-box-shadow: $shadow-lg !default;
               .e-drag {
                 font-size: $field-list-bigger-icon-size;
                 width: 24px;
+
+                @if ($skin-name =='fluent2') {
+                  font-size: 20px;
+                }
               }
             }
           }
@@ -114513,6 +114684,7 @@ $qrybldr-drag-grp-icon-pad: 10px 10px 10px 1px !default;
 $qrybldr-drag-grp-list-heg: 26px !default;
 $qrybldr-drag-grp-big-list-heg: 34px !default;
 $qrybldr-drag-grp-big-icon-pad: 10px 10px 10px 3px !default;
+$qryblr-drag-icon-color: rgba($secondary-text-color) !default;
 
 @mixin fluent2-small-round-btn {
   @if $theme-name == 'fluent2' {
@@ -114555,7 +114727,7 @@ $qrybldr-drag-grp-big-icon-pad: 10px 10px 10px 3px !default;
         @if $skin-name == 'fluent2' {
           box-shadow: $shadow-md;
         }
-        background-color: $qrybldr-drag-bg-color;
+        background: $qrybldr-drag-bg-color;
       }
 
       & .e-rule-value-delete {
@@ -114590,9 +114762,7 @@ $qrybldr-drag-grp-big-icon-pad: 10px 10px 10px 3px !default;
       padding: 15px 3px 15px 11px;
       vertical-align: middle;
       font-size: $qrybldr-drag-icon-font-size;
-      @if $skin-name == 'fluent2' {
-        color: $qryblr-drag-icon-color;
-      }
+      color: $qryblr-drag-icon-color;
     }
 
     & .e-group-header .e-drag-qb-rule {
@@ -120708,6 +120878,18 @@ $schedule-bgr-tbar-btn-text-font-size: $schedule-header-nrml-font-size !default;
   }
 }
 
+@media print {
+  .e-schedule {
+    .e-table-container {
+      display: block;
+    }
+
+    .e-vertical-view .e-content-table thead {
+      break-inside: auto;
+    }
+  }
+}
+
 .e-bigger .e-more-popup-wrapper,
 .e-more-popup-wrapper {
   background: $schedule-popup-bg-color;
@@ -120886,6 +121068,10 @@ $schedule-bgr-tbar-btn-text-font-size: $schedule-header-nrml-font-size !default;
 @mixin schedule-select-cell-focus-styles {
   @if ($theme-name == 'fluent2') {
     &:focus {
+      background: $content-bg-color-focus;
+    }
+
+    &:focus-visible {
       background: $schedule-select-focus-bg-color;
       box-shadow: $schedule-select-focus-box-shadow;
     }
@@ -121708,6 +121894,7 @@ $image-editor-save-dlg-big-btn-pad: 8px 11px !default;
 $image-editor-save-dlg-grp-btn-padding: 8px 10.5px !default;
 $image-editor-save-dlg-dev-grp-btn-padding: 11px 12px !default;
 $image-editor-icon-button: 3px !default;
+$image-editor-filter-canvas-focus: 1px solid $icon-color !default;
 
 @include export-module('image-editor-layout') {
   .e-ie-toolbar-upload-div.e-hide,
@@ -122194,6 +122381,14 @@ $image-editor-icon-button: 3px !default;
         }
       }
     }
+    & .e-ie-save-dialog .e-slider-container .e-slider .e-handle,
+    & .e-blr-ie-save-dialog .e-slider-container .e-slider .e-handle {
+      @if $skin-name == 'Material3' {
+        height: 16px !important; /* stylelint-disable-line declaration-no-important */
+        top: calc(50% - 10px) !important; /* stylelint-disable-line declaration-no-important */
+        width: 16px !important; /* stylelint-disable-line declaration-no-important */
+      }
+    }
   }
   
   .e-ie-img-save-dlg .e-btn {
@@ -122399,12 +122594,18 @@ $image-editor-icon-button: 3px !default;
     @if $skin-name == 'highcontrast' {
       margin-left: calc(100% - 175px);
     }
-    @if $skin-name == 'FluentUI' or $skin-name == 'material' or $skin-name == 'Material3' {
+    @if $skin-name == 'FluentUI' or $skin-name == 'material' {
       margin-left: calc(100% - 185px);
     }
     @if $skin-name == 'fabric' {
       margin-left: calc(100% - 180px);
     }
+    @if $skin-name == 'fluent2' {
+      margin-left: calc(100% - 188px);
+    }
+    @if $skin-name == 'Material3' {
+      margin-left: calc(100% - 190px);
+    }
   }
 
   .e-device.e-ie-save-dialog .e-ie-img-size-value-span {
@@ -122427,6 +122628,9 @@ $image-editor-icon-button: 3px !default;
     @if $skin-name == 'bootstrap5' {
       margin-left: calc(100% - 156px) !important; /* stylelint-disable-line declaration-no-important */
     }
+    @if $skin-name == 'Material3' {
+      margin-left: calc(100% - 140px) !important; /* stylelint-disable-line declaration-no-important */
+    }
   }
 
   .e-bigger .e-ie-save-dialog .e-ie-img-save-name {
@@ -122524,7 +122728,12 @@ $image-editor-icon-button: 3px !default;
 
     & .e-ie-img-size-value-span {
       vertical-align: middle;
-      margin-left: calc(50% - 55px);
+      @if $skin-name == 'Material3' {
+        margin-left: calc(50% - 52px);
+      }
+      @else {
+        margin-left: calc(50% - 55px);
+      }
     }
 
     & .e-btn-group .e-btn {
@@ -122555,10 +122764,10 @@ $image-editor-icon-button: 3px !default;
       }
  
       & .e-ie-img-size-value-span {
-        @if $skin-name == 'Material3' or $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'highcontrast' {
+        @if $skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'highcontrast' {
           margin-left: calc(75% - 100px) !important; /* stylelint-disable-line declaration-no-important */
         }
-        @else if $skin-name == 'bootstrap' {
+        @else if $skin-name == 'Material3' or $skin-name == 'bootstrap' {
           margin-left: calc(73% - 100px) !important; /* stylelint-disable-line declaration-no-important */
         }
         @else if $skin-name == 'tailwind' {
@@ -122581,6 +122790,12 @@ $image-editor-icon-button: 3px !default;
     }
   }
 
+  .e-bigger .e-blr-ie-save-dialog .e-slider-container .e-slider .e-handle {
+    @if $skin-name == 'Material3' {
+      top: calc(50% - 8px) !important; /* stylelint-disable-line declaration-no-important */
+    }
+  }
+
   .e-bigger .e-ie-save-dialog .e-ie-img-save-name {
     width: calc(71% - 30px) !important; /* stylelint-disable-line declaration-no-important */
     @if $skin-name == 'tailwind' or $skin-name == 'material' or $skin-name == 'bootstrap4' {
@@ -122720,6 +122935,13 @@ $image-editor-icon-button: 3px !default;
   }
 }
 
+.e-ie-filter-canvas:focus,
+.filter-wrapper:focus .e-ie-filter-canvas,
+.filter-wrapper:focus canvas,
+.filter-wrapper canvas:focus {
+  border: $image-editor-filter-canvas-focus;
+}
+
 
 @include export-module('image-editor-material3-icons') {
   .e-image-editor {
@@ -124955,6 +125177,7 @@ $ribbon-dropdown-btn-padding: 0 5px !default;
 $ribbon-dropdown-caret-btn-size: $text-xs !default;
 $ribbon-dropdown-caret-btn-height: 12px !default;
 $ribbon-dropdown-caret-btn-padding: 2px 5px !default;
+$ribbon-colorpicker-caret-btn-padding: $ribbon-dropdown-caret-btn-padding !default;
 $ribbon-items-padding: 2px !default;
 $ribbon-large-items-btn-padding: 0 2px !default;
 $ribbon-large-items-btn-height: 15px !default;
@@ -125133,6 +125356,7 @@ $ribbon-bigger-menu-blank-icon-padding: 50px !default;
 $ribbon-bigger-dropdown-btn-size: $text-xs !default;
 $ribbon-bigger-dropdown-btn-line-height: 12px !default;
 $ribbon-bigger-dropdown-caret-btn-padding: 2px 4px !default;
+$ribbon-bigger-colorpicker-caret-btn-padding: $ribbon-bigger-dropdown-caret-btn-padding !default;
 $ribbon-bigger-dropdown-caret-btn-size: $text-xs !default;
 $ribbon-bigger-dropdown-caret-icon-size: $text-base !default;
 $ribbon-bigger-dropdown-caret-btn-height: 12px !default;
@@ -125652,6 +125876,10 @@ $ribbon-items-focus-box-shadow: none !default;
 
     .e-ribbon-tab-item {
       display: inline-flex;
+
+      &.e-disabled {
+        pointer-events: none;
+      }
     }
 
     .e-ribbon-group {
@@ -126131,6 +126359,10 @@ $ribbon-items-focus-box-shadow: none !default;
           }
         }
 
+        .e-split-btn-wrapper:has(.e-icon-btn) .e-dropdown-btn .e-caret {
+          padding: $ribbon-colorpicker-caret-btn-padding;
+        }
+
         .e-dropdown-btn .e-caret {
           @include ribbon-font-props($ribbon-dropdown-caret-btn-size, $ribbon-dropdown-caret-btn-height);
           padding: $ribbon-dropdown-caret-btn-padding;
@@ -126822,6 +127054,10 @@ $ribbon-items-focus-box-shadow: none !default;
           }
         }
 
+        .e-split-btn-wrapper:has(.e-icon-btn) .e-dropdown-btn .e-caret {
+          padding: $ribbon-bigger-colorpicker-caret-btn-padding;
+        }
+
         .e-dropdown-btn .e-caret {
           @include ribbon-font-props($ribbon-bigger-dropdown-caret-btn-size, $ribbon-bigger-dropdown-caret-btn-height);
           padding: $ribbon-bigger-dropdown-caret-btn-padding;
@@ -127953,6 +128189,8 @@ $timeline-item-disabled-color: $content-text-color-disabled !default;
 $header-font-weight: 500 !default;
 $multicolumn-grid-height: 32px !default;
 $multicolumn-margin-top-value: 1px !default;
+$footer-border-width: 0 1px 0 1px !default;
+$grid-border-width: 1px !default;
 
 $multicolumn-grid-small-height: 26px !default;
 $multicolumn-margin-top-small-value: 1px !default;
@@ -127963,13 +128201,13 @@ $multicolumn-margin-top-bigger-value: 1px !default;
 $multicolumn-grid-bigger-small-height: 36px !default;
 $multicolumn-margin-top-bigger-small-value: 1px !default;
 
-$footer-border-color: $border-light !default;
+$footer-border-color: rgba($border-light) !default;
 $popup-text-color: $content-text-color-alt1 !default;
 $grid-content-color: $content-text-color !default;
 $grid-content-hover-bg-color: $flyout-bg-color-hover !default;
 $grid-content-active-bg-color: $flyout-bg-color-selected !default;
 $grid-content-active-color: $flyout-text-color-selected !default;
-$grid-footer-bg-color: $transparent !default;
+$grid-footer-bg-color: rgba($content-bg-color) !default;
 $grid-footer-color: $content-text-color-alt1 !default;
 $grid-group-content-header-color: $content-text-color-alt1 !default;
 $grid-group-content-header-bg-color: rgba($content-bg-color) !default;
@@ -128003,10 +128241,15 @@ $nodata-border-color: $flyout-bg-color !default;
   }
   .e-multicolumn-list .e-popup-footer {
     vertical-align: middle;
-    border-top: 1px solid;
+    border-style: solid;
+    border-width: $footer-border-width;
     font-size: 14px;
-    height: 38px;
-    padding: 8px 0;
+    height: $multicolumn-grid-height;
+    display: flex;
+    align-items: center;
+  }
+  .e-multicolumn-grid.e-grid {
+    border-width: $grid-border-width;
   }
   .e-input-group.e-multicolumn-list {
     input[readonly].e-input {
@@ -128075,6 +128318,7 @@ $nodata-border-color: $flyout-bg-color !default;
     &.e-multicolumn-list .e-popup-footer {
       font-size: 12px;
     }
+    &.e-multicolumn-list .e-popup-footer,
     .e-multicolumn-grid .e-row,
     .e-multicolumn-grid .e-emptyrow {
       height: $multicolumn-grid-small-height;
@@ -128087,6 +128331,7 @@ $nodata-border-color: $flyout-bg-color !default;
     &.e-multicolumn-list .e-popup-footer {
       font-size: 16px;
     }
+    &.e-multicolumn-list .e-popup-footer,
     .e-multicolumn-grid .e-row,
     .e-multicolumn-grid .e-emptyrow {
       height: $multicolumn-grid-bigger-height;
@@ -128103,6 +128348,7 @@ $nodata-border-color: $flyout-bg-color !default;
     &.e-multicolumn-list .e-popup-footer {
       font-size: 14px;
     }
+    &.e-multicolumn-list .e-popup-footer,
     .e-multicolumn-grid .e-row,
     .e-multicolumn-grid .e-emptyrow {
       height: $multicolumn-grid-bigger-small-height;