@sage/design-tokens 14.0.0 → 14.0.1

package/css/frozenproduct/small/components/button.css

@@ -216,12 +216,16 @@
   --button-color-typical-primary-inverse-bg-active: var(--modes-color-interactive-primary-inverse-active);
   --button-color-typical-primary-inverse-bg-hover: var(--modes-color-interactive-primary-inverse-hover);
   --button-color-typical-secondary-bg-active: var(--modes-color-interactive-primary-active-alt);
+  --button-color-typical-secondary-bg-enabled: var(--modes-color-interactive-primary-default-alt3);
+  --button-color-typical-secondary-bg-hover: var(--modes-color-interactive-primary-hover-alt);
   --button-color-typical-secondary-border-active: var(--modes-color-interactive-primary-active);
   --button-color-typical-secondary-border-enabled: var(--modes-color-interactive-primary-default-alt);
   --button-color-typical-secondary-border-hover: var(--modes-color-interactive-primary-hover);
   --button-color-typical-secondary-label-disabled: var(--modes-color-interactive-inactive-content);
   --button-color-typical-secondary-label-enabled: var(--modes-color-interactive-monochrome-default);
   --button-color-typical-secondary-inverse-bg-active: var(--modes-color-interactive-primary-inverse-active-alt);
+  --button-color-typical-secondary-inverse-bg-enabled: var(--modes-color-interactive-primary-inverse-default-alt3);
+  --button-color-typical-secondary-inverse-bg-hover: var(--modes-color-interactive-primary-inverse-hover-alt);
   --button-color-typical-secondary-inverse-border-active: var(--modes-color-interactive-primary-inverse-active);
   --button-color-typical-secondary-inverse-border-enabled: var(--modes-color-interactive-primary-inverse-default-alt);
   --button-color-typical-secondary-inverse-border-hover: var(--modes-color-interactive-primary-inverse-hover);
@@ -229,14 +233,16 @@
   --button-color-typical-secondary-inverse-label-enabled: var(--modes-color-interactive-monochrome-inverse-default);
   --button-color-typical-secondary-inverse-label-hover: var(--modes-color-interactive-monochrome-inverse-with-hover);
   --button-color-typical-tertiary-bg-active: var(--modes-color-interactive-primary-active-alt);
+  --button-color-typical-tertiary-bg-hover: var(--modes-color-interactive-primary-hover-alt);
   --button-color-typical-tertiary-border-active: var(--modes-color-interactive-primary-active);
-  --button-color-typical-tertiary-border-enabled: var(--modes-color-interactive-primary-default-alt2);
+  --button-color-typical-tertiary-border-enabled: var(--modes-color-interactive-primary-default-alt);
   --button-color-typical-tertiary-border-hover: var(--modes-color-interactive-primary-hover);
   --button-color-typical-tertiary-label-disabled: var(--modes-color-interactive-inactive-content);
   --button-color-typical-tertiary-label-enabled: var(--modes-color-interactive-monochrome-default);
   --button-color-typical-tertiary-inverse-bg-active: var(--modes-color-interactive-primary-inverse-active-alt);
+  --button-color-typical-tertiary-inverse-bg-hover: var(--modes-color-interactive-primary-inverse-hover-alt);
   --button-color-typical-tertiary-inverse-border-active: var(--modes-color-interactive-primary-inverse-active);
-  --button-color-typical-tertiary-inverse-border-enabled: var(--modes-color-interactive-primary-inverse-default-alt2);
+  --button-color-typical-tertiary-inverse-border-enabled: var(--modes-color-interactive-primary-inverse-default-alt);
   --button-color-typical-tertiary-inverse-border-hover: var(--modes-color-interactive-primary-inverse-hover);
   --button-color-typical-tertiary-inverse-label-active: var(--modes-color-interactive-monochrome-inverse-with-active-alt);
   --button-color-typical-tertiary-inverse-label-enabled: var(--modes-color-interactive-monochrome-inverse-default);
@@ -295,12 +301,8 @@
   --button-color-destructive-primary-bg-disabled: var(--modes-color-interactive-inactive-default);
   --button-color-destructive-secondary-border-disabled: var(--modes-color-interactive-inactive-default);
   --button-color-typical-primary-bg-disabled: var(--modes-color-interactive-inactive-default);
-  --button-color-typical-secondary-bg-hover: var(--modes-color-interactive-primary-hover-alt);
   --button-color-typical-secondary-border-disabled: var(--modes-color-interactive-inactive-default);
-  --button-color-typical-secondary-inverse-bg-hover: var(--modes-color-interactive-primary-inverse-hover-alt);
-  --button-color-typical-tertiary-bg-hover: var(--modes-color-interactive-primary-hover-alt);
   --button-color-typical-tertiary-border-disabled: var(--modes-color-interactive-inactive-default);
-  --button-color-typical-tertiary-inverse-bg-hover: var(--modes-color-interactive-primary-inverse-hover-alt);
   --button-color-typical-subtle-bg-active: var(--modes-color-interactive-monochrome-active-alt);
   --button-color-typical-subtle-inverse-bg-active: var(--modes-color-interactive-monochrome-inverse-active-alt);
   --button-color-typical-toggle-bg-active-disabled: var(--modes-color-interactive-inactive-default);

package/css/frozenproduct/small/components/container.css

@@ -4,12 +4,12 @@
 
 :root {
   --container-size-carousel-mediaslide-minheight: 300; /* max height for media visual */
+  --container-opacity-carousel-hidden: 0.3; /* opacity applied to next and previous carousel slides */
   --container-opacity-dialog-dimmer: 0.4; /* dimmer opacity value */
   --container-opacity-drag-ghost: 0.5; /* drag ghost state opacity value */
   --container-radius-none: var(--global-radius-none); /* Card select (inner adjacent corners), Subscription tile footer top corners */
   --container-radius-scrollbar: var(--global-radius-circle); /* Scrollbar */
   --container-radius-blockquote-bar: var(--global-radius-circle); /* radius for blockquote bar */
-  --container-opacity-carousel-hidden: var(--modes-color-modifiers-input-disabled-fg); /* opacity applied to next and previous carousel slides */
   --container-color-ai-dialog-borderhorizontal: var(--modes-color-generic-fg-ai-default); /* top border for AI dialog component */
   --container-color-ai-nudge-border-ai-horizontal: var(--modes-color-status-ai-default-horizontal); /* top and bottom border for AI nudge message component */
   --container-color-ai-nudge-border-ai-vertical: var(--modes-color-status-ai-default-vertical); /* left and right border for AI nudge message component */
@@ -74,6 +74,7 @@
   --container-boxshadow-card-drag: var(--global-boxshadow-interactive-drag); /* Card (drag state) */
   --container-color-interactive-bg-disabled: var(--modes-color-interactive-inactive-default-alt);
   --container-color-interactive-border-alt: var(--modes-color-generic-fg-delicate); /* Link preview.  */
+  --container-color-interactive-borderalt-hover: var(--modes-color-interactive-monochrome-default); /* For hover border on Link preview. */
   --container-color-interactive-border-inactive: var(--modes-color-generic-fg-soft);
   --container-color-interactive-border-enabled: var(--modes-color-generic-fg-moderate);
   --container-color-interactive-icon-enabled: var(--modes-color-interactive-monochrome-default); /* Enabled chevron for any accordion. */
@@ -285,7 +286,6 @@
   --container-borderwidth-tileselect-selected: var(--global-borderwidth-s); /* Tile select (selected tile) */
   --container-borderwidth-tileselect-unavailable: var(--global-borderwidth-xs); /* Subscription tile (unavailable product) */
   --container-borderwidth-tileselect-enabled: var(--global-borderwidth-xs); /* Tile select (enabled tile) */
-  --container-color-interactive-borderalt-hover: var(--container-color-interactive-border-alt); /* For hover border on Link preview. */
   --container-size-drawer-minwidth: var(--container-size-responsive-xl); /* min-width for drawer component */
   --container-size-drawer-maxwidth: var(--container-size-responsive-xxxxl); /* max-width for drawer component */
 }

package/css/frozenproduct/small/components/link.css

@@ -22,8 +22,8 @@
   --link-boxshadow-skiplink: var(--global-boxshadow-container-near);
   --link-color-destructive-label-hover: var(--modes-color-interactive-danger-hover-alt2);
   --link-color-destructive-inverse-label-hover: var(--modes-color-interactive-danger-inverse-hover-alt2);
-  --link-color-typical-label-default: var(--modes-color-interactive-primary-default-alt3);
-  --link-color-typical-inverse-label-default: var(--modes-color-interactive-primary-inverse-default-alt3);
+  --link-color-typical-label-default: var(--modes-color-interactive-primary-default-alt2);
+  --link-color-typical-inverse-label-default: var(--modes-color-interactive-primary-inverse-default-alt2);
   --link-color-subtle-label-default: var(--modes-color-interactive-monochrome-default);
   --link-color-subtle-inverse-label-default: var(--modes-color-interactive-monochrome-inverse-default);
   --link-size-skiplink-m: var(--global-size-macro-m);

package/css/frozenproduct/small/components/progress.css

@@ -67,6 +67,7 @@
   --progress-size-carouselselector-activedot-m: var(--global-size-macro-xxs);
   --progress-size-carouselselector-hitarea-m: var(--global-size-macro-xs);
   --progress-size-carouselslide-x-m: var(--global-size-macro-xl); /* Inactive slide */
+  --progress-size-spinner-xxs: var(--global-size-macro-xxs); /* Loader ring for XXS size loader spinners */
   --progress-size-spinner-xs: calc(var(--global-size-macro-xs) - var(--global-size-micro-xs)); /* Loader ring for XS size loader spinners */
   --progress-size-spinner-s: var(--global-size-macro-s); /* Loader ring */
   --progress-size-spinner-m: calc(var(--global-size-macro-s) * 2); /* Loader ring */

package/css/frozenproduct/small/dark.css

@@ -63,27 +63,27 @@
   --modes-color-interactive-ai-active: linear-gradient(90deg, #00D63926 0%, #00d6de26 40%, #9d60ff26 90%);
   --modes-color-interactive-ai-hover: linear-gradient(90deg, #00D63914 0%, #00d6de14 40%, #9d60ff14 90%);
   --modes-color-interactive-ai-default: linear-gradient(90deg, #00D639 0%, #00D6DE 40%, #9D60FF 90%);
-  --modes-color-interactive-danger-active: #f28486; /* active button on dark */
+  --modes-color-interactive-danger-active: #f28083; /* active button on dark */
   --modes-color-interactive-danger-default: #E13E53;
   --modes-color-interactive-danger-default-alt: #e85b66; /* for links in datatables  */
-  --modes-color-interactive-danger-hover: #eb646c;
-  --modes-color-interactive-danger-hover-alt: #e13e5314; /* button hover on dark */
-  --modes-color-interactive-danger-hover-alt2: #ec6a71; /* for links in datatables */
+  --modes-color-interactive-danger-hover: #ea626a;
+  --modes-color-interactive-danger-hover-alt: #e13e531a; /* button hover on dark */
+  --modes-color-interactive-danger-hover-alt2: #ed6e74; /* for links in datatables */
   --modes-color-interactive-danger-with-active: #000000;
   --modes-color-interactive-danger-with-default: #000000;
-  --modes-color-interactive-danger-inverse-active: #882b34; /* used on pill hover states */
+  --modes-color-interactive-danger-inverse-active: #8c2c35; /* used on pill hover states */
   --modes-color-interactive-danger-inverse-default: #CD384B;
   --modes-color-interactive-danger-inverse-default-alt: #b23342; /* For links in datatables */
-  --modes-color-interactive-danger-inverse-hover: #aa323f; /* used on solid-pill and primary-button hover states */
-  --modes-color-interactive-danger-inverse-hover-alt: #cd384b14; /* used on secondary-button hover states */
-  --modes-color-interactive-danger-inverse-hover-alt2: #a3303d; /* used on link hover state */
+  --modes-color-interactive-danger-inverse-hover: #ac3240; /* used on solid-pill and primary-button hover states */
+  --modes-color-interactive-danger-inverse-hover-alt: #cd384b1a; /* used on secondary-button hover states */
+  --modes-color-interactive-danger-inverse-hover-alt2: #9f303c; /* used on link hover state */
   --modes-color-interactive-danger-inverse-with-active: #FFFFFF;
   --modes-color-interactive-danger-inverse-with-default: #FFFFFF;
   --modes-color-interactive-data-entry-default: #000000; /* Input backgrounds. */
   --modes-color-interactive-data-entry-with-active: #FFFFFF; /* checkbox tick icon or radio handle */
   --modes-color-interactive-data-entry-with-active-alt: #000000;
   --modes-color-interactive-data-entry-with-hover: #FFFFFF; /* text for draggable area on file input */
-  --modes-color-interactive-data-entry-hover-alt: #181818; /* bg hover for draggable area on file input */
+  --modes-color-interactive-data-entry-hover-alt: #1b1b1b; /* bg hover for draggable area on file input */
   --modes-color-interactive-data-entry-with-default: #777; /* Input borders. */
   --modes-color-interactive-data-entry-default-alt: #0e0e0e; /* Input footer bgs (e.g text editor) */
   --modes-color-interactive-data-entry-content: #fffffff2; /* Input Text */
@@ -109,31 +109,31 @@
   --modes-color-interactive-inactive-inverse-content: #0000006b; /* Inversed disabled text inside buttons and form inputs. */
   --modes-color-interactive-inactive-inverse-content-alt: #FFFFFF; /*  Disabled labels inside buttons and Switch. */
   --modes-color-interactive-monochrome-active: #FFFFFF;
-  --modes-color-interactive-monochrome-active-alt: #ffffff29;
+  --modes-color-interactive-monochrome-active-alt: #ffffff26;
   --modes-color-interactive-monochrome-default: #ffffffe6;
   --modes-color-interactive-monochrome-default-alt: #ffffffab; /* subtle and toggle button text */
   --modes-color-interactive-monochrome-default-alt2: #ffffff6b; /* Tertiary border color */
-  --modes-color-interactive-monochrome-hover-alt: #ffffff14; /* Accordion, secondary, tertiary, menu bg on hover */
-  --modes-color-interactive-monochrome-hover: #ffffff29; /* subtle table header hover */
+  --modes-color-interactive-monochrome-hover-alt: #ffffff1a; /* Accordion, secondary, tertiary, menu bg on hover */
+  --modes-color-interactive-monochrome-hover: #ffffff26; /* subtle table header hover */
   --modes-color-interactive-monochrome-with-active: #000000;
   --modes-color-interactive-monochrome-with-active-alt: #FFFFFF;
   --modes-color-interactive-monochrome-with-default: #000000;
   --modes-color-interactive-monochrome-with-hover: #FFFFFF;
   --modes-color-interactive-monochrome-frozen-active: #FFFFFF;
-  --modes-color-interactive-monochrome-frozen-active-alt: #ffffff29;
+  --modes-color-interactive-monochrome-frozen-active-alt: #ffffff26;
   --modes-color-interactive-monochrome-frozen-default: #ffffffe6;
   --modes-color-interactive-monochrome-frozen-default-alt: #ffffffab;
-  --modes-color-interactive-monochrome-frozen-hover-alt: #ffffff14;
+  --modes-color-interactive-monochrome-frozen-hover-alt: #ffffff1a;
   --modes-color-interactive-monochrome-frozen-with-active: #000000;
   --modes-color-interactive-monochrome-frozen-with-hover: #FFFFFF;
   --modes-color-interactive-monochrome-frozen-with-hover-alt: #000000;
   --modes-color-interactive-monochrome-inverse-active: #000000;
-  --modes-color-interactive-monochrome-inverse-active-alt: #00000029;
+  --modes-color-interactive-monochrome-inverse-active-alt: #00000026;
   --modes-color-interactive-monochrome-inverse-default: #000000e6;
   --modes-color-interactive-monochrome-inverse-default-alt: #000000ab; /* subtle and toggle button text */
   --modes-color-interactive-monochrome-inverse-default-alt2: #0000006b; /* Tertiary border color */
-  --modes-color-interactive-monochrome-inverse-hover-alt: #00000014; /* Accordion, secondary, tertiary, menu bg on hover */
-  --modes-color-interactive-monochrome-inverse-hover: #00000029; /* subtle table header hover */
+  --modes-color-interactive-monochrome-inverse-hover-alt: #0000001a; /* Accordion, secondary, tertiary, menu bg on hover */
+  --modes-color-interactive-monochrome-inverse-hover: #00000026; /* subtle table header hover */
   --modes-color-interactive-monochrome-inverse-with-active: #FFFFFF;
   --modes-color-interactive-monochrome-inverse-with-active-alt: #000000;
   --modes-color-interactive-monochrome-inverse-with-default: #FFFFFF;
@@ -145,39 +145,39 @@
   --modes-color-interactive-nav-active: #ffffff59; /* active bg for nav items */
   --modes-color-interactive-nav-default: #000000; /* default bg for global nav */
   --modes-color-interactive-nav-default-alt: #282828; /* default bg for left nav container */
-  --modes-color-interactive-nav-hover: #ffffff29; /* hover bg for nav items */
+  --modes-color-interactive-nav-hover: #ffffff26; /* hover bg for nav items */
   --modes-color-interactive-nav-with-active: #FFFFFF; /* text and icons on top of active bgs in nav contexts */
   --modes-color-interactive-nav-with-default: #fffffff2; /* hover bg for nav items */
   --modes-color-interactive-nav-with-hover: #FFFFFF; /* hover bg for nav items */
-  --modes-color-interactive-primary-active: #81e57d;
-  --modes-color-interactive-primary-active-alt: #00d63952; /* Active color for secondary and tertiary buttons */
+  --modes-color-interactive-primary-active: #7ce47a;
+  --modes-color-interactive-primary-active-alt: #00d6394d; /* Active color for secondary and tertiary buttons */
   --modes-color-interactive-primary-default: #00D639;
-  --modes-color-interactive-primary-default-alt: #00d639cc; /* Border color for secondary buttons */
-  --modes-color-interactive-primary-default-alt2: #00d63980; /* Border color for tertiary buttons */
-  --modes-color-interactive-primary-default-alt3: #4cdc55; /* default value for links */
-  --modes-color-interactive-primary-hover: #58de5d;
-  --modes-color-interactive-primary-hover-alt: #00d63914; /* Secondary and tertiary button hover */
-  --modes-color-interactive-primary-hover-alt2: #73e372; /* hover for links */
+  --modes-color-interactive-primary-default-alt: #00d639cc; /* Border color for secondary and tertiary buttons */
+  --modes-color-interactive-primary-default-alt2: #4cdc55; /* default value for links */
+  --modes-color-interactive-primary-default-alt3: #00d63908; /* Default background color of secondary buttons */
+  --modes-color-interactive-primary-hover: #55dd5b;
+  --modes-color-interactive-primary-hover-alt: #00d6391a; /* Secondary and tertiary button hover */
+  --modes-color-interactive-primary-hover-alt2: #71e270; /* hover for links */
   --modes-color-interactive-primary-with-active: #000000;
   --modes-color-interactive-primary-with-default: #000000;
   --modes-color-interactive-primary-with-hover: #000000;
-  --modes-color-interactive-primary-frozen-active: #81e57d;
+  --modes-color-interactive-primary-frozen-active: #7ce47a;
   --modes-color-interactive-primary-frozen-default: #00D639;
   --modes-color-interactive-primary-frozen-default-alt: #4cdc55;
-  --modes-color-interactive-primary-frozen-hover: #58de5d;
-  --modes-color-interactive-primary-frozen-hover-alt: #73e372; /* for link hover */
+  --modes-color-interactive-primary-frozen-hover: #55dd5b;
+  --modes-color-interactive-primary-frozen-hover-alt: #71e270; /* for link hover */
   --modes-color-interactive-primary-frozen-nav-hover: #008046;
   --modes-color-interactive-primary-frozen-nav-label-hover: #FFFFFF;
   --modes-color-interactive-primary-frozen-table-default: #18232a;
-  --modes-color-interactive-primary-inverse-active: #14571a;
-  --modes-color-interactive-primary-inverse-active-alt: #00811f52; /* Active color for inverse secondary and tertiary buttons */
+  --modes-color-interactive-primary-inverse-active: #13591a;
+  --modes-color-interactive-primary-inverse-active-alt: #00811f4d; /* Active color for inverse secondary and tertiary buttons */
   --modes-color-interactive-primary-inverse-default: #00811F;
-  --modes-color-interactive-primary-inverse-default-alt: #00811fcc; /* Borders on secondary inverse buttons */
-  --modes-color-interactive-primary-inverse-default-alt2: #00811f80; /* Borders on tertiary inverse buttons */
-  --modes-color-interactive-primary-inverse-default-alt3: #0c711d; /* Default color for links */
-  --modes-color-interactive-primary-inverse-hover: #0e6b1d;
-  --modes-color-interactive-primary-inverse-hover-alt: #00811f14; /* Secondary and tertiary inverse button hover */
-  --modes-color-interactive-primary-inverse-hover-alt2: #10681c; /* hover for links */
+  --modes-color-interactive-primary-inverse-default-alt: #00811fcc; /* Borders on secondary and tertiary inverse buttons */
+  --modes-color-interactive-primary-inverse-default-alt2: #0c711d; /* Default color for links */
+  --modes-color-interactive-primary-inverse-default-alt3: #00811f08; /* Default background color of inverse secondary buttons */
+  --modes-color-interactive-primary-inverse-hover: #0e6d1d;
+  --modes-color-interactive-primary-inverse-hover-alt: #0c711d1a; /* Secondary and tertiary inverse button hover */
+  --modes-color-interactive-primary-inverse-hover-alt2: #11651c; /* hover for links */
   --modes-color-interactive-primary-inverse-with-active: #FFFFFF;
   --modes-color-interactive-primary-inverse-with-default: #FFFFFF;
   --modes-color-interactive-primary-inverse-with-hover: #FFFFFF;
@@ -192,15 +192,15 @@
   --modes-color-status-generic-default: #008a89;
   --modes-color-status-caution-default: #E04500;
   --modes-color-status-caution-default-alt: #251206; /* Subtle message bg */
-  --modes-color-status-caution-hover: #eb6732; /* used on pill hover states */
-  --modes-color-status-caution-hover-alt: #3f1b0b; /* used on pill hover states and message bg */
+  --modes-color-status-caution-hover: #eb6530; /* used on pill hover states */
+  --modes-color-status-caution-hover-alt: #3e1a0b; /* used on pill hover states and message bg */
   --modes-color-status-caution-text: #e75b23;
   --modes-color-status-caution-frozenglobal-default: #E04500; /* Global message bg */
-  --modes-color-status-caution-frozenglobal-hover: #eb6732; /* used on global message bg */
+  --modes-color-status-caution-frozenglobal-hover: #eb6530; /* used on global message bg */
   --modes-color-status-caution-inverse-default: #D64309; /* For pills and messages. Not accessible with white TEXT. */
   --modes-color-status-caution-inverse-default-alt: #ffede5; /* Subtle message bg */
-  --modes-color-status-caution-inverse-hover: #b13a0d; /* used on pill hover states */
-  --modes-color-status-caution-inverse-hover-alt: #fdd3c0; /* used on pill hover states and message bg */
+  --modes-color-status-caution-inverse-hover: #b33b0d; /* used on pill hover states */
+  --modes-color-status-caution-inverse-hover-alt: #fed5c3; /* used on pill hover states and message bg */
   --modes-color-status-caution-inverse-text: #bf3e0c;
   --modes-color-status-content-with-default: #000000;
   --modes-color-status-content-with-default-alt: #fffffff2;
@@ -218,59 +218,52 @@
   --modes-color-status-important-default: #985FDC; /* For tile status keylines to show if something is of high importance. */
   --modes-color-status-info-default: #007ED9;
   --modes-color-status-info-default-alt: #111722; /* Subtle message bg */
-  --modes-color-status-info-hover: #5291e0; /* used on pill hover states */
-  --modes-color-status-info-hover-alt: #17253b; /* used on pill hover states and message bg */
+  --modes-color-status-info-hover: #4f90df; /* used on pill hover states */
+  --modes-color-status-info-hover-alt: #17253a; /* used on pill hover states and message bg */
   --modes-color-status-info-frozenglobal-default: #007ED9; /* Global message bg */
-  --modes-color-status-info-frozenglobal-hover: #5291e0; /* used on global message bg */
+  --modes-color-status-info-frozenglobal-hover: #4f90df; /* used on global message bg */
   --modes-color-status-info-inverse-default: #0060A7; /* For pills and messages. Not accessible with white TEXT. */
   --modes-color-status-info-inverse-default-alt: #eaeef6; /* Subtle message bg */
-  --modes-color-status-info-inverse-hover: #10508a; /* used on pill hover states */
-  --modes-color-status-info-inverse-hover-alt: #cbd6e9; /* used on pill hover states and message bg */
+  --modes-color-status-info-inverse-hover: #10518c; /* used on pill hover states */
+  --modes-color-status-info-inverse-hover-alt: #cdd7ea; /* used on pill hover states and message bg */
   --modes-color-status-negative-default: #E13E53;
   --modes-color-status-negative-default-alt: #241212; /* Subtle message bg */
-  --modes-color-status-negative-hover: #eb646c; /* used on pill hover states */
-  --modes-color-status-negative-hover-alt: #3f1a1c; /* used on pill hover states and message bg */
+  --modes-color-status-negative-hover: #ea626a; /* used on pill hover states */
+  --modes-color-status-negative-hover-alt: #3d1a1c; /* used on pill hover states and message bg */
   --modes-color-status-negative-text: #E13E53;
   --modes-color-status-negative-inverse-default: #CD384B; /* For pills and messages. Not accessible with white TEXT. */
   --modes-color-status-negative-inverse-default-alt: #fdeceb; /* Subtle message bg */
-  --modes-color-status-negative-inverse-hover: #aa323f; /* used on pill hover states */
-  --modes-color-status-negative-inverse-hover-alt: #f9d1cf; /* used on pill hover states and message bg */
+  --modes-color-status-negative-inverse-hover: #ac3240; /* used on pill hover states */
+  --modes-color-status-negative-inverse-hover-alt: #f9d3d1; /* used on pill hover states and message bg */
   --modes-color-status-negative-inverse-text: #CD384B;
   --modes-color-status-neutral-default: #7C7C7C;
   --modes-color-status-neutral-default-alt: #171717; /* Subtle message bg */
-  --modes-color-status-neutral-hover: #909090; /* used on pill hover states */
-  --modes-color-status-neutral-hover-alt: #252525; /* used on pill hover states and message bg */
+  --modes-color-status-neutral-hover: #8e8e8e; /* used on pill hover states */
+  --modes-color-status-neutral-hover-alt: #242424; /* used on pill hover states and message bg */
   --modes-color-status-neutral-frozen-default: #9e9e9e;
   --modes-color-status-neutral-frozen-default-alt: #171717; /* Subtle message bg */
-  --modes-color-status-neutral-frozen-hover: #909090;
-  --modes-color-status-neutral-frozen-hover-alt: #262626; /* used on pill hover states and message bg */
+  --modes-color-status-neutral-frozen-hover: #8e8e8e;
+  --modes-color-status-neutral-frozen-hover-alt: #2a2a2a; /* used on pill hover states and message bg */
   --modes-color-status-neutral-inverse-default: #656565;
   --modes-color-status-neutral-inverse-default-alt: #efefef; /* Subtle message bg */
-  --modes-color-status-neutral-inverse-hover: #676767; /* used on pill hover states */
-  --modes-color-status-neutral-inverse-hover-alt: #d8d8d8; /* used on pill hover states and message bg */
+  --modes-color-status-neutral-inverse-hover: #696969; /* used on pill hover states */
+  --modes-color-status-neutral-inverse-hover-alt: #d9d9d9; /* used on pill hover states and message bg */
   --modes-color-status-positive-default: #009023;
   --modes-color-status-positive-default-alt: #0e1a0b; /* Subtle message bg */
-  --modes-color-status-positive-hover: #2e9936; /* used on pill hover states */
-  --modes-color-status-positive-hover-alt: #132b12; /* used on pill hover states and message bg */
+  --modes-color-status-positive-hover: #359b3b; /* used on pill hover states */
+  --modes-color-status-positive-hover-alt: #132912; /* used on pill hover states and message bg */
   --modes-color-status-positive-inverse-default: #00811F; /* For pills and messages. Not accessible with white TEXT. */
   --modes-color-status-positive-inverse-default-alt: #e9f2e8; /* Subtle message bg */
-  --modes-color-status-positive-inverse-hover: #0e6b1d; /* used on pill hover states  */
-  --modes-color-status-positive-inverse-hover-alt: #c9e0c7; /* used on pill hover states and message bg */
+  --modes-color-status-positive-inverse-hover: #0e6d1d; /* used on pill hover states  */
+  --modes-color-status-positive-inverse-hover-alt: #cbe1c9; /* used on pill hover states and message bg */
   --modes-color-status-callout-default-alt: #122211; /* used for marketing banners */
-  --modes-color-status-callout-hover-alt: #223121; /* marketing banner hover */
+  --modes-color-status-callout-hover-alt: #263525; /* marketing banner hover */
   --modes-color-status-reviews-default: #00D639;
   --modes-color-status-reviews-default-alt: linear-gradient(90deg, #00D639 0%, #00D639 50%, #282828 50%, #282828  100%);
-  --modes-color-status-reviews-hover: #18b032; /* used on pill hover states */
+  --modes-color-status-reviews-hover: #17b333; /* used on pill hover states */
   --modes-color-status-reviews-frozen-default: #00D639;
   --modes-color-status-reviews-frozen-default-alt: linear-gradient(90deg, #00D639 0%, #00D639 50%, #282828 50%, #282828  100%);
-  --modes-color-status-reviews-frozen-hover: #18b032; /* used on pill hover states */
+  --modes-color-status-reviews-frozen-hover: #17b333; /* used on pill hover states */
   --modes-color-modifier-contrast-less: #000000;
   --modes-color-modifier-contrast-more: #FFFFFF;
-  --modes-color-modifiers-button-active: 0.32; /* Active modifier used when 16% hover is used */
-  --modes-color-modifiers-button-active-alt: 0.16; /* Active appled when 8% hover is used */
-  --modes-color-modifiers-button-hover: 0.16; /* Hover used on primary buttons */
-  --modes-color-modifiers-button-hover-alt: 0.08; /* Hover used on secondary and tertiary buttons */
-  --modes-color-modifiers-input-disabled-bg: 0.04; /* less contrast */
-  --modes-color-modifiers-input-disabled-fg: 0.30; /* less contrast */
-  --modes-color-modifiers-shadow-standard: 0.5; /* standard mixer for shadow */
 }

package/css/frozenproduct/small/light.css

@@ -63,27 +63,27 @@
   --modes-color-interactive-ai-active: linear-gradient(90deg, #13A03826 0%, #14919726 40%, #a87cfb26 90%);
   --modes-color-interactive-ai-hover: linear-gradient(90deg, #13A03814 0%, #14919714 40%, #a87cfb14 90%);
   --modes-color-interactive-ai-default: linear-gradient(90deg, #13A038 0%, #149197 40%, #A87CFB 90%);
-  --modes-color-interactive-danger-active: #882b34; /* used on pill hover states */
+  --modes-color-interactive-danger-active: #8c2c35; /* used on pill hover states */
   --modes-color-interactive-danger-default: #CD384B;
   --modes-color-interactive-danger-default-alt: #b23342; /* For links in datatables */
-  --modes-color-interactive-danger-hover: #aa323f; /* used on solid-pill and primary-button hover states */
-  --modes-color-interactive-danger-hover-alt: #cd384b14; /* used on secondary-button hover states */
-  --modes-color-interactive-danger-hover-alt2: #a3303d; /* used on link hover state */
+  --modes-color-interactive-danger-hover: #ac3240; /* used on solid-pill and primary-button hover states */
+  --modes-color-interactive-danger-hover-alt: #cd384b1a; /* used on secondary-button hover states */
+  --modes-color-interactive-danger-hover-alt2: #9f303c; /* used on link hover state */
   --modes-color-interactive-danger-with-active: #FFFFFF;
   --modes-color-interactive-danger-with-default: #FFFFFF;
-  --modes-color-interactive-danger-inverse-active: #f28486; /* used on pill hover states */
+  --modes-color-interactive-danger-inverse-active: #f28083; /* used on pill hover states */
   --modes-color-interactive-danger-inverse-default: #E13E53;
   --modes-color-interactive-danger-inverse-default-alt: #e85b66; /* For links in datatables */
-  --modes-color-interactive-danger-inverse-hover: #eb646c; /* used on solid-pill and primary-button hover states */
-  --modes-color-interactive-danger-inverse-hover-alt: #e13e5314; /* used on secondary-button hover states */
-  --modes-color-interactive-danger-inverse-hover-alt2: #ec6a71; /* used on link hover state */
+  --modes-color-interactive-danger-inverse-hover: #ea626a; /* used on solid-pill and primary-button hover states */
+  --modes-color-interactive-danger-inverse-hover-alt: #e13e531a; /* used on secondary-button hover states */
+  --modes-color-interactive-danger-inverse-hover-alt2: #ed6e74; /* used on link hover state */
   --modes-color-interactive-danger-inverse-with-active: #000000;
   --modes-color-interactive-danger-inverse-with-default: #000000;
   --modes-color-interactive-data-entry-default: #FFFFFF; /* Input backgrounds. */
   --modes-color-interactive-data-entry-with-active: #000000; /* checkbox tick icon or radio handle */
   --modes-color-interactive-data-entry-with-active-alt: #FFFFFF;
   --modes-color-interactive-data-entry-with-hover: #000000; /* text for draggable area on file input */
-  --modes-color-interactive-data-entry-hover-alt: #e8e8e8; /* bg hover for draggable area on file input */
+  --modes-color-interactive-data-entry-hover-alt: #e2e2e2; /* bg hover for draggable area on file input */
   --modes-color-interactive-data-entry-with-default: #777; /* Input borders. */
   --modes-color-interactive-data-entry-default-alt: #f3f3f3; /* Input footer bgs (e.g text editor). */
   --modes-color-interactive-data-entry-content: #000000f2; /* Input Text */
@@ -109,31 +109,31 @@
   --modes-color-interactive-inactive-inverse-content: #ffffff6b; /* Inversed disabled text inside buttons and form inputs. */
   --modes-color-interactive-inactive-inverse-content-alt: #000000; /*  Disabled labels inside buttons and Switch. */
   --modes-color-interactive-monochrome-active: #000000;
-  --modes-color-interactive-monochrome-active-alt: #00000029;
+  --modes-color-interactive-monochrome-active-alt: #00000026;
   --modes-color-interactive-monochrome-default: #000000e6;
   --modes-color-interactive-monochrome-default-alt: #000000ab; /* subtle and toggle button text */
   --modes-color-interactive-monochrome-default-alt2: #0000006b; /* Tertiary border color */
-  --modes-color-interactive-monochrome-hover-alt: #00000014; /* Accordion, secondary, tertiary, menu bg on hover */
-  --modes-color-interactive-monochrome-hover: #00000029; /* subtle table header hover */
+  --modes-color-interactive-monochrome-hover-alt: #0000001a; /* Accordion, secondary, tertiary, menu bg on hover */
+  --modes-color-interactive-monochrome-hover: #00000026; /* subtle table header hover */
   --modes-color-interactive-monochrome-with-active: #FFFFFF;
   --modes-color-interactive-monochrome-with-active-alt: #000000;
   --modes-color-interactive-monochrome-with-default: #FFFFFF;
   --modes-color-interactive-monochrome-with-hover: #000000; /* maybe should be white to align with primary group logic */
   --modes-color-interactive-monochrome-frozen-active: #223743;
-  --modes-color-interactive-monochrome-frozen-active-alt: #22374329;
+  --modes-color-interactive-monochrome-frozen-active-alt: #22374326;
   --modes-color-interactive-monochrome-frozen-default: #335B70;
   --modes-color-interactive-monochrome-frozen-default-alt: #476a7d;
-  --modes-color-interactive-monochrome-frozen-hover-alt: #22374314;
+  --modes-color-interactive-monochrome-frozen-hover-alt: #2237431a;
   --modes-color-interactive-monochrome-frozen-with-active: #FFFFFF;
   --modes-color-interactive-monochrome-frozen-with-hover: #223743;
   --modes-color-interactive-monochrome-frozen-with-hover-alt: #FFFFFF;
   --modes-color-interactive-monochrome-inverse-active: #FFFFFF;
-  --modes-color-interactive-monochrome-inverse-active-alt: #ffffff29;
+  --modes-color-interactive-monochrome-inverse-active-alt: #ffffff26;
   --modes-color-interactive-monochrome-inverse-default: #ffffffe6;
   --modes-color-interactive-monochrome-inverse-default-alt: #ffffffab; /* subtle and toggle button text */
   --modes-color-interactive-monochrome-inverse-default-alt2: #ffffff6b; /* Tertiary border color */
-  --modes-color-interactive-monochrome-inverse-hover-alt: #ffffff14; /* Accordion, secondary, tertiary, menu bg on hover */
-  --modes-color-interactive-monochrome-inverse-hover: #ffffff29; /* subtle table header hover */
+  --modes-color-interactive-monochrome-inverse-hover-alt: #ffffff1a; /* Accordion, secondary, tertiary, menu bg on hover */
+  --modes-color-interactive-monochrome-inverse-hover: #ffffff26; /* subtle table header hover */
   --modes-color-interactive-monochrome-inverse-with-active: #000000;
   --modes-color-interactive-monochrome-inverse-with-active-alt: #FFFFFF;
   --modes-color-interactive-monochrome-inverse-with-default: #000000;
@@ -145,39 +145,39 @@
   --modes-color-interactive-nav-active: #00000029; /* active bg for nav items */
   --modes-color-interactive-nav-default: #FFFFFF;
   --modes-color-interactive-nav-default-alt: #f3f3f3; /* default bg for left nav container */
-  --modes-color-interactive-nav-hover: #00000014; /* hover bg for nav items */
+  --modes-color-interactive-nav-hover: #0000001a; /* hover bg for nav items */
   --modes-color-interactive-nav-with-active: #000000; /* text and icons on top of active bgs in nav contexts */
   --modes-color-interactive-nav-with-default: #000000f2; /* hover bg for nav items */
   --modes-color-interactive-nav-with-hover: #000000; /* hover bg for nav items */
-  --modes-color-interactive-primary-active: #14571a;
-  --modes-color-interactive-primary-active-alt: #00811f52; /* Active color for secondary and tertiary buttons */
+  --modes-color-interactive-primary-active: #13591a;
+  --modes-color-interactive-primary-active-alt: #00811f4d; /* Active color for secondary and tertiary buttons */
   --modes-color-interactive-primary-default: #00811F;
-  --modes-color-interactive-primary-default-alt: #00811fcc; /* border color for secondary buttons */
-  --modes-color-interactive-primary-default-alt2: #00811f80; /* border color for tertiary buttons */
-  --modes-color-interactive-primary-default-alt3: #0c711d; /* default value for links */
-  --modes-color-interactive-primary-hover: #0e6b1d;
-  --modes-color-interactive-primary-hover-alt: #00811f14; /* hover for secondary and tertiary buttons */
-  --modes-color-interactive-primary-hover-alt2: #125e1b; /* hover for links */
+  --modes-color-interactive-primary-default-alt: #00811fcc; /* border color for secondary and tertiary buttons */
+  --modes-color-interactive-primary-default-alt2: #0c711d; /* default value for links */
+  --modes-color-interactive-primary-default-alt3: #00811f08; /* Default background color of secondary button */
+  --modes-color-interactive-primary-hover: #0e6d1d;
+  --modes-color-interactive-primary-hover-alt: #00811f1a; /* hover for secondary and tertiary buttons */
+  --modes-color-interactive-primary-hover-alt2: #12601b; /* hover for links */
   --modes-color-interactive-primary-with-active: #FFFFFF;
   --modes-color-interactive-primary-with-default: #FFFFFF;
   --modes-color-interactive-primary-with-hover: #FFFFFF;
-  --modes-color-interactive-primary-frozen-active: #135631;
+  --modes-color-interactive-primary-frozen-active: #135932;
   --modes-color-interactive-primary-frozen-default: #008046;
   --modes-color-interactive-primary-frozen-default-alt: #0b703e; /* for links */
-  --modes-color-interactive-primary-frozen-hover: #0e6b3b;
+  --modes-color-interactive-primary-frozen-hover: #0d6c3c;
   --modes-color-interactive-primary-frozen-hover-alt: #106237; /* for link hover */
   --modes-color-interactive-primary-frozen-nav-hover: #008046;
   --modes-color-interactive-primary-frozen-nav-label-hover: #FFFFFF;
   --modes-color-interactive-primary-frozen-table-default: #9badb8;
-  --modes-color-interactive-primary-inverse-active: #81e57d;
-  --modes-color-interactive-primary-inverse-active-alt: #00d63952; /* Active color for inverse secondary and tertiary buttons */
+  --modes-color-interactive-primary-inverse-active: #7ce47a;
+  --modes-color-interactive-primary-inverse-active-alt: #00d6394d; /* Active color for inverse secondary and tertiary buttons */
   --modes-color-interactive-primary-inverse-default: #00D639;
-  --modes-color-interactive-primary-inverse-default-alt: #00d639cc; /* border color for secondary inverse buttons */
-  --modes-color-interactive-primary-inverse-default-alt2: #00d63980; /* border color for tertiary inverse buttons */
-  --modes-color-interactive-primary-inverse-default-alt3: #4cdc55; /* Default color for links */
-  --modes-color-interactive-primary-inverse-hover: #58de5d;
-  --modes-color-interactive-primary-inverse-hover-alt: #00d63914; /* Hover for inverse secondary and tertiary buttons */
-  --modes-color-interactive-primary-inverse-hover-alt2: #73e372; /* hover for links */
+  --modes-color-interactive-primary-inverse-default-alt: #00d639cc; /* border color for secondary and tertiary inverse buttons */
+  --modes-color-interactive-primary-inverse-default-alt2: #4cdc55; /* Default color for links */
+  --modes-color-interactive-primary-inverse-default-alt3: #00d63908; /* Default background color of inverse secondary buttons */
+  --modes-color-interactive-primary-inverse-hover: #55dd5b;
+  --modes-color-interactive-primary-inverse-hover-alt: #00d6391a; /* Hover for inverse secondary and tertiary buttons */
+  --modes-color-interactive-primary-inverse-hover-alt2: #71e270; /* hover for links */
   --modes-color-interactive-primary-inverse-with-active: #000000;
   --modes-color-interactive-primary-inverse-with-default: #000000;
   --modes-color-interactive-primary-inverse-with-hover: #000000;
@@ -192,15 +192,15 @@
   --modes-color-status-generic-default: #007c7b; /* used in progress bar  */
   --modes-color-status-caution-default: #D64309; /* For pills and messages. Not accessible with white TEXT. */
   --modes-color-status-caution-default-alt: #ffede5; /* Subtle message bg */
-  --modes-color-status-caution-hover: #b13a0d; /* used on pill hover states */
-  --modes-color-status-caution-hover-alt: #fdd3c0; /* used on pill hover states and message bg */
+  --modes-color-status-caution-hover: #b33b0d; /* used on pill hover states */
+  --modes-color-status-caution-hover-alt: #fed5c3; /* used on pill hover states and message bg */
   --modes-color-status-caution-text: #bf3e0c;
   --modes-color-status-caution-frozenglobal-default: #ff8629; /* used on global message bg */
-  --modes-color-status-caution-frozenglobal-hover: #ff9a4e; /* used on global message bg */
+  --modes-color-status-caution-frozenglobal-hover: #ff994c; /* used on global message bg */
   --modes-color-status-caution-inverse-default: #E04500;
   --modes-color-status-caution-inverse-default-alt: #251206; /* Subtle message bg */
-  --modes-color-status-caution-inverse-hover: #eb6732; /* used on pill hover states */
-  --modes-color-status-caution-inverse-hover-alt: #3f1b0b; /* used on pill hover states and message bg */
+  --modes-color-status-caution-inverse-hover: #eb6530; /* used on pill hover states */
+  --modes-color-status-caution-inverse-hover-alt: #3e1a0b; /* used on pill hover states and message bg */
   --modes-color-status-caution-inverse-text: #e75b23;
   --modes-color-status-content-with-default: #FFFFFF;
   --modes-color-status-content-with-default-alt: #000000f2;
@@ -218,59 +218,52 @@
   --modes-color-status-important-default: #8F4CD7; /* For tile status keylines to show if something is of high importance. */
   --modes-color-status-info-default: #0060A7; /* For pills and messages. Not accessible with white TEXT. */
   --modes-color-status-info-default-alt: #eaeef6; /* Subtle message bg */
-  --modes-color-status-info-hover: #10508a; /* used on pill hover states */
-  --modes-color-status-info-hover-alt: #cbd6e9; /* used on pill hover states and message bg */
+  --modes-color-status-info-hover: #10518c; /* used on pill hover states */
+  --modes-color-status-info-hover-alt: #cdd7ea; /* used on pill hover states and message bg */
   --modes-color-status-info-frozenglobal-default: #65a9ff; /* used on global message bg */
-  --modes-color-status-info-frozenglobal-hover: #84b6ff; /* used on global message bg */
+  --modes-color-status-info-frozenglobal-hover: #82b5ff; /* used on global message bg */
   --modes-color-status-info-inverse-default: #007ED9;
   --modes-color-status-info-inverse-default-alt: #111722; /* Subtle message bg */
-  --modes-color-status-info-inverse-hover: #5291e0; /* used on pill hover states */
-  --modes-color-status-info-inverse-hover-alt: #17253b; /* used on pill hover states and message bg */
+  --modes-color-status-info-inverse-hover: #4f90df; /* used on pill hover states */
+  --modes-color-status-info-inverse-hover-alt: #17253a; /* used on pill hover states and message bg */
   --modes-color-status-negative-default: #CD384B; /* For pills and messages. Not accessible with white TEXT. */
   --modes-color-status-negative-default-alt: #fdeceb; /* Subtle message bg */
-  --modes-color-status-negative-hover: #aa323f; /* used on pill hover states */
-  --modes-color-status-negative-hover-alt: #f9d1cf; /* used on pill hover states and message bg */
+  --modes-color-status-negative-hover: #ac3240; /* used on pill hover states */
+  --modes-color-status-negative-hover-alt: #f9d3d1; /* used on pill hover states and message bg */
   --modes-color-status-negative-text: #CD384B;
   --modes-color-status-negative-inverse-default: #E13E53;
   --modes-color-status-negative-inverse-default-alt: #241212; /* Subtle message bg */
-  --modes-color-status-negative-inverse-hover: #eb646c; /* used on pill hover states */
-  --modes-color-status-negative-inverse-hover-alt: #3f1a1c; /* used on pill hover states and message bg */
+  --modes-color-status-negative-inverse-hover: #ea626a; /* used on pill hover states */
+  --modes-color-status-negative-inverse-hover-alt: #3d1a1c; /* used on pill hover states and message bg */
   --modes-color-status-negative-inverse-text: #E13E53;
   --modes-color-status-neutral-default: #656565;
   --modes-color-status-neutral-default-alt: #efefef; /* Subtle message bg */
-  --modes-color-status-neutral-hover: #555; /* used on pill hover states */
-  --modes-color-status-neutral-hover-alt: #d8d8d8; /* used on pill hover states and message bg */
+  --modes-color-status-neutral-hover: #565656; /* used on pill hover states */
+  --modes-color-status-neutral-hover-alt: #d9d9d9; /* used on pill hover states and message bg */
   --modes-color-status-neutral-frozen-default: #335B70;
   --modes-color-status-neutral-frozen-default-alt: #eaedf0; /* Subtle message bg */
   --modes-color-status-neutral-frozen-hover: #20313b;
   --modes-color-status-neutral-frozen-hover-alt: #dde0e2; /* used on pill hover states and message bg */
   --modes-color-status-neutral-inverse-default: #7C7C7C;
   --modes-color-status-neutral-inverse-default-alt: #171717; /* Subtle message bg */
-  --modes-color-status-neutral-inverse-hover: #909090; /* used on pill hover states */
-  --modes-color-status-neutral-inverse-hover-alt: #252525; /* used on pill hover states and message bg */
+  --modes-color-status-neutral-inverse-hover: #8e8e8e; /* used on pill hover states */
+  --modes-color-status-neutral-inverse-hover-alt: #242424; /* used on pill hover states and message bg */
   --modes-color-status-positive-default: #00811F; /* For pills and messages. Not accessible with white TEXT. */
   --modes-color-status-positive-default-alt: #e9f2e8; /* Subtle message bg */
-  --modes-color-status-positive-hover: #0e6b1d; /* used on pill hover states  */
-  --modes-color-status-positive-hover-alt: #c9e0c7; /* used on pill hover states and message bg */
+  --modes-color-status-positive-hover: #0e6d1d; /* used on pill hover states  */
+  --modes-color-status-positive-hover-alt: #cbe1c9; /* used on pill hover states and message bg */
   --modes-color-status-positive-inverse-default: #009023;
   --modes-color-status-positive-inverse-default-alt: #0e1a0b; /* Subtle message bg */
-  --modes-color-status-positive-inverse-hover: #2b8b32; /* used on pill hover states */
-  --modes-color-status-positive-inverse-hover-alt: #132b12; /* used on pill hover states and message bg */
+  --modes-color-status-positive-inverse-hover: #328e37; /* used on pill hover states */
+  --modes-color-status-positive-inverse-hover-alt: #132912; /* used on pill hover states and message bg */
   --modes-color-status-callout-default-alt: #e5fae2; /* used for marketing banners */
   --modes-color-status-callout-hover-alt: #d8ecd5; /* used for marketing banners */
   --modes-color-status-reviews-default: #00811F;
   --modes-color-status-reviews-default-alt: linear-gradient(90deg, #00811F 0%, #00811F 50%, #d1d1d1 50%, #d1d1d1 100%); /* half fill */
-  --modes-color-status-reviews-hover: #0e6b1d;
+  --modes-color-status-reviews-hover: #0e6d1d;
   --modes-color-status-reviews-frozen-default: #008046;
   --modes-color-status-reviews-frozen-default-alt: linear-gradient(90deg, #008046 0%, #008046 50%, #d1d1d1 50%, #d1d1d1 100%); /* half fill */
-  --modes-color-status-reviews-frozen-hover: #0e6b3b;
+  --modes-color-status-reviews-frozen-hover: #0d6c3c;
   --modes-color-modifier-contrast-less: #FFFFFF;
   --modes-color-modifier-contrast-more: #000000;
-  --modes-color-modifiers-button-active: 0.32; /* Actve modifier used when 16% hover is used */
-  --modes-color-modifiers-button-active-alt: 0.16; /* Active appled when 8% hover is used */
-  --modes-color-modifiers-button-hover: 0.16; /* Hover used on primary buttons */
-  --modes-color-modifiers-button-hover-alt: 0.08; /* Hover used on secondary and tertiary buttons */
-  --modes-color-modifiers-input-disabled-bg: 0.04; /* less contrast */
-  --modes-color-modifiers-input-disabled-fg: 0.30; /* less contrast */
-  --modes-color-modifiers-shadow-standard: 0.5; /* standard mixer for shadow */
 }