@progress/kendo-theme-default 4.43.1-dev.1 → 4.43.1-dev.2

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 (60) hide show
  1. package/dist/all.css +695 -747
  2. package/dist/all.scss +1405 -1200
  3. package/package.json +2 -2
  4. package/scss/avatar/index.md +0 -0
  5. package/scss/calendar/_theme.scss +0 -21
  6. package/scss/checkbox/index.md +0 -0
  7. package/scss/chip/_layout.scss +103 -123
  8. package/scss/chip/_theme.scss +289 -300
  9. package/scss/chip/_variables.scss +7 -9
  10. package/scss/chip/index.md +0 -0
  11. package/scss/color-preview/_layout.scss +1 -1
  12. package/scss/color-preview/_theme.scss +3 -2
  13. package/scss/color-preview/_variables.scss +2 -1
  14. package/scss/colorpicker/_layout.scss +17 -45
  15. package/scss/colorpicker/_theme.scss +33 -42
  16. package/scss/dateinput/_index.scss +11 -0
  17. package/scss/dateinput/_layout.scss +81 -0
  18. package/scss/dateinput/_theme.scss +86 -0
  19. package/scss/dateinput/_variables.scss +1 -0
  20. package/scss/datepicker/_index.scss +13 -0
  21. package/scss/datepicker/_layout.scss +48 -0
  22. package/scss/datepicker/_theme.scss +87 -0
  23. package/scss/datepicker/_variables.scss +1 -0
  24. package/scss/{datetime → datetimepicker}/_index.scss +5 -4
  25. package/scss/datetimepicker/_layout.scss +120 -0
  26. package/scss/datetimepicker/_theme.scss +89 -0
  27. package/scss/datetimepicker/_variables.scss +2 -0
  28. package/scss/dropdowngrid/index.md +0 -0
  29. package/scss/filter/_index.scss +1 -1
  30. package/scss/filter/_layout.scss +9 -2
  31. package/scss/filter/_theme.scss +3 -1
  32. package/scss/gantt/_index.scss +1 -1
  33. package/scss/grid/_index.scss +1 -1
  34. package/scss/grid/_layout.scss +0 -4
  35. package/scss/index.scss +5 -1
  36. package/scss/input/_layout.scss +25 -26
  37. package/scss/input/_variables.scss +15 -0
  38. package/scss/list/index.md +0 -0
  39. package/scss/panelbar/_theme.scss +9 -2
  40. package/scss/panelbar/_variables.scss +4 -0
  41. package/scss/pivotgrid/_layout.scss +0 -16
  42. package/scss/pivotgrid/_variables.scss +0 -3
  43. package/scss/radio/index.md +0 -0
  44. package/scss/scheduler/_index.scss +1 -1
  45. package/scss/scrollview/_layout.scss +6 -1
  46. package/scss/spreadsheet/_index.scss +1 -1
  47. package/scss/switch/index.md +0 -0
  48. package/scss/table/_layout.scss +35 -3
  49. package/scss/timepicker/_index.scss +15 -0
  50. package/scss/timepicker/_layout.scss +48 -0
  51. package/scss/timepicker/_theme.scss +87 -0
  52. package/scss/timepicker/_variables.scss +1 -0
  53. package/scss/timeselector/_index.scss +13 -0
  54. package/scss/timeselector/_layout.scss +207 -0
  55. package/scss/timeselector/_theme.scss +70 -0
  56. package/scss/timeselector/_variables.scss +32 -0
  57. package/scss/utils/_border.scss +1 -2
  58. package/scss/datetime/_layout.scss +0 -462
  59. package/scss/datetime/_theme.scss +0 -321
  60. package/scss/datetime/_variables.scss +0 -53
package/dist/all.css CHANGED
@@ -1559,19 +1559,11 @@ kendo-sortable {
1559
1559
  border-radius: 4px !important;
1560
1560
  }
1561
1561
 
1562
- .k-rounded-circle {
1563
- border-radius: 50%;
1564
- }
1565
-
1566
- .\!k-rounded-circle {
1567
- border-radius: 50% !important;
1568
- }
1569
-
1570
- .k-rounded-pill {
1562
+ .k-rounded-full {
1571
1563
  border-radius: 9999px;
1572
1564
  }
1573
1565
 
1574
- .\!k-rounded-pill {
1566
+ .\!k-rounded-full {
1575
1567
  border-radius: 9999px !important;
1576
1568
  }
1577
1569
 
@@ -1625,22 +1617,12 @@ kendo-sortable {
1625
1617
  border-top-right-radius: 4px !important;
1626
1618
  }
1627
1619
 
1628
- .k-rounded-top-circle {
1629
- border-top-left-radius: 50%;
1630
- border-top-right-radius: 50%;
1631
- }
1632
-
1633
- .\!k-rounded-top-circle {
1634
- border-top-left-radius: 50% !important;
1635
- border-top-right-radius: 50% !important;
1636
- }
1637
-
1638
- .k-rounded-top-pill {
1620
+ .k-rounded-top-full {
1639
1621
  border-top-left-radius: 9999px;
1640
1622
  border-top-right-radius: 9999px;
1641
1623
  }
1642
1624
 
1643
- .\!k-rounded-top-pill {
1625
+ .\!k-rounded-top-full {
1644
1626
  border-top-left-radius: 9999px !important;
1645
1627
  border-top-right-radius: 9999px !important;
1646
1628
  }
@@ -1695,22 +1677,12 @@ kendo-sortable {
1695
1677
  border-bottom-right-radius: 4px !important;
1696
1678
  }
1697
1679
 
1698
- .k-rounded-right-circle {
1699
- border-top-right-radius: 50%;
1700
- border-bottom-right-radius: 50%;
1701
- }
1702
-
1703
- .\!k-rounded-right-circle {
1704
- border-top-right-radius: 50% !important;
1705
- border-bottom-right-radius: 50% !important;
1706
- }
1707
-
1708
- .k-rounded-right-pill {
1680
+ .k-rounded-right-full {
1709
1681
  border-top-right-radius: 9999px;
1710
1682
  border-bottom-right-radius: 9999px;
1711
1683
  }
1712
1684
 
1713
- .\!k-rounded-right-pill {
1685
+ .\!k-rounded-right-full {
1714
1686
  border-top-right-radius: 9999px !important;
1715
1687
  border-bottom-right-radius: 9999px !important;
1716
1688
  }
@@ -1765,22 +1737,12 @@ kendo-sortable {
1765
1737
  border-bottom-right-radius: 4px !important;
1766
1738
  }
1767
1739
 
1768
- .k-rounded-bottom-circle {
1769
- border-bottom-left-radius: 50%;
1770
- border-bottom-right-radius: 50%;
1771
- }
1772
-
1773
- .\!k-rounded-bottom-circle {
1774
- border-bottom-left-radius: 50% !important;
1775
- border-bottom-right-radius: 50% !important;
1776
- }
1777
-
1778
- .k-rounded-bottom-pill {
1740
+ .k-rounded-bottom-full {
1779
1741
  border-bottom-left-radius: 9999px;
1780
1742
  border-bottom-right-radius: 9999px;
1781
1743
  }
1782
1744
 
1783
- .\!k-rounded-bottom-pill {
1745
+ .\!k-rounded-bottom-full {
1784
1746
  border-bottom-left-radius: 9999px !important;
1785
1747
  border-bottom-right-radius: 9999px !important;
1786
1748
  }
@@ -1835,22 +1797,12 @@ kendo-sortable {
1835
1797
  border-top-left-radius: 4px !important;
1836
1798
  }
1837
1799
 
1838
- .k-rounded-left-circle {
1839
- border-bottom-left-radius: 50%;
1840
- border-top-left-radius: 50%;
1841
- }
1842
-
1843
- .\!k-rounded-left-circle {
1844
- border-bottom-left-radius: 50% !important;
1845
- border-top-left-radius: 50% !important;
1846
- }
1847
-
1848
- .k-rounded-left-pill {
1800
+ .k-rounded-left-full {
1849
1801
  border-bottom-left-radius: 9999px;
1850
1802
  border-top-left-radius: 9999px;
1851
1803
  }
1852
1804
 
1853
- .\!k-rounded-left-pill {
1805
+ .\!k-rounded-left-full {
1854
1806
  border-bottom-left-radius: 9999px !important;
1855
1807
  border-top-left-radius: 9999px !important;
1856
1808
  }
@@ -1895,19 +1847,11 @@ kendo-sortable {
1895
1847
  border-top-left-radius: 4px !important;
1896
1848
  }
1897
1849
 
1898
- .k-rounded-top-left-circle {
1899
- border-top-left-radius: 50%;
1900
- }
1901
-
1902
- .\!k-rounded-top-left-circle {
1903
- border-top-left-radius: 50% !important;
1904
- }
1905
-
1906
- .k-rounded-top-left-pill {
1850
+ .k-rounded-top-left-full {
1907
1851
  border-top-left-radius: 9999px;
1908
1852
  }
1909
1853
 
1910
- .\!k-rounded-top-left-pill {
1854
+ .\!k-rounded-top-left-full {
1911
1855
  border-top-left-radius: 9999px !important;
1912
1856
  }
1913
1857
 
@@ -1951,19 +1895,11 @@ kendo-sortable {
1951
1895
  border-top-right-radius: 4px !important;
1952
1896
  }
1953
1897
 
1954
- .k-rounded-top-right-circle {
1955
- border-top-right-radius: 50%;
1956
- }
1957
-
1958
- .\!k-rounded-top-right-circle {
1959
- border-top-right-radius: 50% !important;
1960
- }
1961
-
1962
- .k-rounded-top-right-pill {
1898
+ .k-rounded-top-right-full {
1963
1899
  border-top-right-radius: 9999px;
1964
1900
  }
1965
1901
 
1966
- .\!k-rounded-top-right-pill {
1902
+ .\!k-rounded-top-right-full {
1967
1903
  border-top-right-radius: 9999px !important;
1968
1904
  }
1969
1905
 
@@ -2007,19 +1943,11 @@ kendo-sortable {
2007
1943
  border-bottom-left-radius: 4px !important;
2008
1944
  }
2009
1945
 
2010
- .k-rounded-bottom-left-circle {
2011
- border-bottom-left-radius: 50%;
2012
- }
2013
-
2014
- .\!k-rounded-bottom-left-circle {
2015
- border-bottom-left-radius: 50% !important;
2016
- }
2017
-
2018
- .k-rounded-bottom-left-pill {
1946
+ .k-rounded-bottom-left-full {
2019
1947
  border-bottom-left-radius: 9999px;
2020
1948
  }
2021
1949
 
2022
- .\!k-rounded-bottom-left-pill {
1950
+ .\!k-rounded-bottom-left-full {
2023
1951
  border-bottom-left-radius: 9999px !important;
2024
1952
  }
2025
1953
 
@@ -2063,19 +1991,11 @@ kendo-sortable {
2063
1991
  border-bottom-right-radius: 4px !important;
2064
1992
  }
2065
1993
 
2066
- .k-rounded-bottom-right-circle {
2067
- border-bottom-right-radius: 50%;
2068
- }
2069
-
2070
- .\!k-rounded-bottom-right-circle {
2071
- border-bottom-right-radius: 50% !important;
2072
- }
2073
-
2074
- .k-rounded-bottom-right-pill {
1994
+ .k-rounded-bottom-right-full {
2075
1995
  border-bottom-right-radius: 9999px;
2076
1996
  }
2077
1997
 
2078
- .\!k-rounded-bottom-right-pill {
1998
+ .\!k-rounded-bottom-right-full {
2079
1999
  border-bottom-right-radius: 9999px !important;
2080
2000
  }
2081
2001
 
@@ -11192,21 +11112,6 @@ kendo-list > .k-group-header,
11192
11112
  box-shadow: none;
11193
11113
  }
11194
11114
 
11195
- .k-space-left > input,
11196
- .k-space-right > input {
11197
- flex-grow: 1;
11198
- }
11199
-
11200
- .k-space-left > .k-icon,
11201
- .k-space-right > .k-icon {
11202
- left: 3px;
11203
- margin: 3px 6px;
11204
- }
11205
-
11206
- .k-textbox.k-space-left {
11207
- flex-direction: row-reverse;
11208
- }
11209
-
11210
11115
  .k-input-prefix,
11211
11116
  .k-input-suffix {
11212
11117
  display: flex;
@@ -11300,6 +11205,26 @@ kendo-list > .k-group-header,
11300
11205
  flex-flow: row nowrap;
11301
11206
  }
11302
11207
 
11208
+ .k-picker-wrap,
11209
+ .k-dropdown-wrap,
11210
+ .k-dateinput-wrap,
11211
+ .k-multiselect-wrap,
11212
+ .k-numeric-wrap {
11213
+ width: 100%;
11214
+ border-width: 0;
11215
+ border-color: inherit;
11216
+ box-sizing: border-box;
11217
+ flex: 1 1 auto;
11218
+ display: flex;
11219
+ flex-flow: row nowrap;
11220
+ overflow: hidden;
11221
+ position: relative;
11222
+ }
11223
+
11224
+ .k-multiselect-wrap {
11225
+ display: block;
11226
+ }
11227
+
11303
11228
  .k-text-disabled {
11304
11229
  outline: none;
11305
11230
  cursor: default;
@@ -11594,6 +11519,10 @@ kendo-list > .k-group-header,
11594
11519
  border-style: solid;
11595
11520
  }
11596
11521
 
11522
+ .k-data-table .k-table {
11523
+ table-layout: fixed;
11524
+ }
11525
+
11597
11526
  .k-table-thead,
11598
11527
  .k-table-tbody,
11599
11528
  .k-table-tfoot {
@@ -11651,7 +11580,7 @@ kendo-list > .k-group-header,
11651
11580
  width: 100%;
11652
11581
  max-width: none;
11653
11582
  border-width: 0;
11654
- display: table-row-group;
11583
+ display: table;
11655
11584
  border-collapse: collapse;
11656
11585
  border-spacing: 0;
11657
11586
  table-layout: fixed;
@@ -11660,10 +11589,11 @@ kendo-list > .k-group-header,
11660
11589
  outline: none;
11661
11590
  }
11662
11591
 
11663
- .k-table-list .k-table-row {
11592
+ .k-table-list .k-table-row,
11593
+ .k-table-list .k-table-group-row {
11664
11594
  width: 100%;
11665
11595
  box-sizing: border-box;
11666
- display: flex;
11596
+ display: table-row;
11667
11597
  position: relative;
11668
11598
  }
11669
11599
 
@@ -11676,6 +11606,23 @@ kendo-list > .k-group-header,
11676
11606
  vertical-align: middle;
11677
11607
  }
11678
11608
 
11609
+ .k-table-list .k-table-group-row::before {
11610
+ content: ".";
11611
+ padding: 8px 0;
11612
+ width: 0;
11613
+ display: block;
11614
+ overflow: hidden;
11615
+ }
11616
+
11617
+ .k-table-list .k-table-group-row .k-table-th {
11618
+ width: 100%;
11619
+ border-color: inherit;
11620
+ color: inherit;
11621
+ background-color: inherit;
11622
+ position: absolute;
11623
+ top: 0;
11624
+ }
11625
+
11679
11626
  .k-table-list .k-table-spacer-td {
11680
11627
  padding: 0 !important;
11681
11628
  width: 0 !important;
@@ -11699,6 +11646,11 @@ kendo-list > .k-group-header,
11699
11646
  right: 0;
11700
11647
  }
11701
11648
 
11649
+ .k-virtual-table .k-table-row {
11650
+ position: absolute;
11651
+ width: 100%;
11652
+ }
11653
+
11702
11654
  .k-table-scroller {
11703
11655
  position: relative;
11704
11656
  overflow: auto;
@@ -12350,158 +12302,148 @@ kendo-badge-container {
12350
12302
  color: #424242;
12351
12303
  }
12352
12304
 
12353
- .k-chip-list {
12305
+ .k-chip {
12306
+ height: 24px;
12307
+ padding: 4px 4px;
12308
+ border-radius: 12px;
12309
+ box-sizing: border-box;
12310
+ border-width: 1px;
12311
+ border-style: solid;
12312
+ outline: 0;
12313
+ font-size: 14px;
12354
12314
  display: inline-flex;
12315
+ flex-flow: row nowrap;
12316
+ align-items: center;
12317
+ justify-content: center;
12318
+ gap: 4px;
12319
+ position: relative;
12320
+ overflow: hidden;
12321
+ cursor: pointer;
12322
+ -webkit-user-select: none;
12323
+ -ms-user-select: none;
12324
+ user-select: none;
12355
12325
  }
12356
12326
 
12357
- .k-chip-list > * {
12358
- margin-right: 8px;
12327
+ .k-chip .k-selected-icon-wrapper {
12328
+ display: none !important;
12359
12329
  }
12360
12330
 
12361
- .k-chip-list > *:last-child {
12362
- margin-right: 0;
12331
+ .k-chip-content {
12332
+ min-width: 0;
12333
+ display: flex;
12334
+ flex-flow: row nowrap;
12335
+ align-items: center;
12336
+ overflow: hidden;
12337
+ flex: 1 1 auto;
12363
12338
  }
12364
12339
 
12365
- .k-selection-single .k-selected-icon-wrapper {
12366
- display: none;
12340
+ .k-chip-content:first-child {
12341
+ margin-inline-start: 4px;
12367
12342
  }
12368
12343
 
12369
- .k-selection-multiple .k-selected-icon-wrapper {
12370
- width: 0;
12371
- height: 16px;
12372
- position: relative;
12373
- left: 4px;
12374
- display: flex;
12375
- align-items: center;
12376
- justify-content: center;
12377
- visibility: hidden;
12378
- z-index: 1;
12344
+ .k-chip-content:last-child {
12345
+ margin-inline-end: 4px;
12379
12346
  }
12380
12347
 
12381
- .k-selection-multiple .k-selected-icon {
12382
- font-size: 14px;
12348
+ .k-chip-text,
12349
+ .k-chip-label {
12350
+ white-space: nowrap;
12351
+ text-overflow: ellipsis;
12352
+ overflow: hidden;
12353
+ flex: 1 1 auto;
12383
12354
  }
12384
12355
 
12385
- .k-selection-multiple .k-chip.k-state-selected .k-selected-icon-wrapper,
12386
- .k-selection-multiple .k-chip.k-selected .k-selected-icon-wrapper {
12356
+ .k-chip-avatar {
12387
12357
  width: 16px;
12388
- visibility: visible;
12389
- }
12390
-
12391
- .k-selection-multiple > .k-chip-has-icon .k-selected-icon-wrapper {
12358
+ height: 16px;
12392
12359
  border-radius: 50%;
12393
- position: absolute;
12360
+ background-size: cover;
12361
+ background-position: center;
12362
+ flex: none;
12394
12363
  }
12395
12364
 
12396
- .k-selection-multiple :not(.k-chip-has-icon) .k-selected-icon-wrapper {
12397
- left: 4px;
12398
- opacity: 0;
12399
- transition: width .2s, opacity .2s;
12365
+ .k-chip-icon {
12366
+ width: 16px;
12367
+ height: 16px;
12368
+ display: flex;
12369
+ align-items: center;
12370
+ justify-content: center;
12371
+ flex: none;
12400
12372
  }
12401
12373
 
12402
- .k-selection-multiple :not(.k-chip-has-icon).k-state-selected .k-selected-icon-wrapper,
12403
- .k-selection-multiple :not(.k-chip-has-icon).k-selected .k-selected-icon-wrapper {
12404
- opacity: 1;
12374
+ .k-ie .k-chip-icon {
12375
+ margin-right: 4px;
12405
12376
  }
12406
12377
 
12407
- .k-chip {
12408
- overflow: hidden;
12409
- padding: 4px 0px;
12410
- height: 24px;
12411
- border-radius: 12px;
12412
- position: relative;
12413
- box-sizing: border-box;
12414
- border-width: 1px;
12415
- border-style: solid;
12416
- display: inline-flex;
12378
+ .k-chip-actions {
12379
+ flex: none;
12380
+ display: flex;
12381
+ flex-flow: row nowrap;
12417
12382
  align-items: center;
12418
- justify-content: center;
12419
- font-size: 14px;
12420
- cursor: pointer;
12421
- -webkit-user-select: none;
12422
- -ms-user-select: none;
12423
- user-select: none;
12424
- }
12425
-
12426
- .k-chip:focus, .k-chip.k-chip-focus {
12427
- outline: 0;
12383
+ align-self: center;
12428
12384
  }
12429
12385
 
12430
- .k-chip-content {
12431
- min-width: 0;
12432
- overflow: hidden;
12433
- text-overflow: ellipsis;
12434
- white-space: nowrap;
12435
- padding: 0 8px;
12436
- flex: 1 1 auto;
12386
+ .k-chip-action {
12387
+ flex: none;
12388
+ display: flex;
12389
+ flex-flow: row nowrap;
12390
+ align-items: center;
12391
+ align-self: center;
12437
12392
  }
12438
12393
 
12439
- .k-chip-icon,
12440
12394
  .k-remove-icon {
12441
12395
  width: 16px;
12442
12396
  height: 16px;
12397
+ font-size: 14px;
12443
12398
  display: flex;
12444
12399
  align-items: center;
12445
12400
  justify-content: center;
12446
- flex: 1 0 auto;
12401
+ flex: none;
12447
12402
  }
12448
12403
 
12449
- .k-chip-icon {
12404
+ .k-ie .k-remove-icon {
12405
+ margin-right: 0;
12450
12406
  margin-left: 4px;
12451
12407
  }
12452
12408
 
12453
- .k-remove-icon {
12454
- margin-right: 8px;
12455
- font-size: 14px;
12409
+ .k-chip-list {
12410
+ display: inline-flex;
12411
+ gap: 8px;
12456
12412
  }
12457
12413
 
12458
- .k-chip-avatar {
12459
- width: 16px;
12460
- height: 16px;
12461
- border-radius: 50%;
12462
- background-size: cover;
12463
- background-position: center;
12414
+ .k-ie .k-chip-list > * {
12415
+ margin-right: 8px;
12464
12416
  }
12465
12417
 
12466
- .k-chip-list[dir="rtl"] > *,
12467
- .k-rtl .k-chip-list > *, .k-chip-list.k-rtl > * {
12418
+ .k-ie .k-chip-list > :last-child {
12468
12419
  margin-right: 0;
12469
- margin-left: 8px;
12470
12420
  }
12471
12421
 
12472
- .k-chip-list[dir="rtl"] > *:last-child,
12473
- .k-rtl .k-chip-list > *:last-child, .k-chip-list.k-rtl > *:last-child {
12474
- margin-left: 0;
12422
+ .k-ie .k-chip.k-rtl .k-chip-icon,
12423
+ .k-ie .k-rtl .k-chip .k-chip-icon,
12424
+ .k-ie .k-chip[dir="rtl"] .k-chip-icon {
12425
+ margin-right: 0;
12426
+ margin-left: 4px;
12475
12427
  }
12476
12428
 
12477
- .k-chip[dir="rtl"] .k-chip-icon,
12478
- .k-rtl .k-chip .k-chip-icon, .k-chip.k-rtl .k-chip-icon {
12429
+ .k-ie .k-chip.k-rtl .k-remove-icon,
12430
+ .k-ie .k-rtl .k-chip .k-remove-icon,
12431
+ .k-ie .k-chip[dir="rtl"] .k-remove-icon {
12479
12432
  margin-left: 0;
12480
12433
  margin-right: 4px;
12481
12434
  }
12482
12435
 
12483
- .k-chip[dir="rtl"] .k-remove-icon,
12484
- .k-rtl .k-chip .k-remove-icon, .k-chip.k-rtl .k-remove-icon {
12436
+ .k-ie .k-chip-list.k-rtl > *,
12437
+ .k-ie .k-rtl .k-chip-list > *,
12438
+ .k-ie .k-chip-list[dir="rtl"] > * {
12485
12439
  margin-right: 0;
12486
12440
  margin-left: 8px;
12487
12441
  }
12488
12442
 
12489
- .k-selection-multiple .k-chip[dir="rtl"] .k-selected-icon-wrapper, .k-selection-multiple
12490
- .k-rtl .k-chip .k-selected-icon-wrapper, .k-selection-multiple .k-chip.k-rtl .k-selected-icon-wrapper {
12491
- left: 0;
12492
- right: 4px;
12493
- }
12494
-
12495
- .k-selection-multiple .k-chip[dir="rtl"]:not(.k-chip-has-icon) .k-selected-icon-wrapper, .k-selection-multiple
12496
- .k-rtl .k-chip:not(.k-chip-has-icon) .k-selected-icon-wrapper, .k-selection-multiple .k-chip.k-rtl:not(.k-chip-has-icon) .k-selected-icon-wrapper {
12497
- left: 0;
12498
- right: 4px;
12499
- }
12500
-
12501
- .k-selection-multiple .k-chip-has-icon.k-state-selected .k-selected-icon-wrapper,
12502
- .k-selection-multiple .k-chip-has-icon.k-selected .k-selected-icon-wrapper {
12503
- color: #ffffff;
12504
- background-color: rgba(0, 0, 0, 0.44);
12443
+ .k-ie .k-chip-list.k-rtl > *:last-child,
12444
+ .k-ie .k-rtl .k-chip-list > *:last-child,
12445
+ .k-ie .k-chip-list[dir="rtl"] > *:last-child {
12446
+ margin-left: 0;
12505
12447
  }
12506
12448
 
12507
12449
  .k-chip-solid {
@@ -12510,16 +12452,15 @@ kendo-badge-container {
12510
12452
  background-color: rgba(66, 66, 66, 0.08);
12511
12453
  }
12512
12454
 
12513
- .k-chip-solid:hover, .k-chip-solid.k-state-hover, .k-chip-solid.k-hover {
12455
+ .k-chip-solid:hover, .k-chip-solid.k-hover, .k-chip-solid.k-state-hover {
12514
12456
  background-color: rgba(66, 66, 66, 0.16);
12515
12457
  }
12516
12458
 
12517
- .k-chip-solid:focus, .k-chip-solid.k-state-focus, .k-chip-solid.k-focus {
12459
+ .k-chip-solid:focus, .k-chip-solid.k-focus, .k-chip-solid.k-state-focus {
12518
12460
  box-shadow: 0 0 0 2px rgba(66, 66, 66, 0.16);
12519
- background-color: rgba(66, 66, 66, 0.08);
12520
12461
  }
12521
12462
 
12522
- .k-chip-solid.k-state-selected, .k-chip-solid.k-selected {
12463
+ .k-chip-solid.k-selected, .k-chip-solid.k-state-selected {
12523
12464
  background-color: rgba(66, 66, 66, 0.24);
12524
12465
  }
12525
12466
 
@@ -12529,11 +12470,11 @@ kendo-badge-container {
12529
12470
  background-color: rgba(55, 180, 0, 0.08);
12530
12471
  }
12531
12472
 
12532
- .k-chip-solid.k-chip-success:hover, .k-chip-solid.k-chip-success.k-state-hover, .k-chip-solid.k-chip-success.k-hover {
12473
+ .k-chip-solid.k-chip-success:hover, .k-chip-solid.k-chip-success.k-hover, .k-chip-solid.k-chip-success.k-state-hover {
12533
12474
  background-color: rgba(55, 180, 0, 0.16);
12534
12475
  }
12535
12476
 
12536
- .k-chip-solid.k-chip-success.k-state-selected, .k-chip-solid.k-chip-success.k-selected {
12477
+ .k-chip-solid.k-chip-success.k-selected, .k-chip-solid.k-chip-success.k-state-selected {
12537
12478
  background-color: rgba(55, 180, 0, 0.24);
12538
12479
  }
12539
12480
 
@@ -12543,11 +12484,11 @@ kendo-badge-container {
12543
12484
  background-color: rgba(255, 192, 0, 0.08);
12544
12485
  }
12545
12486
 
12546
- .k-chip-solid.k-chip-warning:hover, .k-chip-solid.k-chip-warning.k-state-hover, .k-chip-solid.k-chip-warning.k-hover {
12487
+ .k-chip-solid.k-chip-warning:hover, .k-chip-solid.k-chip-warning.k-hover, .k-chip-solid.k-chip-warning.k-state-hover {
12547
12488
  background-color: rgba(255, 192, 0, 0.16);
12548
12489
  }
12549
12490
 
12550
- .k-chip-solid.k-chip-warning.k-state-selected, .k-chip-solid.k-chip-warning.k-selected {
12491
+ .k-chip-solid.k-chip-warning.k-selected, .k-chip-solid.k-chip-warning.k-state-selected {
12551
12492
  background-color: rgba(255, 192, 0, 0.24);
12552
12493
  }
12553
12494
 
@@ -12557,11 +12498,11 @@ kendo-badge-container {
12557
12498
  background-color: rgba(243, 23, 0, 0.08);
12558
12499
  }
12559
12500
 
12560
- .k-chip-solid.k-chip-error:hover, .k-chip-solid.k-chip-error.k-state-hover, .k-chip-solid.k-chip-error.k-hover {
12501
+ .k-chip-solid.k-chip-error:hover, .k-chip-solid.k-chip-error.k-hover, .k-chip-solid.k-chip-error.k-state-hover {
12561
12502
  background-color: rgba(243, 23, 0, 0.16);
12562
12503
  }
12563
12504
 
12564
- .k-chip-solid.k-chip-error.k-state-selected, .k-chip-solid.k-chip-error.k-selected {
12505
+ .k-chip-solid.k-chip-error.k-selected, .k-chip-solid.k-chip-error.k-state-selected {
12565
12506
  background-color: rgba(243, 23, 0, 0.24);
12566
12507
  }
12567
12508
 
@@ -12571,11 +12512,11 @@ kendo-badge-container {
12571
12512
  background-color: rgba(0, 88, 233, 0.08);
12572
12513
  }
12573
12514
 
12574
- .k-chip-solid.k-chip-info:hover, .k-chip-solid.k-chip-info.k-state-hover, .k-chip-solid.k-chip-info.k-hover {
12515
+ .k-chip-solid.k-chip-info:hover, .k-chip-solid.k-chip-info.k-hover, .k-chip-solid.k-chip-info.k-state-hover {
12575
12516
  background-color: rgba(0, 88, 233, 0.16);
12576
12517
  }
12577
12518
 
12578
- .k-chip-solid.k-chip-info.k-state-selected, .k-chip-solid.k-chip-info.k-selected {
12519
+ .k-chip-solid.k-chip-info.k-selected, .k-chip-solid.k-chip-info.k-state-selected {
12579
12520
  background-color: rgba(0, 88, 233, 0.24);
12580
12521
  }
12581
12522
 
@@ -12585,16 +12526,16 @@ kendo-badge-container {
12585
12526
  background-color: #ffffff;
12586
12527
  }
12587
12528
 
12588
- .k-chip-outline:hover, .k-chip-outline.k-state-hover, .k-chip-outline.k-hover {
12529
+ .k-chip-outline:hover, .k-chip-outline.k-hover, .k-chip-outline.k-state-hover {
12589
12530
  color: white;
12590
12531
  background-color: #424242;
12591
12532
  }
12592
12533
 
12593
- .k-chip-outline:focus, .k-chip-outline.k-state-focus, .k-chip-outline.k-focus {
12534
+ .k-chip-outline:focus, .k-chip-outline.k-focus, .k-chip-outline.k-state-focus {
12594
12535
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
12595
12536
  }
12596
12537
 
12597
- .k-chip-outline.k-state-selected, .k-chip-outline.k-selected {
12538
+ .k-chip-outline.k-selected, .k-chip-outline.k-state-selected {
12598
12539
  color: white;
12599
12540
  background-color: #424242;
12600
12541
  }
@@ -12604,12 +12545,12 @@ kendo-badge-container {
12604
12545
  color: #37b400;
12605
12546
  }
12606
12547
 
12607
- .k-chip-outline.k-chip-success:hover, .k-chip-outline.k-chip-success.k-state-hover, .k-chip-outline.k-chip-success.k-hover {
12548
+ .k-chip-outline.k-chip-success:hover, .k-chip-outline.k-chip-success.k-hover, .k-chip-outline.k-chip-success.k-state-hover {
12608
12549
  color: white;
12609
12550
  background-color: #37b400;
12610
12551
  }
12611
12552
 
12612
- .k-chip-outline.k-chip-success.k-state-selected, .k-chip-outline.k-chip-success.k-selected {
12553
+ .k-chip-outline.k-chip-success.k-selected, .k-chip-outline.k-chip-success.k-state-selected {
12613
12554
  color: white;
12614
12555
  background-color: #37b400;
12615
12556
  }
@@ -12619,12 +12560,12 @@ kendo-badge-container {
12619
12560
  color: #ffc000;
12620
12561
  }
12621
12562
 
12622
- .k-chip-outline.k-chip-warning:hover, .k-chip-outline.k-chip-warning.k-state-hover, .k-chip-outline.k-chip-warning.k-hover {
12563
+ .k-chip-outline.k-chip-warning:hover, .k-chip-outline.k-chip-warning.k-hover, .k-chip-outline.k-chip-warning.k-state-hover {
12623
12564
  color: #ffffff;
12624
12565
  background-color: #ffc000;
12625
12566
  }
12626
12567
 
12627
- .k-chip-outline.k-chip-warning.k-state-selected, .k-chip-outline.k-chip-warning.k-selected {
12568
+ .k-chip-outline.k-chip-warning.k-selected, .k-chip-outline.k-chip-warning.k-state-selected {
12628
12569
  color: #ffffff;
12629
12570
  background-color: #ffc000;
12630
12571
  }
@@ -12634,12 +12575,12 @@ kendo-badge-container {
12634
12575
  color: #f31700;
12635
12576
  }
12636
12577
 
12637
- .k-chip-outline.k-chip-error:hover, .k-chip-outline.k-chip-error.k-state-hover, .k-chip-outline.k-chip-error.k-hover {
12578
+ .k-chip-outline.k-chip-error:hover, .k-chip-outline.k-chip-error.k-hover, .k-chip-outline.k-chip-error.k-state-hover {
12638
12579
  color: white;
12639
12580
  background-color: #f31700;
12640
12581
  }
12641
12582
 
12642
- .k-chip-outline.k-chip-error.k-state-selected, .k-chip-outline.k-chip-error.k-selected {
12583
+ .k-chip-outline.k-chip-error.k-selected, .k-chip-outline.k-chip-error.k-state-selected {
12643
12584
  color: white;
12644
12585
  background-color: #f31700;
12645
12586
  }
@@ -12649,12 +12590,12 @@ kendo-badge-container {
12649
12590
  color: #0058e9;
12650
12591
  }
12651
12592
 
12652
- .k-chip-outline.k-chip-info:hover, .k-chip-outline.k-chip-info.k-state-hover, .k-chip-outline.k-chip-info.k-hover {
12593
+ .k-chip-outline.k-chip-info:hover, .k-chip-outline.k-chip-info.k-hover, .k-chip-outline.k-chip-info.k-state-hover {
12653
12594
  color: white;
12654
12595
  background-color: #0058e9;
12655
12596
  }
12656
12597
 
12657
- .k-chip-outline.k-chip-info.k-state-selected, .k-chip-outline.k-chip-info.k-selected {
12598
+ .k-chip-outline.k-chip-info.k-selected, .k-chip-outline.k-chip-info.k-state-selected {
12658
12599
  color: white;
12659
12600
  background-color: #0058e9;
12660
12601
  }
@@ -12724,8 +12665,9 @@ kendo-badge-container {
12724
12665
 
12725
12666
  .k-no-color::after {
12726
12667
  background-color: #ffffff;
12727
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' version='1.1'%3e%3cline x1='0' x2='20' y1='0' y2='20' stroke='%23f31700' stroke-width='1'/%3e%3c/svg%3e");
12728
- background-size: 100% 100%;
12668
+ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAuSURBVHgBxYyxDQAwDMJIL+YT+DjtzFRliUfLcklqBCRT4eCTxbD6kdL2/LgYXqpvCbs3kBv/AAAAAElFTkSuQmCC");
12669
+ background-size: contain;
12670
+ background-position: 0 0;
12729
12671
  }
12730
12672
 
12731
12673
  .k-loader {
@@ -16892,12 +16834,247 @@ kendo-label.k-radio-label > .k-label {
16892
16834
  background-image: linear-gradient(to right, rgba(255, 99, 88, 0.25), transparent 100%);
16893
16835
  }
16894
16836
 
16895
- .k-daterangepicker.k-state-invalid .k-dateinput-wrap {
16896
- border-color: rgba(243, 23, 0, 0.5);
16837
+ .k-timeselector {
16838
+ border-width: 1px;
16839
+ border-style: solid;
16840
+ box-sizing: border-box;
16841
+ outline: 0;
16842
+ font-family: inherit;
16843
+ font-size: 14px;
16844
+ line-height: 1.4285714286;
16845
+ position: relative;
16846
+ overflow: hidden;
16847
+ display: flex;
16848
+ flex-flow: column nowrap;
16849
+ -webkit-user-select: none;
16850
+ -ms-user-select: none;
16851
+ user-select: none;
16852
+ -webkit-touch-callout: none;
16853
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
16897
16854
  }
16898
16855
 
16899
- .k-daterangepicker.k-state-invalid .k-dateinput-wrap .k-input-validation-icon {
16900
- color: #f31700;
16856
+ .k-popup > .k-timeselector {
16857
+ border-width: 0;
16858
+ }
16859
+
16860
+ .k-time-header,
16861
+ .k-time-selector-header {
16862
+ padding: 4px 4px;
16863
+ box-sizing: border-box;
16864
+ display: flex;
16865
+ align-items: center;
16866
+ justify-content: space-between;
16867
+ flex: 0 0 auto;
16868
+ }
16869
+
16870
+ .k-time-header .k-title,
16871
+ .k-time-header .k-time-selector-header-title,
16872
+ .k-time-selector-header .k-title,
16873
+ .k-time-selector-header .k-time-selector-header-title {
16874
+ padding: 4px 8px;
16875
+ font-weight: bold;
16876
+ display: inline-block;
16877
+ }
16878
+
16879
+ .k-time-header .k-time-now,
16880
+ .k-time-selector-header .k-time-now {
16881
+ border-width: 0;
16882
+ line-height: inherit;
16883
+ cursor: pointer;
16884
+ }
16885
+
16886
+ .k-time-list-container {
16887
+ display: flex;
16888
+ position: relative;
16889
+ flex: 1 1 auto;
16890
+ }
16891
+
16892
+ .k-time-highlight,
16893
+ .k-time-list-highlight {
16894
+ width: 100%;
16895
+ height: 28px;
16896
+ border-width: 1px 0px;
16897
+ border-style: solid;
16898
+ box-sizing: border-box;
16899
+ position: absolute;
16900
+ top: calc(50% + 9px);
16901
+ left: 0;
16902
+ right: 0;
16903
+ transform: translateY(-50%);
16904
+ z-index: 1;
16905
+ }
16906
+
16907
+ .k-time-list-wrapper {
16908
+ min-width: 4em;
16909
+ height: 240px;
16910
+ box-sizing: content-box;
16911
+ display: inline-flex;
16912
+ flex-flow: column nowrap;
16913
+ align-items: stretch;
16914
+ overflow: hidden;
16915
+ position: relative;
16916
+ text-align: center;
16917
+ flex: 1 1 auto;
16918
+ }
16919
+
16920
+ .k-time-list-wrapper .k-title {
16921
+ font-size: 12px;
16922
+ line-height: 1.5;
16923
+ font-weight: bold;
16924
+ text-align: center;
16925
+ text-transform: capitalize;
16926
+ display: block;
16927
+ }
16928
+
16929
+ .k-time-list-wrapper.k-state-focused::before, .k-time-list-wrapper.k-state-focused::after {
16930
+ display: block;
16931
+ content: " ";
16932
+ position: absolute;
16933
+ width: 100%;
16934
+ left: 0;
16935
+ pointer-events: none;
16936
+ height: calc(50% - 14px);
16937
+ box-sizing: border-box;
16938
+ border-width: 0;
16939
+ border-style: solid;
16940
+ }
16941
+
16942
+ .k-time-list-wrapper.k-state-focused::before {
16943
+ top: 18px;
16944
+ }
16945
+
16946
+ .k-time-list-wrapper.k-state-focused::after {
16947
+ bottom: 0;
16948
+ }
16949
+
16950
+ .k-time-list {
16951
+ display: flex;
16952
+ flex-flow: row nowrap;
16953
+ align-items: stretch;
16954
+ flex: 1;
16955
+ position: relative;
16956
+ z-index: 1;
16957
+ overflow: hidden;
16958
+ }
16959
+
16960
+ .k-time-list::before, .k-time-list::after {
16961
+ display: block;
16962
+ position: absolute;
16963
+ content: " ";
16964
+ height: 0;
16965
+ line-height: 0;
16966
+ z-index: 1;
16967
+ width: 200%;
16968
+ left: -50%;
16969
+ }
16970
+
16971
+ .k-time-list::before {
16972
+ top: 0;
16973
+ }
16974
+
16975
+ .k-time-list::after {
16976
+ bottom: 0;
16977
+ }
16978
+
16979
+ .k-time-container,
16980
+ .k-time-list-content {
16981
+ position: relative;
16982
+ flex: 1 1 auto;
16983
+ display: block;
16984
+ overflow-x: hidden;
16985
+ overflow-y: scroll;
16986
+ padding-right: 100px;
16987
+ padding-left: 100px;
16988
+ margin-left: -100px;
16989
+ margin-right: -117px;
16990
+ }
16991
+
16992
+ .k-time-container > ul,
16993
+ .k-time-list-content > ul {
16994
+ height: auto;
16995
+ width: 4em;
16996
+ margin: auto;
16997
+ }
16998
+
16999
+ .k-rtl .k-time-container [dir="rtl"] .k-time-container, .k-rtl
17000
+ .k-time-list-content [dir="rtl"] .k-time-container, .k-rtl .k-time-container [dir="rtl"]
17001
+ .k-time-list-content, .k-rtl
17002
+ .k-time-list-content [dir="rtl"]
17003
+ .k-time-list-content {
17004
+ padding-right: 100px;
17005
+ padding-left: 100px;
17006
+ margin-left: -117px;
17007
+ margin-right: -100px;
17008
+ }
17009
+
17010
+ .k-time-container .k-scrollable-placeholder,
17011
+ .k-time-list-content .k-scrollable-placeholder {
17012
+ position: absolute;
17013
+ width: 1px;
17014
+ top: 0;
17015
+ right: 0;
17016
+ }
17017
+
17018
+ .k-time-list-item,
17019
+ .k-time-list .k-item {
17020
+ padding: 4px 8px;
17021
+ }
17022
+
17023
+ .k-time-separator {
17024
+ width: 0;
17025
+ height: 28px;
17026
+ align-self: center;
17027
+ display: inline-flex;
17028
+ justify-content: center;
17029
+ align-items: center;
17030
+ position: relative;
17031
+ z-index: 11;
17032
+ top: 9px;
17033
+ }
17034
+
17035
+ .k-timeselector {
17036
+ border-color: rgba(0, 0, 0, 0.08);
17037
+ color: #424242;
17038
+ background-color: #ffffff;
17039
+ }
17040
+
17041
+ .k-time-header .k-time-now,
17042
+ .k-time-selector-header .k-time-now {
17043
+ color: #ff6358;
17044
+ }
17045
+
17046
+ .k-time-header .k-time-now:hover,
17047
+ .k-time-selector-header .k-time-now:hover {
17048
+ color: #d6534a;
17049
+ }
17050
+
17051
+ .k-time-list-wrapper .k-title {
17052
+ color: #666666;
17053
+ }
17054
+
17055
+ .k-time-list-wrapper.k-state-focused .k-title {
17056
+ color: #424242;
17057
+ }
17058
+
17059
+ .k-time-list-wrapper.k-state-focused::before, .k-time-list-wrapper.k-state-focused::after {
17060
+ background-color: rgba(0, 0, 0, 0.04);
17061
+ }
17062
+
17063
+ .k-time-list::before, .k-time-list::after {
17064
+ box-shadow: 0 0 3em 1.5em #ffffff;
17065
+ }
17066
+
17067
+ .k-time-list .k-item:hover {
17068
+ color: #ff6358;
17069
+ }
17070
+
17071
+ .k-time-container {
17072
+ background: transparent;
17073
+ }
17074
+
17075
+ .k-time-highlight {
17076
+ border-color: rgba(0, 0, 0, 0.08);
17077
+ background-color: #ffffff;
16901
17078
  }
16902
17079
 
16903
17080
  .k-autocomplete {
@@ -17518,51 +17695,40 @@ kendo-label.k-radio-label > .k-label {
17518
17695
  }
17519
17696
 
17520
17697
  .k-colorpicker {
17698
+ border-radius: 2px;
17521
17699
  width: auto;
17522
- border-width: 0;
17700
+ border-width: 1px;
17701
+ border-style: solid;
17523
17702
  box-sizing: border-box;
17524
17703
  outline: 0;
17525
17704
  font-family: inherit;
17526
17705
  font-size: 14px;
17527
17706
  line-height: 1.4285714286;
17528
- background: none;
17529
- text-align: left;
17707
+ text-align: start;
17708
+ white-space: nowrap;
17530
17709
  display: inline-flex;
17710
+ flex-flow: row nowrap;
17531
17711
  vertical-align: middle;
17532
17712
  position: relative;
17533
- overflow: visible;
17713
+ overflow: hidden;
17714
+ transition: all .1s ease;
17534
17715
  -webkit-touch-callout: none;
17535
17716
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
17536
17717
  }
17537
17718
 
17538
17719
  .k-colorpicker .k-selected-color {
17539
- padding: 4px;
17540
- width: calc(1.4285714286em + 8px);
17541
- height: calc(1.4285714286em + 8px);
17542
- border-width: 0;
17720
+ margin: 4px;
17721
+ width: 1.4285714286em;
17722
+ height: 1.4285714286em;
17723
+ border-width: 1px;
17543
17724
  border-style: solid;
17544
- border-color: inherit;
17545
17725
  box-sizing: border-box;
17726
+ background-clip: content-box;
17546
17727
  line-height: 0;
17547
17728
  position: relative;
17548
17729
  overflow: hidden;
17549
17730
  }
17550
17731
 
17551
- .k-colorpicker .k-selected-color .k-i-line {
17552
- border-top: 1px solid #f31700;
17553
- width: 200%;
17554
- height: 200%;
17555
- position: absolute;
17556
- top: 50%;
17557
- left: 50%;
17558
- transform: translate(-33%, -33%) rotateZ(45deg);
17559
- transform-origin: 0 0;
17560
- }
17561
-
17562
- .k-colorpicker .k-selected-color .k-i-line::before {
17563
- display: none;
17564
- }
17565
-
17566
17732
  .k-colorpicker .k-tool-icon {
17567
17733
  padding: 4px;
17568
17734
  width: calc(1.4285714286em + 8px);
@@ -17592,35 +17758,19 @@ kendo-label.k-radio-label > .k-label {
17592
17758
  display: inline-block;
17593
17759
  }
17594
17760
 
17595
- .k-colorpicker .k-picker-wrap {
17596
- border-radius: 2px;
17597
- padding: 0;
17598
- width: 100%;
17599
- border-width: 1px;
17600
- border-style: solid;
17601
- box-sizing: border-box;
17602
- position: relative;
17603
- display: flex;
17604
- flex-direction: row;
17605
- transition: all .1s ease;
17606
- overflow: hidden;
17607
- cursor: default;
17608
- outline: 0;
17609
- }
17610
-
17611
17761
  .k-colorpicker .k-select {
17612
17762
  padding: 4px 4px;
17613
17763
  width: calc(1.4285714286em + 8px);
17764
+ height: calc(1.4285714286em + 8px);
17614
17765
  border-width: 0;
17615
17766
  border-inline-start-width: 0px;
17616
17767
  border-style: solid;
17617
- border-color: inherit;
17768
+ border-color: transparent;
17618
17769
  box-sizing: border-box;
17619
17770
  display: flex;
17620
17771
  align-items: center;
17621
17772
  justify-content: center;
17622
17773
  flex: 0 0 auto;
17623
- text-align: center;
17624
17774
  cursor: pointer;
17625
17775
  }
17626
17776
 
@@ -17632,74 +17782,59 @@ kendo-label.k-radio-label > .k-label {
17632
17782
  padding: 0;
17633
17783
  }
17634
17784
 
17635
- .k-colorpicker .k-picker-wrap {
17785
+ .k-colorpicker {
17636
17786
  border-color: rgba(0, 0, 0, 0.08);
17637
17787
  color: #424242;
17638
17788
  background-color: #f5f5f5;
17639
17789
  background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.02));
17640
17790
  }
17641
17791
 
17642
- .k-colorpicker .k-picker-wrap.k-invalid, .k-colorpicker .k-picker-wrap.k-invalid:hover, .k-colorpicker .k-picker-wrap.k-state-invalid {
17643
- border-color: rgba(243, 23, 0, 0.5);
17792
+ .k-colorpicker .k-selected-color {
17793
+ border-color: rgba(0, 0, 0, 0.08);
17644
17794
  }
17645
17795
 
17646
- .k-colorpicker .k-picker-wrap.k-invalid .k-input-validation-icon, .k-colorpicker .k-picker-wrap.k-invalid:hover .k-input-validation-icon, .k-colorpicker .k-picker-wrap.k-state-invalid .k-input-validation-icon {
17647
- color: #f31700;
17796
+ .k-colorpicker:hover, .k-colorpicker.k-state-hover {
17797
+ background-color: #ebebeb;
17648
17798
  }
17649
17799
 
17650
- .k-colorpicker > :hover,
17651
- .k-colorpicker > .k-state-hover {
17652
- background-color: #ebebeb;
17800
+ .k-colorpicker:focus, .k-colorpicker.k-state-focus {
17801
+ box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
17653
17802
  }
17654
17803
 
17655
- .k-colorpicker .k-state-focused,
17656
- .k-colorpicker .k-state-focus,
17657
- .k-colorpicker .k-focus {
17804
+ .k-colorpicker:focus-within {
17658
17805
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
17659
17806
  }
17660
17807
 
17661
- .k-colorpicker.k-state-invalid .k-picker-wrap, .k-colorpicker.ng-invalid.ng-touched .k-picker-wrap, .k-colorpicker.ng-invalid.ng-dirty .k-picker-wrap {
17808
+ .k-colorpicker.k-invalid, .k-colorpicker.ng-invalid, .k-colorpicker.k-state-invalid {
17662
17809
  border-color: rgba(243, 23, 0, 0.5);
17663
17810
  }
17664
17811
 
17665
- .k-colorpicker.k-state-invalid .k-picker-wrap .k-input-validation-icon, .k-colorpicker.ng-invalid.ng-touched .k-picker-wrap .k-input-validation-icon, .k-colorpicker.ng-invalid.ng-dirty .k-picker-wrap .k-input-validation-icon {
17812
+ .k-colorpicker.k-invalid .k-input-validation-icon, .k-colorpicker.ng-invalid .k-input-validation-icon, .k-colorpicker.k-state-invalid .k-input-validation-icon {
17666
17813
  color: #f31700;
17667
17814
  }
17668
17815
 
17669
17816
  .k-dateinput {
17817
+ border-radius: 2px;
17670
17818
  width: 12.4em;
17671
- border-width: 0;
17819
+ border-width: 1px;
17820
+ border-style: solid;
17672
17821
  box-sizing: border-box;
17673
17822
  outline: 0;
17674
- background: none;
17675
17823
  font-family: inherit;
17676
17824
  font-size: 14px;
17677
17825
  line-height: 1.4285714286;
17678
- text-align: left;
17826
+ text-align: start;
17679
17827
  white-space: nowrap;
17680
17828
  display: inline-flex;
17829
+ flex-flow: row nowrap;
17681
17830
  vertical-align: middle;
17682
17831
  position: relative;
17832
+ overflow: hidden;
17833
+ transition: all .1s ease;
17683
17834
  -webkit-touch-callout: none;
17684
17835
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
17685
17836
  }
17686
17837
 
17687
- .k-dateinput .k-dateinput-wrap {
17688
- border-radius: 2px;
17689
- padding: 0;
17690
- width: 100%;
17691
- border-width: 1px;
17692
- border-style: solid;
17693
- box-sizing: border-box;
17694
- position: relative;
17695
- transition: all .1s ease;
17696
- cursor: default;
17697
- outline: 0;
17698
- display: flex;
17699
- flex-flow: row nowrap;
17700
- overflow: hidden;
17701
- }
17702
-
17703
17838
  .k-dateinput .k-select {
17704
17839
  padding: 0;
17705
17840
  width: calc(1.4285714286em + 8px);
@@ -17740,58 +17875,166 @@ kendo-label.k-radio-label > .k-label {
17740
17875
  top: -2px;
17741
17876
  }
17742
17877
 
17743
- .k-rtl .k-dateinput, .k-dateinput[dir="rtl"] {
17744
- text-align: right;
17745
- }
17746
-
17747
17878
  .k-picker-wrap .k-dateinput {
17748
17879
  margin: 0 !important;
17880
+ padding: 0 !important;
17749
17881
  width: 100%;
17750
- flex: 1 1 auto;
17751
- }
17752
-
17753
- .k-picker-wrap .k-dateinput .k-dateinput-wrap {
17754
17882
  border-radius: 0 !important;
17755
17883
  border-width: 0;
17756
17884
  box-shadow: none !important;
17885
+ flex: 1 1 auto;
17757
17886
  }
17758
17887
 
17759
- .k-datepicker,
17760
- .k-timepicker {
17888
+ .k-dateinput {
17889
+ border-color: rgba(0, 0, 0, 0.08);
17890
+ color: #424242;
17891
+ background-color: #ffffff;
17892
+ }
17893
+
17894
+ .k-dateinput:hover, .k-dateinput.k-state-hover {
17895
+ border-color: rgba(0, 0, 0, 0.16);
17896
+ }
17897
+
17898
+ .k-dateinput:focus, .k-dateinput.k-state-focus {
17899
+ border-color: rgba(0, 0, 0, 0.16);
17900
+ box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
17901
+ }
17902
+
17903
+ .k-dateinput:focus-within {
17904
+ border-color: rgba(0, 0, 0, 0.16);
17905
+ box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
17906
+ }
17907
+
17908
+ .k-dateinput.k-invalid, .k-dateinput.ng-invalid, .k-dateinput.k-state-invalid {
17909
+ border-color: rgba(243, 23, 0, 0.5);
17910
+ }
17911
+
17912
+ .k-dateinput.k-invalid .k-input-validation-icon, .k-dateinput.ng-invalid .k-input-validation-icon, .k-dateinput.k-state-invalid .k-input-validation-icon {
17913
+ color: #f31700;
17914
+ }
17915
+
17916
+ .k-dateinput .k-select {
17917
+ border-color: rgba(0, 0, 0, 0.08);
17918
+ color: #424242;
17919
+ background-color: #f5f5f5;
17920
+ background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.02));
17921
+ }
17922
+
17923
+ .k-dateinput .k-link:hover,
17924
+ .k-dateinput .k-link.k-state-hover {
17925
+ background-color: #ebebeb;
17926
+ }
17927
+
17928
+ .k-dateinput .k-link:active,
17929
+ .k-dateinput .k-link.k-state-active {
17930
+ background-color: #d8d8d8;
17931
+ }
17932
+
17933
+ .k-datepicker {
17934
+ border-radius: 2px;
17761
17935
  width: 12.4em;
17762
- border-width: 0;
17936
+ border-width: 1px;
17937
+ border-style: solid;
17763
17938
  box-sizing: border-box;
17764
17939
  outline: 0;
17765
17940
  font-family: inherit;
17766
17941
  font-size: 14px;
17767
17942
  line-height: 1.4285714286;
17943
+ text-align: start;
17768
17944
  white-space: nowrap;
17769
- background: none;
17770
17945
  display: inline-flex;
17946
+ flex-flow: row nowrap;
17771
17947
  vertical-align: middle;
17772
17948
  position: relative;
17949
+ overflow: hidden;
17950
+ transition: all .1s ease;
17773
17951
  -webkit-touch-callout: none;
17774
17952
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
17775
17953
  }
17776
17954
 
17777
- .k-datepicker .k-picker-wrap,
17778
- .k-timepicker .k-picker-wrap {
17955
+ .k-datepicker .k-select {
17956
+ padding: 4px 4px;
17957
+ width: calc(1.4285714286em + 8px);
17958
+ border-width: 0;
17959
+ border-inline-start-width: 0px;
17960
+ border-style: solid;
17961
+ box-sizing: border-box;
17962
+ outline: 0;
17963
+ display: flex;
17964
+ flex-flow: row nowrap;
17965
+ align-items: center;
17966
+ justify-content: center;
17967
+ flex: 0 0 auto;
17968
+ cursor: pointer;
17969
+ }
17970
+
17971
+ .k-datepicker {
17972
+ border-color: rgba(0, 0, 0, 0.08);
17973
+ color: #424242;
17974
+ background-color: #ffffff;
17975
+ }
17976
+
17977
+ .k-datepicker:hover, .k-datepicker.k-state-hover {
17978
+ border-color: rgba(0, 0, 0, 0.16);
17979
+ }
17980
+
17981
+ .k-datepicker:focus, .k-datepicker.k-state-focus {
17982
+ border-color: rgba(0, 0, 0, 0.16);
17983
+ box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
17984
+ }
17985
+
17986
+ .k-datepicker:focus-within {
17987
+ border-color: rgba(0, 0, 0, 0.16);
17988
+ box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
17989
+ }
17990
+
17991
+ .k-datepicker.k-invalid, .k-datepicker.ng-invalid, .k-datepicker.k-state-invalid {
17992
+ border-color: rgba(243, 23, 0, 0.5);
17993
+ }
17994
+
17995
+ .k-datepicker.k-invalid .k-input-validation-icon, .k-datepicker.ng-invalid .k-input-validation-icon, .k-datepicker.k-state-invalid .k-input-validation-icon {
17996
+ color: #f31700;
17997
+ }
17998
+
17999
+ .k-datepicker .k-select {
18000
+ border-color: rgba(0, 0, 0, 0.08);
18001
+ color: #424242;
18002
+ background-color: #f5f5f5;
18003
+ background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.02));
18004
+ }
18005
+
18006
+ .k-datepicker .k-select:hover,
18007
+ .k-datepicker .k-select.k-state-hover {
18008
+ background-color: #ebebeb;
18009
+ }
18010
+
18011
+ .k-datepicker .k-select:active,
18012
+ .k-datepicker .k-select.k-state-active {
18013
+ background-color: #d8d8d8;
18014
+ }
18015
+
18016
+ .k-timepicker {
17779
18017
  border-radius: 2px;
17780
- padding: 0;
17781
- width: 100%;
18018
+ width: 12.4em;
17782
18019
  border-width: 1px;
17783
18020
  border-style: solid;
17784
18021
  box-sizing: border-box;
17785
- display: flex;
17786
- flex-direction: row;
17787
- position: relative;
17788
- transition: all .1s ease;
17789
- cursor: default;
17790
18022
  outline: 0;
18023
+ font-family: inherit;
18024
+ font-size: 14px;
18025
+ line-height: 1.4285714286;
18026
+ text-align: start;
18027
+ white-space: nowrap;
18028
+ display: inline-flex;
18029
+ flex-flow: row nowrap;
18030
+ vertical-align: middle;
18031
+ position: relative;
17791
18032
  overflow: hidden;
18033
+ transition: all .1s ease;
18034
+ -webkit-touch-callout: none;
18035
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
17792
18036
  }
17793
18037
 
17794
- .k-datepicker .k-select,
17795
18038
  .k-timepicker .k-select {
17796
18039
  padding: 4px 4px;
17797
18040
  width: calc(1.4285714286em + 8px);
@@ -17801,53 +18044,80 @@ kendo-label.k-radio-label > .k-label {
17801
18044
  box-sizing: border-box;
17802
18045
  outline: 0;
17803
18046
  display: flex;
18047
+ flex-flow: row nowrap;
17804
18048
  align-items: center;
17805
18049
  justify-content: center;
17806
18050
  flex: 0 0 auto;
17807
- text-align: center;
17808
18051
  cursor: pointer;
17809
18052
  }
17810
18053
 
17811
- .k-rtl .k-datepicker, .k-datepicker[dir="rtl"], .k-rtl
17812
- .k-timepicker,
17813
- .k-timepicker[dir="rtl"] {
17814
- text-align: right;
18054
+ .k-timepicker {
18055
+ border-color: rgba(0, 0, 0, 0.08);
18056
+ color: #424242;
18057
+ background-color: #ffffff;
18058
+ }
18059
+
18060
+ .k-timepicker:hover, .k-timepicker.k-state-hover {
18061
+ border-color: rgba(0, 0, 0, 0.16);
18062
+ }
18063
+
18064
+ .k-timepicker:focus, .k-timepicker.k-state-focus {
18065
+ border-color: rgba(0, 0, 0, 0.16);
18066
+ box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
18067
+ }
18068
+
18069
+ .k-timepicker:focus-within {
18070
+ border-color: rgba(0, 0, 0, 0.16);
18071
+ box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
18072
+ }
18073
+
18074
+ .k-timepicker.k-invalid, .k-timepicker.ng-invalid, .k-timepicker.k-state-invalid {
18075
+ border-color: rgba(243, 23, 0, 0.5);
18076
+ }
18077
+
18078
+ .k-timepicker.k-invalid .k-input-validation-icon, .k-timepicker.ng-invalid .k-input-validation-icon, .k-timepicker.k-state-invalid .k-input-validation-icon {
18079
+ color: #f31700;
18080
+ }
18081
+
18082
+ .k-timepicker .k-select {
18083
+ border-color: rgba(0, 0, 0, 0.08);
18084
+ color: #424242;
18085
+ background-color: #f5f5f5;
18086
+ background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.02));
18087
+ }
18088
+
18089
+ .k-timepicker .k-select:hover,
18090
+ .k-timepicker .k-select.k-state-hover {
18091
+ background-color: #ebebeb;
18092
+ }
18093
+
18094
+ .k-timepicker .k-select:active,
18095
+ .k-timepicker .k-select.k-state-active {
18096
+ background-color: #d8d8d8;
17815
18097
  }
17816
18098
 
17817
18099
  .k-datetimepicker {
18100
+ border-radius: 2px;
17818
18101
  width: 12.4em;
17819
- border-width: 0;
18102
+ border-width: 1px;
18103
+ border-style: solid;
17820
18104
  box-sizing: border-box;
17821
18105
  outline: 0;
17822
18106
  font-family: inherit;
17823
18107
  font-size: 14px;
17824
18108
  line-height: 1.4285714286;
17825
- text-align: left;
18109
+ text-align: start;
17826
18110
  white-space: nowrap;
17827
- background: none;
17828
18111
  display: inline-flex;
18112
+ flex-flow: row nowrap;
17829
18113
  vertical-align: middle;
17830
18114
  position: relative;
18115
+ overflow: hidden;
18116
+ transition: all .1s ease;
17831
18117
  -webkit-touch-callout: none;
17832
18118
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
17833
18119
  }
17834
18120
 
17835
- .k-datetimepicker .k-picker-wrap {
17836
- border-radius: 2px;
17837
- padding: 0;
17838
- width: 100%;
17839
- border-width: 1px;
17840
- border-style: solid;
17841
- box-sizing: border-box;
17842
- display: flex;
17843
- flex-direction: row;
17844
- position: relative;
17845
- transition: all .1s ease;
17846
- cursor: default;
17847
- outline: 0;
17848
- overflow: hidden;
17849
- }
17850
-
17851
18121
  .k-datetimepicker .k-select {
17852
18122
  border-width: 0;
17853
18123
  border-inline-start-width: 0px;
@@ -17875,417 +18145,107 @@ kendo-label.k-radio-label > .k-label {
17875
18145
  box-sizing: border-box;
17876
18146
  }
17877
18147
 
17878
- .k-rtl .k-datetimepicker, .k-datetimepicker[dir="rtl"] {
17879
- text-align: right;
17880
- }
17881
-
18148
+ .k-datetime-popup .k-datetime-wrap,
17882
18149
  .k-datetime-container .k-datetime-wrap {
17883
18150
  width: 288px;
17884
18151
  overflow: hidden;
17885
18152
  }
17886
18153
 
18154
+ .k-datetime-popup .k-date-tab .k-datetime-selector,
18155
+ .k-datetime-container .k-date-tab .k-datetime-selector {
18156
+ transform: translateX(0);
18157
+ }
18158
+
18159
+ .k-datetime-popup .k-time-tab .k-datetime-selector,
18160
+ .k-datetime-container .k-time-tab .k-datetime-selector {
18161
+ transform: translateX(-100%);
18162
+ }
18163
+
18164
+ .k-datetime-popup .k-datetime-buttongroup,
17887
18165
  .k-datetime-container .k-datetime-buttongroup {
17888
- padding: 8px;
18166
+ padding: 8px 8px;
17889
18167
  }
17890
18168
 
18169
+ .k-datetime-popup .k-datetime-selector,
17891
18170
  .k-datetime-container .k-datetime-selector {
17892
18171
  display: flex;
17893
18172
  transition: transform .2s;
17894
18173
  }
17895
18174
 
18175
+ .k-datetime-popup .k-datetime-calendar-wrap,
18176
+ .k-datetime-popup .k-datetime-time-wrap,
17896
18177
  .k-datetime-container .k-datetime-calendar-wrap,
17897
18178
  .k-datetime-container .k-datetime-time-wrap {
17898
18179
  text-align: center;
17899
18180
  flex: 0 0 288px;
17900
18181
  }
17901
18182
 
17902
- .k-datetime-container .k-timeselector {
17903
- outline: none;
17904
- }
17905
-
17906
- .k-datetime-container .k-time-list-container {
17907
- justify-content: center;
17908
- }
17909
-
17910
- .k-datetime-container .k-time-tab .k-datetime-selector {
17911
- transform: translateX(-100%);
17912
- }
17913
-
17914
- .k-rtl .k-datetime-container .k-time-tab .k-datetime-selector, .k-datetime-container.k-rtl .k-time-tab .k-datetime-selector,
17915
- [dir="rtl"] .k-datetime-container .k-time-tab .k-datetime-selector, .k-datetime-container[dir="rtl"] .k-time-tab .k-datetime-selector {
17916
- transform: translateX(100%);
17917
- }
17918
-
17919
- .k-time-header {
17920
- display: flex;
17921
- align-items: center;
17922
- justify-content: space-between;
17923
- padding: 8px 16px;
17924
- line-height: 2em;
17925
- }
17926
-
17927
- .k-time-header .k-title {
17928
- font-weight: bold;
17929
- }
17930
-
17931
- .k-time-header .k-time-now {
18183
+ .k-datetime-popup .k-datetime-calendar-wrap .k-calendar,
18184
+ .k-datetime-container .k-datetime-calendar-wrap .k-calendar {
17932
18185
  border-width: 0;
17933
- line-height: inherit;
17934
- cursor: pointer;
17935
18186
  }
17936
18187
 
17937
- .k-time-list-wrapper {
17938
- display: inline-block;
17939
- overflow: hidden;
17940
- box-sizing: content-box;
17941
- overflow-x: hidden;
17942
- overflow-y: auto;
17943
- position: relative;
17944
- padding: 20px 0;
17945
- text-align: center;
17946
- min-width: 4em;
17947
- height: 200px;
17948
- flex: 1 1 auto;
17949
- }
17950
-
17951
- .k-time-list-wrapper .k-title {
17952
- display: block;
17953
- text-align: center;
17954
- font-size: 10px;
17955
- position: absolute;
17956
- text-transform: capitalize;
17957
- font-weight: bold;
17958
- min-width: 100%;
17959
- height: 1.5em;
17960
- line-height: 1.5em;
17961
- margin-top: -20px;
17962
- z-index: 12;
17963
- }
17964
-
17965
- .k-time-list-wrapper.k-state-focused::before, .k-time-list-wrapper.k-state-focused::after {
17966
- display: block;
17967
- content: " ";
17968
- position: absolute;
17969
- width: 100%;
17970
- left: 0;
17971
- pointer-events: none;
17972
- height: calc(50% - 1em);
17973
- box-sizing: border-box;
18188
+ .k-datetime-popup .k-datetime-time-wrap .k-timeselector,
18189
+ .k-datetime-container .k-datetime-time-wrap .k-timeselector {
17974
18190
  border-width: 0;
17975
- border-style: solid;
17976
18191
  }
17977
18192
 
17978
- .k-time-list-wrapper.k-state-focused::before {
17979
- top: 0;
17980
- }
17981
-
17982
- .k-time-list-wrapper.k-state-focused::after {
17983
- bottom: 0;
17984
- }
17985
-
17986
- .k-time-container {
17987
- position: absolute;
17988
- display: block;
17989
- overflow-x: hidden;
17990
- overflow-y: scroll;
17991
- line-height: 1.4285714286;
17992
- left: 0;
17993
- right: 0;
17994
- top: 20px;
17995
- bottom: 20px;
17996
- padding-right: 100px;
17997
- padding-left: 100px;
17998
- margin-left: -100px;
17999
- margin-right: -117px;
18000
- }
18001
-
18002
- .k-time-container > ul {
18003
- height: auto;
18004
- width: 4em;
18005
- margin: auto;
18006
- }
18007
-
18008
- .k-rtl .k-time-container, .k-time-container.k-rtl,
18009
- [dir="rtl"] .k-time-container, .k-time-container[dir="rtl"] {
18010
- padding-right: 100px;
18011
- padding-left: 100px;
18012
- margin-left: -117px;
18013
- margin-right: -100px;
18014
- }
18015
-
18016
- .k-time-list-container {
18017
- display: flex;
18018
- position: relative;
18019
- }
18020
-
18021
- .k-time-list {
18022
- position: absolute;
18023
- display: flex;
18024
- z-index: 10;
18025
- outline: 0;
18026
- bottom: 0;
18027
- right: 0;
18028
- left: 0;
18029
- top: 0;
18030
- }
18031
-
18032
- .k-time-list::before, .k-time-list::after {
18033
- display: block;
18034
- position: absolute;
18035
- content: " ";
18036
- height: 0;
18037
- line-height: 0;
18038
- z-index: 1;
18039
- width: 200%;
18040
- left: -50%;
18193
+ .k-rtl .k-datetime-popup .k-time-tab .k-datetime-selector, .k-datetime-popup.k-rtl .k-time-tab .k-datetime-selector,
18194
+ [dir="rtl"] .k-datetime-popup .k-time-tab .k-datetime-selector, .k-datetime-popup[dir="rtl"] .k-time-tab .k-datetime-selector, .k-rtl
18195
+ .k-datetime-container .k-time-tab .k-datetime-selector,
18196
+ .k-datetime-container.k-rtl .k-time-tab .k-datetime-selector,
18197
+ [dir="rtl"]
18198
+ .k-datetime-container .k-time-tab .k-datetime-selector,
18199
+ .k-datetime-container[dir="rtl"] .k-time-tab .k-datetime-selector {
18200
+ transform: translateX(100%);
18041
18201
  }
18042
18202
 
18043
- .k-time-list::before {
18044
- top: 0;
18203
+ .k-datetimepicker {
18204
+ border-color: rgba(0, 0, 0, 0.08);
18205
+ color: #424242;
18206
+ background-color: #ffffff;
18045
18207
  }
18046
18208
 
18047
- .k-time-list::after {
18048
- bottom: 0;
18209
+ .k-datetimepicker:hover, .k-datetimepicker.k-state-hover {
18210
+ border-color: rgba(0, 0, 0, 0.16);
18049
18211
  }
18050
18212
 
18051
- .k-time-list .k-item {
18052
- padding: 4px 8px;
18053
- min-height: calc(1.43em + 2px);
18054
- line-height: calc(1.43em + 2px);
18213
+ .k-datetimepicker:focus, .k-datetimepicker.k-state-focus {
18214
+ border-color: rgba(0, 0, 0, 0.16);
18215
+ box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
18055
18216
  }
18056
18217
 
18057
- .k-time-highlight {
18058
- position: absolute;
18059
- top: 50%;
18060
- left: 0;
18061
- right: 0;
18062
- transform: translateY(-50%);
18063
- width: 100%;
18064
- height: calc(1.4285714286em + 8px);
18065
- z-index: 1;
18066
- border-width: 1px 0;
18067
- border-style: solid;
18218
+ .k-datetimepicker:focus-within {
18219
+ border-color: rgba(0, 0, 0, 0.16);
18220
+ box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
18068
18221
  }
18069
18222
 
18070
- .k-time-container .k-scrollable-placeholder {
18071
- position: absolute;
18072
- width: 1px;
18073
- top: 0;
18074
- right: 0;
18223
+ .k-datetimepicker.k-invalid, .k-datetimepicker.ng-invalid, .k-datetimepicker.k-state-invalid {
18224
+ border-color: rgba(243, 23, 0, 0.5);
18075
18225
  }
18076
18226
 
18077
- .k-time-separator {
18078
- width: 0;
18079
- height: 100%;
18080
- display: inline-flex;
18081
- align-self: center;
18082
- justify-content: center;
18083
- z-index: 11;
18227
+ .k-datetimepicker.k-invalid .k-input-validation-icon, .k-datetimepicker.ng-invalid .k-input-validation-icon, .k-datetimepicker.k-state-invalid .k-input-validation-icon {
18228
+ color: #f31700;
18084
18229
  }
18085
18230
 
18086
- .k-datepicker .k-select,
18087
- .k-timepicker .k-select,
18088
- .k-datetimepicker .k-select,
18089
- .k-dateinput .k-select {
18231
+ .k-datetimepicker .k-select {
18090
18232
  border-color: rgba(0, 0, 0, 0.08);
18091
18233
  color: #424242;
18092
18234
  background-color: #f5f5f5;
18093
18235
  background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.02));
18094
18236
  }
18095
18237
 
18096
- .k-datepicker .k-i-warning,
18097
- .k-timepicker .k-i-warning,
18098
- .k-datetimepicker .k-i-warning,
18099
- .k-dateinput .k-i-warning {
18100
- color: #f31700;
18101
- }
18102
-
18103
- .k-datepicker .k-picker-wrap,
18104
- .k-timepicker .k-picker-wrap,
18105
- .k-datetimepicker .k-picker-wrap,
18106
- .k-dateinput .k-dateinput-wrap {
18107
- border-color: rgba(0, 0, 0, 0.08);
18108
- color: #424242;
18109
- background-color: #ffffff;
18110
- }
18111
-
18112
- .k-datepicker .k-picker-wrap:hover, .k-datepicker .k-picker-wrap.k-state-hover,
18113
- .k-timepicker .k-picker-wrap:hover,
18114
- .k-timepicker .k-picker-wrap.k-state-hover,
18115
- .k-datetimepicker .k-picker-wrap:hover,
18116
- .k-datetimepicker .k-picker-wrap.k-state-hover,
18117
- .k-dateinput .k-dateinput-wrap:hover,
18118
- .k-dateinput .k-dateinput-wrap.k-state-hover {
18119
- border-color: rgba(0, 0, 0, 0.16);
18120
- }
18121
-
18122
- .k-datepicker .k-picker-wrap.k-state-focused, .k-datepicker .k-picker-wrap.k-state-active,
18123
- .k-timepicker .k-picker-wrap.k-state-focused,
18124
- .k-timepicker .k-picker-wrap.k-state-active,
18125
- .k-datetimepicker .k-picker-wrap.k-state-focused,
18126
- .k-datetimepicker .k-picker-wrap.k-state-active,
18127
- .k-dateinput .k-dateinput-wrap.k-state-focused,
18128
- .k-dateinput .k-dateinput-wrap.k-state-active {
18129
- border-color: rgba(0, 0, 0, 0.16);
18130
- box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
18131
- }
18132
-
18133
- .k-datepicker .k-select:hover,
18134
- .k-datepicker .k-select.k-state-hover,
18135
- .k-timepicker .k-select:hover,
18136
- .k-timepicker .k-select.k-state-hover {
18137
- background-color: #ebebeb;
18138
- }
18139
-
18140
- .k-dateinput .k-link:hover,
18141
- .k-dateinput .k-link.k-state-hover,
18142
18238
  .k-datetimepicker .k-link:hover,
18143
18239
  .k-datetimepicker .k-link.k-state-hover {
18144
18240
  background-color: #ebebeb;
18145
18241
  }
18146
18242
 
18147
- .k-dateinput .k-link:active,
18148
- .k-dateinput .k-link.k-state-active,
18149
- .k-dateinput .k-link.k-state-selected,
18150
18243
  .k-datetimepicker .k-link:active,
18151
18244
  .k-datetimepicker .k-link.k-state-active,
18152
18245
  .k-datetimepicker .k-link.k-state-selected {
18153
18246
  background-color: #d8d8d8;
18154
18247
  }
18155
18248
 
18156
- .k-time-header .k-time-now {
18157
- color: #ff6358;
18158
- background: transparent;
18159
- }
18160
-
18161
- .k-time-header .k-time-now:hover, .k-time-header .k-time-now:focus {
18162
- color: #d6534a;
18163
- }
18164
-
18165
- .k-time-list-wrapper .k-title {
18166
- color: #666666;
18167
- }
18168
-
18169
- .k-time-list-wrapper.k-state-focused .k-title {
18170
- color: #424242;
18171
- }
18172
-
18173
- .k-time-list-wrapper.k-state-focused::before, .k-time-list-wrapper.k-state-focused::after {
18174
- background-color: rgba(0, 0, 0, 0.04);
18175
- }
18176
-
18177
- .k-time-list::before, .k-time-list::after {
18178
- box-shadow: 0 0 3em 1.5em #ffffff;
18179
- }
18180
-
18181
- .k-time-list .k-item:hover {
18182
- color: #ff6358;
18183
- }
18184
-
18185
- .k-time-container {
18186
- background: transparent;
18187
- }
18188
-
18189
- .k-time-highlight {
18190
- border-color: rgba(0, 0, 0, 0.08);
18191
- background-color: #ffffff;
18192
- }
18193
-
18194
- .k-datetime-container .k-date-tab .k-datetime-buttongroup,
18195
- .k-datetime-container .k-date-tab .k-datetime-selector {
18196
- background-color: #ffffff;
18197
- }
18198
-
18199
- .k-datepicker .k-picker-wrap.k-invalid, .k-datepicker .k-picker-wrap.k-state-invalid,
18200
- .k-datetimepicker .k-picker-wrap.k-invalid,
18201
- .k-datetimepicker .k-picker-wrap.k-state-invalid,
18202
- .k-timepicker .k-picker-wrap.k-invalid,
18203
- .k-timepicker .k-picker-wrap.k-state-invalid {
18204
- border-color: rgba(243, 23, 0, 0.5);
18205
- }
18206
-
18207
- .k-datepicker .k-picker-wrap.k-invalid .k-input-validation-icon, .k-datepicker .k-picker-wrap.k-state-invalid .k-input-validation-icon,
18208
- .k-datetimepicker .k-picker-wrap.k-invalid .k-input-validation-icon,
18209
- .k-datetimepicker .k-picker-wrap.k-state-invalid .k-input-validation-icon,
18210
- .k-timepicker .k-picker-wrap.k-invalid .k-input-validation-icon,
18211
- .k-timepicker .k-picker-wrap.k-state-invalid .k-input-validation-icon {
18212
- color: #f31700;
18213
- }
18214
-
18215
- .k-datepicker.k-state-invalid .k-picker-wrap, .k-datepicker.ng-invalid.ng-touched .k-picker-wrap, .k-datepicker.ng-invalid.ng-dirty .k-picker-wrap,
18216
- .k-datetimepicker.k-state-invalid .k-picker-wrap,
18217
- .k-datetimepicker.ng-invalid.ng-touched .k-picker-wrap,
18218
- .k-datetimepicker.ng-invalid.ng-dirty .k-picker-wrap,
18219
- .k-timepicker.k-state-invalid .k-picker-wrap,
18220
- .k-timepicker.ng-invalid.ng-touched .k-picker-wrap,
18221
- .k-timepicker.ng-invalid.ng-dirty .k-picker-wrap {
18222
- border-color: rgba(243, 23, 0, 0.5);
18223
- }
18224
-
18225
- .k-datepicker.k-state-invalid .k-picker-wrap .k-input-validation-icon, .k-datepicker.ng-invalid.ng-touched .k-picker-wrap .k-input-validation-icon, .k-datepicker.ng-invalid.ng-dirty .k-picker-wrap .k-input-validation-icon,
18226
- .k-datetimepicker.k-state-invalid .k-picker-wrap .k-input-validation-icon,
18227
- .k-datetimepicker.ng-invalid.ng-touched .k-picker-wrap .k-input-validation-icon,
18228
- .k-datetimepicker.ng-invalid.ng-dirty .k-picker-wrap .k-input-validation-icon,
18229
- .k-timepicker.k-state-invalid .k-picker-wrap .k-input-validation-icon,
18230
- .k-timepicker.ng-invalid.ng-touched .k-picker-wrap .k-input-validation-icon,
18231
- .k-timepicker.ng-invalid.ng-dirty .k-picker-wrap .k-input-validation-icon {
18232
- color: #f31700;
18233
- }
18234
-
18235
- .k-dateinput .k-dateinput-wrap.k-invalid, .k-dateinput .k-dateinput-wrap.k-state-invalid {
18236
- border-color: rgba(243, 23, 0, 0.5);
18237
- }
18238
-
18239
- .k-dateinput .k-dateinput-wrap.k-invalid .k-input-validation-icon, .k-dateinput .k-dateinput-wrap.k-state-invalid .k-input-validation-icon {
18240
- color: #f31700;
18241
- }
18242
-
18243
- .k-dateinput.k-state-invalid .k-dateinput-wrap, .k-dateinput.ng-invalid.ng-touched .k-dateinput-wrap, .k-dateinput.ng-invalid.ng-dirty .k-dateinput-wrap {
18244
- border-color: rgba(243, 23, 0, 0.5);
18245
- }
18246
-
18247
- .k-dateinput.k-state-invalid .k-dateinput-wrap .k-input-validation-icon, .k-dateinput.ng-invalid.ng-touched .k-dateinput-wrap .k-input-validation-icon, .k-dateinput.ng-invalid.ng-dirty .k-dateinput-wrap .k-input-validation-icon {
18248
- color: #f31700;
18249
- }
18250
-
18251
- .k-datepicker.k-state-hover .k-picker-wrap {
18252
- border-color: rgba(0, 0, 0, 0.16);
18253
- }
18254
-
18255
- .k-datepicker.k-state-focus .k-picker-wrap {
18256
- border-color: rgba(0, 0, 0, 0.16);
18257
- box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
18258
- }
18259
-
18260
- .k-datepicker.k-invalid .k-picker-wrap {
18261
- border-color: rgba(243, 23, 0, 0.5);
18262
- }
18263
-
18264
- .k-datepicker.k-invalid .k-picker-wrap .k-input-validation-icon {
18265
- color: #f31700;
18266
- }
18267
-
18268
- .k-dateinput.k-state-hover .k-dateinput-wrap,
18269
- .k-daterangepicker.k-state-hover .k-dateinput-wrap {
18270
- border-color: rgba(0, 0, 0, 0.16);
18271
- }
18272
-
18273
- .k-dateinput.k-state-focus .k-dateinput-wrap,
18274
- .k-daterangepicker.k-state-focus .k-dateinput-wrap {
18275
- border-color: rgba(0, 0, 0, 0.16);
18276
- box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
18277
- }
18278
-
18279
- .k-dateinput.k-invalid .k-dateinput-wrap,
18280
- .k-daterangepicker.k-invalid .k-dateinput-wrap {
18281
- border-color: rgba(243, 23, 0, 0.5);
18282
- }
18283
-
18284
- .k-dateinput.k-invalid .k-dateinput-wrap .k-input-validation-icon,
18285
- .k-daterangepicker.k-invalid .k-dateinput-wrap .k-input-validation-icon {
18286
- color: #f31700;
18287
- }
18288
-
18289
18249
  .k-dropdowngrid-popup {
18290
18250
  overflow: hidden;
18291
18251
  }
@@ -25927,10 +25887,6 @@ kendo-card-footer {
25927
25887
  opacity: 1;
25928
25888
  }
25929
25889
 
25930
- .k-group-indicator {
25931
- margin-right: 4px;
25932
- }
25933
-
25934
25890
  .k-group-indicator + .k-group-indicator {
25935
25891
  margin-left: 4px;
25936
25892
  }
@@ -28729,18 +28685,6 @@ kendo-grid tr.k-state-hover .k-grid-content-sticky.k-state-selected {
28729
28685
  flex-wrap: wrap;
28730
28686
  }
28731
28687
 
28732
- .k-pivotgrid-configurator-content .k-row-fields > *,
28733
- .k-pivotgrid-configurator-content .k-column-fields > *,
28734
- .k-pivotgrid-configurator-content .k-filter-fields > * {
28735
- margin-bottom: 8px;
28736
- }
28737
-
28738
- .k-pivotgrid-configurator-content .k-row-fields > *:last-child,
28739
- .k-pivotgrid-configurator-content .k-column-fields > *:last-child,
28740
- .k-pivotgrid-configurator-content .k-filter-fields > *:last-child {
28741
- margin-bottom: 0;
28742
- }
28743
-
28744
28688
  .k-pivotgrid-configurator-content .k-value-fields {
28745
28689
  margin: 8px 0px;
28746
28690
  display: flex;
@@ -28766,19 +28710,11 @@ kendo-grid tr.k-state-hover .k-grid-content-sticky.k-state-selected {
28766
28710
  text-align: center;
28767
28711
  }
28768
28712
 
28769
- .k-pivotgrid-configurator-content .k-chip-content {
28770
- padding-inline-end: 4px;
28771
- }
28772
-
28773
28713
  .k-pivotgrid-configurator-content .k-treeview {
28774
28714
  padding: 0px 8px;
28775
28715
  overflow: auto;
28776
28716
  }
28777
28717
 
28778
- .k-pivotgrid-configurator-actions {
28779
- padding: 12px 8px;
28780
- }
28781
-
28782
28718
  .k-calculated-field {
28783
28719
  padding: 16px 16px;
28784
28720
  border-width: 1px;
@@ -29505,7 +29441,8 @@ kendo-grid tr.k-state-hover .k-grid-content-sticky.k-state-selected {
29505
29441
  left: 0;
29506
29442
  }
29507
29443
 
29508
- .k-filter .k-filter-lines .k-filter-item:last-child > .k-filter-toolbar::after {
29444
+ .k-filter .k-filter-lines .k-filter-item:last-child > .k-filter-toolbar::after,
29445
+ .k-filter .k-filter-lines .k-filter-item:last-child > * > .k-filter-toolbar::after {
29509
29446
  content: "";
29510
29447
  position: absolute;
29511
29448
  width: 1px;
@@ -29517,6 +29454,8 @@ kendo-grid tr.k-state-hover .k-grid-content-sticky.k-state-selected {
29517
29454
  .k-filter .k-filter-group-main::before,
29518
29455
  .k-filter .k-filter-group-main > .k-filter-toolbar::before,
29519
29456
  .k-filter .k-filter-group-main > .k-filter-toolbar::after,
29457
+ .k-filter .k-filter-group-main > * > .k-filter-toolbar::before,
29458
+ .k-filter .k-filter-group-main > * > .k-filter-toolbar::after,
29520
29459
  .k-filter .k-filter-lines .k-filter-item:last-child::before {
29521
29460
  display: none;
29522
29461
  }
@@ -29542,8 +29481,11 @@ kendo-grid tr.k-state-hover .k-grid-content-sticky.k-state-selected {
29542
29481
  right: 0;
29543
29482
  }
29544
29483
 
29545
- .k-rtl .k-filter .k-filter-lines .k-filter-item:last-child > .k-filter-toolbar::after, .k-filter[dir="rtl"] .k-filter-lines .k-filter-item:last-child > .k-filter-toolbar::after,
29546
- [dir="rtl"] .k-filter .k-filter-lines .k-filter-item:last-child > .k-filter-toolbar::after {
29484
+ .k-rtl .k-filter .k-filter-lines .k-filter-item:last-child > .k-filter-toolbar::after,
29485
+ .k-rtl .k-filter .k-filter-lines .k-filter-item:last-child > * > .k-filter-toolbar::after, .k-filter[dir="rtl"] .k-filter-lines .k-filter-item:last-child > .k-filter-toolbar::after,
29486
+ .k-filter[dir="rtl"] .k-filter-lines .k-filter-item:last-child > * > .k-filter-toolbar::after,
29487
+ [dir="rtl"] .k-filter .k-filter-lines .k-filter-item:last-child > .k-filter-toolbar::after,
29488
+ [dir="rtl"] .k-filter .k-filter-lines .k-filter-item:last-child > * > .k-filter-toolbar::after {
29547
29489
  left: auto;
29548
29490
  right: -8px;
29549
29491
  }
@@ -29562,7 +29504,8 @@ kendo-grid tr.k-state-hover .k-grid-content-sticky.k-state-selected {
29562
29504
 
29563
29505
  .k-filter .k-filter-item::before,
29564
29506
  .k-filter .k-filter-toolbar::before,
29565
- .k-filter .k-filter-lines .k-filter-item:last-child > .k-filter-toolbar::after {
29507
+ .k-filter .k-filter-lines .k-filter-item:last-child > .k-filter-toolbar::after,
29508
+ .k-filter .k-filter-lines .k-filter-item:last-child > * > .k-filter-toolbar::after {
29566
29509
  background-color: rgba(0, 0, 0, 0.08);
29567
29510
  }
29568
29511
 
@@ -34840,7 +34783,7 @@ ul.k-scheduler-views li:focus, ul.k-scheduler-views li.k-state-focus, ul.k-sched
34840
34783
 
34841
34784
  kendo-scrollview.k-scrollview-wrap,
34842
34785
  kendo-scrollview.k-scrollview,
34843
- .k-widget.k-scrollview {
34786
+ .k-scrollview {
34844
34787
  border-width: 1px;
34845
34788
  border-style: solid;
34846
34789
  box-sizing: border-box;
@@ -34904,6 +34847,11 @@ kendo-scrollview.k-scrollview,
34904
34847
  flex: 0 0 calc(100%/var(--kendo-scrollview-views, 1));
34905
34848
  }
34906
34849
 
34850
+ [dir="rtl"] .k-scrollview-wrap.k-scrollview-animate,
34851
+ .k-rtl .k-scrollview-wrap.k-scrollview-animate {
34852
+ transform: translateX(calc(100%/var(--kendo-scrollview-views, 1)*(var(--kendo-scrollview-current, 1) - 1)));
34853
+ }
34854
+
34907
34855
  kendo-scrollview.k-scrollview-wrap kendo-scrollview-pager,
34908
34856
  kendo-scrollview.k-scrollview kendo-scrollview-pager,
34909
34857
  .k-scrollview-nav-wrap {