@designsystem-se/af 37.0.2-beta.0 → 37.0.2-beta.1

package/dist/cjs/{typography-variation.enum-e41bd69d.js → typography-variation.enum-d87d726d.js}

@@ -68,6 +68,13 @@ exports.ExpandableFaqItemVariation = void 0;
     ExpandableFaqItemVariation["TERTIARY"] = "tertiary";
 })(exports.ExpandableFaqItemVariation || (exports.ExpandableFaqItemVariation = {}));
 
+exports.FooterCardVariation = void 0;
+(function (FooterCardVariation) {
+    FooterCardVariation["NONE"] = "none";
+    FooterCardVariation["ICON"] = "icon";
+    FooterCardVariation["BORDER"] = "border";
+})(exports.FooterCardVariation || (exports.FooterCardVariation = {}));
+
 exports.FooterVariation = void 0;
 (function (FooterVariation) {
     FooterVariation["LARGE"] = "large";
@@ -102,6 +109,29 @@ exports.FormErrorListHeadingLevel = void 0;
     FormErrorListHeadingLevel["H6"] = "h6";
 })(exports.FormErrorListHeadingLevel || (exports.FormErrorListHeadingLevel = {}));
 
+exports.FormFileUploadHeadingLevel = void 0;
+(function (FormFileUploadHeadingLevel) {
+    FormFileUploadHeadingLevel["H1"] = "h1";
+    FormFileUploadHeadingLevel["H2"] = "h2";
+    FormFileUploadHeadingLevel["H3"] = "h3";
+    FormFileUploadHeadingLevel["H4"] = "h4";
+    FormFileUploadHeadingLevel["H5"] = "h5";
+    FormFileUploadHeadingLevel["H6"] = "h6";
+})(exports.FormFileUploadHeadingLevel || (exports.FormFileUploadHeadingLevel = {}));
+
+exports.FormFileUploadValidation = void 0;
+(function (FormFileUploadValidation) {
+    FormFileUploadValidation["ENABLED"] = "enabled";
+    FormFileUploadValidation["DISABLED"] = "disabled";
+})(exports.FormFileUploadValidation || (exports.FormFileUploadValidation = {}));
+
+exports.FormFileUploadVariation = void 0;
+(function (FormFileUploadVariation) {
+    FormFileUploadVariation["SMALL"] = "small";
+    FormFileUploadVariation["MEDIUM"] = "medium";
+    FormFileUploadVariation["LARGE"] = "large";
+})(exports.FormFileUploadVariation || (exports.FormFileUploadVariation = {}));
+
 exports.FormInputMode = void 0;
 (function (FormInputMode) {
     FormInputMode["DEFAULT"] = "";
@@ -155,14 +185,6 @@ exports.FormRadiobuttonVariation = void 0;
     FormRadiobuttonVariation["SECONDARY"] = "secondary";
 })(exports.FormRadiobuttonVariation || (exports.FormRadiobuttonVariation = {}));
 
-exports.FormRadiogroupValidation = void 0;
-(function (FormRadiogroupValidation) {
-    FormRadiogroupValidation["SUCCESS"] = "success";
-    FormRadiogroupValidation["ERROR"] = "error";
-    FormRadiogroupValidation["WARNING"] = "warning";
-    FormRadiogroupValidation["NEUTRAL"] = "neutral";
-})(exports.FormRadiogroupValidation || (exports.FormRadiogroupValidation = {}));
-
 exports.FormReceiptHeadingLevel = void 0;
 (function (FormReceiptHeadingLevel) {
     FormReceiptHeadingLevel["H1"] = "h1";
@@ -208,6 +230,13 @@ exports.FormSelectVariation = void 0;
     FormSelectVariation["LARGE"] = "large";
 })(exports.FormSelectVariation || (exports.FormSelectVariation = {}));
 
+exports.FormValidationMessageVariation = void 0;
+(function (FormValidationMessageVariation) {
+    FormValidationMessageVariation["SUCCESS"] = "success";
+    FormValidationMessageVariation["ERROR"] = "error";
+    FormValidationMessageVariation["WARNING"] = "warning";
+})(exports.FormValidationMessageVariation || (exports.FormValidationMessageVariation = {}));
+
 exports.HeaderCenterContentWidth = void 0;
 (function (HeaderCenterContentWidth) {
     HeaderCenterContentWidth["DEFAULT"] = "none";
@@ -242,12 +271,25 @@ exports.InfoCardMultiHeadingLevel = void 0;
     InfoCardMultiHeadingLevel["H6"] = "h6";
 })(exports.InfoCardMultiHeadingLevel || (exports.InfoCardMultiHeadingLevel = {}));
 
+exports.InfoCardMultiType = void 0;
+(function (InfoCardMultiType) {
+    InfoCardMultiType["MEDIA"] = "media";
+    InfoCardMultiType["RELATED"] = "related";
+    InfoCardMultiType["ENTRY"] = "entry";
+})(exports.InfoCardMultiType || (exports.InfoCardMultiType = {}));
+
 exports.InfoCardMultiVariation = void 0;
 (function (InfoCardMultiVariation) {
     InfoCardMultiVariation["PRIMARY"] = "primary";
     InfoCardMultiVariation["SECONDARY"] = "secondary";
 })(exports.InfoCardMultiVariation || (exports.InfoCardMultiVariation = {}));
 
+exports.InfoCardBorderPosition = void 0;
+(function (InfoCardBorderPosition) {
+    InfoCardBorderPosition["TOP"] = "top";
+    InfoCardBorderPosition["LEFT"] = "left";
+})(exports.InfoCardBorderPosition || (exports.InfoCardBorderPosition = {}));
+
 exports.InfoCardHeadingLevel = void 0;
 (function (InfoCardHeadingLevel) {
     InfoCardHeadingLevel["H1"] = "h1";
@@ -258,6 +300,23 @@ exports.InfoCardHeadingLevel = void 0;
     InfoCardHeadingLevel["H6"] = "h6";
 })(exports.InfoCardHeadingLevel || (exports.InfoCardHeadingLevel = {}));
 
+exports.InfoCardSize = void 0;
+(function (InfoCardSize) {
+    InfoCardSize["STANDARD"] = "standard";
+})(exports.InfoCardSize || (exports.InfoCardSize = {}));
+
+exports.InfoCardType = void 0;
+(function (InfoCardType) {
+    InfoCardType["TIP"] = "tip";
+    InfoCardType["RELATED"] = "related";
+})(exports.InfoCardType || (exports.InfoCardType = {}));
+
+exports.InfoCardVariation = void 0;
+(function (InfoCardVariation) {
+    InfoCardVariation["PRIMARY"] = "primary";
+    InfoCardVariation["SECONDARY"] = "secondary";
+})(exports.InfoCardVariation || (exports.InfoCardVariation = {}));
+
 exports.LayoutBlockContainer = void 0;
 (function (LayoutBlockContainer) {
     LayoutBlockContainer["STATIC"] = "static";
@@ -265,6 +324,28 @@ exports.LayoutBlockContainer = void 0;
     LayoutBlockContainer["NONE"] = "none";
 })(exports.LayoutBlockContainer || (exports.LayoutBlockContainer = {}));
 
+exports.LayoutColumnsGap = void 0;
+(function (LayoutColumnsGap) {
+    LayoutColumnsGap["DEFAULT"] = "default";
+    LayoutColumnsGap["GAP_32"] = "32";
+})(exports.LayoutColumnsGap || (exports.LayoutColumnsGap = {}));
+
+exports.LayoutColumnsElement = void 0;
+(function (LayoutColumnsElement) {
+    LayoutColumnsElement["DIV"] = "div";
+    LayoutColumnsElement["UL"] = "ul";
+    LayoutColumnsElement["OL"] = "ol";
+})(exports.LayoutColumnsElement || (exports.LayoutColumnsElement = {}));
+
+exports.LayoutColumnsVariation = void 0;
+(function (LayoutColumnsVariation) {
+    LayoutColumnsVariation["FOUR"] = "four";
+    LayoutColumnsVariation["THREE"] = "three";
+    LayoutColumnsVariation["TWO"] = "two";
+    LayoutColumnsVariation["ONE"] = "one";
+    LayoutColumnsVariation["NONE"] = "none";
+})(exports.LayoutColumnsVariation || (exports.LayoutColumnsVariation = {}));
+
 exports.LayoutContainerVariation = void 0;
 (function (LayoutContainerVariation) {
     LayoutContainerVariation["STATIC"] = "static";
@@ -278,6 +359,26 @@ exports.LayoutContainerMaxWidth = void 0;
     LayoutContainerMaxWidth["WIDTH_1400"] = "1400";
 })(exports.LayoutContainerMaxWidth || (exports.LayoutContainerMaxWidth = {}));
 
+exports.LinkButtonVariation = void 0;
+(function (LinkButtonVariation) {
+    LinkButtonVariation["PRIMARY"] = "primary";
+    LinkButtonVariation["SECONDARY"] = "secondary";
+    LinkButtonVariation["PRIMARY_ALT"] = "primary-alt";
+    LinkButtonVariation["SECONDARY_ALT"] = "secondary-alt";
+})(exports.LinkButtonVariation || (exports.LinkButtonVariation = {}));
+
+exports.LogoColor = void 0;
+(function (LogoColor) {
+    LogoColor["PRIMARY"] = "primary";
+    LogoColor["SECONDARY"] = "secondary";
+})(exports.LogoColor || (exports.LogoColor = {}));
+
+exports.LogoVariation = void 0;
+(function (LogoVariation) {
+    LogoVariation["SMALL"] = "small";
+    LogoVariation["LARGE"] = "large";
+})(exports.LogoVariation || (exports.LogoVariation = {}));
+
 exports.NavigationVerticalMenuActiveIndicatorSize = void 0;
 (function (NavigationVerticalMenuActiveIndicatorSize) {
     NavigationVerticalMenuActiveIndicatorSize["PRIMARY"] = "primary";
@@ -339,6 +440,16 @@ exports.ProgressIndicatorVariation = void 0;
     ProgressIndicatorVariation["SECONDARY"] = "secondary";
 })(exports.ProgressIndicatorVariation || (exports.ProgressIndicatorVariation = {}));
 
+exports.TagMediaIcon = void 0;
+(function (TagMediaIcon) {
+    TagMediaIcon["NEWS"] = "news";
+    TagMediaIcon["PLAYLIST"] = "playlist";
+    TagMediaIcon["PODCAST"] = "podcast";
+    TagMediaIcon["FILM"] = "film";
+    TagMediaIcon["WEBTV"] = "webtv";
+    TagMediaIcon["WEBINAR"] = "webinar";
+})(exports.TagMediaIcon || (exports.TagMediaIcon = {}));
+
 exports.ToolsFeedbackHeadingLevel = void 0;
 (function (ToolsFeedbackHeadingLevel) {
     ToolsFeedbackHeadingLevel["H1"] = "h1";

package/dist/collection/components/_button/button/button.css

@@ -27,10 +27,10 @@ License: none (public domain)
   --digi--button--color--text--function--hover: var(--digi--color--text--interactive--primary);
   --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--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--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--secondary--default: var(--digi--color--border--interactive--default--primary);
   --digi--button--color--border--secondary--hover: var(--digi--color--border--interactive--hover--secondary);
   --digi--button--color--border--secondary--focus: var(--digi--color--border--interactive--default--primary);

package/dist/collection/components/_calendar/calendar-datepicker/calendar-datepicker.css

@@ -19,8 +19,8 @@ License: none (public domain)
   --digi--grayscale--850: #515151;
   --digi--grayscale--875: #414141;
   --digi--grayscale--900: #333333;
-  --digi--grayscale--950: #212121;
-  --digi--grayscale--975: #2c2c2c;
+  --digi--grayscale--950: #2c2c2c;
+  --digi--grayscale--975: #212121;
   --digi--grayscale--1000: #000000;
   --digi--sentiment--informative--200: #e9e9ff;
   --digi--sentiment--informative--500: #0A4DD1;
@@ -380,7 +380,7 @@ License: none (public domain)
   --digi--rallarros--500: #ce1cbd;
   --digi--sapphire--500: #1616b2;
   --digi--color--logotype-color--dark: var(--digi--granskott--700);
-  --digi--color--infographic--lineart--dark: var(--digi--grayscale--900);
+  --digi--color--infographic--lineart--dark: var(--digi--grayscale--75);
   --digi--color--infographic--background--dark: var(--digi--grayscale--0);
   --digi--color--infographic--brand--primary--dark: var(--digi--granskott--700);
   --digi--color--infographic--brand--secondary--dark: var(--digi--granskott--250);
@@ -397,9 +397,10 @@ License: none (public domain)
   --digi--color--text--interactive--brand-primary--dark: var(--digi--natthimmel--75);
   --digi--color--text--interactive--brand-secondary--dark: var(--digi--norrsken--500);
   --digi--color--text--interactive--visited--dark: #CB6DE3;
-  --digi--color--background--primary--dark: var(--digi--grayscale--975);
+  --digi--color--background--surface--dark: var(--digi--grayscale--900);
+  --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--950);
+  --digi--color--background--secondary--dark: var(--digi--grayscale--975);
   --digi--color--background--secondary-elevated--dark: var(--digi--grayscale--875);
   --digi--color--background--secondary-muted--dark: var(--digi--grayscale--900);
   --digi--color--background--secondary-accent--dark: var(--digi--grayscale--850);
@@ -407,6 +408,7 @@ License: none (public domain)
   --digi--color--background--brand-primary--dark: var(--digi--grayscale--900);
   --digi--color--background--transparent--dark: var(--digi--misc--transparent);
   --digi--color--background--notification--dark: var(--digi--sentiment--error--500);
+  --digi--color--background--dropdown--dark: var(--digi--grayscale--800);
   --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--secondary--dark: var(--digi--misc--transparent);
@@ -458,7 +460,7 @@ License: none (public domain)
   --digi--color--border--interactive--hover--secondary--dark: var(--digi--grayscale--75);
   --digi--color--border--interactive--hover--inverted--dark: var(--digi--norrsken--400);
   --digi--color--border--interactive--validation--success--dark: var(--digi--sentiment--success--500);
-  --digi--color--border--interactive--validation--warning--dark: var(--digi--sentiment--warning--900);
+  --digi--color--border--interactive--validation--warning--dark: var(--digi--sentiment--warning--700);
   --digi--color--border--interactive--validation--error--dark: var(--digi--sentiment--error--500);
   --digi--color--border--interactive--selected--primary--dark: var(--digi--grayscale--75);
   --digi--color--border--interactive--selected--secondary--dark: var(--digi--grayscale--75);
@@ -504,6 +506,7 @@ License: none (public domain)
   --digi--color--text--interactive--brand-primary--light: var(--digi--natthimmel--800);
   --digi--color--text--interactive--brand-secondary--light: var(--digi--norrsken--500);
   --digi--color--text--interactive--visited--light: var(--digi--amethyst--500);
+  --digi--color--background--surface--light: var(--digi--grayscale--0);
   --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);
@@ -514,6 +517,7 @@ License: none (public domain)
   --digi--color--background--brand-primary--light: var(--digi--natthimmel--800);
   --digi--color--background--transparent--light: var(--digi--misc--transparent);
   --digi--color--background--notification--light: var(--digi--sentiment--error--500);
+  --digi--color--background--dropdown--light: var(--digi--grayscale--0);
   --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--secondary--light: var(--digi--grayscale--0);
@@ -762,6 +766,7 @@ License: none (public domain)
     --digi--color--text--interactive--brand-primary: var(--digi--color--text--interactive--brand-primary--light);
     --digi--color--text--interactive--brand-secondary: var(--digi--color--text--interactive--brand-secondary--light);
     --digi--color--text--interactive--visited: var(--digi--color--text--interactive--visited--light);
+    --digi--color--background--surface: var(--digi--color--background--surface--light);
     --digi--color--background--primary: var(--digi--color--background--primary--light);
     --digi--color--background--primary-elevated: var(--digi--color--background--primary-elevated--light);
     --digi--color--background--secondary: var(--digi--color--background--secondary--light);
@@ -772,6 +777,7 @@ License: none (public domain)
     --digi--color--background--brand-primary: var(--digi--color--background--brand-primary--light);
     --digi--color--background--transparent: var(--digi--color--background--transparent--light);
     --digi--color--background--notification: var(--digi--color--background--notification--light);
+    --digi--color--background--dropdown: var(--digi--color--background--dropdown--light);
     --digi--color--background--interactive--default--primary: var(--digi--color--background--interactive--default--primary--light);
     --digi--color--background--interactive--default--primary-inverted: var(--digi--color--background--interactive--default--primary-inverted--light);
     --digi--color--background--interactive--default--secondary: var(--digi--color--background--interactive--default--secondary--light);
@@ -874,6 +880,7 @@ License: none (public domain)
     --digi--color--text--interactive--brand-primary: var(--digi--color--text--interactive--brand-primary--dark);
     --digi--color--text--interactive--brand-secondary: var(--digi--color--text--interactive--brand-secondary--dark);
     --digi--color--text--interactive--visited: var(--digi--color--text--interactive--visited--dark);
+    --digi--color--background--surface: var(--digi--color--background--surface--dark);
     --digi--color--background--primary: var(--digi--color--background--primary--dark);
     --digi--color--background--primary-elevated: var(--digi--color--background--primary-elevated--dark);
     --digi--color--background--secondary: var(--digi--color--background--secondary--dark);
@@ -884,6 +891,7 @@ License: none (public domain)
     --digi--color--background--brand-primary: var(--digi--color--background--brand-primary--dark);
     --digi--color--background--transparent: var(--digi--color--background--transparent--dark);
     --digi--color--background--notification: var(--digi--color--background--notification--dark);
+    --digi--color--background--dropdown: var(--digi--color--background--dropdown--dark);
     --digi--color--background--interactive--default--primary: var(--digi--color--background--interactive--default--primary--dark);
     --digi--color--background--interactive--default--primary-inverted: var(--digi--color--background--interactive--default--primary-inverted--dark);
     --digi--color--background--interactive--default--secondary: var(--digi--color--background--interactive--default--secondary--dark);
@@ -980,7 +988,7 @@ body {
   --digi--datepicker--calendar--max-width: 20.25rem;
   --digi--datepicker--calendar--show-week--max-width: 23.375rem;
   --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--primary-elevated);
+  --digi--datepicker--calendar--background-color: var(--digi--color--background--dropdown);
   --digi--datepicker--input-icon--width: 0.875rem;
   --digi--datepicker--input-icon--horizontal-padding: 0.75rem;
   --digi--datepicker--input-icon--vertical-padding: var(--digi--global--spacing--smallest-2);

package/dist/collection/components/_form/form-checkbox/form-checkbox.css

@@ -19,8 +19,8 @@ License: none (public domain)
   --digi--grayscale--850: #515151;
   --digi--grayscale--875: #414141;
   --digi--grayscale--900: #333333;
-  --digi--grayscale--950: #212121;
-  --digi--grayscale--975: #2c2c2c;
+  --digi--grayscale--950: #2c2c2c;
+  --digi--grayscale--975: #212121;
   --digi--grayscale--1000: #000000;
   --digi--sentiment--informative--200: #e9e9ff;
   --digi--sentiment--informative--500: #0A4DD1;
@@ -380,7 +380,7 @@ License: none (public domain)
   --digi--rallarros--500: #ce1cbd;
   --digi--sapphire--500: #1616b2;
   --digi--color--logotype-color--dark: var(--digi--granskott--700);
-  --digi--color--infographic--lineart--dark: var(--digi--grayscale--900);
+  --digi--color--infographic--lineart--dark: var(--digi--grayscale--75);
   --digi--color--infographic--background--dark: var(--digi--grayscale--0);
   --digi--color--infographic--brand--primary--dark: var(--digi--granskott--700);
   --digi--color--infographic--brand--secondary--dark: var(--digi--granskott--250);
@@ -397,9 +397,10 @@ License: none (public domain)
   --digi--color--text--interactive--brand-primary--dark: var(--digi--natthimmel--75);
   --digi--color--text--interactive--brand-secondary--dark: var(--digi--norrsken--500);
   --digi--color--text--interactive--visited--dark: #CB6DE3;
-  --digi--color--background--primary--dark: var(--digi--grayscale--975);
+  --digi--color--background--surface--dark: var(--digi--grayscale--900);
+  --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--950);
+  --digi--color--background--secondary--dark: var(--digi--grayscale--975);
   --digi--color--background--secondary-elevated--dark: var(--digi--grayscale--875);
   --digi--color--background--secondary-muted--dark: var(--digi--grayscale--900);
   --digi--color--background--secondary-accent--dark: var(--digi--grayscale--850);
@@ -407,6 +408,7 @@ License: none (public domain)
   --digi--color--background--brand-primary--dark: var(--digi--grayscale--900);
   --digi--color--background--transparent--dark: var(--digi--misc--transparent);
   --digi--color--background--notification--dark: var(--digi--sentiment--error--500);
+  --digi--color--background--dropdown--dark: var(--digi--grayscale--800);
   --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--secondary--dark: var(--digi--misc--transparent);
@@ -458,7 +460,7 @@ License: none (public domain)
   --digi--color--border--interactive--hover--secondary--dark: var(--digi--grayscale--75);
   --digi--color--border--interactive--hover--inverted--dark: var(--digi--norrsken--400);
   --digi--color--border--interactive--validation--success--dark: var(--digi--sentiment--success--500);
-  --digi--color--border--interactive--validation--warning--dark: var(--digi--sentiment--warning--900);
+  --digi--color--border--interactive--validation--warning--dark: var(--digi--sentiment--warning--700);
   --digi--color--border--interactive--validation--error--dark: var(--digi--sentiment--error--500);
   --digi--color--border--interactive--selected--primary--dark: var(--digi--grayscale--75);
   --digi--color--border--interactive--selected--secondary--dark: var(--digi--grayscale--75);
@@ -504,6 +506,7 @@ License: none (public domain)
   --digi--color--text--interactive--brand-primary--light: var(--digi--natthimmel--800);
   --digi--color--text--interactive--brand-secondary--light: var(--digi--norrsken--500);
   --digi--color--text--interactive--visited--light: var(--digi--amethyst--500);
+  --digi--color--background--surface--light: var(--digi--grayscale--0);
   --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);
@@ -514,6 +517,7 @@ License: none (public domain)
   --digi--color--background--brand-primary--light: var(--digi--natthimmel--800);
   --digi--color--background--transparent--light: var(--digi--misc--transparent);
   --digi--color--background--notification--light: var(--digi--sentiment--error--500);
+  --digi--color--background--dropdown--light: var(--digi--grayscale--0);
   --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--secondary--light: var(--digi--grayscale--0);
@@ -762,6 +766,7 @@ License: none (public domain)
     --digi--color--text--interactive--brand-primary: var(--digi--color--text--interactive--brand-primary--light);
     --digi--color--text--interactive--brand-secondary: var(--digi--color--text--interactive--brand-secondary--light);
     --digi--color--text--interactive--visited: var(--digi--color--text--interactive--visited--light);
+    --digi--color--background--surface: var(--digi--color--background--surface--light);
     --digi--color--background--primary: var(--digi--color--background--primary--light);
     --digi--color--background--primary-elevated: var(--digi--color--background--primary-elevated--light);
     --digi--color--background--secondary: var(--digi--color--background--secondary--light);
@@ -772,6 +777,7 @@ License: none (public domain)
     --digi--color--background--brand-primary: var(--digi--color--background--brand-primary--light);
     --digi--color--background--transparent: var(--digi--color--background--transparent--light);
     --digi--color--background--notification: var(--digi--color--background--notification--light);
+    --digi--color--background--dropdown: var(--digi--color--background--dropdown--light);
     --digi--color--background--interactive--default--primary: var(--digi--color--background--interactive--default--primary--light);
     --digi--color--background--interactive--default--primary-inverted: var(--digi--color--background--interactive--default--primary-inverted--light);
     --digi--color--background--interactive--default--secondary: var(--digi--color--background--interactive--default--secondary--light);
@@ -874,6 +880,7 @@ License: none (public domain)
     --digi--color--text--interactive--brand-primary: var(--digi--color--text--interactive--brand-primary--dark);
     --digi--color--text--interactive--brand-secondary: var(--digi--color--text--interactive--brand-secondary--dark);
     --digi--color--text--interactive--visited: var(--digi--color--text--interactive--visited--dark);
+    --digi--color--background--surface: var(--digi--color--background--surface--dark);
     --digi--color--background--primary: var(--digi--color--background--primary--dark);
     --digi--color--background--primary-elevated: var(--digi--color--background--primary-elevated--dark);
     --digi--color--background--secondary: var(--digi--color--background--secondary--dark);
@@ -884,6 +891,7 @@ License: none (public domain)
     --digi--color--background--brand-primary: var(--digi--color--background--brand-primary--dark);
     --digi--color--background--transparent: var(--digi--color--background--transparent--dark);
     --digi--color--background--notification: var(--digi--color--background--notification--dark);
+    --digi--color--background--dropdown: var(--digi--color--background--dropdown--dark);
     --digi--color--background--interactive--default--primary: var(--digi--color--background--interactive--default--primary--dark);
     --digi--color--background--interactive--default--primary-inverted: var(--digi--color--background--interactive--default--primary-inverted--dark);
     --digi--color--background--interactive--default--secondary: var(--digi--color--background--interactive--default--secondary--dark);

package/dist/collection/components/_form/form-filter/form-filter.css

@@ -15,7 +15,7 @@ License: none (public domain)
   --digi--form-filter--toggle-icon--transition: ease-in-out 0.2s all;
   --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--primary);
+  --digi--form-filter--dropdown--background: var(--digi--color--background--dropdown);
   --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;

package/dist/collection/components/_form/form-select-filter/form-select-filter.css

@@ -3,7 +3,7 @@ v2.0 | 20110126
 License: none (public domain)
 */
 :host {
-  --digi--form-select-filter--footer--background: var(--digi--color--background--secondary);
+  --digi--form-select-filter--footer--background: var(--digi--color--background--secondary-accent);
   --digi--form-select-filter--scroll--max-height: 10.625rem;
   --digi--form-select-filter--scroll--padding: var(--digi--padding--small);
   --digi--form-select-filter--reset-button--margin-right: var(--digi--padding--small);
@@ -13,7 +13,7 @@ License: none (public domain)
   --digi--form-select-filter--item--margin: var(--digi--gutter--small) 0;
   --digi--form-select-filter--toggle-icon--transition: ease-in-out 0.2s all;
   --digi--form-select-filter--dropdown--border-radius: var(--digi--border-radius--input);
-  --digi--form-select-filter--dropdown--background: var(--digi--color--background--primary-elevated);
+  --digi--form-select-filter--dropdown--background: var(--digi--color--background--dropdown);
   --digi--form-select-filter--dropdown--min-width: 18.75rem;
   --digi--form-select-filter--dropdown--margin-top: var(--digi--gutter--small);
   --digi--form-select-filter--dropdown--z-index: 999;

package/dist/collection/components/_header/header/header.js

@@ -1,5 +1,5 @@
 import { h } from "@stencil/core";
-import { HeaderCenterContentWidth, LayoutBlockContainer, UtilBreakpointObserverBreakpoints, } from "../../../enums";
+import { HeaderCenterContentWidth, LayoutBlockContainer, LayoutBlockVariation, UtilBreakpointObserverBreakpoints, } from "../../../enums";
 /**
  * @enums HeaderCenterContentWidth - header-center-content-width.enum.ts
  * @enums LayoutBlockContainer - layout-block-container.enum.ts
@@ -86,7 +86,7 @@ export class Header {
         return (h("div", { class: "digi-header__wrapper" }, h("slot", { name: "header-logo" }), h("slot", { name: "header-content" }), this.hasNavigation && this.isMobile && (h("digi-navigation-sidebar-button", { "aria-hidden": this.afActive ? 'true' : 'false', "af-text": this.afMenuButtonText }))));
     }
     render() {
-        return (h("header", { key: '73e95103c9377a0a880757124540cefe8395c70c', "aria-label": this.ariaLabel, class: Object.assign({ 'digi-header': true }, this.cssModifiers) }, h("digi-util-breakpoint-observer", { key: 'b43a331345bcb463c9cb7ae26032a6c5bcec05ce', onAfOnChange: (e) => this.handleBreakpointObserver(e) }), h("digi-layout-block", { key: 'f9e92080a234f619650f0bcdbff2ee3a471f63b9', afContainer: LayoutBlockContainer.NONE }, this.afCentered !== HeaderCenterContentWidth.DEFAULT ? (h("digi-layout-container", { "af-max-width": this.afCentered }, this.renderContent())) : (this.renderContent()), h("div", { key: '0e080daf5eaa59f83cee7585a6d0f70c44e96892', class: "digi-header__border" }), h("slot", { key: '2339203a0d17c1263e7ad61d344d3c966bcd9d8c', name: "header-navigation" }))));
+        return (h("header", { key: '2d0db99aff1a493df0ff0537d90c1d4c065a284d', "aria-label": this.ariaLabel, class: Object.assign({ 'digi-header': true }, this.cssModifiers) }, h("digi-util-breakpoint-observer", { key: 'cea28a7c82de9983cc342e47da5cc1c32f50cd47', onAfOnChange: (e) => this.handleBreakpointObserver(e) }), h("digi-layout-block", { key: 'ad9becc7067fc620be420eee69e67b47e3eab8f1', afContainer: LayoutBlockContainer.NONE, afVariation: LayoutBlockVariation.TRANSPARENT }, this.afCentered !== HeaderCenterContentWidth.DEFAULT ? (h("digi-layout-container", { "af-max-width": this.afCentered }, this.renderContent())) : (this.renderContent()), h("div", { key: '0e9704b2744ab4908c4d2af0ce45a20fa08fca78', class: "digi-header__border" }), h("slot", { key: 'a58c8ee12e3932c509c761a930dbdd9e2c8d3a28', name: "header-navigation" }))));
     }
     static get is() { return "digi-header"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/_header/header-avatar/header-avatar.css

@@ -19,8 +19,8 @@ License: none (public domain)
   --digi--grayscale--850: #515151;
   --digi--grayscale--875: #414141;
   --digi--grayscale--900: #333333;
-  --digi--grayscale--950: #212121;
-  --digi--grayscale--975: #2c2c2c;
+  --digi--grayscale--950: #2c2c2c;
+  --digi--grayscale--975: #212121;
   --digi--grayscale--1000: #000000;
   --digi--sentiment--informative--200: #e9e9ff;
   --digi--sentiment--informative--500: #0A4DD1;
@@ -380,7 +380,7 @@ License: none (public domain)
   --digi--rallarros--500: #ce1cbd;
   --digi--sapphire--500: #1616b2;
   --digi--color--logotype-color--dark: var(--digi--granskott--700);
-  --digi--color--infographic--lineart--dark: var(--digi--grayscale--900);
+  --digi--color--infographic--lineart--dark: var(--digi--grayscale--75);
   --digi--color--infographic--background--dark: var(--digi--grayscale--0);
   --digi--color--infographic--brand--primary--dark: var(--digi--granskott--700);
   --digi--color--infographic--brand--secondary--dark: var(--digi--granskott--250);
@@ -397,9 +397,10 @@ License: none (public domain)
   --digi--color--text--interactive--brand-primary--dark: var(--digi--natthimmel--75);
   --digi--color--text--interactive--brand-secondary--dark: var(--digi--norrsken--500);
   --digi--color--text--interactive--visited--dark: #CB6DE3;
-  --digi--color--background--primary--dark: var(--digi--grayscale--975);
+  --digi--color--background--surface--dark: var(--digi--grayscale--900);
+  --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--950);
+  --digi--color--background--secondary--dark: var(--digi--grayscale--975);
   --digi--color--background--secondary-elevated--dark: var(--digi--grayscale--875);
   --digi--color--background--secondary-muted--dark: var(--digi--grayscale--900);
   --digi--color--background--secondary-accent--dark: var(--digi--grayscale--850);
@@ -407,6 +408,7 @@ License: none (public domain)
   --digi--color--background--brand-primary--dark: var(--digi--grayscale--900);
   --digi--color--background--transparent--dark: var(--digi--misc--transparent);
   --digi--color--background--notification--dark: var(--digi--sentiment--error--500);
+  --digi--color--background--dropdown--dark: var(--digi--grayscale--800);
   --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--secondary--dark: var(--digi--misc--transparent);
@@ -458,7 +460,7 @@ License: none (public domain)
   --digi--color--border--interactive--hover--secondary--dark: var(--digi--grayscale--75);
   --digi--color--border--interactive--hover--inverted--dark: var(--digi--norrsken--400);
   --digi--color--border--interactive--validation--success--dark: var(--digi--sentiment--success--500);
-  --digi--color--border--interactive--validation--warning--dark: var(--digi--sentiment--warning--900);
+  --digi--color--border--interactive--validation--warning--dark: var(--digi--sentiment--warning--700);
   --digi--color--border--interactive--validation--error--dark: var(--digi--sentiment--error--500);
   --digi--color--border--interactive--selected--primary--dark: var(--digi--grayscale--75);
   --digi--color--border--interactive--selected--secondary--dark: var(--digi--grayscale--75);
@@ -504,6 +506,7 @@ License: none (public domain)
   --digi--color--text--interactive--brand-primary--light: var(--digi--natthimmel--800);
   --digi--color--text--interactive--brand-secondary--light: var(--digi--norrsken--500);
   --digi--color--text--interactive--visited--light: var(--digi--amethyst--500);
+  --digi--color--background--surface--light: var(--digi--grayscale--0);
   --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);
@@ -514,6 +517,7 @@ License: none (public domain)
   --digi--color--background--brand-primary--light: var(--digi--natthimmel--800);
   --digi--color--background--transparent--light: var(--digi--misc--transparent);
   --digi--color--background--notification--light: var(--digi--sentiment--error--500);
+  --digi--color--background--dropdown--light: var(--digi--grayscale--0);
   --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--secondary--light: var(--digi--grayscale--0);
@@ -762,6 +766,7 @@ License: none (public domain)
     --digi--color--text--interactive--brand-primary: var(--digi--color--text--interactive--brand-primary--light);
     --digi--color--text--interactive--brand-secondary: var(--digi--color--text--interactive--brand-secondary--light);
     --digi--color--text--interactive--visited: var(--digi--color--text--interactive--visited--light);
+    --digi--color--background--surface: var(--digi--color--background--surface--light);
     --digi--color--background--primary: var(--digi--color--background--primary--light);
     --digi--color--background--primary-elevated: var(--digi--color--background--primary-elevated--light);
     --digi--color--background--secondary: var(--digi--color--background--secondary--light);
@@ -772,6 +777,7 @@ License: none (public domain)
     --digi--color--background--brand-primary: var(--digi--color--background--brand-primary--light);
     --digi--color--background--transparent: var(--digi--color--background--transparent--light);
     --digi--color--background--notification: var(--digi--color--background--notification--light);
+    --digi--color--background--dropdown: var(--digi--color--background--dropdown--light);
     --digi--color--background--interactive--default--primary: var(--digi--color--background--interactive--default--primary--light);
     --digi--color--background--interactive--default--primary-inverted: var(--digi--color--background--interactive--default--primary-inverted--light);
     --digi--color--background--interactive--default--secondary: var(--digi--color--background--interactive--default--secondary--light);
@@ -874,6 +880,7 @@ License: none (public domain)
     --digi--color--text--interactive--brand-primary: var(--digi--color--text--interactive--brand-primary--dark);
     --digi--color--text--interactive--brand-secondary: var(--digi--color--text--interactive--brand-secondary--dark);
     --digi--color--text--interactive--visited: var(--digi--color--text--interactive--visited--dark);
+    --digi--color--background--surface: var(--digi--color--background--surface--dark);
     --digi--color--background--primary: var(--digi--color--background--primary--dark);
     --digi--color--background--primary-elevated: var(--digi--color--background--primary-elevated--dark);
     --digi--color--background--secondary: var(--digi--color--background--secondary--dark);
@@ -884,6 +891,7 @@ License: none (public domain)
     --digi--color--background--brand-primary: var(--digi--color--background--brand-primary--dark);
     --digi--color--background--transparent: var(--digi--color--background--transparent--dark);
     --digi--color--background--notification: var(--digi--color--background--notification--dark);
+    --digi--color--background--dropdown: var(--digi--color--background--dropdown--dark);
     --digi--color--background--interactive--default--primary: var(--digi--color--background--interactive--default--primary--dark);
     --digi--color--background--interactive--default--primary-inverted: var(--digi--color--background--interactive--default--primary-inverted--dark);
     --digi--color--background--interactive--default--secondary: var(--digi--color--background--interactive--default--secondary--dark);

package/dist/collection/components/_info-card/info-card-multi/info-card-multi.css

@@ -17,7 +17,7 @@ License: none (public domain)
   --digi--info-card-multi--related-heading--font-size--desktop: var(--digi--typography--heading-3--font-size--desktop);
   --digi--info-card-multi--entry-heading--font-size--mobile: var(--digi--typography--heading-2--font-size--mobile);
   --digi--info-card-multi--entry-heading--font-size--desktop: var(--digi--typography--heading-2--font-size--desktop);
-  --digi--info-card--background-color: var(--digi--color--background--primary);
+  --digi--info-card--background-color: var(--digi--color--background--primary-elevated);
 }
 :host .digi-info-card-multi {
   box-sizing: border-box;