@syncfusion/blazor-themes 25.1.39 → 25.1.40

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 (73) hide show
  1. package/SCSS-Themes/bds-dark.scss +331 -429
  2. package/SCSS-Themes/bds.scss +331 -429
  3. package/SCSS-Themes/bootstrap-dark.scss +331 -429
  4. package/SCSS-Themes/bootstrap.scss +331 -429
  5. package/SCSS-Themes/bootstrap4.scss +331 -429
  6. package/SCSS-Themes/bootstrap5-dark.scss +331 -429
  7. package/SCSS-Themes/bootstrap5.scss +331 -429
  8. package/SCSS-Themes/fabric-dark.scss +331 -429
  9. package/SCSS-Themes/fabric.scss +331 -429
  10. package/SCSS-Themes/fluent-dark.scss +331 -429
  11. package/SCSS-Themes/fluent.scss +331 -429
  12. package/SCSS-Themes/grids/grid/bds-dark.scss +10 -2
  13. package/SCSS-Themes/grids/grid/bds.scss +10 -2
  14. package/SCSS-Themes/grids/grid/bootstrap-dark.scss +10 -2
  15. package/SCSS-Themes/grids/grid/bootstrap.scss +10 -2
  16. package/SCSS-Themes/grids/grid/bootstrap4.scss +10 -2
  17. package/SCSS-Themes/grids/grid/bootstrap5-dark.scss +10 -2
  18. package/SCSS-Themes/grids/grid/bootstrap5.scss +10 -2
  19. package/SCSS-Themes/grids/grid/fabric-dark.scss +10 -2
  20. package/SCSS-Themes/grids/grid/fabric.scss +10 -2
  21. package/SCSS-Themes/grids/grid/fluent-dark.scss +10 -2
  22. package/SCSS-Themes/grids/grid/fluent.scss +10 -2
  23. package/SCSS-Themes/grids/grid/highcontrast.scss +10 -2
  24. package/SCSS-Themes/grids/grid/material-dark.scss +10 -2
  25. package/SCSS-Themes/grids/grid/material.scss +10 -2
  26. package/SCSS-Themes/grids/grid/material3-dark.scss +10 -2
  27. package/SCSS-Themes/grids/grid/material3.scss +10 -2
  28. package/SCSS-Themes/grids/grid/tailwind-dark.scss +10 -2
  29. package/SCSS-Themes/grids/grid/tailwind.scss +10 -2
  30. package/SCSS-Themes/highcontrast.scss +331 -429
  31. package/SCSS-Themes/material-dark.scss +331 -429
  32. package/SCSS-Themes/material.scss +331 -429
  33. package/SCSS-Themes/material3-dark.scss +331 -429
  34. package/SCSS-Themes/material3.scss +331 -429
  35. package/SCSS-Themes/navigations/stepper/bds-dark.scss +323 -429
  36. package/SCSS-Themes/navigations/stepper/bds.scss +323 -429
  37. package/SCSS-Themes/navigations/stepper/bootstrap-dark.scss +323 -429
  38. package/SCSS-Themes/navigations/stepper/bootstrap.scss +323 -429
  39. package/SCSS-Themes/navigations/stepper/bootstrap4.scss +323 -429
  40. package/SCSS-Themes/navigations/stepper/bootstrap5-dark.scss +323 -429
  41. package/SCSS-Themes/navigations/stepper/bootstrap5.scss +323 -429
  42. package/SCSS-Themes/navigations/stepper/fabric-dark.scss +323 -429
  43. package/SCSS-Themes/navigations/stepper/fabric.scss +323 -429
  44. package/SCSS-Themes/navigations/stepper/fluent-dark.scss +323 -429
  45. package/SCSS-Themes/navigations/stepper/fluent.scss +323 -429
  46. package/SCSS-Themes/navigations/stepper/highcontrast.scss +323 -429
  47. package/SCSS-Themes/navigations/stepper/material-dark.scss +323 -429
  48. package/SCSS-Themes/navigations/stepper/material.scss +323 -429
  49. package/SCSS-Themes/navigations/stepper/material3-dark.scss +323 -429
  50. package/SCSS-Themes/navigations/stepper/material3.scss +323 -429
  51. package/SCSS-Themes/navigations/stepper/tailwind-dark.scss +323 -429
  52. package/SCSS-Themes/navigations/stepper/tailwind.scss +323 -429
  53. package/SCSS-Themes/splitbuttons/button-group/bds-dark.scss +1 -1
  54. package/SCSS-Themes/splitbuttons/button-group/bds.scss +1 -1
  55. package/SCSS-Themes/splitbuttons/button-group/bootstrap-dark.scss +1 -1
  56. package/SCSS-Themes/splitbuttons/button-group/bootstrap.scss +1 -1
  57. package/SCSS-Themes/splitbuttons/button-group/bootstrap4.scss +1 -1
  58. package/SCSS-Themes/splitbuttons/button-group/bootstrap5-dark.scss +1 -1
  59. package/SCSS-Themes/splitbuttons/button-group/bootstrap5.scss +1 -1
  60. package/SCSS-Themes/splitbuttons/button-group/fabric-dark.scss +1 -1
  61. package/SCSS-Themes/splitbuttons/button-group/fabric.scss +1 -1
  62. package/SCSS-Themes/splitbuttons/button-group/fluent-dark.scss +1 -1
  63. package/SCSS-Themes/splitbuttons/button-group/fluent.scss +1 -1
  64. package/SCSS-Themes/splitbuttons/button-group/highcontrast.scss +1 -1
  65. package/SCSS-Themes/splitbuttons/button-group/material-dark.scss +1 -1
  66. package/SCSS-Themes/splitbuttons/button-group/material.scss +1 -1
  67. package/SCSS-Themes/splitbuttons/button-group/material3-dark.scss +1 -1
  68. package/SCSS-Themes/splitbuttons/button-group/material3.scss +1 -1
  69. package/SCSS-Themes/splitbuttons/button-group/tailwind-dark.scss +1 -1
  70. package/SCSS-Themes/splitbuttons/button-group/tailwind.scss +1 -1
  71. package/SCSS-Themes/tailwind-dark.scss +331 -429
  72. package/SCSS-Themes/tailwind.scss +331 -429
  73. package/package.json +1 -1
@@ -57676,12 +57676,11 @@ $step-selected-active-color: $selection-bg !default;
57676
57676
  .e-stepper {
57677
57677
  position: relative;
57678
57678
  &.e-stepper-readonly,
57679
- .e-stepper-steps .e-step-container.e-step-disabled {
57679
+ .e-step-disabled {
57680
57680
  cursor: default;
57681
57681
  pointer-events: none;
57682
57682
  }
57683
-
57684
- &.e-step-type-indicator .e-stepper-steps .e-step-container {
57683
+ &.e-step-type-indicator .e-step-container {
57685
57684
  &:not(.e-step-icon.e-step-label.e-step-text) {
57686
57685
  .e-icons.e-step-indicator {
57687
57686
  font-size: $stepper-step-width;
@@ -57694,12 +57693,12 @@ $step-selected-active-color: $selection-bg !default;
57694
57693
  }
57695
57694
 
57696
57695
  //For Blazor Stepper Tooltip
57697
- .e-stepper-steps .e-step-container:has(.e-tooltip-wrap.e-stepper-tooltip),
57698
- &.e-vertical.e-label-after .e-stepper-steps .e-step-container.e-step-icon.e-step-label:has(.e-tooltip-wrap.e-stepper-tooltip),
57699
- &.e-vertical.e-label-before .e-stepper-steps .e-step-container.e-step-icon.e-step-label:has(.e-tooltip-wrap.e-stepper-tooltip) {
57696
+ .e-step-container:has(.e-tooltip-wrap.e-stepper-tooltip),
57697
+ &.e-vertical.e-label-after .e-step-icon.e-step-label:has(.e-tooltip-wrap.e-stepper-tooltip),
57698
+ &.e-vertical.e-label-before .e-step-icon.e-step-label:has(.e-tooltip-wrap.e-stepper-tooltip) {
57700
57699
  position: relative;
57701
57700
  }
57702
- &.e-horizontal .e-stepper-steps .e-step-container.e-step-icon.e-step-label:has(.e-tooltip-wrap.e-stepper-tooltip) {
57701
+ &.e-horizontal .e-step-icon.e-step-label:has(.e-tooltip-wrap.e-stepper-tooltip) {
57703
57702
  position: unset;
57704
57703
  }
57705
57704
  .e-tooltip-wrap.e-stepper-tooltip {
@@ -57724,15 +57723,14 @@ $step-selected-active-color: $selection-bg !default;
57724
57723
  top: -6px;
57725
57724
  }
57726
57725
  }
57727
- .e-stepper-steps .e-step-container.e-step-icon.e-step-label .e-tooltip-wrap.e-stepper-tooltip {
57726
+ .e-step-icon.e-step-label .e-tooltip-wrap.e-stepper-tooltip {
57728
57727
  left: unset;
57729
57728
  top: 0;
57730
57729
  transform: translate(0%, -135%);
57731
57730
  }
57732
- &.e-step-type-indicator .e-stepper-steps .e-step-container .e-tooltip-wrap.e-stepper-tooltip {
57731
+ &.e-step-type-indicator .e-tooltip-wrap.e-stepper-tooltip {
57733
57732
  transform: translate(-50%, -115%);
57734
57733
  }
57735
-
57736
57734
  .e-stepper-steps {
57737
57735
  display: flex;
57738
57736
  padding: 0;
@@ -57740,124 +57738,170 @@ $step-selected-active-color: $selection-bg !default;
57740
57738
  justify-content: space-between;
57741
57739
  position: relative;
57742
57740
  align-items: flex-start;
57743
- .e-step-container {
57744
- max-width: var(--max-width);
57745
- &.e-step-notstarted:not(.e-step-disabled) .e-step,
57746
- &.e-step-notstarted:not(.e-step-disabled) .e-indicator {
57747
- border: $step-border;
57748
- }
57749
- .e-step-label-container,
57750
- .e-step-text-container {
57751
- max-width: clamp(100%, 10em, 100%);
57752
- white-space: nowrap;
57753
- }
57754
- .e-step-label-optional {
57755
- font-size: $stepper-optional-size;
57756
- flex-basis: 100%;
57757
- }
57758
- .e-step-optional-container {
57759
- display: flex;
57760
- flex-direction: column;
57741
+ .e-step-container,
57742
+ .e-step,
57743
+ .e-step-valid.e-step-text.e-step-text-only .e-step-text-container,
57744
+ .e-step-error.e-step-text.e-step-text-only .e-step-text-container,
57745
+ .e-step-label-container {
57746
+ display: flex;
57747
+ align-items: center;
57748
+ justify-content: center;
57749
+ }
57750
+ }
57751
+ .e-step-container {
57752
+ max-width: var(--max-width);
57753
+ list-style-type: none;
57754
+ cursor: pointer;
57755
+ text-align: center;
57756
+ .e-step-label-container,
57757
+ .e-step-text-container {
57758
+ max-width: clamp(100%, 10em, 100%);
57759
+ white-space: nowrap;
57760
+ }
57761
+ .e-step-label-optional {
57762
+ font-size: $stepper-optional-size;
57763
+ flex-basis: 100%;
57764
+ }
57765
+ .e-step-optional-container {
57766
+ display: flex;
57767
+ flex-direction: column;
57768
+ }
57769
+ .e-step-content {
57770
+ font-size: $stepper-icon-size;
57771
+ line-height: 0;
57772
+ }
57773
+ .e-indicator {
57774
+ font-size: $stepper-icon-size;
57775
+ }
57776
+ &:not(.e-step-text-only) > .e-step-text-container {
57777
+ padding: $stepper-icon-text-padding;
57778
+ }
57779
+ &.e-step-text-only .e-step-text-container,
57780
+ &.e-step-label-only .e-step-label-container {
57781
+ padding: $stepper-text-padding;
57782
+ padding-block: 5px;
57783
+ }
57784
+ &.e-step-text-only.e-step-error .e-step-text-container,
57785
+ &.e-step-text-only.e-step-valid .e-step-text-container,
57786
+ &.e-step-label-only.e-step-error .e-step-label-container,
57787
+ &.e-step-label-only.e-step-valid .e-step-label-container {
57788
+ flex-direction: column;
57789
+ .e-step-validation-icon {
57790
+ position: relative;
57791
+ top: $stepper-validation-position;
57761
57792
  }
57762
57793
  }
57794
+ .e-step-label-container,
57795
+ .e-step-text-container {
57796
+ font-size: $stepper-text-size;
57797
+ }
57798
+ .e-step,
57799
+ .e-indicator {
57800
+ border-radius: $stepper-step-radius;
57801
+ min-width: $stepper-step-width;
57802
+ min-height: $stepper-step-width;
57803
+ }
57804
+ }
57805
+ .e-step-notstarted:not(.e-step-disabled) .e-step,
57806
+ .e-step-notstarted:not(.e-step-disabled) .e-indicator {
57807
+ border: $step-border;
57763
57808
  }
57764
-
57765
57809
  &.e-horizontal {
57766
57810
  display: block;
57767
57811
  .e-stepper-steps {
57768
57812
  flex-direction: row;
57769
57813
  }
57770
-
57771
57814
  &.e-label-before,
57772
57815
  &.e-label-after {
57773
- &:has(.e-stepper-steps .e-step-container.e-step-icon.e-step-label:not(.e-step-text)) .e-stepper-progressbar {
57816
+ &:has(.e-step-icon.e-step-label:not(.e-step-text)) .e-stepper-progressbar {
57774
57817
  margin-left: var(--progress-left-position);
57775
57818
  top: var(--progress-top-position);
57776
57819
  width: var(--progress-bar-width);
57777
57820
  }
57778
57821
  }
57779
-
57780
57822
  &.e-label-before.e-rtl,
57781
57823
  &.e-label-after.e-rtl {
57782
- &:has(.e-stepper-steps .e-step-container.e-step-icon.e-step-label:not(.e-step-text)) .e-stepper-progressbar {
57824
+ &:has(.e-step-icon.e-step-label:not(.e-step-text)) .e-stepper-progressbar {
57783
57825
  margin-right: var(--progress-left-position);
57784
57826
  margin-left: unset;
57785
57827
  }
57786
57828
  }
57787
- }
57788
-
57789
- &.e-horizontal .e-stepper-steps .e-step-container {
57790
- &.e-step-icon.e-step-label {
57829
+ .e-step-icon.e-step-label {
57791
57830
  gap: 1em;
57831
+ flex-direction: column;
57792
57832
  }
57793
-
57794
- &.e-step-icon.e-step-label .e-step-label-container {
57833
+ .e-step-icon.e-step-label .e-step-label-container {
57795
57834
  position: relative;
57796
57835
  &.e-label-before {
57797
57836
  order: -1;
57798
57837
  }
57799
57838
  }
57800
-
57801
- &.e-step-text.e-step-label,
57802
- &.e-step-icon.e-step-label {
57803
- flex-direction: column;
57839
+ &.e-label-start .e-step-text-container {
57840
+ order: $stepper-label-order;
57804
57841
  }
57805
- }
57806
-
57807
- &.e-horizontal.e-label-start .e-stepper-steps .e-step-container .e-step-text-container {
57808
- order: $stepper-label-order;
57809
- }
57810
-
57811
- &.e-horizontal .e-stepper-steps .e-step-container.e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
57812
- position: absolute;
57813
- top: 2.5em;
57814
- margin-left: 2.5em;
57815
- }
57816
-
57817
- &.e-horizontal.e-label-start .e-stepper-steps .e-step-container.e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional,
57818
- &.e-horizontal.e-rtl .e-stepper-steps .e-step-container.e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
57819
- margin-right: 2.5em;
57820
- margin-left: unset;
57821
- }
57822
-
57823
- &.e-horizontal.e-label-start.e-rtl .e-stepper-steps .e-step-container.e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
57824
- margin-right: unset;
57825
- margin-left: 2.5em;
57826
- }
57827
-
57828
- &.e-horizontal.e-label-before .e-stepper-steps {
57829
- &:has(.e-step-label-optional) {
57830
- align-items: flex-end;
57842
+ .e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
57843
+ position: absolute;
57844
+ top: 2.5em;
57845
+ margin-left: 2.5em;
57831
57846
  }
57832
- .e-step-container .e-step-label-container.e-label-before:has(.e-step-label-optional) {
57833
- flex-direction: column;
57834
- gap: .5em;
57847
+ &.e-label-start .e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional,
57848
+ &.e-rtl .e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
57849
+ margin-right: 2.5em;
57850
+ margin-left: unset;
57851
+ }
57852
+ &.e-label-start.e-rtl .e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
57853
+ margin-right: unset;
57854
+ margin-left: 2.5em;
57855
+ }
57856
+ &.e-label-before .e-stepper-steps {
57857
+ &:has(.e-step-label-optional) {
57858
+ align-items: flex-end;
57859
+ }
57860
+ .e-step-label-container.e-label-before:has(.e-step-label-optional) {
57861
+ flex-direction: column;
57862
+ gap: .5em;
57863
+ }
57864
+ }
57865
+ .e-text,
57866
+ .e-label,
57867
+ .e-step-label-optional {
57868
+ text-overflow: ellipsis;
57869
+ overflow: hidden;
57870
+ }
57871
+ .e-step-text.e-step-text-only:has(.e-step-label-optional),
57872
+ .e-step-label.e-step-label-only:has(.e-step-label-optional),
57873
+ .e-step-icon:not(.e-step-text):not(.e-step-label):has(.e-step-label-optional),
57874
+ .e-step-label-container.e-label-after:has(.e-step-label-optional) {
57875
+ flex-wrap: wrap;
57876
+ }
57877
+ &.e-step-type-indicator .e-step-container {
57878
+ flex-wrap: wrap;
57879
+ }
57880
+ .e-step-icon:not(.e-step-label):not(.e-step-text) .e-step-label-optional {
57881
+ margin-top: .5em;
57882
+ }
57883
+ &.e-label-after .e-step-icon.e-step-label:not(.e-step-text) .e-step-label-optional {
57884
+ margin-top: .2em;
57835
57885
  }
57836
57886
  }
57837
-
57838
57887
  &.e-vertical {
57839
57888
  min-height: inherit;
57840
57889
  display: inline-block;
57841
-
57842
- .e-stepper-steps .e-step-container.e-step-label.e-step-label-only,
57843
- .e-stepper-steps .e-step-container.e-step-template {
57890
+ .e-step-label.e-step-label-only,
57891
+ .e-step-template {
57844
57892
  position: relative;
57845
57893
  }
57846
-
57847
- &:not(.e-label-top):not(.e-label-bottom) .e-stepper-steps .e-step-container .e-step-label-optional {
57894
+ &:not(.e-label-top):not(.e-label-bottom) .e-step-label-optional {
57848
57895
  position: absolute;
57849
57896
  }
57850
-
57851
- &:not(.e-label-bottom):not(.e-label-top) .e-stepper-steps .e-step-container.e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
57897
+ &:not(.e-label-bottom):not(.e-label-top) .e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
57852
57898
  margin-top: $stepper-label-optional;
57853
57899
  margin-left: 4em;
57854
57900
  }
57855
-
57856
- &.e-rtl:not(.e-label-bottom):not(.e-label-top) .e-stepper-steps .e-step-container.e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
57901
+ &.e-rtl:not(.e-label-bottom):not(.e-label-top) .e-step-icon.e-step-text:not(.e-step-label) .e-step-label-optional {
57857
57902
  margin-left: unset;
57858
57903
  margin-right: 4em;
57859
57904
  }
57860
-
57861
57905
  .e-stepper-steps {
57862
57906
  flex-direction: column;
57863
57907
  min-height: inherit;
@@ -57866,49 +57910,42 @@ $step-selected-active-color: $selection-bg !default;
57866
57910
  margin: $stepper-ol-padding;
57867
57911
  justify-content: space-between;
57868
57912
  }
57869
-
57870
57913
  &.e-rtl .e-stepper-steps {
57871
57914
  float: right;
57872
57915
  }
57873
-
57874
- .e-stepper-steps:has(.e-step-container.e-step-icon:not(.e-step-text):not(.e-step-label)),
57875
- .e-stepper-steps:has(.e-step-container.e-step-text.e-step-text-only:not(.e-step-icon.e-step-label)),
57876
- .e-stepper-steps:has(.e-step-container.e-step-label.e-step-label-only:not(.e-step-icon.e-step-text)),
57877
- &.e-label-after .e-stepper-steps:has(.e-step-container.e-step-label.e-step-text:not(.e-step-icon)),
57916
+ .e-stepper-steps:has(.e-step-icon:not(.e-step-text):not(.e-step-label)),
57917
+ .e-stepper-steps:has(.e-step-text.e-step-text-only),
57918
+ .e-stepper-steps:has(.e-step-label.e-step-label-only),
57919
+ &.e-label-after .e-stepper-steps:has(.e-step-label.e-step-text:not(.e-step-icon)),
57878
57920
  &.e-step-type-indicator .e-stepper-steps {
57879
57921
  align-items: center;
57880
57922
  }
57881
-
57882
- .e-stepper-steps .e-step-container.e-step-icon.e-step-text:not(.e-step-label) .e-step-text-container,
57883
- .e-stepper-steps .e-step-container.e-step-icon.e-step-label:not(.e-step-text) .e-step-label-container.e-label-after {
57923
+ .e-step-icon.e-step-text:not(.e-step-label) .e-step-text-container,
57924
+ .e-step-icon.e-step-label:not(.e-step-text) .e-step-label-container.e-label-after {
57884
57925
  margin-left: $stepper-text-postion;
57885
57926
  }
57886
-
57887
57927
  &.e-rtl {
57888
- .e-stepper-steps .e-step-container.e-step-icon.e-step-text:not(.e-step-label) .e-step-text-container,
57889
- .e-stepper-steps .e-step-container.e-step-icon.e-step-label:not(.e-step-text) .e-step-label-container.e-label-after {
57928
+ .e-step-icon.e-step-text:not(.e-step-label) .e-step-text-container,
57929
+ .e-step-icon.e-step-label:not(.e-step-text) .e-step-label-container.e-label-after {
57890
57930
  margin-left: unset;
57891
57931
  margin-right: $stepper-text-postion;
57892
57932
  }
57893
57933
  }
57894
-
57895
- .e-stepper-steps .e-step-container.e-step-icon:not(.e-step-label):not(.e-step-text):has(.e-step-label-optional),
57896
- &.e-label-before .e-stepper-steps .e-step-container .e-step-label-container.e-label-before:has(.e-step-label-optional),
57897
- .e-stepper-steps .e-step-container.e-step-text-only.e-step-text:has(.e-step-label-optional),
57898
- .e-stepper-steps .e-step-container.e-step-label-only.e-step-label:has(.e-step-label-optional) {
57934
+ .e-step-icon:not(.e-step-label):not(.e-step-text):has(.e-step-label-optional),
57935
+ &.e-label-before .e-step-label-container.e-label-before:has(.e-step-label-optional),
57936
+ .e-step-text-only.e-step-text:has(.e-step-label-optional),
57937
+ .e-step-label-only.e-step-label:has(.e-step-label-optional) {
57899
57938
  flex-direction: column;
57900
57939
  .e-step-label-optional {
57901
57940
  position: unset;
57902
57941
  }
57903
57942
  }
57904
-
57905
- .e-stepper-steps .e-step-container.e-step-icon:not(.e-step-label):not(.e-step-text):has(.e-step-label-optional),
57906
- &.e-label-before .e-stepper-steps .e-step-container .e-step-label-container.e-label-before:has(.e-step-label-optional) {
57943
+ .e-step-icon:not(.e-step-label):not(.e-step-text):has(.e-step-label-optional),
57944
+ &.e-label-before .e-step-label-container.e-label-before:has(.e-step-label-optional) {
57907
57945
  gap: .5em;
57908
57946
  }
57909
-
57910
- &.e-label-before .e-stepper-steps .e-step-container.e-step-icon.e-step-label,
57911
- &.e-label-after .e-stepper-steps .e-step-container.e-step-icon.e-step-label {
57947
+ &.e-label-before .e-step-icon.e-step-label,
57948
+ &.e-label-after .e-step-icon.e-step-label {
57912
57949
  .e-step-label-container.e-label-after:has(.e-step-label-optional) {
57913
57950
  flex-direction: column;
57914
57951
  .e-label {
@@ -57919,43 +57956,37 @@ $step-selected-active-color: $selection-bg !default;
57919
57956
  position: unset;
57920
57957
  }
57921
57958
  }
57922
-
57923
- .e-stepper-steps .e-step-container {
57959
+ .e-step-container {
57924
57960
  &.e-step-label.e-step-text:not(.e-step-icon) .e-step-label-container.e-label-after {
57925
57961
  position: absolute;
57926
57962
  .e-step-label-optional {
57927
57963
  left: $stepper-ol-padding;
57928
57964
  }
57929
57965
  }
57930
-
57931
57966
  .e-step-label-container.e-label-after {
57932
57967
  .e-step-label-optional {
57933
57968
  font-size: $stepper-optional-size;
57934
57969
  }
57935
57970
  }
57936
-
57937
57971
  .e-step-label-container.e-label-before .e-label {
57938
57972
  width: var(--label-width);
57939
57973
  }
57940
-
57941
57974
  &:not(.e-step-text-only) .e-step-text-container {
57942
57975
  border: none;
57943
57976
  border-radius: unset;
57944
57977
  padding: $stepper-text-vert-padding;
57945
57978
  }
57946
-
57947
- &.e-step-text-only:not(.e-step-icon.e-step-label) .e-step-text-container,
57948
- &.e-step-label-only:not(.e-step-icon.e-step-text) .e-step-label-container {
57979
+ &.e-step-text-only .e-step-text-container,
57980
+ &.e-step-label-only .e-step-label-container {
57949
57981
  position: unset;
57950
57982
  }
57951
57983
  }
57952
57984
  &.e-label-top {
57953
- .e-stepper-steps .e-step-container .e-step-label-optional {
57985
+ .e-step-label-optional {
57954
57986
  padding-bottom: 6px;
57955
57987
  }
57956
57988
  }
57957
57989
  }
57958
-
57959
57990
  &.e-vertical.e-label-top,
57960
57991
  &.e-vertical.e-label-bottom {
57961
57992
  .e-stepper-steps {
@@ -57963,98 +57994,17 @@ $step-selected-active-color: $selection-bg !default;
57963
57994
  .e-step-container {
57964
57995
  flex-direction: column;
57965
57996
  .e-step-text-container {
57966
- margin-left: $stepper-ol-padding !important; /* stylelint-disable-line declaration-no-important */
57997
+ margin-left: $stepper-ol-padding;
57967
57998
  }
57968
57999
  }
57969
58000
  }
57970
58001
  }
57971
-
57972
- &.e-vertical.e-label-top .e-stepper-steps .e-step-container {
58002
+ &.e-vertical.e-label-top .e-step-container {
57973
58003
  .e-step-label-optional,
57974
58004
  .e-step-text-container {
57975
58005
  order: $stepper-label-order;
57976
58006
  }
57977
58007
  }
57978
- .e-stepper-steps {
57979
- .e-step-container,
57980
- .e-step-container .e-step,
57981
- .e-step-container.e-step-valid.e-step-text.e-step-text-only:not(.e-step-icon.e-step-label) .e-step-text-container,
57982
- .e-step-container.e-step-error.e-step-text.e-step-text-only:not(.e-step-icon.e-step-label) .e-step-text-container,
57983
- .e-step-container .e-step-label-container {
57984
- display: flex;
57985
- align-items: center;
57986
- justify-content: center;
57987
- }
57988
- }
57989
-
57990
- &.e-horizontal {
57991
- .e-stepper-steps {
57992
- .e-step-container.e-step-text.e-step-text-only:not(.e-step-icon.e-step-label):has(.e-step-label-optional),
57993
- .e-step-container.e-step-label.e-step-label-only:not(.e-step-icon.e-step-label):has(.e-step-label-optional),
57994
- .e-step-container.e-step-icon:not(.e-step-text):not(.e-step-label):has(.e-step-label-optional),
57995
- .e-step-container .e-step-label-container.e-label-after:has(.e-step-label-optional) {
57996
- flex-wrap: wrap;
57997
- }
57998
- }
57999
- &.e-step-type-indicator .e-step-container {
58000
- flex-wrap: wrap;
58001
- }
58002
- }
58003
-
58004
- &.e-horizontal .e-stepper-steps .e-step-container.e-step-icon:not(.e-step-label):not(.e-step-text) .e-step-label-optional {
58005
- margin-top: .5em;
58006
- }
58007
-
58008
- &.e-horizontal.e-label-after .e-stepper-steps .e-step-container.e-step-icon.e-step-label:not(.e-step-text) .e-step-label-optional {
58009
- margin-top: .2em;
58010
- }
58011
-
58012
- .e-stepper-steps .e-step-container {
58013
- list-style-type: none;
58014
- cursor: pointer;
58015
- text-align: center;
58016
-
58017
- .e-step-content {
58018
- font-size: $stepper-icon-size;
58019
- line-height: 0;
58020
- }
58021
-
58022
- .e-indicator {
58023
- font-size: $stepper-icon-size;
58024
- }
58025
-
58026
- &:not(.e-step-text-only) > .e-step-text-container {
58027
- padding: $stepper-icon-text-padding;
58028
- }
58029
-
58030
- &.e-step-text-only:not(.e-step-icon.e-step-label) .e-step-text-container,
58031
- &.e-step-label-only:not(.e-step-icon.e-step-text) .e-step-label-container {
58032
- padding: $stepper-text-padding;
58033
- padding-block: 5px;
58034
- }
58035
-
58036
- &.e-step-text-only.e-step-error:not(.e-step-icon.e-step-label) .e-step-text-container,
58037
- &.e-step-text-only.e-step-valid:not(.e-step-icon.e-step-label) .e-step-text-container,
58038
- &.e-step-label-only.e-step-error:not(.e-step-icon.e-step-text) .e-step-label-container,
58039
- &.e-step-label-only.e-step-valid:not(.e-step-icon.e-step-text) .e-step-label-container {
58040
- flex-direction: column;
58041
- .e-step-validation-icon {
58042
- position: relative;
58043
- top: $stepper-validation-position;
58044
- }
58045
- }
58046
- .e-step-label-container,
58047
- .e-step-text-container {
58048
- font-size: $stepper-text-size;
58049
- }
58050
- .e-step,
58051
- .e-indicator {
58052
- border-radius: $stepper-step-radius;
58053
- min-width: $stepper-step-width;
58054
- min-height: $stepper-step-width;
58055
- }
58056
- }
58057
-
58058
58008
  .e-stepper-progressbar {
58059
58009
  height: $stepper-progress-bar-height;
58060
58010
  position: absolute;
@@ -58069,7 +58019,6 @@ $step-selected-active-color: $selection-bg !default;
58069
58019
  transition-delay: var(--delay);
58070
58020
  }
58071
58021
  }
58072
-
58073
58022
  &.e-vertical .e-stepper-progressbar {
58074
58023
  min-height: inherit;
58075
58024
  width: $stepper-progress-bar-height;
@@ -58082,40 +58031,26 @@ $step-selected-active-color: $selection-bg !default;
58082
58031
  transition-property: height;
58083
58032
  }
58084
58033
  }
58085
-
58086
58034
  &.e-vertical.e-rtl .e-stepper-progressbar {
58087
58035
  right: var(--progress-position);
58088
58036
  left: unset;
58089
58037
  }
58090
-
58091
- &:not(.e-steps-focus):not(.e-step-type-label):not(.e-step-type-indicator) .e-stepper-steps .e-step-container:not(.e-step-text-only):not(.e-step-label-only) .e-indicator,
58092
- .e-stepper-steps .e-step-container.e-step-focus .e-indicator {
58038
+ &:not(.e-steps-focus):not(.e-step-type-label):not(.e-step-type-indicator) .e-step-container .e-indicator,
58039
+ .e-step-focus .e-indicator {
58093
58040
  z-index: 0;
58094
58041
  }
58095
-
58096
- .e-stepper-steps .e-step-container.e-step-template.e-step-focus {
58042
+ .e-step-template.e-step-focus {
58097
58043
  outline: $stepper-temp-outline-width;
58098
58044
  }
58099
58045
  }
58100
-
58101
58046
  .e-tooltip-wrap.e-stepper-tooltip.e-step-inprogress-tip {
58102
58047
  .e-arrow-tip.e-tip-bottom {
58103
58048
  top: 90% !important; /* stylelint-disable-line declaration-no-important */
58104
58049
  }
58105
58050
  }
58106
-
58107
- .e-stepper.e-horizontal .e-stepper-steps .e-step-container {
58108
- .e-text,
58109
- .e-label,
58110
- .e-step-label-optional {
58111
- text-overflow: ellipsis;
58112
- overflow: hidden;
58113
- }
58114
- }
58115
-
58116
58051
  .e-small.e-stepper,
58117
58052
  .e-small .e-stepper {
58118
- &.e-step-type-indicator .e-stepper-steps .e-step-container:not(.e-step-icon.e-step-label.e-step-text) {
58053
+ &.e-step-type-indicator .e-step-container:not(.e-step-icon.e-step-label.e-step-text) {
58119
58054
  .e-icons.e-step-indicator {
58120
58055
  font-size: $stepper-small-step-width;
58121
58056
  }
@@ -58124,39 +58059,33 @@ $step-selected-active-color: $selection-bg !default;
58124
58059
  height: $stepper-small-step-width;
58125
58060
  }
58126
58061
  }
58127
-
58128
- .e-stepper-steps .e-step-container {
58062
+ .e-step-container {
58129
58063
  .e-step,
58130
58064
  .e-indicator {
58131
58065
  min-width: $stepper-small-step-width;
58132
58066
  min-height: $stepper-small-step-width;
58133
58067
  }
58134
-
58135
58068
  .e-indicator {
58136
58069
  font-size: $stepper-small-icon-size;
58137
58070
  }
58138
-
58139
58071
  .e-step-text-container,
58140
58072
  .e-step-label-container {
58141
58073
  font-size: $stepper-small-text-size;
58142
58074
  }
58143
-
58144
58075
  .e-step-content {
58145
58076
  font-size: $stepper-small-icon-size;
58146
58077
  }
58147
-
58148
58078
  .e-step-label-optional {
58149
58079
  font-size: $stepper-small-optional-size;
58150
58080
  }
58151
58081
  }
58152
- &.e-vertical .e-stepper-steps .e-step-container .e-step-label-container.e-label-after .e-step-label-optional {
58082
+ &.e-vertical .e-step-label-container.e-label-after .e-step-label-optional {
58153
58083
  font-size: $stepper-small-optional-size;
58154
58084
  }
58155
58085
  }
58156
-
58157
58086
  .e-bigger.e-stepper,
58158
58087
  .e-bigger .e-stepper {
58159
- &.e-step-type-indicator .e-stepper-steps .e-step-container:not(.e-step-icon.e-step-label.e-step-text) {
58088
+ &.e-step-type-indicator .e-step-container:not(.e-step-icon.e-step-label.e-step-text) {
58160
58089
  .e-icons.e-step-indicator {
58161
58090
  font-size: $stepper-bigger-step-width;
58162
58091
  }
@@ -58165,32 +58094,27 @@ $step-selected-active-color: $selection-bg !default;
58165
58094
  height: $stepper-bigger-step-width;
58166
58095
  }
58167
58096
  }
58168
-
58169
- .e-stepper-steps .e-step-container {
58097
+ .e-step-container {
58170
58098
  .e-step,
58171
58099
  .e-indicator {
58172
58100
  min-width: $stepper-bigger-step-width;
58173
58101
  min-height: $stepper-bigger-step-width;
58174
58102
  }
58175
-
58176
58103
  .e-indicator {
58177
58104
  font-size: $stepper-bigger-icon-size;
58178
58105
  }
58179
-
58180
58106
  .e-step-text-container,
58181
58107
  .e-step-label-container {
58182
58108
  font-size: $stepper-bigger-text-size;
58183
58109
  }
58184
-
58185
58110
  .e-step-content {
58186
58111
  font-size: $stepper-bigger-icon-size;
58187
58112
  }
58188
-
58189
58113
  .e-step-label-optional {
58190
58114
  font-size: $stepper-bigger-optional-size;
58191
58115
  }
58192
58116
  }
58193
- &.e-vertical .e-stepper-steps .e-step-container .e-step-label-container.e-label-after .e-step-label-optional {
58117
+ &.e-vertical .e-step-label-container.e-label-after .e-step-label-optional {
58194
58118
  font-size: $stepper-bigger-optional-size;
58195
58119
  }
58196
58120
  }
@@ -58199,7 +58123,7 @@ $step-selected-active-color: $selection-bg !default;
58199
58123
  .e-bigger.e-small .e-stepper,
58200
58124
  .e-bigger .e-small.e-stepper,
58201
58125
  .e-small .e-bigger.e-stepper {
58202
- &.e-step-type-indicator .e-stepper-steps .e-step-container:not(.e-step-icon.e-step-label.e-step-text) {
58126
+ &.e-step-type-indicator .e-step-container:not(.e-step-icon.e-step-label.e-step-text) {
58203
58127
  .e-icons.e-step-indicator {
58204
58128
  font-size: $stepper-bigger-small-step-width;
58205
58129
  }
@@ -58208,31 +58132,27 @@ $step-selected-active-color: $selection-bg !default;
58208
58132
  height: $stepper-bigger-small-step-width;
58209
58133
  }
58210
58134
  }
58211
-
58212
- .e-stepper-steps .e-step-container {
58135
+ .e-step-container {
58213
58136
  .e-step,
58214
58137
  .e-indicator {
58215
58138
  min-width: $stepper-bigger-small-step-width;
58216
58139
  min-height: $stepper-bigger-small-step-width;
58217
58140
  }
58218
-
58219
58141
  .e-indicator {
58220
58142
  font-size: $stepper-bigger-small-icon-size;
58221
58143
  }
58222
-
58223
58144
  .e-step-text-container,
58224
- .e-step-label-container{
58145
+ .e-step-label-container {
58225
58146
  font-size: $stepper-bigger-small-text-size;
58226
58147
  }
58227
58148
  .e-step-content {
58228
58149
  font-size: $stepper-bigger-small-icon-size;
58229
58150
  }
58230
-
58231
58151
  .e-step-label-optional {
58232
58152
  font-size: $stepper-bigger-small-optional-size;
58233
58153
  }
58234
58154
  }
58235
- &.e-vertical .e-stepper-steps .e-step-container .e-step-label-container.e-label-after .e-step-label-optional {
58155
+ &.e-vertical .e-step-label-container.e-label-after .e-step-label-optional {
58236
58156
  font-size: $stepper-bigger-small-optional-size;
58237
58157
  }
58238
58158
  }
@@ -58241,229 +58161,203 @@ $step-selected-active-color: $selection-bg !default;
58241
58161
 
58242
58162
  @include export-module('stepper-theme') {
58243
58163
  .e-stepper {
58244
- .e-stepper-steps {
58245
- .e-step-container {
58246
- &.e-step-notstarted:not(.e-step-disabled) .e-step,
58247
- &.e-step-notstarted:not(.e-step-disabled) .e-indicator,
58248
- &.e-step-notstarted .e-icons.e-step-indicator {
58249
- border-color: $step-border-color;
58250
- }
58251
-
58252
- .e-step-label-optional {
58253
- color: $step-optional-color;
58254
- }
58255
-
58256
- .e-step,
58257
- .e-indicator {
58258
- color: $step-color;
58259
- background: $step-bg-color;
58260
- }
58261
-
58262
- .e-step-indicator {
58263
- color: transparent;
58264
- }
58265
-
58266
- &.e-step-completed .e-step,
58267
- &.e-step-inprogress .e-step,
58268
- &.e-step-completed .e-indicator,
58269
- &.e-step-inprogress .e-indicator,
58270
- &.e-step-completed .e-step-indicator,
58271
- &.e-step-inprogress .e-step-indicator {
58272
- background: $step-completed-bg-color;
58273
- color: $step-completed-color;
58274
- }
58275
-
58276
- &.e-step-valid {
58277
- .e-indicator {
58278
- background: $step-valid-completed-bg-color !important; /* stylelint-disable-line declaration-no-important */
58279
- color: $step-valid-completed-color;
58280
- }
58281
- }
58282
-
58283
- &.e-step-error {
58284
- .e-indicator {
58285
- background: $step-error-completed-bg-color !important; /* stylelint-disable-line declaration-no-important */
58286
- color: $step-error-icon-color;
58287
- }
58288
-
58289
- .e-text,
58290
- .e-label {
58291
- color: $step-error-completed-color;
58292
- }
58293
- }
58294
-
58295
- &.e-step-valid:not(.e-step-notstarted) .e-indicator:hover,
58296
- &.e-step-error .e-indicator:hover {
58297
- color: $step-color;
58298
- }
58299
-
58300
- &.e-step-selected {
58301
- .e-text,
58302
- .e-label {
58303
- font-weight: $stepper-font-weight;
58304
- }
58305
- }
58306
-
58307
- &.e-step-valid.e-step-text-only:not(.e-step-icon.e-step-label) .e-step-text-container,
58308
- &.e-step-valid.e-step-label-only:not(.e-step-icon.e-step-text) .e-step-label-container {
58309
- .e-step-validation-icon {
58310
- color: $step-valid-icon-only-color;
58311
- }
58312
- }
58313
-
58314
- &.e-step-error.e-step-text-only:not(.e-step-icon.e-step-label) .e-step-text-container,
58315
- &.e-step-error.e-step-label-only:not(.e-step-icon.e-step-text) .e-step-label-container {
58316
- .e-step-validation-icon {
58317
- color: $step-error-icon-only-color;
58318
- }
58319
- }
58320
-
58321
- .e-text,
58322
- .e-label {
58323
- color: $stepper-text-color;
58324
- }
58325
-
58326
- &.e-step-selected:not(.e-step-error),
58327
- &.e-step-completed:not(.e-step-error) {
58328
- .e-text,
58329
- .e-label {
58330
- color: $step-completed-bg-color;
58331
- }
58332
- }
58333
-
58334
- &.e-step-label:not(.e-step-icon) .e-step-label-container {
58335
- background-color: $stepper-outline-color;
58336
- }
58337
-
58338
- .e-step-text-container {
58339
- background-color: $stepper-outline-color;
58340
- border-color: transparent;
58341
- }
58342
-
58343
- &.e-step-selected .e-indicator {
58344
- background: $step-completed-bg-color;
58345
- }
58346
-
58347
- &.e-step-disabled .e-indicator {
58348
- background: $step-disabled-bg-color !important; /* stylelint-disable-line declaration-no-important */
58349
- color: $step-disabled-color !important; /* stylelint-disable-line declaration-no-important */
58350
- }
58351
-
58352
- &.e-step-disabled .e-text,
58353
- &.e-step-disabled .e-label,
58354
- &.e-step-disabled .e-step-validation-icon {
58355
- color: $step-disabled-font-color !important; /* stylelint-disable-line declaration-no-important */
58356
- }
58164
+ .e-step-notstarted:not(.e-step-disabled) .e-step,
58165
+ .e-step-notstarted:not(.e-step-disabled) .e-indicator,
58166
+ .e-step-notstarted .e-icons.e-step-indicator {
58167
+ border-color: $step-border-color;
58168
+ }
58169
+ .e-step-label-optional {
58170
+ color: $step-optional-color;
58171
+ }
58172
+ .e-step,
58173
+ .e-indicator {
58174
+ color: $step-color;
58175
+ background: $step-bg-color;
58176
+ }
58177
+ .e-step-indicator {
58178
+ color: transparent;
58179
+ }
58180
+ .e-step-completed .e-step,
58181
+ .e-step-inprogress .e-step,
58182
+ .e-step-completed .e-indicator,
58183
+ .e-step-inprogress .e-indicator,
58184
+ .e-step-completed .e-step-indicator,
58185
+ .e-step-inprogress .e-step-indicator {
58186
+ background: $step-completed-bg-color;
58187
+ color: $step-completed-color;
58188
+ }
58189
+ .e-step-selected .e-indicator {
58190
+ background: $step-completed-bg-color;
58191
+ }
58192
+ .e-step-valid .e-indicator {
58193
+ background: $step-valid-completed-bg-color;
58194
+ color: $step-valid-completed-color;
58195
+ }
58196
+ .e-step-error {
58197
+ .e-indicator {
58198
+ background: $step-error-completed-bg-color;
58199
+ color: $step-error-icon-color;
58200
+ }
58201
+ .e-text,
58202
+ .e-label {
58203
+ color: $step-error-completed-color;
58357
58204
  }
58358
58205
  }
58359
-
58360
- &.e-vertical .e-stepper-steps .e-step-container.e-step-text-only.e-step-text .e-step-label-optional,
58361
- &.e-vertical .e-stepper-steps .e-step-container.e-step-label-only.e-step-label .e-step-label-optional,
58362
- &.e-vertical .e-stepper-steps .e-step-container.e-step-icon:not(.e-step-text):not(.e-step-label) .e-step-label-optional,
58363
- &.e-vertical.e-label-top .e-stepper-steps .e-step-container .e-step-label-optional,
58364
- &.e-vertical.e-label-bottom .e-stepper-steps .e-step-container .e-step-label-optional {
58206
+ .e-step-valid:not(.e-step-notstarted) .e-indicator:hover,
58207
+ .e-step-error .e-indicator:hover {
58208
+ color: $step-color;
58209
+ }
58210
+ .e-step-selected {
58211
+ .e-text,
58212
+ .e-label {
58213
+ font-weight: $stepper-font-weight;
58214
+ }
58215
+ }
58216
+ .e-step-valid.e-step-text-only,
58217
+ .e-step-valid.e-step-label-only {
58218
+ .e-step-validation-icon {
58219
+ color: $step-valid-icon-only-color;
58220
+ }
58221
+ }
58222
+ .e-step-error.e-step-text-only,
58223
+ .e-step-error.e-step-label-only {
58224
+ .e-step-validation-icon {
58225
+ color: $step-error-icon-only-color;
58226
+ }
58227
+ }
58228
+ .e-text,
58229
+ .e-label {
58230
+ color: $stepper-text-color;
58231
+ }
58232
+ .e-step-selected:not(.e-step-error),
58233
+ .e-step-completed:not(.e-step-error) {
58234
+ .e-text,
58235
+ .e-label {
58236
+ color: $step-completed-bg-color;
58237
+ }
58238
+ }
58239
+ .e-step-label:not(.e-step-icon) .e-step-label-container {
58240
+ background-color: $stepper-outline-color;
58241
+ }
58242
+ .e-step-text-container {
58243
+ background-color: $stepper-outline-color;
58244
+ border-color: transparent;
58245
+ }
58246
+ .e-step-disabled .e-indicator {
58247
+ background: $step-disabled-bg-color;
58248
+ color: $step-disabled-color;
58249
+ }
58250
+ .e-step-disabled .e-text,
58251
+ .e-step-disabled .e-label,
58252
+ .e-step-disabled .e-step-validation-icon {
58253
+ color: $step-disabled-font-color;
58254
+ }
58255
+ &.e-vertical .e-step-text-only.e-step-text .e-step-label-optional,
58256
+ &.e-vertical .e-step-label-only.e-step-label .e-step-label-optional,
58257
+ &.e-vertical .e-step-icon:not(.e-step-text):not(.e-step-label) .e-step-label-optional,
58258
+ &.e-vertical.e-label-top .e-step-label-optional,
58259
+ &.e-vertical.e-label-bottom .e-step-label-optional {
58365
58260
  background-color: $stepper-outline-color;
58366
58261
  }
58367
-
58368
58262
  .e-stepper-progressbar {
58369
58263
  background-color: $step-progress-bg-color;
58370
-
58371
58264
  >.e-progressbar-value {
58372
58265
  background-color: $step-progress-value-bg-color;
58373
58266
  }
58374
58267
  }
58375
-
58376
- &:not(.e-steps-focus) .e-stepper-steps .e-step-container.e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-step {
58268
+ &:not(.e-steps-focus) .e-step-selected .e-step {
58377
58269
  box-shadow: $step-selected-li-shadow;
58378
58270
  }
58379
-
58380
- .e-stepper-steps .e-step-container.e-step-focus .e-step,
58381
- .e-stepper-steps .e-step-container.e-step-label-only.e-step-focus .e-label,
58382
- .e-stepper-steps .e-step-container.e-step-text-only.e-step-focus .e-text,
58383
- .e-stepper-steps .e-step-container.e-step-template.e-step-focus,
58384
- &:not(.e-steps-focus) .e-stepper-steps .e-step-container:focus-visible .e-step,
58385
- &:not(.e-steps-focus) .e-stepper-steps .e-step-container.e-step-text-only:focus-visible .e-text,
58386
- &:not(.e-steps-focus) .e-stepper-steps .e-step-container.e-step-label-only:focus-visible .e-label {
58387
- box-shadow: $step-keyboard-selected-li-shadow !important; /* stylelint-disable-line declaration-no-important */
58271
+ .e-step-focus .e-step,
58272
+ .e-step-label-only.e-step-focus .e-label,
58273
+ .e-step-text-only.e-step-focus .e-text,
58274
+ .e-step-template.e-step-focus,
58275
+ &:not(.e-steps-focus) :focus-visible .e-step,
58276
+ &:not(.e-steps-focus) .e-step-text-only:focus-visible .e-text,
58277
+ &:not(.e-steps-focus) .e-step-label-only:focus-visible .e-label {
58278
+ box-shadow: $step-keyboard-selected-li-shadow;
58388
58279
  }
58389
58280
 
58390
- &:not(.e-steps-focus) .e-stepper-steps .e-step-container.e-step-valid.e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-step,
58391
- .e-stepper-steps .e-step-container.e-step-valid.e-step-focus .e-step,
58392
- .e-stepper-steps .e-step-container.e-step-valid.e-step-label-only.e-step-focus .e-label,
58393
- .e-stepper-steps .e-step-container.e-step-valid.e-step-text-only.e-step-focus .e-text,
58394
- .e-stepper-steps .e-step-container.e-step-valid.e-step-template.e-step-focus {
58281
+ &:not(.e-steps-focus) .e-step-valid.e-step-selected .e-step,
58282
+ .e-step-valid.e-step-focus .e-step,
58283
+ .e-step-valid.e-step-label-only.e-step-focus .e-label,
58284
+ .e-step-valid.e-step-text-only.e-step-focus .e-text,
58285
+ .e-step-valid.e-step-template.e-step-focus {
58395
58286
  box-shadow: $step-valid-li-shadow;
58396
58287
  }
58397
58288
 
58398
- &:not(.e-steps-focus) .e-stepper-steps .e-step-container.e-step-error.e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-step,
58399
- .e-stepper-steps .e-step-container.e-step-error.e-step-focus .e-step,
58400
- .e-stepper-steps .e-step-container.e-step-error.e-step-label-only.e-step-focus .e-label,
58401
- .e-stepper-steps .e-step-container.e-step-error.e-step-text-only.e-step-focus .e-text,
58402
- .e-stepper-steps .e-step-container.e-step-error.e-step-template.e-step-focus {
58289
+ &:not(.e-steps-focus) .e-step-error.e-step-selected .e-step,
58290
+ .e-step-error.e-step-focus .e-step,
58291
+ .e-step-error.e-step-label-only.e-step-focus .e-label,
58292
+ .e-step-error.e-step-text-only.e-step-focus .e-text,
58293
+ .e-step-error.e-step-template.e-step-focus {
58403
58294
  box-shadow: $step-error-li-shadow;
58404
58295
  }
58405
58296
 
58406
- .e-stepper-steps .e-step-container:not(.e-step-focus).e-step-notstarted:not(.e-step-text-only):not(.e-step-label-only) .e-step,
58407
- .e-stepper-steps .e-step-container:not(.e-step-focus).e-step-completed:not(.e-step-text-only):not(.e-step-label-only) .e-step,
58408
- &.e-steps-focus .e-stepper-steps .e-step-container:not(.e-step-focus).e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-step {
58297
+ .e-step-container:not(.e-step-focus).e-step-notstarted .e-step,
58298
+ .e-step-container:not(.e-step-focus).e-step-completed .e-step,
58299
+ &.e-steps-focus .e-step-container:not(.e-step-focus).e-step-selected .e-step {
58409
58300
  box-shadow: $step-li-shadow;
58410
58301
  }
58411
58302
 
58412
- .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-disabled) .e-step:hover,
58413
- .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-disabled) .e-indicator:hover {
58414
- border-color: $step-hover-border-color !important; /* stylelint-disable-line declaration-no-important */
58303
+ .e-step-notstarted:not(.e-step-disabled) .e-step:hover,
58304
+ .e-step-notstarted:not(.e-step-disabled) .e-indicator:hover {
58305
+ border-color: $step-hover-border-color;
58415
58306
  }
58416
58307
 
58417
- .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-disabled) .e-step:active,
58418
- .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-disabled) .e-indicator:active {
58419
- border-color: $step-active-border-color !important; /* stylelint-disable-line declaration-no-important */
58308
+ .e-step-notstarted:not(.e-step-disabled) .e-step:active,
58309
+ .e-step-notstarted:not(.e-step-disabled) .e-indicator:active {
58310
+ border-color: $step-active-border-color;
58420
58311
  }
58421
58312
 
58422
- &:not(.e-step-type-label) .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-text-only):not(.e-step-label-only) .e-indicator:hover,
58423
- &:not(.e-step-type-label) .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-text-only):not(.e-step-label-only) .e-step:hover {
58424
- background: $step-hover-color !important; /* stylelint-disable-line declaration-no-important */
58313
+ &:not(.e-step-type-label) {
58314
+ .e-indicator:hover,
58315
+ .e-step:hover {
58316
+ color: $step-hover-text-color;
58317
+ background: $step-selected-hover-color;
58318
+ }
58425
58319
  }
58426
58320
 
58427
- &:not(.e-step-type-label) .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-text-only):not(.e-step-label-only) .e-indicator:active,
58428
- &:not(.e-step-type-label) .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-text-only):not(.e-step-label-only) .e-step:active {
58429
- background: $step-active-color !important; /* stylelint-disable-line declaration-no-important */
58321
+ &:not(.e-step-type-label) .e-step-notstarted .e-indicator:hover,
58322
+ &:not(.e-step-type-label) .e-step-notstarted .e-step:hover {
58323
+ color: $step-hover-not-text-color;
58430
58324
  }
58431
58325
 
58432
- &:not(.e-step-type-label) .e-stepper-steps .e-step-container {
58433
- &:not(.e-step-text-only):not(.e-step-label-only) .e-indicator:hover,
58434
- &:not(.e-step-text-only):not(.e-step-label-only) .e-step:hover {
58435
- color: $step-hover-text-color;
58436
- background: $step-selected-hover-color !important; /* stylelint-disable-line declaration-no-important */
58326
+ &:not(.e-step-type-label) {
58327
+ .e-step-selected .e-indicator:active,
58328
+ .e-step-selected .e-step:active {
58329
+ background: $step-selected-active-color;
58437
58330
  }
58438
- &.e-step-valid:not(.e-step-text-only):not(.e-step-label-only) .e-indicator:hover,
58439
- &.e-step-valid:not(.e-step-text-only):not(.e-step-label-only) .e-step:hover {
58440
- color: $step-hover-text-color !important; /* stylelint-disable-line declaration-no-important */
58441
- background: $step-valid-completed-bg-color !important; /* stylelint-disable-line declaration-no-important */
58331
+ .e-step-valid.e-step-selected .e-indicator:active,
58332
+ .e-step-valid.e-step-selected .e-step:active {
58333
+ background: $step-valid-completed-bg-color;
58442
58334
  }
58443
- &.e-step-error:not(.e-step-text-only):not(.e-step-label-only) .e-indicator:hover,
58444
- &.e-step-error:not(.e-step-text-only):not(.e-step-label-only) .e-step:hover {
58445
- color: $step-hover-text-color !important; /* stylelint-disable-line declaration-no-important */
58446
- background: $step-error-completed-bg-color !important; /* stylelint-disable-line declaration-no-important */
58335
+ .e-step-error.e-step-selected .e-indicator:active,
58336
+ .e-step-error.e-step-selected .e-step:active {
58337
+ background: $step-error-completed-bg-color;
58447
58338
  }
58448
58339
  }
58449
58340
 
58450
- &:not(.e-step-type-label) .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-text-only):not(.e-step-label-only) .e-indicator:hover,
58451
- &:not(.e-step-type-label) .e-stepper-steps .e-step-container.e-step-notstarted:not(.e-step-text-only):not(.e-step-label-only) .e-step:hover {
58452
- color: $step-hover-not-text-color;
58341
+ &:not(.e-step-type-label) .e-step-notstarted .e-indicator:hover,
58342
+ &:not(.e-step-type-label) .e-step-notstarted .e-step:hover {
58343
+ background: $step-hover-color;
58453
58344
  }
58454
58345
 
58455
- &:not(.e-step-type-label) .e-stepper-steps .e-step-container {
58456
- &.e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-indicator:active,
58457
- &.e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-step:active {
58458
- background: $step-selected-active-color !important; /* stylelint-disable-line declaration-no-important */
58459
- }
58460
- &.e-step-valid.e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-indicator:active,
58461
- &.e-step-valid.e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-step:active {
58462
- background: $step-valid-completed-bg-color !important; /* stylelint-disable-line declaration-no-important */
58346
+ &:not(.e-step-type-label) .e-step-notstarted .e-indicator:active,
58347
+ &:not(.e-step-type-label) .e-step-notstarted .e-step:active {
58348
+ background: $step-active-color;
58349
+ }
58350
+
58351
+ &:not(.e-step-type-label) {
58352
+ .e-step-valid .e-indicator:hover,
58353
+ .e-step-valid .e-step:hover {
58354
+ color: $step-hover-text-color;
58355
+ background: $step-valid-completed-bg-color;
58463
58356
  }
58464
- &.e-step-error.e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-indicator:active,
58465
- &.e-step-error.e-step-selected:not(.e-step-text-only):not(.e-step-label-only) .e-step:active {
58466
- background: $step-error-completed-bg-color !important; /* stylelint-disable-line declaration-no-important */
58357
+ .e-step-error .e-indicator:hover,
58358
+ .e-step-error .e-step:hover {
58359
+ color: $step-hover-text-color;
58360
+ background: $step-error-completed-bg-color;
58467
58361
  }
58468
58362
  }
58469
58363
  }
@@ -81296,7 +81190,7 @@ margin: $grid-group-animator-cell-margin;
81296
81190
  text-align: left;
81297
81191
  }
81298
81192
 
81299
- &.e-default table th:not([rowspan = '1']):not(.e-detailcell,.e-detailindentcell,.e-stackedheadercell) {
81193
+ &.e-default table th:not([rowspan = '1']):not(.e-detailcell,.e-detailindentcell,.e-stackedheadercell,.e-detailheadercell,.e-rowdragheader) {
81300
81194
  border-width: $grid-headercell-both-border-width;
81301
81195
  }
81302
81196
 
@@ -81322,7 +81216,7 @@ margin: $grid-group-animator-cell-margin;
81322
81216
  border-right-width: 1px;
81323
81217
  }
81324
81218
 
81325
- &.e-rtl.e-default table th:not([rowspan = '1']):not(.e-detailcell,.e-detailindentcell,.e-stackedheadercell) {
81219
+ &.e-rtl.e-default table th:not([rowspan = '1']):not(.e-detailcell,.e-detailindentcell,.e-stackedheadercell,.e-detailheadercell,.e-rowdragheader) {
81326
81220
  border-width: $grid-rtl-headercell-both-border-width;
81327
81221
  }
81328
81222
 
@@ -83207,6 +83101,14 @@ margin: $grid-group-animator-cell-margin;
83207
83101
  border-top: 1px solid $grid-header-border-color;
83208
83102
  }
83209
83103
 
83104
+ .e-gridcontent table tbody tr:first-child .e-normaledit .e-dragindentcell {
83105
+ border-top: 0 solid $grid-header-border-color;
83106
+ }
83107
+
83108
+ .e-detailrow .e-grid.e-default .e-normaledit .e-lastrowcell {
83109
+ border-bottom: 0;
83110
+ }
83111
+
83210
83112
  .e-ccdlg {
83211
83113
  .e-footer-content {
83212
83114
  border-color: $grid-columnchooser-footer-border-color;
@@ -87881,7 +87783,7 @@ $btn-grp-outline-focus-danger-color: inherit !default;
87881
87783
 
87882
87784
  //Focus state for Normal and Outline GroupButton
87883
87785
  .e-btn:focus,
87884
- input:focus+label.e-btn {
87786
+ input:focus-visible+label.e-btn {
87885
87787
  @include button-focus;
87886
87788
  @if $skin-name != 'bootstrap5' and $skin-name != 'bootstrap4' and $skin-name != 'tailwind' {
87887
87789
  box-shadow: none;