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

package/dist/all.scss

@@ -5342,326 +5342,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: ($kendo-font-size-md * 3) !default;
-$kendo-h2-font-size: 34px !default;
-$kendo-h3-font-size: ($kendo-font-size-md * 2) !default;
-$kendo-h4-font-size: 22px !default;
-$kendo-h5-font-size: $kendo-font-size-lg !default;
-$kendo-h6-font-size: $kendo-font-size-md !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: 54px !default;
-$kendo-h2-line-height: 46px !default;
-$kendo-h3-line-height: 42px !default;
-$kendo-h4-line-height: 32px !default;
-$kendo-h5-line-height: 26px !default;
-$kendo-h6-line-height: 20px !default;
-
-$kendo-h1-font-weight: $kendo-font-weight-normal !default;
-$kendo-h2-font-weight: $kendo-font-weight-normal !default;
-$kendo-h3-font-weight: $kendo-font-weight-normal !default;
-$kendo-h4-font-weight: $kendo-font-weight-bold !default;
-$kendo-h5-font-weight: $kendo-font-weight-bold !default;
-$kendo-h6-font-weight: $kendo-font-weight-bold !default;
-
-$kendo-h1-letter-spacing: null !default;
-$kendo-h2-letter-spacing: null !default;
-$kendo-h3-letter-spacing: null !default;
-$kendo-h4-letter-spacing: null !default;
-$kendo-h5-letter-spacing: null !default;
-$kendo-h6-letter-spacing: null !default;
-
-$kendo-h1-margin: 0 0 $kendo-font-size-md !default;
-$kendo-h2-margin: 0 0 $kendo-font-size-md !default;
-$kendo-h3-margin: 0 0 $kendo-font-size-md !default;
-$kendo-h4-margin: 0 0 $kendo-font-size-md !default;
-$kendo-h5-margin: 0 0 $kendo-font-size-md !default;
-$kendo-h6-margin: 0 0 $kendo-font-size-md !default;
-
-
-// Paragraph
-$kendo-paragraph-margin: 0 0 $kendo-font-size-md !default;
-$kendo-paragraph-font-size: $kendo-font-size-md !default;
-$kendo-paragraph-font-family: $kendo-font-family !default;
-$kendo-paragraph-line-height: 20px !default;
-$kendo-paragraph-font-weight: $kendo-font-weight-normal !default;
-$kendo-paragraph-letter-spacing: null !default;
-
-
-// Code
-$kendo-code-font-size: $kendo-font-size-md !default;
-$kendo-code-font-family: $kendo-font-family-monospace !default;
-$kendo-code-line-height: 20px !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: ($kendo-font-size-md * 6) !default;
-$kendo-display2-font-size: ($kendo-font-size-md * 5) !default;
-$kendo-display3-font-size: ($kendo-font-size-md * 4) !default;
-$kendo-display4-font-size: ($kendo-font-size-md * 3) !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-light !default;
-$kendo-display3-font-weight: $kendo-font-weight-light !default;
-$kendo-display4-font-weight: $kendo-font-weight-light !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
@@ -8619,11 +8300,336 @@ $kendo-utils: (
 // #endregion
 
 
+// Dependencies
+
+
+// Component
+// #region @import "./_variables.scss"; -> scss/typography/_variables.scss
+// Typography
+
+
+// Headings
+$kendo-h1-font-size: ($kendo-font-size-md * 3) !default;
+$kendo-h2-font-size: 34px !default;
+$kendo-h3-font-size: ($kendo-font-size-md * 2) !default;
+$kendo-h4-font-size: 22px !default;
+$kendo-h5-font-size: $kendo-font-size-lg !default;
+$kendo-h6-font-size: $kendo-font-size-md !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: 54px !default;
+$kendo-h2-line-height: 46px !default;
+$kendo-h3-line-height: 42px !default;
+$kendo-h4-line-height: 32px !default;
+$kendo-h5-line-height: 26px !default;
+$kendo-h6-line-height: 20px !default;
+
+$kendo-h1-font-weight: $kendo-font-weight-normal !default;
+$kendo-h2-font-weight: $kendo-font-weight-normal !default;
+$kendo-h3-font-weight: $kendo-font-weight-normal !default;
+$kendo-h4-font-weight: $kendo-font-weight-bold !default;
+$kendo-h5-font-weight: $kendo-font-weight-bold !default;
+$kendo-h6-font-weight: $kendo-font-weight-bold !default;
+
+$kendo-h1-letter-spacing: null !default;
+$kendo-h2-letter-spacing: null !default;
+$kendo-h3-letter-spacing: null !default;
+$kendo-h4-letter-spacing: null !default;
+$kendo-h5-letter-spacing: null !default;
+$kendo-h6-letter-spacing: null !default;
+
+$kendo-h1-margin: 0 0 $kendo-font-size-md !default;
+$kendo-h2-margin: 0 0 $kendo-font-size-md !default;
+$kendo-h3-margin: 0 0 $kendo-font-size-md !default;
+$kendo-h4-margin: 0 0 $kendo-font-size-md !default;
+$kendo-h5-margin: 0 0 $kendo-font-size-md !default;
+$kendo-h6-margin: 0 0 $kendo-font-size-md !default;
+
+
+// Paragraph
+$kendo-paragraph-margin: 0 0 $kendo-font-size-md !default;
+$kendo-paragraph-font-size: $kendo-font-size-md !default;
+$kendo-paragraph-font-family: $kendo-font-family !default;
+$kendo-paragraph-line-height: 20px !default;
+$kendo-paragraph-font-weight: $kendo-font-weight-normal !default;
+$kendo-paragraph-letter-spacing: null !default;
+
+
+// Code
+$kendo-code-font-size: $kendo-font-size-md !default;
+$kendo-code-font-family: $kendo-font-family-monospace !default;
+$kendo-code-line-height: 20px !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: ($kendo-font-size-md * 6) !default;
+$kendo-display2-font-size: ($kendo-font-size-md * 5) !default;
+$kendo-display3-font-size: ($kendo-font-size-md * 4) !default;
+$kendo-display4-font-size: ($kendo-font-size-md * 3) !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-light !default;
+$kendo-display3-font-weight: $kendo-font-weight-light !default;
+$kendo-display4-font-weight: $kendo-font-weight-light !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
@@ -9926,9 +9932,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);
     }
 
@@ -9960,6 +9966,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
@@ -10045,6 +10054,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
@@ -10236,6 +10248,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
@@ -10246,6 +10261,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
@@ -11364,6 +11382,9 @@ $kendo-checkbox-ripple-opacity: .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
@@ -11557,7 +11578,8 @@ $kendo-listgroup-item-border-width: 1px !default;
                     right: auto;
                     left: 0;
 
-                    .k-icon {
+                    .k-icon,
+                    .k-svg-icon {
                         transform: scaleX(-1);
                     }
                 }
@@ -11576,7 +11598,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);
                 }
             }
@@ -11627,6 +11650,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
@@ -11687,6 +11713,9 @@ $kendo-overlay-opacity: .5 !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
@@ -11810,6 +11839,9 @@ $kendo-popup-shadow: 0 2px 4px 0 rgba( black, .03 ), 0 4px 5px 0 rgba( black, .0
 // #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
@@ -11893,6 +11925,9 @@ $kendo-popup-shadow: 0 2px 4px 0 rgba( black, .03 ), 0 4px 5px 0 rgba( black, .0
 // #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
@@ -12445,6 +12480,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
@@ -12514,6 +12552,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
@@ -12671,6 +12712,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
@@ -12941,6 +12985,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
@@ -13656,6 +13703,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
@@ -13797,6 +13847,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
@@ -14509,6 +14562,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
@@ -14668,6 +14724,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
@@ -14678,6 +14737,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
@@ -14688,6 +14750,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
@@ -15356,6 +15421,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
@@ -16536,6 +16604,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
@@ -17500,6 +17571,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
@@ -17510,6 +17584,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
@@ -17583,7 +17660,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;
         }
@@ -17780,6 +17858,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
@@ -17790,6 +17871,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
@@ -18026,7 +18110,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;
@@ -18148,10 +18234,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 );
         }
     }
@@ -18238,7 +18326,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;
             }
@@ -18951,6 +19041,9 @@ $kendo-floating-label-focus-text: 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
@@ -19045,6 +19138,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
@@ -19116,6 +19212,9 @@ $kendo-menu-button-arrow-padding-x: $kendo-button-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
@@ -19164,6 +19263,9 @@ $kendo-menu-button-arrow-padding-x: $kendo-button-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
@@ -19216,6 +19318,9 @@ $kendo-menu-button-arrow-padding-x: $kendo-button-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
@@ -19418,6 +19523,9 @@ $kendo-listbox-drop-hint-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
@@ -19819,6 +19927,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
@@ -20304,6 +20415,9 @@ $kendo-radio-ripple-opacity: .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
@@ -20724,7 +20838,9 @@ $kendo-slider-disabled-opacity: null !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);
             }
         }
@@ -20923,6 +21039,9 @@ $kendo-slider-disabled-opacity: 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
@@ -21855,6 +21974,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
@@ -22294,6 +22416,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
@@ -22352,6 +22477,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
@@ -22491,6 +22619,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
@@ -22609,6 +22740,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
@@ -22633,6 +22767,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
@@ -22915,12 +23052,14 @@ $kendo-color-gradient-contrast-spacer: k-math-div( $kendo-color-gradient-spacer,
             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;
             }
@@ -23032,6 +23171,9 @@ $kendo-color-gradient-contrast-spacer: k-math-div( $kendo-color-gradient-spacer,
 // #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
@@ -23211,6 +23353,9 @@ $kendo-color-editor-color-gradient-focus-outline-offset: 4px !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
@@ -23273,6 +23418,9 @@ $kendo-color-editor-color-gradient-focus-outline-offset: 4px !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
@@ -23331,6 +23479,9 @@ $kendo-color-editor-color-gradient-focus-outline-offset: 4px !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
@@ -23374,6 +23525,9 @@ $kendo-color-editor-color-gradient-focus-outline-offset: 4px !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
@@ -23423,6 +23577,9 @@ $kendo-color-editor-color-gradient-focus-outline-offset: 4px !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
@@ -23478,6 +23635,9 @@ $kendo-color-editor-color-gradient-focus-outline-offset: 4px !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
@@ -23591,6 +23751,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
@@ -23681,6 +23844,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
@@ -23747,6 +23913,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
@@ -23837,6 +24006,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
@@ -23853,6 +24025,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
@@ -23917,6 +24092,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
@@ -24187,6 +24365,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;
@@ -24237,6 +24416,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;
@@ -24407,6 +24587,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
@@ -24465,6 +24648,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
@@ -24558,6 +24744,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 {
@@ -24617,10 +24807,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 );
+                }
             }
         }
     }
@@ -24654,6 +24850,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
@@ -24703,6 +24902,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
@@ -25245,6 +25447,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
@@ -25264,6 +25469,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
@@ -25337,6 +25545,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;
@@ -25504,7 +25717,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;
                 }
             }
@@ -25825,6 +26039,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
@@ -26016,6 +26233,9 @@ $kendo-appbar-bottom-box-shadow: 0px -1px 1px rgba( black, .16 ) !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
@@ -26483,6 +26703,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
@@ -27066,6 +27289,9 @@ $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
@@ -27076,6 +27302,9 @@ $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
@@ -27454,6 +27683,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
@@ -27836,6 +28068,9 @@ $kendo-drawer-selected-hover-text: $kendo-selected-hover-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
@@ -28026,19 +28261,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
@@ -28626,6 +28864,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
@@ -28811,6 +29052,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
@@ -28908,6 +29152,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
@@ -29133,6 +29380,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
@@ -29301,12 +29551,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 {
@@ -29333,26 +29584,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
@@ -29467,6 +29698,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
@@ -29911,6 +30145,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
@@ -30054,6 +30291,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;
         }
 
@@ -30139,7 +30377,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;
@@ -30269,7 +30510,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;
         }
@@ -30457,7 +30699,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 {
@@ -30510,6 +30753,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
@@ -31022,8 +31268,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);
         }
 
@@ -31150,6 +31396,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
@@ -31342,6 +31591,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
@@ -31531,6 +31783,9 @@ $kendo-expander-content-padding-y: k-map-get( $kendo-spacing, 4 ) !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
@@ -31838,6 +32093,7 @@ $kendo-panelbar-header-expanded-gradient: null !default;
                 );
 
                 .k-icon,
+                .k-svg-icon,
                 .k-panelbar-item-icon {
                     color: $kendo-panelbar-text;
                 }
@@ -31887,6 +32143,7 @@ $kendo-panelbar-header-expanded-gradient: null !default;
                 );
 
                 .k-icon,
+                .k-svg-icon,
                 .k-panelbar-item-icon {
                     color: inherit;
                 }
@@ -32035,6 +32292,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
@@ -32139,6 +32399,10 @@ $kendo-splitbar-selected-text: $kendo-selected-text !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;
+        }
 
     }
 
@@ -32323,6 +32587,9 @@ $kendo-splitbar-selected-text: $kendo-selected-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
@@ -32437,6 +32704,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
@@ -32447,6 +32717,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)
@@ -33639,7 +33912,8 @@ $kendo-grid-group-footer-second-cell-border: 1px !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;
             }
 
@@ -33729,7 +34003,8 @@ $kendo-grid-group-footer-second-cell-border: 1px !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;
@@ -34406,7 +34681,8 @@ $kendo-grid-group-footer-second-cell-border: 1px !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} );
             }
 
@@ -34418,7 +34694,8 @@ $kendo-grid-group-footer-second-cell-border: 1px !default;
             .k-drag-cell {
                 padding: 0;
 
-                > .k-icon {
+                > .k-icon,
+                > .k-svg-icon {
                     padding-block: $_cell-padding-y;
                     padding-inline: 0;
                 }
@@ -34699,7 +34976,8 @@ $kendo-grid-group-footer-second-cell-border: 1px !default;
         outline: 0;
         cursor: pointer;
 
-        > .k-icon {
+        > .k-icon,
+        > .k-svg-icon {
             margin-inline-end: $kendo-icon-spacing;
         }
     }
@@ -34854,14 +35132,16 @@ $kendo-grid-group-footer-second-cell-border: 1px !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;
             }
 
@@ -34933,7 +35213,8 @@ $kendo-grid-group-footer-second-cell-border: 1px !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;
@@ -35225,6 +35506,9 @@ $kendo-grid-group-footer-second-cell-border: 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
@@ -35465,6 +35749,9 @@ $kendo-listview-item-focus-shadow: inset 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
@@ -36163,7 +36450,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;
             }
@@ -36203,7 +36491,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;
             }
         }
@@ -36347,6 +36636,10 @@ $kendo-spreadsheet-drawing-anchor-bg: rgba( $kendo-selected-bg, .25 ) !default;
             .k-icon {
                 font-size: 6em;
             }
+            .k-svg-icon {
+                width: 6em;
+                height: 6em;
+            }
         }
     }
 
@@ -36772,6 +37065,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
@@ -37070,7 +37366,8 @@ $kendo-pivotgrid-remove-text: null !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;
     }
@@ -37127,7 +37424,8 @@ $kendo-pivotgrid-remove-text: null !default;
             span {
                 writing-mode: vertical-rl;
             }
-            .k-icon {
+            .k-icon,
+            .k-svg-icon {
                 vertical-align: baseline;
             }
         }
@@ -37284,7 +37582,8 @@ $kendo-pivotgrid-remove-text: null !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 {
@@ -37450,6 +37749,7 @@ $kendo-pivotgrid-remove-text: null !default;
     }
 
     .k-pivot-layout > tbody,
+    .k-pivot .k-table-td,
     .k-pivot td {
         vertical-align: top;
     }
@@ -37852,6 +38152,9 @@ $kendo-pivotgrid-remove-text: 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
@@ -38006,6 +38309,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
@@ -38222,6 +38528,9 @@ $kendo-filter-toolbar-focus-shadow: 0 0 0 2px rgba(0, 0, 0, .08) !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
@@ -38574,9 +38883,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;
     }
 
 }
@@ -38705,6 +39012,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
@@ -38734,6 +39044,7 @@ $kendo-file-manager-preview-icon-border: null !default;
 // File already imported_once. Skipping output.
 // #endregion
 
+
 // Component
 // #region @import "./_variables.scss"; -> scss/taskboard/_variables.scss
 // TaskBoard
@@ -39189,6 +39500,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
@@ -39391,11 +39705,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;
             }
@@ -39636,7 +39952,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;
             }
@@ -39734,7 +40051,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;
             }
@@ -40024,6 +40342,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
@@ -40320,6 +40641,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
@@ -41633,6 +41957,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
@@ -42206,7 +42533,8 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
                 }
             }
 
-            .k-icon {
+            .k-icon,
+            .k-svg-icon {
                 line-height: normal;
                 font-size: inherit;
             }
@@ -42311,7 +42639,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%;
@@ -43144,6 +43473,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
@@ -43900,6 +44232,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
@@ -44082,6 +44417,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
@@ -44696,6 +45034,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
@@ -44896,6 +45237,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;
+            }
         }
 
     }
@@ -44998,7 +45343,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 );
         }
 
@@ -45038,6 +45384,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
@@ -45161,6 +45510,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
@@ -45379,7 +45731,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;
@@ -45388,6 +45741,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 {
@@ -45536,6 +45894,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
@@ -46349,6 +46710,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
@@ -46497,7 +46861,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;
             }
@@ -46585,6 +46950,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
@@ -46617,6 +46985,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
@@ -46855,11 +47224,19 @@ $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
 // File already imported_once. Skipping output.
 // #endregion
+// #region @import "../input/_index.scss"; -> scss/input/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
+
 
 // Component
 // #region @import "./_variables.scss"; -> scss/signature/_variables.scss