@syncfusion/ej2-splitbuttons 25.2.4 → 26.1.35-750253

package/styles/material3-dark.css

@@ -44,7 +44,7 @@
   --color-sf-on-warning: 99, 52, 0;
   --color-sf-on-warning-container: 255, 220, 193;
   --color-sf-spreadsheet-gridline: 231, 224, 236;
-  --color-sf-shadow-focus-ring1: 0 0 0 1px #000000, 0 0 0 3px #ffffff;
+  --color-sf-shadow-focus-ring1: 0 0 0 1px #000, 0 0 0 3px #fff;
   --color-sf-success-text: 0, 0, 0;
   --color-sf-warning-text: 0, 0, 0;
   --color-sf-info-text: 0, 0, 0;
@@ -59,27 +59,31 @@
   content: "\e70d";
 }
 
-/*! drop-down button layout */
 .e-dropdown-btn,
 .e-dropdown-btn.e-btn {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   text-transform: none;
   white-space: normal;
   border-radius: 4px;
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
   padding: 7px 16px;
 }
 .e-dropdown-btn:focus,
 .e-dropdown-btn.e-btn:focus {
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
 }
 .e-dropdown-btn:focus-visible,
 .e-dropdown-btn.e-btn:focus-visible {
-  box-shadow: 0 0 0 1px #000000, 0 0 0 3px #ffffff;
+  -webkit-box-shadow: 0 0 0 1px #000, 0 0 0 3px #fff;
+          box-shadow: 0 0 0 1px #000, 0 0 0 3px #fff;
 }
 .e-dropdown-btn:active,
 .e-dropdown-btn.e-btn:active {
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
 }
 .e-dropdown-btn .e-btn-icon,
 .e-dropdown-btn.e-btn .e-btn-icon {
@@ -112,7 +116,6 @@
   line-height: 1;
   padding: 6px 12px;
 }
-
 .e-bigger .e-dropdown-btn .e-btn-icon,
 .e-bigger.e-dropdown-btn .e-btn-icon {
   font-size: 18px;
@@ -138,8 +141,10 @@
 .e-dropdown-popup ul {
   border: 0 solid rgba(var(--color-sf-outline-variant));
   border-radius: 4px;
-  box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
-  box-sizing: border-box;
+  -webkit-box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
   font-size: 14px;
   font-weight: 400;
   list-style-image: none;
@@ -150,18 +155,23 @@
   overflow: hidden;
   padding: 4px 0;
   -webkit-user-select: none;
+     -moz-user-select: none;
       -ms-user-select: none;
           user-select: none;
   white-space: nowrap;
 }
 .e-dropdown-popup ul .e-item {
   cursor: pointer;
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   height: 32px;
   line-height: 32px;
   padding: 0 12px;
 }
+.e-dropdown-popup ul .e-item.e-separator {
+  padding: 0 !important; /* stylelint-disable-line declaration-no-important */
+}
 .e-dropdown-popup ul .e-item.e-url {
   padding: 0;
 }
@@ -182,7 +192,8 @@
 .e-dropdown-popup ul .e-item.e-disabled {
   cursor: auto;
   pointer-events: none;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-dropdown-popup ul .e-item.e-separator {
   border-bottom-style: solid;
@@ -195,7 +206,8 @@
 }
 .e-dropdown-popup.e-transparent {
   background: transparent;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-dropdown-popup.e-transparent .e-dropdown-menu {
   border: 0;
@@ -213,7 +225,8 @@
 
 *.e-bigger .e-dropdown-popup ul,
 *.e-bigger.e-dropdown-popup ul {
-  box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
   font-size: 16px;
   max-width: 202px;
   min-width: 112px;
@@ -240,8 +253,8 @@
   line-height: normal;
 }
 
-/*! drop-down button theme */
 .e-dropdown-popup {
+  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-primary), 0.11)), to(rgba(var(--color-sf-primary), 0.11))), rgba(var(--color-sf-surface));
   background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.11), rgba(var(--color-sf-primary), 0.11)), rgba(var(--color-sf-surface));
   color: rgba(var(--color-sf-on-surface));
 }
@@ -253,7 +266,8 @@
 }
 .e-dropdown-popup ul .e-item.e-focused {
   background: rgba(var(--color-sf-on-surface), 0.04);
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-dropdown-popup ul .e-item:hover {
   background: rgba(var(--color-sf-on-surface), 0.05);
@@ -277,7 +291,8 @@
 .e-dropdown-btn.e-btn.e-inherit {
   background: inherit;
   border-color: transparent;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: inherit;
 }
 .e-dropdown-btn.e-inherit:hover, .e-dropdown-btn.e-inherit:focus, .e-dropdown-btn.e-inherit:active, .e-dropdown-btn.e-inherit.e-active,
@@ -287,41 +302,49 @@
 .e-dropdown-btn.e-btn.e-inherit.e-active {
   background: rgba(0, 0, 0, 0.056);
   border-color: transparent;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: inherit;
 }
 
-/* stylelint-disable-line no-empty-source */
-/*! splitbutton layout */
 .e-split-btn-wrapper {
+  display: -webkit-inline-box;
   display: -ms-inline-flexbox;
   display: inline-flex;
   white-space: nowrap;
+  width: -webkit-min-content;
+  width: -moz-min-content;
   width: min-content;
   border-radius: 4px;
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
 }
 .e-split-btn-wrapper .e-split-btn {
   border-bottom-right-radius: 0;
   border-top-right-radius: 0;
   text-transform: none;
   z-index: 1;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-split-btn-wrapper .e-split-btn:focus {
   outline-offset: 0;
 }
 .e-split-btn-wrapper .e-split-btn:hover {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-split-btn-wrapper .e-split-btn:focus {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-split-btn-wrapper .e-split-btn:focus-visible {
-  box-shadow: 0 0 0 1px #000000, 0 0 0 3px #ffffff;
+  -webkit-box-shadow: 0 0 0 1px #000, 0 0 0 3px #fff;
+          box-shadow: 0 0 0 1px #000, 0 0 0 3px #fff;
 }
 .e-split-btn-wrapper .e-split-btn:active {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   z-index: 2;
 }
 .e-split-btn-wrapper .e-split-btn.e-top-icon-btn {
@@ -350,15 +373,18 @@
   border-bottom-left-radius: 0;
   border-top-left-radius: 0;
   margin-left: -1px;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   padding-left: 4px;
   padding-right: 4px;
 }
 .e-split-btn-wrapper .e-dropdown-btn:focus, .e-split-btn-wrapper .e-dropdown-btn:hover {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-split-btn-wrapper .e-dropdown-btn:active {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   z-index: 2;
 }
 .e-split-btn-wrapper .e-dropdown-btn:disabled:focus, .e-split-btn-wrapper .e-dropdown-btn:disabled:hover, .e-split-btn-wrapper .e-dropdown-btn:disabled:active {
@@ -368,25 +394,32 @@
   outline-offset: 0;
 }
 .e-split-btn-wrapper .e-btn {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-split-btn-wrapper .e-btn:hover {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-split-btn-wrapper .e-btn:focus {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-split-btn-wrapper .e-btn:focus-visible {
-  box-shadow: 0 0 0 1px #000000, 0 0 0 3px #ffffff;
+  -webkit-box-shadow: 0 0 0 1px #000, 0 0 0 3px #fff;
+          box-shadow: 0 0 0 1px #000, 0 0 0 3px #fff;
 }
 .e-split-btn-wrapper .e-btn:active {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-split-btn-wrapper .e-btn:disabled {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-split-btn-wrapper .e-btn.e-inherit:focus, .e-split-btn-wrapper .e-btn.e-inherit:active {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-split-btn-wrapper.e-rtl .e-split-btn {
   border-bottom-left-radius: 0;
@@ -419,7 +452,8 @@
   border-top-right-radius: 0;
   margin-left: 0;
   border-radius: 4px;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-split-btn-wrapper.e-vertical {
   display: inline-block;
@@ -434,7 +468,8 @@
   border-top-right-radius: 100px;
   line-height: 1;
   border-radius: 4px;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-split-btn-wrapper.e-vertical .e-split-btn .e-icon-top {
   padding-bottom: 4px;
@@ -446,7 +481,8 @@
   margin-left: 0;
   margin-top: -1px;
   border-radius: 4px;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-split-btn-wrapper.e-vertical .e-dropdown-btn .e-icon-bottom {
   padding-top: 0;
@@ -464,12 +500,14 @@
 .e-bigger .e-split-btn-wrapper,
 .e-bigger.e-split-btn-wrapper {
   border-radius: 4px;
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
 }
 .e-bigger .e-split-btn-wrapper .e-split-btn,
 .e-bigger.e-split-btn-wrapper .e-split-btn {
   border-radius: 4px;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   padding-left: 12px;
   padding-right: 6px;
 }
@@ -544,9 +582,10 @@
   padding-top: 0;
 }
 
-/*! splitbutton theme */
 .e-split-btn-wrapper .e-split-btn {
-  border-image: linear-gradient(to right, rgba(var(--color-sf-surface), 1) 25%, rgba(var(--color-sf-outline-variant), 1) 75%) 1;
+  -o-border-image: linear-gradient(to right, rgba(var(--color-sf-surface), 1) 25%, rgba(var(--color-sf-outline-variant), 1) 75%) 1;
+     border-image: -webkit-gradient(linear, left top, right top, color-stop(25%, rgba(var(--color-sf-surface), 1)), color-stop(75%, rgba(var(--color-sf-outline-variant), 1))) 1;
+     border-image: linear-gradient(to right, rgba(var(--color-sf-surface), 1) 25%, rgba(var(--color-sf-outline-variant), 1) 75%) 1;
   border-width: 0 1px 0 0;
 }
 .e-split-btn-wrapper .e-split-btn:focus {
@@ -562,7 +601,8 @@
   border-color: transparent;
 }
 .e-split-btn-wrapper.e-splitbtn-disabled {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-split-btn-wrapper:hover :not(e-active) .e-split-btn {
   border-right-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05));
@@ -571,7 +611,9 @@
   border-right-color: rgba(var(--color-sf-secondary), 0);
 }
 .e-split-btn-wrapper.e-rtl .e-split-btn {
-  border-image: linear-gradient(to left, rgba(var(--color-sf-surface), 1) 25%, rgba(var(--color-sf-outline-variant), 1) 75%) 1;
+  -o-border-image: linear-gradient(to left, rgba(var(--color-sf-surface), 1) 25%, rgba(var(--color-sf-outline-variant), 1) 75%) 1;
+     border-image: -webkit-gradient(linear, right top, left top, color-stop(25%, rgba(var(--color-sf-surface), 1)), color-stop(75%, rgba(var(--color-sf-outline-variant), 1))) 1;
+     border-image: linear-gradient(to left, rgba(var(--color-sf-surface), 1) 25%, rgba(var(--color-sf-outline-variant), 1) 75%) 1;
   border-width: 0 0 0 1px;
 }
 .e-split-btn-wrapper.e-rtl .e-split-btn:focus {
@@ -597,7 +639,9 @@
   border-left-color: rgba(var(--color-sf-secondary), 0);
 }
 .e-split-btn-wrapper.e-vertical .e-split-btn {
-  border-image: linear-gradient(to bottom, rgba(var(--color-sf-surface), 1) 25%, rgba(var(--color-sf-outline-variant), 1) 75%) 1;
+  -o-border-image: linear-gradient(to bottom, rgba(var(--color-sf-surface), 1) 25%, rgba(var(--color-sf-outline-variant), 1) 75%) 1;
+     border-image: -webkit-gradient(linear, left top, left bottom, color-stop(25%, rgba(var(--color-sf-surface), 1)), color-stop(75%, rgba(var(--color-sf-outline-variant), 1))) 1;
+     border-image: linear-gradient(to bottom, rgba(var(--color-sf-surface), 1) 25%, rgba(var(--color-sf-outline-variant), 1) 75%) 1;
   border-width: 0 0 2px;
   border-bottom-color: rgba(var(--color-sf-outline-variant));
   border-right-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05));
@@ -652,14 +696,18 @@
 /* stylelint-disable */
 *.e-btn-group,
 *.e-css.e-btn-group {
+  display: -webkit-inline-box;
   display: -ms-inline-flexbox;
   display: inline-flex;
   border-radius: 4px;
-  -ms-flex-direction: row;
-      flex-direction: row;
+  -webkit-box-orient: horizontal;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: row;
+          flex-direction: row;
   position: relative;
   border-radius: 4px;
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
 }
 *.e-btn-group input + label.e-btn,
 *.e-css.e-btn-group input + label.e-btn {
@@ -689,8 +737,9 @@
 *.e-css.e-btn-group:not(.e-rtl):not(.e-vertical) .e-btn:not(:first-of-type):not(:last-of-type) {
   border-radius: 0;
 }
-*.e-btn-group:not(.e-rtl):not(.e-vertical) .e-btn:first-of-type,
-*.e-css.e-btn-group:not(.e-rtl):not(.e-vertical) .e-btn:first-of-type {
+*.e-btn-group:not(.e-rtl):not(.e-vertical) .e-btn:first-of-type, *.e-btn-group:not(.e-rtl):not(.e-vertical) .e-btn:last-of-type:not(:last-child),
+*.e-css.e-btn-group:not(.e-rtl):not(.e-vertical) .e-btn:first-of-type,
+*.e-css.e-btn-group:not(.e-rtl):not(.e-vertical) .e-btn:last-of-type:not(:last-child) {
   border-bottom-right-radius: 0;
   border-top-right-radius: 0;
 }
@@ -699,11 +748,6 @@
   border-bottom-left-radius: 0;
   border-top-left-radius: 0;
 }
-*.e-btn-group:not(.e-rtl):not(.e-vertical) .e-btn:last-of-type:not(:last-child),
-*.e-css.e-btn-group:not(.e-rtl):not(.e-vertical) .e-btn:last-of-type:not(:last-child) {
-  border-bottom-right-radius: 0;
-  border-top-right-radius: 0;
-}
 *.e-btn-group:not(.e-rtl):not(.e-vertical) .e-split-btn-wrapper + .e-btn,
 *.e-css.e-btn-group:not(.e-rtl):not(.e-vertical) .e-split-btn-wrapper + .e-btn {
   border-bottom-left-radius: 0;
@@ -737,8 +781,9 @@
 *.e-css.e-btn-group.e-rtl .e-btn:not(:first-of-type):not(:last-of-type) {
   border-radius: 0;
 }
-*.e-btn-group.e-rtl .e-btn:first-of-type,
-*.e-css.e-btn-group.e-rtl .e-btn:first-of-type {
+*.e-btn-group.e-rtl .e-btn:first-of-type, *.e-btn-group.e-rtl .e-btn:last-of-type:not(:last-child),
+*.e-css.e-btn-group.e-rtl .e-btn:first-of-type,
+*.e-css.e-btn-group.e-rtl .e-btn:last-of-type:not(:last-child) {
   border-bottom-left-radius: 0;
   border-top-left-radius: 0;
 }
@@ -747,11 +792,6 @@
   border-bottom-right-radius: 0;
   border-top-right-radius: 0;
 }
-*.e-btn-group.e-rtl .e-btn:last-of-type:not(:last-child),
-*.e-css.e-btn-group.e-rtl .e-btn:last-of-type:not(:last-child) {
-  border-bottom-left-radius: 0;
-  border-top-left-radius: 0;
-}
 *.e-btn-group.e-rtl .e-split-btn-wrapper + .e-btn,
 *.e-css.e-btn-group.e-rtl .e-split-btn-wrapper + .e-btn {
   border-bottom-right-radius: 0;
@@ -779,8 +819,10 @@
 }
 *.e-btn-group.e-vertical,
 *.e-css.e-btn-group.e-vertical {
-  -ms-flex-direction: column;
-      flex-direction: column;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
 }
 *.e-btn-group.e-vertical input,
 *.e-css.e-btn-group.e-vertical input {
@@ -887,17 +929,20 @@
 /* stylelint-disable */
 .e-btn-group .e-btn,
 .e-css.e-btn-group .e-btn {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-btn-group .e-btn:hover,
 .e-css.e-btn-group .e-btn:hover {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-btn-group .e-btn:focus-visible,
 .e-btn-group input:focus-visible + label.e-btn,
 .e-css.e-btn-group .e-btn:focus-visible,
 .e-css.e-btn-group input:focus-visible + label.e-btn {
-  box-shadow: 0 0 0 1px #000000, 0 0 0 3px #ffffff !important;
+  -webkit-box-shadow: 0 0 0 1px #000, 0 0 0 3px #fff !important;
+          box-shadow: 0 0 0 1px #000, 0 0 0 3px #fff !important;
   z-index: 1;
 }
 .e-btn-group .e-btn:focus-visible.e-primary, .e-btn-group .e-btn:focus-visible.e-success, .e-btn-group .e-btn:focus-visible.e-info, .e-btn-group .e-btn:focus-visible.e-warning, .e-btn-group .e-btn:focus-visible.e-danger,
@@ -916,14 +961,16 @@
 .e-css.e-btn-group input:focus-visible + label.e-btn.e-info,
 .e-css.e-btn-group input:focus-visible + label.e-btn.e-warning,
 .e-css.e-btn-group input:focus-visible + label.e-btn.e-danger {
-  box-shadow: 0 0 0 1px #000000, 0 0 0 3px #ffffff !important;
+  -webkit-box-shadow: 0 0 0 1px #000, 0 0 0 3px #fff !important;
+          box-shadow: 0 0 0 1px #000, 0 0 0 3px #fff !important;
   z-index: 1;
 }
 .e-btn-group .e-btn:focus-visible.e-outline,
 .e-btn-group input:focus-visible + label.e-btn.e-outline,
 .e-css.e-btn-group .e-btn:focus-visible.e-outline,
 .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline {
-  box-shadow: 0 0 0 1px #000000, 0 0 0 3px #ffffff !important;
+  -webkit-box-shadow: 0 0 0 1px #000, 0 0 0 3px #fff !important;
+          box-shadow: 0 0 0 1px #000, 0 0 0 3px #fff !important;
   z-index: 1;
 }
 .e-btn-group .e-btn:focus-visible.e-outline.e-primary, .e-btn-group .e-btn:focus-visible.e-outline.e-success, .e-btn-group .e-btn:focus-visible.e-outline.e-info, .e-btn-group .e-btn:focus-visible.e-outline.e-warning, .e-btn-group .e-btn:focus-visible.e-outline.e-danger,
@@ -942,7 +989,8 @@
 .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-info,
 .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-warning,
 .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-danger {
-  box-shadow: 0 0 0 1px #000000, 0 0 0 3px #ffffff !important;
+  -webkit-box-shadow: 0 0 0 1px #000, 0 0 0 3px #fff !important;
+          box-shadow: 0 0 0 1px #000, 0 0 0 3px #fff !important;
   z-index: 1;
 }
 .e-btn-group .e-btn:focus,
@@ -951,13 +999,18 @@
 .e-css.e-btn-group .e-btn:focus,
 .e-css.e-btn-group input:focus-visible + label.e-btn,
 .e-css.e-btn-group input:focus + label.e-btn {
+  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-on-surface), 0.08)), to(rgba(var(--color-sf-on-surface), 0.08))), rgba(var(--color-sf-surface));
   background: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.08), rgba(var(--color-sf-on-surface), 0.08)), rgba(var(--color-sf-surface));
-  border-image: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.08), rgba(var(--color-sf-on-surface), 0.08));
+  -o-border-image: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.08), rgba(var(--color-sf-on-surface), 0.08));
+     border-image: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-on-surface), 0.08)), to(rgba(var(--color-sf-on-surface), 0.08)));
+     border-image: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.08), rgba(var(--color-sf-on-surface), 0.08));
   color: rgba(var(--color-sf-on-surface));
   outline: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05)), rgba(var(--color-sf-surface)) 0 solid;
   outline-offset: 0;
-  box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
-  box-shadow: none;
+  -webkit-box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: none;
+          box-shadow: none;
   outline-color: inherit;
 }
 .e-btn-group .e-btn:focus.e-primary,
@@ -966,12 +1019,15 @@
 .e-css.e-btn-group .e-btn:focus.e-primary,
 .e-css.e-btn-group input:focus-visible + label.e-btn.e-primary,
 .e-css.e-btn-group input:focus + label.e-btn.e-primary {
+  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-on-primary), 0.08)), to(rgba(var(--color-sf-on-primary), 0.08))), rgba(var(--color-sf-primary));
   background: linear-gradient(0deg, rgba(var(--color-sf-on-primary), 0.08), rgba(var(--color-sf-on-primary), 0.08)), rgba(var(--color-sf-primary));
   border-color: rgba(var(--color-sf-primary));
   color: rgba(var(--color-sf-on-primary));
   outline: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05)), rgba(var(--color-sf-surface)) 0 solid;
-  box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
-  box-shadow: none;
+  -webkit-box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: none;
+          box-shadow: none;
   outline-color: inherit;
 }
 .e-btn-group .e-btn:focus.e-success,
@@ -980,11 +1036,14 @@
 .e-css.e-btn-group .e-btn:focus.e-success,
 .e-css.e-btn-group input:focus-visible + label.e-btn.e-success,
 .e-css.e-btn-group input:focus + label.e-btn.e-success {
+  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-success-text), 0.08)), to(rgba(var(--color-sf-success-text), 0.08))), rgba(var(--color-sf-success));
   background: linear-gradient(0deg, rgba(var(--color-sf-success-text), 0.08), rgba(var(--color-sf-success-text), 0.08)), rgba(var(--color-sf-success));
   border-color: rgba(var(--color-sf-success));
   color: rgba(var(--color-sf-success-text));
-  box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
-  box-shadow: none;
+  -webkit-box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: none;
+          box-shadow: none;
   outline-color: inherit;
 }
 .e-btn-group .e-btn:focus.e-info,
@@ -993,11 +1052,14 @@
 .e-css.e-btn-group .e-btn:focus.e-info,
 .e-css.e-btn-group input:focus-visible + label.e-btn.e-info,
 .e-css.e-btn-group input:focus + label.e-btn.e-info {
+  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-info-text), 0.08)), to(rgba(var(--color-sf-info-text), 0.08))), rgba(var(--color-sf-info));
   background: linear-gradient(0deg, rgba(var(--color-sf-info-text), 0.08), rgba(var(--color-sf-info-text), 0.08)), rgba(var(--color-sf-info));
   border-color: rgba(var(--color-sf-info));
   color: rgba(var(--color-sf-info-text));
-  box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
-  box-shadow: none;
+  -webkit-box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: none;
+          box-shadow: none;
   outline-color: inherit;
 }
 .e-btn-group .e-btn:focus.e-warning,
@@ -1006,11 +1068,14 @@
 .e-css.e-btn-group .e-btn:focus.e-warning,
 .e-css.e-btn-group input:focus-visible + label.e-btn.e-warning,
 .e-css.e-btn-group input:focus + label.e-btn.e-warning {
+  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-warning-text), 0.08)), to(rgba(var(--color-sf-warning-text), 0.08))), rgba(var(--color-sf-warning));
   background: linear-gradient(0deg, rgba(var(--color-sf-warning-text), 0.08), rgba(var(--color-sf-warning-text), 0.08)), rgba(var(--color-sf-warning));
   border-color: rgba(var(--color-sf-warning));
   color: rgba(var(--color-sf-warning-text));
-  box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
-  box-shadow: none;
+  -webkit-box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: none;
+          box-shadow: none;
   outline-color: inherit;
 }
 .e-btn-group .e-btn:focus.e-danger,
@@ -1019,11 +1084,14 @@
 .e-css.e-btn-group .e-btn:focus.e-danger,
 .e-css.e-btn-group input:focus-visible + label.e-btn.e-danger,
 .e-css.e-btn-group input:focus + label.e-btn.e-danger {
+  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-danger-text), 0.08)), to(rgba(var(--color-sf-danger-text), 0.08))), rgba(var(--color-sf-error));
   background: linear-gradient(0deg, rgba(var(--color-sf-danger-text), 0.08), rgba(var(--color-sf-danger-text), 0.08)), rgba(var(--color-sf-error));
   border-color: rgba(var(--color-sf-error));
   color: rgba(var(--color-sf-danger-text));
-  box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
-  box-shadow: none;
+  -webkit-box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: none;
+          box-shadow: none;
   outline-color: inherit;
 }
 .e-btn-group .e-btn:focus.e-link,
@@ -1037,7 +1105,8 @@
   color: rgba(var(--color-sf-info));
   background-color: transparent;
   border-color: transparent;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   outline: none;
 }
 .e-btn-group .e-btn:focus.e-outline,
@@ -1049,7 +1118,8 @@
   background: rgba(var(--color-sf-on-surface), 0.12);
   border: 1px solid rgba(var(--color-sf-outline));
   color: rgba(var(--color-sf-on-surface));
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-btn-group .e-btn:focus.e-outline.e-primary,
 .e-btn-group input:focus-visible + label.e-btn.e-outline.e-primary,
@@ -1060,7 +1130,8 @@
   background: rgba(var(--color-sf-primary), 0.12);
   border: 1px solid rgba(var(--color-sf-outline));
   color: rgba(var(--color-sf-primary));
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-btn-group .e-btn:focus.e-outline.e-success,
 .e-btn-group input:focus-visible + label.e-btn.e-outline.e-success,
@@ -1071,7 +1142,8 @@
   background: rgba(var(--color-sf-success), 0.12);
   border: 1px solid rgba(var(--color-sf-outline));
   color: rgba(var(--color-sf-success));
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-btn-group .e-btn:focus.e-outline.e-info,
 .e-btn-group input:focus-visible + label.e-btn.e-outline.e-info,
@@ -1082,7 +1154,8 @@
   background: rgba(var(--color-sf-info), 0.12);
   border: 1px solid rgba(var(--color-sf-outline));
   color: rgba(var(--color-sf-info));
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-btn-group .e-btn:focus.e-outline.e-warning,
 .e-btn-group input:focus-visible + label.e-btn.e-outline.e-warning,
@@ -1093,7 +1166,8 @@
   background: rgba(var(--color-sf-warning), 0.12);
   border: 1px solid rgba(var(--color-sf-outline));
   color: rgba(var(--color-sf-warning));
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-btn-group .e-btn:focus.e-outline.e-danger,
 .e-btn-group input:focus-visible + label.e-btn.e-outline.e-danger,
@@ -1104,7 +1178,8 @@
   background: rgba(var(--color-sf-error), 0.12);
   border: 1px solid rgba(var(--color-sf-outline));
   color: rgba(var(--color-sf-error));
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-btn-group .e-btn:active,
 .e-btn-group input:active + label.e-btn,
@@ -1112,12 +1187,16 @@
 .e-css.e-btn-group .e-btn:active,
 .e-css.e-btn-group input:active + label.e-btn,
 .e-css.e-btn-group input:checked + label.e-btn {
+  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-on-surface), 0.12)), to(rgba(var(--color-sf-on-surface), 0.12))), rgba(var(--color-sf-surface));
   background: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.12), rgba(var(--color-sf-on-surface), 0.12)), rgba(var(--color-sf-surface));
-  border-image: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.12), rgba(var(--color-sf-on-surface), 0.12));
+  -o-border-image: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.12), rgba(var(--color-sf-on-surface), 0.12));
+     border-image: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-on-surface), 0.12)), to(rgba(var(--color-sf-on-surface), 0.12)));
+     border-image: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.12), rgba(var(--color-sf-on-surface), 0.12));
   color: rgba(var(--color-sf-on-surface));
   outline: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05)), rgba(var(--color-sf-surface)) 0 solid;
   outline-offset: 0;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-btn-group .e-btn:active.e-primary,
 .e-btn-group input:active + label.e-btn.e-primary,
@@ -1125,12 +1204,15 @@
 .e-css.e-btn-group .e-btn:active.e-primary,
 .e-css.e-btn-group input:active + label.e-btn.e-primary,
 .e-css.e-btn-group input:checked + label.e-btn.e-primary {
+  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-on-primary), 0.12)), to(rgba(var(--color-sf-on-primary), 0.12))), rgba(var(--color-sf-primary));
   background: linear-gradient(0deg, rgba(var(--color-sf-on-primary), 0.12), rgba(var(--color-sf-on-primary), 0.12)), rgba(var(--color-sf-primary));
   border-color: rgba(var(--color-sf-primary));
   color: rgba(var(--color-sf-on-primary));
   outline: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05)), rgba(var(--color-sf-surface)) 0 solid;
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
-  box-shadow: none;
+  -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-btn-group .e-btn:active.e-success,
 .e-btn-group input:active + label.e-btn.e-success,
@@ -1138,11 +1220,14 @@
 .e-css.e-btn-group .e-btn:active.e-success,
 .e-css.e-btn-group input:active + label.e-btn.e-success,
 .e-css.e-btn-group input:checked + label.e-btn.e-success {
+  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-success-text), 0.12)), to(rgba(var(--color-sf-success-text), 0.12))), rgba(var(--color-sf-success));
   background: linear-gradient(0deg, rgba(var(--color-sf-success-text), 0.12), rgba(var(--color-sf-success-text), 0.12)), rgba(var(--color-sf-success));
   border-color: rgba(var(--color-sf-success));
   color: rgba(var(--color-sf-success-text));
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
-  box-shadow: none;
+  -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-btn-group .e-btn:active.e-info,
 .e-btn-group input:active + label.e-btn.e-info,
@@ -1150,11 +1235,14 @@
 .e-css.e-btn-group .e-btn:active.e-info,
 .e-css.e-btn-group input:active + label.e-btn.e-info,
 .e-css.e-btn-group input:checked + label.e-btn.e-info {
+  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-info-text), 0.12)), to(rgba(var(--color-sf-info-text), 0.12))), rgba(var(--color-sf-info));
   background: linear-gradient(0deg, rgba(var(--color-sf-info-text), 0.12), rgba(var(--color-sf-info-text), 0.12)), rgba(var(--color-sf-info));
   color: rgba(var(--color-sf-info-text));
   border-color: rgba(var(--color-sf-info));
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
-  box-shadow: none;
+  -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-btn-group .e-btn:active.e-warning,
 .e-btn-group input:active + label.e-btn.e-warning,
@@ -1162,11 +1250,14 @@
 .e-css.e-btn-group .e-btn:active.e-warning,
 .e-css.e-btn-group input:active + label.e-btn.e-warning,
 .e-css.e-btn-group input:checked + label.e-btn.e-warning {
+  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-warning-text), 0.12)), to(rgba(var(--color-sf-warning-text), 0.12))), rgba(var(--color-sf-warning));
   background: linear-gradient(0deg, rgba(var(--color-sf-warning-text), 0.12), rgba(var(--color-sf-warning-text), 0.12)), rgba(var(--color-sf-warning));
   border-color: rgba(var(--color-sf-warning));
   color: rgba(var(--color-sf-warning-text));
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
-  box-shadow: none;
+  -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-btn-group .e-btn:active.e-danger,
 .e-btn-group input:active + label.e-btn.e-danger,
@@ -1174,11 +1265,14 @@
 .e-css.e-btn-group .e-btn:active.e-danger,
 .e-css.e-btn-group input:active + label.e-btn.e-danger,
 .e-css.e-btn-group input:checked + label.e-btn.e-danger {
+  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-danger-text), 0.12)), to(rgba(var(--color-sf-danger-text), 0.12))), rgba(var(--color-sf-error));
   background: linear-gradient(0deg, rgba(var(--color-sf-danger-text), 0.12), rgba(var(--color-sf-danger-text), 0.12)), rgba(var(--color-sf-error));
   border-color: rgba(var(--color-sf-error));
   color: rgba(var(--color-sf-danger-text));
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
-  box-shadow: none;
+  -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 .e-btn-group .e-btn:active.e-outline,
 .e-btn-group input:active + label.e-btn.e-outline,
@@ -1188,7 +1282,8 @@
 .e-css.e-btn-group input:checked + label.e-btn.e-outline {
   background: rgba(var(--color-sf-on-surface), 0.12);
   border-color: rgba(var(--color-sf-outline));
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: rgba(var(--color-sf-on-surface));
   box-shadow: none;
 }
@@ -1198,9 +1293,11 @@
 .e-css.e-btn-group .e-btn:active.e-outline.e-primary,
 .e-css.e-btn-group input:active + label.e-btn.e-outline.e-primary,
 .e-css.e-btn-group input:checked + label.e-btn.e-outline.e-primary {
+  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-on-primary), 0.12)), to(rgba(var(--color-sf-on-primary), 0.12))), rgba(var(--color-sf-primary));
   background: linear-gradient(0deg, rgba(var(--color-sf-on-primary), 0.12), rgba(var(--color-sf-on-primary), 0.12)), rgba(var(--color-sf-primary));
   border-color: rgba(var(--color-sf-primary));
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: rgba(var(--color-sf-on-primary));
   background: rgba(var(--color-sf-primary), 0.12);
   border: 1px solid rgba(var(--color-sf-outline));
@@ -1213,9 +1310,11 @@
 .e-css.e-btn-group .e-btn:active.e-outline.e-success,
 .e-css.e-btn-group input:active + label.e-btn.e-outline.e-success,
 .e-css.e-btn-group input:checked + label.e-btn.e-outline.e-success {
+  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-success-text), 0.12)), to(rgba(var(--color-sf-success-text), 0.12))), rgba(var(--color-sf-success));
   background: linear-gradient(0deg, rgba(var(--color-sf-success-text), 0.12), rgba(var(--color-sf-success-text), 0.12)), rgba(var(--color-sf-success));
   border-color: rgba(var(--color-sf-success));
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: rgba(var(--color-sf-success-text));
   background: rgba(var(--color-sf-success), 0.12);
   border: 1px solid rgba(var(--color-sf-outline));
@@ -1228,9 +1327,11 @@
 .e-css.e-btn-group .e-btn:active.e-outline.e-info,
 .e-css.e-btn-group input:active + label.e-btn.e-outline.e-info,
 .e-css.e-btn-group input:checked + label.e-btn.e-outline.e-info {
+  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-info-text), 0.12)), to(rgba(var(--color-sf-info-text), 0.12))), rgba(var(--color-sf-info));
   background: linear-gradient(0deg, rgba(var(--color-sf-info-text), 0.12), rgba(var(--color-sf-info-text), 0.12)), rgba(var(--color-sf-info));
   border-color: rgba(var(--color-sf-info));
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: rgba(var(--color-sf-info-text));
   background: rgba(var(--color-sf-info), 0.12);
   border: 1px solid rgba(var(--color-sf-outline));
@@ -1243,9 +1344,11 @@
 .e-css.e-btn-group .e-btn:active.e-outline.e-warning,
 .e-css.e-btn-group input:active + label.e-btn.e-outline.e-warning,
 .e-css.e-btn-group input:checked + label.e-btn.e-outline.e-warning {
+  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-warning-text), 0.12)), to(rgba(var(--color-sf-warning-text), 0.12))), rgba(var(--color-sf-warning));
   background: linear-gradient(0deg, rgba(var(--color-sf-warning-text), 0.12), rgba(var(--color-sf-warning-text), 0.12)), rgba(var(--color-sf-warning));
   border-color: rgba(var(--color-sf-warning));
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: rgba(var(--color-sf-warning-text));
   background: rgba(var(--color-sf-warning), 0.12);
   border: 1px solid rgba(var(--color-sf-outline));
@@ -1258,9 +1361,11 @@
 .e-css.e-btn-group .e-btn:active.e-outline.e-danger,
 .e-css.e-btn-group input:active + label.e-btn.e-outline.e-danger,
 .e-css.e-btn-group input:checked + label.e-btn.e-outline.e-danger {
+  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-danger-text), 0.12)), to(rgba(var(--color-sf-danger-text), 0.12))), rgba(var(--color-sf-error));
   background: linear-gradient(0deg, rgba(var(--color-sf-danger-text), 0.12), rgba(var(--color-sf-danger-text), 0.12)), rgba(var(--color-sf-error));
   border-color: rgba(var(--color-sf-error));
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: rgba(var(--color-sf-danger-text));
   background: rgba(var(--color-sf-error), 0.12);
   border: 1px solid rgba(var(--color-sf-outline));
@@ -1273,7 +1378,8 @@
 .e-css.e-btn-group input:disabled + label.e-btn {
   background-color: rgba(var(--color-sf-secondary), 0.12);
   border-color: rgba(var(--color-sf-secondary), 0);
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: rgba(var(--color-sf-on-surface), 0.38);
   border-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.05), rgba(var(--color-sf-primary), 0.05));
 }
@@ -1283,7 +1389,8 @@
 .e-css.e-btn-group input:disabled + label.e-btn.e-primary {
   background: rgba(var(--color-sf-secondary), 0.12);
   border-color: rgba(var(--color-sf-secondary), 0);
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: rgba(var(--color-sf-on-surface), 0.38);
   border-color: rgba(var(--color-sf-primary));
 }
@@ -1293,7 +1400,8 @@
 .e-css.e-btn-group input:disabled + label.e-btn.e-success {
   background: rgba(var(--color-sf-secondary), 0.12);
   border-color: rgba(var(--color-sf-secondary), 0);
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: rgba(var(--color-sf-on-surface), 0.38);
   border-color: rgba(var(--color-sf-success));
 }
@@ -1303,7 +1411,8 @@
 .e-css.e-btn-group input:disabled + label.e-btn.e-info {
   background: rgba(var(--color-sf-secondary), 0.12);
   border-color: rgba(var(--color-sf-secondary), 0);
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: rgba(var(--color-sf-on-surface), 0.38);
   border-color: rgba(var(--color-sf-info));
 }
@@ -1313,7 +1422,8 @@
 .e-css.e-btn-group input:disabled + label.e-btn.e-warning {
   background: rgba(var(--color-sf-secondary), 0.12);
   border-color: rgba(var(--color-sf-secondary), 0);
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: rgba(var(--color-sf-on-surface), 0.38);
   border-color: rgba(var(--color-sf-warning));
 }
@@ -1323,7 +1433,8 @@
 .e-css.e-btn-group input:disabled + label.e-btn.e-danger {
   background: rgba(var(--color-sf-secondary), 0.12);
   border-color: rgba(var(--color-sf-secondary), 0);
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: rgba(var(--color-sf-on-surface), 0.38);
   border-color: rgba(var(--color-sf-error));
 }
@@ -1333,7 +1444,8 @@
 .e-css.e-btn-group input:disabled + label.e-btn.e-link {
   color: rgba(var(--color-sf-on-surface), 0.38);
   background: transparent;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   text-decoration: none;
   border-color: transparent;
 }
@@ -1343,7 +1455,8 @@
 .e-css.e-btn-group input:disabled + label.e-btn.e-outline {
   background: transparent;
   border-color: rgba(var(--color-sf-secondary), 0.12);
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: rgba(var(--color-sf-on-surface), 0.38);
   border-color: rgba(var(--color-sf-outline));
 }
@@ -1353,7 +1466,8 @@
 .e-css.e-btn-group input:disabled + label.e-btn.e-outline.e-primary {
   background: transparent;
   border-color: rgba(var(--color-sf-secondary), 0.12);
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: rgba(var(--color-sf-on-surface), 0.38);
   border-color: rgba(var(--color-sf-primary));
 }
@@ -1363,7 +1477,8 @@
 .e-css.e-btn-group input:disabled + label.e-btn.e-outline.e-success {
   background: transparent;
   border-color: rgba(var(--color-sf-secondary), 0.12);
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: rgba(var(--color-sf-on-surface), 0.38);
   border-color: rgba(var(--color-sf-success));
 }
@@ -1373,7 +1488,8 @@
 .e-css.e-btn-group input:disabled + label.e-btn.e-outline.e-info {
   background: transparent;
   border-color: rgba(var(--color-sf-secondary), 0.12);
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: rgba(var(--color-sf-on-surface), 0.38);
   border-color: rgba(var(--color-sf-info));
 }
@@ -1383,7 +1499,8 @@
 .e-css.e-btn-group input:disabled + label.e-btn.e-outline.e-warning {
   background: transparent;
   border-color: rgba(var(--color-sf-secondary), 0.12);
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: rgba(var(--color-sf-on-surface), 0.38);
   border-color: rgba(var(--color-sf-warning));
 }
@@ -1393,7 +1510,8 @@
 .e-css.e-btn-group input:disabled + label.e-btn.e-outline.e-danger {
   background: transparent;
   border-color: rgba(var(--color-sf-secondary), 0.12);
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   color: rgba(var(--color-sf-on-surface), 0.38);
   border-color: rgba(var(--color-sf-error));
 }
@@ -1522,23 +1640,46 @@
 }
 
 /* stylelint-disable property-no-vendor-prefix */
+@-webkit-keyframes material-spinner-rotate {
+  0% {
+    -webkit-transform: rotate(0deg);
+    transform: rotate(0deg);
+  }
+  100% {
+    -webkit-transform: rotate(360deg);
+    transform: rotate(360deg);
+  }
+}
 @keyframes material-spinner-rotate {
   0% {
+    -webkit-transform: rotate(0deg);
     transform: rotate(0deg);
   }
   100% {
+    -webkit-transform: rotate(360deg);
+    transform: rotate(360deg);
+  }
+}
+@-webkit-keyframes fabric-spinner-rotate {
+  0% {
+    -webkit-transform: rotate(0deg);
+    transform: rotate(0deg);
+  }
+  100% {
+    -webkit-transform: rotate(360deg);
     transform: rotate(360deg);
   }
 }
 @keyframes fabric-spinner-rotate {
   0% {
+    -webkit-transform: rotate(0deg);
     transform: rotate(0deg);
   }
   100% {
+    -webkit-transform: rotate(360deg);
     transform: rotate(360deg);
   }
 }
-/*! Progress Button Layout */
 .e-progress-btn {
   position: relative;
 }
@@ -1548,9 +1689,11 @@
   opacity: 0;
   position: absolute;
   top: 0;
+  -webkit-transition: opacity 0.3s linear;
   transition: opacity 0.3s linear;
 }
 .e-progress-btn .e-spinner {
+  -webkit-transition: all 0.3s linear;
   transition: all 0.3s linear;
 }
 .e-progress-btn .e-btn-content {
@@ -1583,6 +1726,7 @@
   opacity: 0;
 }
 .e-progress-btn.e-spin-top, .e-progress-btn.e-spin-bottom {
+  -webkit-transition: padding 0.3s linear;
   transition: padding 0.3s linear;
 }
 .e-progress-btn.e-progress-active:not(.e-hide-spinner).e-spin-top .e-btn-content,
@@ -1592,10 +1736,12 @@
   line-height: 1;
 }
 .e-progress-btn.e-progress-active:not(.e-hide-spinner).e-spin-center .e-spinner {
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
-  -ms-flex-pack: center;
-      justify-content: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
 }
 .e-progress-btn.e-progress-active:not(.e-hide-spinner).e-spin-left:not(.e-round) .e-spinner {
   padding-right: 12px;
@@ -1681,21 +1827,35 @@
   left: auto;
   position: relative;
   top: auto;
-  transform: none;
+  -webkit-transform: none;
+          transform: none;
 }
 .e-progress-btn .e-cont-animate {
-  -ms-flex-align: center;
-      align-items: center;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  display: -webkit-inline-box;
   display: -ms-inline-flexbox;
   display: inline-flex;
   height: 100%;
-  -ms-flex-pack: center;
-      justify-content: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
   left: 0;
   position: absolute;
   top: 0;
   width: 100%;
 }
+@-webkit-keyframes ProgressSlideLeft {
+  from {
+    left: 0%;
+    opacity: 1;
+  }
+  to {
+    left: -100%;
+    opacity: 0;
+  }
+}
 @keyframes ProgressSlideLeft {
   from {
     left: 0%;
@@ -1706,6 +1866,16 @@
     opacity: 0;
   }
 }
+@-webkit-keyframes ProgressSlideRight {
+  from {
+    left: 0%;
+    opacity: 1;
+  }
+  to {
+    left: 100%;
+    opacity: 0;
+  }
+}
 @keyframes ProgressSlideRight {
   from {
     left: 0%;
@@ -1716,6 +1886,18 @@
     opacity: 0;
   }
 }
+@-webkit-keyframes ProgressSlideUp {
+  from {
+    height: auto;
+    opacity: 1;
+    top: 0;
+  }
+  to {
+    height: auto;
+    opacity: 0;
+    top: -100px;
+  }
+}
 @keyframes ProgressSlideUp {
   from {
     height: auto;
@@ -1728,6 +1910,18 @@
     top: -100px;
   }
 }
+@-webkit-keyframes ProgressSlideDown {
+  from {
+    height: auto;
+    opacity: 1;
+    top: 0;
+  }
+  to {
+    height: auto;
+    opacity: 0;
+    top: 100px;
+  }
+}
 @keyframes ProgressSlideDown {
   from {
     height: auto;
@@ -1740,22 +1934,48 @@
     top: 100px;
   }
 }
+@-webkit-keyframes ProgressZoomIn {
+  from {
+    opacity: 1;
+    -webkit-transform: translate(0, 0) scale(1);
+            transform: translate(0, 0) scale(1);
+  }
+  to {
+    opacity: 0;
+    -webkit-transform: translate(0, 0) scale(3);
+            transform: translate(0, 0) scale(3);
+  }
+}
 @keyframes ProgressZoomIn {
   from {
     opacity: 1;
-    transform: translate(0, 0) scale(1);
+    -webkit-transform: translate(0, 0) scale(1);
+            transform: translate(0, 0) scale(1);
   }
   to {
     opacity: 0;
-    transform: translate(0, 0) scale(3);
+    -webkit-transform: translate(0, 0) scale(3);
+            transform: translate(0, 0) scale(3);
+  }
+}
+@-webkit-keyframes ProgressZoomOut {
+  from {
+    -webkit-transform: translate(0, 0) scale(1);
+            transform: translate(0, 0) scale(1);
+  }
+  to {
+    -webkit-transform: translate(0, 0) scale(0);
+            transform: translate(0, 0) scale(0);
   }
 }
 @keyframes ProgressZoomOut {
   from {
-    transform: translate(0, 0) scale(1);
+    -webkit-transform: translate(0, 0) scale(1);
+            transform: translate(0, 0) scale(1);
   }
   to {
-    transform: translate(0, 0) scale(0);
+    -webkit-transform: translate(0, 0) scale(0);
+            transform: translate(0, 0) scale(0);
   }
 }
 
@@ -1997,7 +2217,10 @@
 
 *.e-primary .e-progress,
 *.e-success .e-progress,
-*.e-danger .e-progress,
+*.e-danger .e-progress {
+  background: rgba(var(--color-sf-on-surface), 0.12);
+}
+
 *.e-info .e-progress {
   background: rgba(var(--color-sf-on-surface), 0.12);
 }