@designsystem-se/af 38.2.1-beta.dark-mode → 39.0.0

package/dist/collection/styles/src/themes/_brand-af25.mixin.scss

@@ -23,143 +23,15 @@
   --digi--rallarros--500: #ce1cbd;
   --digi--sapphire--500: #1616b2;
 
-  --digi--color--background--brand-primary--dark: var(--digi--grayscale--900);
-  --digi--color--background--dropdown--dark: var(--digi--grayscale--800);
-  --digi--color--background--interactive--default--input-elements--dark: var(--digi--misc--transparent);
-  --digi--color--background--interactive--default--pop-out--dark: var(--digi--grayscale--650);
-  --digi--color--background--interactive--default--primary--dark: var(--digi--grayscale--50);
-  --digi--color--background--interactive--default--primary-inverted--dark: var(--digi--norrsken--500);
-  --digi--color--background--interactive--default--quaternary--dark: var(--digi--grayscale--850);
-  --digi--color--background--interactive--default--quinary-ghost-gra--dark: var(--digi--misc--transparent);
-  --digi--color--background--interactive--default--secondary--dark: var(--digi--misc--transparent);
-  --digi--color--background--interactive--default--secondary-inverted--dark: var(--digi--misc--transparent);
-  --digi--color--background--interactive--default--tertiary--dark: var(--digi--grayscale--875);
-  --digi--color--background--interactive--hover--ghost-rider--dark: var(--digi--grayscale--850);
-  --digi--color--background--interactive--hover--inverted--dark: var(--digi--norrsken--400);
-  --digi--color--background--interactive--hover--primary--dark: var(--digi--grayscale--650);
-  --digi--color--background--interactive--hover--quarternary--dark: var(--digi--grayscale--875);
-  --digi--color--background--interactive--hover--secondary--dark: var(--digi--grayscale--875);
-  --digi--color--background--interactive--hover--tertiary--dark: var(--digi--grayscale--850);
-  --digi--color--background--interactive--selected--on-menu-minus-button--dark: var(--digi--grayscale--650);
-  --digi--color--background--interactive--selected--primary--dark: var(--digi--misc--transparent);
-  --digi--color--background--interactive--selected--primary-stay--dark: var(--digi--sentiment--success--500);
-  --digi--color--background--interactive--selected--secondary--dark: var(--digi--misc--transparent);
-  --digi--color--background--interactive--selected--tertiary--dark: var(--digi--grayscale--875);
-  --digi--color--background--interactive--validation--error--dark: var(--digi--misc--transparent);
-  --digi--color--background--interactive--validation--success--dark: var(--digi--misc--transparent);
-  --digi--color--background--interactive--validation--warning--dark: var(--digi--misc--transparent);
-  --digi--color--background--notification--dark: var(--digi--sentiment--error--500);
-  --digi--color--background--pop-out--dark: var(--digi--grayscale--875);
-  --digi--color--background--primary--dark: var(--digi--grayscale--950);
-  --digi--color--background--primary-elevated--dark: var(--digi--grayscale--850);
-  --digi--color--background--secondary--dark: var(--digi--grayscale--975);
-  --digi--color--background--secondary-accent--dark: var(--digi--grayscale--850);
-  --digi--color--background--secondary-elevated--dark: var(--digi--grayscale--875);
-  --digi--color--background--secondary-muted--dark: var(--digi--grayscale--900);
-  --digi--color--background--sentiment--beta--primary--dark: var(--digi--rallarros--500);
-  --digi--color--background--sentiment--beta--secondary--dark: var(--digi--rallarros--300);
-  --digi--color--background--sentiment--error--primary--dark: var(--digi--sentiment--error--500);
-  --digi--color--background--sentiment--error--secondary--dark: var(--digi--sentiment--error--700);
-  --digi--color--background--sentiment--error--tertiary--dark: var(--digi--sentiment--error--200);
-  --digi--color--background--sentiment--error--tertiary-discreet--dark: var(--digi--grayscale--850);
-  --digi--color--background--sentiment--info--primary--dark: var(--digi--sentiment--informative--500);
-  --digi--color--background--sentiment--info--secondary--dark: var(--digi--sentiment--informative--700);
-  --digi--color--background--sentiment--info--tertiary--dark: var(--digi--sentiment--informative--200);
-  --digi--color--background--sentiment--neutral--primary--dark: var(--digi--grayscale--700);
-  --digi--color--background--sentiment--neutral--secondary--dark: var(--digi--grayscale--400);
-  --digi--color--background--sentiment--neutral--tertiary--dark: var(--digi--grayscale--900);
-  --digi--color--background--sentiment--success--primary--dark: var(--digi--sentiment--success--500);
-  --digi--color--background--sentiment--success--secondary--dark: var(--digi--sentiment--success--700);
-  --digi--color--background--sentiment--success--tertiary--dark: var(--digi--sentiment--success--200);
-  --digi--color--background--sentiment--warning--primary--dark: var(--digi--sentiment--warning--500);
-  --digi--color--background--sentiment--warning--quarternary--dark: var(--digi--grayscale--850);
-  --digi--color--background--sentiment--warning--secondary--dark: var(--digi--sentiment--warning--700);
-  --digi--color--background--sentiment--warning--tertiary--dark: var(--digi--sentiment--warning--200);
-  --digi--color--background--surface--dark: var(--digi--grayscale--900);
-  --digi--color--background--transparent--dark: var(--digi--misc--transparent);
-  --digi--color--border--accent--primary--dark: var(--digi--grayscale--650);
-  --digi--color--border--accent--secondary--dark: var(--digi--granskott--700);
-  --digi--color--border--interactive--default--discreeeeeeet--dark: var(--digi--grayscale--550);
-  --digi--color--border--interactive--default--inverted--dark: var(--digi--norrsken--500);
-  --digi--color--border--interactive--default--on-input--dark: var(--digi--grayscale--75);
-  --digi--color--border--interactive--default--on-input-nuance--dark: var(--digi--grayscale--650);
-  --digi--color--border--interactive--default--primary--dark: var(--digi--grayscale--75);
-  --digi--color--border--interactive--hover--inverted--dark: var(--digi--norrsken--400);
-  --digi--color--border--interactive--hover--primary--dark: var(--digi--grayscale--75);
-  --digi--color--border--interactive--hover--secondary--dark: var(--digi--grayscale--75);
-  --digi--color--border--interactive--selected--primary--dark: var(--digi--grayscale--75);
-  --digi--color--border--interactive--selected--secondary--dark: var(--digi--grayscale--75);
-  --digi--color--border--interactive--validation--error--dark: var(--digi--sentiment--error--500);
-  --digi--color--border--interactive--validation--success--dark: var(--digi--sentiment--success--500);
-  --digi--color--border--interactive--validation--warning--dark: var(--digi--sentiment--warning--700);
-  --digi--color--border--notification--dark: var(--digi--misc--transparent);
-  --digi--color--border--sentiment--error--dark: var(--digi--sentiment--error--500);
-  --digi--color--border--sentiment--info--dark: var(--digi--sentiment--informative--500);
-  --digi--color--border--sentiment--success--dark: var(--digi--sentiment--success--500);
-  --digi--color--border--sentiment--warning--dark: var(--digi--sentiment--warning--500);
-  --digi--color--border--transparent--dark: var(--digi--misc--transparent);
-  --digi--color--divider--cta--dark: var(--digi--norrsken--500);
-  --digi--color--divider--on-brand-primary--dark: var(--digi--grayscale--650);
-  --digi--color--divider--primary--dark: var(--digi--grayscale--800);
-  --digi--color--divider--secondary--dark: var(--digi--grayscale--650);
-  --digi--color--divider--tertiary-hypotes--dark: var(--digi--grayscale--550);
-  --digi--color--icon--brand-primary--dark: var(--digi--grayscale--75);
-  --digi--color--icon--brand-primary-secondary-hypotes--dark: var(--digi--grayscale--900);
-  --digi--color--icon--brand-secondary--dark: var(--digi--norrsken--500);
-  --digi--color--icon--cta--dark: var(--digi--norrsken--500);
-  --digi--color--icon--primary--dark: var(--digi--grayscale--75);
-  --digi--color--icon--primary-anti-reverse--dark: var(--digi--grayscale--900);
-  --digi--color--icon--secondary--dark: var(--digi--grayscale--75);
-  --digi--color--icon--secondary-reverse--dark: var(--digi--grayscale--900);
-  --digi--color--icon--validation--error--dark: var(--digi--sentiment--error--500);
-  --digi--color--icon--validation--success--dark: var(--digi--sentiment--success--500);
-  --digi--color--icon--validation--warning--dark: var(--digi--sentiment--warning--500);
-  --digi--color--infographic--background--dark: var(--digi--grayscale--0);
-  --digi--color--infographic--brand--primary--dark: var(--digi--granskott--700);
-  --digi--color--infographic--brand--primary-alt--dark: var(--digi--granskott--700);
-  --digi--color--infographic--brand--secondary--dark: var(--digi--granskott--300);
-  --digi--color--infographic--brand--secondary-alt--dark: var(--digi--granskott--300);
-  --digi--color--infographic--lineart--dark: var(--digi--grayscale--75);
-  --digi--color--logotype--primary--symbol--dark: #1db920;
-  --digi--color--logotype--primary--text--dark: var(--digi--grayscale--0);
-  --digi--color--logotype--secondary--symbol--dark: #1db920;
-  --digi--color--logotype--secondary--text--dark: var(--digi--grayscale--0);
-  --digi--color--marking--indication--marker--dark: var(--digi--grayscale--900);
-  --digi--color--marking--indication--primary--dark: var(--digi--sentiment--success--500);
-  --digi--color--marking--indication--secondary--dark: var(--digi--grayscale--75);
-  --digi--color--marking--indication--tertiary--dark: var(--digi--grayscale--700);
-  --digi--color--marking--navigation--level-active--dark: var(--digi--granskott--250);
-  --digi--color--marking--navigation--level-inactive--dark: var(--digi--grayscale--100);
-  --digi--color--marking--navigation--selected--dark: var(--digi--granskott--700);
-  --digi--color--misc--skeleton--dark: var(--digi--grayscale--400);
-  --digi--color--misc--spinner-path--dark: var(--digi--grayscale--400);
-  --digi--color--text--description--dark: var(--digi--grayscale--100);
-  --digi--color--text--interactive--brand-primary--dark: var(--digi--grayscale--75);
-  --digi--color--text--interactive--brand-primary-secondary-hypotes--dark: var(--digi--grayscale--900);
-  --digi--color--text--interactive--brand-secondary--dark: var(--digi--norrsken--500);
-  --digi--color--text--interactive--primary--dark: var(--digi--norrsken--500);
-  --digi--color--text--interactive--primary-discreet--dark: var(--digi--grayscale--75);
-  --digi--color--text--interactive--secondary--dark: var(--digi--grayscale--900);
-  --digi--color--text--interactive--secondary-discreet--dark: var(--digi--grayscale--75);
-  --digi--color--text--interactive--tertiary--dark: var(--digi--grayscale--75);
-  --digi--color--text--interactive--visited--dark: var(--digi--amethyst--500);
-  --digi--color--text--primary--dark: var(--digi--grayscale--75);
-  --digi--color--text--primary-stay--dark: var(--digi--grayscale--850);
-  --digi--color--text--secondary--dark: var(--digi--grayscale--75);
-  --digi--color--text--secondary-stay--dark: var(--digi--grayscale--75);
-
   --digi--color--background--brand-primary--light: var(--digi--natthimmel--800);
-  --digi--color--background--dropdown--light: var(--digi--grayscale--0);
   --digi--color--background--interactive--default--input-elements--light: var(--digi--grayscale--0);
   --digi--color--background--interactive--default--pop-out--light: var(--digi--granskott--150);
   --digi--color--background--interactive--default--primary--light: var(--digi--natthimmel--800);
   --digi--color--background--interactive--default--primary-inverted--light: var(--digi--norrsken--500);
   --digi--color--background--interactive--default--quaternary--light: var(--digi--grayscale--100);
-  --digi--color--background--interactive--default--quinary-ghost-gra--light: var(--digi--grayscale--100);
   --digi--color--background--interactive--default--secondary--light: var(--digi--grayscale--0);
   --digi--color--background--interactive--default--secondary-inverted--light: var(--digi--misc--transparent);
   --digi--color--background--interactive--default--tertiary--light: var(--digi--grayscale--200);
-  --digi--color--background--interactive--hover--ghost-rider--light: var(--digi--misc--transparent);
   --digi--color--background--interactive--hover--inverted--light: var(--digi--norrsken--400);
   --digi--color--background--interactive--hover--primary--light: var(--digi--natthimmel--700);
   --digi--color--background--interactive--hover--quarternary--light: var(--digi--grayscale--200);
@@ -167,7 +39,6 @@
   --digi--color--background--interactive--hover--tertiary--light: var(--digi--sapphire--500);
   --digi--color--background--interactive--selected--on-menu-minus-button--light: var(--digi--granskott--250);
   --digi--color--background--interactive--selected--primary--light: var(--digi--sentiment--success--500);
-  --digi--color--background--interactive--selected--primary-stay--light: var(--digi--sentiment--success--500);
   --digi--color--background--interactive--selected--secondary--light: var(--digi--natthimmel--800);
   --digi--color--background--interactive--selected--tertiary--light: var(--digi--grayscale--200);
   --digi--color--background--interactive--validation--error--light: var(--digi--sentiment--error--200);
@@ -176,17 +47,14 @@
   --digi--color--background--notification--light: var(--digi--sentiment--error--500);
   --digi--color--background--pop-out--light: var(--digi--granskott--200);
   --digi--color--background--primary--light: var(--digi--grayscale--0);
-  --digi--color--background--primary-elevated--light: var(--digi--grayscale--0);
   --digi--color--background--secondary--light: var(--digi--grayscale--100);
   --digi--color--background--secondary-accent--light: var(--digi--grayscale--400);
-  --digi--color--background--secondary-elevated--light: var(--digi--grayscale--100);
   --digi--color--background--secondary-muted--light: var(--digi--grayscale--50);
   --digi--color--background--sentiment--beta--primary--light: var(--digi--rallarros--500);
   --digi--color--background--sentiment--beta--secondary--light: var(--digi--rallarros--300);
   --digi--color--background--sentiment--error--primary--light: var(--digi--sentiment--error--500);
   --digi--color--background--sentiment--error--secondary--light: var(--digi--sentiment--error--700);
   --digi--color--background--sentiment--error--tertiary--light: var(--digi--sentiment--error--200);
-  --digi--color--background--sentiment--error--tertiary-discreet--light: var(--digi--sentiment--error--200);
   --digi--color--background--sentiment--info--primary--light: var(--digi--sentiment--informative--500);
   --digi--color--background--sentiment--info--secondary--light: var(--digi--sentiment--informative--700);
   --digi--color--background--sentiment--info--tertiary--light: var(--digi--sentiment--informative--200);
@@ -200,11 +68,9 @@
   --digi--color--background--sentiment--warning--quarternary--light: var(--digi--sentiment--warning--50);
   --digi--color--background--sentiment--warning--secondary--light: var(--digi--sentiment--warning--700);
   --digi--color--background--sentiment--warning--tertiary--light: var(--digi--sentiment--warning--200);
-  --digi--color--background--surface--light: var(--digi--grayscale--0);
   --digi--color--background--transparent--light: var(--digi--misc--transparent);
   --digi--color--border--accent--primary--light: var(--digi--natthimmel--800);
   --digi--color--border--accent--secondary--light: var(--digi--granskott--700);
-  --digi--color--border--interactive--default--discreeeeeeet--light: var(--digi--grayscale--100);
   --digi--color--border--interactive--default--inverted--light: var(--digi--norrsken--500);
   --digi--color--border--interactive--default--on-input--light: var(--digi--grayscale--900);
   --digi--color--border--interactive--default--on-input-nuance--light: var(--digi--grayscale--800);
@@ -227,15 +93,11 @@
   --digi--color--divider--on-brand-primary--light: var(--digi--natthimmel--350);
   --digi--color--divider--primary--light: var(--digi--grayscale--400);
   --digi--color--divider--secondary--light: var(--digi--grayscale--200);
-  --digi--color--divider--tertiary-hypotes--light: var(--digi--grayscale--400);
   --digi--color--icon--brand-primary--light: var(--digi--natthimmel--800);
-  --digi--color--icon--brand-primary-secondary-hypotes--light: var(--digi--natthimmel--800);
   --digi--color--icon--brand-secondary--light: var(--digi--norrsken--500);
   --digi--color--icon--cta--light: var(--digi--sapphire--500);
   --digi--color--icon--primary--light: var(--digi--grayscale--900);
-  --digi--color--icon--primary-anti-reverse--light: var(--digi--grayscale--900);
   --digi--color--icon--secondary--light: var(--digi--grayscale--0);
-  --digi--color--icon--secondary-reverse--light: var(--digi--grayscale--0);
   --digi--color--icon--validation--error--light: var(--digi--sentiment--error--500);
   --digi--color--icon--validation--success--light: var(--digi--sentiment--success--500);
   --digi--color--icon--validation--warning--light: var(--digi--sentiment--warning--500);
@@ -249,7 +111,6 @@
   --digi--color--logotype--primary--text--light: var(--digi--natthimmel--800);
   --digi--color--logotype--secondary--symbol--light: #1db920;
   --digi--color--logotype--secondary--text--light: var(--digi--grayscale--0);
-  --digi--color--marking--indication--marker--light: var(--digi--grayscale--0);
   --digi--color--marking--indication--primary--light: var(--digi--sentiment--success--500);
   --digi--color--marking--indication--secondary--light: var(--digi--natthimmel--800);
   --digi--color--marking--indication--tertiary--light: var(--digi--grayscale--700);
@@ -260,16 +121,11 @@
   --digi--color--misc--spinner-path--light: var(--digi--grayscale--400);
   --digi--color--text--description--light: var(--digi--grayscale--800);
   --digi--color--text--interactive--brand-primary--light: var(--digi--natthimmel--800);
-  --digi--color--text--interactive--brand-primary-secondary-hypotes--light: var(--digi--natthimmel--800);
   --digi--color--text--interactive--brand-secondary--light: var(--digi--norrsken--500);
   --digi--color--text--interactive--primary--light: var(--digi--sapphire--500);
-  --digi--color--text--interactive--primary-discreet--light: var(--digi--sapphire--500);
   --digi--color--text--interactive--secondary--light: var(--digi--grayscale--0);
-  --digi--color--text--interactive--secondary-discreet--light: var(--digi--grayscale--0);
   --digi--color--text--interactive--tertiary--light: var(--digi--grayscale--900);
   --digi--color--text--interactive--visited--light: var(--digi--amethyst--500);
   --digi--color--text--primary--light: var(--digi--grayscale--900);
-  --digi--color--text--primary-stay--light: var(--digi--grayscale--900);
   --digi--color--text--secondary--light: var(--digi--grayscale--0);
-  --digi--color--text--secondary-stay--light: var(--digi--grayscale--0);
 }

package/dist/collection/styles/src/themes/_brand-common.mixin.scss

@@ -8,17 +8,10 @@
   --digi--grayscale--400: #dddddd;
   --digi--grayscale--50: #fbfbfb;
   --digi--grayscale--500: #cacaca;
-  --digi--grayscale--550: #c5c5c5;
   --digi--grayscale--600: #acacac;
-  --digi--grayscale--650: #9c9c9c;
   --digi--grayscale--700: #757575;
-  --digi--grayscale--75: #f5f5f5;
   --digi--grayscale--800: #5c5c5c;
-  --digi--grayscale--850: #4a4a4a;
-  --digi--grayscale--875: #3a3a3a;
   --digi--grayscale--900: #333333;
-  --digi--grayscale--950: #2c2c2c;
-  --digi--grayscale--975: #212121;
   --digi--misc--transparent: #ffffff00;
   --digi--sentiment--error--200: #fdeded;
   --digi--sentiment--error--500: #da0000;

package/dist/collection/styles/src/tokens-documentation/web-AF25.json

@@ -5,24 +5,12 @@
     "digiCSSVariable": "--digi--color--text--primary",
     "digiRecursiveValue": "#333333"
   },
-  "text--primary-stay": {
-    "name": "Text/primary-stay",
-    "description": "Togs fram för status taggar som behöver text som förbli mörk pga kontrast",
-    "digiCSSVariable": "--digi--color--text--primary-stay",
-    "digiRecursiveValue": "#333333"
-  },
   "text--secondary": {
     "name": "Text/secondary",
     "description": "Sekundär textfärg som används mot mörk eller annan färgstark bakgrund. Används ex. i digi-footer och digi-status-badge.",
     "digiCSSVariable": "--digi--color--text--secondary",
     "digiRecursiveValue": "#FFFFFF"
   },
-  "text--secondary-stay": {
-    "name": "Text/secondary-stay",
-    "description": "Sekundär textfärg som används mot mörk eller annan färgstark bakgrund. Används ex. i digi-footer och digi-status-badge. och som behöver förbli vit för att behålla sin tydlighet, tog frm detta för statustaggar",
-    "digiCSSVariable": "--digi--color--text--secondary-stay",
-    "digiRecursiveValue": "#FFFFFF"
-  },
   "text--description": {
     "name": "Text/description",
     "description": "Textfärg som används för beskrivningar, t.ex. i digi-progress-indicator.",
@@ -35,24 +23,12 @@
     "digiCSSVariable": "--digi--color--text--interactive--primary",
     "digiRecursiveValue": "#1616B2"
   },
-  "text--interactive--primary-discreet": {
-    "name": "Text/Interactive/primary-discreet",
-    "description": "Används för länkade rubriker som ska tonas ner i dark mode.",
-    "digiCSSVariable": "--digi--color--text--interactive--primary-discreet",
-    "digiRecursiveValue": "#1616B2"
-  },
   "text--interactive--secondary": {
     "name": "Text/Interactive/secondary",
     "description": "Används på interaktiva textelement mot mörk eller färgstark bakgrund, som primärknappar och länkknappar.",
     "digiCSSVariable": "--digi--color--text--interactive--secondary",
     "digiRecursiveValue": "#FFFFFF"
   },
-  "text--interactive--secondary-discreet": {
-    "name": "Text/Interactive/secondary-discreet",
-    "description": "tog fram för paginering i dark mode",
-    "digiCSSVariable": "--digi--color--text--interactive--secondary-discreet",
-    "digiRecursiveValue": "#FFFFFF"
-  },
   "text--interactive--tertiary": {
     "name": "Text/Interactive/tertiary",
     "description": "Används på klickbara textelement som har ljus bakgrund och behöver se mer subtila ut än vanlig länkfärg, t.ex. menyval, flikar och utfällbar rubrik.",
@@ -77,36 +53,18 @@
     "digiCSSVariable": "--digi--color--text--interactive--visited",
     "digiRecursiveValue": "#822998"
   },
-  "background--surface": {
-    "name": "Background/surface",
-    "description": "ska sättas på <body> och grundframen",
-    "digiCSSVariable": "--digi--color--background--surface",
-    "digiRecursiveValue": "#FFFFFF"
-  },
   "background--primary": {
     "name": "Background/primary",
     "description": "Neutral färg som används som en primär bakgrundsfärg.",
     "digiCSSVariable": "--digi--color--background--primary",
     "digiRecursiveValue": "#FFFFFF"
   },
-  "background--primary-elevated": {
-    "name": "Background/primary-elevated",
-    "description": "Neutral färg som används som en primär bakgrundsfärg.",
-    "digiCSSVariable": "--digi--color--background--primary-elevated",
-    "digiRecursiveValue": "#FFFFFF"
-  },
   "background--secondary": {
     "name": "Background/secondary",
     "description": "Alternativ neutral bakgrundsfärg för att bryta av mot background/primary.",
     "digiCSSVariable": "--digi--color--background--secondary",
     "digiRecursiveValue": "#F4F4F4"
   },
-  "background--secondary-elevated": {
-    "name": "Background/secondary-elevated",
-    "description": "Alternativ neutral bakgrundsfärg för att bryta av mot background/primary.",
-    "digiCSSVariable": "--digi--color--background--secondary-elevated",
-    "digiRecursiveValue": "#F4F4F4"
-  },
   "background--secondary-accent": {
     "name": "Background/secondary-accent",
     "description": "Används som bakgrundsfärg för att gruppera och framhäva klickbara element i en dropdown, tex i wrappern runtom knapparna i form-filter.",
@@ -169,7 +127,7 @@
   },
   "background--interactive--default--tertiary": {
     "name": "Background/Interactive/default/tertiary",
-    "description": "Används för att synliggöra klickbara element som befinner sig på ett annat vitt element. Används i vertikal-navigation, för header shortcuts och knapparna i flikar",
+    "description": "Används för att synliggöra klickbara element som befinner sig på ett annat vitt element.",
     "digiCSSVariable": "--digi--color--background--interactive--default--tertiary",
     "digiRecursiveValue": "#EDEDED"
   },
@@ -529,19 +487,19 @@
   },
   "divider--primary": {
     "name": "Divider/primary",
-    "description": "Primär färg för divider. ska användas på våra bakgrunder (block), relevant för sidhuvud och progresslist",
+    "description": "Primär färg för divider.",
     "digiCSSVariable": "--digi--color--divider--primary",
     "digiRecursiveValue": "#DDDDDD"
   },
   "divider--secondary": {
     "name": "Divider/secondary",
-    "description": "Sekundär färg för divider som är subtilare än primär. Används i kontexten för navigation, för att skilja en navigation möjlighet från annat innehåll",
+    "description": "Sekundär färg för divider som är subtilare än primär. Används i navigeringskomponenter såsom Menyval, Sidhuvud och Flikfält.",
     "digiCSSVariable": "--digi--color--divider--secondary",
     "digiRecursiveValue": "#EDEDED"
   },
   "divider--on-brand-primary": {
     "name": "Divider/on-brand-primary",
-    "description": "Används på dividers som ligger på bakgrunder som har den primära varumärkesfärgen. Används i footer.",
+    "description": "Används på dividers som ligger på bakgrunder som har den primära varumärkesfärgen. Används i Sidfot.",
     "digiCSSVariable": "--digi--color--divider--on-brand-primary",
     "digiRecursiveValue": "#ABDEF7"
   },
@@ -808,119 +766,5 @@
     "description": "",
     "digiCSSVariable": "--digi--sentiment--warning--900",
     "digiRecursiveValue": "#664D00"
-  },
-  "background--interactive--selected--primary-stay": {
-    "name": "Background/Interactive/selected/primary-stay",
-    "description": "Selected-utseende för kalendern. Används för när en komponent ska behålla sin selected färg oberoende av mode",
-    "digiCSSVariable": "--digi--color--background--interactive--selected--primary-stay",
-    "digiRecursiveValue": "#008A20"
-  },
-  "background--sentiment--error--tertiary-discreet": {
-    "name": "Background/Sentiment/error/tertiary-discreet",
-    "description": "Ljusare error/denied-bakgrundsfärg förloppsstegare.",
-    "digiCSSVariable": "--digi--color--background--sentiment--error--tertiary-discreet",
-    "digiRecursiveValue": "#FDEDED"
-  },
-  "marking--indication--marker": {
-    "name": "Marking/Indication/marker",
-    "description": "Användas för markeringen som är på dem andra indication färgerna",
-    "digiCSSVariable": "--digi--color--marking--indication--marker",
-    "digiRecursiveValue": "#FFFFFF"
-  },
-  "icon--secondary-reverse": {
-    "name": "Icon/secondary-reverse",
-    "description": "Används när en ikon ligger på mörk bakgrund, t.ex. i Footer eller Mediatagg.",
-    "digiCSSVariable": "--digi--color--icon--secondary-reverse",
-    "digiRecursiveValue": "#FFFFFF"
-  },
-  "background--dropdown": {
-    "name": "Background/dropdown",
-    "description": "För dropdowns",
-    "digiCSSVariable": "--digi--color--background--dropdown",
-    "digiRecursiveValue": "#FFFFFF"
-  },
-  "text--interactive--brand-primary-secondary-hypotes": {
-    "name": "Text/Interactive/brand-primary-secondary (Hypotes)",
-    "description": "Används för klickbara textelement där man vill förstärka varumärket, såsom i sekundära länkknappar och knappar samt taggar. Hypotes: fulllösning för att få monochromt att fungera ",
-    "digiCSSVariable": "--digi--color--text--interactive--brand-primary-secondary-hypotes",
-    "digiRecursiveValue": "#091D54"
-  },
-  "background--interactive--default--quinary-ghost-gra": {
-    "name": "Background/Interactive/default/quinary (Ghost grå)",
-    "description": "Används i knappar i filuppladdare och kategorifilter. skapad för utforskande syfte, i kontexten av våra gråa knappar, --- Denna besrkivning behöver förtydligas",
-    "digiCSSVariable": "--digi--color--background--interactive--default--quinary-ghost-gra",
-    "digiRecursiveValue": "#F4F4F4"
-  },
-  "background--interactive--hover--ghost-rider": {
-    "name": "Background/Interactive/hover/ghost rider",
-    "description": "",
-    "digiCSSVariable": "--digi--color--background--interactive--hover--ghost-rider",
-    "digiRecursiveValue": "#FFFFFF"
-  },
-  "border--interactive--default--discreeeeeeet": {
-    "name": "Border/Interactive/default/Discreeeeeeet",
-    "description": "används för default kategori filter, perhaps relevant för fileupload ",
-    "digiCSSVariable": "--digi--color--border--interactive--default--discreeeeeeet",
-    "digiRecursiveValue": "#F4F4F4"
-  },
-  "divider--tertiary-hypotes": {
-    "name": "Divider/tertiary (hypotes)",
-    "description": "Tertiär färg för divider. Hypotes: Skulle vara relevant för divider som befinner sig i dropdowns och filuppladdare",
-    "digiCSSVariable": "--digi--color--divider--tertiary-hypotes",
-    "digiRecursiveValue": "#DDDDDD"
-  },
-  "icon--primary-anti-reverse": {
-    "name": "Icon/primary-anti-reverse",
-    "description": "Förstahandsval för ikoner som ligger på ljus bakgrund.",
-    "digiCSSVariable": "--digi--color--icon--primary-anti-reverse",
-    "digiRecursiveValue": "#333333"
-  },
-  "icon--brand-primary-secondary-hypotes": {
-    "name": "Icon/brand-primary-secondary (hypotes)",
-    "description": "Används på ljusa bakgrunder där man vill få in varumärkets färg, t.ex. länkknappar. Hypotes: fulllösning för att få monochromt att fungera ",
-    "digiCSSVariable": "--digi--color--icon--brand-primary-secondary-hypotes",
-    "digiRecursiveValue": "#091D54"
-  },
-  "grayscale--75": {
-    "name": "Grayscale/75",
-    "description": "",
-    "digiCSSVariable": "--digi--grayscale--75",
-    "digiRecursiveValue": "#F5F5F5"
-  },
-  "grayscale--550": {
-    "name": "Grayscale/550",
-    "description": "",
-    "digiCSSVariable": "--digi--grayscale--550",
-    "digiRecursiveValue": "#C5C5C5"
-  },
-  "grayscale--650": {
-    "name": "Grayscale/650",
-    "description": "",
-    "digiCSSVariable": "--digi--grayscale--650",
-    "digiRecursiveValue": "#9C9C9C"
-  },
-  "grayscale--850": {
-    "name": "Grayscale/850",
-    "description": "Textcolor 5C5C5C",
-    "digiCSSVariable": "--digi--grayscale--850",
-    "digiRecursiveValue": "#4A4A4A"
-  },
-  "grayscale--875": {
-    "name": "Grayscale/875",
-    "description": "Textcolor 5C5C5C",
-    "digiCSSVariable": "--digi--grayscale--875",
-    "digiRecursiveValue": "#3A3A3A"
-  },
-  "grayscale--950": {
-    "name": "Grayscale/950",
-    "description": "Primary text color",
-    "digiCSSVariable": "--digi--grayscale--950",
-    "digiRecursiveValue": "#2C2C2C"
-  },
-  "grayscale--975": {
-    "name": "Grayscale/975",
-    "description": "Primary text color",
-    "digiCSSVariable": "--digi--grayscale--975",
-    "digiRecursiveValue": "#212121"
   }
 }

package/dist/digi-arbetsformedlingen/design-tokens/components/_button.variables.scss

@@ -10,9 +10,9 @@
   --digi--button--color--background--secondary--active: var(--digi--color--background--interactive--hover--secondary);
 
   --digi--button--color--background--function--default: transparent;
-  --digi--button--color--background--function--hover: var(--digi--color--background--interactive--hover--ghost-rider);
-  --digi--button--color--background--function--focus: var(--digi--color--background--interactive--hover--ghost-rider);
-  --digi--button--color--background--function--active: var(--digi--color--background--interactive--hover--ghost-rider);
+  --digi--button--color--background--function--hover: transparent;
+  --digi--button--color--background--function--focus: transparent;
+  --digi--button--color--background--function--active: transparent;
 
   --digi--button--color--text--primary--default: var(--digi--color--text--interactive--secondary);
   --digi--button--color--text--primary--hover: var(--digi--color--text--interactive--secondary);
@@ -29,10 +29,10 @@
   --digi--button--color--text--function--focus: var(--digi--color--text--interactive--primary);
   --digi--button--color--text--function--active: var(--digi--color--text--interactive--primary);
 
-  --digi--button--color--border--primary--default: var(--digi--color--border--interactive--default--primary);
-  --digi--button--color--border--primary--hover: var(--digi--color--border--interactive--hover--primary);
-  --digi--button--color--border--primary--focus: var(--digi--color--border--interactive--default--primary);
-  --digi--button--color--border--primary--active: var(--digi--color--border--interactive--default--primary);
+  --digi--button--color--border--primary--default: var(--digi--color--background--interactive--default--primary);
+  --digi--button--color--border--primary--hover: var(--digi--color--background--interactive--hover--primary);
+  --digi--button--color--border--primary--focus: var(--digi--color--background--interactive--default--primary);
+  --digi--button--color--border--primary--active: var(--digi--color--background--interactive--default--primary);
 
   --digi--button--color--border--secondary--default: var(--digi--color--border--interactive--default--primary);
   --digi--button--color--border--secondary--hover: var(--digi--color--border--interactive--hover--secondary);
@@ -44,10 +44,10 @@
   --digi--button--color--border--function--focus: initial;
   --digi--button--color--border--function--active: initial;
 
-  --digi--button--color--icon--primary--default: var(--digi--color--icon--secondary-reverse);
-  --digi--button--color--icon--primary--hover: var(--digi--color--icon--secondary-reverse);
-  --digi--button--color--icon--primary--focus: var(--digi--color--icon--secondary-reverse);
-  --digi--button--color--icon--primary--active: var(--digi--color--icon--secondary-reverse);
+  --digi--button--color--icon--primary--default: var(--digi--color--icon--secondary);
+  --digi--button--color--icon--primary--hover: var(--digi--color--icon--secondary);
+  --digi--button--color--icon--primary--focus: var(--digi--color--icon--secondary);
+  --digi--button--color--icon--primary--active: var(--digi--color--icon--secondary);
 
   --digi--button--color--icon--secondary--default: var(--digi--color--icon--brand-primary);
   --digi--button--color--icon--secondary--hover: var(--digi--color--icon--brand-primary);
@@ -86,9 +86,9 @@
   --digi--button--border-radius--secondary--focus: var(--digi--border-radius--secondary);
   --digi--button--border-radius--secondary--active: var(--digi--border-radius--secondary);
   --digi--button--border-radius--function--default: initial;
-  --digi--button--border-radius--function--hover: var(--digi--border-radius--secondary);
-  --digi--button--border-radius--function--focus: var(--digi--border-radius--secondary);
-  --digi--button--border-radius--function--active: var(--digi--border-radius--secondary);
+  --digi--button--border-radius--function--hover: initial;
+  --digi--button--border-radius--function--focus: initial;
+  --digi--button--border-radius--function--active: initial;
 
   --digi--button--padding--small: var(--digi--gutter--button-block-small) var(--digi--gutter--button-inline-small);
   --digi--button--padding--medium: var(--digi--gutter--button-block-medium) var(--digi--gutter--button-inline-medium);

package/dist/digi-arbetsformedlingen/design-tokens/components/_calendar-datepicker.variables.scss

@@ -6,7 +6,7 @@
   --digi--datepicker--calendar--max-width: #{rem(324)};
   --digi--datepicker--calendar--show-week--max-width: #{rem(374)};
   --digi--datepicker--calendar-shadow: 0 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.7);
-  --digi--datepicker--calendar--background-color: var(--digi--color--background--dropdown);
+  --digi--datepicker--calendar--background-color: var(--digi--color--background--interactive--default--secondary);
   --digi--datepicker--input-icon--width: #{rem(14)};
   --digi--datepicker--input-icon--horizontal-padding: #{rem(12)};
   --digi--datepicker--input-icon--vertical-padding: var(--digi--global--spacing--smallest-2);

package/dist/digi-arbetsformedlingen/design-tokens/components/_calendar.variables.scss

@@ -3,7 +3,6 @@
 
   --digi--calendar--header--font-family: var(--digi--global--typography--font-family--default);
   --digi--calendar--header--font-weight: var(--digi--global--typography--font-weight--semibold);
-  --digi--calendar--header--font-color: var(--digi--color--text--primary);
   --digi--calendar--header--display: flex;
   --digi--calendar--header--align-items: center;
   --digi--calendar--header--justify-content: space-between;
@@ -33,11 +32,11 @@
   --digi--calendar--date--today--circle-border: 2px solid var(--digi--color--marking--indication--secondary);
   --digi--calendar--date--today--circle-margin: 10%;
 
-  --digi--calendar--date--selected--color: var(--digi--color--text--interactive--secondary-discreet);
-  --digi--calendar--date--selected--background-color: var(--digi--color--background--interactive--selected--primary-stay);
+  --digi--calendar--date--selected--color: var(--digi--color--text--interactive--secondary);
+  --digi--calendar--date--selected--background-color: var(--digi--color--background--interactive--selected--primary);
   --digi--calendar--date--not-selectable-strike--color: var(--digi--color--marking--indication--tertiary);
   --digi--calendar--week--font-style: italic;
   --digi--calendar--week--font-size: var(--digi--global--typography--font-size--small);
-  --digi--calendar--week--border-color: var(--digi--color--divider--tertiary-hypotes);
+  --digi--calendar--week--border-color: var(--digi--color--divider--primary);
   --digi--calendar--week--border-width: var(--digi--border-width--primary);
 }

package/dist/digi-arbetsformedlingen/design-tokens/components/_dialog.variables.scss

@@ -29,7 +29,7 @@
 	--digi--dialog--content--width--large: 56.25rem;
 
 	--digi--dialog--content--color--primary: var(--digi--color--text--primary);
-	--digi--dialog--content--color--background--primary: var(--digi--color--background--primary-elevated);
+	--digi--dialog--content--color--background--primary: var(--digi--color--background--primary);
 
 	--digi--dialog--icon--color--primary: var(--digi--color--icon--primary);
 	--digi--dialog--icon--color--primary--hover: var(--digi--color--icon--primary);

package/dist/digi-arbetsformedlingen/design-tokens/components/_expandable-faq-item.variables.scss

@@ -1,7 +1,7 @@
 @mixin digi-expandable-faq-item--variables() {
   --digi--expandable-faq-item--header--background-color--primary: var(--digi--color--background--pop-out);
-  --digi--expandable-faq-item--header--background-color--secondary: var(--digi--color--background--secondary-elevated);
-  --digi--expandable-faq-item--header--background-color--tertiary: var(--digi--color--background--primary-elevated);
+  --digi--expandable-faq-item--header--background-color--secondary: var(--digi--color--background--secondary);
+  --digi--expandable-faq-item--header--background-color--tertiary: var(--digi--color--background--primary);
   --digi--expandable-faq-item--header--toggle-icon--transition: ease-in-out var(--digi--animation--duration--base) all;
   --digi--expandable-faq-item--content--transition: ease-in-out var(--digi--animation--duration--base) height;
 

package/dist/digi-arbetsformedlingen/design-tokens/components/_form-checkbox.variables.scss

@@ -8,7 +8,7 @@
   --digi--form-checkbox--box-shadow--error: var(--digi--color--border--interactive--validation--error);
   --digi--form-checkbox--box-shadow--warning: var(--digi--color--border--interactive--validation--warning);
 
-  --digi--form-checkbox--background-color: var(--digi--color--background--interactive--default--input-elements);
+  --digi--form-checkbox--background-color: var(--digi--color--background--primary);
   --digi--form-checkbox--background-color--primary: var(--digi--color--background--interactive--selected--primary);
   --digi--form-checkbox--background-color--secondary: var(--digi--color--background--interactive--selected--secondary);
   --digi--form-checkbox--background-color--error: var(--digi--color--background--interactive--validation--error);

package/dist/digi-arbetsformedlingen/design-tokens/components/_form-file-upload.variables.scss

@@ -6,8 +6,6 @@
   --digi--form-file-upload--color--background--large--default: var(--digi--color--background--interactive--default--quaternary);
   --digi--form-file-upload--color--background--large--hover: var(--digi--color--background--interactive--hover--secondary);
 
-  --digi--form-file-upload--color--background--uploaded-files: var(--digi--color--background--secondary-elevated);
-
   --digi--form-file-upload--color--border--small--default: var(--digi--color--border--interactive--default--on-input-nuance);
   --digi--form-file-upload--color--border--small--hover: var(--digi--color--border--interactive--hover--primary);
   --digi--form-file-upload--color--border--medium--default: var(--digi--color--border--interactive--default--on-input-nuance);

package/dist/digi-arbetsformedlingen/design-tokens/components/_form-filter.variables.scss

@@ -4,7 +4,7 @@
   --digi--form-filter--scroll--max-height--large: 23.4275rem;
   --digi--form-filter--scroll--padding: var(--digi--padding--small);
   --digi--form-filter--reset-button--margin-left: var(--digi--padding--small);
-  --digi--form-filter--legend__border-bottom: var(--digi--border-width--primary) solid var(--digi--color--divider--tertiary-hypotes);
+  --digi--form-filter--legend__border-bottom: var(--digi--border-width--primary) solid var(--digi--color--divider--primary);
   --digi--form-filter--list--margin: 0;
   --digi--form-filter--list--padding: var(--digi--gutter--small) 0 0 0;
   --digi--form-filter--item--margin: var(--digi--gutter--small) 0;
@@ -12,7 +12,7 @@
 
   --digi--form-filter--dropdown--box-shadow: 0 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.7);
   --digi--form-filter--dropdown--border-radius: var(--digi--border--radius--primary);
-  --digi--form-filter--dropdown--background: var(--digi--color--background--dropdown);
+  --digi--form-filter--dropdown--background: var(--digi--color--background--primary);
   --digi--form-filter--dropdown--min-width: 18.75rem;
   --digi--form-filter--dropdown--margin-top: var(--digi--gutter--small);
   --digi--form-filter--dropdown--z-index: 999;