@progress/kendo-theme-material 6.1.1-dev.53 → 6.1.1-dev.66

package/dist/all.scss

@@ -6187,326 +6187,7 @@ $kendo-invalid-shadow: null !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
-
-
-// Dependencies
-
-
-// Component
-// #region @import "./_variables.scss"; -> scss/typography/_variables.scss
-// Typography
-
-
-// Headings
-$kendo-h1-font-size: 96px !default;
-$kendo-h2-font-size: 60px !default;
-$kendo-h3-font-size: 48px !default;
-$kendo-h4-font-size: 34px !default;
-$kendo-h5-font-size: 24px !default;
-$kendo-h6-font-size: 20px !default;
-
-$kendo-h1-font-family: $kendo-font-family !default;
-$kendo-h2-font-family: $kendo-font-family !default;
-$kendo-h3-font-family: $kendo-font-family !default;
-$kendo-h4-font-family: $kendo-font-family !default;
-$kendo-h5-font-family: $kendo-font-family !default;
-$kendo-h6-font-family: $kendo-font-family !default;
-
-$kendo-h1-line-height: 96px !default;
-$kendo-h2-line-height: 60px !default;
-$kendo-h3-line-height: 50px !default;
-$kendo-h4-line-height: 40px !default;
-$kendo-h5-line-height: 32px !default;
-$kendo-h6-line-height: 32px !default;
-
-$kendo-h1-font-weight: $kendo-font-weight-light !default;
-$kendo-h2-font-weight: $kendo-font-weight-light !default;
-$kendo-h3-font-weight: $kendo-font-weight-normal !default;
-$kendo-h4-font-weight: $kendo-font-weight-normal !default;
-$kendo-h5-font-weight: $kendo-font-weight-normal !default;
-$kendo-h6-font-weight: $kendo-font-weight-medium !default;
-
-$kendo-h1-letter-spacing: -1.5px !default;
-$kendo-h2-letter-spacing: -.5px !default;
-$kendo-h3-letter-spacing: 0px !default;
-$kendo-h4-letter-spacing: .25px !default;
-$kendo-h5-letter-spacing: 0px !default;
-$kendo-h6-letter-spacing: .15px !default;
-
-$kendo-h1-margin: 0 0 12px !default;
-$kendo-h2-margin: 0 0 12px !default;
-$kendo-h3-margin: 0 0 12px !default;
-$kendo-h4-margin: 0 0 12px !default;
-$kendo-h5-margin: 0 0 12px !default;
-$kendo-h6-margin: 0 0 12px !default;
-
-
-// Paragraph
-$kendo-paragraph-margin: 0 0 12px !default;
-$kendo-paragraph-font-size: 1rem !default;
-$kendo-paragraph-font-family: $kendo-font-family !default;
-$kendo-paragraph-line-height: $kendo-line-height-lg !default;
-$kendo-paragraph-font-weight: $kendo-font-weight-normal !default;
-$kendo-paragraph-letter-spacing: .03125em !default;
-
-
-// Code
-$kendo-code-font-size: $kendo-font-size-md !default;
-$kendo-code-font-family: $kendo-font-family-monospace !default;
-$kendo-code-line-height: $kendo-line-height-md !default;
-$kendo-code-font-weight: $kendo-font-weight-normal !default;
-$kendo-code-letter-spacing: null !default;
-
-$kendo-code-padding-x: 4px !default;
-$kendo-code-padding-y: 0px !default;
-$kendo-pre-padding-x: 24px !default;
-$kendo-pre-padding-y: 16px !default;
-$kendo-code-border-width: 1px !default;
-
-$kendo-code-bg: $kendo-base-bg !default;
-$kendo-code-text: $kendo-component-text !default;
-$kendo-code-border: $kendo-component-border !default;
-
-
-// Display
-$kendo-display1-font-size: 112px !default;
-$kendo-display2-font-size: 56px !default;
-$kendo-display3-font-size: 45px !default;
-$kendo-display4-font-size: 34px !default;
-
-$kendo-display1-font-family: $kendo-font-family !default;
-$kendo-display2-font-family: $kendo-font-family !default;
-$kendo-display3-font-family: $kendo-font-family !default;
-$kendo-display4-font-family: $kendo-font-family !default;
-
-$kendo-display1-line-height: 1.2 !default;
-$kendo-display2-line-height: 1.2 !default;
-$kendo-display3-line-height: 1.2 !default;
-$kendo-display4-line-height: 1.2 !default;
-
-$kendo-display1-font-weight: $kendo-font-weight-light !default;
-$kendo-display2-font-weight: $kendo-font-weight-normal !default;
-$kendo-display3-font-weight: $kendo-font-weight-normal !default;
-$kendo-display4-font-weight: $kendo-font-weight-normal !default;
-
-$kendo-display1-letter-spacing: null !default;
-$kendo-display2-letter-spacing: null !default;
-$kendo-display3-letter-spacing: null !default;
-$kendo-display4-letter-spacing: null !default;
-
-// #endregion
-// #region @import "./_layout.scss"; -> scss/typography/_layout.scss
-// #region @import "@progress/kendo-theme-default/scss/typography/_layout.scss"; -> node_modules/@progress/kendo-theme-default/scss/typography/_layout.scss
-@include exports( "typography/layout" ) {
-
-    @if $kendo-enable-typography {
-        body { @extend .k-body !optional; }
-        h1 { @extend .k-h1 !optional; }
-        h2 { @extend .k-h2 !optional; }
-        h3 { @extend .k-h3 !optional; }
-        h4 { @extend .k-h4 !optional; }
-        h5 { @extend .k-h5 !optional; }
-        h6 { @extend .k-h6 !optional; }
-        p { @extend .k-paragraph !optional; }
-        pre { @extend .k-pre !optional; }
-        code { @extend .k-code !optional; }
-    }
-
-    // TODO delete k-typography class for R1 2022
-    .k-body,
-    .k-typography {
-        @include typography(
-            $kendo-font-size-md,
-            $kendo-font-family,
-            $kendo-line-height-md,
-            $kendo-font-weight-normal,
-            $kendo-letter-spacing
-        );
-        margin: 0;
-
-        p {
-            margin: $kendo-paragraph-margin;
-        }
-    }
-
-    // Headings
-    .k-h1 {
-        @include typography(
-            $kendo-h1-font-size,
-            $kendo-h1-font-family,
-            $kendo-h1-line-height,
-            $kendo-h1-font-weight,
-            $kendo-h1-letter-spacing
-        );
-        margin: $kendo-h1-margin;
-    }
-    .k-h2 {
-        @include typography(
-            $kendo-h2-font-size,
-            $kendo-h2-font-family,
-            $kendo-h2-line-height,
-            $kendo-h2-font-weight,
-            $kendo-h2-letter-spacing
-        );
-        margin: $kendo-h2-margin;
-    }
-    .k-h3 {
-        @include typography(
-            $kendo-h3-font-size,
-            $kendo-h3-font-family,
-            $kendo-h3-line-height,
-            $kendo-h3-font-weight,
-            $kendo-h3-letter-spacing
-        );
-        margin: $kendo-h3-margin;
-    }
-    .k-h4 {
-        @include typography(
-            $kendo-h4-font-size,
-            $kendo-h4-font-family,
-            $kendo-h4-line-height,
-            $kendo-h4-font-weight,
-            $kendo-h4-letter-spacing
-        );
-        margin: $kendo-h4-margin;
-    }
-    .k-h5 {
-        @include typography(
-            $kendo-h5-font-size,
-            $kendo-h5-font-family,
-            $kendo-h5-line-height,
-            $kendo-h5-font-weight,
-            $kendo-h5-letter-spacing
-        );
-        margin: $kendo-h5-margin;
-    }
-    .k-h6 {
-        @include typography(
-            $kendo-h6-font-size,
-            $kendo-h6-font-family,
-            $kendo-h6-line-height,
-            $kendo-h6-font-weight,
-            $kendo-h6-letter-spacing
-        );
-        margin: $kendo-h6-margin;
-    }
-
-    // Paragraph
-    .k-paragraph {
-        @include typography(
-            $kendo-paragraph-font-size,
-            $kendo-paragraph-font-family,
-            $kendo-paragraph-line-height,
-            $kendo-paragraph-font-weight,
-            $kendo-paragraph-letter-spacing
-        );
-        margin: $kendo-paragraph-margin;
-    }
-
-    // Code snippet
-    .k-pre,
-    .k-code {
-        @include typography(
-            $kendo-code-font-size,
-            $kendo-code-font-family,
-            $kendo-code-line-height,
-            $kendo-code-font-weight,
-            $kendo-code-letter-spacing
-        );
-        border-style: solid;
-        border-width: $kendo-code-border-width;
-    }
-
-    .k-pre {
-        padding-block: $kendo-pre-padding-y;
-        padding-inline: $kendo-pre-padding-x;
-        overflow: auto;
-    }
-
-    .k-pre > .k-code {
-        padding: 0;
-        border-width: 0;
-        border-color: transparent;
-        background-color: transparent;
-        font-family: inherit;
-        font-size: inherit;
-    }
-
-    .k-code {
-        padding-block: $kendo-code-padding-y;
-        padding-inline: $kendo-code-padding-x;
-    }
-
-    // Display
-    .k-display-1 {
-        @include typography(
-            $kendo-display1-font-size,
-            $kendo-display1-font-family,
-            $kendo-display1-line-height,
-            $kendo-display1-font-weight,
-            $kendo-display1-letter-spacing
-        );
-    }
-    .k-display-2 {
-        @include typography(
-            $kendo-display2-font-size,
-            $kendo-display2-font-family,
-            $kendo-display2-line-height,
-            $kendo-display2-font-weight,
-            $kendo-display2-letter-spacing
-        );
-    }
-    .k-display-3 {
-        @include typography(
-            $kendo-display3-font-size,
-            $kendo-display3-font-family,
-            $kendo-display3-line-height,
-            $kendo-display3-font-weight,
-            $kendo-display3-letter-spacing
-        );
-    }
-    .k-display-4 {
-        @include typography(
-            $kendo-display4-font-size,
-            $kendo-display4-font-family,
-            $kendo-display4-line-height,
-            $kendo-display4-font-weight,
-            $kendo-display4-letter-spacing
-        );
-    }
-}
-
-// #endregion
-
-// #endregion
-// #region @import "./_theme.scss"; -> scss/typography/_theme.scss
-// #region @import "@progress/kendo-theme-default/scss/typography/_theme.scss"; -> node_modules/@progress/kendo-theme-default/scss/typography/_theme.scss
-@include exports("typography/theme") {
-
-    .k-body {
-        @include fill(
-            $kendo-body-text,
-            $kendo-body-bg
-        );
-    }
-
-    // Code snippet
-    .k-pre,
-    .k-code {
-        @include fill(
-            $kendo-code-text,
-            $kendo-code-bg,
-            $kendo-code-border
-        );
-    }
-}
-
-// #endregion
-
-// #endregion
-
-// #endregion
-// #region @import "./utils/_index.scss"; -> scss/utils/_index.scss
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
@@ -9464,11 +9145,336 @@ $kendo-utils: (
 // #endregion
 
 
+// Dependencies
+
+
+// Component
+// #region @import "./_variables.scss"; -> scss/typography/_variables.scss
+// Typography
+
+
+// Headings
+$kendo-h1-font-size: 96px !default;
+$kendo-h2-font-size: 60px !default;
+$kendo-h3-font-size: 48px !default;
+$kendo-h4-font-size: 34px !default;
+$kendo-h5-font-size: 24px !default;
+$kendo-h6-font-size: 20px !default;
+
+$kendo-h1-font-family: $kendo-font-family !default;
+$kendo-h2-font-family: $kendo-font-family !default;
+$kendo-h3-font-family: $kendo-font-family !default;
+$kendo-h4-font-family: $kendo-font-family !default;
+$kendo-h5-font-family: $kendo-font-family !default;
+$kendo-h6-font-family: $kendo-font-family !default;
+
+$kendo-h1-line-height: 96px !default;
+$kendo-h2-line-height: 60px !default;
+$kendo-h3-line-height: 50px !default;
+$kendo-h4-line-height: 40px !default;
+$kendo-h5-line-height: 32px !default;
+$kendo-h6-line-height: 32px !default;
+
+$kendo-h1-font-weight: $kendo-font-weight-light !default;
+$kendo-h2-font-weight: $kendo-font-weight-light !default;
+$kendo-h3-font-weight: $kendo-font-weight-normal !default;
+$kendo-h4-font-weight: $kendo-font-weight-normal !default;
+$kendo-h5-font-weight: $kendo-font-weight-normal !default;
+$kendo-h6-font-weight: $kendo-font-weight-medium !default;
+
+$kendo-h1-letter-spacing: -1.5px !default;
+$kendo-h2-letter-spacing: -.5px !default;
+$kendo-h3-letter-spacing: 0px !default;
+$kendo-h4-letter-spacing: .25px !default;
+$kendo-h5-letter-spacing: 0px !default;
+$kendo-h6-letter-spacing: .15px !default;
+
+$kendo-h1-margin: 0 0 12px !default;
+$kendo-h2-margin: 0 0 12px !default;
+$kendo-h3-margin: 0 0 12px !default;
+$kendo-h4-margin: 0 0 12px !default;
+$kendo-h5-margin: 0 0 12px !default;
+$kendo-h6-margin: 0 0 12px !default;
+
+
+// Paragraph
+$kendo-paragraph-margin: 0 0 12px !default;
+$kendo-paragraph-font-size: 1rem !default;
+$kendo-paragraph-font-family: $kendo-font-family !default;
+$kendo-paragraph-line-height: $kendo-line-height-lg !default;
+$kendo-paragraph-font-weight: $kendo-font-weight-normal !default;
+$kendo-paragraph-letter-spacing: .03125em !default;
+
+
+// Code
+$kendo-code-font-size: $kendo-font-size-md !default;
+$kendo-code-font-family: $kendo-font-family-monospace !default;
+$kendo-code-line-height: $kendo-line-height-md !default;
+$kendo-code-font-weight: $kendo-font-weight-normal !default;
+$kendo-code-letter-spacing: null !default;
+
+$kendo-code-padding-x: 4px !default;
+$kendo-code-padding-y: 0px !default;
+$kendo-pre-padding-x: 24px !default;
+$kendo-pre-padding-y: 16px !default;
+$kendo-code-border-width: 1px !default;
+
+$kendo-code-bg: $kendo-base-bg !default;
+$kendo-code-text: $kendo-component-text !default;
+$kendo-code-border: $kendo-component-border !default;
+
+
+// Display
+$kendo-display1-font-size: 112px !default;
+$kendo-display2-font-size: 56px !default;
+$kendo-display3-font-size: 45px !default;
+$kendo-display4-font-size: 34px !default;
+
+$kendo-display1-font-family: $kendo-font-family !default;
+$kendo-display2-font-family: $kendo-font-family !default;
+$kendo-display3-font-family: $kendo-font-family !default;
+$kendo-display4-font-family: $kendo-font-family !default;
+
+$kendo-display1-line-height: 1.2 !default;
+$kendo-display2-line-height: 1.2 !default;
+$kendo-display3-line-height: 1.2 !default;
+$kendo-display4-line-height: 1.2 !default;
+
+$kendo-display1-font-weight: $kendo-font-weight-light !default;
+$kendo-display2-font-weight: $kendo-font-weight-normal !default;
+$kendo-display3-font-weight: $kendo-font-weight-normal !default;
+$kendo-display4-font-weight: $kendo-font-weight-normal !default;
+
+$kendo-display1-letter-spacing: null !default;
+$kendo-display2-letter-spacing: null !default;
+$kendo-display3-letter-spacing: null !default;
+$kendo-display4-letter-spacing: null !default;
+
+// #endregion
+// #region @import "./_layout.scss"; -> scss/typography/_layout.scss
+// #region @import "@progress/kendo-theme-default/scss/typography/_layout.scss"; -> node_modules/@progress/kendo-theme-default/scss/typography/_layout.scss
+@include exports( "typography/layout" ) {
+
+    @if $kendo-enable-typography {
+        body { @extend .k-body !optional; }
+        h1 { @extend .k-h1 !optional; }
+        h2 { @extend .k-h2 !optional; }
+        h3 { @extend .k-h3 !optional; }
+        h4 { @extend .k-h4 !optional; }
+        h5 { @extend .k-h5 !optional; }
+        h6 { @extend .k-h6 !optional; }
+        p { @extend .k-paragraph !optional; }
+        pre { @extend .k-pre !optional; }
+        code { @extend .k-code !optional; }
+    }
+
+    // TODO delete k-typography class for R1 2022
+    .k-body,
+    .k-typography {
+        @include typography(
+            $kendo-font-size-md,
+            $kendo-font-family,
+            $kendo-line-height-md,
+            $kendo-font-weight-normal,
+            $kendo-letter-spacing
+        );
+        margin: 0;
+
+        p {
+            margin: $kendo-paragraph-margin;
+        }
+    }
+
+    // Headings
+    .k-h1 {
+        @include typography(
+            $kendo-h1-font-size,
+            $kendo-h1-font-family,
+            $kendo-h1-line-height,
+            $kendo-h1-font-weight,
+            $kendo-h1-letter-spacing
+        );
+        margin: $kendo-h1-margin;
+    }
+    .k-h2 {
+        @include typography(
+            $kendo-h2-font-size,
+            $kendo-h2-font-family,
+            $kendo-h2-line-height,
+            $kendo-h2-font-weight,
+            $kendo-h2-letter-spacing
+        );
+        margin: $kendo-h2-margin;
+    }
+    .k-h3 {
+        @include typography(
+            $kendo-h3-font-size,
+            $kendo-h3-font-family,
+            $kendo-h3-line-height,
+            $kendo-h3-font-weight,
+            $kendo-h3-letter-spacing
+        );
+        margin: $kendo-h3-margin;
+    }
+    .k-h4 {
+        @include typography(
+            $kendo-h4-font-size,
+            $kendo-h4-font-family,
+            $kendo-h4-line-height,
+            $kendo-h4-font-weight,
+            $kendo-h4-letter-spacing
+        );
+        margin: $kendo-h4-margin;
+    }
+    .k-h5 {
+        @include typography(
+            $kendo-h5-font-size,
+            $kendo-h5-font-family,
+            $kendo-h5-line-height,
+            $kendo-h5-font-weight,
+            $kendo-h5-letter-spacing
+        );
+        margin: $kendo-h5-margin;
+    }
+    .k-h6 {
+        @include typography(
+            $kendo-h6-font-size,
+            $kendo-h6-font-family,
+            $kendo-h6-line-height,
+            $kendo-h6-font-weight,
+            $kendo-h6-letter-spacing
+        );
+        margin: $kendo-h6-margin;
+    }
+
+    // Paragraph
+    .k-paragraph {
+        @include typography(
+            $kendo-paragraph-font-size,
+            $kendo-paragraph-font-family,
+            $kendo-paragraph-line-height,
+            $kendo-paragraph-font-weight,
+            $kendo-paragraph-letter-spacing
+        );
+        margin: $kendo-paragraph-margin;
+    }
+
+    // Code snippet
+    .k-pre,
+    .k-code {
+        @include typography(
+            $kendo-code-font-size,
+            $kendo-code-font-family,
+            $kendo-code-line-height,
+            $kendo-code-font-weight,
+            $kendo-code-letter-spacing
+        );
+        border-style: solid;
+        border-width: $kendo-code-border-width;
+    }
+
+    .k-pre {
+        padding-block: $kendo-pre-padding-y;
+        padding-inline: $kendo-pre-padding-x;
+        overflow: auto;
+    }
+
+    .k-pre > .k-code {
+        padding: 0;
+        border-width: 0;
+        border-color: transparent;
+        background-color: transparent;
+        font-family: inherit;
+        font-size: inherit;
+    }
+
+    .k-code {
+        padding-block: $kendo-code-padding-y;
+        padding-inline: $kendo-code-padding-x;
+    }
+
+    // Display
+    .k-display-1 {
+        @include typography(
+            $kendo-display1-font-size,
+            $kendo-display1-font-family,
+            $kendo-display1-line-height,
+            $kendo-display1-font-weight,
+            $kendo-display1-letter-spacing
+        );
+    }
+    .k-display-2 {
+        @include typography(
+            $kendo-display2-font-size,
+            $kendo-display2-font-family,
+            $kendo-display2-line-height,
+            $kendo-display2-font-weight,
+            $kendo-display2-letter-spacing
+        );
+    }
+    .k-display-3 {
+        @include typography(
+            $kendo-display3-font-size,
+            $kendo-display3-font-family,
+            $kendo-display3-line-height,
+            $kendo-display3-font-weight,
+            $kendo-display3-letter-spacing
+        );
+    }
+    .k-display-4 {
+        @include typography(
+            $kendo-display4-font-size,
+            $kendo-display4-font-family,
+            $kendo-display4-line-height,
+            $kendo-display4-font-weight,
+            $kendo-display4-letter-spacing
+        );
+    }
+}
+
+// #endregion
+
+// #endregion
+// #region @import "./_theme.scss"; -> scss/typography/_theme.scss
+// #region @import "@progress/kendo-theme-default/scss/typography/_theme.scss"; -> node_modules/@progress/kendo-theme-default/scss/typography/_theme.scss
+@include exports("typography/theme") {
+
+    .k-body {
+        @include fill(
+            $kendo-body-text,
+            $kendo-body-bg
+        );
+    }
+
+    // Code snippet
+    .k-pre,
+    .k-code {
+        @include fill(
+            $kendo-code-text,
+            $kendo-code-bg,
+            $kendo-code-border
+        );
+    }
+}
+
+// #endregion
+
+// #endregion
+
+// #endregion
+// #region @import "./utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
+
+
 // Generic content
 // #region @import "./icons/_index.scss"; -> scss/icons/_index.scss
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -10771,9 +10777,9 @@ $ki-rotate-map: (
     .k-rtl .k-i-indent-increase,
     .k-rtl .k-i-indent-decrease,
     .k-rtl .k-i-caret-alt-right,
-    .k-rtl .k-i-caret-alt-down,
+    .k-rtl .k-i-caret-alt-left,
     [dir="rtl"] .k-i-caret-alt-right,
-    [dir="rtl"] .k-i-caret-alt-down {
+    [dir="rtl"] .k-i-caret-alt-left {
         transform: scaleX(-1);
     }
 
@@ -10805,6 +10811,9 @@ $ki-rotate-map: (
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -10890,6 +10899,9 @@ $kendo-message-box-link-text-decoration: underline !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -11081,6 +11093,9 @@ $kendo-drop-hint-bg: $kendo-color-primary !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -11091,6 +11106,9 @@ $kendo-drop-hint-bg: $kendo-color-primary !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -12226,6 +12244,9 @@ $kendo-checkbox-ripple-opacity: .2 !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -12419,7 +12440,8 @@ $kendo-listgroup-item-border-width: 1px !default;
                     right: auto;
                     left: 0;
 
-                    .k-icon {
+                    .k-icon,
+                    .k-svg-icon {
                         transform: scaleX(-1);
                     }
                 }
@@ -12438,7 +12460,8 @@ $kendo-listgroup-item-border-width: 1px !default;
                 border-right-width: 1px;
                 border-left-width: 0;
 
-                .k-icon {
+                .k-icon,
+                .k-svg-icon {
                     transform: scaleX(-1);
                 }
             }
@@ -12489,6 +12512,9 @@ $kendo-listgroup-item-border-width: 1px !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -12549,6 +12575,9 @@ $kendo-overlay-opacity: .32 !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -12672,6 +12701,9 @@ $kendo-popup-shadow: 0 2px 4px -1px rgba( $elevation, .2 ), 0 4px 5px 0 rgba( $e
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -12755,6 +12787,9 @@ $kendo-popup-shadow: 0 2px 4px -1px rgba( $elevation, .2 ), 0 4px 5px 0 rgba( $e
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -13333,6 +13368,9 @@ $kendo-table-selected-border: null !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -13402,6 +13440,9 @@ $kendo-table-selected-border: null !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -13559,6 +13600,9 @@ $kendo-avatar-theme-colors: $kendo-theme-colors !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -13829,6 +13873,9 @@ $kendo-badge-sizes: (
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -14626,6 +14673,9 @@ $kendo-chip-list-sizes: (
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -14767,6 +14817,9 @@ $kendo-color-preview-transparent-color-image: url("data:image/png;base64,iVBORw0
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -14777,6 +14830,7 @@ $kendo-color-preview-transparent-color-image: url("data:image/png;base64,iVBORw0
 // File already imported_once. Skipping output.
 // #endregion
 
+
 // Component
 // #region @import "./_variables.scss"; -> scss/loader/_variables.scss
 // Loader
@@ -15478,6 +15532,9 @@ $kendo-loading-opacity: .3 !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -15637,6 +15694,9 @@ $kendo-skeleton-wave-bg: rgba( black, .04 ) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies // TODO: extract variables
@@ -15647,6 +15707,9 @@ $kendo-skeleton-wave-bg: rgba( black, .04 ) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -15657,6 +15720,9 @@ $kendo-skeleton-wave-bg: rgba( black, .04 ) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -16517,6 +16583,9 @@ $kendo-skeleton-wave-bg: rgba( black, .04 ) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -17856,6 +17925,9 @@ $kendo-toolbar-sizes: (
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -18896,6 +18968,9 @@ $kendo-form-sizes: (
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -18906,6 +18981,9 @@ $kendo-form-sizes: (
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -18979,7 +19057,8 @@ $kendo-form-sizes: (
         margin-inline-start: $kendo-icon-spacing;
         flex-shrink: 0;
 
-        .k-icon {
+        .k-icon,
+        .k-svg-icon {
             color: inherit;
             vertical-align: top;
         }
@@ -19176,6 +19255,9 @@ $kendo-form-sizes: (
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -19186,6 +19268,9 @@ $kendo-form-sizes: (
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -19422,7 +19507,9 @@ $kendo-form-sizes: (
     .k-input-validation-icon,
     .k-input-loading-icon,
     .k-input-prefix > .k-icon,
-    .k-input-suffix > .k-icon {
+    .k-input-prefix > .k-svg-icon,
+    .k-input-suffix > .k-icon,
+    .k-input-suffix > .k-svg-icon {
         flex: none;
         align-self: center;
         display: inline-flex;
@@ -19544,10 +19631,12 @@ $kendo-form-sizes: (
                 min-height: auto !important; // sass-lint:disable-line no-important
             }
         }
-        .k-spinner-increase .k-icon {
+        .k-spinner-increase .k-icon,
+        .k-spinner-increase .k-svg-icon {
             bottom: if( $kendo-use-input-spinner-icon-offset, calc( -1 * #{$kendo-input-spinner-icon-offset}), auto );
         }
-        .k-spinner-decrease .k-icon {
+        .k-spinner-decrease .k-icon,
+        .k-spinner-decrease .k-svg-icon {
             top: if( $kendo-use-input-spinner-icon-offset, calc( -1 * #{$kendo-input-spinner-icon-offset}), auto );
         }
     }
@@ -19634,7 +19723,9 @@ $kendo-form-sizes: (
             .k-input-loading-icon,
             .k-clear-value,
             .k-input-prefix > .k-icon,
-            .k-input-suffix > .k-icon {
+            .k-input-prefix > .k-svg-icon,
+            .k-input-suffix > .k-icon,
+            .k-input-suffix > .k-svg-icon {
                 width: $_icon-size;
                 height: $_icon-size;
             }
@@ -20498,6 +20589,9 @@ $kendo-floating-label-focus-text: $kendo-color-primary !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -20592,6 +20686,9 @@ $kendo-split-button-lg-arrow-padding-y: $kendo-button-lg-padding-y !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -20663,6 +20760,9 @@ $kendo-menu-button-arrow-padding-x: k-map-get( $kendo-spacing, 1 ) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -20711,6 +20811,9 @@ $kendo-menu-button-arrow-padding-x: k-map-get( $kendo-spacing, 1 ) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -20763,6 +20866,9 @@ $kendo-menu-button-arrow-padding-x: k-map-get( $kendo-spacing, 1 ) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -20976,6 +21082,9 @@ $kendo-listbox-drop-hint-width: 2px !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -21510,6 +21619,9 @@ $kendo-circular-progressbar-scale-stroke: $kendo-progressbar-bg !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -22019,6 +22131,9 @@ $kendo-radio-ripple-opacity: .2 !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -22084,6 +22199,12 @@ $kendo-slider-track-bg: k-try-tint( $kendo-color-primary, 8 ) !default;
 $kendo-slider-selection-bg: $kendo-color-primary !default;
 $kendo-slider-disabled-opacity: .65 !default;
 
+// #endregion
+// #region @import "./images/slider-h.scss"; -> scss/slider/images/slider-h.scss
+
+// #endregion
+// #region @import "./images/slider-v.scss"; -> scss/slider/images/slider-v.scss
+
 // #endregion
 // #region @import "./_layout.scss"; -> scss/slider/_layout.scss
 // #region @import "@progress/kendo-theme-default/scss/slider/_layout.scss"; -> node_modules/@progress/kendo-theme-default/scss/slider/_layout.scss
@@ -22427,7 +22548,9 @@ $kendo-slider-disabled-opacity: .65 !default;
             }
 
             .k-button-increase .k-icon,
-            .k-button-decrease .k-icon {
+            .k-button-increase .k-svg-icon,
+            .k-button-decrease .k-icon,
+            .k-button-decrease .k-svg-icon {
                 transform: scaleX(-1);
             }
         }
@@ -22713,6 +22836,9 @@ $kendo-slider-disabled-opacity: .65 !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -23691,6 +23817,9 @@ $kendo-calendar-sizes: (
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -24150,6 +24279,9 @@ $kendo-time-selector-sizes: (
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -24208,6 +24340,9 @@ $kendo-time-selector-sizes: (
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -24347,6 +24482,9 @@ $kendo-captcha-validation-message-font-style: italic !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -24465,6 +24603,9 @@ $kendo-color-palette-tile-selected-shadow: 0 1px 3px 1px rgba( black, .3 ), inse
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -24489,6 +24630,9 @@ $kendo-color-palette-tile-selected-shadow: 0 1px 3px 1px rgba( black, .3 ), inse
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -24770,12 +24914,14 @@ $kendo-color-gradient-contrast-spacer: k-map-get( $kendo-spacing, 2 ) !default;
             align-items: center;
             gap: k-math-div( $kendo-color-gradient-contrast-spacer, 2 );
 
-            .k-icon {
+            .k-icon,
+            .k-svg-icon {
                 vertical-align: middle;
             }
 
             // Needed for the double check icons
             .k-icon + .k-icon,
+            .k-svg-icon + .k-svg-icon,
             .k-icon-wrapper-host + .k-icon-wrapper-host .k-icon {
                 margin-inline-start: -13px;
             }
@@ -24887,6 +25033,9 @@ $kendo-color-gradient-contrast-spacer: k-map-get( $kendo-spacing, 2 ) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -24906,6 +25055,7 @@ $kendo-color-gradient-contrast-spacer: k-map-get( $kendo-spacing, 2 ) !default;
 // File already imported_once. Skipping output.
 // #endregion
 
+
 // Component
 // #region @import "./_variables.scss"; -> scss/coloreditor/_variables.scss
 // Coloreditor/FlatColorPicker
@@ -25065,6 +25215,9 @@ $kendo-color-editor-color-gradient-focus-outline-offset: 2px !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -25127,6 +25280,9 @@ $kendo-color-editor-color-gradient-focus-outline-offset: 2px !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -25185,6 +25341,9 @@ $kendo-color-editor-color-gradient-focus-outline-offset: 2px !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -25228,6 +25387,9 @@ $kendo-color-editor-color-gradient-focus-outline-offset: 2px !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -25277,6 +25439,9 @@ $kendo-color-editor-color-gradient-focus-outline-offset: 2px !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -25332,6 +25497,9 @@ $kendo-color-editor-color-gradient-focus-outline-offset: 2px !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -25445,6 +25613,9 @@ $kendo-datetime-width: calc( #{$kendo-calendar-cell-size * 8} + #{$kendo-infinit
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -25535,6 +25706,9 @@ $kendo-daterange-picker-input-width: 10em !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -25601,6 +25775,9 @@ $kendo-daterange-picker-input-width: 10em !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -25691,6 +25868,9 @@ $kendo-daterange-picker-input-width: 10em !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -25707,6 +25887,9 @@ $kendo-daterange-picker-input-width: 10em !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -25771,6 +25954,9 @@ $kendo-daterange-picker-input-width: 10em !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -26041,6 +26227,7 @@ $kendo-treeview-loadmore-focus-shadow: $kendo-treeview-item-focus-shadow !defaul
         position: relative;
 
         .k-icon,
+        .k-svg-icon,
         .k-image,
         .k-sprite {
             margin-right: $kendo-icon-spacing;
@@ -26091,6 +26278,7 @@ $kendo-treeview-loadmore-focus-shadow: $kendo-treeview-item-focus-shadow !defaul
         .k-treeview-leaf,
         .k-in {
             .k-icon,
+            .k-svg-icon,
             .k-image,
             .k-sprite {
                 margin-right: 0;
@@ -26309,19 +26497,22 @@ $kendo-dropdowntree-popup-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
 // #region @import "../common/_index.scss"; -> scss/common/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
-// #region @import "../icons/_index.scss"; -> scss/icons/_index.scss
+// #region @import "../input/_index.scss"; -> scss/input/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
 // #region @import "../floating-label/_index.scss"; -> scss/floating-label/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
-// #region @import "../input/_index.scss"; -> scss/input/_index.scss
+// #region @import "../icons/_index.scss"; -> scss/icons/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
 
@@ -26367,6 +26558,9 @@ $kendo-dropdowntree-popup-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -26460,6 +26654,10 @@ $kendo-rating-icon-focus-selected-shadow: 0 2px 4px rgba( black, .1) !default;
             .k-icon {
                 font-size: $kendo-rating-icon-size;
             }
+            .k-svg-icon {
+                width: $kendo-rating-icon-size;
+                height: $kendo-rating-icon-size;
+            }
 
             .k-rating-precision-part,
             .k-rating-precision-complement {
@@ -26519,10 +26717,16 @@ $kendo-rating-icon-focus-selected-shadow: 0 2px 4px rgba( black, .1) !default;
                 > .k-icon {
                     text-shadow: $kendo-rating-icon-focus-shadow;
                 }
+                > .k-svg-icon {
+                    filter: drop-shadow( $kendo-rating-icon-focus-shadow );
+                }
 
                 &.k-selected > .k-icon {
                     text-shadow: $kendo-rating-icon-focus-selected-shadow;
                 }
+                &.k-selected > .k-svg-icon {
+                    filter: drop-shadow( $kendo-rating-icon-focus-selected-shadow );
+                }
             }
         }
     }
@@ -26556,6 +26760,9 @@ $kendo-rating-icon-focus-selected-shadow: 0 2px 4px rgba( black, .1) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -26605,6 +26812,9 @@ $kendo-rating-icon-focus-selected-shadow: 0 2px 4px rgba( black, .1) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -27209,6 +27419,9 @@ $kendo-switch-on-thumb-hover-gradient: null !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -27228,6 +27441,9 @@ $kendo-switch-on-thumb-hover-gradient: null !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -27301,6 +27517,11 @@ $kendo-dropzone-note-text: $kendo-subtle-text !default;
             font-size: $kendo-dropzone-icon-size;
         }
 
+        .k-svg-icon {
+            width: $kendo-dropzone-icon-size;
+            height: $kendo-dropzone-icon-size;
+        }
+
         .k-dropzone-hint {
             margin-bottom: $kendo-dropzone-hint-spacing;
             font-size: $kendo-dropzone-hint-font-size;
@@ -27468,7 +27689,8 @@ $kendo-upload-focus-shadow: 0 0 0 2px rgba( black, .13 ) !default;
                 align-items: center;
                 position: relative;
 
-                > .k-icon {
+                > .k-icon,
+                > .k-svg-icon {
                     margin-inline-end: $kendo-upload-icon-spacing;
                 }
             }
@@ -27800,6 +28022,9 @@ $kendo-upload-focus-shadow: 0 0 0 2px rgba( black, .13 ) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -27992,6 +28217,9 @@ $kendo-appbar-bottom-box-shadow: 0px -2px 3px rgba( black, .24 ) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -28449,6 +28677,9 @@ $kendo-fab-item-active-shadow: $kendo-fab-active-shadow !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -29037,25 +29268,22 @@ $kendo-adaptive-actionsheet-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !de
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
 // #region @import "../common/_index.scss"; -> scss/common/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
-// #region @import "../forms/_index.scss"; -> scss/forms/_index.scss
-// File already imported_once. Skipping output.
-// #endregion
-// #region @import "../button/_index.scss"; -> scss/button/_index.scss
-// File already imported_once. Skipping output.
-// #endregion
-// #region @import "../action-buttons/_index.scss"; -> scss/action-buttons/_index.scss
-// File already imported_once. Skipping output.
-// #endregion
 // #region @import "../window/_index.scss"; -> scss/window/_index.scss
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -29304,9 +29532,6 @@ $kendo-adaptive-actionsheet-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !de
 // #endregion
 
 // #endregion
-// #region @import "../icons/_index.scss"; -> scss/icons/_index.scss
-// File already imported_once. Skipping output.
-// #endregion
 
 
 // Component
@@ -29447,6 +29672,9 @@ $kendo-dialog-theme-colors: (
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -29844,6 +30072,9 @@ $kendo-drawer-selected-hover-text: $kendo-color-secondary !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -30034,19 +30265,22 @@ $kendo-notification-theme: notification-theme( $kendo-notification-theme-colors
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
 // #region @import "../common/_index.scss"; -> scss/common/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
-// #region @import "../popup/_index.scss"; -> scss/popup/_index.scss
-// File already imported_once. Skipping output.
-// #endregion
 // #region @import "../card/_index.scss"; -> scss/card/_index.scss
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -30634,6 +30868,9 @@ $kendo-card-callout-height: 20px !default;
 // #endregion
 
 // #endregion
+// #region @import "../popup/_index.scss"; -> scss/popup/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Component
@@ -30819,6 +31056,9 @@ $kendo-popover-callout-border: $kendo-popover-border !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -30916,6 +31156,9 @@ $kendo-popover-callout-border: $kendo-popover-border !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -31141,6 +31384,9 @@ $kendo-bottom-nav-flat-border: $kendo-component-border !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -31308,12 +31554,13 @@ $kendo-breadcrumb-focus-shadow: 0 0 2px 1px rgba( black, .06 ) !default;
     }
 
     .k-breadcrumb-root-link {
-        margin-right: $kendo-breadcrumb-root-link-spacing;
+        margin-inline-end: $kendo-breadcrumb-root-link-spacing;
     }
 
     .k-breadcrumb-link > .k-image,
-    .k-breadcrumb-icontext-link .k-icon {
-        margin-right: $kendo-breadcrumb-link-icon-spacing;
+    .k-breadcrumb-icontext-link .k-icon,
+    .k-breadcrumb-icontext-link .k-svg-icon {
+        margin-inline-end: $kendo-breadcrumb-link-icon-spacing;
     }
 
     .k-breadcrumb-icon-link {
@@ -31340,26 +31587,6 @@ $kendo-breadcrumb-focus-shadow: 0 0 2px 1px rgba( black, .06 ) !default;
         }
     }
 
-    @include exports("breadcrumb/layout/rtl") {
-
-        .k-breadcrumb {
-            &[dir="rtl"],
-            .k-rtl & {
-                .k-breadcrumb-root-link {
-                    margin-right: 0;
-                    margin-left: $kendo-breadcrumb-root-link-spacing;
-                }
-
-                .k-breadcrumb-link > .k-image,
-                .k-breadcrumb-icontext-link .k-icon {
-                    margin-right: 0;
-                    margin-left: $kendo-breadcrumb-link-icon-spacing;
-                }
-            }
-        }
-
-    }
-
 }
 
 // #endregion
@@ -31474,6 +31701,9 @@ $kendo-breadcrumb-focus-shadow: 0 0 2px 1px rgba( black, .06 ) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -31940,6 +32170,9 @@ $kendo-pager-sizes: (
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -32083,6 +32316,7 @@ $kendo-stepper-content-transition-timing-function: cubic-bezier(.4, 0, .2, 1) 0m
             padding: 0;
             list-style: none;
             display: flex;
+            position: relative;
             z-index: 1;
         }
 
@@ -32168,7 +32402,10 @@ $kendo-stepper-content-transition-timing-function: cubic-bezier(.4, 0, .2, 1) 0m
             text-overflow: ellipsis;
             overflow: hidden;
         }
-        .k-step-label .k-icon { margin-left: $kendo-icon-spacing; }
+        .k-step-label .k-icon,
+        .k-step-label .k-svg-icon  {
+            margin-left: $kendo-icon-spacing;
+        }
 
         .k-step-current .k-step-label {
             font-weight: bold;
@@ -32298,7 +32535,8 @@ $kendo-stepper-content-transition-timing-function: cubic-bezier(.4, 0, .2, 1) 0m
     .k-stepper[dir="rtl"] {
         direction: rtl;
 
-        .k-step-label .k-icon {
+        .k-step-label .k-icon,
+        .k-step-label .k-svg-icon {
             margin-left: 0;
             margin-right: $kendo-icon-spacing;
         }
@@ -32501,7 +32739,8 @@ $kendo-stepper-content-transition-timing-function: cubic-bezier(.4, 0, .2, 1) 0m
         .k-step-label {
             @include fill( $color: $kendo-stepper-label-text );
         }
-        .k-step-success .k-step-label .k-icon {
+        .k-step-success .k-step-label .k-icon,
+        .k-step-success .k-step-label .k-svg-icon {
             @include fill( $color: $kendo-stepper-label-success-text );
         }
         .k-step-error .k-step-label {
@@ -32554,6 +32793,9 @@ $kendo-stepper-content-transition-timing-function: cubic-bezier(.4, 0, .2, 1) 0m
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -33066,8 +33308,8 @@ $kendo-tabstrip-content-focus-border: $kendo-component-text !default;
             > .k-tabstrip-content { order: 0; }
         }
 
-        .k-tabstrip-prev,
-        .k-tabstrip-next {
+        .k-tabstrip-prev .k-button-icon,
+        .k-tabstrip-next .k-button-icon {
             transform: scaleX(-1);
         }
 
@@ -33206,6 +33448,9 @@ $kendo-tabstrip-content-focus-border: $kendo-component-text !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -33398,6 +33643,9 @@ $kendo-wizard-step-focus-border: #656565 !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -33586,6 +33834,9 @@ $kendo-expander-content-padding-y: k-map-get( $kendo-spacing, 6 ) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -33894,6 +34145,7 @@ $kendo-panelbar-header-expanded-gradient: null !default;
                 );
 
                 .k-icon,
+                .k-svg-icon,
                 .k-panelbar-item-icon {
                     color: $kendo-panelbar-text;
                 }
@@ -33943,6 +34195,7 @@ $kendo-panelbar-header-expanded-gradient: null !default;
                 );
 
                 .k-icon,
+                .k-svg-icon,
                 .k-panelbar-item-icon {
                     color: inherit;
                 }
@@ -34091,6 +34344,9 @@ $kendo-panelbar-header-expanded-gradient: null !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -34195,6 +34451,10 @@ $kendo-splitbar-selected-text: $kendo-color-primary-contrast !default;
         .k-icon {
             font-size: $kendo-splitter-resize-icon-size;
         }
+        .k-svg-icon {
+            width: $kendo-splitter-resize-icon-size;
+            height: $kendo-splitter-resize-icon-size;
+        }
 
     }
 
@@ -34379,6 +34639,9 @@ $kendo-splitbar-selected-text: $kendo-color-primary-contrast !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -34493,6 +34756,9 @@ $kendo-tile-layout-hint-border: $kendo-component-border !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -34503,6 +34769,9 @@ $kendo-tile-layout-hint-border: $kendo-component-border !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies (TODO: extract variables)
@@ -35212,6 +35481,9 @@ $kendo-adaptive-scheduler-subtle-text: $kendo-subtle-text !default;
 // #endregion
 // @import "../utils/_float.scss";
 // @import "../utils/_spacer.scss";
+// #region @import "../list/_index.scss"; -> scss/list/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 // #region @import "../table/_index.scss"; -> scss/table/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
@@ -35685,7 +35957,8 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
                 }
             }
 
-            .k-cell-inner > .k-link > .k-sort-icon .k-icon {
+            .k-cell-inner > .k-link > .k-sort-icon .k-icon,
+            .k-cell-inner > .k-link > .k-sort-icon .k-svg-icon {
                 display: flex;
             }
 
@@ -35775,7 +36048,8 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
             text-overflow: clip;
         }
 
-        .k-grouping-row .k-icon {
+        .k-grouping-row .k-icon,
+        .k-grouping-row .k-svg-icon {
             margin-inline-start: calc( #{k-math-div( $kendo-icon-size, 2 )} - #{$kendo-grid-cell-padding-x} );
             margin-inline-end: k-math-div( $kendo-icon-size, 2 );
             text-decoration: none;
@@ -36452,7 +36726,8 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
                 }
             }
 
-            .k-grouping-row .k-icon {
+            .k-grouping-row .k-icon,
+            .k-grouping-row .k-svg-icon {
                 margin-inline-start: calc( #{k-math-div( $kendo-icon-size, 2 )} - #{$_cell-padding-x} );
             }
 
@@ -36464,7 +36739,8 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
             .k-drag-cell {
                 padding: 0;
 
-                > .k-icon {
+                > .k-icon,
+                > .k-svg-icon {
                     padding-block: $_cell-padding-y;
                     padding-inline: 0;
                 }
@@ -36745,7 +37021,8 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
         outline: 0;
         cursor: pointer;
 
-        > .k-icon {
+        > .k-icon,
+        > .k-svg-icon {
             margin-inline-end: $kendo-icon-spacing;
         }
     }
@@ -36831,7 +37108,8 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
         .k-grid-filter,
         .k-header-column-menu,
         .k-grid-header-menu,
-        .k-hierarchy-cell .k-icon {
+        .k-hierarchy-cell .k-icon,
+        .k-hierarchy-cell .k-svg-icon {
             line-height: normal;
         }
     }
@@ -36999,14 +37277,16 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
         .k-grid-filter,
         .k-header-column-menu,
         .k-grid-header-menu,
-        .k-hierarchy-cell .k-icon {
+        .k-hierarchy-cell .k-icon,
+        .k-hierarchy-cell .k-svg-icon {
             color: $kendo-grid-header-text;
         }
 
         .k-grouping-row {
             background-color: $kendo-grid-grouping-row-bg;
 
-            .k-icon {
+            .k-icon,
+            .k-svg-icon {
                 color: $kendo-grid-header-text;
             }
 
@@ -37078,7 +37358,8 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
         .k-grid-filter,
         .k-header-column-menu,
         .k-grid-header-menu,
-        .k-hierarchy-cell .k-icon {
+        .k-hierarchy-cell .k-icon,
+        .k-hierarchy-cell .k-svg-icon {
             &:hover {
                 color: $kendo-button-hover-text;
                 background-color: $kendo-button-hover-bg;
@@ -37495,7 +37776,8 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
         .k-link:hover {
             color: $kendo-grid-text;
 
-            > .k-icon {
+            > .k-icon,
+            > .k-svg-icon {
                 color: inherit;
             }
         }
@@ -37503,7 +37785,8 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
         .k-grid-filter,
         .k-table-th-column-menu,
         .k-grid-header-menu,
-        .k-hierarchy-cell .k-icon {
+        .k-hierarchy-cell .k-icon,
+        .k-hierarchy-cell .k-svg-icon {
             &:hover {
                 color: $kendo-grid-text;
                 background-color: transparent;
@@ -37610,6 +37893,9 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -37864,6 +38150,9 @@ $kendo-listview-item-focus-shadow: null !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -38562,7 +38851,8 @@ $kendo-spreadsheet-drawing-anchor-bg: rgba( $kendo-selected-bg, .25 ) !default;
             .k-link {
                 padding-left: $kendo-filter-menu-padding-left;
             }
-            .k-icon {
+            .k-icon,
+            .k-svg-icon {
                 margin-left: calc(-1 * ( #{$kendo-icon-size} + #{$kendo-padding-md-y} ) );
                 margin-right: $kendo-padding-md-y;
             }
@@ -38602,7 +38892,8 @@ $kendo-spreadsheet-drawing-anchor-bg: rgba( $kendo-selected-bg, .25 ) !default;
             align-items: center;
             cursor: pointer;
 
-            > .k-icon {
+            > .k-icon,
+            > .k-svg-icon {
                 margin-right: $kendo-padding-md-y;
             }
         }
@@ -38746,6 +39037,10 @@ $kendo-spreadsheet-drawing-anchor-bg: rgba( $kendo-selected-bg, .25 ) !default;
             .k-icon {
                 font-size: 6em;
             }
+            .k-svg-icon {
+                width: 6em;
+                height: 6em;
+            }
         }
     }
 
@@ -39237,6 +39532,9 @@ $kendo-spreadsheet-drawing-anchor-bg: rgba( $kendo-selected-bg, .25 ) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -39535,7 +39833,8 @@ $kendo-pivotgrid-remove-text: $kendo-pivotgrid-button-bg !default;
         }
     }
 
-    .k-pivotgrid-cell .k-icon {
+    .k-pivotgrid-cell .k-icon,
+    .k-pivotgrid-cell .k-svg-icon {
         cursor: pointer;
         padding-inline-end: $kendo-pivotgrid-icon-spacing;
     }
@@ -39592,7 +39891,8 @@ $kendo-pivotgrid-remove-text: $kendo-pivotgrid-button-bg !default;
             span {
                 writing-mode: vertical-rl;
             }
-            .k-icon {
+            .k-icon,
+            .k-svg-icon {
                 vertical-align: baseline;
             }
         }
@@ -39749,7 +40049,8 @@ $kendo-pivotgrid-remove-text: $kendo-pivotgrid-button-bg !default;
         flex-direction: row;
         align-items: center;
 
-        .k-icon {
+        .k-icon,
+        .k-svg-icon {
             margin-right: k-map-get( $kendo-spacing, 2 );
         }
         .k-dropdown-list {
@@ -39915,6 +40216,7 @@ $kendo-pivotgrid-remove-text: $kendo-pivotgrid-button-bg !default;
     }
 
     .k-pivot-layout > tbody,
+    .k-pivot .k-table-td,
     .k-pivot td {
         vertical-align: top;
     }
@@ -40344,6 +40646,9 @@ $kendo-pivotgrid-remove-text: $kendo-pivotgrid-button-bg !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -40543,6 +40848,9 @@ $kendo-treelist-footer-row-border-width: 1px !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -40759,6 +41067,9 @@ $kendo-filter-toolbar-focus-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -41111,9 +41422,7 @@ $kendo-file-manager-preview-icon-border: null !default;
         display: flex;
         flex-direction: row;
         align-items: center;
-    }
-    .k-filemanager-drag-hint .k-icon {
-        margin-right: $kendo-icon-spacing;
+        gap: $kendo-icon-spacing;
     }
 
 }
@@ -41242,6 +41551,9 @@ $kendo-file-manager-preview-icon-border: null !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -41727,6 +42039,9 @@ $kendo-taskboard-drag-placeholder-border: $kendo-component-border !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -41929,11 +42244,13 @@ $kendo-editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-li
         flex-shrink: 0;
 
         .k-editor-export {
-            .k-icon {
+            .k-icon,
+            .k-svg-icon {
                 margin-right: $kendo-editor-export-tool-icon-margin-x;
             }
 
             .k-icon,
+            .k-svg-icon,
             .k-export-tool-text {
                 vertical-align: middle;
             }
@@ -42174,7 +42491,8 @@ $kendo-editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-li
                 flex: 1;
                 width: 100px; // fix width for Edge
             }
-            .k-icon {
+            .k-icon,
+            .k-svg-icon {
                 margin: 0;
                 position: static;
             }
@@ -42272,7 +42590,8 @@ $kendo-editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-li
             left: $kendo-input-padding-x;
             top: $kendo-input-padding-y;
 
-            .k-icon {
+            .k-icon,
+            .k-svg-icon {
                 position: static;
                 margin-top: 0;
             }
@@ -42464,7 +42783,8 @@ $kendo-editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-li
         text-transform: uppercase;
         font-size: $kendo-font-size-md;
 
-        .k-icon {
+        .k-icon,
+        .k-svg-icon {
             margin-left: $kendo-editor-export-tool-icon-margin-x;
         }
     }
@@ -42583,6 +42903,9 @@ $kendo-editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-li
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -42879,6 +43202,9 @@ $kendo-image-editor-crop-overlay-bg: rgba( black, .3 ) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -44228,6 +44554,9 @@ $kendo-gantt-validation-tooltip-invalid-border: $kendo-color-error !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -44799,7 +45128,8 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
                 }
             }
 
-            .k-icon {
+            .k-icon,
+            .k-svg-icon {
                 line-height: normal;
                 font-size: inherit;
             }
@@ -44904,7 +45234,8 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
         position: absolute;
         justify-content: center;
 
-        > .k-icon {
+        > .k-icon,
+        > .k-svg-icon {
             position: absolute;
             top: 50%;
             left: 50%;
@@ -45526,6 +45857,14 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
                 box-sizing: content-box;
                 vertical-align: unset;
             }
+
+            .k-svg-icon {
+                width: $kendo-font-size-sm;
+                height: $kendo-font-size-sm;
+                padding: calc( #{$kendo-font-size-md} - #{$kendo-font-size-sm} );
+                box-sizing: content-box;
+                vertical-align: unset;
+            }
         }
 
         .k-resize-handle {
@@ -45936,6 +46275,9 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -46692,6 +47034,9 @@ $kendo-chat-quick-reply-hover-border: $kendo-color-primary !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -46874,6 +47219,9 @@ $kendo-media-player-titlebar-gradient: rgba( $kendo-media-player-text, .7 ), rgb
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -47508,6 +47856,9 @@ $kendo-timeline-event-min-height-calc: calc(2 * (#{$kendo-timeline-track-event-o
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -47708,6 +48059,10 @@ $kendo-pdf-viewer-icon-size: calc( #{$kendo-icon-size} * 3 ) !default;
             > .k-icon {
                 font-size: $kendo-pdf-viewer-icon-size;
             }
+            > .k-svg-icon {
+                width: $kendo-pdf-viewer-icon-size;
+                height: $kendo-pdf-viewer-icon-size;
+            }
         }
 
     }
@@ -47810,7 +48165,8 @@ $kendo-pdf-viewer-icon-size: calc( #{$kendo-icon-size} * 3 ) !default;
             @include box-shadow( $kendo-pdf-viewer-page-shadow );
         }
 
-        .k-blank-page > .k-icon {
+        .k-blank-page > .k-icon,
+        .k-blank-page > .k-svg-icon {
             @include fill( $color: $kendo-pdf-viewer-icon-text );
         }
 
@@ -47850,6 +48206,9 @@ $kendo-pdf-viewer-icon-size: calc( #{$kendo-icon-size} * 3 ) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -47973,6 +48332,9 @@ $kendo-pdf-viewer-icon-size: calc( #{$kendo-icon-size} * 3 ) !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -48191,7 +48553,8 @@ $kendo-scrollview-transition-timing-function: ease-in-out !default;
         user-select: none;
         cursor: pointer;
 
-        .k-icon {
+        .k-icon,
+        .k-svg-icon {
             display: table-cell;
             overflow: visible;
             margin: 0;
@@ -48200,6 +48563,11 @@ $kendo-scrollview-transition-timing-function: ease-in-out !default;
             font-size: $kendo-scrollview-arrow-icon-size;
             font-weight: normal;
         }
+        .k-svg-icon {
+            font-size: inherit;
+            width: $kendo-scrollview-arrow-icon-size;
+            height: $kendo-scrollview-arrow-icon-size;
+        }
     }
 
     .k-scrollview-prev {
@@ -48348,6 +48716,9 @@ $kendo-scrollview-transition-timing-function: ease-in-out !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -49161,6 +49532,9 @@ $kendo-treemap-line-height: $kendo-line-height-md !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -49309,7 +49683,8 @@ $kendo-map-marker-fill: $kendo-color-primary !default;
             box-shadow: none;
             position: absolute;
 
-            .k-icon {
+            .k-icon,
+            .k-svg-icon {
                 min-width: 0;
                 min-height: 0;
             }
@@ -49397,6 +49772,9 @@ $kendo-map-marker-fill: $kendo-color-primary !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
 
 
 // Dependencies
@@ -49429,6 +49807,7 @@ $kendo-map-marker-fill: $kendo-color-primary !default;
 // File already imported_once. Skipping output.
 // #endregion
 
+
 // Component
 // #region @import "./_variables.scss"; -> scss/orgchart/_variables.scss
 // Orgchart
@@ -49667,6 +50046,10 @@ $kendo-orgchart-line-v-height: 25px !default;
 // #region @import "../core/_index.scss"; -> scss/core/_index.scss
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../utils/_index.scss"; -> scss/utils/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
+
 
 // Dependencies
 // #region @import "../button/_index.scss"; -> scss/button/_index.scss
@@ -49676,6 +50059,7 @@ $kendo-orgchart-line-v-height: 25px !default;
 // File already imported_once. Skipping output.
 // #endregion
 
+
 // Component
 // #region @import "./_variables.scss"; -> scss/signature/_variables.scss
 $kendo-signature-width: 246px !default;