@progress/kendo-theme-default 5.3.2-dev.2 → 5.4.0

package/dist/all.css

@@ -11159,7 +11159,7 @@ kendo-sortable {
 }
 
 .k-checkbox.k-invalid {
-    border-color: rgba(243, 23, 0, 0.5);
+    border-color: #f31700;
 }
 
 .k-checkbox.k-invalid + .k-checkbox-label {
@@ -13647,7 +13647,7 @@ textarea.k-input-inner {
 .k-input-button {
     width: calc(1.4285714286em + 8px);
     border-width: 0;
-    border-inline-start-width: 0px;
+    border-inline-start-width: 1px;
     flex: none;
     aspect-ratio: auto;
     box-shadow: none;
@@ -13677,7 +13677,7 @@ textarea.k-input-inner {
 .k-input-spinner .k-spinner-increase,
 .k-input-spinner .k-spinner-decrease {
     border-width: 0;
-    border-inline-start-width: 0px;
+    border-inline-start-width: 1px;
     flex: 1 1 50%;
     box-shadow: none;
     position: relative;
@@ -13726,20 +13726,28 @@ textarea.k-input-inner {
     border-radius: 0 !important;
     border-width: 1px 0;
     border-top-color: transparent !important;
-    background: none !important;
+    background-image: none !important;
 }
 
-.k-input-flat .k-input-inner,
-.k-picker-flat .k-input-inner {
-    padding-left: 0 !important;
-    padding-right: 0 !important;
+.k-input-flat:focus, .k-input-flat.k-focus,
+.k-picker-flat:focus,
+.k-picker-flat.k-focus {
+    border-radius: 4px 4px 0px 0px !important;
 }
 
-.k-input-outline,
-.k-picker-outline {
+.k-input-flat:focus-within,
+.k-picker-flat:focus-within {
+    border-radius: 4px 4px 0px 0px !important;
+}
+
+.k-input-outline {
     background: none !important;
 }
 
+.k-picker.k-picker-flat {
+    border-radius: 4px 4px 0px 0px !important;
+}
+
 .k-input-sm,
 .k-picker-sm {
     font-size: 14px;
@@ -13980,7 +13988,7 @@ textarea.k-input-inner {
 }
 
 .k-input.k-invalid, .k-input.ng-invalid.ng-touched, .k-input.ng-invalid.ng-dirty {
-    border-color: rgba(243, 23, 0, 0.5);
+    border-color: #f31700;
 }
 
 .k-input.k-invalid .k-input-validation-icon, .k-input.ng-invalid.ng-touched .k-input-validation-icon, .k-input.ng-invalid.ng-dirty .k-input-validation-icon {
@@ -14007,13 +14015,109 @@ textarea.k-input-inner {
 }
 
 .k-picker.k-invalid, .k-picker.ng-invalid.ng-touched, .k-picker.ng-invalid.ng-dirty {
-    border-color: rgba(243, 23, 0, 0.5);
+    border-color: #f31700;
 }
 
 .k-picker.k-invalid .k-input-validation-icon, .k-picker.ng-invalid.ng-touched .k-input-validation-icon, .k-picker.ng-invalid.ng-dirty .k-input-validation-icon {
     color: #f31700;
 }
 
+.k-input-outline {
+    border-color: rgba(66, 66, 66, 0.5);
+}
+
+.k-input-outline > .k-input-button {
+    border-color: inherit;
+}
+
+.k-input-outline > .k-input-spinner {
+    border-color: inherit;
+}
+
+.k-input-outline > .k-input-spinner > .k-spinner-increase,
+.k-input-outline > .k-input-spinner > .k-spinner-decrease {
+    border-color: inherit;
+}
+
+.k-input-outline:hover, .k-input-outline.k-hover {
+    border-color: rgba(66, 66, 66, 0.8);
+}
+
+.k-input-outline:focus, .k-input-outline.k-focus {
+    border-color: rgba(66, 66, 66, 0.5);
+    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
+}
+
+.k-input-outline.k-invalid, .k-input-outline.ng-invalid.ng-touched, .k-input-outline.ng-invalid.ng-dirty {
+    border-color: #f31700;
+}
+
+.k-input-outline.k-invalid .k-input-validation-icon, .k-input-outline.ng-invalid.ng-touched .k-input-validation-icon, .k-input-outline.ng-invalid.ng-dirty .k-input-validation-icon {
+    color: #f31700;
+}
+
+.k-picker-outline {
+    border-color: #424242;
+    background-color: transparent;
+}
+
+.k-picker-outline:hover, .k-picker-outline.k-hover {
+    color: #ffffff;
+    background-color: #424242;
+}
+
+.k-picker-outline:focus, .k-picker-outline.k-focus {
+    border-color: #424242;
+    background-color: transparent;
+    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
+}
+
+.k-picker-outline:focus:hover, .k-picker-outline:focus.k-hover, .k-picker-outline.k-focus:hover, .k-picker-outline.k-focus.k-hover {
+    color: #ffffff;
+    background-color: #424242;
+}
+
+.k-picker-outline.k-invalid, .k-picker-outline.ng-invalid.ng-touched, .k-picker-outline.ng-invalid.ng-dirty {
+    border-color: #f31700;
+}
+
+.k-picker-outline.k-invalid .k-input-validation-icon, .k-picker-outline.ng-invalid.ng-touched .k-input-validation-icon, .k-picker-outline.ng-invalid.ng-dirty .k-input-validation-icon {
+    color: #f31700;
+}
+
+.k-input-flat {
+    border-color: rgba(0, 0, 0, 0.08);
+    color: #424242;
+    background-color: transparent;
+}
+
+.k-input-flat.k-invalid, .k-input-flat.ng-invalid.ng-touched, .k-input-flat.ng-invalid.ng-dirty {
+    border-color: #f31700;
+}
+
+.k-input-flat.k-invalid .k-input-validation-icon, .k-input-flat.ng-invalid.ng-touched .k-input-validation-icon, .k-input-flat.ng-invalid.ng-dirty .k-input-validation-icon {
+    color: #f31700;
+}
+
+.k-picker-flat {
+    border-color: rgba(0, 0, 0, 0.08);
+    color: #424242;
+    background-color: transparent;
+}
+
+.k-picker-flat:hover, .k-picker-flat.k-hover {
+    border-color: rgba(0, 0, 0, 0.16);
+    background-color: rgba(66, 66, 66, 0.04);
+}
+
+.k-picker-flat.k-invalid, .k-picker-flat.ng-invalid.ng-touched, .k-picker-flat.ng-invalid.ng-dirty {
+    border-color: #f31700;
+}
+
+.k-picker-flat.k-invalid .k-input-validation-icon, .k-picker-flat.ng-invalid.ng-touched .k-input-validation-icon, .k-picker-flat.ng-invalid.ng-dirty .k-input-validation-icon {
+    color: #f31700;
+}
+
 .k-floating-label-container {
     padding-top: 20.0000000004px;
     box-sizing: border-box;
@@ -17503,7 +17607,7 @@ kendo-label > .k-label {
 .k-radio.k-state-invalid,
 .k-radio.ng-invalid.ng-touched,
 .k-radio.ng-invalid.ng-dirty {
-    border-color: rgba(243, 23, 0, 0.5);
+    border-color: #f31700;
 }
 
 .k-radio.k-invalid + .k-radio-label,
@@ -18530,7 +18634,7 @@ kendo-label > .k-label {
     color: #ff6358;
 }
 
-.k-calendar .k-nav-today:hover, .k-calendar .k-nav-today.k-state-hover, .k-calendar .k-nav-today:focus, .k-calendar .k-nav-today.k-state-focus {
+.k-calendar .k-nav-today:hover, .k-calendar .k-nav-today.k-hover, .k-calendar .k-nav-today.k-state-hover, .k-calendar .k-nav-today:focus, .k-calendar .k-nav-today.k-state-focus, .k-calendar .k-nav-today.k-focus {
     color: #d6534a;
 }
 
@@ -18560,31 +18664,38 @@ kendo-label > .k-label {
 }
 
 .k-calendar .k-calendar-td:hover .k-link,
-.k-calendar .k-calendar-td.k-state-hover .k-link {
+.k-calendar .k-calendar-td.k-state-hover .k-link,
+.k-calendar .k-calendar-td.k-hover .k-link {
     border-color: rgba(0, 0, 0, 0.08);
     color: #424242;
     background-color: #f0f0f0;
 }
 
-.k-calendar .k-calendar-td.k-state-selected .k-link {
+.k-calendar .k-calendar-td.k-state-selected .k-link,
+.k-calendar .k-calendar-td.k-selected .k-link {
     border-color: rgba(0, 0, 0, 0.08);
     color: white;
     background-color: #ff6358;
 }
 
 .k-calendar .k-calendar-td.k-state-selected:hover .k-link,
-.k-calendar .k-calendar-td.k-state-selected.k-state-hover .k-link {
+.k-calendar .k-calendar-td.k-state-selected.k-state-hover .k-link,
+.k-calendar .k-calendar-td.k-selected:hover .k-link,
+.k-calendar .k-calendar-td.k-selected.k-hover .k-link {
     color: white;
     background-color: #f55f54;
 }
 
 .k-calendar .k-calendar-td.k-state-focused .k-link,
-.k-calendar .k-calendar-td.k-state-focus .k-link {
+.k-calendar .k-calendar-td.k-state-focus .k-link,
+.k-calendar .k-calendar-td.k-focus .k-link {
     box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.08);
 }
 
 .k-calendar .k-calendar-td.k-state-selected.k-state-focused .k-link,
-.k-calendar .k-calendar-td.k-state-selected.k-state-focus .k-link {
+.k-calendar .k-calendar-td.k-state-selected.k-state-focus .k-link,
+.k-calendar .k-calendar-td.k-selected:focus .k-link,
+.k-calendar .k-calendar-td.k-selected.k-focus .k-link {
     box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.08);
 }
 
@@ -18595,7 +18706,8 @@ kendo-label > .k-label {
 }
 
 .k-calendar .k-calendar-navigation li:hover,
-.k-calendar .k-calendar-navigation li.k-state-hover {
+.k-calendar .k-calendar-navigation li.k-state-hover,
+.k-calendar .k-calendar-navigation li.k-hover {
     color: #d6534a;
 }
 
@@ -18611,7 +18723,7 @@ kendo-label > .k-label {
 }
 
 .k-calendar.k-invalid, .k-calendar.k-invalid:hover, .k-calendar.k-state-invalid, .k-calendar.ng-invalid.ng-touched, .k-calendar.ng-invalid.ng-dirty {
-    border-color: rgba(243, 23, 0, 0.5);
+    border-color: #f31700;
 }
 
 .k-scheduler .k-calendar .k-other-month {
@@ -18643,7 +18755,8 @@ kendo-label > .k-label {
 }
 
 .k-calendar .k-range-start.k-state-active .k-link,
-.k-calendar .k-range-end.k-state-active .k-link {
+.k-calendar .k-range-end.k-state-active .k-link,
+.k-calendar .k-range-end.k-active .k-link {
     box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.2);
 }
 
@@ -20646,7 +20759,7 @@ kendo-label > .k-label {
 }
 
 .k-upload.k-state-invalid, .k-upload.ng-invalid.ng-touched, .k-upload.ng-invalid.ng-dirty {
-    border-color: rgba(243, 23, 0, 0.5);
+    border-color: #f31700;
 }
 
 .k-appbar {
@@ -22520,11 +22633,15 @@ kendo-card-footer {
     background-color: #ffffff;
 }
 
-.k-card:focus, .k-card.k-state-focus {
+.k-card:focus, .k-card.k-focus, .k-card.k-state-focus {
     border-color: rgba(0, 0, 0, 0.15);
     box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.06);
 }
 
+.k-card.k-selected, .k-card.k-state-selected {
+    box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.06);
+}
+
 .k-card-actions {
     border-color: rgba(0, 0, 0, 0.08);
 }
@@ -22648,7 +22765,7 @@ kendo-card-footer {
     color: inherit;
 }
 
-.k-card-wrap.k-state-focused > .k-card, .k-card-wrap.k-state-selected > .k-card {
+.k-card-wrap.k-state-focused > .k-card, .k-card-wrap.k-focus > .k-card, .k-card-wrap:focus > .k-card, .k-card-wrap.k-state-selected > .k-card, .k-card-wrap.k-selected > .k-card {
     box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.06);
 }
 
@@ -22658,26 +22775,31 @@ kendo-card-footer {
 }
 
 .k-card:focus .k-card-callout,
+.k-card.k-focus .k-card-callout,
 .k-card.k-state-focus .k-card-callout {
     border-color: rgba(0, 0, 0, 0.15);
 }
 
 .k-card:focus .k-card-callout.k-callout-n,
+.k-card.k-focus .k-card-callout.k-callout-n,
 .k-card.k-state-focus .k-card-callout.k-callout-n {
     box-shadow: 1px -1px 4px 0 rgba(0, 0, 0, 0.06);
 }
 
 .k-card:focus .k-card-callout.k-callout-e,
+.k-card.k-focus .k-card-callout.k-callout-e,
 .k-card.k-state-focus .k-card-callout.k-callout-e {
     box-shadow: 2px -1px 4px 0 rgba(0, 0, 0, 0.06);
 }
 
 .k-card:focus .k-card-callout.k-callout-s,
+.k-card.k-focus .k-card-callout.k-callout-s,
 .k-card.k-state-focus .k-card-callout.k-callout-s {
     box-shadow: 2px -2px 4px 0 rgba(0, 0, 0, 0.06);
 }
 
 .k-card:focus .k-card-callout.k-callout-w,
+.k-card.k-focus .k-card-callout.k-callout-w,
 .k-card.k-state-focus .k-card-callout.k-callout-w {
     box-shadow: 2px -1px 4px 0 rgba(0, 0, 0, 0.06);
 }
@@ -25014,6 +25136,7 @@ kendo-card-footer {
 }
 
 .k-tilelayout-item:focus,
+.k-tilelayout-item.k-focus,
 .k-tilelayout-item.k-state-focus,
 .k-tilelayout-item.k-state-focused {
     box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.06);
@@ -26781,6 +26904,7 @@ div.k-grid-norecords {
 .k-filter-menu-container kendo-numeric-filter-menu,
 .k-filter-menu-container kendo-grid-string-filter-menu,
 .k-filter-menu-container kendo-grid-date-filter-menu,
+.k-filter-menu-container kendo-grid-numeric-filter-menu,
 .k-filter-menu-container kendo-grid-filter-menu-input-wrapper {
     display: flex;
     flex-flow: column nowrap;
@@ -30015,7 +30139,7 @@ kendo-grid tr.k-state-hover .k-grid-content-sticky.k-state-selected {
     overflow-wrap: anywhere;
 }
 
-.k-taskboard-card .k-card-title:focus, .k-taskboard-card .k-card-title.k-state-focus, .k-taskboard-card .k-card-title:hover, .k-taskboard-card .k-card-title.k-state-hover {
+.k-taskboard-card .k-card-title:focus, .k-taskboard-card .k-card-title.k-focus, .k-taskboard-card .k-card-title.k-state-focus, .k-taskboard-card .k-card-title:hover, .k-taskboard-card .k-card-title.k-hover, .k-taskboard-card .k-card-title.k-state-hover {
     text-decoration: underline;
 }
 
@@ -30087,29 +30211,29 @@ kendo-grid tr.k-state-hover .k-grid-content-sticky.k-state-selected {
     color: #ff6358;
 }
 
-.k-taskboard-card .k-card-title:focus, .k-taskboard-card .k-card-title.k-state-focus {
+.k-taskboard-card .k-card-title:focus, .k-taskboard-card .k-card-title.k-focus, .k-taskboard-card .k-card-title.k-state-focus {
     color: #d6534a;
 }
 
-.k-taskboard-card .k-card-title:hover, .k-taskboard-card .k-card-title.k-state-hover {
+.k-taskboard-card .k-card-title:hover, .k-taskboard-card .k-card-title.k-hover, .k-taskboard-card .k-card-title.k-state-hover {
     color: #d6534a;
 }
 
-.k-taskboard-card:focus, .k-taskboard-card.k-state-focus {
+.k-taskboard-card:focus, .k-taskboard-card.k-focus, .k-taskboard-card.k-state-focus {
     border-color: rgba(0, 0, 0, 0.2456);
     box-shadow: none;
 }
 
-.k-taskboard-card:hover, .k-taskboard-card.k-state-hover {
+.k-taskboard-card:hover, .k-taskboard-card.k-hover, .k-taskboard-card.k-state-hover {
     border-color: rgba(0, 0, 0, 0.172);
 }
 
-.k-taskboard-card.k-state-selected {
+.k-taskboard-card.k-selected, .k-taskboard-card.k-state-selected {
     border-color: #ffb0ab;
     box-shadow: none;
 }
 
-.k-taskboard-card.k-state-disabled {
+.k-taskboard-card.k-disabled, .k-taskboard-card.k-state-disabled {
     outline: none;
     cursor: default;
     opacity: 0.6;
@@ -35896,7 +36020,7 @@ div.k-scrollview.k-scrollview-light .k-scrollview-nav-wrap {
     border-color: transparent;
 }
 
-.k-orgchart-card:focus, .k-orgchart-card.k-state-focus {
+.k-orgchart-card:focus, .k-orgchart-card.k-focus, .k-orgchart-card.k-state-focus {
     box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.06);
 }
 
@@ -35907,6 +36031,7 @@ div.k-scrollview.k-scrollview-light .k-scrollview-nav-wrap {
 }
 
 .k-orgchart-node-group-container:focus,
+.k-orgchart-node-group-container.k-focus,
 .k-orgchart-node-group-container.k-state-focus,
 .k-orgchart-node-group-container.k-state-focused {
     box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.06);