@progress/kendo-theme-material 6.8.0-dev.1 → 7.0.0-dev.0

package/dist/all.scss

@@ -1242,7 +1242,7 @@ $_kendo-escape-class-name: (
 ///   @debug k-map-deep-merge( ( "foo": ("bar": "baz", "baz": "qux" ) ), ( "foo": ("bar": "foo") ) ); // => ( "foo": ("bar": "foo", "baz": "qux" ))
 @function k-map-deep-merge($maps...) {
     $merged: ();
-  
+
     @each $map in $maps {
       @each $key, $val in $map {
         @if (k-meta-type-of($val) == 'map') {
@@ -1260,7 +1260,7 @@ $_kendo-escape-class-name: (
       }
       $merged: k-map-merge($merged, $map);
     }
-  
+
     @return $merged;
   }
 
@@ -2533,6 +2533,132 @@ $material-light-complimentary: (
 
 // #endregion
 
+// Elevation
+// #region @import "./elevation/index.import.scss"; -> scss/core/elevation/index.import.scss
+$_default-elevation: (
+    1: (
+        0px 1px 3px 0px rgba(0, 0, 0, 0.2),
+        0px 2px 1px 0px rgba(0, 0, 0, 0.12),
+        0px 1px 1px 0px rgba(0, 0, 0, 0.14),
+    ),
+    2: (
+        0px 1px 5px 0px rgba(0, 0, 0, 0.2),
+        0px 3px 1px 0px rgba(0, 0, 0, 0.12),
+        0px 2px 2px 0px rgba(0, 0, 0, 0.14),
+    ),
+    3: (
+        0px 1px 8px 0px rgba(0, 0, 0, 0.2),
+        0px 3px 3px 0px rgba(0, 0, 0, 0.12),
+        0px 3px 4px 0px rgba(0, 0, 0, 0.14),
+    ),
+    4: (
+        0px 2px 4px 0px rgba(0, 0, 0, 0.2),
+        0px 1px 10px 0px rgba(0, 0, 0, 0.12),
+        0px 4px 5px 0px rgba(0, 0, 0, 0.14),
+    ),
+    5: (
+        0px 3px 5px 0px rgba(0, 0, 0, 0.2),
+        0px 1px 18px 0px rgba(0, 0, 0, 0.12),
+        0px 6px 10px 0px rgba(0, 0, 0, 0.14),
+    ),
+    6: (
+        0px 5px 5px 0px rgba(0, 0, 0, 0.2),
+        0px 3px 14px 0px rgba(0, 0, 0, 0.12),
+        0px 8px 10px 0px rgba(0, 0, 0, 0.14),
+    ),
+    7: (
+        0px 7px 8px 0px rgba(0, 0, 0, 0.2),
+        0px 5px 22px 0px rgba(0, 0, 0, 0.12),
+        0px 12px 17px 0px rgba(0, 0, 0, 0.14),
+    ),
+    8: (
+        0px 8px 10px rgba(0, 0, 0, 0.2),
+        0px 6px 30px rgba(0, 0, 0, 0.12),
+        0px 16px 24px rgba(0, 0, 0, 0.14),
+    ),
+    9: (
+        0px 11px 15px rgba(0, 0, 0, 0.2),
+        0px 9px 46px rgba(0, 0, 0, 0.12),
+        0px 24px 38px rgba(0, 0, 0, 0.14),
+    ),
+);
+
+/// Global Elevation.
+/// @group elevation
+$kendo-elevation: $_default-elevation !default;
+
+// #region @import "@progress/kendo-theme-core/scss/elevation/index.import.scss"; -> node_modules/@progress/kendo-theme-core/scss/elevation/index.import.scss
+// #region @import "../functions/index.import.scss"; -> node_modules/@progress/kendo-theme-core/scss/functions/index.import.scss
+// File already imported_once. Skipping output.
+// #endregion
+
+$_default-elevation: (
+    1: (
+        0 2px 3px rgba(0, 0, 0, .04),
+        0 4px 16px rgba(0, 0, 0, .12)
+    ),
+    2: (
+        0 4px 6px rgba(0, 0, 0, .06),
+        0 4px 16px rgba(0, 0, 0, .12)
+    ),
+    3: (
+        0 6px 8px rgba(0, 0, 0, .08),
+        0 4px 16px rgba(0, 0, 0, .12)
+    ),
+    4: (
+        0 8px 10px rgba(0, 0, 0, .12),
+        0 4px 16px rgba(0, 0, 0, .12)
+    ),
+    5: (
+        0 10px 12px rgba(0, 0, 0, .16),
+        0 4px 16px rgba(0, 0, 0, .12)
+    ),
+    6: (
+        0 12px 14px rgba(0, 0, 0, .2),
+        0 4px 16px rgba(0, 0, 0, .12)
+    ),
+    7: (
+        0 14px 16px rgba(0, 0, 0, .24),
+        0 4px 16px rgba(0, 0, 0, .12)
+    ),
+    8: (
+        0 16px 18px rgba(0, 0, 0, .28),
+        0 4px 16px rgba(0, 0, 0, .12)
+    ),
+    9: (
+        0 32px 34px rgba(0, 0, 0, .32),
+        0 4px 16px rgba(0, 0, 0, .12)
+    )
+) !default;
+
+$kendo-elevation: $_default-elevation !default;
+$kendo-elevation: k-map-merge($_default-elevation, $kendo-elevation);
+
+@function k-shadow-filter($shadow) {
+    $result: '';
+    @each $value in $shadow {
+        $result: $result + "drop-shadow(" + $value + ") ";
+    }
+    @return #{$result};
+}
+
+@function k-elevation($level) {
+    @return var(--kendo-elevation-#{$level}, k-map-get($kendo-elevation, $level));
+}
+
+
+@mixin kendo-elevation--styles() {
+    :root {
+        @each $level, $shadow in $kendo-elevation {
+            --kendo-elevation-#{$level}: #{$shadow};
+        }
+    }
+}
+
+// #endregion
+
+// #endregion
+
 // Variables
 // #region @import "../_variables.scss"; -> scss/_variables.scss
 // #region @import "./core/functions/index.import.scss"; -> scss/core/functions/index.import.scss
@@ -2635,23 +2761,48 @@ $elevation: k-map-get( $theme, elevation ) !default;
 /// Shadow for switch.
 /// Equivalent to material elevation 1.
 /// @group shadows
-$box-shadow-depth-1: 0 2px 1px -1px rgba( $elevation, .2 ), 0 1px 1px 0 rgba( $elevation, .14 ), 0 1px 3px 0 rgba( $elevation, .12 ) !default;
+/// @deprecated Use the `$kendo-elevation` map instead.
+$box-shadow-depth-1: k-elevation(1) !default;
 /// Shadow for resting state of button, card and other widgets.
 /// Equivalent to material elevation 2.
 /// @group shadows
-$box-shadow-depth-2: 0 3px 1px -2px rgba( $elevation, .2 ), 0 2px 2px 0 rgba( $elevation, .14 ), 0 1px 5px 0 rgba( $elevation, .12 ) !default;
+/// @deprecated Use the `$kendo-elevation` map instead.
+$box-shadow-depth-2: k-elevation(2) !default;
 /// Shadow for menu, popups and raised state of button and card.
-/// Equivalent to material elevation 8.
+/// Equivalent to material elevation 3.
 /// @group shadows
-$box-shadow-depth-3: 0 5px 5px -3px rgba( $elevation, .2 ), 0 8px 10px 1px rgba( $elevation, .14 ), 0 3px 14px 2px rgba( $elevation, .12 ) !default;
+/// @deprecated Use the `$kendo-elevation` map instead.
+$box-shadow-depth-3: k-elevation(3) !default;
 /// Shadow for drawers and other overlaying elements.
+/// Equivalent to material elevation 4.
+/// @group shadows
+/// @deprecated Use the `$kendo-elevation` map instead.
+$box-shadow-depth-4: k-elevation(4) !default;
+/// Shadow for window and dialog.
+/// Equivalent to material elevation 6.
+/// @group shadows
+/// @deprecated Use the `$kendo-elevation` map instead.
+$box-shadow-depth-5: k-elevation(5) !default;
+/// Shadow for window and dialog.
+/// Equivalent to material elevation 8.
+/// @group shadows
+/// @deprecated Use the `$kendo-elevation` map instead.
+$box-shadow-depth-6: k-elevation(6) !default;
+/// Shadow for window and dialog.
+/// Equivalent to material elevation 12.
+/// @group shadows
+/// @deprecated Use the `$kendo-elevation` map instead.
+$box-shadow-depth-7: k-elevation(7) !default;
+/// Shadow for window and dialog.
 /// Equivalent to material elevation 16.
 /// @group shadows
-$box-shadow-depth-4: 0 8px 10px -5px rgba( $elevation, .2 ), 0 16px 24px 2px rgba( $elevation, .14 ), 0 6px 30px 5px rgba( $elevation, .12 ) !default;
+/// @deprecated Use the `$kendo-elevation` map instead.
+$box-shadow-depth-8: k-elevation(8) !default;
 /// Shadow for window and dialog.
 /// Equivalent to material elevation 24.
 /// @group shadows
-$box-shadow-depth-5: 0 11px 15px -7px rgba( $elevation, .2 ), 0 24px 38px 3px rgba( $elevation, .14 ), 0 9px 46px 8px rgba( $elevation, .12 ) !default;
+/// @deprecated Use the `$kendo-elevation` map instead.
+$box-shadow-depth-9: k-elevation(9) !default;
 
 
 // Icons
@@ -2957,6 +3108,7 @@ $kendo-invalid-shadow: null !default;
 // Loading
 $kendo-loading-opacity: .3 !default;
 $kendo-zindex-loading: 100 !default;
+
 // #endregion
 
 // #region @import "@progress/kendo-theme-core/scss/index.import.scss"; -> node_modules/@progress/kendo-theme-core/scss/index.import.scss
@@ -4185,21 +4337,6 @@ $kendo-focus-outline: k-get-theme-color-var( neutral-130 ) !default;
 
 $kendo-subtle-text: k-get-theme-color-var( neutral-130 ) !default;
 
-// Shadows
-
-/// Shadow for cards and grid item thumbnails.
-/// Equivalent to fluent depth 4.
-$kendo-box-shadow-depth-1: 0 1.6px 3.6px rgba( $kendo-color-black, 0.132 ), 0 0.3px 0.9px rgba( $kendo-color-black, 0.108 ) !default;
-/// Shadow for command bars and dropdowns.
-/// Equivalent to fluent depth 8.
-$kendo-box-shadow-depth-2: 0 3.2px 7.2px rgba( $kendo-color-black, 0.132 ), 0 0.6px 1.8px rgba( $kendo-color-black, 0.108 ) !default;
-/// Shadow for teaching callouts and hover cards / tooltips.
-/// Equivalent to fluent depth 16.
-$kendo-box-shadow-depth-3: 0 6.4px 14.4px rgba( $kendo-color-black, 0.132 ), 0 1.2px 3.6px rgba( $kendo-color-black, 0.108 ) !default;
-/// Shadow for panels and pop up dialogs.
-/// Equivalent to fluent depth 64.
-$kendo-box-shadow-depth-4: 0 25.6px 57.6px rgba( $kendo-color-black, 0.22 ), 0 4.8px 14.4px rgba( $kendo-color-black, 0.18 ) !default;
-
 // Link
 $kendo-link-text: k-get-theme-color-var( primary-100 ) !default;
 $kendo-link-hover-text: k-get-theme-color-var( primary-120 ) !default;
@@ -4262,11 +4399,6 @@ $kendo-theme-colors: (
         --kendo-component-text: #{$kendo-component-text};
         --kendo-component-border: #{$kendo-component-border};
 
-        --kendo-box-shadow-depth-1: #{$kendo-box-shadow-depth-1};
-        --kendo-box-shadow-depth-2: #{$kendo-box-shadow-depth-2};
-        --kendo-box-shadow-depth-3: #{$kendo-box-shadow-depth-3};
-        --kendo-box-shadow-depth-4: #{$kendo-box-shadow-depth-4};
-
         --kendo-link-text: #{$kendo-link-text};
         --kendo-link-hover-text: #{$kendo-link-hover-text};
 
@@ -4692,6 +4824,7 @@ $kendo-components: (
     "panelbar",
     "splitter",
     "tile-layout",
+    "dock-manager",
 
     // Data management
     "grid",
@@ -4864,6 +4997,11 @@ $_kendo-dependencies: (
         "treeview"
     ),
     dropzone: (),
+    dock-manager: (
+        "splitter",
+        "toolbar",
+        "tabstrip"
+    ),
     editor: (
         "button",
         "checkbox",
@@ -5717,6 +5855,9 @@ $_imported: () !default;
     @include kendo-core--styles--selection();
 }
 
+// #endregion
+// #region @import "./elevation/index.import.scss"; -> node_modules/@progress/kendo-theme-core/scss/elevation/index.import.scss
+// File already imported_once. Skipping output.
 // #endregion
 // #region @import "./_variables.scss"; -> node_modules/@progress/kendo-theme-core/scss/_variables.scss
 // #region @import "./functions/index.import.scss"; -> node_modules/@progress/kendo-theme-core/scss/functions/index.import.scss
@@ -5808,6 +5949,9 @@ $kendo-zindex-loading: 100 !default;
 // Expose
 @include exports("kendo-core-styles") {
     @include kendo-core--styles();
+
+    // Elevation System
+    @include kendo-elevation--styles();
 }
 
 // #endregion
@@ -6733,6 +6877,51 @@ $kendo-zindex-loading: 100 !default;
 
 // #endregion
 
+// #endregion
+// #region @import "./_indicators.scss"; -> scss/common/_indicators.scss
+// #region @import "@progress/kendo-theme-default/scss/common/_indicators.scss"; -> node_modules/@progress/kendo-theme-default/scss/common/_indicators.scss
+@include exports( "common/indicators/current-time" ) {
+
+    $kendo-current-time-width: 1px !default;
+    $kendo-current-time-color: #ff0000 !default;
+
+    // Layout
+    .k-current-time {
+        width: $kendo-current-time-width;
+        position: absolute;
+
+        &.k-current-time-arrow-left,
+        &.k-current-time-arrow-right,
+        &.k-current-time-arrow-down {
+            width: 0;
+            height: 0;
+            background: transparent;
+            border: 4px solid transparent;
+        }
+    }
+
+
+    // Theme
+    .k-current-time {
+        background: $kendo-current-time-color;
+
+        &.k-current-time-arrow-left {
+            border-right-color: $kendo-current-time-color;
+        }
+
+        &.k-current-time-arrow-right {
+            border-left-color: $kendo-current-time-color;
+        }
+
+        &.k-current-time-arrow-down {
+            border-top-color: $kendo-current-time-color;
+        }
+    }
+
+}
+
+// #endregion
+
 // #endregion
 // #region @import "./_resizing.scss"; -> scss/common/_resizing.scss
 // #region @import "@progress/kendo-theme-default/scss/common/_resizing.scss"; -> node_modules/@progress/kendo-theme-default/scss/common/_resizing.scss
@@ -14766,6 +14955,21 @@ $kendo-utils: (
 
 // #endregion
 
+// #region @import "./elevation/index.import.scss"; -> node_modules/@progress/kendo-theme-utils/scss/elevation/index.import.scss
+// #region @import "@progress/kendo-theme-core/scss/elevation/index.import.scss"; -> node_modules/@progress/kendo-theme-core/scss/elevation/index.import.scss
+// File already imported_once. Skipping output.
+// #endregion
+
+@mixin kendo-utils--elevation {
+    @each $level, $elevation in $kendo-elevation {
+        .k-elevation-#{$level} {
+            box-shadow: $elevation;
+        }
+    }
+}
+
+// #endregion
+
 
 // Mixin for all styles
 @mixin kendo-utils() {
@@ -14783,6 +14987,8 @@ $kendo-utils: (
     @include kendo-utils--transform();
     @include kendo-utils--interactivity();
     @include kendo-utils--svg();
+
+    @include kendo-utils--elevation();
 }
 
 // #endregion
@@ -18731,7 +18937,7 @@ $kendo-popup-text: $kendo-component-text !default;
 $kendo-popup-border: $kendo-component-border !default;
 /// Box shadow of the popup.
 /// @group popup
-$kendo-popup-shadow: 0 2px 4px -1px rgba( $elevation, .2 ), 0 4px 5px 0 rgba( $elevation, .14 ), 0 1px 10px 0 rgba( $elevation, .12 ) !default;
+$kendo-popup-shadow: $box-shadow-depth-4 !default;
 
 // #endregion
 // #region @import "./_layout.scss"; -> scss/popup/_layout.scss
@@ -20493,7 +20699,7 @@ $kendo-button-active-border: null !default;
 $kendo-button-active-gradient: null !default;
 /// The base shadow of the active Button.
 /// @group button
-$kendo-button-active-shadow: $box-shadow-depth-3 !default;
+$kendo-button-active-shadow: $box-shadow-depth-6 !default;
 
 /// The base background color of the selected Button.
 /// @group button
@@ -24262,7 +24468,7 @@ $kendo-toolbar-border: null !default;
 $kendo-toolbar-gradient: null !default;
 /// The box shadow of the Toolbar.
 /// @group toolbar
-$kendo-toolbar-shadow: $box-shadow-depth-2 !default;
+$kendo-toolbar-shadow: $box-shadow-depth-4 !default;
 
 /// The color of the separator border of the Toolbar.
 /// @group toolbar
@@ -25433,6 +25639,8 @@ $kendo-tooltip-bg: material-color( gray, 700, .9 ) !default;
 $kendo-tooltip-text: get-base-contrast( gray, 700 ) !default;
 $kendo-tooltip-border: $kendo-tooltip-bg !default;
 
+$kendo-tooltip-shadow: $box-shadow-depth-2 !default;
+
 $kendo-tooltip-primary-bg: $kendo-color-primary !default;
 $kendo-tooltip-primary-text: k-contrast-color( $kendo-tooltip-primary-bg ) !default;
 $kendo-tooltip-primary-border: $kendo-tooltip-primary-bg !default;
@@ -25534,10 +25742,10 @@ $kendo-window-text: $kendo-component-text !default;
 $kendo-window-border: $kendo-component-border !default;
 /// The box shadow of the Window.
 /// @group window
-$kendo-window-shadow: $box-shadow-depth-4 !default;
+$kendo-window-shadow: $box-shadow-depth-8 !default;
 /// The box shadow of the focused Window.
 /// @group window
-$kendo-window-focus-shadow: $box-shadow-depth-5 !default;
+$kendo-window-focus-shadow: $box-shadow-depth-9 !default;
 
 /// The background color of the Window titlebar.
 /// @group window
@@ -26451,7 +26659,7 @@ $_kendo-module-meta: (
 
     .k-tooltip-wrapper {
         .k-tooltip {
-            box-shadow: $kendo-popup-shadow;
+            box-shadow: $kendo-tooltip-shadow;
         }
     }
 
@@ -31495,6 +31703,7 @@ $kendo-calendar-sizes: (
         );
 
 
+        // TODO: do we even use this?
         // Header / footer
         .k-header {
             @include fill(
@@ -32972,7 +33181,7 @@ $kendo-color-gradient-border: $kendo-component-border !default;
 $kendo-color-gradient-focus-border: $kendo-hover-border !default;
 /// The box shadow of the focused ColorGradient.
 /// @group cologradient
-$kendo-color-gradient-focus-shadow: $box-shadow-depth-2 !default;
+$kendo-color-gradient-focus-shadow: $box-shadow-depth-3 !default;
 
 /// The border radius of the ColorGradient canvas.
 /// @group cologradient
@@ -33010,6 +33219,9 @@ $kendo-color-gradient-draghandle-height: 14px !default;
 /// The width of the border around the ColorGradient canvas drag handle.
 /// @group cologradient
 $kendo-color-gradient-draghandle-border-width: 1px !default;
+/// The width of the outline around the ColorGradient canvas drag handle.
+/// @group cologradient
+$kendo-color-gradient-draghandle-outline-width: 1px !default;
 /// The border radius of the ColorGradient canvas drag handle.
 /// @group cologradient
 $kendo-color-gradient-draghandle-border-radius: 50% !default;
@@ -33022,15 +33234,18 @@ $kendo-color-gradient-draghandle-bg: transparent !default;
 /// The color of the border around the ColorGradient canvas drag handle.
 /// @group cologradient
 $kendo-color-gradient-draghandle-border: rgba( white, .8 ) !default;
-/// The box shadow of the ColorGradient canvas drag handle.
+/// The color of the outline around the ColorGradient canvas drag handle.
+/// @group cologradient
+$kendo-color-gradient-draghandle-shadow: rgba( $kendo-color-black, .5) !default;
+/// The focus color of the outline around the ColorGradient canvas drag handle.
 /// @group cologradient
-$kendo-color-gradient-draghandle-shadow: 0 1px 4px rgba( black, .5 ) !default;
-/// The box shadow of the focused ColorGradient canvas drag handle.
+$kendo-color-gradient-draghandle-focus-shadow: $kendo-color-black !default;
+/// The outline color of the outline around the ColorGradient canvas drag handle.
 /// @group cologradient
-$kendo-color-gradient-draghandle-focus-shadow: 0 1px 4px black !default;
-/// The box shadow of the hovered ColorGradient canvas drag handle.
+$kendo-color-gradient-draghandle-hover-shadow: $kendo-color-black !default;
+/// The box shadow of the ColorGradient canvas drag handle.
 /// @group cologradient
-$kendo-color-gradient-draghandle-hover-shadow: $kendo-color-gradient-draghandle-focus-shadow !default;
+$kendo-color-gradient-draghandle-shadow: k-elevation(2) !default;
 
 /// The vertical margin of the ColorGradient canvas drag handle.
 /// @group cologradient
@@ -33058,6 +33273,7 @@ $kendo-color-gradient-contrast-ratio-font-weight: $kendo-font-weight-medium !def
 /// The spacing between the items in the ColorGradient contrast tool.
 /// @group cologradient
 $kendo-color-gradient-contrast-spacer: k-map-get( $kendo-spacing, 2 ) !default;
+
 // #endregion
 // #region @import "./_layout.scss"; -> scss/colorgradient/_layout.scss
 // #region @import "@progress/kendo-theme-default/scss/colorgradient/_layout.scss"; -> node_modules/@progress/kendo-theme-default/scss/colorgradient/_layout.scss
@@ -33130,6 +33346,8 @@ $kendo-color-gradient-contrast-spacer: k-map-get( $kendo-spacing, 2 ) !default;
         height: $kendo-color-gradient-draghandle-height;
         border-width: $kendo-color-gradient-draghandle-border-width;
         border-style: solid;
+        outline-width: $kendo-color-gradient-draghandle-outline-width;
+        outline-style: solid;
         box-sizing: border-box;
     }
 
@@ -33295,12 +33513,14 @@ $kendo-color-gradient-contrast-spacer: k-map-get( $kendo-spacing, 2 ) !default;
             $kendo-color-gradient-draghandle-bg,
             $kendo-color-gradient-draghandle-border
         );
+        outline-color: $kendo-color-gradient-draghandle-focus-shadow;
         @include box-shadow( $kendo-color-gradient-draghandle-shadow );
 
         &:focus,
         &.k-focus {
             @include fill( $bg: transparent, $border: $kendo-color-white );
-            @include focus-indicator( $kendo-color-gradient-draghandle-focus-shadow );
+            outline-color: $kendo-color-gradient-draghandle-focus-shadow;
+            @include focus-indicator( $kendo-color-gradient-draghandle-shadow );
         }
 
         &:hover,
@@ -33308,7 +33528,7 @@ $kendo-color-gradient-contrast-spacer: k-map-get( $kendo-spacing, 2 ) !default;
         &.k-active,
         &:active {
             @include fill( $bg: transparent, $border: $kendo-color-white );
-            @include box-shadow( $kendo-color-gradient-draghandle-hover-shadow );
+            outline-color: $kendo-color-gradient-draghandle-hover-shadow;
         }
     }
 
@@ -33463,7 +33683,7 @@ $kendo-color-editor-border: $kendo-component-border !default;
 $kendo-color-editor-focus-border: $kendo-hover-border !default;
 /// The box shadow of the focused ColorEditor.
 /// @group coloreditor
-$kendo-color-editor-focus-shadow: $box-shadow-depth-2 !default;
+$kendo-color-editor-focus-shadow: $box-shadow-depth-3 !default;
 
 /// The vertical padding of the ColorEditor header.
 /// @group coloreditor
@@ -33504,6 +33724,7 @@ $kendo-color-editor-color-gradient-focus-outline: 2px !default;
 /// The outline offset of the focused ColorGradient.
 /// @group coloreditor
 $kendo-color-editor-color-gradient-focus-outline-offset: 2px !default;
+
 // #endregion
 // #region @import "./_layout.scss"; -> scss/coloreditor/_layout.scss
 // #region @import "@progress/kendo-theme-default/scss/coloreditor/_layout.scss"; -> node_modules/@progress/kendo-theme-default/scss/coloreditor/_layout.scss
@@ -36047,14 +36268,14 @@ $kendo-rating-icon-focus-selected-shadow: 0 2px 4px rgba( black, .1) !default;
                     text-shadow: $kendo-rating-icon-focus-shadow;
                 }
                 > .k-svg-icon {
-                    filter: drop-shadow( $kendo-rating-icon-focus-shadow );
+                    filter: k-shadow-filter($kendo-rating-icon-focus-selected-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 );
+                    filter: k-shadow-filter($kendo-rating-icon-focus-selected-shadow);
                 }
             }
         }
@@ -37683,10 +37904,11 @@ $kendo-appbar-dark-text: k-contrast-color( $kendo-color-dark ) !default;
 
 /// The box shadow of the AppBar.
 /// @group appbar
-$kendo-appbar-box-shadow: 0px 2px 3px rgba( black, .24 ) !default;
+$kendo-appbar-box-shadow: $box-shadow-depth-4 !default;
 /// The box shadow of the AppBar with bottom position.
 /// @group appbar
-$kendo-appbar-bottom-box-shadow: 0px -2px 3px rgba( black, .24 ) !default;
+$kendo-appbar-bottom-box-shadow: $kendo-appbar-box-shadow !default;
+
 // #endregion
 // #region @import "./_layout.scss"; -> scss/appbar/_layout.scss
 // #region @import "@progress/kendo-theme-default/scss/appbar/_layout.scss"; -> node_modules/@progress/kendo-theme-default/scss/appbar/_layout.scss
@@ -38037,13 +38259,13 @@ $kendo-fab-sizes: (
 
 /// The base shadow of the FAB.
 /// @group floating-action-button
-$kendo-fab-shadow: 0px 3px 5px -1px rgba( black, .2 ), 0px 6px 10px rgba( black, .14 ), 0px 1px 18px rgba( black, .12 ) !default;
+$kendo-fab-shadow: $box-shadow-depth-5 !default;
 /// The shadow of the disabled FAB.
 /// @group floating-action-button
-$kendo-fab-disabled-shadow: 0px 3px 5px -1px k-try-tint( rgba( black, .2 ), .5 ), 0px 6px 10px k-try-tint( rgba( black, .14 ), .5 ), 0px 1px 18px k-try-tint( rgba( black, .12 ), .5 ) !default;
+$kendo-fab-disabled-shadow: $box-shadow-depth-5 !default;
 /// The shadow of the active FAB.
 /// @group floating-action-button
-$kendo-fab-active-shadow: 0px 5px 5px -3px rgba( black, .2 ), 0px 8px 10px 1px rgba( black, .14 ), 0px 3px 14px 2px rgba( black, .12 ) !default;
+$kendo-fab-active-shadow: $box-shadow-depth-7 !default;
 
 /// The base text color of the FAB item.
 /// @group floating-action-button
@@ -38577,7 +38799,7 @@ $kendo-actionsheet-line-height: k-math-div( 20, 14 ) !default;
 $kendo-actionsheet-bg: $kendo-component-bg !default;
 $kendo-actionsheet-text: $kendo-component-text !default;
 $kendo-actionsheet-border: $kendo-component-border !default;
-$kendo-actionsheet-shadow: $box-shadow-depth-4 !default;
+$kendo-actionsheet-shadow: $box-shadow-depth-7 !default;
 
 
 // Actionsheet header
@@ -40483,12 +40705,12 @@ $kendo-card-deck-gap: k-map-get( $kendo-spacing, 4 ) !default;
 $kendo-card-bg: $kendo-component-bg !default;
 $kendo-card-text: $kendo-component-text !default;
 $kendo-card-border: $kendo-component-border !default;
-$kendo-card-shadow: $box-shadow-depth-2 !default;
+$kendo-card-shadow: $box-shadow-depth-1 !default;
 
 $kendo-card-focus-bg: null !default;
 $kendo-card-focus-text: null !default;
 $kendo-card-focus-border: null !default;
-$kendo-card-focus-shadow: $box-shadow-depth-4 !default;
+$kendo-card-focus-shadow: $box-shadow-depth-3 !default;
 
 $kendo-card-header-padding-x: $kendo-card-padding-x !default;
 $kendo-card-header-padding-y: $kendo-card-padding-y !default;
@@ -41569,7 +41791,7 @@ $kendo-bottom-nav-item-gap: 0 k-map-get( $kendo-spacing, 1 ) !default;
 
 /// The box shadow of the BottomNavigation.
 /// @group bottom-navigation
-$kendo-bottom-nav-shadow: 0px 0px 5px rgba( black, .12 ) !default;
+$kendo-bottom-nav-shadow: $box-shadow-depth-4 !default;
 
 /// The text color of the flat BottomNavigation.
 /// @group bottom-navigation
@@ -41580,6 +41802,7 @@ $kendo-bottom-nav-flat-bg: $kendo-component-bg !default;
 /// The border color of the flat BottomNavigation.
 /// @group bottom-navigation
 $kendo-bottom-nav-flat-border: $kendo-component-border !default;
+
 // #endregion
 // #region @import "./_layout.scss"; -> scss/bottom-navigation/_layout.scss
 // #region @import "@progress/kendo-theme-default/scss/bottom-navigation/_layout.scss"; -> node_modules/@progress/kendo-theme-default/scss/bottom-navigation/_layout.scss
@@ -41618,6 +41841,7 @@ $kendo-bottom-nav-flat-border: $kendo-component-border !default;
         border-width: $kendo-bottom-nav-border-width;
     }
 
+    // TODO: do we even use this?
     .k-bottom-nav-shadow {
         box-shadow: $kendo-bottom-nav-shadow;
     }
@@ -43617,7 +43841,7 @@ $kendo-tabstrip-item-selected-gradient: null !default;
 
 $kendo-tabstrip-item-focus-shadow: $kendo-list-item-focus-shadow !default;
 
-$kendo-tabstrip-item-dragging-shadow: 0 4px 5px 0 rgba( black, .14 ), 0 1px 10px 0 rgba( black, .12 ), 0 2px 4px -1px rgba( black, .2 ) !default;
+$kendo-tabstrip-item-dragging-shadow: $box-shadow-depth-3 !default;
 
 $kendo-tabstrip-item-disabled-bg: null !default;
 $kendo-tabstrip-item-disabled-text: k-map-get( $theme, disabled-text ) !default;
@@ -45374,6 +45598,7 @@ $kendo-splitbar-selected-text: $kendo-color-primary-contrast !default;
         // Pane
         .k-pane {
             overflow: hidden;
+            box-sizing: border-box;
         }
         .k-scrollable {
             overflow: auto;
@@ -45815,6 +46040,471 @@ $kendo-tile-layout-hint-bg: rgba( white, .2 ) !default;
     @include kendo-tile-layout--styles();
 }
 
+// #endregion
+// #region @import "./dock-manager/_index.scss"; -> scss/dock-manager/_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
+
+// Module meta
+$_kendo-module-meta: (
+    name: "dock-manager",
+    dependencies: (
+        "splitter",
+        "toolbar",
+        "tabstrip"
+    )
+);
+
+// Dependencies
+// #region @import "../splitter/_index.scss"; -> scss/splitter/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
+// #region @import "../toolbar/_index.scss"; -> scss/toolbar/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
+// #region @import "../tabstrip/_index.scss"; -> scss/tabstrip/_index.scss
+// File already imported_once. Skipping output.
+// #endregion
+
+// Component
+// #region @import "./_variables.scss"; -> scss/dock-manager/_variables.scss
+///  The width of the border around the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-border-width: 1px !default;
+/// The style of the border around the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-border-style: solid !default;
+/// The color of the border around the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-border: $kendo-base-border !default;
+
+/// The vertical padding of the pane header in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-pane-header-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
+/// The horizontal padding of the pane header in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-pane-header-padding-x: k-map-get( $kendo-spacing, 6 ) !default;
+/// The width of the border around the pane header in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-pane-header-border-width: $kendo-dock-manager-border-width !default;
+///  The style of the border around the pane header in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-pane-header-border-style: solid !default;
+/// The background color of the pane header in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-pane-header-bg: $kendo-component-bg !default;
+
+/// The vertical padding of the pane title in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-pane-title-padding-y: null !default;
+/// The horizontal padding of the pane title in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-pane-title-padding-x: null !default;
+/// The font family of the pane title in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-pane-title-font-family: $kendo-font-family !default;
+/// The font size of the pane title in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-pane-title-font-size: $kendo-font-size-lg !default;
+/// The line height of the pane title in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-pane-title-line-height: $kendo-line-height-sm !default;
+/// The font weight of the pane title in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-pane-title-font-weight: $kendo-font-weight-normal !default;
+
+/// The horizontal padding of the pane content in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-pane-content-padding-x: $kendo-dock-manager-pane-header-padding-x !default;
+/// The vertical padding of the pane content in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-pane-content-padding-y: $kendo-dock-manager-pane-header-padding-x !default;
+
+/// The horizontal padding of the tabbed pane in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-tabbed-pane-padding-y: null !default;
+/// The horizontal padding of the tabbed pane in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-tabbed-pane-padding-x: null !default;
+
+/// The width of the unpinned pane container in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-unpinned-container-width: 300px !default;
+/// The background-color of the unpinned pane container in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-unpinned-container-bg: $kendo-color-white !default;
+/// The box shadow of the unpinned pane container in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-unpinned-container-shadow: 4px 0px 5px 0px rgba(0, 0, 0, 0.04), 2px 0px 4px 0px rgba(0, 0, 0, 0.03) !default;
+
+/// The padding of the dock indicator in the DockManager component.
+/// @group dock-manager
+$kendo-dock-indicator-padding: k-map-get( $kendo-spacing, 1.5 ) !default;
+/// The background color of the dock indicator in the DockManager component.
+/// @group dock-manager
+$kendo-dock-indicator-bg: $kendo-base-bg !default;
+/// The text color of the dock indicator in the DockManager component.
+/// @group dock-manager
+$kendo-dock-indicator-text: $kendo-color-primary !default;
+/// The outline width of the dock indicator in the DockManager component.
+/// @group dock-manager
+$kendo-dock-indicator-outline-width: 1px !default;
+/// The outline style of the dock indicator in the DockManager component.
+/// @group dock-manager
+$kendo-dock-indicator-outline-style: solid !default;
+/// The outline color of the dock indicator in the DockManager component.
+/// @group dock-manager
+$kendo-dock-indicator-outline: $kendo-dock-indicator-text !default;
+/// The box shadow of the dock indicator in the DockManager component.
+/// @group dock-manager
+$kendo-dock-indicator-shadow: drop-shadow( 0px 1px 18px rgba(0, 0, 0, 0.12) ) drop-shadow( 0px 6px 10px rgba(0, 0, 0, 0.14) ) drop-shadow( 0px 3px 5px rgba(0, 0, 0, 0.20) ) !default;
+
+///  The background color of the hovered dock indicator in the DockManager component.
+/// @group dock-manager
+$kendo-dock-indicator-hover-bg: k-color-mix( $kendo-color-white, $kendo-color-primary, 8% ) !default;
+/// The text color of the hovered dock indicator in the DockManager component.
+/// @group dock-manager
+$kendo-dock-indicator-hover-text: $kendo-color-white !default;
+
+/// The width of the border around the dropping area in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-dock-preview-border-width: 1px !default;
+/// The style of the border around the dropping area in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-dock-preview-border-style: dashed !default;
+/// The border radius of the dropping area in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-dock-preview-border-radius: $kendo-border-radius-sm !default;
+/// The background color of the dropping area in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-dock-preview-bg: rgba( $kendo-color-primary, .16 ) !default;
+/// The border color of the dropping area in the DockManager component.
+/// @group dock-manager
+$kendo-dock-manager-dock-preview-border: $kendo-color-primary !default;
+
+// #endregion
+// #region @import "./_layout.scss"; -> scss/dock-manager/_layout.scss
+// #region @import "@progress/kendo-theme-default/scss/dock-manager/_layout.scss"; -> node_modules/@progress/kendo-theme-default/scss/dock-manager/_layout.scss
+@mixin kendo-dock-manager--layout-base() {
+
+    // DockManager
+    .k-dock-manager {
+        width: 100%;
+        height: 100%;
+        border-width: $kendo-dock-manager-border-width;
+        border-style: $kendo-dock-manager-border-style;
+        position: relative;
+        display: flex;
+        flex-flow: row nowrap;
+        overflow: auto;
+        box-sizing: border-box;
+    }
+
+    // Toolbar
+    .k-dock-manager-toolbar {
+        border-width: 0 $kendo-dock-manager-border-width 0 0;
+        border-color: inherit;
+        flex-shrink: 0;
+        writing-mode: vertical-lr;
+        box-shadow: none;
+
+        &::before {
+            height: 0;
+        }
+
+        .k-separator-horizontal {
+            width:  $kendo-line-height-em;
+            height: 0;
+            border-width: $kendo-dock-manager-border-width 0 0;
+        }
+
+        // Needed because of a bug in Chrome - Issue 1473554
+        // A fix will be shipped likely in milestone 118 and then we can revisit this
+        @supports  (not (-ms-ime-mode: none)) and (not (overflow: -webkit-marquee)) and (not (-moz-appearance:none)) {
+            .k-toolbar-button {
+                padding-block: $kendo-button-padding-x;
+                padding-inline: $kendo-button-padding-y;
+            }
+            .k-toolbar-button .k-button-text {
+                writing-mode: vertical-lr;
+            }
+        }
+    }
+
+    // Panes
+    .k-dock-manager-pane-container {
+        width: 100%;
+        height: 100%;
+        display: flex;
+        flex-grow: 1;
+        overflow: hidden;
+    }
+
+    // Splitter
+    .k-dock-manager-splitter,
+    .k-dock-manager-unpinned-container {
+        height: 100%;
+        border-width: 0;
+        align-items: stretch;
+
+        > .k-pane {
+            height: auto;
+            flex-direction: column;
+            border-color: inherit;
+        }
+
+        .k-pane-header {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            padding-block: $kendo-dock-manager-pane-header-padding-y;
+            padding-inline: $kendo-dock-manager-pane-header-padding-x;
+            border-block-end-width: $kendo-dock-manager-pane-header-border-width;
+            border-block-end-style: $kendo-dock-manager-pane-header-border-style;
+            border-color: inherit;
+        }
+
+        .k-pane-title {
+            padding-block: $kendo-dock-manager-pane-title-padding-y;
+            padding-inline: $kendo-dock-manager-pane-title-padding-x;
+            font-family: $kendo-dock-manager-pane-title-font-family;
+            font-size: $kendo-dock-manager-pane-title-font-size;
+            line-height: $kendo-dock-manager-pane-title-line-height;
+            font-weight: $kendo-dock-manager-pane-title-font-weight;
+            flex: 1 1 auto;
+            white-space: nowrap;
+            text-overflow: ellipsis;
+            overflow: hidden;
+        }
+
+        .k-pane-scrollable {
+            height: 100%;
+            display: flex;
+            flex-direction: column;
+            border-color: inherit;
+        }
+
+        .k-pane-content {
+            height: 100%;
+            padding-block: $kendo-dock-manager-pane-content-padding-y;
+            padding-inline: $kendo-dock-manager-pane-content-padding-x;
+            overflow: auto;
+            flex: 1;
+        }
+
+        .k-pane-actions {
+            display: flex;
+            flex-flow: row nowrap;
+            align-items: center;
+            justify-content: center;
+        }
+
+        .k-pane-tabbed {
+            padding-block-start: $kendo-dock-manager-tabbed-pane-padding-y;
+            padding-block-end: $kendo-dock-manager-tabbed-pane-padding-x;
+            padding-inline: $kendo-dock-manager-tabbed-pane-padding-x;
+        }
+
+        .k-splitbar {
+            border-width: 0 1px;
+            border-style: solid;
+            border-color: inherit;
+        }
+        .k-splitbar-vertical {
+            border-width: 1px 0;
+        }
+    }
+
+    // Unpinned pane
+    .k-dock-manager-unpinned-container {
+        width: $kendo-dock-manager-unpinned-container-width;
+        position: absolute;
+        display: flex;
+        height: 100%;
+        border-color: inherit;
+        z-index: 20;
+
+        .k-pane {
+            display: inline-flex;
+            flex-direction: column;
+            position: relative;
+            flex: 1 1 auto;
+        }
+
+        .k-splitbar {
+            height: 100%;
+            position: relative;
+            flex: none;
+        }
+    }
+
+    // Docking preview
+    .k-docking-preview {
+        width: 100%;
+        height: 100%;
+        box-sizing: border-box;
+        display: flex;
+        position: absolute;
+        top: 0;
+        left: 0;
+        border-width: $kendo-dock-manager-dock-preview-border-width;
+        border-style: $kendo-dock-manager-dock-preview-border-style;
+        border-radius: $kendo-dock-manager-dock-preview-border-radius;
+        z-index: 10;
+    }
+
+}
+
+@mixin kendo-dock-navigator--layout() {
+
+    // DockNavigator
+    .k-dock-navigator-container {
+        width: 100%;
+        height: 100%;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        position: absolute;
+        z-index: 10001;
+        pointer-events: none;
+    }
+
+    .k-dock-navigator {
+        display: grid;
+        grid-template-columns: repeat(3, auto);
+        grid-template-rows: repeat(3, auto);
+        justify-content: center;
+        position: absolute;
+    }
+
+    .k-dock-indicator {
+        padding: $kendo-dock-indicator-padding;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        box-sizing: border-box;
+        position: relative;
+        pointer-events: all;
+        outline-width: $kendo-dock-indicator-outline-width;
+        outline-style: $kendo-dock-indicator-outline-style;
+
+        &.k-dock-indicator-middle {
+            filter: none;
+        }
+    }
+
+    .k-dock-indicator-top {
+        grid-area: 1 / 2 / auto;
+    }
+    .k-dock-indicator-right {
+        grid-area: 2 / 3 / auto;
+    }
+    .k-dock-indicator-bottom {
+        grid-area: 3 / 2 / auto;
+    }
+    .k-dock-indicator-left {
+        grid-area: 2 / 1 / auto;
+    }
+    .k-dock-indicator-middle {
+        grid-area: 2 / 2 / auto;
+    }
+
+}
+
+@mixin kendo-dock-manager--layout() {
+    @include kendo-dock-manager--layout-base();
+    @include kendo-dock-navigator--layout();
+}
+
+// #endregion
+
+@mixin kendo-dock-manager--layout() {
+    @include kendo-dock-manager--layout-base();
+    @include kendo-dock-navigator--layout();
+}
+
+// #endregion
+// #region @import "./_theme.scss"; -> scss/dock-manager/_theme.scss
+// #region @import "@progress/kendo-theme-default/scss/dock-manager/_theme.scss"; -> node_modules/@progress/kendo-theme-default/scss/dock-manager/_theme.scss
+@mixin kendo-dock-manager--theme-base() {
+
+    // DockManager
+    .k-dock-manager {
+        border-color: $kendo-dock-manager-border;
+    }
+
+    // Splitter
+    .k-dock-manager-splitter .k-pane-header,
+    .k-dock-manager-unpinned-container .k-pane-header {
+        background-color: $kendo-dock-manager-pane-header-bg;
+    }
+
+    .k-dock-manager-unpinned-container {
+        background-color: $kendo-dock-manager-unpinned-container-bg;
+        @include box-shadow( $kendo-dock-manager-unpinned-container-shadow );
+    }
+
+    // Docking preview
+    .k-docking-preview {
+        background-color: $kendo-dock-manager-dock-preview-bg;
+        border-color: $kendo-dock-manager-dock-preview-border;
+    }
+
+}
+
+@mixin kendo-dock-navigator--theme() {
+
+    .k-dock-indicator {
+        color: $kendo-dock-indicator-text;
+        background-color: $kendo-dock-indicator-bg;
+        outline-color: $kendo-dock-indicator-outline;
+        filter: $kendo-dock-indicator-shadow;
+
+        &:hover,
+        &.k-hover {
+            background-color: $kendo-dock-indicator-hover-bg;
+            color: $kendo-dock-indicator-hover-text;
+        }
+    }
+
+}
+
+@mixin kendo-dock-manager--theme() {
+    @include kendo-dock-manager--theme-base();
+    @include kendo-dock-navigator--theme();
+}
+
+// #endregion
+
+@mixin kendo-dock-manager--theme() {
+    @include kendo-dock-manager--theme-base();
+    @include kendo-dock-navigator--theme();
+}
+
+// #endregion
+
+// Register
+// #region @import "../core/module-system/index.import.scss"; -> scss/core/module-system/index.import.scss
+// File already imported_once. Skipping output.
+// #endregion
+@include module-register( $_kendo-module-meta... );
+
+// Expose
+@mixin kendo-dock-manager--styles() {
+    @include module-render("dock-manager") {
+        @include kendo-dock-manager--layout();
+        @include kendo-dock-manager--theme();
+    }
+}
+
+@if $kendo-auto-bootstrap {
+    @include kendo-dock-manager--styles();
+}
+
 // #endregion
 
 
@@ -51108,10 +51798,10 @@ $kendo-pivotgrid-configurator-header-bg: null !default;
 $kendo-pivotgrid-configurator-header-text: $kendo-component-header-text !default;
 $kendo-pivotgrid-configurator-header-border: null !default;
 
-$kendo-pivotgrid-configurator-end-shadow: -3px 0px 6px rgba( black, .16 ) !default;
-$kendo-pivotgrid-configurator-start-shadow: 3px 0px 6px rgba( black, .16 ) !default;
-$kendo-pivotgrid-configurator-top-shadow: 0px -3px 6px rgba( black, .16 ) !default;
-$kendo-pivotgrid-configurator-bottom-shadow: 0px 3px 6px rgba( black, .16 ) !default;
+$kendo-pivotgrid-configurator-end-shadow: $box-shadow-depth-3 !default;
+$kendo-pivotgrid-configurator-start-shadow: $box-shadow-depth-3 !default;
+$kendo-pivotgrid-configurator-top-shadow: $box-shadow-depth-3 !default;
+$kendo-pivotgrid-configurator-bottom-shadow: $box-shadow-depth-3 !default;
 
 $kendo-pivotgrid-configurator-button-padding-x: k-map-get( $kendo-spacing, 1 ) !default;
 $kendo-pivotgrid-configurator-button-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
@@ -56487,8 +57177,6 @@ $kendo-scheduler-cell-height: $kendo-line-height-md * 1rem !default;
 $kendo-scheduler-datecolumn-width: 12rem !default;
 $kendo-scheduler-timecolumn-width: 11rem !default;
 
-$kendo-scheduler-current-time-color: #ff0000 !default;
-
 $kendo-scheduler-nonwork-bg: k-try-shade( $kendo-scheduler-bg, .5 ) !default;
 $kendo-scheduler-nonwork-text: null !default;
 
@@ -56516,7 +57204,7 @@ $kendo-scheduler-tooltip-border-width: 0 !default;
 $kendo-scheduler-tooltip-bg: $kendo-color-primary-contrast !default;
 $kendo-scheduler-tooltip-text: $kendo-base-text !default;
 $kendo-scheduler-tooltip-border: null !default;
-$kendo-scheduler-tooltip-shadow: 0px 0px 10px rgba( black, .2 ) !default;
+$kendo-scheduler-tooltip-shadow: $box-shadow-depth-2 !default;
 
 $kendo-scheduler-tooltip-title-margin-y: k-map-get( $kendo-spacing, 2 ) !default;
 $kendo-scheduler-tooltip-month-font-size: $kendo-font-size-sm !default;
@@ -57073,20 +57761,6 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
         }
     }
 
-    // Current time
-    .k-current-time {
-        position: absolute;
-
-        &.k-current-time-arrow-left,
-        &.k-current-time-arrow-right,
-        &.k-current-time-arrow-down {
-            width: 0;
-            height: 0;
-            background: transparent;
-            border: 4px solid transparent;
-        }
-    }
-
     // Draging hint
     .k-event-drag-hint {
         opacity: .5;
@@ -57767,23 +58441,6 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
         );
     }
 
-    // Current time
-    .k-current-time {
-        background: $kendo-scheduler-current-time-color;
-
-        &.k-current-time-arrow-left {
-            border-right-color: $kendo-scheduler-current-time-color;
-        }
-
-        &.k-current-time-arrow-right {
-            border-left-color: $kendo-scheduler-current-time-color;
-        }
-
-        &.k-current-time-arrow-down {
-            border-top-color: $kendo-scheduler-current-time-color;
-        }
-    }
-
     // Header and footer
     .k-scheduler-toolbar {
         @include fill(
@@ -58167,16 +58824,16 @@ $kendo-chat-border: $kendo-component-border !default;
 $kendo-chat-bubble-bg: $kendo-component-bg !default;
 $kendo-chat-bubble-text: $kendo-component-text !default;
 $kendo-chat-bubble-border: $kendo-chat-bubble-bg !default;
-$kendo-chat-bubble-shadow: 0 1px 2px rgba( black, .08 ) !default;
-$kendo-chat-bubble-hover-shadow: 0 1px 2px rgba( black, .16 ) !default;
-$kendo-chat-bubble-selected-shadow: 0 3px 10px rgba( black, .16 ) !default;
+$kendo-chat-bubble-shadow: $box-shadow-depth-1 !default;
+$kendo-chat-bubble-hover-shadow: $box-shadow-depth-2 !default;
+$kendo-chat-bubble-selected-shadow: $box-shadow-depth-3 !default;
 
 $kendo-chat-alt-bubble-bg: $kendo-color-primary !default;
 $kendo-chat-alt-bubble-text: k-contrast-color( $kendo-chat-alt-bubble-bg ) !default;
 $kendo-chat-alt-bubble-border: $kendo-chat-alt-bubble-bg !default;
-$kendo-chat-alt-bubble-shadow: 0 1px 2px rgba( $kendo-chat-alt-bubble-bg, .2 ) !default;
-$kendo-chat-alt-bubble-hover-shadow: 0 1px 2px rgba( $kendo-chat-alt-bubble-bg, .2 ) !default;
-$kendo-chat-alt-bubble-selected-shadow: 0 3px 10px rgba( $kendo-chat-alt-bubble-bg, .4 ) !default;
+$kendo-chat-alt-bubble-shadow: $box-shadow-depth-1 !default;
+$kendo-chat-alt-bubble-hover-shadow: $box-shadow-depth-2 !default;
+$kendo-chat-alt-bubble-selected-shadow: $box-shadow-depth-3 !default;
 
 $kendo-chat-quick-reply-bg: transparent !default;
 $kendo-chat-quick-reply-text: $kendo-color-primary !default;
@@ -59793,8 +60450,11 @@ $kendo-pdf-viewer-page-spacing: 30px !default;
 $kendo-pdf-viewer-page-bg: white !default;
 $kendo-pdf-viewer-page-text: $kendo-component-text !default;
 $kendo-pdf-viewer-page-border: $kendo-component-border !default;
-$kendo-pdf-viewer-page-shadow: 0 0 k-math-div( $kendo-pdf-viewer-page-spacing, 2 ) $kendo-pdf-viewer-page-border !default;
+$kendo-pdf-viewer-page-shadow: $box-shadow-depth-3 !default;
 
+$kendo-pdf-viewer-search-panel-padding-x: $kendo-toolbar-md-padding-x !default;
+$kendo-pdf-viewer-search-panel-padding-y: calc( #{$kendo-toolbar-md-padding-x} * 2 ) !default;
+$kendo-pdf-viewer-search-panel-spacing: $kendo-toolbar-md-spacing !default;
 $kendo-pdf-viewer-search-panel-border-width: 1px !default;
 $kendo-pdf-viewer-search-panel-border-radius: k-map-get( $kendo-spacing, 1 ) !default;
 $kendo-pdf-viewer-search-panel-bg: $kendo-component-bg !default;
@@ -59803,10 +60463,6 @@ $kendo-pdf-viewer-search-panel-border: $kendo-component-border !default;
 $kendo-pdf-viewer-search-panel-shadow: $kendo-window-shadow !default;
 $kendo-pdf-viewer-search-panel-matches-spacing: $kendo-padding-sm-x !default;
 
-$kendo-pdf-viewer-search-dialog-padding-x: $kendo-toolbar-md-padding-x !default;
-$kendo-pdf-viewer-search-dialog-padding-y: calc( #{$kendo-toolbar-md-padding-x} * 2 ) !default;
-$kendo-pdf-viewer-search-dialog-spacing: $kendo-toolbar-md-spacing !default;
-
 $kendo-pdf-viewer-selection-line-height: $kendo-line-height-sm !default;
 
 $kendo-pdf-viewer-search-highlight-bg: $kendo-body-text !default;
@@ -59861,19 +60517,17 @@ $kendo-pdf-viewer-icon-text: $kendo-dropzone-icon-text !default;
             flex: 1 1 auto;
             outline: none;
 
-            .k-enable-text-select,
             &.k-enable-text-select {
                 user-select: text;
                 cursor: text;
             }
 
-            .k-enable-panning,
             &.k-enable-panning {
                 cursor: grab;
-            }
-            .k-enable-panning span::selection,
-            &.k-enable-panning span::selection {
-                background-color: transparent;
+
+                span::selection {
+                    background-color: transparent;
+                }
             }
         }
 
@@ -59906,10 +60560,6 @@ $kendo-pdf-viewer-icon-text: $kendo-dropzone-icon-text !default;
                     color: transparent;
                 }
 
-                mark {
-                    color: transparent;
-                }
-
                 .k-search-highlight-mark {
                     color: transparent;
                 }
@@ -59937,19 +60587,22 @@ $kendo-pdf-viewer-icon-text: $kendo-dropzone-icon-text !default;
     }
 
     // Search
-    .k-pdf-viewer-search-dialog {
-        padding: 0 !important; // stylelint-disable-line declaration-no-important
-    }
-
-    .k-search-panel {
-        padding-block: $kendo-pdf-viewer-search-dialog-padding-y;
-        padding-inline: $kendo-pdf-viewer-search-dialog-padding-x;
+    .k-pdf-viewer-canvas > .k-search-panel {
+        width: max-content;
+        margin-top: calc( (#{$kendo-button-calc-size} + ( 2 * #{$kendo-pdf-viewer-search-panel-border-width} ) + ( 2 * #{$kendo-pdf-viewer-search-panel-padding-y} )) * -1 );
+        padding-block: $kendo-pdf-viewer-search-panel-padding-y;
+        padding-inline: $kendo-pdf-viewer-search-panel-padding-x;
+        border-width: $kendo-pdf-viewer-search-panel-border-width;
+        border-style: solid;
+        border-radius: $kendo-pdf-viewer-search-panel-border-radius;
         display: flex;
-        gap: $kendo-pdf-viewer-search-dialog-spacing;
+        gap: $kendo-pdf-viewer-search-panel-spacing;
         flex-flow: row nowrap;
         flex: 0 0 auto;
         justify-content: flex-start;
         align-items: center;
+        z-index: 10;
+        cursor: default;
 
         .k-search-dialog-draghandle {
             cursor: move;
@@ -59971,21 +60624,6 @@ $kendo-pdf-viewer-icon-text: $kendo-dropzone-icon-text !default;
         }
     }
 
-    .k-pdf-viewer-canvas > .k-search-panel {
-        width: max-content;
-        margin-top: calc( (#{$kendo-button-calc-size} + ( 2 * #{$kendo-pdf-viewer-search-panel-border-width} ) + ( 2 * #{$kendo-pdf-viewer-search-dialog-padding-y} )) * -1 );
-        border-width: $kendo-pdf-viewer-search-panel-border-width;
-        border-style: solid;
-        border-radius: $kendo-pdf-viewer-search-panel-border-radius;
-        z-index: 10;
-        cursor: default;
-    }
-
-    // Alias
-    .k-search-container {
-        @extend .k-search-panel !optional;
-    }
-
 }
 
 
@@ -60071,10 +60709,6 @@ $kendo-pdf-viewer-icon-text: $kendo-dropzone-icon-text !default;
         @include box-shadow( $kendo-pdf-viewer-search-panel-shadow );
     }
 
-    .k-search-container {
-        @extend .k-search-panel !optional;
-    }
-
 }
 
 
@@ -62552,6 +63186,7 @@ $kendo-signature-maximized-line-width: 3px !default;
     @include kendo-panelbar--styles();
     @include kendo-splitter--styles();
     @include kendo-tile-layout--styles();
+    @include kendo-dock-manager--styles();
 
 
     // Data management