@mittwald/flow-design-tokens 0.1.0-alpha.261 → 0.1.0-alpha.262

package/dist/variables.css

@@ -259,6 +259,12 @@
   --list-item--padding: var(--size-px--s);
   --list--block-to-block-spacing: var(--size-px--m);
   --list--content-to-content-spacing: var(--size-px--s);
+  --link--color-light--pressed: var(--light--color--600);
+  --link--color-light--hover: var(--light--color--700);
+  --link--color-light--default: var(--light--color--800);
+  --link--color-dark--pressed: var(--dark--color--600);
+  --link--color-dark--hover: var(--dark--color--700);
+  --link--color-dark--default: var(--dark--color--800);
   --link--text-to-icon-spacing: var(--size-rem--xs);
   --link--font-weight: var(--font-weight--bold);
   --link--font-size: var(--font-size--s);
@@ -327,6 +333,7 @@
   --button--padding-s-squished-y: var(--size-px--xs);
   --button--padding-s-squished-x: var(--size-px--s);
   --button--padding-s: var(--size-px--xs);
+  --button--border-style: var(--border-style--default);
   --button--text-to-icon-spacing: var(--size-rem--s);
   --button--padding: var(--size-px--s);
   --button--padding-squished-y: var(--size-px--s);
@@ -418,15 +425,18 @@
   --accordion--header-padding-y: var(--size-px--xs);
   --accordion--header-padding-x: var(--size-px--s);
   --accordion--heading-to-chevron-spacing: var(--size-rem--s);
+  --light-outline-border-color: var(--light--color--700);
+  --light-outline-content-color: var(--light--color--800);
+  --light-outline-background-color--pressed: var(--light--color--200);
+  --light-outline-background-color--hover: var(--light--color--100);
+  --light-outline-background-color--default: var(--color--transparent);
   --light-plain-content-color--pressed: var(--light--color--600);
   --light-plain-content-color--hover: var(--light--color--700);
   --light-plain-content-color--default: var(--light--color--800);
   --light-plain-background-color--pressed: var(--light--color--200);
   --light-plain-background-color--hover: var(--light--color--100);
   --light-plain-background-color--default: var(--color--transparent);
-  --light-soft-content-color--pressed: var(--light--color--800);
-  --light-soft-content-color--hover: var(--light--color--800);
-  --light-soft-content-color--default: var(--light--color--800);
+  --light-soft-content-color: var(--light--color--800);
   --light-soft-background-color--pressed: var(--light--color--300);
   --light-soft-background-color--hover: var(--light--color--200);
   --light-soft-background-color--default: var(--light--color--100);
@@ -434,15 +444,18 @@
   --light-solid-background-color--pressed: var(--light--color--600);
   --light-solid-background-color--hover: var(--light--color--700);
   --light-solid-background-color--default: var(--light--color--800);
+  --dark-outline-border-color: var(--dark--color--700);
+  --dark-outline-content-color: var(--dark--color--800);
+  --dark-outline-background-color--pressed: var(--dark--color--200);
+  --dark-outline-background-color--hover: var(--dark--color--100);
+  --dark-outline-background-color--default: var(--color--transparent);
   --dark-plain-content-color--pressed: var(--dark--color--600);
   --dark-plain-content-color--hover: var(--dark--color--700);
   --dark-plain-content-color--default: var(--dark--color--800);
   --dark-plain-background-color--pressed: var(--dark--color--200);
   --dark-plain-background-color--hover: var(--dark--color--100);
   --dark-plain-background-color--default: var(--color--transparent);
-  --dark-soft-content-color--pressed: var(--dark--color--800);
-  --dark-soft-content-color--hover: var(--dark--color--800);
-  --dark-soft-content-color--default: var(--dark--color--800);
+  --dark-soft-content-color: var(--dark--color--800);
   --dark-soft-background-color--pressed: var(--dark--color--300);
   --dark-soft-background-color--hover: var(--dark--color--200);
   --dark-soft-background-color--default: var(--dark--color--100);
@@ -467,13 +480,17 @@
   --disabled-light-solid-background-color: var(--light--color--300);
   --disabled-dark-solid-content-color: var(--light--color--300);
   --disabled-dark-solid-background-color: var(--dark--color--300);
+  --neutral-outline-background-color--default: var(--color--transparent);
   --neutral-plain-background-color--default: var(--color--transparent);
+  --warning-plain-background-color--default: var(--color--transparent);
   --warning-outline-background-color--default: var(--color--transparent);
   --success-outline-background-color--default: var(--color--transparent);
   --success-plain-background-color--default: var(--color--transparent);
+  --info-plain-background-color--default: var(--color--transparent);
   --info-outline-background-color--default: var(--color--transparent);
   --danger-outline-background-color--default: var(--color--transparent);
   --danger-plain-background-color--default: var(--color--transparent);
+  --primary-outline-background-color--default: var(--color--transparent);
   --primary-plain-background-color--default: var(--color--transparent);
   --warning--color--1100: var(--color--royal-orange--1100);
   --warning--color--1000: var(--color--royal-orange--1000);
@@ -606,22 +623,19 @@
   --list-item--border-width: var(--border-width--100);
   --list-item--corner-radius: var(--corner-radius--default);
   --link--color-light--disabled: var(--disabled-light-plain-content-color);
-  --link--color-light--pressed: var(--light-plain-content-color--pressed);
-  --link--color-light--hover: var(--light-plain-content-color--hover);
-  --link--color-light--default: var(--light-plain-content-color--default);
   --link--color-dark--disabled: var(--disabled-dark-plain-content-color);
-  --link--color-dark--pressed: var(--dark-plain-content-color--pressed);
-  --link--color-dark--hover: var(--dark-plain-content-color--hover);
-  --link--color-dark--default: var(--dark-plain-content-color--default);
+  --link--color--pressed: var(--primary--color--1000);
+  --link--color--hover: var(--primary--color--900);
+  --link--color--default: var(--primary--color--800);
   --link--line-height: var(--line-height--m);
   --layout-card--box-shadow: var(--shadow--content);
   --layout-card--corner-radius: var(--corner-radius--default);
   --layout-card--background-color: var(--neutral--color--100);
   --label--color--default: var(--neutral--color--800);
   --label--line-height: var(--line-height--m);
-  --inline-code--dark-content-color: var(--dark-soft-content-color--default);
+  --inline-code--dark-content-color: var(--dark-soft-content-color);
   --inline-code--dark-background-color: var(--dark-soft-background-color--default);
-  --inline-code--light-content-color: var(--light-soft-content-color--default);
+  --inline-code--light-content-color: var(--light-soft-content-color);
   --inline-code--light-background-color: var(--light-soft-background-color--default);
   --inline-code--corner-radius: var(--corner-radius--default);
   --inline-code--line-height: var(--line-height--m);
@@ -650,10 +664,20 @@
   --calendar--day-background-color--disabled: var(--disabled-plain-background-color);
   --counter-badge--border-color: var(--neutral--color--100);
   --counter-badge--border-width: var(--border-width--200);
+  --button--light-outline-border-color--disabled: var(--disabled-light-outline-border-color);
+  --button--light-outline-border-color--default: var(--light-outline-border-color);
+  --button--light-outline-content-color--disabled: var(--disabled-light-outline-content-color);
+  --button--light-outline-content-color--pressed: var(--light-outline-content-color);
+  --button--light-outline-content-color--hover: var(--light-outline-content-color);
+  --button--light-outline-content-color--default: var(--light-outline-content-color);
+  --button--light-outline-background-color--disabled: var(--disabled-light-outline-background-color);
+  --button--light-outline-background-color--pressed: var(--light-outline-background-color--pressed);
+  --button--light-outline-background-color--hover: var(--light-outline-background-color--hover);
+  --button--light-outline-background-color--default: var(--light-outline-background-color--default);
   --button--light-soft-content-color--disabled: var(--disabled-light-soft-content-color);
-  --button--light-soft-content-color--pressed: var(--light-soft-content-color--pressed);
-  --button--light-soft-content-color--hover: var(--light-soft-content-color--hover);
-  --button--light-soft-content-color--default: var(--light-soft-content-color--default);
+  --button--light-soft-content-color--pressed: var(--light-soft-content-color);
+  --button--light-soft-content-color--hover: var(--light-soft-content-color);
+  --button--light-soft-content-color--default: var(--light-soft-content-color);
   --button--light-soft-background-color--disabled: var(--disabled-light-soft-background-color);
   --button--light-soft-background-color--pressed: var(--light-soft-background-color--pressed);
   --button--light-soft-background-color--hover: var(--light-soft-background-color--hover);
@@ -674,10 +698,20 @@
   --button--light-solid-background-color--pressed: var(--light-solid-background-color--pressed);
   --button--light-solid-background-color--hover: var(--light-solid-background-color--hover);
   --button--light-solid-background-color--default: var(--light-solid-background-color--default);
+  --button--dark-outline-border-color--disabled: var(--disabled-dark-outline-border-color);
+  --button--dark-outline-border-color--default: var(--dark-outline-border-color);
+  --button--dark-outline-content-color--disabled: var(--disabled-dark-outline-content-color);
+  --button--dark-outline-content-color--pressed: var(--dark-outline-content-color);
+  --button--dark-outline-content-color--hover: var(--dark-outline-content-color);
+  --button--dark-outline-content-color--default: var(--dark-outline-content-color);
+  --button--dark-outline-background-color--disabled: var(--disabled-dark-outline-background-color);
+  --button--dark-outline-background-color--pressed: var(--dark-outline-background-color--pressed);
+  --button--dark-outline-background-color--hover: var(--dark-outline-background-color--hover);
+  --button--dark-outline-background-color--default: var(--dark-outline-background-color--default);
   --button--dark-soft-content-color--disabled: var(--disabled-dark-soft-content-color);
-  --button--dark-soft-content-color--pressed: var(--dark-soft-content-color--pressed);
-  --button--dark-soft-content-color--hover: var(--dark-soft-content-color--hover);
-  --button--dark-soft-content-color--default: var(--dark-soft-content-color--default);
+  --button--dark-soft-content-color--pressed: var(--dark-soft-content-color);
+  --button--dark-soft-content-color--hover: var(--dark-soft-content-color);
+  --button--dark-soft-content-color--default: var(--dark-soft-content-color);
   --button--dark-soft-background-color--disabled: var(--disabled-dark-soft-background-color);
   --button--dark-soft-background-color--pressed: var(--dark-soft-background-color--pressed);
   --button--dark-soft-background-color--hover: var(--dark-soft-background-color--hover);
@@ -698,14 +732,19 @@
   --button--dark-solid-background-color--pressed: var(--dark-solid-background-color--pressed);
   --button--dark-solid-background-color--hover: var(--dark-solid-background-color--hover);
   --button--dark-solid-background-color--default: var(--dark-solid-background-color--default);
+  --button--danger-outline-background-color--default: var(--danger-outline-background-color--default);
   --button--danger-plain-background-color--disabled: var(--disabled-plain-background-color);
   --button--danger-plain-background-color--default: var(--danger-plain-background-color--default);
+  --button--secondary-outline-background-color--default: var(--neutral-outline-background-color--default);
   --button--secondary-plain-background-color--disabled: var(--disabled-plain-background-color);
   --button--secondary-plain-background-color--default: var(--neutral-plain-background-color--default);
+  --button--primary-outline-background-color--default: var(--primary-outline-background-color--default);
   --button--primary-plain-background-color--disabled: var(--disabled-plain-background-color);
   --button--primary-plain-background-color--default: var(--primary-plain-background-color--default);
+  --button--accent-outline-background-color--default: var(--success-outline-background-color--default);
   --button--accent-plain-background-color--disabled: var(--disabled-plain-background-color);
   --button--accent-plain-background-color--default: var(--success-plain-background-color--default);
+  --button--border-width: var(--border-width--100);
   --button--failed-icon-color: var(--danger--color--700);
   --button--succeeded-icon-color: var(--success--color--700);
   --button--corner-radius: var(--corner-radius--default);
@@ -733,19 +772,15 @@
   --disabled-solid-content-color: var(--neutral--color--600);
   --disabled-solid-background-color: var(--neutral--color--400);
   --neutral-soft-content-color--pressed: var(--neutral--color--1100);
-  --neutral-soft-content-color--hover: var(--neutral--color--1000);
   --neutral-soft-content-color--default: var(--neutral--color--1000);
   --neutral-soft-background-color--pressed: var(--neutral--color--600);
   --neutral-soft-background-color--hover: var(--neutral--color--500);
   --neutral-soft-background-color--default: var(--neutral--color--400);
-  --neutral-outline-border-color--selected: var(--primary--color--800);
-  --neutral-outline-border-color--default: var(--neutral--color--700);
-  --neutral-outline-content-color--selected: var(--primary--color--900);
-  --neutral-outline-content-color--default: var(--neutral--color--1000);
-  --neutral-outline-background-color--pressed: var(--primary--color--200);
-  --neutral-outline-background-color--selected: var(--primary--color--200);
-  --neutral-outline-background-color--hover: var(--primary--color--100);
-  --neutral-outline-background-color--default: var(--neutral--color--200);
+  --neutral-outline-border-color: var(--neutral--color--700);
+  --neutral-outline-content-color: var(--neutral--color--1000);
+  --neutral-outline-background-color--pressed: var(--neutral--color--600);
+  --neutral-outline-background-color--selected: var(--neutral--color--500);
+  --neutral-outline-background-color--hover: var(--neutral--color--400);
   --neutral-plain-content-color: var(--neutral--color--1000);
   --neutral-plain-background-color--pressed: var(--neutral--color--500);
   --neutral-plain-background-color--hover: var(--neutral--color--400);
@@ -753,8 +788,10 @@
   --neutral-solid-background-color--pressed: var(--neutral--color--1000);
   --neutral-solid-background-color--hover: var(--neutral--color--900);
   --neutral-solid-background-color--default: var(--neutral--color--800);
+  --warning-plain-content-color: var(--info--color--800);
+  --warning-plain-background-color--pressed: var(--info--color--200);
+  --warning-plain-background-color--hover: var(--info--color--100);
   --warning-soft-content-color--pressed: var(--warning--color--1000);
-  --warning-soft-content-color--hover: var(--warning--color--900);
   --warning-soft-content-color--default: var(--warning--color--900);
   --warning-soft-background-color--pressed: var(--warning--color--300);
   --warning-soft-background-color--hover: var(--warning--color--200);
@@ -768,7 +805,6 @@
   --warning-solid-background-color--hover: var(--warning--color--900);
   --warning-solid-background-color--default: var(--warning--color--800);
   --success-soft-content-color--pressed: var(--success--color--1000);
-  --success-soft-content-color--hover: var(--success--color--900);
   --success-soft-content-color--default: var(--success--color--900);
   --success-soft-background-color--pressed: var(--success--color--300);
   --success-soft-background-color--hover: var(--success--color--200);
@@ -777,17 +813,17 @@
   --success-outline-content-color: var(--success--color--900);
   --success-outline-background-color--pressed: var(--success--color--200);
   --success-outline-background-color--hover: var(--success--color--100);
-  --success-plain-content-color--pressed: var(--success--color--1000);
-  --success-plain-content-color--hover: var(--success--color--900);
-  --success-plain-content-color--default: var(--success--color--800);
+  --success-plain-content-color: var(--success--color--800);
   --success-plain-background-color--pressed: var(--success--color--200);
   --success-plain-background-color--hover: var(--success--color--100);
   --success-solid-content-color: var(--neutral--color--100);
   --success-solid-background-color--pressed: var(--success--color--1000);
   --success-solid-background-color--hover: var(--success--color--900);
   --success-solid-background-color--default: var(--success--color--800);
+  --info-plain-content-color: var(--info--color--800);
+  --info-plain-background-color--pressed: var(--info--color--200);
+  --info-plain-background-color--hover: var(--info--color--100);
   --info-soft-content-color--pressed: var(--info--color--1000);
-  --info-soft-content-color--hover: var(--info--color--900);
   --info-soft-content-color--default: var(--info--color--900);
   --info-soft-background-color--pressed: var(--info--color--300);
   --info-soft-background-color--hover: var(--info--color--200);
@@ -801,7 +837,6 @@
   --info-solid-background-color--hover: var(--info--color--900);
   --info-solid-background-color--default: var(--info--color--800);
   --danger-soft-content-color--pressed: var(--danger--color--1000);
-  --danger-soft-content-color--hover: var(--danger--color--900);
   --danger-soft-content-color--default: var(--danger--color--900);
   --danger-soft-background-color--pressed: var(--danger--color--300);
   --danger-soft-background-color--hover: var(--danger--color--200);
@@ -810,24 +845,24 @@
   --danger-outline-content-color: var(--danger--color--900);
   --danger-outline-background-color--pressed: var(--danger--color--200);
   --danger-outline-background-color--hover: var(--danger--color--100);
-  --danger-plain-content-color--pressed: var(--danger--color--1000);
-  --danger-plain-content-color--hover: var(--danger--color--900);
-  --danger-plain-content-color--default: var(--danger--color--800);
+  --danger-plain-content-color: var(--danger--color--800);
   --danger-plain-background-color--pressed: var(--danger--color--200);
   --danger-plain-background-color--hover: var(--danger--color--100);
   --danger-solid-content-color: var(--neutral--color--100);
   --danger-solid-background-color--pressed: var(--danger--color--1000);
   --danger-solid-background-color--hover: var(--danger--color--900);
   --danger-solid-background-color--default: var(--danger--color--800);
+  --primary-outline-border-color: var(--primary--color--800);
+  --primary-outline-content-color: var(--primary--color--900);
+  --primary-outline-background-color--pressed: var(--primary--color--200);
+  --primary-outline-background-color--hover: var(--primary--color--100);
   --primary-soft-content-color--pressed: var(--primary--color--1000);
   --primary-soft-content-color--hover: var(--primary--color--900);
   --primary-soft-content-color--default: var(--primary--color--900);
   --primary-soft-background-color--pressed: var(--primary--color--300);
   --primary-soft-background-color--hover: var(--primary--color--200);
   --primary-soft-background-color--default: var(--primary--color--100);
-  --primary-plain-content-color--pressed: var(--primary--color--1000);
-  --primary-plain-content-color--hover: var(--primary--color--900);
-  --primary-plain-content-color--default: var(--primary--color--800);
+  --primary-plain-content-color: var(--primary--color--800);
   --primary-plain-background-color--pressed: var(--primary--color--200);
   --primary-plain-background-color--hover: var(--primary--color--100);
   --primary-solid-content-color: var(--neutral--color--100);
@@ -837,26 +872,26 @@
   --menu-item--disabled-color: var(--disabled-plain-content-color);
   --menu-item--background-color--current: var(--primary-plain-background-color--pressed);
   --menu-item--background-color--hover: var(--primary-plain-background-color--hover);
-  --form-control--content-color--selected: var(--neutral-outline-content-color--selected);
+  --form-control--content-color--selected: var(--neutral-outline-content-color);
   --form-control--content-color--disabled: var(--disabled-outline-content-color);
-  --form-control--content-color--default: var(--neutral-outline-content-color--default);
+  --form-control--content-color--default: var(--neutral-outline-content-color);
   --form-control--background-color--selected: var(--info-outline-background-color--pressed);
   --form-control--background-color--hover: var(--neutral-outline-background-color--hover);
   --form-control--background-color--disabled: var(--disabled-outline-background-color);
-  --form-control--border-color--selected: var(--neutral-outline-border-color--selected);
+  --form-control--border-color--selected: var(--neutral-outline-border-color);
   --form-control--border-color--focused: var(--focus--outline-color);
   --form-control--border-color--invalid: var(--danger-outline-border-color);
   --form-control--border-color--disabled: var(--disabled-outline-border-color);
-  --form-control--border-color--default: var(--neutral-outline-border-color--default);
+  --form-control--border-color--default: var(--neutral-outline-border-color);
   --time-field--date-segment-background-color--focused: var(--primary-plain-background-color--pressed);
   --tab--disabled-background-color: var(--neutral-soft-background-color--default);
   --tab--color--pressed: var(--neutral-soft-content-color--pressed);
-  --tab--color--hover: var(--neutral-soft-content-color--hover);
+  --tab--color--hover: var(--neutral-soft-content-color--default);
   --tab--color--default: var(--neutral-soft-content-color--default);
   --tab--background-color--pressed: var(--neutral-soft-background-color--pressed);
   --tab--background-color--hover: var(--neutral-soft-background-color--hover);
   --tab--background-color--default: var(--neutral-soft-background-color--default);
-  --table--border-color: var(--neutral-outline-border-color--default);
+  --table--border-color: var(--neutral-outline-border-color);
   --switch--handle-color--default: var(--neutral-solid-content-color);
   --switch--track-background-color--selected: var(--success-solid-background-color--default);
   --switch--track-background-color--default: var(--neutral-solid-background-color--default);
@@ -889,15 +924,15 @@
   --section--border-color: var(--separator--color);
   --section--border-width: var(--separator--height);
   --radio--icon-color--disabled: var(--disabled-outline-content-color);
-  --radio--icon-color--selected: var(--neutral-outline-border-color--selected);
+  --radio--icon-color--selected: var(--neutral-outline-border-color);
   --radio--icon-color--default: var(--icon--color--default);
   --radio--color--disabled: var(--disabled-outline-content-color);
   --progress-bar--danger-fill-background-color: var(--danger-solid-background-color--default);
   --progress-bar--warning-fill-background-color: var(--warning-solid-background-color--default);
   --progress-bar--success-fill-background-color: var(--success-solid-background-color--default);
   --progress-bar--info-fill-background-color: var(--info-solid-background-color--default);
-  --progress-bar--bar-border-color: var(--neutral-outline-border-color--default);
-  --popover--border-color: var(--neutral-outline-border-color--default);
+  --progress-bar--bar-border-color: var(--neutral-outline-border-color);
+  --popover--border-color: var(--neutral-outline-border-color);
   --notification--success-background-color--pressed: var(--success-outline-background-color--pressed);
   --notification--success-background-color--hover: var(--success-outline-background-color--hover);
   --notification--success-heading-color: var(--success-outline-content-color);
@@ -914,13 +949,10 @@
   --notification--info-background-color--hover: var(--info-outline-background-color--hover);
   --notification--info-heading-color: var(--info-outline-content-color);
   --notification--info-border-color: var(--info-outline-border-color);
-  --list-item--border-color: var(--neutral-outline-border-color--default);
+  --list-item--border-color: var(--neutral-outline-border-color);
   --list-item--background-color--pressed: var(--neutral-outline-background-color--pressed);
   --list-item--background-color--hover: var(--neutral-outline-background-color--hover);
   --link--color--disabled: var(--disabled-plain-content-color);
-  --link--color--pressed: var(--primary-plain-content-color--pressed);
-  --link--color--hover: var(--primary-plain-content-color--hover);
-  --link--color--default: var(--primary-plain-content-color--default);
   --label--color--disabled: var(--disabled-plain-content-accent-color);
   --inline-code--neutral-content-color: var(--neutral-soft-content-color--default);
   --inline-code--neutral-background-color: var(--neutral-soft-background-color--default);
@@ -946,21 +978,30 @@
   --counter-badge--color: var(--success-solid-content-color);
   --counter-badge--background-color: var(--success-solid-background-color--default);
   --checkbox--icon-color--disabled: var(--disabled-outline-content-color);
-  --checkbox--icon-color--selected: var(--neutral-outline-border-color--selected);
+  --checkbox--icon-color--selected: var(--neutral-outline-border-color);
   --checkbox--icon-color--default: var(--icon--color--default);
   --checkbox--color--disabled: var(--disabled-outline-content-color);
+  --button--danger-outline-border-color--disabled: var(--disabled-outline-border-color);
+  --button--danger-outline-border-color--default: var(--danger-outline-border-color);
+  --button--danger-outline-content-color--disabled: var(--disabled-outline-content-color);
+  --button--danger-outline-content-color--pressed: var(--danger-outline-border-color);
+  --button--danger-outline-content-color--hover: var(--danger-outline-border-color);
+  --button--danger-outline-content-color--default: var(--danger-outline-border-color);
+  --button--danger-outline-background-color--disabled: var(--disabled-outline-background-color);
+  --button--danger-outline-background-color--pressed: var(--danger-outline-background-color--pressed);
+  --button--danger-outline-background-color--hover: var(--danger-outline-background-color--hover);
   --button--danger-soft-content-color--disabled: var(--disabled-soft-content-color);
   --button--danger-soft-content-color--pressed: var(--danger-soft-content-color--pressed);
-  --button--danger-soft-content-color--hover: var(--danger-soft-content-color--hover);
+  --button--danger-soft-content-color--hover: var(--danger-soft-content-color--default);
   --button--danger-soft-content-color--default: var(--danger-soft-content-color--default);
   --button--danger-soft-background-color--disabled: var(--disabled-soft-background-color);
   --button--danger-soft-background-color--pressed: var(--danger-soft-background-color--pressed);
   --button--danger-soft-background-color--hover: var(--danger-soft-background-color--hover);
   --button--danger-soft-background-color--default: var(--danger-soft-background-color--default);
   --button--danger-plain-content-color--disabled: var(--disabled-plain-content-color);
-  --button--danger-plain-content-color--pressed: var(--danger-plain-content-color--default);
-  --button--danger-plain-content-color--hover: var(--danger-plain-content-color--default);
-  --button--danger-plain-content-color--default: var(--danger-plain-content-color--default);
+  --button--danger-plain-content-color--pressed: var(--danger-plain-content-color);
+  --button--danger-plain-content-color--hover: var(--danger-plain-content-color);
+  --button--danger-plain-content-color--default: var(--danger-plain-content-color);
   --button--danger-plain-background-color--pressed: var(--danger-plain-background-color--pressed);
   --button--danger-plain-background-color--hover: var(--danger-plain-background-color--hover);
   --button--danger-solid-content-color--disabled: var(--disabled-solid-content-color);
@@ -971,9 +1012,18 @@
   --button--danger-solid-background-color--pressed: var(--danger-solid-background-color--pressed);
   --button--danger-solid-background-color--hover: var(--danger-solid-background-color--hover);
   --button--danger-solid-background-color--default: var(--danger-solid-background-color--default);
+  --button--secondary-outline-border-color--disabled: var(--disabled-outline-border-color);
+  --button--secondary-outline-border-color--default: var(--neutral-outline-border-color);
+  --button--secondary-outline-content-color--disabled: var(--disabled-outline-content-color);
+  --button--secondary-outline-content-color--pressed: var(--neutral-outline-content-color);
+  --button--secondary-outline-content-color--hover: var(--neutral-outline-content-color);
+  --button--secondary-outline-content-color--default: var(--neutral-outline-content-color);
+  --button--secondary-outline-background-color--disabled: var(--disabled-outline-background-color);
+  --button--secondary-outline-background-color--pressed: var(--neutral-outline-background-color--pressed);
+  --button--secondary-outline-background-color--hover: var(--neutral-outline-background-color--hover);
   --button--secondary-soft-content-color--disabled: var(--disabled-soft-content-color);
   --button--secondary-soft-content-color--pressed: var(--neutral-soft-content-color--pressed);
-  --button--secondary-soft-content-color--hover: var(--neutral-soft-content-color--hover);
+  --button--secondary-soft-content-color--hover: var(--neutral-soft-content-color--default);
   --button--secondary-soft-content-color--default: var(--neutral-soft-content-color--default);
   --button--secondary-soft-background-color--disabled: var(--disabled-soft-background-color);
   --button--secondary-soft-background-color--pressed: var(--neutral-soft-background-color--pressed);
@@ -993,6 +1043,15 @@
   --button--secondary-solid-background-color--pressed: var(--neutral-solid-background-color--pressed);
   --button--secondary-solid-background-color--hover: var(--neutral-solid-background-color--hover);
   --button--secondary-solid-background-color--default: var(--neutral-solid-background-color--default);
+  --button--primary-outline-border-color--disabled: var(--disabled-outline-border-color);
+  --button--primary-outline-border-color--default: var(--primary-outline-border-color);
+  --button--primary-outline-content-color--disabled: var(--disabled-outline-content-color);
+  --button--primary-outline-content-color--pressed: var(--primary-outline-border-color);
+  --button--primary-outline-content-color--hover: var(--primary-outline-border-color);
+  --button--primary-outline-content-color--default: var(--primary-outline-border-color);
+  --button--primary-outline-background-color--disabled: var(--disabled-outline-background-color);
+  --button--primary-outline-background-color--pressed: var(--primary-outline-background-color--pressed);
+  --button--primary-outline-background-color--hover: var(--primary-outline-background-color--hover);
   --button--primary-soft-content-color--disabled: var(--disabled-soft-content-color);
   --button--primary-soft-content-color--pressed: var(--primary-soft-content-color--pressed);
   --button--primary-soft-content-color--hover: var(--primary-soft-content-color--hover);
@@ -1002,9 +1061,9 @@
   --button--primary-soft-background-color--hover: var(--primary-soft-background-color--hover);
   --button--primary-soft-background-color--default: var(--primary-soft-background-color--default);
   --button--primary-plain-content-color--disabled: var(--disabled-plain-content-color);
-  --button--primary-plain-content-color--pressed: var(--primary-plain-content-color--default);
-  --button--primary-plain-content-color--hover: var(--primary-plain-content-color--default);
-  --button--primary-plain-content-color--default: var(--primary-plain-content-color--default);
+  --button--primary-plain-content-color--pressed: var(--primary-plain-content-color);
+  --button--primary-plain-content-color--hover: var(--primary-plain-content-color);
+  --button--primary-plain-content-color--default: var(--primary-plain-content-color);
   --button--primary-plain-background-color--pressed: var(--primary-plain-background-color--pressed);
   --button--primary-plain-background-color--hover: var(--primary-plain-background-color--hover);
   --button--primary-solid-content-color--disabled: var(--disabled-solid-content-color);
@@ -1015,18 +1074,27 @@
   --button--primary-solid-background-color--pressed: var(--primary-solid-background-color--pressed);
   --button--primary-solid-background-color--hover: var(--primary-solid-background-color--hover);
   --button--primary-solid-background-color--default: var(--primary-solid-background-color--default);
+  --button--accent-outline-border-color--disabled: var(--disabled-outline-border-color);
+  --button--accent-outline-border-color--default: var(--success-outline-border-color);
+  --button--accent-outline-content-color--disabled: var(--disabled-outline-content-color);
+  --button--accent-outline-content-color--pressed: var(--success-outline-border-color);
+  --button--accent-outline-content-color--hover: var(--success-outline-border-color);
+  --button--accent-outline-content-color--default: var(--success-outline-border-color);
+  --button--accent-outline-background-color--disabled: var(--disabled-outline-background-color);
+  --button--accent-outline-background-color--pressed: var(--success-outline-background-color--pressed);
+  --button--accent-outline-background-color--hover: var(--success-outline-background-color--hover);
   --button--accent-soft-content-color--disabled: var(--disabled-soft-content-color);
   --button--accent-soft-content-color--pressed: var(--success-soft-content-color--pressed);
-  --button--accent-soft-content-color--hover: var(--success-soft-content-color--hover);
+  --button--accent-soft-content-color--hover: var(--success-soft-content-color--default);
   --button--accent-soft-content-color--default: var(--success-soft-content-color--default);
   --button--accent-soft-background-color--disabled: var(--disabled-soft-background-color);
   --button--accent-soft-background-color--pressed: var(--success-soft-background-color--pressed);
   --button--accent-soft-background-color--hover: var(--success-soft-background-color--hover);
   --button--accent-soft-background-color--default: var(--success-soft-background-color--default);
   --button--accent-plain-content-color--disabled: var(--disabled-plain-content-color);
-  --button--accent-plain-content-color--pressed: var(--success-plain-content-color--default);
-  --button--accent-plain-content-color--hover: var(--success-plain-content-color--default);
-  --button--accent-plain-content-color--default: var(--success-plain-content-color--default);
+  --button--accent-plain-content-color--pressed: var(--success-plain-content-color);
+  --button--accent-plain-content-color--hover: var(--success-plain-content-color);
+  --button--accent-plain-content-color--default: var(--success-plain-content-color);
   --button--accent-plain-background-color--pressed: var(--success-plain-background-color--pressed);
   --button--accent-plain-background-color--hover: var(--success-plain-background-color--hover);
   --button--accent-solid-content-color--disabled: var(--disabled-solid-content-color);