@progress/kendo-theme-fluent 5.12.1-dev.3 → 6.0.0

package/dist/all.css

@@ -23977,6 +23977,10 @@ hr.k-separator {
   background-color: var(--kendo-code-bg, var(--kendo-component-bg, initial));
 }
 
+.k-icon-wrapper-host {
+  display: contents;
+}
+
 .k-icon-with-modifier {
   position: relative;
   margin: 0.25em;
@@ -27122,6 +27126,37 @@ kendo-label > .k-label {
 .k-icon-button.k-button-sm > .k-button-icon {
   min-width: calc(var(--kendo-font-size, inherit)*var(--kendo-line-height, normal));
   min-height: calc(var(--kendo-font-size, inherit)*var(--kendo-line-height, normal));
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+.k-icon-button.k-button-sm > .k-button-icon.k-svg-icon > svg, .k-icon-button.k-button-sm > .k-button-icon.k-icon-md > svg {
+  width: var(--kendo-icon-size-md, 1rem);
+  height: var(--kendo-icon-size-md, 1rem);
+}
+.k-icon-button.k-button-sm > .k-button-icon.k-icon-xs > svg {
+  width: var(--kendo-icon-size-sm, 0.75rem);
+  height: var(--kendo-icon-size-sm, 0.75rem) s;
+}
+.k-icon-button.k-button-sm > .k-button-icon.k-icon-sm > svg {
+  width: var(--kendo-icon-size-sm, 0.875rem);
+  height: var(--kendo-icon-size-sm, 0.875rem);
+}
+.k-icon-button.k-button-sm > .k-button-icon.k-icon-lg > svg {
+  width: var(--kendo-icon-size-lg, 1.25rem);
+  height: var(--kendo-icon-size-lg, 1.25rem);
+}
+.k-icon-button.k-button-sm > .k-button-icon.k-icon-xl > svg {
+  width: var(--kendo-icon-size-xl, 1.5rem);
+  height: var(--kendo-icon-size-xl, 1.5rem);
+}
+.k-icon-button.k-button-sm > .k-button-icon.k-icon-xxl > svg {
+  width: var(--kendo-icon-size-xxl, 2rem);
+  height: var(--kendo-icon-size-xxl, 2rem);
+}
+.k-icon-button.k-button-sm > .k-button-icon.k-icon-xxxl > svg {
+  width: var(--kendo-icon-size-xxl, 3rem);
+  height: var(--kendo-icon-size-xxl, 3rem);
 }
 
 .k-button-md {
@@ -27138,6 +27173,37 @@ kendo-label > .k-label {
 .k-icon-button.k-button-md > .k-button-icon {
   min-width: calc(var(--kendo-font-size, inherit)*var(--kendo-line-height, normal));
   min-height: calc(var(--kendo-font-size, inherit)*var(--kendo-line-height, normal));
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+.k-icon-button.k-button-md > .k-button-icon.k-svg-icon > svg, .k-icon-button.k-button-md > .k-button-icon.k-icon-md > svg {
+  width: var(--kendo-icon-size-md, 1rem);
+  height: var(--kendo-icon-size-md, 1rem);
+}
+.k-icon-button.k-button-md > .k-button-icon.k-icon-xs > svg {
+  width: var(--kendo-icon-size-sm, 0.75rem);
+  height: var(--kendo-icon-size-sm, 0.75rem) s;
+}
+.k-icon-button.k-button-md > .k-button-icon.k-icon-sm > svg {
+  width: var(--kendo-icon-size-sm, 0.875rem);
+  height: var(--kendo-icon-size-sm, 0.875rem);
+}
+.k-icon-button.k-button-md > .k-button-icon.k-icon-lg > svg {
+  width: var(--kendo-icon-size-lg, 1.25rem);
+  height: var(--kendo-icon-size-lg, 1.25rem);
+}
+.k-icon-button.k-button-md > .k-button-icon.k-icon-xl > svg {
+  width: var(--kendo-icon-size-xl, 1.5rem);
+  height: var(--kendo-icon-size-xl, 1.5rem);
+}
+.k-icon-button.k-button-md > .k-button-icon.k-icon-xxl > svg {
+  width: var(--kendo-icon-size-xxl, 2rem);
+  height: var(--kendo-icon-size-xxl, 2rem);
+}
+.k-icon-button.k-button-md > .k-button-icon.k-icon-xxxl > svg {
+  width: var(--kendo-icon-size-xxl, 3rem);
+  height: var(--kendo-icon-size-xxl, 3rem);
 }
 
 .k-button-lg {
@@ -27154,6 +27220,37 @@ kendo-label > .k-label {
 .k-icon-button.k-button-lg > .k-button-icon {
   min-width: calc(var(--kendo-font-size, inherit)*var(--kendo-line-height, normal));
   min-height: calc(var(--kendo-font-size, inherit)*var(--kendo-line-height, normal));
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+.k-icon-button.k-button-lg > .k-button-icon.k-svg-icon > svg, .k-icon-button.k-button-lg > .k-button-icon.k-icon-md > svg {
+  width: var(--kendo-icon-size-md, 1rem);
+  height: var(--kendo-icon-size-md, 1rem);
+}
+.k-icon-button.k-button-lg > .k-button-icon.k-icon-xs > svg {
+  width: var(--kendo-icon-size-sm, 0.75rem);
+  height: var(--kendo-icon-size-sm, 0.75rem) s;
+}
+.k-icon-button.k-button-lg > .k-button-icon.k-icon-sm > svg {
+  width: var(--kendo-icon-size-sm, 0.875rem);
+  height: var(--kendo-icon-size-sm, 0.875rem);
+}
+.k-icon-button.k-button-lg > .k-button-icon.k-icon-lg > svg {
+  width: var(--kendo-icon-size-lg, 1.25rem);
+  height: var(--kendo-icon-size-lg, 1.25rem);
+}
+.k-icon-button.k-button-lg > .k-button-icon.k-icon-xl > svg {
+  width: var(--kendo-icon-size-xl, 1.5rem);
+  height: var(--kendo-icon-size-xl, 1.5rem);
+}
+.k-icon-button.k-button-lg > .k-button-icon.k-icon-xxl > svg {
+  width: var(--kendo-icon-size-xxl, 2rem);
+  height: var(--kendo-icon-size-xxl, 2rem);
+}
+.k-icon-button.k-button-lg > .k-button-icon.k-icon-xxxl > svg {
+  width: var(--kendo-icon-size-xxl, 3rem);
+  height: var(--kendo-icon-size-xxl, 3rem);
 }
 
 .k-icon-button {
@@ -29171,6 +29268,51 @@ textarea.k-input-inner {
   justify-content: center;
 }
 
+.k-input-icon.k-svg-icon > svg, .k-input-icon.k-icon-md > svg,
+.k-input-validation-icon.k-svg-icon > svg,
+.k-input-validation-icon.k-icon-md > svg,
+.k-input-loading-icon.k-svg-icon > svg,
+.k-input-loading-icon.k-icon-md > svg {
+  width: var(--kendo-icon-size-md, 1rem);
+  height: var(--kendo-icon-size-md, 1rem);
+}
+.k-input-icon.k-icon-xs > svg,
+.k-input-validation-icon.k-icon-xs > svg,
+.k-input-loading-icon.k-icon-xs > svg {
+  width: var(--kendo-icon-size-sm, 0.75rem);
+  height: var(--kendo-icon-size-sm, 0.75rem) s;
+}
+.k-input-icon.k-icon-sm > svg,
+.k-input-validation-icon.k-icon-sm > svg,
+.k-input-loading-icon.k-icon-sm > svg {
+  width: var(--kendo-icon-size-sm, 0.875rem);
+  height: var(--kendo-icon-size-sm, 0.875rem);
+}
+.k-input-icon.k-icon-lg > svg,
+.k-input-validation-icon.k-icon-lg > svg,
+.k-input-loading-icon.k-icon-lg > svg {
+  width: var(--kendo-icon-size-lg, 1.25rem);
+  height: var(--kendo-icon-size-lg, 1.25rem);
+}
+.k-input-icon.k-icon-xl > svg,
+.k-input-validation-icon.k-icon-xl > svg,
+.k-input-loading-icon.k-icon-xl > svg {
+  width: var(--kendo-icon-size-xl, 1.5rem);
+  height: var(--kendo-icon-size-xl, 1.5rem);
+}
+.k-input-icon.k-icon-xxl > svg,
+.k-input-validation-icon.k-icon-xxl > svg,
+.k-input-loading-icon.k-icon-xxl > svg {
+  width: var(--kendo-icon-size-xxl, 2rem);
+  height: var(--kendo-icon-size-xxl, 2rem);
+}
+.k-input-icon.k-icon-xxxl > svg,
+.k-input-validation-icon.k-icon-xxxl > svg,
+.k-input-loading-icon.k-icon-xxxl > svg {
+  width: var(--kendo-icon-size-xxl, 3rem);
+  height: var(--kendo-icon-size-xxl, 3rem);
+}
+
 .k-clear-value {
   width: var(--INTERNAL--kendo-input-icon-size, min-content);
   height: var(--INTERNAL--kendo-input-icon-size, min-content);
@@ -29241,8 +29383,8 @@ textarea.k-input-inner {
   position: relative;
   aspect-ratio: auto;
 }
-.k-input-spinner .k-spinner-increase > .k-button-icon,
-.k-input-spinner .k-spinner-decrease > .k-button-icon {
+.k-input-spinner .k-spinner-increase .k-button-icon,
+.k-input-spinner .k-spinner-decrease .k-button-icon {
   margin: -1em 0;
   min-width: auto !important;
   min-height: auto !important;
@@ -32088,7 +32230,8 @@ textarea.k-input-inner {
 .k-colorgradient-color-contrast .k-contrast-validation .k-icon {
   vertical-align: middle;
 }
-.k-colorgradient-color-contrast .k-contrast-validation .k-icon + .k-icon {
+.k-colorgradient-color-contrast .k-contrast-validation .k-icon + .k-icon,
+.k-colorgradient-color-contrast .k-contrast-validation .k-icon-wrapper-host + .k-icon-wrapper-host .k-icon {
   margin-inline-start: -13px;
 }
 
@@ -38579,6 +38722,7 @@ kendo-card-footer {
   border-color: inherit;
 }
 .k-grid .k-table-th,
+.k-grid td,
 .k-grid .k-table-td {
   border-width: 0;
   padding-inline: var(--INTERNAL--kendo-grid-cell-padding-x, 0);
@@ -38594,14 +38738,17 @@ kendo-card-footer {
   box-sizing: content-box;
 }
 .k-grid .k-table-th:first-child,
+.k-grid td:first-child,
 .k-grid .k-table-td:first-child {
   border-inline-start-width: 0;
 }
 .k-grid .k-table-th:focus,
+.k-grid td:focus,
 .k-grid .k-table-td:focus {
   outline: none;
 }
 .k-grid .k-table-th .k-placeholder-line,
+.k-grid td .k-placeholder-line,
 .k-grid .k-table-td .k-placeholder-line {
   width: var(--kendo-grid-cell-placeholder-width, 80%);
 }
@@ -38609,6 +38756,10 @@ kendo-card-footer {
 .k-grid .k-table-th > .k-radio-wrap,
 .k-grid .k-table-th > .k-checkbox,
 .k-grid .k-table-th > .k-checkbox-wrap,
+.k-grid td > .k-radio,
+.k-grid td > .k-radio-wrap,
+.k-grid td > .k-checkbox,
+.k-grid td > .k-checkbox-wrap,
 .k-grid .k-table-td > .k-radio,
 .k-grid .k-table-td > .k-radio-wrap,
 .k-grid .k-table-td > .k-checkbox,
@@ -38622,6 +38773,7 @@ kendo-card-footer {
   border-inline-start-width: var(--kendo-grid-header-border-width-x, 0);
   white-space: nowrap;
 }
+.k-grid td,
 .k-grid .k-table-td {
   border-block-end-width: var(--kendo-grid-cell-border-width-y, 1px);
   border-inline-start-width: var(--kendo-grid-cell-border-width-x, 0px);
@@ -38648,10 +38800,12 @@ kendo-card-footer {
   align-items: center;
   align-content: center;
 }
+.k-grid .k-grouping-row td,
 .k-grid .k-grouping-row .k-table-td {
   border-block-end-width: 0;
   overflow: visible;
 }
+.k-grid .k-grouping-row + .k-table-row td,
 .k-grid .k-grouping-row + .k-table-row .k-table-td {
   border-top-width: var(--kendo-grid-grouping-row-border-width-y, 1px);
 }
@@ -38666,11 +38820,13 @@ kendo-card-footer {
   margin-inline-end: calc(var(--kendo-icon-size, 1rem)/2);
   text-decoration: none;
 }
+.k-grid .k-group-footer td,
 .k-grid .k-group-footer .k-table-td {
   border-style: solid;
   border-inline-width: var(--kendo-grid-group-footer-border-width-x, 0px);
   border-block-start-width: var(--kendo-grid-group-footer-border-width-y, 0px);
 }
+.k-grid .k-group-footer .k-group-cell + td,
 .k-grid .k-group-footer .k-group-cell + .k-table-td {
   border-inline-start-width: var(--kendo-grid-group-footer-border-width-x, 0px);
 }
@@ -38930,13 +39086,17 @@ div.k-grid-footer {
 .k-grid-footer {
   border-block-start-width: var(--kendo-grid-border-width, 1px);
 }
+.k-grid-footer td,
 .k-grid-footer .k-table-td {
   height: var(--kendo-line-height-em, normal);
   border-block-end-width: 0;
 }
 
+.k-grid-footer td,
 .k-grid-footer .k-table-td,
 .k-grid-header .k-table-th,
+.k-group-footer td,
+.k-grouping-row td,
 .k-group-footer .k-table-td,
 .k-grouping-row .k-table-td {
   font-weight: var(--kendo-grid-header-font-weight, var(--kendo-font-weight-bold, normal));
@@ -38958,6 +39118,7 @@ div.k-grid-footer {
 .k-filter-row {
   line-height: var(--kendo-line-height, normal);
 }
+.k-filter-row td,
 .k-filter-row .k-table-td,
 .k-filter-row .k-table-th {
   padding-inline: var(--INTERNAL--kendo-grid-filter-cell-padding-x, 0);
@@ -38965,6 +39126,7 @@ div.k-grid-footer {
   border-width: 0 0 var(--kendo-grid-cell-border-width-y, 1px) var(--kendo-grid-cell-border-width-x, 0px);
   white-space: nowrap;
 }
+.k-filter-row td:first-child,
 .k-filter-row .k-table-td:first-child {
   border-left-width: 0;
 }
@@ -39007,7 +39169,9 @@ div.k-grid-footer {
   border-color: inherit;
   outline: 0;
 }
+.k-grid-content .k-table-row:last-child > td,
 .k-grid-content .k-table-row:last-child > .k-table-td,
+.k-grid-content-locked .k-table-row:last-child > td,
 .k-grid-content-locked .k-table-row:last-child > .k-table-td {
   border-bottom-width: 0;
 }
@@ -39032,20 +39196,24 @@ div.k-grid-footer {
   border-inline-end-width: var(--kendo-grid-border-width, 1px);
 }
 
+.k-master-row.k-expanded td,
 .k-master-row.k-expanded .k-table-td {
   border-block-end-width: 0;
 }
 
+.k-master-row:has(.k-hierarchy-cell[aria-expanded=true]) td,
 .k-master-row:has(.k-hierarchy-cell[aria-expanded=true]) .k-table-td {
   border-block-end-width: 0;
 }
 
+.k-master-row:last-child td,
 .k-master-row:last-child .k-table-td {
   border-block-end-width: var(--kendo-grid-border-width, 1px);
 }
 
 .k-grid .k-edit-cell,
 .k-grid .k-command-cell,
+.k-grid .k-grid-edit-row td,
 .k-grid .k-grid-edit-row .k-table-td {
   padding-inline: var(--INTERNAL--kendo-grid-edit-cell-padding-x, 0);
   padding-block: var(--INTERNAL--kendo-grid-edit-cell-padding-y, 0);
@@ -39055,6 +39223,9 @@ div.k-grid-footer {
 .k-grid .k-edit-cell > input:not([type=checkbox]):not([type=radio]),
 .k-grid .k-edit-cell > select,
 .k-grid .k-edit-cell > .k-widget:not(.k-switch),
+.k-grid .k-grid-edit-row td > input:not([type=checkbox]):not([type=radio]),
+.k-grid .k-grid-edit-row td > select,
+.k-grid .k-grid-edit-row td > .k-widget:not(.k-switch),
 .k-grid .k-grid-edit-row .k-table-td > input:not([type=checkbox]):not([type=radio]),
 .k-grid .k-grid-edit-row .k-table-td > select,
 .k-grid .k-grid-edit-row .k-table-td > .k-widget:not(.k-switch) {
@@ -39066,6 +39237,10 @@ div.k-grid-footer {
 .k-grid .k-edit-cell > .k-checkbox,
 .k-grid .k-edit-cell > .k-radio-wrap,
 .k-grid .k-edit-cell > .k-checkbox-wrap,
+.k-grid .k-grid-edit-row td > .k-radio,
+.k-grid .k-grid-edit-row td > .k-checkbox,
+.k-grid .k-grid-edit-row td > .k-radio-wrap,
+.k-grid .k-grid-edit-row td > .k-checkbox-wrap,
 .k-grid .k-grid-edit-row .k-table-td > .k-radio,
 .k-grid .k-grid-edit-row .k-table-td > .k-checkbox,
 .k-grid .k-grid-edit-row .k-table-td > .k-radio-wrap,
@@ -39107,17 +39282,17 @@ div.k-grid-footer {
 }
 
 .k-grid-virtual .k-grid-content .k-grid-table-wrap {
-  float: inline-start;
+  float: left;
   width: 100%;
 }
 .k-grid-virtual .k-grid-content .k-grid-table {
   position: relative;
-  float: inline-start;
+  float: left;
   z-index: 1;
 }
 .k-grid-virtual .k-grid-content > .k-height-container {
   position: relative;
-  float: inline-start;
+  float: left;
 }
 .k-grid-virtual .k-grid-content::after {
   content: "";
@@ -39134,6 +39309,7 @@ div.k-grid-footer {
   height: 1px;
 }
 
+.k-grid-add-row td,
 .k-grid-add-row .k-table-td {
   border-bottom-style: solid;
   border-bottom-width: 1px;
@@ -39162,10 +39338,13 @@ div.k-grid-footer {
   border-inline-end-width: 1px;
   box-sizing: content-box;
 }
+.k-grid-content-locked td,
 .k-grid-content-locked .k-table-td,
 .k-grid-content-locked .k-table-th,
+.k-grid-footer-locked td,
 .k-grid-footer-locked .k-table-td,
 .k-grid-footer-locked .k-table-th,
+.k-grid-header-locked td,
 .k-grid-header-locked .k-table-td,
 .k-grid-header-locked .k-table-th {
   border-inline-start-width: 1px;
@@ -39229,6 +39408,7 @@ kendo-grid .k-table-row.k-grid-row-sticky {
   position: static;
   z-index: auto;
 }
+kendo-grid .k-grid-row-sticky td,
 kendo-grid .k-grid-row-sticky .k-table-td {
   border-block-start-width: var(--kendo-grid-border-width, 1px);
   border-block-end-width: var(--kendo-grid-border-width, 1px);
@@ -39236,9 +39416,12 @@ kendo-grid .k-grid-row-sticky .k-table-td {
   top: inherit;
   bottom: inherit;
 }
+kendo-grid .k-grid-row-sticky td,
 kendo-grid .k-grid-row-sticky .k-table-td {
   z-index: 2;
 }
+kendo-grid .k-grid-row-sticky td.k-grid-content-sticky,
+kendo-grid .k-grid-row-sticky.k-alt td.k-grid-content-sticky,
 kendo-grid .k-grid-row-sticky .k-table-td.k-grid-content-sticky,
 kendo-grid .k-grid-row-sticky.k-alt .k-table-td.k-grid-content-sticky {
   z-index: 3;
@@ -39261,9 +39444,11 @@ kendo-grid .k-grid-header .k-grid-header-menu {
 .k-grid .k-grid-footer-sticky {
   border-inline-end-width: var(--kendo-grid-sticky-cell-border-width, 1px);
 }
-.k-grid .k-grid-header-sticky:not([style*="display: none"]) + .k-table-td, .k-grid .k-grid-header-sticky:not([style*="display: none"]) + .k-table-th,
+.k-grid .k-grid-header-sticky:not([style*="display: none"]) + td, .k-grid .k-grid-header-sticky:not([style*="display: none"]) + .k-table-td, .k-grid .k-grid-header-sticky:not([style*="display: none"]) + .k-table-th,
+.k-grid .k-grid-content-sticky:not([style*="display: none"]) + td,
 .k-grid .k-grid-content-sticky:not([style*="display: none"]) + .k-table-td,
 .k-grid .k-grid-content-sticky:not([style*="display: none"]) + .k-table-th,
+.k-grid .k-grid-footer-sticky:not([style*="display: none"]) + td,
 .k-grid .k-grid-footer-sticky:not([style*="display: none"]) + .k-table-td,
 .k-grid .k-grid-footer-sticky:not([style*="display: none"]) + .k-table-th {
   border-inline-start-width: 0;
@@ -39442,7 +39627,7 @@ div.k-grid-norecords {
 }
 
 .k-pdf-export-shadow .k-grid {
-  float: inline-start;
+  float: left;
   width: auto !important;
 }
 .k-pdf-export-shadow .k-grid,
@@ -39533,6 +39718,7 @@ div.k-grid-norecords {
   table-layout: auto !important;
 }
 .k-autofitting .k-table-th,
+.k-autofitting td,
 .k-autofitting .k-table-td {
   white-space: nowrap !important;
 }
@@ -39651,12 +39837,14 @@ div.k-grid-norecords {
 .k-grid-header,
 .k-grid-header-wrap,
 .k-grouping-header,
+.k-grid td,
 .k-grid .k-table-td,
 .k-grid-footer,
 .k-grid-footer-wrap,
 .k-grid-content-locked,
 .k-grid-footer-locked,
 .k-grid-header-locked,
+.k-filter-row > td,
 .k-filter-row > .k-table-td,
 .k-filter-row > .k-table-th {
   border-color: var(--kendo-grid-header-border, var(--kendo-component-border, initial));
@@ -39682,6 +39870,8 @@ div.k-grid-norecords {
   background-color: var(--kendo-grid-bg, var(--kendo-component-bg, initial));
 }
 
+.k-group-footer td,
+.k-grouping-row td,
 .k-group-footer .k-table-td,
 .k-grouping-row .k-table-td,
 .k-table-tbody .k-group-cell {
@@ -39705,24 +39895,36 @@ div.k-grid-norecords {
   color: var(--kendo-grid-hover-text, var(--kendo-hover-text, inherit));
   background-color: var(--kendo-grid-hover-bg, var(--kendo-hover-bg, inherit));
 }
+.k-grid td.k-selected,
+.k-grid .k-table-row.k-selected > td,
 .k-grid .k-table-td.k-selected,
 .k-grid .k-table-row.k-selected > .k-table-td {
   color: var(--kendo-grid-selected-text, var(--kendo-component-text, initial));
   background-color: var(--kendo-grid-selected-bg, var(--kendo-primary-20, inherit));
   border-block-color: var(--kendo-grid-selected-border, var(--kendo-component-border, initial));
 }
+.k-grid .k-table-tbody > .k-table-row:not(.k-detail-row):hover td.k-selected,
+.k-grid .k-table-tbody > .k-table-row:not(.k-detail-row).k-hover.k-selected > td,
 .k-grid .k-table-tbody > .k-table-row:not(.k-detail-row):hover .k-table-td.k-selected,
 .k-grid .k-table-tbody > .k-table-row:not(.k-detail-row).k-hover.k-selected > .k-table-td,
 .k-grid .k-table-tbody > .k-table-row:not(.k-detail-row).k-hover.k-selected,
+.k-grid .k-table-tbody > .k-table-row:not(.k-detail-row).k-hover td.k-selected,
+.k-grid .k-table-tbody > .k-table-row:not(.k-detail-row).k-selected:hover > td,
 .k-grid .k-table-tbody > .k-table-row:not(.k-detail-row).k-hover .k-table-td.k-selected,
 .k-grid .k-table-tbody > .k-table-row:not(.k-detail-row).k-selected:hover > .k-table-td {
   color: var(--kendo-grid-selected-hover-text, var(--kendo-component-text, initial));
   background-color: var(--kendo-grid-selected-hover-bg, var(--kendo-primary-30, inherit));
 }
+.k-grid td:focus,
+.k-grid td.k-focus,
 .k-grid .k-table-td:focus,
 .k-grid .k-table-td.k-focus,
 .k-grid .k-table-th:focus,
 .k-grid .k-table-th.k-focus,
+.k-grid .k-master-row > td:focus,
+.k-grid .k-grouping-row > td:focus,
+.k-grid .k-detail-row > td:focus,
+.k-grid .k-group-footer > td:focus,
 .k-grid .k-master-row > .k-table-td:focus,
 .k-grid .k-grouping-row > .k-table-td:focus,
 .k-grid .k-detail-row > .k-table-td:focus,
@@ -39749,21 +39951,28 @@ div.k-grid-norecords {
 .k-grid .k-grid-header-locked,
 .k-grid .k-grid-content-locked,
 .k-grid .k-grid-header-locked .k-table-th,
+.k-grid .k-grid-content-locked td,
 .k-grid .k-grid-content-locked .k-table-td {
   border-inline-color: var(--kendo-grid-sticky-header-border, var(--kendo-neutral-90, inherit));
 }
+.k-grid .k-grid-content-locked .k-group-footer td,
 .k-grid .k-grid-content-locked .k-group-footer .k-table-td {
   border-color: var(--kendo-grid-header-border, var(--kendo-component-border, initial));
 }
+.k-grid .k-grid-content-locked .k-grouping-row + .k-table-row td,
 .k-grid .k-grid-content-locked .k-grouping-row + .k-table-row .k-table-td {
   border-top-color: var(--kendo-grid-header-border, var(--kendo-component-border, initial));
 }
+.k-grid .k-grid-content-locked .k-selected td,
 .k-grid .k-grid-content-locked .k-selected .k-table-td {
   background-color: var(--kendo-grid-sticky-selected-bg, var(--kendo-primary-20, inherit));
 }
+.k-grid .k-grid-content-locked .k-selected.k-table-alt-row td,
 .k-grid .k-grid-content-locked .k-selected.k-table-alt-row .k-table-td {
   background-color: var(--kendo-grid-sticky-selected-alt-bg, var(--kendo-primary-20, inherit));
 }
+.k-grid .k-grid-content-locked .k-selected:hover td,
+.k-grid .k-grid-content-locked .k-selected.k-hover td,
 .k-grid .k-grid-content-locked .k-selected:hover .k-table-td,
 .k-grid .k-grid-content-locked .k-selected.k-hover .k-table-td {
   background-color: var(--kendo-grid-sticky-selected-hover-bg, var(--kendo-primary-30, inherit));
@@ -39812,6 +40021,7 @@ col.k-sorted,
   background-color: var(--kendo-selected-bg, inherit);
 }
 .k-grid-header .k-table-th.k-grid-header-sticky,
+.k-grid-header td.k-grid-header-sticky,
 .k-grid-header .k-table-td.k-grid-header-sticky,
 .k-grid-header .k-grid-header-sticky.k-sorted {
   color: var(--kendo-grid-sticky-header-text, var(--kendo-neutral-190, inherit));
@@ -39843,16 +40053,17 @@ col.k-sorted,
   background-color: var(--kendo-grid-sticky-alt-bg, var(--kendo-component-bg, initial));
 }
 .k-master-row.k-selected .k-grid-content-sticky, .k-master-row.k-selected .k-grid-row-sticky,
+.k-master-row td.k-grid-content-sticky.k-selected,
 .k-master-row .k-table-td.k-grid-content-sticky.k-selected {
   background-color: var(--kendo-grid-sticky-selected-bg, var(--kendo-primary-20, inherit));
 }
-.k-master-row.k-selected.k-table-alt-row .k-grid-content-sticky, .k-master-row.k-selected.k-table-alt-row .k-grid-row-sticky, .k-master-row.k-table-alt-row .k-table-td.k-grid-content-sticky.k-selected {
+.k-master-row.k-selected.k-table-alt-row .k-grid-content-sticky, .k-master-row.k-selected.k-table-alt-row .k-grid-row-sticky, .k-master-row.k-table-alt-row td.k-grid-content-sticky.k-selected, .k-master-row.k-table-alt-row .k-table-td.k-grid-content-sticky.k-selected {
   background-color: var(--kendo-grid-sticky-selected-alt-bg, var(--kendo-primary-20, inherit));
 }
 .k-master-row:hover .k-grid-content-sticky, .k-master-row:hover .k-grid-row-sticky, .k-master-row.k-hover .k-grid-content-sticky, .k-master-row.k-hover .k-grid-row-sticky {
   background-color: var(--kendo-grid-sticky-hover-bg, var(--kendo-hover-bg, inherit));
 }
-.k-master-row.k-selected:hover .k-grid-content-sticky, .k-master-row.k-selected:hover .k-grid-row-sticky, .k-master-row.k-selected.k-hover .k-grid-content-sticky, .k-master-row.k-selected.k-hover .k-grid-row-sticky, .k-master-row:hover .k-table-td.k-grid-content-sticky.k-selected, .k-master-row.k-hover .k-table-td.k-grid-content-sticky.k-selected {
+.k-master-row.k-selected:hover .k-grid-content-sticky, .k-master-row.k-selected:hover .k-grid-row-sticky, .k-master-row.k-selected.k-hover .k-grid-content-sticky, .k-master-row.k-selected.k-hover .k-grid-row-sticky, .k-master-row:hover td.k-grid-content-sticky.k-selected, .k-master-row.k-hover td.k-grid-content-sticky.k-selected, .k-master-row:hover .k-table-td.k-grid-content-sticky.k-selected, .k-master-row.k-hover .k-table-td.k-grid-content-sticky.k-selected {
   background-color: var(--kendo-grid-sticky-selected-hover-bg, var(--kendo-primary-30, inherit));
 }
 
@@ -39864,30 +40075,39 @@ kendo-grid.k-grid .k-grid-content-sticky {
 kendo-grid.k-grid .k-grid-content-sticky:hover, kendo-grid.k-grid .k-grid-content-sticky.k-hover {
   background-color: var(--kendo-grid-sticky-hover-bg, var(--kendo-hover-bg, inherit));
 }
+kendo-grid.k-grid .k-grid-row-sticky td,
 kendo-grid.k-grid .k-grid-row-sticky .k-table-td {
   border-block-color: var(--kendo-grid-sticky-border, var(--kendo-neutral-90, inherit));
   background-color: var(--kendo-grid-sticky-bg, var(--kendo-component-bg, initial));
 }
-kendo-grid.k-grid .k-grid-row-sticky:hover .k-table-td, kendo-grid.k-grid .k-grid-row-sticky.k-hover .k-table-td {
+kendo-grid.k-grid .k-grid-row-sticky:hover td, kendo-grid.k-grid .k-grid-row-sticky.k-hover td, kendo-grid.k-grid .k-grid-row-sticky:hover .k-table-td, kendo-grid.k-grid .k-grid-row-sticky.k-hover .k-table-td {
   background-color: var(--kendo-grid-sticky-hover-bg, var(--kendo-hover-bg, inherit));
 }
 kendo-grid.k-grid .k-table-alt-row .k-grid-content-sticky,
+kendo-grid.k-grid .k-grid-row-sticky.k-table-alt-row td,
 kendo-grid.k-grid .k-grid-row-sticky.k-table-alt-row .k-table-td {
   background-color: var(--kendo-grid-sticky-alt-bg, var(--kendo-component-bg, initial));
 }
 kendo-grid.k-grid .k-table-row.k-selected .k-grid-content-sticky,
+kendo-grid.k-grid .k-selected.k-grid-row-sticky td,
+kendo-grid.k-grid .k-grid-row-sticky td.k-selected,
 kendo-grid.k-grid .k-selected.k-grid-row-sticky .k-table-td,
 kendo-grid.k-grid .k-grid-row-sticky .k-table-td.k-selected,
 kendo-grid.k-grid .k-selected.k-grid-content-sticky {
   background-color: var(--kendo-grid-sticky-selected-bg, var(--kendo-primary-20, inherit));
 }
 kendo-grid.k-grid .k-table-row.k-selected.k-table-alt-row .k-grid-content-sticky,
+kendo-grid.k-grid .k-selected.k-table-alt-row.k-grid-row-sticky td,
 kendo-grid.k-grid .k-selected.k-table-alt-row.k-grid-row-sticky .k-table-td,
 kendo-grid.k-grid .k-table-alt-row .k-selected.k-grid-content-sticky {
   background-color: var(--kendo-grid-sticky-selected-alt-bg, var(--kendo-primary-20, inherit));
 }
 kendo-grid.k-grid .k-table-row:hover .k-grid-content-sticky,
 kendo-grid.k-grid .k-table-row.k-hover .k-grid-content-sticky,
+kendo-grid.k-grid .k-grid-row-sticky:hover td,
+kendo-grid.k-grid .k-grid-row-sticky.k-hover td,
+kendo-grid.k-grid .k-grid-row-sticky.k-table-alt-row:hover td,
+kendo-grid.k-grid .k-grid-row-sticky.k-table-alt-row.k-hover td,
 kendo-grid.k-grid .k-grid-row-sticky:hover .k-table-td,
 kendo-grid.k-grid .k-grid-row-sticky.k-hover .k-table-td,
 kendo-grid.k-grid .k-grid-row-sticky.k-table-alt-row:hover .k-table-td,
@@ -39898,12 +40118,18 @@ kendo-grid.k-grid .k-table-alt-row.k-hover .k-grid-content-sticky {
 }
 kendo-grid.k-grid .k-table-row.k-selected:hover .k-grid-content-sticky,
 kendo-grid.k-grid .k-table-row.k-selected.k-hover .k-grid-content-sticky,
+kendo-grid.k-grid .k-selected.k-grid-row-sticky:hover td,
+kendo-grid.k-grid .k-selected.k-grid-row-sticky.k-hover td,
+kendo-grid.k-grid .k-selected.k-table-alt-row.k-grid-row-sticky:hover td,
+kendo-grid.k-grid .k-selected.k-table-alt-row.k-grid-row-sticky.k-hover td,
 kendo-grid.k-grid .k-selected.k-grid-row-sticky:hover .k-table-td,
 kendo-grid.k-grid .k-selected.k-grid-row-sticky.k-hover .k-table-td,
 kendo-grid.k-grid .k-selected.k-table-alt-row.k-grid-row-sticky:hover .k-table-td,
 kendo-grid.k-grid .k-selected.k-table-alt-row.k-grid-row-sticky.k-hover .k-table-td,
 kendo-grid.k-grid .k-table-row.k-selected.k-table-alt-row:hover .k-grid-content-sticky,
 kendo-grid.k-grid .k-table-row.k-selected.k-table-alt-row.k-hover .k-grid-content-sticky,
+kendo-grid.k-grid .k-grid-row-sticky:hover td.k-selected,
+kendo-grid.k-grid .k-grid-row-sticky.k-hover td.k-selected,
 kendo-grid.k-grid .k-grid-row-sticky:hover .k-table-td.k-selected,
 kendo-grid.k-grid .k-grid-row-sticky.k-hover .k-table-td.k-selected,
 kendo-grid.k-grid .k-table-row:hover .k-grid-content-sticky.k-selected,

package/lib/swatches/all.json

@@ -3,7 +3,7 @@
     "name": "All",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "5.12.1-dev.3",
+    "version": "6.0.0",
     "api": "modern",
     "previewColors": [
         "#ffffff",

package/lib/swatches/fluent-main.json

@@ -3,7 +3,7 @@
     "name": "Fluent Main",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "5.12.1-dev.3",
+    "version": "6.0.0",
     "api": "modern",
     "previewColors": [
         "#ffffff",

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-theme-fluent",
   "description": "A css variables based theme for Kendo UI that follows the Fluent design system guidelines.",
-  "version": "5.12.1-dev.3",
+  "version": "6.0.0",
   "author": "Progress",
   "license": "Apache-2.0",
   "keywords": [
@@ -50,8 +50,8 @@
   },
   "dependencies": {
     "@progress/kendo-font-icons": "^1.0.0",
-    "@progress/kendo-theme-core": "^5.12.1-dev.3",
-    "@progress/kendo-theme-utils": "^5.12.1-dev.3"
+    "@progress/kendo-theme-core": "^6.0.0",
+    "@progress/kendo-theme-utils": "^6.0.0"
   },
-  "gitHead": "8c82f49a750901799f12f09ca977f65b74ff9577"
+  "gitHead": "55db62ccac1c6dfee205ade579d703e3989d1f64"
 }

package/scss/button/_layout.scss

@@ -94,6 +94,45 @@
             > .k-button-icon {
                 min-width: calc( #{$_font-size} * #{$_line-height} );
                 min-height: calc( #{$_font-size} * #{$_line-height} );
+                display: inline-flex;
+                align-items: center;
+                justify-content: center;
+
+                &.k-svg-icon > svg,
+                &.k-icon-md > svg {
+                    width: var( --kendo-icon-size-md, 1rem );
+                    height: var( --kendo-icon-size-md, 1rem );
+                }
+
+                &.k-icon-xs > svg {
+                    width: var( --kendo-icon-size-sm, 0.75rem );
+                    height: var( --kendo-icon-size-sm, 0.75rem )s;
+                }
+
+                &.k-icon-sm > svg {
+                    width: var( --kendo-icon-size-sm, 0.875rem );
+                    height: var( --kendo-icon-size-sm, 0.875rem );
+                }
+
+                &.k-icon-lg > svg {
+                    width: var( --kendo-icon-size-lg, 1.25rem );
+                    height: var( --kendo-icon-size-lg, 1.25rem );
+                }
+
+                &.k-icon-xl > svg {
+                    width: var( --kendo-icon-size-xl, 1.5rem );
+                    height: var( --kendo-icon-size-xl, 1.5rem );
+                }
+
+                &.k-icon-xxl > svg {
+                    width: var( --kendo-icon-size-xxl, 2rem );
+                    height: var( --kendo-icon-size-xxl, 2rem );
+                }
+
+                &.k-icon-xxxl > svg {
+                    width: var( --kendo-icon-size-xxl, 3rem );
+                    height: var( --kendo-icon-size-xxl, 3rem );
+                }
             }
         }
     }

package/scss/colorgradient/_layout.scss

@@ -173,7 +173,8 @@
             }
 
             // Needed for the double check icons
-            .k-icon + .k-icon {
+            .k-icon + .k-icon,
+            .k-icon-wrapper-host + .k-icon-wrapper-host .k-icon {
                 margin-inline-start: -13px;
             }
         }

package/scss/grid/_layout.scss

@@ -66,6 +66,7 @@
         }
 
         .k-table-th,
+        td,
         .k-table-td {
             border-width: 0;
             padding-inline: var( --INTERNAL--kendo-grid-cell-padding-x, 0 );
@@ -108,6 +109,7 @@
             white-space: nowrap;
         }
 
+        td,
         .k-table-td {
             border-block-end-width: var( --kendo-grid-cell-border-width-y, #{$kendo-grid-cell-border-width-y} );
             border-inline-start-width: var( --kendo-grid-cell-border-width-x, #{$kendo-grid-cell-border-width-x} );
@@ -140,11 +142,13 @@
             align-content: center;
         }
 
+        .k-grouping-row td,
         .k-grouping-row .k-table-td {
             border-block-end-width: 0;
             overflow: visible;
         }
 
+        .k-grouping-row + .k-table-row td,
         .k-grouping-row + .k-table-row .k-table-td {
             border-top-width: var( --kendo-grid-grouping-row-border-width-y, #{$kendo-grid-grouping-row-border-width-y} );
         }
@@ -162,11 +166,14 @@
             text-decoration: none;
         }
 
+        .k-group-footer td,
         .k-group-footer .k-table-td {
             border-style: solid;
             border-inline-width: var( --kendo-grid-group-footer-border-width-x, #{$kendo-grid-group-footer-border-width-x} );
             border-block-start-width: var( --kendo-grid-group-footer-border-width-y, #{$kendo-grid-group-footer-border-width-y} );
         }
+
+        .k-group-footer .k-group-cell + td,
         .k-group-footer .k-group-cell + .k-table-td {
             border-inline-start-width: var( --kendo-grid-group-footer-border-width-x, #{$kendo-grid-group-footer-border-width-x} );
         }
@@ -466,14 +473,18 @@
     .k-grid-footer {
         border-block-start-width: var( --kendo-grid-border-width, #{$kendo-grid-border-width} );
 
+        td,
         .k-table-td {
             height: var( --kendo-line-height-em, normal );
             border-block-end-width: 0;
         }
     }
 
+    .k-grid-footer td,
     .k-grid-footer .k-table-td,
     .k-grid-header .k-table-th,
+    .k-group-footer td,
+    .k-grouping-row td,
     .k-group-footer .k-table-td,
     .k-grouping-row .k-table-td {
         font-weight: var( --kendo-grid-header-font-weight, #{$kendo-grid-header-font-weight} );
@@ -497,6 +508,7 @@
     .k-filter-row {
         line-height: $kendo-form-line-height;
 
+        td,
         .k-table-td,
         .k-table-th {
             padding-inline: var( --INTERNAL--kendo-grid-filter-cell-padding-x, 0 );
@@ -505,6 +517,7 @@
             white-space: nowrap;
         }
 
+        td:first-child,
         .k-table-td:first-child {
             border-left-width: 0;
         }
@@ -552,6 +565,7 @@
         border-color: inherit;
         outline: 0;
 
+        .k-table-row:last-child > td,
         .k-table-row:last-child > .k-table-td {
             border-bottom-width: 0;
         }
@@ -579,14 +593,17 @@
         border-inline-end-width: var( --kendo-grid-border-width, #{$kendo-grid-border-width} );
     }
 
+    .k-master-row.k-expanded td,
     .k-master-row.k-expanded .k-table-td {
         border-block-end-width: 0;
     }
 
+    .k-master-row:has(.k-hierarchy-cell[aria-expanded="true"]) td,
     .k-master-row:has(.k-hierarchy-cell[aria-expanded="true"]) .k-table-td {
         border-block-end-width: 0;
     }
 
+    .k-master-row:last-child td,
     .k-master-row:last-child .k-table-td {
         border-block-end-width: var( --kendo-grid-border-width, #{$kendo-grid-border-width} );
     }
@@ -596,6 +613,7 @@
     // Edit row
     .k-grid .k-edit-cell,
     .k-grid .k-command-cell,
+    .k-grid .k-grid-edit-row td,
     .k-grid .k-grid-edit-row .k-table-td {
         padding-inline: var( --INTERNAL--kendo-grid-edit-cell-padding-x, 0 );
         padding-block: var( --INTERNAL--kendo-grid-edit-cell-padding-y, 0 );
@@ -603,6 +621,7 @@
     }
 
     .k-grid .k-edit-cell,
+    .k-grid .k-grid-edit-row td,
     .k-grid .k-grid-edit-row .k-table-td {
 
         > input:not([type="checkbox"]):not([type="radio"]),
@@ -659,19 +678,19 @@
 
     .k-grid-virtual .k-grid-content {
         .k-grid-table-wrap {
-            float: inline-start;
+            float: left;
             width: 100%;
         }
 
         .k-grid-table {
             position: relative;
-            float: inline-start;
+            float: left;
             z-index: 1;
         }
 
         > .k-height-container {
             position: relative;
-            float: inline-start;
+            float: left;
         }
 
         &::after {
@@ -690,6 +709,7 @@
         height: 1px;
     }
 
+    .k-grid-add-row td,
     .k-grid-add-row .k-table-td {
         border-bottom-style: solid;
         border-bottom-width: 1px;
@@ -720,6 +740,7 @@
         border-inline-end-width: 1px;
         box-sizing: content-box;
 
+        td,
         .k-table-td,
         .k-table-th {
             border-inline-start-width: 1px;
@@ -777,6 +798,7 @@
             z-index: auto;
         }
 
+        .k-grid-row-sticky td,
         .k-grid-row-sticky .k-table-td {
             border-block-start-width: var( --kendo-grid-border-width, #{$kendo-grid-border-width} );
             border-block-end-width: var( --kendo-grid-border-width, #{$kendo-grid-border-width} );
@@ -785,10 +807,13 @@
             bottom: inherit;
         }
 
+        .k-grid-row-sticky td,
         .k-grid-row-sticky .k-table-td {
             z-index: 2;
         }
 
+        .k-grid-row-sticky td.k-grid-content-sticky,
+        .k-grid-row-sticky.k-alt td.k-grid-content-sticky,
         .k-grid-row-sticky .k-table-td.k-grid-content-sticky,
         .k-grid-row-sticky.k-alt .k-table-td.k-grid-content-sticky {
             z-index: 3;
@@ -815,6 +840,7 @@
     .k-grid .k-grid-footer-sticky {
         border-inline-end-width: var( --kendo-grid-sticky-cell-border-width, #{$kendo-grid-sticky-cell-border-width} );
 
+        &:not([style*="display: none"]) + td,
         &:not([style*="display: none"]) + .k-table-td,
         &:not([style*="display: none"]) + .k-table-th {
             border-inline-start-width: 0;
@@ -1017,7 +1043,7 @@
     // Remove Grid scrollbar during built-in export
     .k-pdf-export-shadow {
         .k-grid {
-            float: inline-start;
+            float: left;
             width: auto !important; // sass-lint:disable-line no-important
         }
 
@@ -1125,6 +1151,7 @@
         table-layout: auto !important;
 
         .k-table-th,
+        td,
         .k-table-td {
             white-space: nowrap !important;
         }

package/scss/grid/_theme.scss

@@ -10,12 +10,14 @@
     .k-grid-header,
     .k-grid-header-wrap,
     .k-grouping-header,
+    .k-grid td,
     .k-grid .k-table-td,
     .k-grid-footer,
     .k-grid-footer-wrap,
     .k-grid-content-locked,
     .k-grid-footer-locked,
     .k-grid-header-locked,
+    .k-filter-row > td,
     .k-filter-row > .k-table-td,
     .k-filter-row > .k-table-th {
         @include fill(
@@ -48,6 +50,8 @@
         @include fill( $bg: var( --kendo-grid-bg, #{$kendo-grid-bg} ) );
     }
 
+    .k-group-footer td,
+    .k-grouping-row td,
     .k-group-footer .k-table-td,
     .k-grouping-row .k-table-td,
     .k-table-tbody .k-group-cell {
@@ -85,6 +89,8 @@
         }
 
         // Selected state
+        td.k-selected,
+        .k-table-row.k-selected > td,
         .k-table-td.k-selected,
         .k-table-row.k-selected > .k-table-td {
             @include fill(
@@ -95,9 +101,13 @@
         }
 
         // Selected hover state
+        .k-table-tbody > .k-table-row:not(.k-detail-row):hover td.k-selected,
+        .k-table-tbody > .k-table-row:not(.k-detail-row).k-hover.k-selected > td,
         .k-table-tbody > .k-table-row:not(.k-detail-row):hover .k-table-td.k-selected,
         .k-table-tbody > .k-table-row:not(.k-detail-row).k-hover.k-selected > .k-table-td,
         .k-table-tbody > .k-table-row:not(.k-detail-row).k-hover.k-selected,
+        .k-table-tbody > .k-table-row:not(.k-detail-row).k-hover td.k-selected,
+        .k-table-tbody > .k-table-row:not(.k-detail-row).k-selected:hover > td,
         .k-table-tbody > .k-table-row:not(.k-detail-row).k-hover .k-table-td.k-selected,
         .k-table-tbody > .k-table-row:not(.k-detail-row).k-selected:hover > .k-table-td {
             @include fill(
@@ -107,10 +117,16 @@
         }
 
         // Focused state
+        td:focus,
+        td.k-focus,
         .k-table-td:focus,
         .k-table-td.k-focus,
         .k-table-th:focus,
         .k-table-th.k-focus,
+        .k-master-row > td:focus,
+        .k-grouping-row > td:focus,
+        .k-detail-row > td:focus,
+        .k-group-footer > td:focus,
         .k-master-row > .k-table-td:focus,
         .k-grouping-row > .k-table-td:focus,
         .k-detail-row > .k-table-td:focus,
@@ -147,29 +163,36 @@
         .k-grid-header-locked,
         .k-grid-content-locked,
         .k-grid-header-locked .k-table-th,
+        .k-grid-content-locked td,
         .k-grid-content-locked .k-table-td {
             border-inline-color: var( --kendo-grid-sticky-header-border, #{$kendo-grid-sticky-header-border} );
         }
 
         .k-grid-content-locked {
+            .k-group-footer td,
             .k-group-footer .k-table-td {
                 @include fill( $border: var( --kendo-grid-header-border, #{$kendo-grid-header-border} ) );
             }
 
+            .k-grouping-row + .k-table-row td,
             .k-grouping-row + .k-table-row .k-table-td {
                 border-top-color: var( --kendo-grid-header-border, #{$kendo-grid-header-border} );
             }
 
             // Selected state
+            .k-selected td,
             .k-selected .k-table-td {
                 @include fill( $bg: var( --kendo-grid-sticky-selected-bg, #{$kendo-grid-sticky-selected-bg} ) );
             }
 
+            .k-selected.k-table-alt-row td,
             .k-selected.k-table-alt-row .k-table-td {
                 @include fill( $bg: var( --kendo-grid-sticky-selected-alt-bg, #{$kendo-grid-sticky-selected-alt-bg} ) );
             }
 
             // Selected hover
+            .k-selected:hover td,
+            .k-selected.k-hover td,
             .k-selected:hover .k-table-td,
             .k-selected.k-hover .k-table-td {
                 @include fill( $bg: var( --kendo-grid-sticky-selected-hover-bg, #{$kendo-grid-sticky-selected-hover-bg} ) );
@@ -225,6 +248,7 @@
         }
 
         .k-table-th.k-grid-header-sticky,
+        td.k-grid-header-sticky,
         .k-table-td.k-grid-header-sticky,
         .k-grid-header-sticky.k-sorted {
             @include fill(
@@ -272,12 +296,14 @@
         // Selected state
         &.k-selected .k-grid-content-sticky,
         &.k-selected .k-grid-row-sticky,
+        td.k-grid-content-sticky.k-selected,
         .k-table-td.k-grid-content-sticky.k-selected {
             @include fill( $bg: var( --kendo-grid-sticky-selected-bg, #{$kendo-grid-sticky-selected-bg} ) );
         }
 
         &.k-selected.k-table-alt-row .k-grid-content-sticky,
         &.k-selected.k-table-alt-row .k-grid-row-sticky,
+        &.k-table-alt-row td.k-grid-content-sticky.k-selected,
         &.k-table-alt-row .k-table-td.k-grid-content-sticky.k-selected {
             @include fill( $bg: var( --kendo-grid-sticky-selected-alt-bg, #{$kendo-grid-sticky-selected-alt-bg} ) );
         }
@@ -297,6 +323,8 @@
         &.k-selected:hover .k-grid-row-sticky,
         &.k-selected.k-hover .k-grid-content-sticky,
         &.k-selected.k-hover .k-grid-row-sticky,
+        &:hover td.k-grid-content-sticky.k-selected,
+        &.k-hover td.k-grid-content-sticky.k-selected,
         &:hover .k-table-td.k-grid-content-sticky.k-selected,
         &.k-hover .k-table-td.k-grid-content-sticky.k-selected {
             @include fill( $bg: var( --kendo-grid-sticky-selected-hover-bg, #{$kendo-grid-sticky-selected-hover-bg} ) );
@@ -316,11 +344,14 @@
         }
 
         .k-grid-row-sticky {
+            td,
             .k-table-td {
                 border-block-color: var( --kendo-grid-sticky-border, #{$kendo-grid-sticky-border} );
                 background-color: var( --kendo-grid-sticky-bg, #{$kendo-grid-sticky-bg} );
             }
 
+            &:hover td,
+            &.k-hover td,
             &:hover .k-table-td,
             &.k-hover .k-table-td {
                 background-color: var( --kendo-grid-sticky-hover-bg, #{$kendo-grid-sticky-hover-bg} );
@@ -328,12 +359,15 @@
         }
 
         .k-table-alt-row .k-grid-content-sticky,
+        .k-grid-row-sticky.k-table-alt-row td,
         .k-grid-row-sticky.k-table-alt-row .k-table-td {
             @include fill( $bg: var( --kendo-grid-sticky-alt-bg, #{$kendo-grid-sticky-alt-bg} ) );
         }
 
         // Selected state
         .k-table-row.k-selected .k-grid-content-sticky,
+        .k-selected.k-grid-row-sticky td,
+        .k-grid-row-sticky td.k-selected,
         .k-selected.k-grid-row-sticky .k-table-td,
         .k-grid-row-sticky .k-table-td.k-selected,
         .k-selected.k-grid-content-sticky {
@@ -341,6 +375,7 @@
         }
 
         .k-table-row.k-selected.k-table-alt-row .k-grid-content-sticky,
+        .k-selected.k-table-alt-row.k-grid-row-sticky td,
         .k-selected.k-table-alt-row.k-grid-row-sticky .k-table-td,
         .k-table-alt-row .k-selected.k-grid-content-sticky {
             @include fill( $bg: var( --kendo-grid-sticky-selected-alt-bg, #{$kendo-grid-sticky-selected-alt-bg} ) );
@@ -349,6 +384,10 @@
         // Hover state
         .k-table-row:hover .k-grid-content-sticky,
         .k-table-row.k-hover .k-grid-content-sticky,
+        .k-grid-row-sticky:hover td,
+        .k-grid-row-sticky.k-hover td,
+        .k-grid-row-sticky.k-table-alt-row:hover td,
+        .k-grid-row-sticky.k-table-alt-row.k-hover td,
         .k-grid-row-sticky:hover .k-table-td,
         .k-grid-row-sticky.k-hover .k-table-td,
         .k-grid-row-sticky.k-table-alt-row:hover .k-table-td,
@@ -361,12 +400,18 @@
         // Selected + Hover
         .k-table-row.k-selected:hover .k-grid-content-sticky,
         .k-table-row.k-selected.k-hover .k-grid-content-sticky,
+        .k-selected.k-grid-row-sticky:hover td,
+        .k-selected.k-grid-row-sticky.k-hover td,
+        .k-selected.k-table-alt-row.k-grid-row-sticky:hover td,
+        .k-selected.k-table-alt-row.k-grid-row-sticky.k-hover td,
         .k-selected.k-grid-row-sticky:hover .k-table-td,
         .k-selected.k-grid-row-sticky.k-hover .k-table-td,
         .k-selected.k-table-alt-row.k-grid-row-sticky:hover .k-table-td,
         .k-selected.k-table-alt-row.k-grid-row-sticky.k-hover .k-table-td,
         .k-table-row.k-selected.k-table-alt-row:hover .k-grid-content-sticky,
         .k-table-row.k-selected.k-table-alt-row.k-hover .k-grid-content-sticky,
+        .k-grid-row-sticky:hover td.k-selected,
+        .k-grid-row-sticky.k-hover td.k-selected,
         .k-grid-row-sticky:hover .k-table-td.k-selected,
         .k-grid-row-sticky.k-hover .k-table-td.k-selected,
         .k-table-row:hover .k-grid-content-sticky.k-selected,

package/scss/icon/_layout.scss

@@ -7,6 +7,11 @@
 
 @mixin kendo-icon--layout() {
 
+    // kendo-icon-wrapper component
+    .k-icon-wrapper-host {
+        display: contents;
+    }
+
     .k-icon-with-modifier {
         position: relative;
         margin: .25em;

package/scss/input/_layout.scss

@@ -234,6 +234,47 @@
         justify-content: center;
     }
 
+    // Input with SVG icon
+    .k-input-icon,
+    .k-input-validation-icon,
+    .k-input-loading-icon {
+        &.k-svg-icon > svg,
+        &.k-icon-md > svg {
+            width: var( --kendo-icon-size-md, 1rem );
+            height: var( --kendo-icon-size-md, 1rem );
+        }
+
+        &.k-icon-xs > svg {
+            width: var( --kendo-icon-size-sm, 0.75rem );
+            height: var( --kendo-icon-size-sm, 0.75rem )s;
+        }
+
+        &.k-icon-sm > svg {
+            width: var( --kendo-icon-size-sm, 0.875rem );
+            height: var( --kendo-icon-size-sm, 0.875rem );
+        }
+
+        &.k-icon-lg > svg {
+            width: var( --kendo-icon-size-lg, 1.25rem );
+            height: var( --kendo-icon-size-lg, 1.25rem );
+        }
+
+        &.k-icon-xl > svg {
+            width: var( --kendo-icon-size-xl, 1.5rem );
+            height: var( --kendo-icon-size-xl, 1.5rem );
+        }
+
+        &.k-icon-xxl > svg {
+            width: var( --kendo-icon-size-xxl, 2rem );
+            height: var( --kendo-icon-size-xxl, 2rem );
+        }
+
+        &.k-icon-xxxl > svg {
+            width: var( --kendo-icon-size-xxl, 3rem );
+            height: var( --kendo-icon-size-xxl, 3rem );
+        }
+    }
+
 
     // // Clear value
     .k-clear-value {
@@ -308,7 +349,7 @@
             position: relative;
             aspect-ratio: auto;
 
-            > .k-button-icon {
+            .k-button-icon {
                 margin: -1em 0;
                 min-width: auto !important; // sass-lint:disable-line no-important
                 min-height: auto !important; // sass-lint:disable-line no-important