chore(colors): update color palettes

packages/stacks-classic/lib/atomic/__snapshots__/color.less.test.ts.snap

@@ -1030,6 +1030,132 @@ exports[`atomic: color > should output v2 atomic css classes for colors 1`] = `
     color: var(--purple-600) !important;
 }
 
+.bg-pink-100,
+.h\\:bg-pink-100:hover,
+.f\\:bg-pink-100:focus,
+.f\\:bg-pink-100:focus-within {
+    background-color: var(--pink-100) !important;
+}
+
+.bc-pink-100,
+.h\\:bc-pink-100:hover,
+.f\\:bc-pink-100:focus,
+.f\\:bc-pink-100:focus-within {
+    border-color: var(--pink-100) !important;
+}
+
+.fc-pink-100,
+.h\\:fc-pink-100:hover,
+.f\\:fc-pink-100:focus,
+.f\\:fc-pink-100:focus-within {
+    color: var(--pink-100) !important;
+}
+
+.bg-pink-200,
+.h\\:bg-pink-200:hover,
+.f\\:bg-pink-200:focus,
+.f\\:bg-pink-200:focus-within {
+    background-color: var(--pink-200) !important;
+}
+
+.bc-pink-200,
+.h\\:bc-pink-200:hover,
+.f\\:bc-pink-200:focus,
+.f\\:bc-pink-200:focus-within {
+    border-color: var(--pink-200) !important;
+}
+
+.fc-pink-200,
+.h\\:fc-pink-200:hover,
+.f\\:fc-pink-200:focus,
+.f\\:fc-pink-200:focus-within {
+    color: var(--pink-200) !important;
+}
+
+.bg-pink-300,
+.h\\:bg-pink-300:hover,
+.f\\:bg-pink-300:focus,
+.f\\:bg-pink-300:focus-within {
+    background-color: var(--pink-300) !important;
+}
+
+.bc-pink-300,
+.h\\:bc-pink-300:hover,
+.f\\:bc-pink-300:focus,
+.f\\:bc-pink-300:focus-within {
+    border-color: var(--pink-300) !important;
+}
+
+.fc-pink-300,
+.h\\:fc-pink-300:hover,
+.f\\:fc-pink-300:focus,
+.f\\:fc-pink-300:focus-within {
+    color: var(--pink-300) !important;
+}
+
+.bg-pink-400,
+.h\\:bg-pink-400:hover,
+.f\\:bg-pink-400:focus,
+.f\\:bg-pink-400:focus-within {
+    background-color: var(--pink-400) !important;
+}
+
+.bc-pink-400,
+.h\\:bc-pink-400:hover,
+.f\\:bc-pink-400:focus,
+.f\\:bc-pink-400:focus-within {
+    border-color: var(--pink-400) !important;
+}
+
+.fc-pink-400,
+.h\\:fc-pink-400:hover,
+.f\\:fc-pink-400:focus,
+.f\\:fc-pink-400:focus-within {
+    color: var(--pink-400) !important;
+}
+
+.bg-pink-500,
+.h\\:bg-pink-500:hover,
+.f\\:bg-pink-500:focus,
+.f\\:bg-pink-500:focus-within {
+    background-color: var(--pink-500) !important;
+}
+
+.bc-pink-500,
+.h\\:bc-pink-500:hover,
+.f\\:bc-pink-500:focus,
+.f\\:bc-pink-500:focus-within {
+    border-color: var(--pink-500) !important;
+}
+
+.fc-pink-500,
+.h\\:fc-pink-500:hover,
+.f\\:fc-pink-500:focus,
+.f\\:fc-pink-500:focus-within {
+    color: var(--pink-500) !important;
+}
+
+.bg-pink-600,
+.h\\:bg-pink-600:hover,
+.f\\:bg-pink-600:focus,
+.f\\:bg-pink-600:focus-within {
+    background-color: var(--pink-600) !important;
+}
+
+.bc-pink-600,
+.h\\:bc-pink-600:hover,
+.f\\:bc-pink-600:focus,
+.f\\:bc-pink-600:focus-within {
+    border-color: var(--pink-600) !important;
+}
+
+.fc-pink-600,
+.h\\:fc-pink-600:hover,
+.f\\:fc-pink-600:focus,
+.f\\:fc-pink-600:focus-within {
+    color: var(--pink-600) !important;
+}
+
 .bg-gold-100,
 .h\\:bg-gold-100:hover,
 .f\\:bg-gold-100:focus,
@@ -2102,6 +2228,54 @@ exports[`atomic: color > should output v2 atomic css classes for colors 1`] = `
         color: var(--purple-600) !important;
     }
 
+    body.theme-system  .d\\:bg-pink-100 {
+        background-color: var(--pink-100) !important;
+    }
+
+    body.theme-system  .d\\:fc-pink-100 {
+        color: var(--pink-100) !important;
+    }
+
+    body.theme-system  .d\\:bg-pink-200 {
+        background-color: var(--pink-200) !important;
+    }
+
+    body.theme-system  .d\\:fc-pink-200 {
+        color: var(--pink-200) !important;
+    }
+
+    body.theme-system  .d\\:bg-pink-300 {
+        background-color: var(--pink-300) !important;
+    }
+
+    body.theme-system  .d\\:fc-pink-300 {
+        color: var(--pink-300) !important;
+    }
+
+    body.theme-system  .d\\:bg-pink-400 {
+        background-color: var(--pink-400) !important;
+    }
+
+    body.theme-system  .d\\:fc-pink-400 {
+        color: var(--pink-400) !important;
+    }
+
+    body.theme-system  .d\\:bg-pink-500 {
+        background-color: var(--pink-500) !important;
+    }
+
+    body.theme-system  .d\\:fc-pink-500 {
+        color: var(--pink-500) !important;
+    }
+
+    body.theme-system  .d\\:bg-pink-600 {
+        background-color: var(--pink-600) !important;
+    }
+
+    body.theme-system  .d\\:fc-pink-600 {
+        color: var(--pink-600) !important;
+    }
+
     body.theme-system  .d\\:bg-gold-100 {
         background-color: var(--gold-100) !important;
     }
@@ -2859,6 +3033,78 @@ body.theme-system .theme-dark__forced  .d\\:fc-purple-600 {
     color: var(--purple-600) !important;
 }
 
+body.theme-dark  .d\\:bg-pink-100,
+.theme-dark__forced  .d\\:bg-pink-100,
+body.theme-system .theme-dark__forced  .d\\:bg-pink-100 {
+    background-color: var(--pink-100) !important;
+}
+
+body.theme-dark  .d\\:fc-pink-100,
+.theme-dark__forced  .d\\:fc-pink-100,
+body.theme-system .theme-dark__forced  .d\\:fc-pink-100 {
+    color: var(--pink-100) !important;
+}
+
+body.theme-dark  .d\\:bg-pink-200,
+.theme-dark__forced  .d\\:bg-pink-200,
+body.theme-system .theme-dark__forced  .d\\:bg-pink-200 {
+    background-color: var(--pink-200) !important;
+}
+
+body.theme-dark  .d\\:fc-pink-200,
+.theme-dark__forced  .d\\:fc-pink-200,
+body.theme-system .theme-dark__forced  .d\\:fc-pink-200 {
+    color: var(--pink-200) !important;
+}
+
+body.theme-dark  .d\\:bg-pink-300,
+.theme-dark__forced  .d\\:bg-pink-300,
+body.theme-system .theme-dark__forced  .d\\:bg-pink-300 {
+    background-color: var(--pink-300) !important;
+}
+
+body.theme-dark  .d\\:fc-pink-300,
+.theme-dark__forced  .d\\:fc-pink-300,
+body.theme-system .theme-dark__forced  .d\\:fc-pink-300 {
+    color: var(--pink-300) !important;
+}
+
+body.theme-dark  .d\\:bg-pink-400,
+.theme-dark__forced  .d\\:bg-pink-400,
+body.theme-system .theme-dark__forced  .d\\:bg-pink-400 {
+    background-color: var(--pink-400) !important;
+}
+
+body.theme-dark  .d\\:fc-pink-400,
+.theme-dark__forced  .d\\:fc-pink-400,
+body.theme-system .theme-dark__forced  .d\\:fc-pink-400 {
+    color: var(--pink-400) !important;
+}
+
+body.theme-dark  .d\\:bg-pink-500,
+.theme-dark__forced  .d\\:bg-pink-500,
+body.theme-system .theme-dark__forced  .d\\:bg-pink-500 {
+    background-color: var(--pink-500) !important;
+}
+
+body.theme-dark  .d\\:fc-pink-500,
+.theme-dark__forced  .d\\:fc-pink-500,
+body.theme-system .theme-dark__forced  .d\\:fc-pink-500 {
+    color: var(--pink-500) !important;
+}
+
+body.theme-dark  .d\\:bg-pink-600,
+.theme-dark__forced  .d\\:bg-pink-600,
+body.theme-system .theme-dark__forced  .d\\:bg-pink-600 {
+    background-color: var(--pink-600) !important;
+}
+
+body.theme-dark  .d\\:fc-pink-600,
+.theme-dark__forced  .d\\:fc-pink-600,
+body.theme-system .theme-dark__forced  .d\\:fc-pink-600 {
+    color: var(--pink-600) !important;
+}
+
 body.theme-dark  .d\\:bg-gold-100,
 .theme-dark__forced  .d\\:bg-gold-100,
 body.theme-system .theme-dark__forced  .d\\:bg-gold-100 {

packages/stacks-classic/lib/atomic/__snapshots__/misc.less.test.ts.snap

@@ -820,27 +820,27 @@ exports[`atomic: misc > should output all atomic css classes 1`] = `
 }
 
 .bs-sm.bs-hover:hover {
-    box-shadow: 0 var(--su-static2) var(--su-static8) hsl(210, 8%, 95%) !important;
+    box-shadow: 0 var(--su-static2) var(--su-static8) #dfe9f2 !important;
 }
 
 .bs-md.bs-hover:hover {
-    box-shadow: 0 var(--su-static4) var(--su-static8) hsl(210, 8%, 85%) !important;
+    box-shadow: 0 var(--su-static4) var(--su-static8) #c7d0d9 !important;
 }
 
 .bs-lg.bs-hover:hover {
-    box-shadow: 0 var(--su-static4) var(--su-static12) hsla(210, 8%, 68%, 0.7) !important;
+    box-shadow: 0 var(--su-static4) var(--su-static12) rgba(160, 166, 173, 0.7) !important;
 }
 
 .bs-i-sm.bs-hover:hover {
-    box-shadow: inset 0 var(--su-static1) var(--su-static8) 0 hsla(210, 9%, 75%, 0.75) !important;
+    box-shadow: inset 0 var(--su-static1) var(--su-static8) 0 rgba(174, 183, 191, 0.75) !important;
 }
 
 .bs-i-md.bs-hover:hover {
-    box-shadow: inset 0 var(--su-static1) var(--su-static8) 0 hsla(210, 8%, 68%, 0.8) !important;
+    box-shadow: inset 0 var(--su-static1) var(--su-static8) 0 rgba(160, 166, 173, 0.8) !important;
 }
 
 .bs-i-lg.bs-hover:hover {
-    box-shadow: inset 0 var(--su-static1) var(--su-static12) 0 hsl(210, 8%, 68%) !important;
+    box-shadow: inset 0 var(--su-static1) var(--su-static12) 0 #a0a6ad !important;
 }
 
 .t {