npm - @progress/kendo-theme-material - Versions diffs - 6.1.1-dev.25 → 6.1.1-dev.38 - Mend

@progress/kendo-theme-material 6.1.1-dev.25 → 6.1.1-dev.38

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (21) hide show

package/dist/all.css +585 -329
package/dist/all.scss +592 -324
package/dist/meta/variables.json +9 -1
package/lib/swatches/material-aqua-dark.json +1 -1
package/lib/swatches/material-arctic.json +1 -1
package/lib/swatches/material-burnt-teal.json +1 -1
package/lib/swatches/material-dataviz-v4.json +1 -1
package/lib/swatches/material-eggplant.json +1 -1
package/lib/swatches/material-lime-dark.json +1 -1
package/lib/swatches/material-lime.json +1 -1
package/lib/swatches/material-main-dark.json +1 -1
package/lib/swatches/material-main.json +1 -1
package/lib/swatches/material-nova.json +1 -1
package/lib/swatches/material-pacific-dark.json +1 -1
package/lib/swatches/material-pacific.json +1 -1
package/lib/swatches/material-sky-dark.json +1 -1
package/lib/swatches/material-sky.json +1 -1
package/lib/swatches/material-smoke.json +1 -1
package/package.json +5 -5
package/scss/listbox/_layout.scss +2 -1
package/scss/scheduler/_layout.scss +3 -2

package/dist/all.scss CHANGED Viewed

@@ -586,12 +586,17 @@ $wcag-light: white !default;
 // #endregion
 // #region @import "./_color-manipulation.import.scss"; -> node_modules/@progress/kendo-theme-core/scss/functions/_color-manipulation.import.scss
+$kendo-light-color-level-step: 8% !default;
+$kendo-dark-color-level-step: 16% !default;
 /// Set a specific jump point for requesting color jumps
 /// @group color-system
 /// @access private
 $kendo-color-level-step: 8% !default;
 @function k-color-level( $color, $level: 0 ) {
+    $_dark-theme: if( k-meta-variable-exists( kendo-is-dark-theme ), $kendo-is-dark-theme, false );
+    $_color-level-step: if( $_dark-theme, $kendo-dark-color-level-step, $kendo-light-color-level-step );
     @if ( $level == 0 ) or ( $level == 0% ) {
         @return $color;
@@ -605,7 +610,7 @@ $kendo-color-level-step: 8% !default;
         @return k-color-mix( $base, $color, $level );
     }
-    @return k-color-mix( $base, $color, $level * $kendo-color-level-step );
+    @return k-color-mix( $base, $color, k-math-clamp( $level * $_color-level-step, 0%, 100% ) );
 }
 /// Makes a color lighter by mixing it with white
@@ -6296,16 +6301,16 @@ $kendo-display4-letter-spacing: null !default;
 @include exports( "typography/layout" ) {
     @if $kendo-enable-typography {
-        body { @extend .k-body; }
-        h1 { @extend .k-h1; }
-        h2 { @extend .k-h2; }
-        h3 { @extend .k-h3; }
-        h4 { @extend .k-h4; }
-        h5 { @extend .k-h5; }
-        h6 { @extend .k-h6; }
-        p { @extend .k-paragraph; }
-        pre { @extend .k-pre; }
-        code { @extend .k-code; }
+        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
@@ -6414,7 +6419,8 @@ $kendo-display4-letter-spacing: null !default;
     }
     .k-pre {
-        padding: $kendo-pre-padding-y $kendo-pre-padding-x;
+        padding-block: $kendo-pre-padding-y;
+        padding-inline: $kendo-pre-padding-x;
         overflow: auto;
     }
@@ -6428,7 +6434,8 @@ $kendo-display4-letter-spacing: null !default;
     }
     .k-code {
-        padding: $kendo-code-padding-y $kendo-code-padding-x;
+        padding-block: $kendo-code-padding-y;
+        padding-inline: $kendo-code-padding-x;
     }
     // Display
@@ -7148,7 +7155,10 @@ $kendo-utils: (
         capitalize: capitalize,
         normal-case: none
     ),
-    "text-overflow": (),
+    "text-overflow": (
+        clip: clip,
+        ellipsis: ellipsis
+    ),
     "text-indent": (),
     "vertical-align": (),
     "white-space": (
@@ -8591,6 +8601,33 @@ $kendo-utils: (
 // #endregion
 // text decoration
+// #region @import "./_text-overflow.scss"; -> node_modules/@progress/kendo-theme-utils/scss/typography/_text-overflow.scss
+@mixin kendo-utils--typography--text-overflow() {
+    // Text overflow utility classes
+    $kendo-utils-text-overflow: k-map-get( $kendo-utils, "text-overflow" ) !default;
+    @include generate-utils( text, text-overflow, $kendo-utils-text-overflow );
+    // Text truncate utility classes
+    .#{$kendo-prefix}text-truncate {
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+    .\!#{$kendo-prefix}text-truncate {
+        white-space: nowrap !important; // sass-lint:disable-line no-important
+        overflow: hidden !important; // sass-lint:disable-line no-important
+        text-overflow: ellipsis !important; // sass-lint:disable-line no-important
+    }
+    // Legacy aliases
+    .#{$kendo-prefix}text-ellipsis { @extend .#{$kendo-prefix}text-truncate !optional; }
+    .\!#{$kendo-prefix}text-ellipsis { @extend .\!#{$kendo-prefix}text-truncate !optional; }
+}
+// #endregion
 // #region @import "./_text-transform.scss"; -> node_modules/@progress/kendo-theme-utils/scss/typography/_text-transform.scss
 // Text-transform documentation sourced from https://developer.mozilla.org/en-US/docs/Web/CSS/text-transform.
@@ -8618,7 +8655,6 @@ $kendo-utils: (
 }
 // #endregion
-// text overflow
 // text indent
 // vertical align
 // #region @import "./_white-space.scss"; -> node_modules/@progress/kendo-theme-utils/scss/typography/_white-space.scss
@@ -8672,16 +8708,12 @@ $kendo-utils: (
 @mixin kendo-utils--typography() {
-    /// This is equivalent to `white-space: nowrap; overflow: hidden; text-overflow: ellipsis;`.
-    /// @name .k-text-ellipsis
-    /// @group text
-    .#{$kendo-prefix}text-ellipsis { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } // sass-lint:disable-line one-declaration-per-line
     @include kendo-utils--typography--font-size();
     @include kendo-utils--typography--font-style();
     @include kendo-utils--typography--font-weight();
     @include kendo-utils--typography--text-align();
     @include kendo-utils--typography--text-color();
+    @include kendo-utils--typography--text-overflow();
     @include kendo-utils--typography--text-transform();
     @include kendo-utils--typography--white-space();
 }
@@ -10811,7 +10843,8 @@ $kendo-message-box-link-text-decoration: underline !default;
     // Base
     .k-messagebox {
         margin: $kendo-message-box-margin;
-        padding: $kendo-message-box-padding-y $kendo-message-box-padding-x;
+        padding-block: $kendo-message-box-padding-y;
+        padding-inline: $kendo-message-box-padding-x;
         border-width: $kendo-message-box-border-width;
         border-style: solid;
         box-sizing: border-box;
@@ -10901,7 +10934,8 @@ $kendo-drop-hint-bg: $kendo-color-primary !default;
     // Layout
     .k-drag-clue {
         @include border-radius( $kendo-drag-hint-border-radius );
-        padding: $kendo-drag-hint-padding-y $kendo-drag-hint-padding-x;
+        padding-block: $kendo-drag-hint-padding-y;
+        padding-inline: $kendo-drag-hint-padding-x;
         border-width: $kendo-drag-hint-border-width;
         border-style: if( $kendo-drag-hint-border-width == null, null, solid );
         box-sizing: border-box;
@@ -11623,7 +11657,8 @@ $kendo-checkbox-ripple-opacity: .2 !default;
     }
     .k-checkbox-item,
     .k-checkbox-list-item {
-        padding: $kendo-checkbox-list-item-padding-y $kendo-checkbox-list-item-padding-x;
+        padding-block: $kendo-checkbox-list-item-padding-y;
+        padding-inline: $kendo-checkbox-list-item-padding-x;
         display: flex;
         flex-flow: row nowrap;
         align-items: center;
@@ -11872,7 +11907,8 @@ $kendo-checkbox-ripple-opacity: .2 !default;
     // List header
     // .k-list-header,
     .k-list-group-sticky-header {
-        padding: $kendo-list-header-padding-y $kendo-list-header-padding-x;
+        padding-block: $kendo-list-header-padding-y;
+        padding-inline: $kendo-list-header-padding-x;
         border-width: 0;
         border-width: $kendo-list-header-border-width; // sass-lint:disable-line no-duplicate-properties
         border-style: solid;
@@ -11913,7 +11949,8 @@ $kendo-checkbox-ripple-opacity: .2 !default;
     // List item
     .k-list-item {
-        padding: $kendo-list-item-padding-y $kendo-list-item-padding-x;
+        padding-block: $kendo-list-item-padding-y;
+        padding-inline: $kendo-list-item-padding-x;
         border: 0;
         font-size: $kendo-list-item-font-size;
         line-height: $kendo-list-item-line-height;
@@ -11948,13 +11985,14 @@ $kendo-checkbox-ripple-opacity: .2 !default;
         }
     }
     .k-list-optionlabel {
-        @extend .k-list-item;
+        @extend .k-list-item !optional;
     }
     // List group item
     .k-list-group-item {
-        padding: $kendo-list-group-item-padding-y $kendo-list-group-item-padding-x;
+        padding-block: $kendo-list-group-item-padding-y;
+        padding-inline: $kendo-list-group-item-padding-x;
         border-width: 0;
         border-width: $kendo-list-group-item-border-width; // sass-lint:disable-line no-duplicate-properties
         border-style: solid;
@@ -11973,7 +12011,8 @@ $kendo-checkbox-ripple-opacity: .2 !default;
     // List item group label
     .k-list-item-group-label {
-        padding: 0 .5em;
+        padding-block: 0;
+        padding-inline: .5em;
         font-size: .75em;
         position: absolute;
         top: 0;
@@ -12040,19 +12079,22 @@ $kendo-checkbox-ripple-opacity: .2 !default;
             // .k-list-header,
             .k-list-group-sticky-header {
-                padding: $_header-padding-y $_header-padding-x;
+                padding-block: $_header-padding-y;
+                padding-inline: $_header-padding-x;
                 font-size: $_header-font-size;
                 line-height: $_header-line-height;
             }
             .k-list-item {
-                padding: $_item-padding-y $_item-padding-x;
+                padding-block: $_item-padding-y;
+                padding-inline: $_item-padding-x;
                 font-size: $_item-font-size;
                 line-height: $_item-line-height;
             }
             .k-list-group-item {
-                padding: $_group-item-padding-y $_group-item-padding-x;
+                padding-block: $_group-item-padding-y;
+                padding-inline: $_group-item-padding-x;
                 font-size: $_group-item-font-size;
                 line-height: $_group-item-line-height;
             }
@@ -12253,7 +12295,8 @@ $kendo-listgroup-item-border-width: 1px !default;
     .k-listgroup-item {
-        padding: $kendo-listgroup-item-padding-y $kendo-listgroup-item-padding-x;
+        padding-block: $kendo-listgroup-item-padding-y;
+        padding-inline: $kendo-listgroup-item-padding-x;
         border-width: 0;
         border-style: solid;
         border-color: inherit;
@@ -12265,8 +12308,10 @@ $kendo-listgroup-item-border-width: 1px !default;
         position: relative;
         > .k-link {
-            margin: (-$kendo-listgroup-item-padding-y) (-$kendo-listgroup-item-padding-x);
-            padding: $kendo-listgroup-item-padding-y $kendo-listgroup-item-padding-x;
+            margin-block: (-$kendo-listgroup-item-padding-y);
+            margin-inline: (-$kendo-listgroup-item-padding-x);
+            padding-block: $kendo-listgroup-item-padding-y;
+            padding-inline: $kendo-listgroup-item-padding-x;
             color: inherit;
             text-decoration: none;
             outline: 0;
@@ -12309,8 +12354,10 @@ $kendo-listgroup-item-border-width: 1px !default;
     // Forms in listgroup
     .k-listgroup-form-row {
-        margin: (-$kendo-listgroup-item-padding-y) (-$kendo-listgroup-item-padding-x);
-        padding: $kendo-listgroup-item-padding-y $kendo-listgroup-item-padding-x;
+        margin-block: (-$kendo-listgroup-item-padding-y);
+        margin-inline: (-$kendo-listgroup-item-padding-x);
+        padding-block: $kendo-listgroup-item-padding-y;
+        padding-inline: $kendo-listgroup-item-padding-x;
         display: flex;
         flex-direction: row;
         align-items: center;
@@ -12539,7 +12586,8 @@ $kendo-popup-shadow: 0 2px 4px -1px rgba( $elevation, .2 ), 0 4px 5px 0 rgba( $e
         @include border-radius( $kendo-popup-border-radius );
         margin: 0;
         padding: 0;
-        // padding: $kendo-popup-padding-y $kendo-popup-padding-x;
+        // padding-block: $kendo-popup-padding-y;
+        // padding-inline: $kendo-popup-padding-x;
         border-width: $kendo-popup-border-width;
         border-style: solid;
         box-sizing: border-box;
@@ -12562,7 +12610,8 @@ $kendo-popup-shadow: 0 2px 4px -1px rgba( $elevation, .2 ), 0 4px 5px 0 rgba( $e
     }
     .k-popup > .k-colorpalette {
-        padding: $kendo-popup-content-padding-y $kendo-popup-content-padding-x;
+        padding-block: $kendo-popup-content-padding-y;
+        padding-inline: $kendo-popup-content-padding-x;
     }
     // Transparent popup
@@ -12889,7 +12938,7 @@ $kendo-table-selected-border: null !default;
         border-style: solid;
         font-size: $kendo-table-font-size;
         line-height: $kendo-table-line-height;
-        text-align: left;
+        text-align: start;
         border-collapse: collapse;
         border-spacing: 0;
         empty-cells: show;
@@ -12919,7 +12968,8 @@ $kendo-table-selected-border: null !default;
     }
     .k-table-th,
     .k-table-td {
-        padding: $kendo-table-cell-padding-y $kendo-table-cell-padding-x;
+        padding-block: $kendo-table-cell-padding-y;
+        padding-inline: $kendo-table-cell-padding-x;
         border-width: 0 0 $kendo-table-cell-horizontal-border-width $kendo-table-cell-vertical-border-width;
         border-style: solid;
         border-color: inherit;
@@ -13013,7 +13063,8 @@ $kendo-table-selected-border: null !default;
             &::before {
                 content: "\200b";
-                padding: $kendo-table-cell-padding-y 0;
+                padding-block: $kendo-table-cell-padding-y;
+                padding-inline: 0;
                 width: 0;
                 display: block;
                 overflow: hidden;
@@ -13106,7 +13157,8 @@ $kendo-table-selected-border: null !default;
         .k-table-#{$size} .k-table-th,
         .k-table-#{$size} .k-table-td {
-            padding: $_cell-padding-y $_cell-padding-x;
+            padding-block: $_cell-padding-y;
+            padding-inline: $_cell-padding-x;
         }
         .k-table-#{$size} .k-table-list .k-table-group-td > span {
@@ -13126,7 +13178,6 @@ $kendo-table-selected-border: null !default;
     [dir="rtl"] {
         &.k-table,
         .k-table {
-            text-align: right;
             .k-table-th,
             .k-table-td {
@@ -13657,7 +13708,8 @@ $kendo-badge-sizes: (
         $_min-width: k-map-get( $size-props, min-width );
         .k-badge-#{$size} {
-            padding: $_padding-y $_padding-x;
+            padding-block: $_padding-y;
+            padding-inline: $_padding-x;
             font-size: $_font-size;
             line-height: $_line-height;
             min-width: $_min-width;
@@ -14183,7 +14235,8 @@ $kendo-chip-list-sizes: (
     // Chip
     .k-chip {
-        padding: $kendo-chip-padding-y $kendo-chip-padding-x;
+        padding-block: $kendo-chip-padding-y;
+        padding-inline: $kendo-chip-padding-x;
         border-width: $kendo-chip-border-width;
         border-style: solid;
         outline: 0;
@@ -14214,8 +14267,10 @@ $kendo-chip-list-sizes: (
     // Chip content
     .k-chip-content {
-        padding: .5em 0;
-        margin: -.5em 0;
+        padding-block: .5em;
+        padding-inline: 0;
+        margin-block: -.5em;
+        margin-inline: 0;
         min-width: 0;
         display: flex;
         flex-flow: row nowrap;
@@ -14262,7 +14317,8 @@ $kendo-chip-list-sizes: (
     // Actions
     .k-chip-actions {
-        margin: -5em 0;
+        margin-block: -5em;
+        margin-inline: 0;
         flex: none;
         display: flex;
         flex-flow: row nowrap;
@@ -14306,7 +14362,8 @@ $kendo-chip-list-sizes: (
         $_avatar-size: 1em;
         .k-chip-#{$size} {
-            padding: $_padding-y $_padding-x;
+            padding-block: $_padding-y;
+            padding-inline: $_padding-x;
             font-size: $_font-size;
             line-height: $_line-height;
         }
@@ -15692,7 +15749,8 @@ $kendo-skeleton-wave-bg: rgba( black, .04 ) !default;
         $_line-height: k-map-get( $size-props, line-height );
         .k-button-#{$size} {
-            padding: $_padding-y $_padding-x;
+            padding-block: $_padding-y;
+            padding-inline: $_padding-x;
             font-size: $_font-size;
             line-height: $_line-height;
         }
@@ -15898,7 +15956,7 @@ $kendo-skeleton-wave-bg: rgba( black, .04 ) !default;
     .k-button {
         &::before {
-            @extend .k-button-overlay;
+            @extend .k-button-overlay !optional;
         }
         // Hovered state
@@ -16703,7 +16761,8 @@ $kendo-menu-popup-item-focus-shadow: null !default;
     // Menu link
     .k-menu-link {
-        padding: $kendo-menu-item-padding-y $kendo-menu-item-padding-x;
+        padding-block: $kendo-menu-item-padding-y;
+        padding-inline: $kendo-menu-item-padding-x;
         outline: 0;
         color: inherit;
         display: flex;
@@ -16747,7 +16806,8 @@ $kendo-menu-popup-item-focus-shadow: null !default;
         }
         > .k-separator {
-            margin: 0 $kendo-menu-separator-spacing;
+            margin-block: 0;
+            margin-inline: $kendo-menu-separator-spacing;
             width: 0;
             height: auto;
             border-width: 0 0 0 1px;
@@ -16765,7 +16825,8 @@ $kendo-menu-popup-item-focus-shadow: null !default;
         }
         > .k-menu-item > .k-menu-link {
-            padding: $kendo-menu-popup-item-padding-y $kendo-menu-popup-item-padding-x;
+            padding-block: $kendo-menu-popup-item-padding-y;
+            padding-inline: $kendo-menu-popup-item-padding-x;
             padding-right: $kendo-menu-popup-item-padding-end;
         }
@@ -16775,7 +16836,8 @@ $kendo-menu-popup-item-focus-shadow: null !default;
         }
         > .k-separator {
-            margin: $kendo-menu-separator-spacing 0;
+            margin-block: $kendo-menu-separator-spacing;
+            margin-inline: 0;
             height: 0;
             border-width: 1px 0 0;
             border-style: solid;
@@ -16787,7 +16849,8 @@ $kendo-menu-popup-item-focus-shadow: null !default;
     // Menu popup
     .k-menu-popup {
-        padding: $kendo-menu-popup-padding-y $kendo-menu-popup-padding-x;
+        padding-block: $kendo-menu-popup-padding-y;
+        padding-inline: $kendo-menu-popup-padding-x;
         box-sizing: border-box;
         border-width: $kendo-menu-popup-border-width;
         border-style: solid;
@@ -16816,7 +16879,8 @@ $kendo-menu-popup-item-focus-shadow: null !default;
         }
         .k-separator {
-            margin: $kendo-menu-separator-spacing 0;
+            margin-block: $kendo-menu-separator-spacing;
+            margin-inline: 0;
             height: 0;
             border-width: 1px 0 0;
             border-style: solid;
@@ -16841,7 +16905,8 @@ $kendo-menu-popup-item-focus-shadow: null !default;
         }
         .k-menu-link {
-            padding: $kendo-menu-popup-sm-item-padding-y $kendo-menu-popup-sm-item-padding-x;
+            padding-block: $kendo-menu-popup-sm-item-padding-y;
+            padding-inline: $kendo-menu-popup-sm-item-padding-x;
             padding-inline-end: $kendo-menu-popup-sm-item-padding-end;
         }
@@ -16861,7 +16926,8 @@ $kendo-menu-popup-item-focus-shadow: null !default;
         }
         .k-menu-link {
-            padding: $kendo-menu-popup-md-item-padding-y $kendo-menu-popup-md-item-padding-x;
+            padding-block: $kendo-menu-popup-md-item-padding-y;
+            padding-inline: $kendo-menu-popup-md-item-padding-x;
             padding-inline-end: $kendo-menu-popup-md-item-padding-end;
         }
@@ -16881,7 +16947,8 @@ $kendo-menu-popup-item-focus-shadow: null !default;
         }
         .k-menu-link {
-            padding: $kendo-menu-popup-lg-item-padding-y $kendo-menu-popup-lg-item-padding-x;
+            padding-block: $kendo-menu-popup-lg-item-padding-y;
+            padding-inline: $kendo-menu-popup-lg-item-padding-x;
             padding-inline-end: $kendo-menu-popup-lg-item-padding-end;
         }
@@ -16901,12 +16968,14 @@ $kendo-menu-popup-item-focus-shadow: null !default;
     }
     .k-context-menu {
         margin: 0;
-        padding: $kendo-menu-popup-padding-y $kendo-menu-popup-padding-x;
+        padding-block: $kendo-menu-popup-padding-y;
+        padding-inline: $kendo-menu-popup-padding-x;
         border-width: $kendo-menu-popup-border-width;
         border-style: solid;
         &.k-menu-horizontal {
-            padding: $kendo-menu-popup-padding-x $kendo-menu-popup-padding-y;
+            padding-block: $kendo-menu-popup-padding-x;
+            padding-inline: $kendo-menu-popup-padding-y;
         }
     }
     .k-animation-container .k-context-menu.k-menu-horizontal {
@@ -17334,7 +17403,8 @@ $kendo-toolbar-sizes: (
     // Base
     .k-toolbar {
         margin: 0;
-        padding: $kendo-toolbar-padding-y $kendo-toolbar-padding-x;
+        padding-block: $kendo-toolbar-padding-y;
+        padding-inline: $kendo-toolbar-padding-x;
         border-width: $kendo-toolbar-border-width;
         border-style: solid;
         box-sizing: border-box;
@@ -17457,7 +17527,8 @@ $kendo-toolbar-sizes: (
         $_spacing: k-map-get( $size-props, spacing );
         .k-toolbar-#{$size} {
-            padding: $_padding-y $_padding-x;
+            padding-block: $_padding-y;
+            padding-inline: $_padding-x;
             gap: $_spacing;
             // Remove once we decide to not size empty containers
@@ -17491,7 +17562,8 @@ $kendo-toolbar-sizes: (
     // sass-lint:disable class-name-format
     .k-floating-toolbar,
     .editorToolbarWindow.k-window-content {
-        padding: $kendo-toolbar-md-padding-y $kendo-toolbar-md-padding-x !important; // sass-lint:disable-line no-important
+        padding-block: $kendo-toolbar-md-padding-y !important; // sass-lint:disable-line no-important
+        padding-inline: $kendo-toolbar-md-padding-x !important; // sass-lint:disable-line no-important
         border-width: $kendo-toolbar-border-width;
         border-style: solid;
         display: flex;
@@ -17545,7 +17617,8 @@ $kendo-toolbar-sizes: (
         // Button
         .k-overflow-button {
-            padding: $kendo-menu-popup-md-item-padding-y $kendo-menu-popup-md-item-padding-x;
+            padding-block: $kendo-menu-popup-md-item-padding-y;
+            padding-inline: $kendo-menu-popup-md-item-padding-x;
             width: 100%;
             height: auto;
             border-width: 0;
@@ -17810,7 +17883,8 @@ $kendo-actions-gradient: null !default;
 @include exports("action-buttons/layout") {
     .k-actions {
-        padding: $kendo-actions-padding-y $kendo-actions-padding-x;
+        padding-block: $kendo-actions-padding-y;
+        padding-inline: $kendo-actions-padding-x;
         box-sizing: border-box;
         border-width: $kendo-actions-border-width 0 0 0;
         border-style: solid;
@@ -17842,7 +17916,7 @@ $kendo-actions-gradient: null !default;
     .k-edit-buttons,
     .k-action-buttons,
     .k-columnmenu-actions {
-        @extend .k-actions;
+        @extend .k-actions !optional;
     }
     // Actions align
@@ -18468,7 +18542,8 @@ $kendo-form-sizes: (
             display: inline-block;
             font-size: $kendo-font-size-xs;
             line-height: 1;
-            margin: 0 $kendo-padding-md-x;
+            margin-block: 0;
+            margin-inline: $kendo-padding-md-x;
         }
@@ -18483,7 +18558,7 @@ $kendo-form-sizes: (
     // Form Buttons Container
     .k-form-buttons {
-        @extend .k-actions;
+        @extend .k-actions !optional;
         padding: 0;
         overflow: visible;
     }
@@ -18604,7 +18679,7 @@ $kendo-form-sizes: (
         legend {
             font-size: $kendo-font-size-sm;
-            text-align: left;
+            text-align: start;
             font-weight: 600;
             line-height: 1;
             margin-bottom: $kendo-padding-lg-y * 2;
@@ -18616,12 +18691,12 @@ $kendo-form-sizes: (
         .k-form-field {
             display: flex;
             align-items: flex-start;
-            text-align: left;
+            text-align: start;
             margin-bottom: $kendo-padding-lg-y * 2;
             > span:not(.k-widget) {
                 width: $kendo-inline-form-element-width;
-                text-align: right;
+                text-align: end;
                 line-height: $kendo-line-height-md;
                 // TODO: do we need the input variable?
                 padding: calc( #{$kendo-padding-md-y} + #{$kendo-input-border-width} ) 0;
@@ -18682,7 +18757,7 @@ $kendo-form-sizes: (
         padding: calc( #{$kendo-input-padding-y} + #{$kendo-input-border-width} ) 0;
         width: 30%;
         line-height: $kendo-form-line-height;
-        text-align: right;
+        text-align: end;
         float: left;
         clear: both;
     }
@@ -18852,7 +18927,8 @@ $kendo-form-sizes: (
     .k-tooltip {
         @include border-radius( $kendo-tooltip-border-radius );
         margin: 0;
-        padding: $kendo-tooltip-padding-y $kendo-tooltip-padding-x;
+        padding-block: $kendo-tooltip-padding-y;
+        padding-inline: $kendo-tooltip-padding-x;
         // max-width: $kendo-tooltip-max-width;
         border-width: $kendo-tooltip-border-width;
         border-style: solid;
@@ -19184,7 +19260,8 @@ $kendo-form-sizes: (
     .k-input {}
     input.k-input,
     textarea.k-textarea {
-        padding: $kendo-input-padding-y $kendo-input-padding-x;
+        padding-block: $kendo-input-padding-y;
+        padding-inline: $kendo-input-padding-x;
         &:disabled,
         &[disabled] {
@@ -19207,7 +19284,8 @@ $kendo-form-sizes: (
         cursor: pointer;
     }
     select.k-picker {
-        padding: $kendo-input-padding-y $kendo-input-padding-x;
+        padding-block: $kendo-input-padding-y;
+        padding-inline: $kendo-input-padding-x;
         appearance: auto;
         &:disabled,
@@ -19225,7 +19303,8 @@ $kendo-form-sizes: (
     // Input inner
     .k-input-inner {
-        padding: $kendo-input-padding-y $kendo-input-padding-x;
+        padding-block: $kendo-input-padding-y;
+        padding-inline: $kendo-input-padding-x;
         width: 100%;
         border: 0;
         outline: 0;
@@ -19455,7 +19534,8 @@ $kendo-form-sizes: (
             aspect-ratio: auto;
             .k-button-icon {
-                margin: -1em 0;
+                margin-block: -1em;
+                margin-inline: 0;
                 min-width: auto !important; // sass-lint:disable-line no-important
                 min-height: auto !important; // sass-lint:disable-line no-important
             }
@@ -19534,13 +19614,15 @@ $kendo-form-sizes: (
             }
             .k-input-inner {
-                padding: $_padding-y $_padding-x;
+                padding-block: $_padding-y;
+                padding-inline: $_padding-x;
             }
             .k-input-button,
             .k-spinner-increase,
             .k-spinner-decrease {
-                padding: $_button-padding-y $_button-padding-x;
+                padding-block: $_button-padding-y;
+                padding-inline: $_button-padding-x;
             }
             .k-input-icon,
@@ -19566,7 +19648,8 @@ $kendo-form-sizes: (
             }
         }
         select.k-picker-#{$size} {
-            padding: $_padding-y $_padding-x;
+            padding-block: $_padding-y;
+            padding-inline: $_padding-x;
         }
     }
@@ -20452,21 +20535,25 @@ $kendo-split-button-lg-arrow-padding-y: $kendo-button-lg-padding-y !default;
     // Split button arrow
     .k-split-button .k-split-button-arrow {
-        padding: $kendo-split-button-arrow-padding-y $kendo-split-button-arrow-padding-x;
+        padding-block: $kendo-split-button-arrow-padding-y;
+        padding-inline: $kendo-split-button-arrow-padding-x;
         width: auto;
         aspect-ratio: auto;
         flex: none;
         &.k-button-sm {
-            padding: $kendo-split-button-sm-arrow-padding-y $kendo-split-button-sm-arrow-padding-x;
+            padding-block: $kendo-split-button-sm-arrow-padding-y;
+            padding-inline: $kendo-split-button-sm-arrow-padding-x;
         }
         &.k-button-md {
-            padding: $kendo-split-button-md-arrow-padding-y $kendo-split-button-md-arrow-padding-x;
+            padding-block: $kendo-split-button-md-arrow-padding-y;
+            padding-inline: $kendo-split-button-md-arrow-padding-x;
         }
         &.k-button-lg {
-            padding: $kendo-split-button-lg-arrow-padding-y $kendo-split-button-lg-arrow-padding-x;
+            padding-block: $kendo-split-button-lg-arrow-padding-y;
+            padding-inline: $kendo-split-button-lg-arrow-padding-x;
         }
         .k-button-icon {
@@ -20849,7 +20936,8 @@ $kendo-listbox-drop-hint-width: 2px !default;
     .k-listbox {
         .k-item {
-            padding: $kendo-listbox-item-padding-y $kendo-listbox-item-padding-x;
+            padding-block: $kendo-listbox-item-padding-y;
+            padding-inline: $kendo-listbox-item-padding-x;
         }
     }
@@ -21181,7 +21269,7 @@ $kendo-circular-progressbar-scale-stroke: $kendo-progressbar-bg !default;
     .k-circular-progressbar {
         display: inline-block;
-        text-align: left;
+        text-align: start;
         position: relative;
     }
@@ -21724,7 +21812,8 @@ $kendo-radio-ripple-opacity: .2 !default;
     }
     .k-radio-item,
     .k-radio-list-item {
-        padding: $kendo-radio-list-item-padding-y $kendo-radio-list-item-padding-x;
+        padding-block: $kendo-radio-list-item-padding-y;
+        padding-inline: $kendo-radio-list-item-padding-x;
         display: flex;
         flex-flow: row nowrap;
         align-items: center;
@@ -22211,12 +22300,12 @@ $kendo-slider-disabled-opacity: .65 !default;
         flex-flow: column-reverse nowrap;
         .k-tick {
-            text-align: right;
+            text-align: end;
             margin-left: 2px;
         }
         .k-slider-topleft .k-tick {
-            text-align: left;
+            text-align: start;
         }
         // ticks
@@ -22251,7 +22340,7 @@ $kendo-slider-disabled-opacity: .65 !default;
         // labels
         .k-label {
-            text-align: left;
+            text-align: start;
             left: 120%;
             top: 50%;
             transform: translateY(-50%);
@@ -22829,7 +22918,8 @@ $kendo-calendar-sizes: (
     // Calendar table
     .k-calendar-table {
-        margin: 0 auto;
+        margin-block: 0;
+        margin-inline: auto;
         border-width: 0;
         border-color: inherit;
         border-spacing: 0;
@@ -22845,13 +22935,14 @@ $kendo-calendar-sizes: (
     .k-calendar-caption.k-calendar-th,
     .k-calendar .k-meta-header,
     .k-calendar .k-month-header {
-        padding: $kendo-calendar-caption-padding-y $kendo-calendar-caption-padding-x;
+        padding-block: $kendo-calendar-caption-padding-y;
+        padding-inline: $kendo-calendar-caption-padding-x;
         height: $kendo-calendar-caption-height;
         box-sizing: border-box;
         font-size: $kendo-calendar-caption-font-size;
         line-height: $kendo-calendar-caption-line-height;
         text-transform: none;
-        text-align: left;
+        text-align: start;
         font-weight: $kendo-calendar-caption-font-weight;
         cursor: default;
     }
@@ -22869,7 +22960,8 @@ $kendo-calendar-sizes: (
         cursor: default;
     }
     .k-calendar-th {
-        padding: $kendo-calendar-header-cell-padding-y $kendo-calendar-header-cell-padding-x;
+        padding-block: $kendo-calendar-header-cell-padding-y;
+        padding-inline: $kendo-calendar-header-cell-padding-x;
         width: $kendo-calendar-header-cell-width;
         height: $kendo-calendar-header-cell-height;
         font-size: $kendo-calendar-header-cell-font-size;
@@ -22889,7 +22981,6 @@ $kendo-calendar-sizes: (
     // Remove .k-calendar once we remove k-link
     .k-calendar .k-calendar-cell-inner {
         @include border-radius( $kendo-calendar-cell-border-radius );
-        padding: $kendo-calendar-cell-padding-y $kendo-calendar-cell-padding-x;
         padding-inline: var( --INTERNAL--kendo-calendar-cell-padding-x, #{$kendo-calendar-cell-padding-x} );
         padding-block: var( --INTERNAL--kendo-calendar-cell-padding-y, #{$kendo-calendar-cell-padding-y} );
         width: 100%;
@@ -22907,7 +22998,8 @@ $kendo-calendar-sizes: (
     // Calendar header
     .k-calendar .k-header {
-        padding: $kendo-calendar-header-padding-y $kendo-calendar-header-padding-x;
+        padding-block: $kendo-calendar-header-padding-y;
+        padding-inline: $kendo-calendar-header-padding-x;
         border-bottom-width: $kendo-calendar-header-border-width;
         border-bottom-style: solid;
         display: flex;
@@ -22921,7 +23013,8 @@ $kendo-calendar-sizes: (
     // Calendar header
     .k-calendar-header {
-        padding: $kendo-calendar-header-padding-y $kendo-calendar-header-padding-x;
+        padding-block: $kendo-calendar-header-padding-y;
+        padding-inline: $kendo-calendar-header-padding-x;
         min-width: ($kendo-calendar-cell-size * 8);
         box-sizing: border-box;
         display: flex;
@@ -22946,7 +23039,8 @@ $kendo-calendar-sizes: (
     // Calendar footer
     .k-calendar-footer,
     .k-calendar .k-footer {
-        padding: $kendo-calendar-footer-padding-y $kendo-calendar-footer-padding-x;
+        padding-block: $kendo-calendar-footer-padding-y;
+        padding-inline: $kendo-calendar-footer-padding-x;
         text-align: center;
         clear: both;
     }
@@ -22955,7 +23049,8 @@ $kendo-calendar-sizes: (
     // Calendar view wrapper
     .k-calendar-view {
         margin: auto;
-        padding: 0 $kendo-calendar-header-padding-x;
+        padding-block: 0;
+        padding-inline: $kendo-calendar-header-padding-x;
         // setting width / height prevents layout changes in meta views
         width: $kendo-calendar-view-width;
         inline-size: var( --INTERNAL--kendo-calendar-view-width, #{$kendo-calendar-view-width});
@@ -23022,7 +23117,7 @@ $kendo-calendar-sizes: (
             block-size: var( --INTERNAL--kendo-calendar-cell-size, #{$_century-cell-size} );
         }
         .k-calendar-cell-inner {
-            text-align: left;
+            text-align: start;
         }
     }
@@ -23109,7 +23204,7 @@ $kendo-calendar-sizes: (
     // Alias
     .k-link {
-        @extend .k-calendar-cell-inner;
+        @extend .k-calendar-cell-inner !optional;
     }
 }
@@ -23126,7 +23221,8 @@ $kendo-calendar-sizes: (
         flex-flow: row nowrap;
         .k-calendar-view {
-            padding: $kendo-infinite-calendar-view-padding-y $kendo-infinite-calendar-view-padding-x;
+            padding-block: $kendo-infinite-calendar-view-padding-y;
+            padding-inline: $kendo-infinite-calendar-view-padding-x;
             height: $kendo-infinite-calendar-view-height;
             flex: 0 0 auto;
             display: flex;
@@ -23155,7 +23251,8 @@ $kendo-calendar-sizes: (
         .k-calendar-header {
             margin-left: -$kendo-infinite-calendar-view-padding-x;
             margin-right: -$kendo-infinite-calendar-view-padding-x;
-            padding: $kendo-infinite-calendar-header-padding-y $kendo-infinite-calendar-header-padding-x;
+            padding-block: $kendo-infinite-calendar-header-padding-y;
+            padding-inline: $kendo-infinite-calendar-header-padding-x;
             width: auto;
             min-width: 0;
         }
@@ -23211,7 +23308,8 @@ $kendo-calendar-sizes: (
                 height: $kendo-calendar-navigation-item-height;
                 line-height: $kendo-calendar-navigation-item-height;
                 cursor: pointer;
-                padding: 0 1em;
+                padding-block: 0;
+                padding-inline: 1em;
                 overflow: hidden;
                 white-space: nowrap;
                 text-overflow: clip;
@@ -23301,11 +23399,6 @@ $kendo-calendar-sizes: (
             @include hide-scrollbar("left");
         }
-        tbody th,
-        .k-calendar-tbody .k-calendar-th {
-            text-align: right;
-        }
     }
 }
@@ -23715,7 +23808,8 @@ $kendo-time-selector-sizes: (
     // Time selector header
     .k-time-header,
     .k-time-selector-header {
-        padding: $kendo-time-selector-header-padding-y $kendo-time-selector-header-padding-x;
+        padding-block: $kendo-time-selector-header-padding-y;
+        padding-inline: $kendo-time-selector-header-padding-x;
         box-sizing: border-box;
         display: flex;
         align-items: center;
@@ -23724,7 +23818,8 @@ $kendo-time-selector-sizes: (
         .k-title,
         .k-time-selector-header-title {
-            padding: $kendo-button-padding-y $kendo-button-padding-x;
+            padding-block: $kendo-button-padding-y;
+            padding-inline: $kendo-button-padding-x;
             font-weight: bold;
             display: inline-block;
         }
@@ -23878,7 +23973,8 @@ $kendo-time-selector-sizes: (
     // Time list item
     .k-time-list-item,
     .k-time-list .k-item {
-        padding: $kendo-time-list-item-padding-y $kendo-time-list-item-padding-x;
+        padding-block: $kendo-time-list-item-padding-y;
+        padding-inline: $kendo-time-list-item-padding-x;
     }
@@ -23920,7 +24016,8 @@ $kendo-time-selector-sizes: (
             .k-time-list-item,
             .k-time-list .k-item {
-                padding: $_list-item-padding-y $_list-item-padding-x;
+                padding-block: $_list-item-padding-y;
+                padding-inline: $_list-item-padding-x;
             }
         }
     }
@@ -24508,7 +24605,8 @@ $kendo-color-gradient-contrast-spacer: k-map-get( $kendo-spacing, 2 ) !default;
     .k-colorgradient {
         @include border-radius( $kendo-color-gradient-border-radius );
         width: $kendo-color-gradient-width;
-        padding: $kendo-color-gradient-padding-y $kendo-color-gradient-padding-x;
+        padding-block: $kendo-color-gradient-padding-y;
+        padding-inline: $kendo-color-gradient-padding-x;
         border-style: solid;
         border-width: $kendo-color-gradient-border-width;
         box-sizing: border-box;
@@ -24689,7 +24787,6 @@ $kendo-color-gradient-contrast-spacer: k-map-get( $kendo-spacing, 2 ) !default;
 }
 // #endregion
 // #endregion
@@ -24892,7 +24989,8 @@ $kendo-color-editor-color-gradient-focus-outline-offset: 2px !default;
     // Views
     .k-coloreditor-views {
         min-width: calc( var(--kendo-color-preview-width, #{$kendo-color-palette-tile-width}) * var(--kendo-color-preview-columns, 10) );
-        padding: $kendo-color-editor-views-padding-y $kendo-color-editor-views-padding-x;
+        padding-block: $kendo-color-editor-views-padding-y;
+        padding-inline: $kendo-color-editor-views-padding-x;
         gap: $kendo-color-editor-views-gap;
         .k-colorgradient {
@@ -24999,7 +25097,7 @@ $kendo-color-editor-color-gradient-focus-outline-offset: 2px !default;
     // Alias
     .k-colorpicker {
-        @extend .k-color-picker;
+        @extend .k-color-picker !optional;
     }
 }
@@ -25281,7 +25379,8 @@ $kendo-datetime-width: calc( #{$kendo-calendar-cell-size * 8} + #{$kendo-infinit
         overflow: hidden;
         .k-datetime-buttongroup {
-            padding: $kendo-actions-padding-y $kendo-actions-padding-x;
+            padding-block: $kendo-actions-padding-y;
+            padding-inline: $kendo-actions-padding-x;
         }
         .k-calendar,
@@ -25394,7 +25493,7 @@ $kendo-daterange-picker-input-width: 10em !default;
     // Angular specific
     kendo-daterange {
-        // @extend .k-daterangepicker;
+        // @extend .k-daterangepicker !optional;
     }
@@ -25409,7 +25508,7 @@ $kendo-daterange-picker-input-width: 10em !default;
     // Alias
     .k-daterangepicker {
-        @extend .k-daterange-picker;
+        @extend .k-daterange-picker !optional;
     }
 }
@@ -25927,7 +26026,8 @@ $kendo-treeview-loadmore-focus-shadow: $kendo-treeview-item-focus-shadow !defaul
     // Treeview leaf
     .k-treeview-leaf {
         @include border-radius( $kendo-treeview-item-border-radius );
-        padding: $kendo-treeview-item-padding-y $kendo-treeview-item-padding-x;
+        padding-block: $kendo-treeview-item-padding-y;
+        padding-inline: $kendo-treeview-item-padding-x;
         border: $kendo-treeview-item-border-width solid transparent;
         text-decoration: none;
         display: inline-flex;
@@ -26006,7 +26106,8 @@ $kendo-treeview-loadmore-focus-shadow: $kendo-treeview-item-focus-shadow !defaul
             line-height: $_line-height;
             .k-treeview-leaf {
-                padding: $_item-padding-y $_item-padding-x;
+                padding-block: $_item-padding-y;
+                padding-inline: $_item-padding-x;
             }
         }
     }
@@ -26176,7 +26277,8 @@ $kendo-dropdowntree-popup-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
         }
         .k-treeview {
-            padding: $kendo-dropdowntree-popup-padding-y $kendo-dropdowntree-popup-padding-x;
+            padding-block: $kendo-dropdowntree-popup-padding-y;
+            padding-inline: $kendo-dropdowntree-popup-padding-x;
         }
     }
@@ -26332,12 +26434,14 @@ $kendo-rating-icon-focus-selected-shadow: 0 2px 4px rgba( black, .1) !default;
     .k-rating-container {
         flex: 0 1 auto;
         position: relative;
-        margin: 0 $kendo-rating-container-margin-x;
+        margin-block: 0;
+        margin-inline: $kendo-rating-container-margin-x;
         .k-rating-item {
             display: inline-flex;
             position: relative;
-            padding: $kendo-rating-item-padding-y $kendo-rating-item-padding-x;
+            padding-block: $kendo-rating-item-padding-y;
+            padding-inline: $kendo-rating-item-padding-x;
             align-items: center;
             vertical-align: middle;
             margin: 0;
@@ -26377,7 +26481,8 @@ $kendo-rating-icon-focus-selected-shadow: 0 2px 4px rgba( black, .1) !default;
         align-items: center;
         vertical-align: middle;
         line-height: $kendo-rating-label-line-height;
-        margin: $kendo-rating-label-margin-y $kendo-rating-label-margin-x;
+        margin-block: $kendo-rating-label-margin-y;
+        margin-inline: $kendo-rating-label-margin-x;
     }
     .k-rtl,
@@ -27171,7 +27276,8 @@ $kendo-dropzone-note-text: $kendo-subtle-text !default;
     // Dropzpne inner
     .k-dropzone-inner {
-        padding: $kendo-dropzone-padding-y $kendo-dropzone-padding-x;
+        padding-block: $kendo-dropzone-padding-y;
+        padding-inline: $kendo-dropzone-padding-x;
         border-width: $kendo-dropzone-border-width;
         border-style: solid;
         box-sizing: border-box;
@@ -27333,7 +27439,8 @@ $kendo-upload-focus-shadow: 0 0 0 2px rgba( black, .13 ) !default;
         // Drop zone
         .k-dropzone,
         .k-upload-dropzone {
-            padding: $kendo-upload-dropzone-padding-y $kendo-upload-dropzone-padding-x;
+            padding-block: $kendo-upload-dropzone-padding-y;
+            padding-inline: $kendo-upload-dropzone-padding-x;
             border-width: 0;
             text-align: end;
             display: flex;
@@ -27428,7 +27535,8 @@ $kendo-upload-focus-shadow: 0 0 0 2px rgba( black, .13 ) !default;
             }
             .k-upload-pct {
-                margin: 0 $kendo-upload-icon-spacing;
+                margin-block: 0;
+                margin-inline: $kendo-upload-icon-spacing;
                 font-weight: normal;
                 vertical-align: middle;
             }
@@ -27729,8 +27837,10 @@ $kendo-appbar-bottom-box-shadow: 0px -2px 3px rgba( black, .24 ) !default;
     // Appbar
     .k-appbar {
-        margin: $kendo-appbar-margin-y $kendo-appbar-margin-x;
-        padding: $kendo-appbar-padding-y $kendo-appbar-padding-x;
+        margin-block: $kendo-appbar-margin-y;
+        margin-inline: $kendo-appbar-margin-x;
+        padding-block: $kendo-appbar-padding-y;
+        padding-inline: $kendo-appbar-padding-x;
         border-width: $kendo-appbar-border-width;
         border-style: solid;
         box-sizing: border-box;
@@ -28084,19 +28194,23 @@ $kendo-fab-item-active-shadow: $kendo-fab-active-shadow !default;
     // Sizes
     .k-fab-sm {
-        padding: $kendo-fab-sm-padding-y $kendo-fab-sm-padding-x;
+        padding-block: $kendo-fab-sm-padding-y;
+        padding-inline: $kendo-fab-sm-padding-x;
     }
     .k-fab-md {
-        padding: $kendo-fab-padding-y $kendo-fab-padding-x;
+        padding-block: $kendo-fab-padding-y;
+        padding-inline: $kendo-fab-padding-x;
     }
     .k-fab-lg {
-        padding: $kendo-fab-lg-padding-y $kendo-fab-lg-padding-x;
+        padding-block: $kendo-fab-lg-padding-y;
+        padding-inline: $kendo-fab-lg-padding-x;
     }
     // Items
     .k-fab-items {
         margin: 0;
-        padding: $kendo-fab-items-padding-y $kendo-fab-items-padding-x;
+        padding-block: $kendo-fab-items-padding-y;
+        padding-inline: $kendo-fab-items-padding-x;
         display: flex;
     }
@@ -28141,7 +28255,8 @@ $kendo-fab-item-active-shadow: $kendo-fab-active-shadow !default;
     }
     .k-fab-item-text {
-        padding: $kendo-fab-item-text-padding-y $kendo-fab-item-text-padding-x;
+        padding-block: $kendo-fab-item-text-padding-y;
+        padding-inline: $kendo-fab-item-text-padding-x;
         border-width: $kendo-fab-item-text-border-width;
         border-radius: $kendo-fab-item-text-border-radius;
         font-size: $kendo-fab-item-text-font-size;
@@ -28151,7 +28266,8 @@ $kendo-fab-item-active-shadow: $kendo-fab-active-shadow !default;
     .k-fab-item-icon {
         width: $kendo-fab-item-icon-width;
         height: $kendo-fab-item-icon-height;
-        padding: $kendo-fab-item-icon-padding-y $kendo-fab-item-icon-padding-x;
+        padding-block: $kendo-fab-item-icon-padding-y;
+        padding-inline: $kendo-fab-item-icon-padding-x;
         border-width: $kendo-fab-item-icon-border-width;
         border-radius: $kendo-fab-item-icon-border-radius;
         box-sizing: content-box;
@@ -28529,7 +28645,8 @@ $kendo-adaptive-actionsheet-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !de
     // Actionsheet titlebar
     .k-actionsheet-titlebar {
-        padding: $kendo-actionsheet-titlebar-padding-y $kendo-actionsheet-titlebar-padding-x;
+        padding-block: $kendo-actionsheet-titlebar-padding-y;
+        padding-inline: $kendo-actionsheet-titlebar-padding-x;
         border-width: 0;
         border-bottom-width: if( $kendo-actionsheet-titlebar-border-width, $kendo-actionsheet-titlebar-border-width, null );
         border-style: solid;
@@ -28594,7 +28711,8 @@ $kendo-adaptive-actionsheet-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !de
     }
     .k-actionsheet-action {
         margin: 0;
-        padding: $kendo-actionsheet-item-padding-y $kendo-actionsheet-item-padding-x;
+        padding-block: $kendo-actionsheet-item-padding-y;
+        padding-inline: $kendo-actionsheet-item-padding-x;
         min-height: $kendo-actionsheet-item-min-height;
         box-sizing: border-box;
         color: inherit;
@@ -28689,16 +28807,19 @@ $kendo-adaptive-actionsheet-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !de
         flex-flow: column nowrap;
         .k-actionsheet-titlebar {
-            padding: $kendo-adaptive-actionsheet-titlebar-padding-y $kendo-adaptive-actionsheet-titlebar-padding-x;
+            padding-block: $kendo-adaptive-actionsheet-titlebar-padding-y;
+            padding-inline: $kendo-adaptive-actionsheet-titlebar-padding-x;
             border-bottom-width: $kendo-adaptive-actionsheet-titlebar-border-width;
         }
         .k-actionsheet-content {
-            padding: $kendo-adaptive-actionsheet-content-padding-y $kendo-adaptive-actionsheet-content-padding-x;
+            padding-block: $kendo-adaptive-actionsheet-content-padding-y;
+            padding-inline: $kendo-adaptive-actionsheet-content-padding-x;
         }
         .k-actionsheet-footer {
-            padding: $kendo-adaptive-actionsheet-footer-padding-y $kendo-adaptive-actionsheet-footer-padding-x;
+            padding-block: $kendo-adaptive-actionsheet-footer-padding-y;
+            padding-inline: $kendo-adaptive-actionsheet-footer-padding-x;
         }
         .k-actionsheet-filter {
@@ -29002,7 +29123,8 @@ $kendo-adaptive-actionsheet-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !de
     // Title bar
     .k-window-titlebar {
         @include border-top-radius( $kendo-window-border-radius );
-        padding: $kendo-window-titlebar-padding-y $kendo-window-titlebar-padding-x;
+        padding-block: $kendo-window-titlebar-padding-y;
+        padding-inline: $kendo-window-titlebar-padding-x;
         border-width: $kendo-window-titlebar-border-width;
         border-style: $kendo-window-titlebar-border-style;
         white-space: nowrap;
@@ -29018,8 +29140,10 @@ $kendo-adaptive-actionsheet-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !de
     // Title bar title text
     .k-window-title {
-        padding: .5em 0;
-        margin: -.5em 0;
+        padding-block: .5em;
+        padding-inline: 0;
+        margin-block: -.5em;
+        margin-inline: 0;
         font-size: $kendo-window-title-font-size;
         line-height: $kendo-window-title-line-height;
         text-overflow: ellipsis;
@@ -29037,7 +29161,8 @@ $kendo-adaptive-actionsheet-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !de
     // Actions
     .k-window-titlebar-actions {
-        margin: -5em 0;
+        margin-block: -5em;
+        margin-inline: 0;
         margin-inline-end: calc( #{$kendo-window-titlebar-padding-y} - #{$kendo-window-titlebar-padding-x} );
         line-height: 1;
         display: flex;
@@ -29059,7 +29184,8 @@ $kendo-adaptive-actionsheet-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !de
     // Content
     .k-window-content,
     .k-prompt-container {
-        padding: $kendo-window-inner-padding-y $kendo-window-inner-padding-x;
+        padding-block: $kendo-window-inner-padding-y;
+        padding-inline: $kendo-window-inner-padding-x;
         border-width: 0;
         border-color: inherit;
         color: inherit;
@@ -29094,7 +29220,8 @@ $kendo-adaptive-actionsheet-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !de
     // Buttons Layout
     .k-window-actions {
         @include border-bottom-radius( $kendo-window-border-radius );
-        padding: $kendo-window-buttongroup-padding-y $kendo-window-buttongroup-padding-x;
+        padding-block: $kendo-window-buttongroup-padding-y;
+        padding-inline: $kendo-window-buttongroup-padding-x;
         border-width: $kendo-window-buttongroup-border-width 0 0;
         border-style: solid;
         border-color: inherit;
@@ -29258,7 +29385,8 @@ $kendo-dialog-theme-colors: (
     // Buttons
     .k-dialog-actions {
         @include border-bottom-radius( $kendo-window-border-radius );
-        padding: $kendo-dialog-buttongroup-padding-y $kendo-dialog-buttongroup-padding-x;
+        padding-block: $kendo-dialog-buttongroup-padding-y;
+        padding-inline: $kendo-dialog-buttongroup-padding-x;
         border-width: $kendo-dialog-buttongroup-border-width 0 0;
         border-style: solid;
         border-color: inherit;
@@ -29510,7 +29638,8 @@ $kendo-drawer-selected-hover-text: $kendo-color-secondary !default;
         align-items: stretch;
     }
     .k-drawer-item {
-        padding: $kendo-drawer-item-padding-y $kendo-drawer-item-padding-x;
+        padding-block: $kendo-drawer-item-padding-y;
+        padding-inline: $kendo-drawer-item-padding-x;
         outline: 0;
         color: inherit;
         font-size: $kendo-drawer-item-font-size;
@@ -29521,8 +29650,10 @@ $kendo-drawer-selected-hover-text: $kendo-color-secondary !default;
         cursor: pointer;
         > .k-drawer-link {
-            margin: (-$kendo-drawer-item-padding-y) (-$kendo-drawer-item-padding-x);
-            padding: $kendo-drawer-item-padding-y $kendo-drawer-item-padding-x;
+            margin-block: (-$kendo-drawer-item-padding-y);
+            margin-inline: (-$kendo-drawer-item-padding-x);
+            padding-block: $kendo-drawer-item-padding-y;
+            padding-inline: $kendo-drawer-item-padding-x;
             color: inherit;
             display: flex;
             flex-flow: row nowrap;
@@ -29814,7 +29945,8 @@ $kendo-notification-theme: notification-theme( $kendo-notification-theme-colors
     .k-notification {
         @include border-radius( $kendo-notification-border-radius );
-        padding: $kendo-notification-padding-y $kendo-notification-padding-x;
+        padding-block: $kendo-notification-padding-y;
+        padding-inline: $kendo-notification-padding-x;
         border-width: $kendo-notification-border-width;
         border-style: solid;
         box-sizing: border-box;
@@ -30057,7 +30189,8 @@ $kendo-card-callout-height: 20px !default;
     // Header
     .k-card-header {
-        padding: $kendo-card-header-padding-y $kendo-card-header-padding-x;
+        padding-block: $kendo-card-header-padding-y;
+        padding-inline: $kendo-card-header-padding-x;
         border-width: 0 0 $kendo-card-header-border-width;
         border-style: solid;
         outline: 0;
@@ -30079,7 +30212,8 @@ $kendo-card-callout-height: 20px !default;
     // Footer
     .k-card-footer {
-        padding: $kendo-card-footer-padding-y $kendo-card-footer-padding-x;
+        padding-block: $kendo-card-footer-padding-y;
+        padding-inline: $kendo-card-footer-padding-x;
         border-width: $kendo-card-footer-border-width 0 0;
         border-style: solid;
         outline: 0;
@@ -30089,7 +30223,8 @@ $kendo-card-callout-height: 20px !default;
     // Body
     .k-card-body {
-        padding: $kendo-card-body-padding-y $kendo-card-body-padding-x;
+        padding-block: $kendo-card-body-padding-y;
+        padding-inline: $kendo-card-body-padding-x;
         outline: 0;
         flex: 1 1 auto;
@@ -30192,7 +30327,8 @@ $kendo-card-callout-height: 20px !default;
     // Card actions
     .k-card-actions {
-        padding: $kendo-card-actions-padding-y $kendo-card-actions-padding-x;
+        padding-block: $kendo-card-actions-padding-y;
+        padding-inline: $kendo-card-actions-padding-x;
         border-width: 0;
         border-style: solid;
         border-color: inherit;
@@ -30570,7 +30706,8 @@ $kendo-popover-callout-border: $kendo-popover-border !default;
     // Header
     .k-popover-header {
         @include border-top-radius( $kendo-popover-border-radius );
-        padding: $kendo-popover-header-padding-y $kendo-popover-header-padding-x;
+        padding-block: $kendo-popover-header-padding-y;
+        padding-inline: $kendo-popover-header-padding-x;
         border-width: 0 0 $kendo-popover-header-border-width;
         border-style: $kendo-popover-header-border-style;
         border-color: inherit;
@@ -30578,7 +30715,8 @@ $kendo-popover-callout-border: $kendo-popover-border !default;
     // Body
     .k-popover-body {
-        padding: $kendo-popover-body-padding-y $kendo-popover-body-padding-x;
+        padding-block: $kendo-popover-body-padding-y;
+        padding-inline: $kendo-popover-body-padding-x;
     }
     // Actions
@@ -30826,7 +30964,8 @@ $kendo-bottom-nav-flat-border: $kendo-component-border !default;
     // Bottom Navigation
     .k-bottom-nav {
-        padding: $kendo-bottom-nav-padding-y $kendo-bottom-nav-padding-x;
+        padding-block: $kendo-bottom-nav-padding-y;
+        padding-inline: $kendo-bottom-nav-padding-x;
         width: 100%;
         border-width: 0;
         border-style: solid;
@@ -30862,7 +31001,8 @@ $kendo-bottom-nav-flat-border: $kendo-component-border !default;
     // Items
     .k-bottom-nav-item {
-        padding: $kendo-bottom-nav-item-padding-y $kendo-bottom-nav-item-padding-x;
+        padding-block: $kendo-bottom-nav-item-padding-y;
+        padding-inline: $kendo-bottom-nav-item-padding-x;
         min-width: $kendo-bottom-nav-item-min-width;
         max-width: $kendo-bottom-nav-item-max-width;
         min-height: $kendo-bottom-nav-item-min-height;
@@ -30892,8 +31032,10 @@ $kendo-bottom-nav-flat-border: $kendo-component-border !default;
         }
         > .k-bottom-nav-link {
-            margin: (-$kendo-bottom-nav-item-padding-y) (-$kendo-bottom-nav-item-padding-x);
-            padding: $kendo-bottom-nav-item-padding-y $kendo-bottom-nav-item-padding-x;
+            margin-block: (-$kendo-bottom-nav-item-padding-y);
+            margin-inline: (-$kendo-bottom-nav-item-padding-x);
+            padding-block: $kendo-bottom-nav-item-padding-y;
+            padding-inline: $kendo-bottom-nav-item-padding-x;
             width: 100%;
             color: inherit;
             display: flex;
@@ -31080,8 +31222,10 @@ $kendo-breadcrumb-focus-shadow: 0 0 2px 1px rgba( black, .06 ) !default;
     // Breadcrumb
     .k-breadcrumb {
-        margin: $kendo-breadcrumb-margin-y $kendo-breadcrumb-margin-x;
-        padding: $kendo-breadcrumb-padding-y $kendo-breadcrumb-padding-x;
+        margin-block: $kendo-breadcrumb-margin-y;
+        margin-inline: $kendo-breadcrumb-margin-x;
+        padding-block: $kendo-breadcrumb-padding-y;
+        padding-inline: $kendo-breadcrumb-padding-x;
         border-width: $kendo-breadcrumb-border-width;
         border-style: solid;
         box-sizing: border-box;
@@ -31145,7 +31289,8 @@ $kendo-breadcrumb-focus-shadow: 0 0 2px 1px rgba( black, .06 ) !default;
     .k-breadcrumb-link,
     .k-breadcrumb-root-link {
         @include border-radius( $kendo-breadcrumb-link-border-radius );
-        padding: $kendo-breadcrumb-link-padding-y $kendo-breadcrumb-link-padding-x;
+        padding-block: $kendo-breadcrumb-link-padding-y;
+        padding-inline: $kendo-breadcrumb-link-padding-x;
         color: $kendo-breadcrumb-link-initial-text;
         text-decoration: none;
         white-space: nowrap;
@@ -31169,7 +31314,8 @@ $kendo-breadcrumb-focus-shadow: 0 0 2px 1px rgba( black, .06 ) !default;
     }
     .k-breadcrumb-icon-link {
-        padding: $kendo-breadcrumb-icon-link-padding-y $kendo-breadcrumb-icon-link-padding-x;
+        padding-block: $kendo-breadcrumb-icon-link-padding-y;
+        padding-inline: $kendo-breadcrumb-icon-link-padding-x;
     }
@@ -31577,7 +31723,7 @@ $kendo-pager-sizes: (
     // Pager items
     .k-pager-nav {
-        @extend %base-pager-item;
+        @extend %base-pager-item !optional;
     }
@@ -31624,10 +31770,11 @@ $kendo-pager-sizes: (
     // Pager input
     .k-pager-input {
-        @extend %base-pager-section;
+        @extend %base-pager-section !optional;
         .k-textbox {
-            margin: 0 1ex;
+            margin-block: 0;
+            margin-inline: 1ex;
             width: $kendo-pager-input-width;
         }
     }
@@ -31635,7 +31782,7 @@ $kendo-pager-sizes: (
     // Pager sizes
     .k-pager-sizes {
-        @extend %base-pager-section;
+        @extend %base-pager-section !optional;
         .k-dropdown-list,
         > select {
@@ -31660,8 +31807,8 @@ $kendo-pager-sizes: (
     // Pager info
     .k-pager-info {
-        @extend %base-pager-section;
-        text-align: right;
+        @extend %base-pager-section !optional;
+        text-align: end;
         justify-content: flex-end;
         flex: 1 1 0%;
         order: 9;
@@ -31684,7 +31831,7 @@ $kendo-pager-sizes: (
             border-color: inherit;
             select.k-dropdown-list {
-                @extend %base-pager-section;
+                @extend %base-pager-section !optional;
                 @if ($kendo-pager-section-spacing) {
                     margin-left: $kendo-pager-section-spacing;
                     margin-right: $kendo-pager-section-spacing;
@@ -31901,8 +32048,10 @@ $kendo-stepper-content-transition-timing-function: cubic-bezier(.4, 0, .2, 1) 0m
     // Base
     .k-stepper {
-        margin: $kendo-stepper-margin-y $kendo-stepper-margin-x;
-        padding: $kendo-stepper-padding-y $kendo-stepper-padding-x;
+        margin-block: $kendo-stepper-margin-y;
+        margin-inline: $kendo-stepper-margin-x;
+        padding-block: $kendo-stepper-padding-y;
+        padding-inline: $kendo-stepper-padding-x;
         border-width: $kendo-stepper-border-width;
         border-style: solid;
         box-sizing: border-box;
@@ -32005,7 +32154,8 @@ $kendo-stepper-content-transition-timing-function: cubic-bezier(.4, 0, .2, 1) 0m
         }
         .k-step-label:only-child {
             @include border-radius( k-math-div( ( $kendo-stepper-indicator-height + 2 * $kendo-stepper-indicator-border-width ), 2 ) );
-            padding: $kendo-stepper-label-padding-y $kendo-stepper-label-padding-x;
+            padding-block: $kendo-stepper-label-padding-y;
+            padding-inline: $kendo-stepper-label-padding-x;
             border-width: 0;
         }
         .k-step-label .k-step-text {
@@ -32132,7 +32282,8 @@ $kendo-stepper-content-transition-timing-function: cubic-bezier(.4, 0, .2, 1) 0m
             flex-direction: column;
             justify-content: space-between;
             margin-left: $kendo-stepper-indicator-width + 2 * $kendo-stepper-indicator-border-width;
-            padding: $kendo-stepper-inline-content-padding-x $kendo-stepper-inline-content-padding-y;
+            padding-block: $kendo-stepper-inline-content-padding-x;
+            padding-inline: $kendo-stepper-inline-content-padding-y;
         }
     }
 }
@@ -32534,7 +32685,8 @@ $kendo-tabstrip-content-focus-border: $kendo-component-text !default;
 @include exports("tabstrip/layout") {
     .k-tabstrip-wrapper {
-        padding: $kendo-tabstrip-wrapper-padding-y $kendo-tabstrip-wrapper-padding-x;
+        padding-block: $kendo-tabstrip-wrapper-padding-y;
+        padding-inline: $kendo-tabstrip-wrapper-padding-x;
         box-sizing: border-box;
         border-width: $kendo-tabstrip-wrapper-border-width;
         border-style: solid;
@@ -32602,7 +32754,8 @@ $kendo-tabstrip-content-focus-border: $kendo-component-text !default;
         }
         .k-link {
-            padding: $kendo-tabstrip-item-padding-y $kendo-tabstrip-item-padding-x;
+            padding-block: $kendo-tabstrip-item-padding-y;
+            padding-inline: $kendo-tabstrip-item-padding-x;
             color: inherit;
             cursor: pointer;
             display: inline-flex;
@@ -32617,7 +32770,8 @@ $kendo-tabstrip-content-focus-border: $kendo-component-text !default;
     .k-tabstrip-content,
     .k-tabstrip > .k-content {
         margin: 0 !important; // sass-lint:disable-line no-important
-        padding: $kendo-tabstrip-content-padding-y $kendo-tabstrip-content-padding-x;
+        padding-block: $kendo-tabstrip-content-padding-y;
+        padding-inline: $kendo-tabstrip-content-padding-x;
         box-sizing: border-box;
         border-width: $kendo-tabstrip-content-border-width;
         border-style: solid;
@@ -33066,7 +33220,8 @@ $kendo-wizard-step-focus-border: #656565 !default;
 // #region @import "@progress/kendo-theme-default/scss/wizard/_layout.scss"; -> node_modules/@progress/kendo-theme-default/scss/wizard/_layout.scss
 @include exports("wizard/layout") {
     .k-wizard {
-        padding: $kendo-wizard-padding-y $kendo-wizard-padding-x;
+        padding-block: $kendo-wizard-padding-y;
+        padding-inline: $kendo-wizard-padding-x;
         border-width: $kendo-wizard-border-width;
         border-style: solid;
         box-sizing: border-box;
@@ -33307,7 +33462,8 @@ $kendo-expander-content-padding-y: k-map-get( $kendo-spacing, 6 ) !default;
     // Header
     .k-expander-header {
-        padding: $kendo-expander-header-padding-y $kendo-expander-header-padding-x;
+        padding-block: $kendo-expander-header-padding-y;
+        padding-inline: $kendo-expander-header-padding-x;
         display: flex;
         justify-content: space-between;
         align-items: center;
@@ -33332,7 +33488,8 @@ $kendo-expander-content-padding-y: k-map-get( $kendo-spacing, 6 ) !default;
     // Expander content
     .k-expander-content {
-        padding: $kendo-expander-content-padding-y $kendo-expander-content-padding-x;
+        padding-block: $kendo-expander-content-padding-y;
+        padding-inline: $kendo-expander-content-padding-x;
     }
     // Multiple expanders
@@ -33563,7 +33720,8 @@ $kendo-panelbar-header-expanded-gradient: null !default;
             display: block;
             > .k-link {
-                padding: $kendo-panelbar-header-padding-y $kendo-panelbar-header-padding-x;
+                padding-block: $kendo-panelbar-header-padding-y;
+                padding-inline: $kendo-panelbar-header-padding-x;
                 color: inherit;
                 background: none;
                 text-decoration: none;
@@ -33601,7 +33759,8 @@ $kendo-panelbar-header-expanded-gradient: null !default;
             display: block;
             > .k-link {
-                padding: $kendo-panelbar-item-padding-y $kendo-panelbar-item-padding-x;
+                padding-block: $kendo-panelbar-item-padding-y;
+                padding-inline: $kendo-panelbar-item-padding-x;
                 color: inherit;
                 text-decoration: none;
                 display: flex;
@@ -34507,7 +34666,8 @@ $kendo-adaptive-scheduler-subtle-text: $kendo-subtle-text !default;
             .k-recur-items-wrap {
                 width: 100%;
-                margin: -1px 0;
+                margin-block: -1px;
+                margin-inline: 0;
             }
             .k-scheduler-recur-end-wrap {
@@ -34533,7 +34693,8 @@ $kendo-adaptive-scheduler-subtle-text: $kendo-subtle-text !default;
         }
         .k-scheduler-toolbar {
-            padding: $kendo-toolbar-md-padding-y $kendo-toolbar-md-padding-x;
+            padding-block: $kendo-toolbar-md-padding-y;
+            padding-inline: $kendo-toolbar-md-padding-x;
             > * {
                 margin: 0;
@@ -34568,7 +34729,8 @@ $kendo-adaptive-scheduler-subtle-text: $kendo-subtle-text !default;
         }
         .k-scheduler-footer {
-            padding: $kendo-toolbar-md-padding-y $kendo-toolbar-md-padding-x;
+            padding-block: $kendo-toolbar-md-padding-y;
+            padding-inline: $kendo-toolbar-md-padding-x;
             display: flex;
             justify-content: space-between;
@@ -34726,12 +34888,14 @@ $kendo-adaptive-scheduler-subtle-text: $kendo-subtle-text !default;
         .k-list-title,
         .k-filter-help-text {
-            padding: $kendo-listgroup-item-padding-y $kendo-listgroup-item-padding-x;
+            padding-block: $kendo-listgroup-item-padding-y;
+            padding-inline: $kendo-listgroup-item-padding-x;
             display: block;
         }
         .k-listgroup-title {
-            padding: $kendo-listgroup-item-padding-y $kendo-listgroup-item-padding-x;
+            padding-block: $kendo-listgroup-item-padding-y;
+            padding-inline: $kendo-listgroup-item-padding-x;
             font-weight: bold;
             text-transform: uppercase;
         }
@@ -35607,7 +35771,8 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
             overflow: visible;
             > .k-icon {
-                padding: $kendo-grid-cell-padding-y 0;
+                padding-block: $kendo-grid-cell-padding-y;
+                padding-inline: 0;
                 width: 100%;
                 height: 100%;
                 // That causes an issue with grid material. Commenting it for now
@@ -35824,8 +35989,10 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
     .k-grid-column-menu-standalone a.k-grid-filter {
         position: initial;
         display: inline-block;
-        margin: -4px 0;
-        padding: 4px 8px;
+        margin-block: -4px;
+        margin-inline: 0;
+        padding-block: 4px;
+        padding-inline: 8px;
     }
     // Filter row
@@ -36170,7 +36337,8 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
     .k-grid-norecords-template {
         box-sizing: border-box;
-        margin: 0 auto;
+        margin-block: 0;
+        margin-inline: auto;
         width: 20em;
         height: 4em;
         border: 1px solid;
@@ -36206,16 +36374,19 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
         .k-grid-#{$size} {
             .k-table-th {
-                padding: $_header-padding-y $_header-padding-x;
+                padding-block: $_header-padding-y;
+                padding-inline: $_header-padding-x;
             }
             td,
             .k-table-td {
-                padding: $_cell-padding-y $_cell-padding-x;
+                padding-block: $_cell-padding-y;
+                padding-inline: $_cell-padding-x;
             }
             .k-grouping-header {
-                padding: $_grouping-header-padding-y $_grouping-header-padding-x;
+                padding-block: $_grouping-header-padding-y;
+                padding-inline: $_grouping-header-padding-x;
                 gap: $_grouping-header-padding-y;
                 &::before {
@@ -36225,8 +36396,10 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
             .k-grid-header {
                 .k-table-th > .k-link {
-                    margin: (-$_header-padding-y) (-$_header-padding-x);
-                    padding: $_header-padding-y $_header-padding-x;
+                    margin-block: (-$_header-padding-y);
+                    margin-inline: (-$_header-padding-x);
+                    padding-block: $_header-padding-y;
+                    padding-inline: $_header-padding-x;
                 }
                 .k-grid-filter,
@@ -36242,10 +36415,12 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
             .k-table-th {
                 > .k-cell-inner {
-                    margin: (-$_header-padding-y) (-$_header-padding-x);
+                    margin-block: (-$_header-padding-y);
+                    margin-inline: (-$_header-padding-x);
                     > .k-link {
-                        padding: $_header-padding-y $_header-padding-x;
+                        padding-block: $_header-padding-y;
+                        padding-inline: $_header-padding-x;
                     }
                 }
             }
@@ -36263,7 +36438,8 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
                 padding: 0;
                 > .k-icon {
-                    padding: $_cell-padding-y 0;
+                    padding-block: $_cell-padding-y;
+                    padding-inline: 0;
                 }
             }
@@ -36273,7 +36449,8 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
             .k-command-cell,
             .k-grid-edit-row td,
             .k-grid-edit-row .k-table-td {
-                padding: $_edit-cell-padding-y $_edit-cell-padding-x;
+                padding-block: $_edit-cell-padding-y;
+                padding-inline: $_edit-cell-padding-x;
             }
@@ -36282,7 +36459,8 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
                 td,
                 .k-table-td,
                 .k-table-th {
-                    padding: $_filter-cell-padding-y $_filter-cell-padding-x;
+                    padding-block: $_filter-cell-padding-y;
+                    padding-inline: $_filter-cell-padding-x;
                 }
             }
@@ -36430,7 +36608,8 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
         .k-item,
         .k-check-all-wrap {
-            padding: $kendo-grid-column-menu-list-item-padding-y $kendo-grid-column-menu-list-item-padding-x;
+            padding-block: $kendo-grid-column-menu-list-item-padding-y;
+            padding-inline: $kendo-grid-column-menu-list-item-padding-x;
             display: flex;
             flex-flow: row nowrap;
         }
@@ -36471,7 +36650,8 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
         box-sizing: border-box;
         &.k-popup {
-            padding: $kendo-grid-column-menu-popup-padding-y $kendo-grid-column-menu-popup-padding-x;
+            padding-block: $kendo-grid-column-menu-popup-padding-y;
+            padding-inline: $kendo-grid-column-menu-popup-padding-x;
             max-width: 100%;
         }
@@ -36509,7 +36689,8 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
     .k-column-chooser-title,
     .k-column-list-item {
-        padding: $kendo-grid-column-menu-list-item-padding-y $kendo-grid-column-menu-list-item-padding-x;
+        padding-block: $kendo-grid-column-menu-list-item-padding-y;
+        padding-inline: $kendo-grid-column-menu-list-item-padding-x;
     }
     .k-column-list-item {
@@ -36527,11 +36708,13 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
     }
     .k-columns-items-wrap {
-        padding: $kendo-grid-column-menu-items-wrap-padding-y $kendo-grid-column-menu-items-wrap-padding-x;
+        padding-block: $kendo-grid-column-menu-items-wrap-padding-y;
+        padding-inline: $kendo-grid-column-menu-items-wrap-padding-x;
     }
     .k-columnmenu-item {
-        padding: $kendo-grid-column-menu-item-padding-y $kendo-grid-column-menu-item-padding-x;
+        padding-block: $kendo-grid-column-menu-item-padding-y;
+        padding-inline: $kendo-grid-column-menu-item-padding-x;
         outline: 0;
         cursor: pointer;
@@ -36550,7 +36733,8 @@ $kendo-grid-group-footer-second-cell-border: 0px !default;
     }
     .k-column-menu-group-header {
-        padding: $kendo-grid-column-menu-group-header-padding-y $kendo-grid-column-menu-group-header-padding-x;
+        padding-block: $kendo-grid-column-menu-group-header-padding-y;
+        padding-inline: $kendo-grid-column-menu-group-header-padding-x;
         display: flex;
         flex: 0 0 auto;
         position: relative;
@@ -37499,7 +37683,8 @@ $kendo-listview-item-focus-shadow: null !default;
         &::after { display: none; }
     }
     .k-listview-content-padding-rectangle {
-        padding: $kendo-listview-padding-y $kendo-listview-padding-x;
+        padding-block: $kendo-listview-padding-y;
+        padding-inline: $kendo-listview-padding-x;
     }
     .k-listview-content-padding-square {
         padding: $kendo-listview-padding-y;
@@ -37516,11 +37701,14 @@ $kendo-listview-item-focus-shadow: null !default;
         flex-shrink: 0;
     }
     .k-listview-item-padding-rectangle {
-        padding: $kendo-listview-item-padding-y $kendo-listview-item-padding-x;
+        padding-block: $kendo-listview-item-padding-y;
+        padding-inline: $kendo-listview-item-padding-x;
     }
     .k-listview-item-padding-rectangle .k-listview-link {
-        margin: (-$kendo-listview-item-padding-y) (-$kendo-listview-item-padding-x);
-        padding: $kendo-listview-item-padding-y $kendo-listview-item-padding-x;
+        margin-block: (-$kendo-listview-item-padding-y);
+        margin-inline: (-$kendo-listview-item-padding-x);
+        padding-block: $kendo-listview-item-padding-y;
+        padding-inline: $kendo-listview-item-padding-x;
     }
     .k-listview-item-padding-square {
         padding: $kendo-listview-item-padding-y;
@@ -37873,7 +38061,8 @@ $kendo-spreadsheet-drawing-anchor-bg: rgba( $kendo-selected-bg, .25 ) !default;
         flex: 1;
         > .k-i-formula-fx {
-            padding: 0 $kendo-padding-md-y;
+            padding-block: 0;
+            padding-inline: $kendo-padding-md-y;
             box-sizing: content-box;
             border-width: 0 1px 0 0;
             border-style: solid;
@@ -37888,7 +38077,8 @@ $kendo-spreadsheet-drawing-anchor-bg: rgba( $kendo-selected-bg, .25 ) !default;
         }
         .k-spreadsheet-formula-input {
-            padding: $kendo-input-padding-y $kendo-input-padding-x;
+            padding-block: $kendo-input-padding-y;
+            padding-inline: $kendo-input-padding-x;
             line-height: $kendo-input-line-height;
             &.k-spreadsheet-array-formula {
@@ -37928,7 +38118,8 @@ $kendo-spreadsheet-drawing-anchor-bg: rgba( $kendo-selected-bg, .25 ) !default;
         min-width: 100px;
         .k-item {
-            padding: $kendo-list-md-item-padding-y $kendo-list-md-item-padding-x;
+            padding-block: $kendo-list-md-item-padding-y;
+            padding-inline: $kendo-list-md-item-padding-x;
         }
     }
     .k-syntax-func,
@@ -37939,7 +38130,8 @@ $kendo-spreadsheet-drawing-anchor-bg: rgba( $kendo-selected-bg, .25 ) !default;
     // Cell editor
     .k-spreadsheet-cell-editor {
-        padding: 0 3px;
+        padding-block: 0;
+        padding-inline: 3px;
         line-height: 20px;
         display: none;
         overflow: hidden;
@@ -38377,7 +38569,8 @@ $kendo-spreadsheet-drawing-anchor-bg: rgba( $kendo-selected-bg, .25 ) !default;
         }
         .k-details-summary,
         .k-columnmenu-item {
-            padding: $kendo-menu-popup-item-padding-y $kendo-menu-popup-item-padding-x;
+            padding-block: $kendo-menu-popup-item-padding-y;
+            padding-inline: $kendo-menu-popup-item-padding-x;
             display: flex;
             align-items: center;
             cursor: pointer;
@@ -39169,14 +39362,15 @@ $kendo-pivotgrid-remove-text: $kendo-pivotgrid-button-bg !default;
     // Pivotgrid
     .k-pivotgrid {
-        padding: $kendo-pivotgrid-padding-y $kendo-pivotgrid-padding-x;
+        padding-block: $kendo-pivotgrid-padding-y;
+        padding-inline: $kendo-pivotgrid-padding-x;
         border-width: $kendo-pivotgrid-border-width;
         border-style: solid;
         box-sizing: content-box;
         font-size: $kendo-pivotgrid-font-size;
         font-family: $kendo-pivotgrid-font-family;
         line-height: $kendo-pivotgrid-line-height;
-        text-align: left;
+        text-align: start;
         vertical-align: top;
         display: grid;
         grid-template-columns: $kendo-pivotgrid-row-header-width auto;
@@ -39192,6 +39386,7 @@ $kendo-pivotgrid-remove-text: $kendo-pivotgrid-button-bg !default;
             border-collapse: separate;
             border-spacing: 0;
             outline: 0;
+            text-align: inherit;
             empty-cells: show;
         }
@@ -39201,6 +39396,7 @@ $kendo-pivotgrid-remove-text: $kendo-pivotgrid-button-bg !default;
         tr,
         td {
             border-color: inherit;
+            text-align: inherit;
         }
     }
@@ -39296,7 +39492,8 @@ $kendo-pivotgrid-remove-text: $kendo-pivotgrid-button-bg !default;
     }
     .k-pivotgrid-cell {
-        padding: $kendo-pivotgrid-cell-padding-y $kendo-pivotgrid-cell-padding-x;
+        padding-block: $kendo-pivotgrid-cell-padding-y;
+        padding-inline: $kendo-pivotgrid-cell-padding-x;
         text-overflow: ellipsis;
         white-space: nowrap;
         vertical-align: top;
@@ -39318,7 +39515,8 @@ $kendo-pivotgrid-remove-text: $kendo-pivotgrid-button-bg !default;
     // Column menus
     .k-column-menu .k-treeview {
-        padding: $kendo-pivotgrid-treeview-padding-y $kendo-pivotgrid-treeview-padding-x;
+        padding-block: $kendo-pivotgrid-treeview-padding-y;
+        padding-inline: $kendo-pivotgrid-treeview-padding-x;
         overflow: auto;
     }
@@ -39334,7 +39532,8 @@ $kendo-pivotgrid-remove-text: $kendo-pivotgrid-button-bg !default;
     }
     .k-pivotgrid-configurator-panel {
-        padding: $kendo-pivotgrid-configurator-padding-y $kendo-pivotgrid-configurator-padding-x;
+        padding-block: $kendo-pivotgrid-configurator-padding-y;
+        padding-inline: $kendo-pivotgrid-configurator-padding-x;
         border-width: $kendo-pivotgrid-configurator-border-width;
         border-style: solid;
         box-sizing: border-box;
@@ -39346,7 +39545,8 @@ $kendo-pivotgrid-remove-text: $kendo-pivotgrid-button-bg !default;
     // Configurator Button
     .k-pivotgrid-configurator-button {
-        padding: $kendo-pivotgrid-configurator-button-padding-y $kendo-pivotgrid-configurator-button-padding-x;
+        padding-block: $kendo-pivotgrid-configurator-button-padding-y;
+        padding-inline: $kendo-pivotgrid-configurator-button-padding-x;
         border-width: $kendo-pivotgrid-configurator-button-border-width;
         border-style: solid;
         box-sizing: border-box;
@@ -39399,7 +39599,8 @@ $kendo-pivotgrid-remove-text: $kendo-pivotgrid-button-bg !default;
     // Panel Content
     .k-pivotgrid-configurator-header {
-        padding: $kendo-pivotgrid-configurator-header-padding-y $kendo-pivotgrid-configurator-header-padding-x;
+        padding-block: $kendo-pivotgrid-configurator-header-padding-y;
+        padding-inline: $kendo-pivotgrid-configurator-header-padding-x;
         font-size: $kendo-pivotgrid-configurator-header-font-size;
         font-weight: $kendo-pivotgrid-configurator-header-font-weight;
         display: flex;
@@ -39413,7 +39614,8 @@ $kendo-pivotgrid-remove-text: $kendo-pivotgrid-button-bg !default;
     }
     .k-pivotgrid-configurator-content {
-        padding: $kendo-pivotgrid-configurator-content-padding-y $kendo-pivotgrid-configurator-content-padding-x;
+        padding-block: $kendo-pivotgrid-configurator-content-padding-y;
+        padding-inline: $kendo-pivotgrid-configurator-content-padding-x;
         flex: 1 1 auto;
         overflow: auto;
@@ -39441,7 +39643,8 @@ $kendo-pivotgrid-remove-text: $kendo-pivotgrid-button-bg !default;
         // Values
         .k-value-fields {
-            margin: $kendo-pivotgrid-configurator-fields-margin-y $kendo-pivotgrid-configurator-fields-margin-x;
+            margin-block: $kendo-pivotgrid-configurator-fields-margin-y;
+            margin-inline: $kendo-pivotgrid-configurator-fields-margin-x;
             display: flex;
             flex-direction: column;
             gap: k-math-div( $kendo-pivotgrid-spacer, 2 );
@@ -39466,7 +39669,8 @@ $kendo-pivotgrid-remove-text: $kendo-pivotgrid-button-bg !default;
         }
         .k-treeview {
-            padding: $kendo-pivotgrid-treeview-padding-y $kendo-pivotgrid-treeview-padding-x;
+            padding-block: $kendo-pivotgrid-treeview-padding-y;
+            padding-inline: $kendo-pivotgrid-treeview-padding-x;
             overflow: auto;
         }
     }
@@ -39474,7 +39678,8 @@ $kendo-pivotgrid-remove-text: $kendo-pivotgrid-button-bg !default;
     // Calculated field
     .k-calculated-field {
-        padding: $kendo-pivotgrid-calculated-field-padding-y $kendo-pivotgrid-calculated-field-padding-x;
+        padding-block: $kendo-pivotgrid-calculated-field-padding-y;
+        padding-inline: $kendo-pivotgrid-calculated-field-padding-x;
         border-width: $kendo-pivotgrid-calculated-field-border-width;
         border-radius: $kendo-pivotgrid-calculated-field-border-radius;
         border-style: solid;
@@ -40141,7 +40346,8 @@ $kendo-treelist-footer-row-border-width: 1px !default;
         }
         .k-status {
-            padding: .4em .6em;
+            padding-block: .4em;
+            padding-inline: .6em;
             line-height: 1.6em;
             // TODO: see what this does and use a better name
@@ -40229,7 +40435,8 @@ $kendo-treelist-footer-row-border-width: 1px !default;
         border-right: 1px solid;
         height: 1em;
         vertical-align: top;
-        margin: 0 .5em;
+        margin-block: 0;
+        margin-inline: .5em;
     }
 }
@@ -40388,7 +40595,8 @@ $kendo-filter-toolbar-focus-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px
         .k-filter-toolbar {
             display: inline-flex;
             position: relative;
-            padding: $kendo-filter-padding-y 0;
+            padding-block: $kendo-filter-padding-y;
+            padding-inline: 0;
             &::before {
                 content: "";
@@ -40677,7 +40885,8 @@ $kendo-file-manager-preview-icon-border: null !default;
     // Navigation
     .k-filemanager-navigation {
-        padding: $kendo-file-manager-navigation-padding-y $kendo-file-manager-navigation-padding-x;
+        padding-block: $kendo-file-manager-navigation-padding-y;
+        padding-inline: $kendo-file-manager-navigation-padding-x;
         width: $kendo-file-manager-navigation-width;
         border-width: 0;
         border-right-width: $kendo-file-manager-navigation-border-width;
@@ -40711,7 +40920,8 @@ $kendo-file-manager-preview-icon-border: null !default;
     .k-filemanager-breadcrumb {
         border-width: 0;
         border-bottom-width: $kendo-file-manager-breadcrumb-border-width;
-        padding: $kendo-file-manager-breadcrumb-padding-y $kendo-file-manager-breadcrumb-padding-x;
+        padding-block: $kendo-file-manager-breadcrumb-padding-y;
+        padding-inline: $kendo-file-manager-breadcrumb-padding-x;
         flex-shrink: 0;
     }
@@ -40723,7 +40933,8 @@ $kendo-file-manager-preview-icon-border: null !default;
         // Listview item
         .k-listview-item {
-            padding: $kendo-file-manager-listview-item-padding-y $kendo-file-manager-listview-item-padding-x;
+            padding-block: $kendo-file-manager-listview-item-padding-y;
+            padding-inline: $kendo-file-manager-listview-item-padding-x;
             width: $kendo-file-manager-listview-item-width;
             height: $kendo-file-manager-listview-item-height;
             text-align: center;
@@ -41134,7 +41345,8 @@ $kendo-taskboard-drag-placeholder-border: $kendo-component-border !default;
     // TaskBoard
     .k-taskboard {
-        padding: $kendo-taskboard-padding-y $kendo-taskboard-padding-x;
+        padding-block: $kendo-taskboard-padding-y;
+        padding-inline: $kendo-taskboard-padding-x;
         box-sizing: border-box;
         font-size: $kendo-taskboard-font-size;
         font-family: $kendo-taskboard-font-family;
@@ -41152,7 +41364,8 @@ $kendo-taskboard-drag-placeholder-border: $kendo-component-border !default;
     // Toolbar
     .k-taskboard-toolbar {
-        padding: $kendo-taskboard-toolbar-padding-y $kendo-taskboard-toolbar-padding-x;
+        padding-block: $kendo-taskboard-toolbar-padding-y;
+        padding-inline: $kendo-taskboard-toolbar-padding-x;
         border-width: 0;
         box-shadow: none;
         background: none;
@@ -41190,7 +41403,8 @@ $kendo-taskboard-drag-placeholder-border: $kendo-component-border !default;
     }
     .k-taskboard-column-header {
-        padding: $kendo-taskboard-column-header-padding-y $kendo-taskboard-column-header-padding-x;
+        padding-block: $kendo-taskboard-column-header-padding-y;
+        padding-inline: $kendo-taskboard-column-header-padding-x;
         font-weight: $kendo-taskboard-column-header-font-weight;
         display: flex;
         flex-direction: row;
@@ -41207,14 +41421,16 @@ $kendo-taskboard-drag-placeholder-border: $kendo-component-border !default;
     .k-taskboard-column-cards-container {
         margin-bottom: $kendo-taskboard-column-container-spacing-y;
-        padding: $kendo-taskboard-column-container-padding-y $kendo-taskboard-column-container-padding-x;
+        padding-block: $kendo-taskboard-column-container-padding-y;
+        padding-inline: $kendo-taskboard-column-container-padding-x;
         outline: none;
         overflow: auto;
         flex: 1 1 auto;
     }
     .k-taskboard-column-cards {
-        padding: $kendo-taskboard-column-cards-padding-y $kendo-taskboard-column-cards-padding-x;
+        padding-block: $kendo-taskboard-column-cards-padding-y;
+        padding-inline: $kendo-taskboard-column-cards-padding-x;
         min-height: 100%;
         display: flex;
         flex-direction: column;
@@ -41240,7 +41456,8 @@ $kendo-taskboard-drag-placeholder-border: $kendo-component-border !default;
     // Preview/Edit Pane
     .k-taskboard-pane {
-        padding: $kendo-taskboard-pane-padding-y $kendo-taskboard-pane-padding-x;
+        padding-block: $kendo-taskboard-pane-padding-y;
+        padding-inline: $kendo-taskboard-pane-padding-x;
         width: $kendo-taskboard-pane-width;
         border-width: $kendo-taskboard-pane-border-width;
         border-style: solid;
@@ -41255,7 +41472,8 @@ $kendo-taskboard-drag-placeholder-border: $kendo-component-border !default;
     }
     .k-taskboard-pane-header {
-        padding: $kendo-taskboard-pane-header-padding-y $kendo-taskboard-pane-header-padding-x;
+        padding-block: $kendo-taskboard-pane-header-padding-y;
+        padding-inline: $kendo-taskboard-pane-header-padding-x;
         font-weight: $kendo-taskboard-pane-header-font-weight;
         display: flex;
         flex-direction: row;
@@ -41273,13 +41491,15 @@ $kendo-taskboard-drag-placeholder-border: $kendo-component-border !default;
     }
     .k-taskboard-pane-content {
-        padding: $kendo-taskboard-pane-content-padding-y $kendo-taskboard-pane-content-padding-x;
+        padding-block: $kendo-taskboard-pane-content-padding-y;
+        padding-inline: $kendo-taskboard-pane-content-padding-x;
         overflow: auto;
         flex: 1 1 auto;
     }
     .k-taskboard-pane-actions {
-        padding: $kendo-taskboard-pane-actions-padding-y $kendo-taskboard-pane-actions-padding-x;
+        padding-block: $kendo-taskboard-pane-actions-padding-y;
+        padding-inline: $kendo-taskboard-pane-actions-padding-x;
     }
     .k-taskboard-pane-start {
@@ -41299,7 +41519,8 @@ $kendo-taskboard-drag-placeholder-border: $kendo-component-border !default;
         .k-card-header
         .k-card-body,
         .k-card-footer {
-            padding: $kendo-taskboard-card-padding-y $kendo-taskboard-card-padding-x;
+            padding-block: $kendo-taskboard-card-padding-y;
+            padding-inline: $kendo-taskboard-card-padding-x;
         }
         .k-card-header {
@@ -41569,7 +41790,8 @@ $kendo-editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-li
     // Inline editor
     .k-editor-inline {
         @include border-radius( $kendo-border-radius-md );
-        padding: $kendo-padding-sm-y $kendo-padding-sm-x;
+        padding-block: $kendo-padding-sm-y;
+        padding-inline: $kendo-padding-sm-x;
         border: 1px solid transparent;
         word-wrap: break-word;
         overflow: auto;
@@ -41767,7 +41989,8 @@ $kendo-editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-li
         th {
             min-width: 1em;
             border: 1px solid;
-            padding: 3px 5px;
+            padding-block: 3px;
+            padding-inline: 5px;
             vertical-align: top;
             box-sizing: border-box;
             position: relative;
@@ -41775,7 +41998,10 @@ $kendo-editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-li
         th {
             font-weight: bold;
-            text-align: left;
+            text-align: start;
+        }
+        td {
+            text-align: start;
         }
         // Give selected cells a blue overlay
@@ -41795,8 +42021,10 @@ $kendo-editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-li
     .k-edit-form-content {
         flex: 1 1 auto;
         overflow: auto;
-        margin: (-$kendo-window-inner-padding-y) (-$kendo-window-inner-padding-x);
-        padding: $kendo-window-inner-padding-y $kendo-window-inner-padding-x;
+        margin-block: (-$kendo-window-inner-padding-y);
+        margin-inline: (-$kendo-window-inner-padding-x);
+        padding-block: $kendo-window-inner-padding-y;
+        padding-inline: $kendo-window-inner-padding-x;
     }
@@ -41951,7 +42179,8 @@ $kendo-editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-li
             height: 390px;
             max-height: 50vh;
             margin: 0 0 k-map-get( $kendo-spacing, 4 ) 0;
-            padding: $kendo-padding-md-y $kendo-padding-md-x;
+            padding-block: $kendo-padding-md-y;
+            padding-inline: $kendo-padding-md-x;
             border-top-width: 0;
             overflow: auto;
         }
@@ -41959,7 +42188,8 @@ $kendo-editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-li
         .k-tile {
             width: 33%;
             height: 90px;
-            padding: $kendo-padding-md-y $kendo-padding-md-x;
+            padding-block: $kendo-padding-md-y;
+            padding-inline: $kendo-padding-md-x;
             box-sizing: border-box;
             white-space: nowrap;
             overflow: hidden;
@@ -42078,7 +42308,8 @@ $kendo-editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-li
             td {
                 min-width: 1px;
-                padding: $kendo-padding-sm-y $kendo-padding-sm-x;
+                padding-block: $kendo-padding-sm-y;
+                padding-inline: $kendo-padding-sm-x;
             }
         }
@@ -42142,7 +42373,8 @@ $kendo-editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-li
                 .k-column-resize-marker {
                     width: 2px;
                     height: 100%;
-                    margin: 0 auto;
+                    margin-block: 0;
+                    margin-inline: auto;
                     display: none;
                     opacity: .8;
                 }
@@ -42395,8 +42627,10 @@ $kendo-image-editor-crop-overlay-bg: rgba( black, .3 ) !default;
     // Image Editor
     .k-imageeditor {
-        margin: $kendo-image-editor-margin-y $kendo-image-editor-margin-x;
-        padding: $kendo-image-editor-padding-y $kendo-image-editor-padding-x;
+        margin-block: $kendo-image-editor-margin-y;
+        margin-inline: $kendo-image-editor-margin-x;
+        padding-block: $kendo-image-editor-padding-y;
+        padding-inline: $kendo-image-editor-padding-x;
         border-width: $kendo-image-editor-border-width;
         border-style: solid;
         box-sizing: border-box;
@@ -42449,7 +42683,8 @@ $kendo-image-editor-crop-overlay-bg: rgba( black, .3 ) !default;
     // Action Pane
     .k-imageeditor-action-pane {
-        padding: $kendo-image-editor-action-pane-padding-y $kendo-image-editor-action-pane-padding-x;
+        padding-block: $kendo-image-editor-action-pane-padding-y;
+        padding-inline: $kendo-image-editor-action-pane-padding-x;
         width: $kendo-image-editor-action-pane-width;
         border-width: 0;
         border-left-width: $kendo-image-editor-content-border-width;
@@ -42484,7 +42719,8 @@ $kendo-image-editor-crop-overlay-bg: rgba( black, .3 ) !default;
         position: absolute;
         .k-resize-handle {
-            margin: $kendo-image-editor-resize-handle-margin-y $kendo-image-editor-resize-handle-margin-x;
+            margin-block: $kendo-image-editor-resize-handle-margin-y;
+            margin-inline: $kendo-image-editor-resize-handle-margin-x;
             border-style: solid;
             border-width: $kendo-image-editor-resize-handle-border-width;
         }
@@ -42826,7 +43062,8 @@ $kendo-gantt-validation-tooltip-invalid-border: $kendo-color-error !default;
             }
             .k-grid-header th:last-child {
                 .k-header {
-                    padding: $kendo-grid-header-padding-y $kendo-grid-header-padding-x;
+                    padding-block: $kendo-grid-header-padding-y;
+                    padding-inline: $kendo-grid-header-padding-x;
                     border-width: 0 0 1px $kendo-grid-cell-vertical-border-width;
                     white-space: nowrap;
                 }
@@ -42853,7 +43090,8 @@ $kendo-gantt-validation-tooltip-invalid-border: $kendo-color-error !default;
                 }
             }
             .k-task-content {
-                padding: $kendo-gantt-task-padding-y $kendo-gantt-task-padding-x;
+                padding-block: $kendo-gantt-task-padding-y;
+                padding-inline: $kendo-gantt-task-padding-x;
                 display: block;
                 line-height: normal;
                 flex: 1 1 auto;
@@ -43046,7 +43284,8 @@ $kendo-gantt-validation-tooltip-invalid-border: $kendo-color-error !default;
             overflow-x: scroll;
         }
         .k-header {
-            padding: $kendo-grid-header-padding-y $kendo-grid-header-padding-x;
+            padding-block: $kendo-grid-header-padding-y;
+            padding-inline: $kendo-grid-header-padding-x;
             border-width: 0 0 1px $kendo-grid-cell-vertical-border-width;
             white-space: nowrap;
         }
@@ -43134,8 +43373,10 @@ $kendo-gantt-validation-tooltip-invalid-border: $kendo-color-error !default;
     }
     .k-task-wrap {
-        margin: 0 -21px;
-        padding: 5px 21px;
+        margin-block: 0;
+        margin-inline: -21px;
+        padding-block: 5px;
+        padding-inline: 21px;
         display: inline-flex;
         flex-direction: row;
         align-items: center;
@@ -43202,7 +43443,8 @@ $kendo-gantt-validation-tooltip-invalid-border: $kendo-color-error !default;
     // Milestone
     .k-milestone-wrap {
-        margin: 0 -2em;
+        margin-block: 0;
+        margin-inline: -2em;
     }
     .k-task-milestone {
         width: 1em;
@@ -43309,7 +43551,8 @@ $kendo-gantt-validation-tooltip-invalid-border: $kendo-color-error !default;
         white-space: nowrap;
     }
     .k-task-template {
-        padding: $kendo-gantt-task-padding-y $kendo-gantt-task-padding-x;
+        padding-block: $kendo-gantt-task-padding-y;
+        padding-inline: $kendo-gantt-task-padding-x;
         line-height: normal;
         flex: 1;
         overflow: hidden;
@@ -43339,14 +43582,16 @@ $kendo-gantt-validation-tooltip-invalid-border: $kendo-color-error !default;
         white-space: nowrap;
         .k-resource {
-            margin: 0 5px;
+            margin-block: 0;
+            margin-inline: 5px;
         }
     }
     // Task tooltip
     .k-task-details {
-        padding: $kendo-padding-md-y $kendo-padding-md-x;
+        padding-block: $kendo-padding-md-y;
+        padding-inline: $kendo-padding-md-x;
         white-space: nowrap;
         strong {
@@ -43552,14 +43797,11 @@ $kendo-gantt-validation-tooltip-invalid-border: $kendo-color-error !default;
         }
         .k-task-wrap:not(.k-milestone-wrap) {
-            margin: 0 -26px;
+            margin-block: 0;
+            margin-inline: -26px;
         }
         .k-gantt-timeline {
-            .k-gantt-tasks tbody {
-                text-align: left;
-            }
             .k-header {
                 border-width: 0 $kendo-grid-cell-vertical-border-width 1px 0;
             }
@@ -43579,7 +43821,7 @@ $kendo-gantt-validation-tooltip-invalid-border: $kendo-color-error !default;
         }
         .k-task-content {
-            text-align: right;
+            text-align: end;
         }
         .k-task-complete {
@@ -44132,7 +44374,8 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
         td,
         th {
-            padding: $kendo-scheduler-cell-padding-y $kendo-scheduler-cell-padding-x;
+            padding-block: $kendo-scheduler-cell-padding-y;
+            padding-inline: $kendo-scheduler-cell-padding-x;
             height: $kendo-scheduler-cell-height;
             overflow: hidden;
             white-space: nowrap;
@@ -44226,7 +44469,8 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
         .k-scheduler-cell {
             display: flex;
             flex: 1 1 100%;
-            padding: $kendo-scheduler-cell-padding-y $kendo-scheduler-cell-padding-y;
+            padding-block: $kendo-scheduler-cell-padding-y;
+            padding-inline: $kendo-scheduler-cell-padding-y;
             min-height: 1.5em;
             overflow: hidden;
             white-space: nowrap;
@@ -44428,7 +44672,7 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
         th {
             border-width: 0 1px 1px 0;
-            text-align: right;
+            text-align: end;
         }
         .k-slot-cell,
@@ -44475,7 +44719,7 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
         border-width: 0;
         border-style: solid;
         border-radius: $kendo-scheduler-event-border-radius;
-        text-align: left;
+        text-align: start;
         outline: 0;
         cursor: default;
         position: absolute;
@@ -44490,7 +44734,8 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
         // Template
         .k-event-template {
             line-height: $kendo-scheduler-event-line-height;
-            padding: $kendo-padding-md-y $kendo-padding-md-x;
+            padding-block: $kendo-padding-md-y;
+            padding-inline: $kendo-padding-md-x;
             // TODO: incompatible units
             // padding-right: $kendo-padding-sm-x + k-map-get( $kendo-spacing, 4 );
         }
@@ -44778,7 +45023,7 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
         }
         .k-scheduler-table td {
             height: 80px;
-            text-align: right;
+            text-align: end;
         }
         .k-scheduler-body .k-scheduler-cell {
             min-height: 80px;
@@ -44893,7 +45138,8 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
     // Year view
     .k-scheduler-yearview {
         .k-scheduler-body {
-            padding: $kendo-scheduler-yearview-padding-y $kendo-scheduler-yearview-padding-x;
+            padding-block: $kendo-scheduler-yearview-padding-y;
+            padding-inline: $kendo-scheduler-yearview-padding-x;
             justify-content: center;
         }
@@ -44936,7 +45182,8 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
 @include exports("scheduler-tooltip/layout") {
     .k-scheduler-tooltip {
-        padding: $kendo-scheduler-tooltip-padding-y $kendo-scheduler-tooltip-padding-x;
+        padding-block: $kendo-scheduler-tooltip-padding-y;
+        padding-inline: $kendo-scheduler-tooltip-padding-x;
         border-width: $kendo-scheduler-tooltip-border-width;
         color: inherit;
@@ -44965,7 +45212,8 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
         }
         .k-tooltip-event {
-            padding: $kendo-scheduler-tooltip-event-padding-y $kendo-scheduler-tooltip-event-padding-x;
+            padding-block: $kendo-scheduler-tooltip-event-padding-y;
+            padding-inline: $kendo-scheduler-tooltip-event-padding-x;
             border-radius: $kendo-scheduler-tooltip-event-border-radius;
             box-sizing: border-box;
             display: flex;
@@ -45069,7 +45317,6 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
         }
         .k-event {
-            text-align: right;
             padding-right: 0;
             padding-left: $kendo-padding-md-x;
@@ -45195,7 +45442,7 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
     // View header
     .k-scheduler-header {
-        text-align: left;
+        text-align: start;
         th,
         td {
@@ -45223,7 +45470,8 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
         .k-event-template {
             // Angular fix for stronger selector and smaller padding
             & {
-                padding: $kendo-padding-sm-y $kendo-padding-sm-x;
+                padding-block: $kendo-padding-sm-y;
+                padding-inline: $kendo-padding-sm-x;
             }
         }
@@ -45787,7 +46035,8 @@ $kendo-chat-quick-reply-hover-border: $kendo-color-primary !default;
             scroll-behavior: smooth;
         }
         .k-message-list-content {
-            padding: $kendo-chat-message-list-padding-y $kendo-chat-message-list-padding-x;
+            padding-block: $kendo-chat-message-list-padding-y;
+            padding-inline: $kendo-chat-message-list-padding-x;
             width: 100%;
             box-sizing: border-box;
             position: relative;
@@ -45814,7 +46063,7 @@ $kendo-chat-quick-reply-hover-border: $kendo-color-primary !default;
         }
         .k-message-group:not(.k-alt) {
             align-items: flex-start;
-            text-align: left;
+            text-align: start;
             .k-message-time {
                 margin-left: $kendo-chat-item-spacing-x;
@@ -45836,7 +46085,7 @@ $kendo-chat-quick-reply-hover-border: $kendo-color-primary !default;
         .k-message-group.k-alt {
             align-self: flex-end;
             align-items: flex-end;
-            text-align: right;
+            text-align: end;
             .k-message-time {
                 margin-right: $kendo-chat-item-spacing-x;
@@ -45894,7 +46143,8 @@ $kendo-chat-quick-reply-hover-border: $kendo-color-primary !default;
         // Bubble
         .k-bubble {
             @include border-radius( $kendo-chat-bubble-border-radius );
-            padding: $kendo-chat-bubble-padding-y $kendo-chat-bubble-padding-x;
+            padding-block: $kendo-chat-bubble-padding-y;
+            padding-inline: $kendo-chat-bubble-padding-x;
             border-width: 1px;
             border-style: solid;
             line-height: $kendo-chat-bubble-line-height;
@@ -45982,7 +46232,8 @@ $kendo-chat-quick-reply-hover-border: $kendo-color-primary !default;
         @include border-radius( 100px );
         margin-right: $kendo-chat-quick-reply-spacing;
         margin-bottom: k-math-div( $kendo-chat-quick-reply-spacing, 2 );
-        padding: $kendo-chat-quick-reply-padding-y $kendo-chat-quick-reply-padding-x;
+        padding-block: $kendo-chat-quick-reply-padding-y;
+        padding-inline: $kendo-chat-quick-reply-padding-x;
         border-width: 1px;
         border-style: solid;
         line-height: $kendo-chat-quick-reply-line-height;
@@ -46173,7 +46424,8 @@ $kendo-chat-quick-reply-hover-border: $kendo-color-primary !default;
     .k-chat-toolbar,
     .k-chat .k-toolbar-box {
-        padding: $kendo-chat-toolbar-padding-y $kendo-chat-toolbar-padding-x;
+        padding-block: $kendo-chat-toolbar-padding-y;
+        padding-inline: $kendo-chat-toolbar-padding-x;
         width: 100%;
         border-width: 1px 0 0;
         box-sizing: border-box;
@@ -46240,8 +46492,6 @@ $kendo-chat-quick-reply-hover-border: $kendo-color-primary !default;
         // Text align
         .k-message-group:not(.k-alt) {
-            text-align: right;
             .k-message-time {
                 margin-left: 0;
                 margin-right: $kendo-chat-item-spacing-x;
@@ -46254,8 +46504,6 @@ $kendo-chat-quick-reply-hover-border: $kendo-color-primary !default;
             }
         }
         .k-message-group.k-alt {
-            text-align: left;
             .k-message-time {
                 margin-right: 0;
                 margin-left: $kendo-chat-item-spacing-x;
@@ -46485,7 +46733,8 @@ $kendo-media-player-titlebar-gradient: rgba( $kendo-media-player-text, .7 ), rgb
     // Title bar
     .k-mediaplayer-titlebar {
-        padding: $kendo-media-player-titlebar-padding-y $kendo-media-player-titlebar-padding-x;
+        padding-block: $kendo-media-player-titlebar-padding-y;
+        padding-inline: $kendo-media-player-titlebar-padding-x;
         position: absolute;
         z-index: 2;
         top: 0;
@@ -46716,7 +46965,8 @@ $kendo-timeline-event-min-height-calc: calc(2 * (#{$kendo-timeline-track-event-o
         .k-timeline-flag {
             display: inline-block;
             text-align: center;
-            padding: $kendo-timeline-flag-padding-y $kendo-timeline-flag-padding-x;
+            padding-block: $kendo-timeline-flag-padding-y;
+            padding-inline: $kendo-timeline-flag-padding-x;
             border-radius: $kendo-border-radius;
             line-height: $kendo-timeline-flag-line-height;
             min-width: $kendo-timeline-flag-min-width;
@@ -46796,8 +47046,10 @@ $kendo-timeline-event-min-height-calc: calc(2 * (#{$kendo-timeline-track-event-o
     .k-timeline-vertical,
     .k-timeline-horizontal {
-        padding: 0 $kendo-timeline-spacing-x;
-        margin: $kendo-timeline-spacing-y 0;
+        padding-block: 0;
+        padding-inline: $kendo-timeline-spacing-x;
+        margin-block: $kendo-timeline-spacing-y;
+        margin-inline: 0;
         width: 100%;
         position: relative;
         border: 0;
@@ -46846,13 +47098,14 @@ $kendo-timeline-event-min-height-calc: calc(2 * (#{$kendo-timeline-track-event-o
             padding-right: $kendo-timeline-items-padding;
             margin-top: $kendo-timeline-track-event-offset;
             transform: translate(-100%, -50%);
-            text-align: right;
+            text-align: end;
         }
         .k-timeline-event {
             display: flex;
             align-items: flex-start;
-            padding: $kendo-timeline-spacing-y 0;
+            padding-block: $kendo-timeline-spacing-y;
+            padding-inline: 0;
         }
         .k-timeline-card {
@@ -46882,7 +47135,8 @@ $kendo-timeline-event-min-height-calc: calc(2 * (#{$kendo-timeline-track-event-o
             }
             .k-event-collapse {
-                margin: -$kendo-icon-spacing 0;
+                margin-block: -$kendo-icon-spacing;
+                margin-inline: 0;
                 transform: rotate(90deg);
                 transition: transform .2s ease-in-out;
             }
@@ -46928,7 +47182,7 @@ $kendo-timeline-event-min-height-calc: calc(2 * (#{$kendo-timeline-track-event-o
                     flex-direction: row-reverse;
                     .k-timeline-date-wrap {
-                        text-align: left;
+                        text-align: start;
                         padding-right: 0;
                         padding-left: $kendo-timeline-items-padding;
                     }
@@ -47028,7 +47282,8 @@ $kendo-timeline-event-min-height-calc: calc(2 * (#{$kendo-timeline-track-event-o
             .k-timeline-track {
                 overflow: hidden;
-                margin: 0 $kendo-timeline-track-arrow-width;
+                margin-block: 0;
+                margin-inline: $kendo-timeline-track-arrow-width;
                 position: relative;
                 z-index: 2;
@@ -47082,8 +47337,10 @@ $kendo-timeline-event-min-height-calc: calc(2 * (#{$kendo-timeline-track-event-o
     }
     .k-timeline-mobile {
-        padding: 0 $kendo-timeline-mobile-spacing-x;
-        margin: $kendo-timeline-mobile-spacing-y 0;
+        padding-block: 0;
+        padding-inline: $kendo-timeline-mobile-spacing-x;
+        margin-block: $kendo-timeline-mobile-spacing-y;
+        margin-inline: 0;
         .k-timeline-flag {
             max-width: $kendo-timeline-mobile-flag-max-width;
@@ -47369,7 +47626,8 @@ $kendo-pdf-viewer-icon-size: calc( #{$kendo-icon-size} * 3 ) !default;
         .k-page {
             position: relative;
-            margin: $kendo-pdf-viewer-page-spacing auto;
+            margin-block: $kendo-pdf-viewer-page-spacing;
+            margin-inline: auto;
             canvas {
                 direction: ltr;
@@ -47429,7 +47687,8 @@ $kendo-pdf-viewer-icon-size: calc( #{$kendo-icon-size} * 3 ) !default;
     }
     .k-search-panel {
-        padding: $kendo-pdf-viewer-search-dialog-padding-y $kendo-pdf-viewer-search-dialog-padding-x;
+        padding-block: $kendo-pdf-viewer-search-dialog-padding-y;
+        padding-inline: $kendo-pdf-viewer-search-dialog-padding-x;
         display: flex;
         gap: $kendo-pdf-viewer-search-dialog-spacing;
         flex-flow: row nowrap;
@@ -47611,7 +47870,7 @@ $kendo-pdf-viewer-icon-size: calc( #{$kendo-icon-size} * 3 ) !default;
     .km-scroller-pull .km-template {
         display: inline-block;
         min-width: 200px;
-        text-align: left;
+        text-align: start;
     }
     .km-load-more .km-icon,
     .km-widget .km-scroller-pull .km-icon {
@@ -48306,7 +48565,8 @@ $kendo-treemap-line-height: $kendo-line-height-md !default;
         @include border-radius( $kendo-border-radius-md );
         font-size: $kendo-chart-tooltip-font-size;
         line-height: $kendo-line-height-md;
-        padding: $kendo-tooltip-padding-y $kendo-tooltip-padding-x;
+        padding-block: $kendo-tooltip-padding-y;
+        padding-inline: $kendo-tooltip-padding-x;
     }
     .k-chart-tooltip th {
@@ -48317,8 +48577,9 @@ $kendo-treemap-line-height: $kendo-line-height-md !default;
     .k-chart-tooltip td {
         width: auto;
-        text-align: left;
-        padding: $kendo-padding-sm-y $kendo-padding-sm-x;
+        text-align: start;
+        padding-block: $kendo-padding-sm-y;
+        padding-inline: $kendo-padding-sm-x;
         line-height: $kendo-line-height-md;
         vertical-align: middle;
     }
@@ -48524,7 +48785,8 @@ $kendo-treemap-line-height: $kendo-line-height-md !default;
         // Title
         .k-treemap-title {
-            padding: $kendo-padding-sm-y $kendo-padding-sm-x;
+            padding-block: $kendo-padding-sm-y;
+            padding-inline: $kendo-padding-sm-x;
             border-width: 0 0 1px;
             border-style: solid;
             border-color: inherit;
@@ -48533,7 +48795,8 @@ $kendo-treemap-line-height: $kendo-line-height-md !default;
             background-repeat: repeat-x;
         }
         .k-treemap-title-vertical {
-            padding: $kendo-padding-sm-x $kendo-padding-sm-y;
+            padding-block: $kendo-padding-sm-x;
+            padding-inline: $kendo-padding-sm-y;
             width: $kendo-line-height-em;
             white-space: nowrap;
             overflow: hidden;
@@ -48582,7 +48845,7 @@ $kendo-treemap-line-height: $kendo-line-height-md !default;
 @include exports("dataviz/gauge/layout") {
     .k-gauge {
-        text-align: left;
+        text-align: start;
         position: relative;
     }
@@ -48973,7 +49236,8 @@ $kendo-map-marker-fill: $kendo-color-primary !default;
         // Attribution
         .k-attribution {
-            padding: $kendo-map-attribution-padding-y $kendo-map-attribution-padding-x;
+            padding-block: $kendo-map-attribution-padding-y;
+            padding-inline: $kendo-map-attribution-padding-x;
             border-width: 0;
             font-size: $kendo-map-attribution-font-size;
             z-index: 1000;
@@ -49202,7 +49466,8 @@ $kendo-orgchart-line-v-height: 25px !default;
     // OrgChart
     .k-orgchart {
         width: 100%;
-        padding: $kendo-orgchart-padding-x $kendo-orgchart-padding-y;
+        padding-block: $kendo-orgchart-padding-x;
+        padding-inline: $kendo-orgchart-padding-y;
         box-sizing: border-box;
         font-size: $kendo-orgchart-font-size;
         font-family: $kendo-orgchart-font-family;
@@ -49217,7 +49482,8 @@ $kendo-orgchart-line-v-height: 25px !default;
     }
     .k-orgchart-container {
-        margin: 0 auto;
+        margin-block: 0;
+        margin-inline: auto;
         width: 100%;
         height: 100%;
         position: relative;
@@ -49238,7 +49504,8 @@ $kendo-orgchart-line-v-height: 25px !default;
     .k-orgchart-node-group-container {
         @include border-radius( $kendo-orgchart-node-group-border-radius );
-        padding: $kendo-orgchart-node-group-padding-y $kendo-orgchart-node-group-padding-x;
+        padding-block: $kendo-orgchart-node-group-padding-y;
+        padding-inline: $kendo-orgchart-node-group-padding-x;
         border-width: $kendo-orgchart-node-group-border-width;
         border-style: solid;
         outline: 0;
@@ -49292,7 +49559,8 @@ $kendo-orgchart-line-v-height: 25px !default;
     }
     .k-orgchart-line-v {
-        margin: 0 auto;
+        margin-block: 0;
+        margin-inline: auto;
         width: $kendo-orgchart-line-size;
         height: $kendo-orgchart-line-v-height;
     }