correct gradients

Author: ttaylor-stack

packages/stacks-classic/lib/components/button/button.less

@@ -26,7 +26,7 @@
     --_bu-fc-focus: var(--black-600);
 
     // BASE SELECTED MODIFIER
-    --_bu-bg-selected: linear-gradient(to bottom, var(--theme-secondary-100) 0%, var(--theme-secondary-100) 50%, color-mix(in srgb, var(--theme-secondary-100) 80%, white 40%) 50%, color-mix(in srgb, var(--theme-secondary-100) 80%, white 40%) 100%);
+    --_bu-bg-selected: linear-gradient(to bottom, var(--theme-secondary-100) 0%, var(--theme-secondary-100) 50%, color-mix(in srgb, var(--theme-secondary-100) 60%, white 40%) 50%, color-mix(in srgb, var(--theme-secondary-100) 60%, white 40%) 100%);
     --_bu-fc-selected: var(--theme-button-selected-color, var(--theme-secondary-600));
 
     // FILLED VARIANT
@@ -66,7 +66,7 @@
     });
 
     .dark-mode({
-        --_bu-filled-bg-selected: linear-gradient(to bottom, var(--theme-secondary-600) 0%, var(--theme-secondary-600) 50%, color-mix(in srgb, var(--theme-secondary-600) 80%, black 40%) 50%, color-mix(in srgb, var(--theme-secondary-600) 80%, black 40%) 100%);
+        --_bu-filled-bg-selected: linear-gradient(to bottom, var(--theme-secondary-600) 0%, var(--theme-secondary-600) 50%, color-mix(in srgb, var(--theme-secondary-600) 60%, black 40%) 50%, color-mix(in srgb, var(--theme-secondary-600) 60%, black 40%) 100%);
     });
 
     // STATES
@@ -261,7 +261,7 @@
     &&__danger {
         --_bu-bg-active: var(--black-050);
         --_bu-bg-hover: var(--red-100);
-        --_bu-bg-selected: linear-gradient(to bottom, var(--red-100) 0%, var(--red-100) 50%, color-mix(in srgb, var(--red-100) 80%, white 40%) 50%, color-mix(in srgb, var(--red-100) 80%, white 40%) 100%);
+        --_bu-bg-selected: linear-gradient(to bottom, var(--red-100) 0%, var(--red-100) 50%, color-mix(in srgb, var(--red-100) 60%, white 40%) 50%, color-mix(in srgb, var(--red-100) 60%, white 40%) 100%);
         --_bu-bg-focus: var(--black-050);
         --_bu-fc: var(--red-400);
         --_bu-fc-active: var(--_bu-fc);
@@ -287,7 +287,7 @@
             --_bu-badge-bg: var(--red-500);
         });
         .dark-mode({
-            --_bu-filled-bg-selected: linear-gradient(to bottom, var(--red-500) 0%, var(--red-500) 50%, color-mix(in srgb, var(--red-500) 80%, white 40%) 50%, color-mix(in srgb, var(--red-500) 80%, white 40%) 100%);
+            --_bu-filled-bg-selected: linear-gradient(to bottom, var(--red-500) 0%, var(--red-500) 50%, color-mix(in srgb, var(--red-500) 60%, white 40%) 50%, color-mix(in srgb, var(--red-500) 60%, white 40%) 100%);
         });
     }
 
@@ -313,7 +313,7 @@
         --_bu-number-fc: var(--white);
         --_bu-number-fc-filled: var(--black);
         .dark-mode({
-            --_bu-filled-bg-selected: linear-gradient(to bottom, var(--purple-500) 0%, var(--purple-500) 50%, color-mix(in srgb, var(--purple-500) 80%, white 40%) 50%, color-mix(in srgb, var(--purple-500) 80%, white 40%) 100%);
+            --_bu-filled-bg-selected: linear-gradient(to bottom, var(--purple-500) 0%, var(--purple-500) 50%, color-mix(in srgb, var(--purple-500) 60%, white 40%) 50%, color-mix(in srgb, var(--purple-500) 60%, white 40%) 100%);
         });
     }
 
@@ -322,7 +322,7 @@
         --_bu-bc-hover: transparent;
         --_bu-bg-active: var(--theme-secondary-150);
         --_bu-bg-hover: var(--theme-secondary-200);
-        --_bu-bg-selected: linear-gradient(to bottom, var(--theme-secondary-200) 0%, var(--theme-secondary-200) 50%, color-mix(in srgb, var(--theme-secondary-200) 80%, white 30%) 50%, color-mix(in srgb, var(--theme-secondary-200) 80%, white 30%) 100%);
+        --_bu-bg-selected: linear-gradient(to bottom, var(--theme-secondary-200) 0%, var(--theme-secondary-200) 50%, color-mix(in srgb, var(--theme-secondary-200) 70%, white 30%) 50%, color-mix(in srgb, var(--theme-secondary-200) 70%, white 30%) 100%);
         --_bu-fc: var(--theme-secondary-600);
         --_bu-fc-active: var(--_bu-fc);
         --_bu-fc-hover: var(--theme-secondary-600);