@syncfusion/ej2-navigations 28.2.12 → 29.1.34

package/styles/menu/bootstrap5-dark.css

@@ -352,7 +352,7 @@
 }
 .e-menu-wrapper.e-popup.e-menu-popup,
 .e-menu-container.e-popup.e-menu-popup {
-  border: 1px solid #444c54;
+  border: 1px solid rgb(68.0034482759, 75.85, 83.6965517241);
   -webkit-box-shadow: 0 16px 48px rgba(0, 0, 0, 0.175);
           box-shadow: 0 16px 48px rgba(0, 0, 0, 0.175);
   overflow: hidden;
@@ -405,7 +405,7 @@
 }
 .e-menu-wrapper.e-contextmenu-container .e-menu-vscroll,
 .e-menu-container.e-contextmenu-container .e-menu-vscroll {
-  border: 1px solid #444c54;
+  border: 1px solid rgb(68.0034482759, 75.85, 83.6965517241);
   -webkit-box-shadow: 0 16px 48px rgba(0, 0, 0, 0.175);
           box-shadow: 0 16px 48px rgba(0, 0, 0, 0.175);
 }
@@ -611,7 +611,7 @@
 
 .e-menu-wrapper,
 .e-menu-container {
-  background: #282d31;
+  background: rgb(26.177027027, 29.35, 32.522972973);
 }
 .e-menu-wrapper .e-menu,
 .e-menu-container .e-menu {
@@ -620,15 +620,15 @@
 }
 .e-menu-wrapper .e-menu.e-menu:not(.e-vertical) .e-separator,
 .e-menu-container .e-menu.e-menu:not(.e-vertical) .e-separator {
-  border-right-color: #444c54;
+  border-right-color: rgb(68.0034482759, 75.85, 83.6965517241);
 }
 .e-menu-wrapper .e-menu .e-menu-item.e-menu-header,
 .e-menu-container .e-menu .e-menu-item.e-menu-header {
-  border-bottom-color: #444c54;
+  border-bottom-color: rgb(68.0034482759, 75.85, 83.6965517241);
 }
 .e-menu-wrapper .e-menu .e-menu-item.e-menu-header,
 .e-menu-container .e-menu .e-menu-item.e-menu-header {
-  border-bottom-color: #444c54;
+  border-bottom-color: rgb(68.0034482759, 75.85, 83.6965517241);
 }
 .e-menu-wrapper .e-menu .e-menu-item .e-menu-url,
 .e-menu-container .e-menu .e-menu-item .e-menu-url {
@@ -637,7 +637,7 @@
 .e-menu-wrapper .e-menu .e-menu-item.e-focused,
 .e-menu-container .e-menu .e-menu-item.e-focused {
   color: #fff;
-  outline: 0 solid #444c54;
+  outline: 0 solid rgb(68.0034482759, 75.85, 83.6965517241);
   outline-offset: 0;
   background: #495057;
 }
@@ -661,7 +661,7 @@
 }
 .e-menu-wrapper .e-menu .e-menu-item.e-separator,
 .e-menu-container .e-menu .e-menu-item.e-separator {
-  border-bottom-color: #444c54;
+  border-bottom-color: rgb(68.0034482759, 75.85, 83.6965517241);
 }
 .e-menu-wrapper .e-menu .e-disabled,
 .e-menu-container .e-menu .e-disabled {
@@ -692,9 +692,9 @@
 }
 .e-menu-wrapper .e-ul .e-menu-item.e-focused,
 .e-menu-container .e-ul .e-menu-item.e-focused {
-  background-color: #444c54;
+  background-color: rgb(68.0034482759, 75.85, 83.6965517241);
   color: #fff;
-  outline: 0 solid #444c54;
+  outline: 0 solid rgb(68.0034482759, 75.85, 83.6965517241);
   outline-offset: 0;
 }
 .e-menu-wrapper .e-ul .e-menu-item.e-selected, .e-menu-wrapper .e-ul .e-menu-item.e-active-item,
@@ -707,7 +707,7 @@
 }
 .e-menu-wrapper .e-ul .e-menu-item.e-separator,
 .e-menu-container .e-ul .e-menu-item.e-separator {
-  border-bottom-color: #444c54;
+  border-bottom-color: rgb(68.0034482759, 75.85, 83.6965517241);
 }
 .e-menu-wrapper.e-menu-popup,
 .e-menu-container.e-menu-popup {
@@ -719,7 +719,7 @@
 }
 .e-menu-wrapper .e-menu-hscroll.e-hscroll .e-scroll-nav,
 .e-menu-container .e-menu-hscroll.e-hscroll .e-scroll-nav {
-  background: #282d31;
+  background: rgb(26.177027027, 29.35, 32.522972973);
 }
 .e-menu-wrapper .e-menu-hscroll.e-hscroll .e-scroll-nav .e-nav-arrow.e-icons,
 .e-menu-container .e-menu-hscroll.e-hscroll .e-scroll-nav .e-nav-arrow.e-icons {
@@ -740,7 +740,7 @@
 .e-menu-wrapper.e-menu-popup .e-menu-vscroll.e-vscroll .e-scroll-nav,
 .e-menu-container.e-menu-popup .e-menu-vscroll.e-vscroll .e-scroll-nav {
   background: #343a40;
-  border-color: #444c54;
+  border-color: rgb(68.0034482759, 75.85, 83.6965517241);
 }
 .e-menu-wrapper.e-menu-popup .e-menu-vscroll.e-vscroll .e-scroll-nav .e-icons,
 .e-menu-container.e-menu-popup .e-menu-vscroll.e-vscroll .e-scroll-nav .e-icons {
@@ -749,7 +749,7 @@
 .e-menu-wrapper.e-menu-popup .e-menu-vscroll.e-vscroll .e-scroll-nav:hover, .e-menu-wrapper.e-menu-popup .e-menu-vscroll.e-vscroll .e-scroll-nav:focus,
 .e-menu-container.e-menu-popup .e-menu-vscroll.e-vscroll .e-scroll-nav:hover,
 .e-menu-container.e-menu-popup .e-menu-vscroll.e-vscroll .e-scroll-nav:focus {
-  background: #444c54;
+  background: rgb(68.0034482759, 75.85, 83.6965517241);
 }
 .e-menu-wrapper.e-menu-popup .e-menu-vscroll.e-vscroll .e-scroll-nav:active,
 .e-menu-container.e-menu-popup .e-menu-vscroll.e-vscroll .e-scroll-nav:active {

package/styles/pager/_bigger.scss

@@ -228,7 +228,9 @@
           &.e-focused {
             padding: 10px 12px;
           }
-          padding: 10px 12px;
+          & {
+            padding: 10px 12px;
+          }
         }
       }
         

package/styles/pager/_bootstrap-dark-definition.scss

@@ -1,4 +1,5 @@
 @use 'sass:math';
+@use 'sass:color';
 
 $pager-numericitem-border-radius: 4px !default;
 $pager-border-type: $border-type !default;
@@ -131,8 +132,8 @@ $pager-bigger-tripledot-font-size: $pager-tripledot-font-size !default;
 $pager-focus-bg-color: $grey-light !default;
 $pager-focus-tripledot-padding: $pager-tripledot-padding !default;
 $pager-focus-tripledot-line-height: 1 !default;
-$pager-focus-active-box-shadow: 0 0 0 1px lighten($brand-primary, 10%) inset !default;
-$pager-focus-shadow: 0 0 0 1px lighten($brand-primary, 10%) inset !default;
+$pager-focus-active-box-shadow: 0 0 0 1px color.adjust($brand-primary, $lightness: 10%) inset !default;
+$pager-focus-shadow: 0 0 0 1px color.adjust($brand-primary, $lightness: 10%) inset !default;
 $pager-bigger-adaptive-pagermsgbar-margin-top: 2px !default;
 $pager-bigger-adaptive-dropdown-margin: -1px 2px 0 4px !default;
 $pager-bigger-adaptive-dropdown-min-width: 77px !default;

package/styles/pager/_bootstrap4-definition.scss

@@ -1,4 +1,5 @@
 @use 'sass:math';
+@use 'sass:color';
 
 $pager-numericitem-border-radius: 0 !default;
 $pager-border-type: solid !default;
@@ -46,7 +47,7 @@ $pager-numeric-txt-bg-color: $gray-600 !default;
 $pager-padding: 8px !default;
 $pager-numeric-font-weight: bold !default;
 $pager-messagebar-padding-top: 12px !default;
-$pager-number-hover-bg-color: darken($gray-100, 2%) !default;
+$pager-number-hover-bg-color: color.adjust($gray-100, $lightness: -2%) !default;
 $pager-font-family: Helvertica !default;
 $pager-font-weight: bold !default;
 $pager-messagebar-padding-right: 0 !default;

package/styles/pager/bootstrap-dark.css

@@ -576,12 +576,12 @@
 }
 .e-pager .e-currentitem.e-numericitem.e-focused {
   background: #0070f0;
-  -webkit-box-shadow: 0 0 0 1px #248aff inset;
-          box-shadow: 0 0 0 1px #248aff inset;
+  -webkit-box-shadow: 0 0 0 1px rgb(36, 138.2, 255) inset;
+          box-shadow: 0 0 0 1px rgb(36, 138.2, 255) inset;
 }
 .e-pager .e-focused {
-  -webkit-box-shadow: 0 0 0 1px #248aff inset;
-          box-shadow: 0 0 0 1px #248aff inset;
+  -webkit-box-shadow: 0 0 0 1px rgb(36, 138.2, 255) inset;
+          box-shadow: 0 0 0 1px rgb(36, 138.2, 255) inset;
 }
 @media (max-width: 590px) {
   .e-pager .e-pager-default:hover {

package/styles/pager/bootstrap4.css

@@ -520,7 +520,7 @@
   opacity: 1;
 }
 .e-pager .e-numericitem:not(.e-active):not(.e-np):not(.e-pp):hover {
-  background-color: #f2f4f6;
+  background-color: rgb(242.05, 243.9, 245.75);
   opacity: 1;
 }
 .e-pager .e-numericitem {

package/styles/pager/bootstrap5-dark.css

@@ -122,7 +122,7 @@
   text-decoration: none;
 }
 .e-pager .e-currentitem {
-  border: 3px solid #86b7fe;
+  border: 3px solid rgb(134, 182.5, 254);
   font-style: normal;
   font-variant: normal;
   font-weight: 400;
@@ -354,7 +354,7 @@
   padding: 7px 10.5px 8px 9.5px;
 }
 .e-pager.e-rtl .e-numericitem.e-currentitem {
-  border-left-color: #86b7fe;
+  border-left-color: rgb(134, 182.5, 254);
   border-left-style: solid;
   border-left-width: 3px;
 }
@@ -502,7 +502,7 @@
 
 /*! Pager theme */
 .e-pager {
-  border-color: #444c54;
+  border-color: rgb(68.0034482759, 75.85, 83.6965517241);
   background: #212529;
   color: #ced4da;
   opacity: 1;
@@ -514,7 +514,7 @@
   color: #adb5bd;
 }
 .e-pager .e-pager-default:hover {
-  background: #31373d;
+  background: rgb(48.9202702703, 54.85, 60.7797297297);
   color: #0d6efd;
   opacity: 1;
 }
@@ -526,14 +526,14 @@
   opacity: 1;
 }
 .e-pager .e-spacing.e-numericitem:not(.e-active):not(.e-np):not(.e-pp):hover {
-  background: #31373d;
+  background: rgb(48.9202702703, 54.85, 60.7797297297);
 }
 .e-pager .e-numericitem:hover {
   color: #0d6efd;
   opacity: 1;
 }
 .e-pager .e-numericitem:not(.e-active):not(.e-np):not(.e-pp):hover {
-  background-color: #31373d;
+  background-color: rgb(48.9202702703, 54.85, 60.7797297297);
   opacity: 1;
 }
 .e-pager .e-numericitem {
@@ -557,7 +557,7 @@
 }
 .e-pager .e-pagercontainer {
   background-color: #212529;
-  border-color: #444c54;
+  border-color: rgb(68.0034482759, 75.85, 83.6965517241);
 }
 .e-pager .e-numericitem,
 .e-pager .e-firstpage,
@@ -568,12 +568,12 @@
 .e-pager .e-lastpage,
 .e-pager .e-nextpagedisabled,
 .e-pager .e-lastpagedisabled {
-  border-right-color: #444c54;
+  border-right-color: rgb(68.0034482759, 75.85, 83.6965517241);
 }
 .e-pager .e-currentitem,
 .e-pager .e-currentitem:hover {
-  border-right-color: #86b7fe;
-  background: #31373d;
+  border-right-color: rgb(134, 182.5, 254);
+  background: rgb(48.9202702703, 54.85, 60.7797297297);
   color: #0d6efd;
   opacity: 1;
 }
@@ -586,10 +586,10 @@
 .e-pager .e-mprev.e-focused,
 .e-pager .e-mnext.e-focused,
 .e-pager .e-mlast.e-focused {
-  background-color: #31373d;
+  background-color: rgb(48.9202702703, 54.85, 60.7797297297);
 }
 .e-pager .e-currentitem.e-numericitem.e-focused {
-  background: #31373d;
+  background: rgb(48.9202702703, 54.85, 60.7797297297);
   -webkit-box-shadow: 0 0 0 1px #0d6efd inset;
           box-shadow: 0 0 0 1px #0d6efd inset;
 }
@@ -605,7 +605,7 @@
   }
 }
 .e-pager.e-rtl .e-numericitem, .e-pager.e-rtl .e-firstpage, .e-pager.e-rtl .e-prevpage, .e-pager.e-rtl .e-firstpagedisabled, .e-pager.e-rtl .e-prevpagedisabled, .e-pager.e-rtl .e-nextpage, .e-pager.e-rtl .e-lastpage, .e-pager.e-rtl .e-nextpagedisabled, .e-pager.e-rtl .e-lastpagedisabled, .e-pager.e-rtl .e-nextpage, .e-pager.e-rtl .e-nextpagedisabled {
-  border-left-color: #444c54;
+  border-left-color: rgb(68.0034482759, 75.85, 83.6965517241);
 }
 
 /*! Pager bigger */

package/styles/pager/bootstrap5.css

@@ -122,7 +122,7 @@
   text-decoration: none;
 }
 .e-pager .e-currentitem {
-  border: 3px solid #86b7fe;
+  border: 3px solid rgb(134, 182.5, 254);
   font-style: normal;
   font-variant: normal;
   font-weight: 400;
@@ -354,7 +354,7 @@
   padding: 7px 10.5px 8px 9.5px;
 }
 .e-pager.e-rtl .e-numericitem.e-currentitem {
-  border-left-color: #86b7fe;
+  border-left-color: rgb(134, 182.5, 254);
   border-left-style: solid;
   border-left-width: 3px;
 }
@@ -572,7 +572,7 @@
 }
 .e-pager .e-currentitem,
 .e-pager .e-currentitem:hover {
-  border-right-color: #86b7fe;
+  border-right-color: rgb(134, 182.5, 254);
   background: #e9ecef;
   color: #0d6efd;
   opacity: 1;
@@ -586,7 +586,7 @@
 .e-pager .e-mprev.e-focused,
 .e-pager .e-mnext.e-focused,
 .e-pager .e-mlast.e-focused {
-  background-color: #eff1f4;
+  background-color: rgb(239.075, 241.35, 243.625);
 }
 .e-pager .e-currentitem.e-numericitem.e-focused {
   background: #e9ecef;

package/styles/pager/fabric.css

@@ -559,7 +559,7 @@
 }
 .e-pager .e-currentitem,
 .e-pager .e-currentitem:hover {
-  background: #b7e0ff;
+  background: rgb(183.4, 223.5495327103, 255);
   color: #333;
   opacity: 1;
 }
@@ -575,7 +575,7 @@
   background-color: #f4f4f4;
 }
 .e-pager .e-currentitem.e-numericitem.e-focused {
-  background: #b7e0ff;
+  background: rgb(183.4, 223.5495327103, 255);
   -webkit-box-shadow: 0 0 0 1px #666 inset;
           box-shadow: 0 0 0 1px #666 inset;
 }

package/styles/pager/material3-dark.css

@@ -770,7 +770,6 @@
 .e-pager.e-bigger.e-rtl .e-np.e-spacing.e-numericitem:hover {
   font-size: 20px;
   margin-top: 0;
-  padding: 10px 12px;
 }
 .e-bigger .e-pager.e-rtl .e-pp.e-spacing.e-numericitem.e-focused, .e-bigger .e-pager.e-rtl .e-np.e-spacing.e-numericitem.e-focused, .e-bigger .e-pager.e-rtl .e-pp.e-spacing.e-numericitem:hover.e-focused, .e-bigger .e-pager.e-rtl .e-np.e-spacing.e-numericitem:hover.e-focused,
 .e-pager.e-bigger.e-rtl .e-pp.e-spacing.e-numericitem.e-focused,
@@ -779,6 +778,13 @@
 .e-pager.e-bigger.e-rtl .e-np.e-spacing.e-numericitem:hover.e-focused {
   padding: 10px 12px;
 }
+.e-bigger .e-pager.e-rtl .e-pp.e-spacing.e-numericitem, .e-bigger .e-pager.e-rtl .e-np.e-spacing.e-numericitem, .e-bigger .e-pager.e-rtl .e-pp.e-spacing.e-numericitem:hover, .e-bigger .e-pager.e-rtl .e-np.e-spacing.e-numericitem:hover,
+.e-pager.e-bigger.e-rtl .e-pp.e-spacing.e-numericitem,
+.e-pager.e-bigger.e-rtl .e-np.e-spacing.e-numericitem,
+.e-pager.e-bigger.e-rtl .e-pp.e-spacing.e-numericitem:hover,
+.e-pager.e-bigger.e-rtl .e-np.e-spacing.e-numericitem:hover {
+  padding: 10px 12px;
+}
 .e-bigger .e-pager.e-rtl.e-adaptive div.e-parentmsgbar,
 .e-pager.e-bigger.e-rtl.e-adaptive div.e-parentmsgbar {
   margin-top: 0;

package/styles/pager/material3.css

@@ -772,7 +772,6 @@
 .e-pager.e-bigger.e-rtl .e-np.e-spacing.e-numericitem:hover {
   font-size: 20px;
   margin-top: 0;
-  padding: 10px 12px;
 }
 .e-bigger .e-pager.e-rtl .e-pp.e-spacing.e-numericitem.e-focused, .e-bigger .e-pager.e-rtl .e-np.e-spacing.e-numericitem.e-focused, .e-bigger .e-pager.e-rtl .e-pp.e-spacing.e-numericitem:hover.e-focused, .e-bigger .e-pager.e-rtl .e-np.e-spacing.e-numericitem:hover.e-focused,
 .e-pager.e-bigger.e-rtl .e-pp.e-spacing.e-numericitem.e-focused,
@@ -781,6 +780,13 @@
 .e-pager.e-bigger.e-rtl .e-np.e-spacing.e-numericitem:hover.e-focused {
   padding: 10px 12px;
 }
+.e-bigger .e-pager.e-rtl .e-pp.e-spacing.e-numericitem, .e-bigger .e-pager.e-rtl .e-np.e-spacing.e-numericitem, .e-bigger .e-pager.e-rtl .e-pp.e-spacing.e-numericitem:hover, .e-bigger .e-pager.e-rtl .e-np.e-spacing.e-numericitem:hover,
+.e-pager.e-bigger.e-rtl .e-pp.e-spacing.e-numericitem,
+.e-pager.e-bigger.e-rtl .e-np.e-spacing.e-numericitem,
+.e-pager.e-bigger.e-rtl .e-pp.e-spacing.e-numericitem:hover,
+.e-pager.e-bigger.e-rtl .e-np.e-spacing.e-numericitem:hover {
+  padding: 10px 12px;
+}
 .e-bigger .e-pager.e-rtl.e-adaptive div.e-parentmsgbar,
 .e-pager.e-bigger.e-rtl.e-adaptive div.e-parentmsgbar {
   margin-top: 0;

package/styles/sidebar/bootstrap5-dark.css

@@ -11,7 +11,7 @@ ejs-sidebar {
 .e-sidebar {
   /* stylelint-disable property-no-vendor-prefix */
   -webkit-tap-highlight-color: transparent;
-  background: #282d31;
+  background: rgb(26.177027027, 29.35, 32.522972973);
   height: 100%;
   overflow: auto;
   position: fixed;

package/styles/stepper/_bootstrap4-definition.scss

@@ -1,3 +1,5 @@
+@use 'sass:color';
+
 $stepper-ol-padding: 0 !default;
 $stepper-step-radius: 9999px !default;
 $stepper-step-width: 32px !default;
@@ -68,5 +70,5 @@ $step-error-completed-color: $danger !default;
 $step-error-completed-bg-color: $danger !default;
 $step-hover-color: $gray-200 !default;
 $step-active-color: $gray-300 !default;
-$step-selected-hover-color: darken($primary, 10%) !default;
-$step-selected-active-color: darken($primary, 10%) !default;
+$step-selected-hover-color: color.adjust($primary, $lightness: -10%) !default;
+$step-selected-active-color: color.adjust($primary, $lightness: -10%) !default;

package/styles/stepper/_material-dark-definition.scss

@@ -1,3 +1,5 @@
+@use 'sass:color';
+
 $stepper-ol-padding: 0 !default;
 $stepper-step-radius: 9999px !default;
 $stepper-step-width: 32px !default;
@@ -68,5 +70,5 @@ $step-error-completed-color: $error-font !default;
 $step-error-completed-bg-color: $error-font !default;
 $step-hover-color: $grey-800 !default;
 $step-active-color: $overlay-bg-color !default;
-$step-selected-hover-color: lighten($primary, 10%) !default;
-$step-selected-active-color: lighten($primary, 15%) !default;
+$step-selected-hover-color: color.adjust($primary, $lightness: 10%) !default;
+$step-selected-active-color: color.adjust($primary, $lightness: 15%) !default;

package/styles/stepper/_material-definition.scss

@@ -1,3 +1,5 @@
+@use 'sass:color';
+
 $stepper-ol-padding: 0 !default;
 $stepper-step-radius: 9999px !default;
 $stepper-step-width: 32px !default;
@@ -40,7 +42,7 @@ $stepper-bigger-small-text-size: 14px !default;
 $step-selected-li-shadow: 0 0 0 2px $grey-white, 0 0 0 4px $primary, 0 0 0 8px $grey-white !default;
 $step-keyboard-selected-li-shadow: 0 0 0 2px $grey-white, 0 0 0 4px $base-font, 0 0 0 8px $grey-white !default;
 $step-valid-li-shadow: 0 0 0 2px $grey-white, 0 0 0 4px $msg-success-color-alt1, 0 0 0 8px $grey-white !default;
-$step-error-li-shadow: 0 0 0 2px $grey-white, 0 0 0 4px darken($error-font, 11%), 0 0 0 8px $grey-white !default;
+$step-error-li-shadow: 0 0 0 2px $grey-white, 0 0 0 4px color.adjust($error-font, $lightness: -11%), 0 0 0 8px $grey-white !default;
 $step-li-shadow: 0 0 0 8px $grey-white !default;
 $step-border-color: $grey-400 !default;
 $step-hover-text-color: $primary-300-font !default;
@@ -64,9 +66,9 @@ $step-error-icon-only-color: $error-font !default;
 $step-valid-completed-color: $primary-300-font !default;
 $step-valid-completed-bg-color: $msg-success-color-alt1 !default;
 $step-error-icon-color: $primary-300-font !default;
-$step-error-completed-color: darken($error-font, 11%) !default;
-$step-error-completed-bg-color: darken($error-font, 11%) !default;
+$step-error-completed-color: color.adjust($error-font, $lightness: -11%) !default;
+$step-error-completed-bg-color: color.adjust($error-font, $lightness: -11%) !default;
 $step-hover-color: $grey-500 !default;
 $step-active-color: $grey-600 !default;
-$step-selected-hover-color: darken($primary, 10%) !default;
-$step-selected-active-color: darken($primary, 15%) !default;
+$step-selected-hover-color: color.adjust($primary, $lightness: -10%) !default;
+$step-selected-active-color: color.adjust($primary, $lightness: -15%) !default;

package/styles/stepper/bootstrap-dark.css

@@ -587,14 +587,14 @@
 .e-stepper:not(.e-step-type-label) .e-indicator:hover,
 .e-stepper:not(.e-step-type-label) .e-step:hover {
   color: #fff;
-  background: #248aff;
+  background: rgb(36, 138.2, 255);
 }
 .e-stepper:not(.e-step-type-label) .e-step-notstarted .e-indicator:hover, .e-stepper:not(.e-step-type-label) .e-step-notstarted .e-step:hover {
   color: #f0f0f0;
 }
 .e-stepper:not(.e-step-type-label) .e-step-selected .e-indicator:active,
 .e-stepper:not(.e-step-type-label) .e-step-selected .e-step:active {
-  background: #3e98ff;
+  background: rgb(61.5, 151.8, 255);
 }
 .e-stepper:not(.e-step-type-label) .e-step-valid.e-step-selected .e-indicator:active,
 .e-stepper:not(.e-step-type-label) .e-step-valid.e-step-selected .e-step:active {

package/styles/stepper/bootstrap4.css

@@ -587,14 +587,14 @@
 .e-stepper:not(.e-step-type-label) .e-indicator:hover,
 .e-stepper:not(.e-step-type-label) .e-step:hover {
   color: #fff;
-  background: #0062cc;
+  background: rgb(0, 98.4, 204);
 }
 .e-stepper:not(.e-step-type-label) .e-step-notstarted .e-indicator:hover, .e-stepper:not(.e-step-type-label) .e-step-notstarted .e-step:hover {
   color: #495057;
 }
 .e-stepper:not(.e-step-type-label) .e-step-selected .e-indicator:active,
 .e-stepper:not(.e-step-type-label) .e-step-selected .e-step:active {
-  background: #0062cc;
+  background: rgb(0, 98.4, 204);
 }
 .e-stepper:not(.e-step-type-label) .e-step-valid.e-step-selected .e-indicator:active,
 .e-stepper:not(.e-step-type-label) .e-step-valid.e-step-selected .e-step:active {

package/styles/stepper/bootstrap5-dark.css

@@ -459,10 +459,10 @@
 .e-stepper .e-step-notstarted:not(.e-step-disabled) .e-step,
 .e-stepper .e-step-notstarted:not(.e-step-disabled) .e-indicator,
 .e-stepper .e-step-notstarted .e-icons.e-step-indicator {
-  border-color: #444c54;
+  border-color: rgb(68.0034482759, 75.85, 83.6965517241);
 }
 .e-stepper .e-step-label-optional {
-  color: #7b848d;
+  color: rgb(122.8111587983, 132.3287553648, 140.7888412017);
 }
 .e-stepper .e-step,
 .e-stepper .e-indicator {
@@ -485,16 +485,16 @@
   background: #0d6efd;
 }
 .e-stepper .e-step-valid .e-indicator {
-  background: #21b26f;
+  background: rgb(32.96875, 178.03125, 110.775);
   color: #fff;
 }
 .e-stepper .e-step-error .e-indicator {
-  background: #e4606d;
+  background: rgb(227.5316455696, 96.4683544304, 109.0253164557);
   color: #fff;
 }
 .e-stepper .e-step-error .e-text,
 .e-stepper .e-step-error .e-label {
-  color: #e4606d;
+  color: rgb(227.5316455696, 96.4683544304, 109.0253164557);
 }
 .e-stepper .e-step-valid:not(.e-step-notstarted) .e-indicator:hover,
 .e-stepper .e-step-error .e-indicator:hover {
@@ -502,11 +502,11 @@
 }
 .e-stepper .e-step-valid.e-step-text-only .e-step-validation-icon,
 .e-stepper .e-step-valid.e-step-label-only .e-step-validation-icon {
-  color: #21b26f;
+  color: rgb(32.96875, 178.03125, 110.775);
 }
 .e-stepper .e-step-error.e-step-text-only .e-step-validation-icon,
 .e-stepper .e-step-error.e-step-label-only .e-step-validation-icon {
-  color: #e4606d;
+  color: rgb(227.5316455696, 96.4683544304, 109.0253164557);
 }
 .e-stepper .e-text,
 .e-stepper .e-label {
@@ -539,7 +539,7 @@
   background-color: #212529;
 }
 .e-stepper .e-stepper-progressbar {
-  background-color: #444c54;
+  background-color: rgb(68.0034482759, 75.85, 83.6965517241);
 }
 .e-stepper .e-stepper-progressbar > .e-progressbar-value {
   background-color: #0d6efd;
@@ -560,16 +560,16 @@
 .e-stepper .e-step-valid.e-step-label-only.e-step-focus .e-label,
 .e-stepper .e-step-valid.e-step-text-only.e-step-focus .e-text,
 .e-stepper .e-step-valid.e-step-template.e-step-focus {
-  -webkit-box-shadow: 0 0 0 2px #212529, 0 0 0 4px #21b26f, 0 0 0 8px #212529;
-          box-shadow: 0 0 0 2px #212529, 0 0 0 4px #21b26f, 0 0 0 8px #212529;
+  -webkit-box-shadow: 0 0 0 2px #212529, 0 0 0 4px rgb(32.96875, 178.03125, 110.775), 0 0 0 8px #212529;
+          box-shadow: 0 0 0 2px #212529, 0 0 0 4px rgb(32.96875, 178.03125, 110.775), 0 0 0 8px #212529;
 }
 .e-stepper:not(.e-steps-focus) .e-step-error.e-step-selected .e-step,
 .e-stepper .e-step-error.e-step-focus .e-step,
 .e-stepper .e-step-error.e-step-label-only.e-step-focus .e-label,
 .e-stepper .e-step-error.e-step-text-only.e-step-focus .e-text,
 .e-stepper .e-step-error.e-step-template.e-step-focus {
-  -webkit-box-shadow: 0 0 0 2px #212529, 0 0 0 4px #e4606d, 0 0 0 8px #212529;
-          box-shadow: 0 0 0 2px #212529, 0 0 0 4px #e4606d, 0 0 0 8px #212529;
+  -webkit-box-shadow: 0 0 0 2px #212529, 0 0 0 4px rgb(227.5316455696, 96.4683544304, 109.0253164557), 0 0 0 8px #212529;
+          box-shadow: 0 0 0 2px #212529, 0 0 0 4px rgb(227.5316455696, 96.4683544304, 109.0253164557), 0 0 0 8px #212529;
 }
 .e-stepper .e-step-container:not(.e-step-focus).e-step-notstarted .e-step,
 .e-stepper .e-step-container:not(.e-step-focus).e-step-completed .e-step, .e-stepper.e-steps-focus .e-step-container:not(.e-step-focus).e-step-selected .e-step {
@@ -578,31 +578,31 @@
 }
 .e-stepper .e-step-notstarted:not(.e-step-disabled) .e-step:hover,
 .e-stepper .e-step-notstarted:not(.e-step-disabled) .e-indicator:hover {
-  border-color: #444c54;
+  border-color: rgb(68.0034482759, 75.85, 83.6965517241);
 }
 .e-stepper .e-step-notstarted:not(.e-step-disabled) .e-step:active,
 .e-stepper .e-step-notstarted:not(.e-step-disabled) .e-indicator:active {
-  border-color: #444c54;
+  border-color: rgb(68.0034482759, 75.85, 83.6965517241);
 }
 .e-stepper:not(.e-step-type-label) .e-indicator:hover,
 .e-stepper:not(.e-step-type-label) .e-step:hover {
   color: #fff;
-  background: #0b5ed7;
+  background: rgb(11.05, 93.5, 215.05);
 }
 .e-stepper:not(.e-step-type-label) .e-step-notstarted .e-indicator:hover, .e-stepper:not(.e-step-type-label) .e-step-notstarted .e-step:hover {
   color: #fff;
 }
 .e-stepper:not(.e-step-type-label) .e-step-selected .e-indicator:active,
 .e-stepper:not(.e-step-type-label) .e-step-selected .e-step:active {
-  background: #0a58ca;
+  background: rgb(10.4, 88, 202.4);
 }
 .e-stepper:not(.e-step-type-label) .e-step-valid.e-step-selected .e-indicator:active,
 .e-stepper:not(.e-step-type-label) .e-step-valid.e-step-selected .e-step:active {
-  background: #21b26f;
+  background: rgb(32.96875, 178.03125, 110.775);
 }
 .e-stepper:not(.e-step-type-label) .e-step-error.e-step-selected .e-indicator:active,
 .e-stepper:not(.e-step-type-label) .e-step-error.e-step-selected .e-step:active {
-  background: #e4606d;
+  background: rgb(227.5316455696, 96.4683544304, 109.0253164557);
 }
 .e-stepper:not(.e-step-type-label) .e-step-notstarted .e-indicator:hover, .e-stepper:not(.e-step-type-label) .e-step-notstarted .e-step:hover {
   background: #495057;
@@ -613,12 +613,12 @@
 .e-stepper:not(.e-step-type-label) .e-step-valid .e-indicator:hover,
 .e-stepper:not(.e-step-type-label) .e-step-valid .e-step:hover {
   color: #fff;
-  background: #21b26f;
+  background: rgb(32.96875, 178.03125, 110.775);
 }
 .e-stepper:not(.e-step-type-label) .e-step-error .e-indicator:hover,
 .e-stepper:not(.e-step-type-label) .e-step-error .e-step:hover {
   color: #fff;
-  background: #e4606d;
+  background: rgb(227.5316455696, 96.4683544304, 109.0253164557);
 }
 
 .e-bigger.e-stepper.e-step-type-indicator .e-step-container:not(.e-step-item.e-step-label.e-step-text) .e-icons.e-step-indicator,

package/styles/stepper/bootstrap5.css

@@ -587,14 +587,14 @@
 .e-stepper:not(.e-step-type-label) .e-indicator:hover,
 .e-stepper:not(.e-step-type-label) .e-step:hover {
   color: #fff;
-  background: #0b5ed7;
+  background: rgb(11.05, 93.5, 215.05);
 }
 .e-stepper:not(.e-step-type-label) .e-step-notstarted .e-indicator:hover, .e-stepper:not(.e-step-type-label) .e-step-notstarted .e-step:hover {
   color: #212529;
 }
 .e-stepper:not(.e-step-type-label) .e-step-selected .e-indicator:active,
 .e-stepper:not(.e-step-type-label) .e-step-selected .e-step:active {
-  background: #0a58ca;
+  background: rgb(10.4, 88, 202.4);
 }
 .e-stepper:not(.e-step-type-label) .e-step-valid.e-step-selected .e-indicator:active,
 .e-stepper:not(.e-step-type-label) .e-step-valid.e-step-selected .e-step:active {

package/styles/stepper/fabric-dark.css

@@ -587,14 +587,14 @@
 .e-stepper:not(.e-step-type-label) .e-indicator:hover,
 .e-stepper:not(.e-step-type-label) .e-step:hover {
   color: #fff;
-  background: #006bbd;
+  background: rgb(0, 107.3, 188.7);
 }
 .e-stepper:not(.e-step-type-label) .e-step-notstarted .e-indicator:hover, .e-stepper:not(.e-step-type-label) .e-step-notstarted .e-step:hover {
   color: #dadada;
 }
 .e-stepper:not(.e-step-type-label) .e-step-selected .e-indicator:active,
 .e-stepper:not(.e-step-type-label) .e-step-selected .e-step:active {
-  background: #0063ad;
+  background: rgb(0, 98.6, 173.4);
 }
 .e-stepper:not(.e-step-type-label) .e-step-valid.e-step-selected .e-indicator:active,
 .e-stepper:not(.e-step-type-label) .e-step-valid.e-step-selected .e-step:active {