fix(sbb-accent-button): adapt to new design (#3313)

src/elements/button/common/accent-button.scss

@@ -1,17 +1,31 @@
 :host {
-  --sbb-button-color-active-background: var(--sbb-color-black);
-  --sbb-button-color-active-border: var(--sbb-color-cloud);
+  --sbb-button-color-active-background: var(--sbb-color-midnight);
+  --sbb-button-color-active-border: var(--sbb-color-midnight);
   --sbb-button-color-active-text: var(--sbb-color-cloud);
   --sbb-button-color-default-background: var(--sbb-color-charcoal);
-  --sbb-button-color-default-border: var(--sbb-color-cloud);
+  --sbb-button-color-default-border: var(--sbb-color-charcoal);
   --sbb-button-color-default-text: var(--sbb-color-white);
-  --sbb-button-color-hover-background: var(--sbb-color-midnight);
-  --sbb-button-color-hover-border: var(--sbb-color-cloud);
+  --sbb-button-color-hover-background: var(--sbb-color-charcoal);
+  --sbb-button-color-hover-border: var(--sbb-color-charcoal);
   --sbb-button-color-hover-text: var(--sbb-color-milk);
   --sbb-button-shadow-1-color: var(--sbb-color-platinum-alpha-20);
   --sbb-button-shadow-2-color: var(--sbb-color-cement-alpha-20);
 }
 
+:host([negative]) {
+  --sbb-button-color-active-background: var(--sbb-color-white);
+  --sbb-button-color-active-border: var(--sbb-color-white);
+  --sbb-button-color-active-text: var(--sbb-color-anthracite);
+  --sbb-button-color-default-background: var(--sbb-color-milk);
+  --sbb-button-color-default-border: var(--sbb-color-milk);
+  --sbb-button-color-default-text: var(--sbb-color-midnight);
+  --sbb-button-color-hover-background: var(--sbb-color-milk);
+  --sbb-button-color-hover-border: var(--sbb-color-milk);
+  --sbb-button-color-hover-text: var(--sbb-color-iron);
+  --sbb-button-shadow-1-color: var(--sbb-color-black-alpha-30);
+  --sbb-button-shadow-2-color: var(--sbb-color-black-alpha-30);
+}
+
 :host(:not([disabled], :disabled, [disabled-interactive], :active, [data-active])) {
   --sbb-button-box-shadow: var(--sbb-button-box-shadow-definition);
 }