@duetds/components 9.13.0 → 9.14.0

package/lib/collection/components/duet-upload/duet-upload.js

@@ -753,10 +753,10 @@ export class DuetUpload {
             this.externalUploadButton.accessibleLabel = `${this.externalUploadButton.innerText}. ${caption}`;
         }
         // @ts-ignore
-        return (h(Host, { key: '1cf963112372b0839905ebd303f16cfae5aa5917', class: { "duet-m-0": this.margin === "none" } }, h("duet-fieldset", { key: '35564b78c8b82f58b93f9a7460399f57967e19bf', "label-heading-level": this.headerHeadingLevel, "label-hidden": this.hideHeader, label: this.label }, h("slot", { key: 'faf369cde5952486b48923f2c913e4c049d156f6', name: "header" }), !this.files.size && (h("duet-empty-state", { key: 'e472abcf75d492b1c4cb7a9b59cbe67b23d318f6', id: this.labelId, part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", icon: "messaging-attachment" }, h("duet-paragraph", { key: '421fac3a1916616bb493ba375f9b3d23e2a61fd0', margin: "none" }, this.fileListEmpty))), !!this.files.size && h("slot", { key: '18b91ef0ca261cb796b9a03f2409c7172da19a82', name: "fileheader" }), !!this.files.size && (h("duet-upload-aria-status", { key: '080c19a8966ab4943ef3ed1698b475ecc44c346e', invalid: this.getFilesAsArray().invalid.length, valid: this.getFilesAsArray().valid.length, inprogress: this.filesInProgress.size, total: this.files.size, statusMessageLabel: this.internalStatusMessageLabel })), !!this.files.size && this.renderUploadedItems(), !!this.files.size && h("slot", { key: '7c1f27c8b8536a6112d6a1746812b80b672fbd96', name: "filefooter" }), h("slot", { key: 'd5889f6e90bc40cc6031cbfb99c3f28e80fced37', name: "uploadfooter" }), this.captionOnBottom && (h("duet-caption", { key: 'b4c43409de0dbfe70dd43939dea8c733493348cf', margin: "none", size: "small" }, h("div", { key: 'f5c70becb6e99a87a9059885ca2bfc3748e0df10', class: "upload-bottom-caption" }, caption))), h("slot", { key: '01adfecfb33b057497a73c43c2c7caaab1c4a9e2', name: "afterfooter" }), !this.hideButton && (h(Fragment, { key: '601403192ed82f9b3508e62ab701daab90c313d2' }, h("duet-spacer", { key: 'b387500c9d551a371d1c2e01a5ccfdeb130826e8', size: "large" }), h("duet-button", { key: '681d70016955aeaaf21fbea4edf92fd7c28ccec0', id: this.buttonId, onClick: this.startUpload, "accessible-controls": identifier, disabled: this.fileMaxReached, "accessible-label": this.accessibleButtonLabel || `${this.buttonLabel}. ${caption}`, "accessible-owns": identifier, size: "small", variation: "secondary", fixed: true, icon: "action-add-circle", part: this.identifier ? `${this.identifier}-button-upload` : "duet-upload-button-upload" }, this.buttonLabel))), (this.fileMaxReached ||
+        return (h(Host, { key: '2cb6006c495f141141399d81c7e6f8e7967d2abf', class: { "duet-m-0": this.margin === "none" } }, h("duet-fieldset", { key: 'e3febb3aaed53ba1f63d0deaed3984233d081ff9', "label-heading-level": this.headerHeadingLevel, "label-hidden": this.hideHeader, label: this.label }, h("slot", { key: '0cb5e96677cee13c2cb2748ec95182ba44542e9c', name: "header" }), !this.files.size && (h("duet-empty-state", { key: '0b6ff2849bb502f136c3b4837ccdf19b5b2c1c18', id: this.labelId, part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", icon: "messaging-attachment" }, h("duet-paragraph", { key: '69ddeab39e14da3d436467aa935f3695587547fb', margin: "none" }, this.fileListEmpty))), !!this.files.size && h("slot", { key: 'df6739a9d4d7c5c02e72e3f430f29d854edf1a99', name: "fileheader" }), !!this.files.size && (h("duet-upload-aria-status", { key: 'cbd6241618dbf7ca04c61e1d0725f4dc157e87af', invalid: this.getFilesAsArray().invalid.length, valid: this.getFilesAsArray().valid.length, inprogress: this.filesInProgress.size, total: this.files.size, statusMessageLabel: this.internalStatusMessageLabel })), !!this.files.size && this.renderUploadedItems(), !!this.files.size && h("slot", { key: 'aacaa46c313c829d4e880bf7c7e1848f0ea189cf', name: "filefooter" }), h("slot", { key: '36551b5a589e7feee6077af241b9a25d297feb28', name: "uploadfooter" }), this.captionOnBottom && (h("duet-caption", { key: 'd04226d485cc26a193935fa8e4fb98a462a0a505', margin: "none", size: "small" }, h("div", { key: '6b45b8d84658fd393dc9522c5bc33288e39f7159', class: "upload-bottom-caption" }, caption))), h("slot", { key: '2f2b87ae68a5df22a1fd03e11616249a26be0791', name: "afterfooter" }), !this.hideButton && (h(Fragment, { key: '113e78c43b0be73519c29617ab452a494f567683' }, h("duet-spacer", { key: '292f0dbbd87d637d7abf982b8e296b282ae89375', size: "large" }), h("duet-button", { key: '774bc75ffb2f90878794215e7890d592abb7acd5', id: this.buttonId, onClick: this.startUpload, "accessible-controls": identifier, disabled: this.fileMaxReached, "accessible-label": this.accessibleButtonLabel || `${this.buttonLabel}. ${caption}`, "accessible-owns": identifier, size: "small", variation: "secondary", fixed: true, icon: "action-add-circle", part: this.identifier ? `${this.identifier}-button-upload` : "duet-upload-button-upload" }, this.buttonLabel))), (this.fileMaxReached ||
             this.bytesMaxReached ||
             this.filesToUploadExceedsLimit ||
-            this.filesToUploadTotalSizeIsAboveMax) && (h(Fragment, { key: '0d1fa3fccf78c8af90c14195219c988a5d53b161' }, h("duet-spacer", { key: '7602cb47424ab7b5ed19654956b4235691e97f91', size: "medium" }), h("duet-alert", { key: '54a5be1c79fc490445d3f9fb36efa0c113d619d0', part: this.identifier ? `${this.identifier}-error-notification` : "duet-upload-error-notification" }, this.fileMaxReached && getI18nError("duet-upload-301", this.errorCodes), this.bytesMaxReached && getI18nError("duet-upload-202", this.errorCodes), this.filesToUploadExceedsLimit && getI18nError("duet-upload-302", this.errorCodes), this.filesToUploadTotalSizeIsAboveMax && getI18nError("duet-upload-203", this.errorCodes)))), h("duet-visually-hidden", { key: '78a670de5fef020407da2b18bd07d6b056c818ed', "aria-hidden": "true" }, h("input", { key: '04ce3da566f26a64f42a30eba51914031ad1dcc9', ref: input => {
+            this.filesToUploadTotalSizeIsAboveMax) && (h(Fragment, { key: '7de2ffb0e3562b05cd46d1eb1d3360fc853cf601' }, h("duet-spacer", { key: 'fa336882d4bd468f1e9593946f48d73929d26f87', size: "medium" }), h("duet-alert", { key: 'd9a8cac2323b3b10d4cb5c22d0ec19c9b2082694', part: this.identifier ? `${this.identifier}-error-notification` : "duet-upload-error-notification" }, this.fileMaxReached && getI18nError("duet-upload-301", this.errorCodes), this.bytesMaxReached && getI18nError("duet-upload-202", this.errorCodes), this.filesToUploadExceedsLimit && getI18nError("duet-upload-302", this.errorCodes), this.filesToUploadTotalSizeIsAboveMax && getI18nError("duet-upload-203", this.errorCodes)))), h("duet-visually-hidden", { key: '71318f80dd7ad1ef345bc1123be62719becdc52d', "aria-hidden": "true" }, h("input", { key: 'a68a3d1d4490e75a2968e47a681f11cea7bc4d9b', ref: input => {
                 this.nativeInput = input;
             }, accept: !this.limitSelection ? undefined : `${this.allowedMimetypes},${this.allowedExtensions}`, onBlur: this.onBlur, onFocus: this.onFocus, onChange: e => this.onChange(e), type: "file", class: {
                 "duet-upload": true,

package/lib/collection/components/duet-upload-aria-status/duet-upload-aria-status.js

@@ -64,7 +64,7 @@ export class DuetUploadAriaStatus {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '29a5f69ac1efab8c5faba9b62b86ae0201b67f92', role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, h("duet-visually-hidden", { key: 'def6c734ea787016244670da4652bbca170ee664' }, this.statusMessage)));
+        return (h(Host, { key: '986a0f1f93835a89c37556bd7151fd95b2319185', role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, h("duet-visually-hidden", { key: '81e6ea00b9362ccd1accc3b01b9bfefaca5006c1' }, this.statusMessage)));
     }
     static get is() { return "duet-upload-aria-status"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-upload-item/duet-upload-item.js

@@ -80,9 +80,9 @@ export class DuetUploadItem {
         const { uid, meta, item } = this.data;
         const Badges = meta && meta.badges ? (h("span", null, meta.badges.map(badgeText => (h("duet-badge", { color: "primary" }, badgeText))))) : undefined;
         const actionDescription = `${meta && meta.badges ? meta.badges.join(",") : ""} ${item.name}`;
-        return (h("div", { key: '1f218828b275a4e375e1abc5bdfc07efd523cc65', class: {
+        return (h("div", { key: 'a0d382c608507d07d924abb73bcbbeffa09e0aee', class: {
                 "upload-item-row": true,
-            } }, this.showCategory && (h("div", { key: '658d56994cf4d0ba61795e1acb9fe240af8ff721', class: "item-categories" }, h("duet-heading", { key: '43c031580760f22c5e947204718a95d7dd04d344', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.categoryLabel)), Badges)), h("div", { key: '1c1a0d54400f909928885b373f98b250bd06cec0', class: { "item-name": true, "no-category": !this.showCategory } }, !!this.label && (h("duet-heading", { key: '4255fa3f11831fc197e8f757bb4fbb6261592ead', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.label))), this.getFileNameLine()), h("div", { key: '5195ccc35498ad7538d7aba059262d4704d600a8', class: "item-actions" }, this.actions.map(actionItem => {
+            } }, this.showCategory && (h("div", { key: '4f7b9bb8c9494e062171d29e5cfc12a9a3e1027b', class: "item-categories" }, h("duet-heading", { key: '477b02e94e76c857191fa6cd51f51bfd240bbbe7', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.categoryLabel)), Badges)), h("div", { key: 'a12f1ea980d26df9122daf3dec6a4441716c88ff', class: { "item-name": true, "no-category": !this.showCategory } }, !!this.label && (h("duet-heading", { key: '8cdca136f7a623a5b58fc863e02f15552ff73f0e', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.label))), this.getFileNameLine()), h("div", { key: '33a97bcbb4daaf167e89fed5aacae4409b982177', class: "item-actions" }, this.actions.map(actionItem => {
             return (h("duet-action-button", { actionMeta: Object.assign({}, meta || {}), actionId: uid || null, actionName: actionItem.name, theme: this.theme, iconName: actionItem.icon, iconColor: actionItem.color, iconSize: actionItem.size, background: actionItem.background, "accessible-label": `${actionDescription} ${getLocaleString(actionItem.label)} `, accessibleTitle: this.getActionButtonTitle(actionItem), ref: button => (this.actionButton = button) }));
         }))));
     }

package/lib/collection/components/duet-visually-hidden/duet-visually-hidden.js

@@ -8,7 +8,7 @@ export class DuetVisuallyHidden {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'e229d70e362b7d02aba28a752b8c394ac6d596e4', class: "duet-visually-hidden" }, h("slot", { key: '207e150e69b29418863501b85afdcc555d449355' })));
+        return (h(Host, { key: 'ad4e235568c6ea33e55df1fd22e7ec078af3ca20', class: "duet-visually-hidden" }, h("slot", { key: 'f5bb563082e973ea4bf7b9f710298858b5bc0fa3' })));
     }
     static get is() { return "duet-visually-hidden"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/utils/token-utils.js

@@ -2,8 +2,16 @@
  * Built with Duet Design System
  */
 import * as tokens from "@duetds/tokens";
+import turva2ColorTokens from "./turva2-color-tokens";
 const allowedThemes = ["turva"];
 const MATCH_CAPITAL_CASE = /[A-Z]/g;
+function isTurva2() {
+    var _a;
+    if (typeof document === "undefined") {
+        return false;
+    }
+    return !!((_a = document.documentElement.attributes.getNamedItem("class")) === null || _a === void 0 ? void 0 : _a.value.includes("duet-theme-turva2"));
+}
 export function isCamelCase(str) {
     const camel = MATCH_CAPITAL_CASE.test(str);
     const barredString = !str.includes("_") && !str.includes("-") && !str.includes(" ");
@@ -54,18 +62,62 @@ function addTheme(str, theme) {
     }
     return str;
 }
+/**
+ * Add "-turva" to color names (or "Turva" to camelCase color names)
+ */
+export function postfixTheme(name, theme) {
+    if (!name) {
+        return undefined;
+    }
+    if (["", "default"].includes(theme)) {
+        return name;
+    }
+    if ((isDashCase(name) && name.endsWith(`-${theme}`)) || (isCamelCase(name) && name.endsWith(capitalize(theme)))) {
+        return name;
+    }
+    if (tokens[`color${camelize(name)}${capitalizeFirstLetter(theme)}`]) {
+        return !isCamelCase(name) ? `${name}-${theme}` : `${name}${capitalize(theme)}`;
+    }
+    return name;
+}
 export function getColorByName(name, theme = "") {
     if (!name) {
         return undefined;
     }
-    const defaultColor = convertToColorName(name);
-    const themedColor = convertToColorName(name, theme);
-    // lets just try to get the color first to save some cycles
-    let resolvedToken = tokens[themedColor];
-    if (!resolvedToken) {
-        resolvedToken = tokens[defaultColor];
+    if ((theme === "turva" || name.endsWith("-turva")) && isTurva2()) {
+        switch (name.replace(/-turva$/, "")) {
+            case "primary-lightest":
+                return turva2ColorTokens["color-turva2-nude-00"];
+            case "primary-lighter":
+                return turva2ColorTokens["color-turva2-nude-50"];
+            case "primary-light":
+                return turva2ColorTokens["color-turva2-nude-200"];
+            case "primary":
+                return turva2ColorTokens["color-turva2-red-600"];
+            case "primary-darker":
+                return turva2ColorTokens["color-turva2-red-700"];
+            case "primary-dark":
+                return turva2ColorTokens["color-turva2-red-800"];
+            case "secondary":
+                return turva2ColorTokens["color-turva2-gray-900"];
+            case "gray-lighter":
+                return turva2ColorTokens["color-turva2-gray-00"];
+            case "gray-light":
+                return turva2ColorTokens["color-turva2-gray-100"];
+            case "gray":
+                return turva2ColorTokens["color-turva2-gray-200"];
+            case "gray-dark":
+                return turva2ColorTokens["color-turva2-gray-400"];
+            case "gray-darker":
+                return turva2ColorTokens["color-turva2-gray-500"];
+            default:
+            // carry on to old turva colors
+        }
     }
-    return resolvedToken;
+    const defaultColor = convertToColorName(name);
+    const themedColor = theme && convertToColorName(name, theme);
+    // return themed color if it exists
+    return tokens[themedColor] || tokens[defaultColor];
 }
 export function convertToColorName(name = "", theme = "") {
     let colorResolution = name;

package/lib/collection/utils/turva2-color-tokens.js

@@ -0,0 +1,42 @@
+/*!
+ * Built with Duet Design System
+ */
+const turva2ColorTokens = {
+    "color-turva2-red-00": "#fff2f2",
+    "color-turva2-red-50": "#ffecec",
+    "color-turva2-red-100": "#ffe5e6",
+    "color-turva2-red-200": "#ffc9cc",
+    "color-turva2-red-300": "#f9a4ac",
+    "color-turva2-red-400": "#f37785",
+    "color-turva2-red-500": "#ec4560",
+    "color-turva2-red-600": "#e61740",
+    "color-turva2-red-700": "#b90329",
+    "color-turva2-red-800": "#8c001e",
+    "color-turva2-red-900": "#600014",
+    "color-turva2-red-1000": "#33000a",
+    "color-turva2-gray-00": "#f5f6f7",
+    "color-turva2-gray-50": "#e4e9ed",
+    "color-turva2-gray-100": "#d4dde2",
+    "color-turva2-gray-200": "#b2c2cd",
+    "color-turva2-gray-300": "#94a9b9",
+    "color-turva2-gray-400": "#7891a4",
+    "color-turva2-gray-500": "#5f7a8f",
+    "color-turva2-gray-600": "#48647a",
+    "color-turva2-gray-700": "#354f65",
+    "color-turva2-gray-800": "#253c50",
+    "color-turva2-gray-900": "#172a3b",
+    "color-turva2-gray-1000": "#061726",
+    "color-turva-nude-00": "#fdf7f2",
+    "color-turva-nude-50": "#fbebe1",
+    "color-turva-nude-100": "#fbe1d1",
+    "color-turva-nude-200": "#f1cab2",
+    "color-turva-nude-300": "#d8ae96",
+    "color-turva-nude-400": "#be937c",
+    "color-turva-nude-500": "#a57a65",
+    "color-turva-nude-600": "#8c624f",
+    "color-turva-nude-700": "#724c3c",
+    "color-turva-nude-800": "#59382b",
+    "color-turva-nude-900": "#40261c",
+    "color-turva-nude-1000": "#26150f",
+};
+export default turva2ColorTokens;

package/lib/dist-custom-elements/duet-action-button.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetActionButton$1, d as defineCustomElement$1 } from './p-12884dcf.js';
+import { D as DuetActionButton$1, d as defineCustomElement$1 } from './p-b3835995.js';
 
 const DuetActionButton = DuetActionButton$1;
 const defineCustomElement = defineCustomElement$1;

package/lib/dist-custom-elements/duet-alert.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetAlert$1, d as defineCustomElement$1 } from './p-2e148296.js';
+import { D as DuetAlert$1, d as defineCustomElement$1 } from './p-96cabce8.js';
 
 const DuetAlert = DuetAlert$1;
 const defineCustomElement = defineCustomElement$1;

package/lib/dist-custom-elements/duet-badge.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetBadge$1, d as defineCustomElement$1 } from './p-c1e381e3.js';
+import { D as DuetBadge$1, d as defineCustomElement$1 } from './p-0e0a0525.js';
 
 const DuetBadge = DuetBadge$1;
 const defineCustomElement = defineCustomElement$1;

package/lib/dist-custom-elements/duet-banner.js

@@ -1,14 +1,14 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, h as h$1, d as Host } from './p-47d05b62.js';
+import { p as proxyCustomElement, H, h as h$1, d as Host } from './p-fddb3ec1.js';
 import { i as inheritGlobalTheme } from './p-3757c660.js';
 import { h } from './p-993aea39.js';
 import { h as hasSlot, c as checkNamedSlotElement } from './p-f21662ea.js';
 import { p as parsePossibleJSON } from './p-9c3c64b9.js';
-import { g as getColorByName } from './p-77260ba8.js';
-import { d as defineCustomElement$3 } from './p-16151d9e.js';
-import { d as defineCustomElement$2 } from './p-aa4ebea4.js';
+import { g as getColorByName, p as postfixTheme } from './p-499da71e.js';
+import { d as defineCustomElement$3 } from './p-706a9a13.js';
+import { d as defineCustomElement$2 } from './p-d5c72ea3.js';
 
 const DuetPicture = ({ img, sources }) => {
     return (h("picture", null,
@@ -17,7 +17,7 @@ const DuetPicture = ({ img, sources }) => {
         h("img", Object.assign({}, img))));
 };
 
-const duetBannerCss = "*,\n*::after,\n*::before {\n  box-sizing: border-box;\n  padding: 0;\n  margin: 0;\n  background: transparent;\n  border: 0;\n  -moz-appearance: none;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n:host {\n  box-sizing: border-box;\n  padding: 0;\n  margin: 0;\n  background: transparent;\n  border: 0;\n  -moz-appearance: none;\n  -webkit-appearance: none;\n  appearance: none;\n  margin-right: 36px !important;\n  margin-bottom: 36px !important;\n  display: flex;\n  justify-content: center;\n  width: auto;\n  container: duet-banner-container;\n  container-type: inline-size;\n}\n:host:last-child, :host:last-of-type {\n  margin-right: 0 !important;\n}\n\n:host(.duet-m-0) {\n  margin: 0 !important;\n}\n\n.duet-banner {\n  display: grid;\n  grid-template-rows: min-content 1fr;\n  width: 100%;\n  height: 100%;\n  font-family: \"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n  font-style: normal;\n  text-align: left;\n  border-radius: 16px;\n}\n.duet-banner.duet-p-0 {\n  padding: 0 !important;\n}\n.duet-banner.duet-m-0 {\n  margin: 0 !important;\n}\n.duet-banner .visual {\n  position: relative;\n  display: none;\n  overflow: hidden;\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 0px) {\n  .duet-banner .visual {\n    /* stylelint-enable */\n    display: block;\n  }\n}\n.duet-banner .visual .image-container {\n  position: relative;\n  aspect-ratio: 2/1;\n  overflow: hidden;\n}\n.duet-banner .visual .image {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: center;\n}\n.duet-banner .visual .icon {\n  position: absolute;\n}\n.duet-banner .visual .brand-shape {\n  position: absolute;\n  top: 0;\n  left: 72%;\n  display: none;\n  width: 100%;\n  height: 100%;\n  mask-image: url(\"data:image/svg+xml,%3Csvg%20%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20344%22%20fill%3D%22none%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M2.72641e-07%2091.1902C0.000476976%2097.9034%200.626077%20104.726%201.92282%20111.592L42.7493%20327.771C43.8045%20333.358%2045.2667%20338.776%2047.0996%20344H160V0H51.1439C19.7799%2019.1253%200.00268143%2053.4178%202.72641e-07%2091.1749C-9.08807e-08%2091.18%20-9.08875e-08%2091.1851%202.72641e-07%2091.1902Z%22%20fill%3D%22%23E6F2F8%22%2F%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fsvg%3E\");\n}\n.duet-banner .content {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  padding: 16px 20px 28px;\n}\n.duet-banner .content .description {\n  hyphens: auto;\n}\n.duet-banner .action {\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n  align-items: flex-start;\n  justify-content: flex-end;\n  padding-top: 16px;\n}\n.duet-banner .visual {\n  border-top-left-radius: 16px;\n  border-top-right-radius: 16px;\n}\n.duet-banner .visual .image-container {\n  width: 100%;\n  height: auto;\n  border-radius: 0;\n}\n.duet-banner .visual .icon {\n  bottom: 30px;\n  left: 15px;\n}\n.duet-banner.duet-theme-turva {\n  font-family: \"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n}\n.duet-banner.duet-theme-turva .visual .brand-shape {\n  mask-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 160 344' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_7920_3801)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2.58983 142.533C0.751086 155.147 0.0746585 167.857 0.00796847 179.225C0.00263853 179.814 0 180.409 0 181.007C0 194.845 1.41172 210.806 3.58065 223.171C5.6528 234.934 8.58716 246.495 12.5981 257.779C21.2249 282.059 34.0151 304.109 50.8401 323.977C56.7824 330.993 63.0921 337.68 69.8162 344H160V0H65.0733C52.1771 10.7866 41.4339 23.4177 32.7528 37.7978C21.1154 57.0822 14.0367 77.9583 9.75424 99.7913C9.09214 103.157 8.55049 106.545 8.00901 109.933C7.75185 111.542 7.49474 113.15 7.22478 114.756C6.74308 117.618 6.24543 120.479 5.74776 123.34C4.6361 129.729 3.52432 136.12 2.58983 142.533Z' fill='%23F5F5F7'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_7920_3801'%3E%3Crect width='160' height='344' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A\");\n}\n.duet-banner.size-medium, .duet-banner.size-large {\n  /* stylelint-disable */\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 486px) {\n  .duet-banner.size-medium, .duet-banner.size-large {\n    /* stylelint-enable */\n    grid-template-rows: none;\n    grid-template-columns: 50% 50%;\n  }\n  .duet-banner.size-medium .visual, .duet-banner.size-large .visual {\n    border-top-left-radius: 16px;\n    border-top-right-radius: 0;\n    border-bottom-left-radius: 16px;\n  }\n  .duet-banner.size-medium .visual .image-container, .duet-banner.size-large .visual .image-container {\n    height: 100%;\n  }\n  .duet-banner.size-medium .visual .image, .duet-banner.size-large .visual .image {\n    width: 100%;\n    height: 100%;\n  }\n  .duet-banner.size-medium .visual .icon, .duet-banner.size-large .visual .icon {\n    top: 36px;\n    left: 168px;\n  }\n  .duet-banner.size-medium .visual .brand-shape, .duet-banner.size-large .visual .brand-shape {\n    display: block;\n  }\n  .duet-banner.size-medium .content, .duet-banner.size-large .content {\n    align-items: flex-start;\n    justify-content: center;\n    padding: 28px 28px 28px 0;\n  }\n  .duet-banner.size-medium .action, .duet-banner.size-large .action {\n    flex-grow: 0;\n  }\n}\n@container duet-banner-container (min-width: 586px) {\n  .duet-banner.size-medium, .duet-banner.size-large {\n    /* stylelint-enable */\n  }\n  .duet-banner.size-medium .visual .brand-shape, .duet-banner.size-large .visual .brand-shape {\n    left: 80%;\n  }\n}\n.duet-banner.size-large {\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 900px) {\n  .duet-banner.size-large {\n    /* stylelint-enable */\n    grid-template-rows: none;\n    grid-template-columns: 50% 50%;\n  }\n  .duet-banner.size-large .visual {\n    border-top-left-radius: 16px;\n    border-bottom-left-radius: 16px;\n  }\n  .duet-banner.size-large .visual .image-container {\n    height: 100%;\n  }\n  .duet-banner.size-large .visual .image {\n    width: 100%;\n    height: 100%;\n  }\n  .duet-banner.size-large .visual .icon {\n    top: 40px;\n    bottom: auto;\n    left: 335px;\n  }\n  .duet-banner.size-large .visual .brand-shape {\n    display: block;\n  }\n  .duet-banner.size-large .content {\n    align-items: flex-start;\n    justify-content: center;\n    padding: 48px 48px 48px 0;\n  }\n  .duet-banner.size-large .action {\n    flex-grow: 0;\n  }\n}\n.duet-banner.no-image {\n  display: flex;\n  justify-content: center;\n  padding: 36px 20px;\n}\n.duet-banner.no-image .visual {\n  display: none;\n}\n.duet-banner.no-image .content {\n  width: 100%;\n  max-width: 720px;\n  padding: 0;\n}\n.duet-banner.no-image.size-medium, .duet-banner.no-image.size-large {\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 486px) {\n  .duet-banner.no-image.size-medium, .duet-banner.no-image.size-large {\n    /* stylelint-enable */\n    padding: 48px;\n  }\n}";
+const duetBannerCss = "*,\n*::after,\n*::before {\n  box-sizing: border-box;\n  padding: 0;\n  margin: 0;\n  background: transparent;\n  border: 0;\n  -moz-appearance: none;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n:host {\n  box-sizing: border-box;\n  padding: 0;\n  margin: 0;\n  background: transparent;\n  border: 0;\n  -moz-appearance: none;\n  -webkit-appearance: none;\n  appearance: none;\n  margin-right: 36px !important;\n  margin-bottom: 36px !important;\n  display: flex;\n  justify-content: center;\n  width: auto;\n  container: duet-banner-container;\n  container-type: inline-size;\n}\n:host:last-child, :host:last-of-type {\n  margin-right: 0 !important;\n}\n\n:host(.duet-m-0) {\n  margin: 0 !important;\n}\n\n.duet-banner {\n  display: grid;\n  grid-template-rows: min-content 1fr;\n  width: 100%;\n  height: 100%;\n  font-family: \"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n  font-style: normal;\n  text-align: left;\n  border-radius: 16px;\n}\n.duet-banner.duet-p-0 {\n  padding: 0 !important;\n}\n.duet-banner.duet-m-0 {\n  margin: 0 !important;\n}\n.duet-banner .visual {\n  position: relative;\n  display: none;\n  overflow: hidden;\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 0px) {\n  .duet-banner .visual {\n    /* stylelint-enable */\n    display: block;\n  }\n}\n.duet-banner .visual .image-container {\n  position: relative;\n  aspect-ratio: 2/1;\n  overflow: hidden;\n}\n.duet-banner .visual .image {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: center;\n}\n.duet-banner .visual .icon {\n  position: absolute;\n}\n.duet-banner .visual .brand-shape {\n  position: absolute;\n  top: 0;\n  left: 72%;\n  display: none;\n  width: 100%;\n  height: 100%;\n  mask-image: url(\"data:image/svg+xml,%3Csvg%20%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20344%22%20fill%3D%22none%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M2.72641e-07%2091.1902C0.000476976%2097.9034%200.626077%20104.726%201.92282%20111.592L42.7493%20327.771C43.8045%20333.358%2045.2667%20338.776%2047.0996%20344H160V0H51.1439C19.7799%2019.1253%200.00268143%2053.4178%202.72641e-07%2091.1749C-9.08807e-08%2091.18%20-9.08875e-08%2091.1851%202.72641e-07%2091.1902Z%22%20fill%3D%22%23E6F2F8%22%2F%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fsvg%3E\");\n  transform: scale(101%);\n}\n.duet-banner .content {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  padding: 16px 20px 28px;\n}\n.duet-banner .content .description {\n  hyphens: auto;\n}\n.duet-banner .action {\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n  align-items: flex-start;\n  justify-content: flex-end;\n  padding-top: 16px;\n}\n.duet-banner .visual {\n  border-top-left-radius: 16px;\n  border-top-right-radius: 16px;\n}\n.duet-banner .visual .image-container {\n  width: 100%;\n  height: auto;\n  border-radius: 0;\n}\n.duet-banner .visual .icon {\n  bottom: 30px;\n  left: 15px;\n}\n.duet-banner.duet-theme-turva {\n  font-family: \"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n}\n.duet-banner.duet-theme-turva .visual .brand-shape {\n  mask-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 160 344' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_7920_3801)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2.58983 142.533C0.751086 155.147 0.0746585 167.857 0.00796847 179.225C0.00263853 179.814 0 180.409 0 181.007C0 194.845 1.41172 210.806 3.58065 223.171C5.6528 234.934 8.58716 246.495 12.5981 257.779C21.2249 282.059 34.0151 304.109 50.8401 323.977C56.7824 330.993 63.0921 337.68 69.8162 344H160V0H65.0733C52.1771 10.7866 41.4339 23.4177 32.7528 37.7978C21.1154 57.0822 14.0367 77.9583 9.75424 99.7913C9.09214 103.157 8.55049 106.545 8.00901 109.933C7.75185 111.542 7.49474 113.15 7.22478 114.756C6.74308 117.618 6.24543 120.479 5.74776 123.34C4.6361 129.729 3.52432 136.12 2.58983 142.533Z' fill='%23F5F5F7'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_7920_3801'%3E%3Crect width='160' height='344' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A\");\n}\n.duet-banner.size-medium, .duet-banner.size-large {\n  /* stylelint-disable */\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 486px) {\n  .duet-banner.size-medium, .duet-banner.size-large {\n    /* stylelint-enable */\n    grid-template-rows: none;\n    grid-template-columns: 50% 50%;\n  }\n  .duet-banner.size-medium .visual, .duet-banner.size-large .visual {\n    border-top-left-radius: 16px;\n    border-top-right-radius: 0;\n    border-bottom-left-radius: 16px;\n  }\n  .duet-banner.size-medium .visual .image-container, .duet-banner.size-large .visual .image-container {\n    height: 100%;\n  }\n  .duet-banner.size-medium .visual .image, .duet-banner.size-large .visual .image {\n    width: 100%;\n    height: 100%;\n  }\n  .duet-banner.size-medium .visual .icon, .duet-banner.size-large .visual .icon {\n    top: 36px;\n    left: 168px;\n  }\n  .duet-banner.size-medium .visual .brand-shape, .duet-banner.size-large .visual .brand-shape {\n    display: block;\n  }\n  .duet-banner.size-medium .content, .duet-banner.size-large .content {\n    align-items: flex-start;\n    justify-content: center;\n    padding: 28px 28px 28px 0;\n  }\n  .duet-banner.size-medium .action, .duet-banner.size-large .action {\n    flex-grow: 0;\n  }\n}\n@container duet-banner-container (min-width: 586px) {\n  .duet-banner.size-medium, .duet-banner.size-large {\n    /* stylelint-enable */\n  }\n  .duet-banner.size-medium .visual .brand-shape, .duet-banner.size-large .visual .brand-shape {\n    left: 80%;\n  }\n}\n.duet-banner.size-large {\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 900px) {\n  .duet-banner.size-large {\n    /* stylelint-enable */\n    grid-template-rows: none;\n    grid-template-columns: 50% 50%;\n  }\n  .duet-banner.size-large .visual {\n    border-top-left-radius: 16px;\n    border-bottom-left-radius: 16px;\n  }\n  .duet-banner.size-large .visual .image-container {\n    height: 100%;\n  }\n  .duet-banner.size-large .visual .image {\n    width: 100%;\n    height: 100%;\n  }\n  .duet-banner.size-large .visual .icon {\n    top: 40px;\n    bottom: auto;\n    left: 335px;\n  }\n  .duet-banner.size-large .visual .brand-shape {\n    display: block;\n  }\n  .duet-banner.size-large .content {\n    align-items: flex-start;\n    justify-content: center;\n    padding: 48px 48px 48px 0;\n  }\n  .duet-banner.size-large .action {\n    flex-grow: 0;\n  }\n}\n.duet-banner.no-image {\n  display: flex;\n  justify-content: center;\n  padding: 36px 20px;\n}\n.duet-banner.no-image .visual {\n  display: none;\n}\n.duet-banner.no-image .content {\n  width: 100%;\n  max-width: 720px;\n  padding: 0;\n}\n.duet-banner.no-image.size-medium, .duet-banner.no-image.size-large {\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 486px) {\n  .duet-banner.no-image.size-medium, .duet-banner.no-image.size-large {\n    /* stylelint-enable */\n    padding: 48px;\n  }\n}";
 const DuetBannerStyle0 = duetBannerCss;
 
 const DuetBanner$1 = /*@__PURE__*/ proxyCustomElement(class DuetBanner extends H {
@@ -102,14 +102,14 @@ const DuetBanner$1 = /*@__PURE__*/ proxyCustomElement(class DuetBanner extends H
             img: { src: this.image, alt: "", loading: "lazy", class: "image", role: "presentation" },
             sources: parsePossibleJSON(this.sources),
         };
-        return (h$1(Host, { key: 'd279b27f54fba40d358a850d94118a0caa571737', class: { "duet-m-0": this.margin === "none" } }, h$1("aside", { key: 'fa270dd8231b5b22d2c0157105df3171fd56f450', class: {
+        return (h$1(Host, { key: '12cea619c3a29693b7bbb7189962468eee715f68', class: { "duet-m-0": this.margin === "none" } }, h$1("aside", { key: 'b4e70162ea52e299c8cc3481961e1354f7a348d0', class: {
                 "duet-banner": true,
                 "duet-theme-turva": this.theme === "turva",
                 [this.currentSize]: true,
                 "size-medium": this.size === "medium" || this.size === "large",
                 "size-large": this.size === "large",
                 "no-image": !this.image,
-            }, style: bannerStyles }, h$1("div", { key: 'c3cbef43ed49f67f5c429692c0d673f65341cbf8', class: "visual" }, h$1("div", { key: '6e1defb61acf399734e5843f100d17a467acc52c', class: "image-container" }, this.image && h$1(DuetPicture, Object.assign({ key: '9b8cf3946c557db548bf9e4a63a9f77e1a528eca' }, pictureSource))), 1 > 2  , h$1("div", { key: 'de431601a73be43d79f29e7e4cc4e943ae00e545', style: bannerStyles, class: "brand-shape" })), h$1("div", { key: '50f7a5fc5f4ade0905bc272e29e7d0c4912c1020', class: "content" }, this.hasHeadingSlot && (h$1("div", { key: '73cd6a4f3f4022f897df0ce57a2316043f403dba', class: "heading" }, h$1("duet-heading", { key: '1d7d47b81255653206534bb228d11e8eee154c2c', theme: this.theme, level: this.headingLevel, "visual-level": this.currentSize === "large" ? "h2" : "h3", "fixed-size": true, margin: "none", color: this.textColor }, h$1("span", { key: 'f340c4b1e80fdd5a64ed8d61512879b290662b37' }, h$1("slot", { key: '2041e9d5b57a5adb5a325e4bf2052cece9d59d83', name: "heading" }))))), this.hasDescriptionSlot && (h$1("div", { key: '77bee71dfd8d16749a238336fb0ca182dc6da387', class: "description", style: { color } }, h$1("slot", { key: 'bc10b7a951bf3ca738bb2214d4f78a2258f373d3', name: "description" }))), this.hasActionSlot && (h$1("div", { key: 'c842a4bd1a20ff10617c0df53b0491e897de4371', class: "action" }, h$1("slot", { key: 'a17d57f164e2973eb0bdaa8902b93eaafdc3b96e', name: "action" })))))));
+            }, style: bannerStyles }, h$1("div", { key: '77b6658e115f6c6ad322e4d81607a842de28ad7f', class: "visual" }, h$1("div", { key: '1140037769c9615f7fc233d5ef7db5e93e5b1434', class: "image-container" }, this.image && h$1(DuetPicture, Object.assign({ key: '63b777ee272d5fe8c7df6f6a8bff7b84a44c9dff' }, pictureSource))), 1 > 2  , h$1("div", { key: '5af78573b362552f7bdc061be9bed68373255aae', style: bannerStyles, class: "brand-shape" })), h$1("div", { key: '99f371a78ff9d7e85cff37c9c5eb2d49f51e7aaa', class: "content" }, this.hasHeadingSlot && (h$1("div", { key: '8684e9cbd15cd42e8bce73271543ce7fc91b63fc', class: "heading" }, h$1("duet-heading", { key: '2d3348662100fc98f088ac9dee4a5a38681ce9d7', theme: this.theme, level: this.headingLevel, "visual-level": this.currentSize === "large" ? "h2" : "h3", "fixed-size": true, margin: "none", color: postfixTheme(this.textColor, this.theme) }, h$1("span", { key: '692332080a527df5d5ed15773ef34efbda983f15' }, h$1("slot", { key: '8a0a0e72edfcf4c55f66b8565fe90b948e86c4bc', name: "heading" }))))), this.hasDescriptionSlot && (h$1("div", { key: 'daba4eb6a51dc590ea3591132b8cddebb5cf9756', class: "description", style: { color } }, h$1("slot", { key: '5d8e3bc1324a170bf266b89e8815896c470a512a', name: "description" }))), this.hasActionSlot && (h$1("div", { key: 'c9d0e0f700ef91081cad82c8edb5db69ee38ef56', class: "action" }, h$1("slot", { key: 'e72dfb579efb7ad822de3f59d3d828fffd3ef015', name: "action" })))))));
     }
     get element() { return this; }
     static get style() { return DuetBannerStyle0; }

package/lib/dist-custom-elements/duet-breadcrumb.js

@@ -1,12 +1,12 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, h, d as Host } from './p-47d05b62.js';
+import { p as proxyCustomElement, H, h, d as Host } from './p-fddb3ec1.js';
 import { i as inheritGlobalTheme } from './p-3757c660.js';
 import { s as subscribeTabbingChange, u as unsubscribeTabbingChange } from './p-8db11326.js';
 import { a as getLanguage, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver, g as getLocaleString } from './p-d9b2e80e.js';
-import { d as defineCustomElement$3 } from './p-aa4ebea4.js';
-import { d as defineCustomElement$2 } from './p-4e53b45e.js';
+import { d as defineCustomElement$3 } from './p-d5c72ea3.js';
+import { d as defineCustomElement$2 } from './p-db2b09ab.js';
 
 var actionArrowRightSmall={"title":"action-arrow-right-small","tags":"action arrow right small caret","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M19.5 12a2.3 2.3 0 0 1-.78 1.729L7.568 23.54a1.847 1.847 0 0 1-2.439-2.773l9.752-8.579a.25.25 0 0 0 0-.376L5.129 3.233A1.847 1.847 0 0 1 7.568.46l11.148 9.808A2.31 2.31 0 0 1 19.5 12z\"/></svg>"};
 
@@ -52,14 +52,14 @@ const DuetBreadcrumb$1 = /*@__PURE__*/ proxyCustomElement(class DuetBreadcrumb e
      */
     render() {
         var _a;
-        return (h(Host, { key: '689d0258e18fdfbbd6f4d01c8ab355a1a8312c2f', role: "listitem" }, h("div", { key: '909354599a3a41ee94fd902605d5299666bd599b', class: "container" }, this.icon === "arrow-right-small-icon" && (h("duet-icon", { key: '9fc66ffab8615edd97b3bedefd33f7fa80491694', class: "duet-breadrumbs-arrow", size: "auto", icon: actionArrowRightSmall.svg, margin: "none", color: "currentColor" })), h("a", { key: 'ed4010eedd8d1da13bde66c21a9885d8831c580b', class: {
+        return (h(Host, { key: 'c2bbd3a09d833237865fbbea918ce71e6e945708', role: "listitem" }, h("div", { key: '1ef1271eba23e853ecd07dca639a1dc249a9047a', class: "container" }, this.icon === "arrow-right-small-icon" && (h("duet-icon", { key: '953679a489bc876ab43d44486de61cbb9f5237aa', class: "duet-breadrumbs-arrow", size: "auto", icon: actionArrowRightSmall.svg, margin: "none", color: "currentColor" })), h("a", { key: '305807ceab521e988a065fc7f0dfeba105afd65f', class: {
                 "duet-breadcrumb": true,
                 "duet-theme-turva": this.theme === "turva",
             }, href: this.href ? this.href : undefined, "aria-label": `${!this.href ? `${getLocaleString(this.currentCrumb)} ` : ""}${(_a = this.accessibleLabel) !== null && _a !== void 0 ? _a : this.element.innerHTML}`, role: "link" }, this.icon !== "arrow-right-small-icon" &&
             this.icon && [
-            h("duet-icon", { key: '9b0d1364911cb1737106f201a2c4db931133f38e', size: this.iconSize, name: this.icon, margin: "none", color: "currentColor" }),
-            this.hasSlottedContent && h("duet-spacer", { key: '27f506daef53b848c270e8be99c0f2aaebb80004', size: "x-small", direction: "horizontal" }),
-        ], h("slot", { key: '2bc8ee802dc29cc82123e91b9178e5f51e9709c9' })))));
+            h("duet-icon", { key: '469e852366ff1d5dc79ef285eb53cff133a4b86a', size: this.iconSize, name: this.icon, margin: "none", color: "currentColor" }),
+            this.hasSlottedContent && h("duet-spacer", { key: 'eff56162ec750f1b4b1053eefd39a3096e6535a1', size: "x-small", direction: "horizontal" }),
+        ], h("slot", { key: '08865bb50c3bfc475427e56afb06baa5796b9e43' })))));
     }
     get element() { return this; }
     static get style() { return DuetBreadcrumbStyle0; }

package/lib/dist-custom-elements/duet-breadcrumbs.js

@@ -1,10 +1,10 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, h, d as Host } from './p-47d05b62.js';
+import { p as proxyCustomElement, H, h, d as Host } from './p-fddb3ec1.js';
 import { i as inheritGlobalTheme } from './p-3757c660.js';
 import { g as getLocaleString } from './p-d9b2e80e.js';
-import { g as getColorByName } from './p-77260ba8.js';
+import { g as getColorByName } from './p-499da71e.js';
 
 const duetBreadcrumbsCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;width:100%}::slotted(*){font-weight:400}::slotted(:last-child){font-weight:600}:host([variation=plain]) ::slotted(:last-child){font-weight:400}.duet-breadcrumbs{position:relative;display:flex;align-items:center;justify-content:center;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-breadcrumbs .container{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;max-width:1384px;min-height:36px;margin:0 28px}.duet-breadcrumbs .list{display:flex;flex-direction:row;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-start;padding:10px 0;color:inherit;list-style:none}.duet-breadcrumbs .bottom-border{position:absolute;bottom:0;display:none;width:100%;height:1px}.duet-breadcrumbs.header{color:rgb(8, 42, 77);background:rgb(240, 247, 250)}.duet-breadcrumbs.header .list duet-breadcrumb[href]:hover{color:rgb(0, 75, 129)}.duet-breadcrumbs.header .bottom-border--nav{display:block;background:rgb(212, 223, 229)}.duet-breadcrumbs.header.duet-theme-turva{color:rgb(23, 28, 58);background:rgb(245, 247, 250)}.duet-breadcrumbs.header.duet-theme-turva ol duet-breadcrumb[href]:hover{color:rgb(126, 2, 35)}.duet-breadcrumbs.footer{color:rgb(255, 255, 255);background:rgb(8, 42, 77)}@media (min-width: 64.0625em){.duet-breadcrumbs.footer{justify-content:flex-start}}@media (min-width: 76.25em){.duet-breadcrumbs.footer{justify-content:center}}.duet-breadcrumbs.footer .container{max-width:1110px}@media (min-width: 62em){.duet-breadcrumbs.footer .container{margin:0 72px 0 48px}}.duet-breadcrumbs.footer .list{padding:20px 0}@media (min-width: 62em){.duet-breadcrumbs.footer .list{padding:20px 8px}}.duet-breadcrumbs.footer .list duet-breadcrumb[href]:hover{text-decoration:underline}.duet-breadcrumbs.footer .bottom-border--container{display:block;background:rgba(255, 255, 255, 0.2)}.duet-breadcrumbs.footer.duet-theme-turva{color:rgb(255, 255, 255);background:rgb(198, 12, 48)}.duet-breadcrumbs.plain .container{max-width:none;min-height:auto;margin:0}.duet-breadcrumbs.plain .list{padding:0}.duet-breadcrumbs.plain .bottom-border{display:none}:host(.duet-theme-turva2) .duet-breadcrumbs.duet-theme-turva.header{color:#172a3b;background:#fdf7f2}:host(.duet-theme-turva2) .duet-breadcrumbs.duet-theme-turva.header ol duet-breadcrumb[href]:hover{color:rgb(126, 2, 35)}:host(.duet-theme-turva2) .duet-breadcrumbs.duet-theme-turva.footer{background:#e61740}";
 const DuetBreadcrumbsStyle0 = duetBreadcrumbsCss;
@@ -54,11 +54,11 @@ const DuetBreadcrumbs$1 = /*@__PURE__*/ proxyCustomElement(class DuetBreadcrumbs
      */
     render() {
         const color = getColorByName(this.color);
-        return (h(Host, { key: '996e5aefa1bd4292a2ef8e9defb42967032c8011' }, h("nav", { key: '5971870c10d1faabc65248ee6113cd8a84e7a2ae', "aria-label": this.breadcrumbsAriaLabel, class: {
+        return (h(Host, { key: 'de5bf9664c5f5ab572fce45bc993713510474cb0' }, h("nav", { key: 'ffd74db147e85616f7e10428bfe537179b168e58', "aria-label": this.breadcrumbsAriaLabel, class: {
                 "duet-breadcrumbs": true,
                 "duet-theme-turva": this.theme === "turva",
                 [this.variation]: true,
-            } }, h("div", { key: 'e13adcf97e2a6fefb2e73a302b09776418d81272', class: "container" }, h("div", { key: 'a628bb7c78faaa9952d40bc5dab4171e1bfb9f00', role: "list", class: "list", style: { color } }, h("slot", { key: 'bde592b8806f2e74c1031d2ac4ca58b2b0279c55' })), h("div", { key: 'c6c7386a1148b7173eae0919a4c3ba7cee0322c1', class: "bottom-border bottom-border--container" })), h("div", { key: '668a74528b4859e29e226f3c33311557191a9bc3', class: "bottom-border bottom-border--nav" }))));
+            } }, h("div", { key: '06d6391d9154c82c9ba8e8c3c4c098f40ea862bc', class: "container" }, h("div", { key: '6e14f970ac38086d9874b6a5fb68c43036891658', role: "list", class: "list", style: { color } }, h("slot", { key: '8d97e7c891b2b78f0efff2e4993ef71a831e062d' })), h("div", { key: '915ea715ad6bbdf67320744cd8e2df75af1a082f', class: "bottom-border bottom-border--container" })), h("div", { key: '8d416d6fca5363df5bd6d1d82b1aad4274588cd8', class: "bottom-border bottom-border--nav" }))));
     }
     get element() { return this; }
     static get style() { return DuetBreadcrumbsStyle0; }

package/lib/dist-custom-elements/duet-button.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetButton$1, d as defineCustomElement$1 } from './p-67e54308.js';
+import { D as DuetButton$1, d as defineCustomElement$1 } from './p-65300e85.js';
 
 const DuetButton = DuetButton$1;
 const defineCustomElement = defineCustomElement$1;

package/lib/dist-custom-elements/duet-callout.js

@@ -1,10 +1,10 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, h, d as Host } from './p-47d05b62.js';
+import { p as proxyCustomElement, H, h, d as Host } from './p-fddb3ec1.js';
 import { i as inheritGlobalTheme } from './p-3757c660.js';
 import { h as hasSlot, c as checkNamedSlotElement } from './p-f21662ea.js';
-import { d as defineCustomElement$2 } from './p-aa4ebea4.js';
+import { d as defineCustomElement$2 } from './p-d5c72ea3.js';
 
 const duetCalloutCss = ":host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;display:block;width:100%}blockquote,figure{margin:0}.duet-callout{margin-bottom:28px !important;display:flex;align-items:center;justify-content:center;width:100%;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-callout .container{display:flex;flex-direction:column;gap:8px;align-items:center;max-width:688px;text-align:center}.duet-callout .callout-icon{width:50px;padding-bottom:8px}.duet-callout blockquote{font-size:2.7vw;font-weight:600;line-height:1.5;color:rgb(8, 42, 77)}@media (max-width: 37.037037037rem){.duet-callout blockquote{font-size:1rem}}@media (min-width: 46.2962962963rem){.duet-callout blockquote{font-size:1.25rem}}.duet-callout .author{color:rgb(8, 42, 77)}.duet-callout.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-callout.duet-theme-turva .author,.duet-callout.duet-theme-turva blockquote{color:rgb(23, 28, 58)}.duet-callout.duet-m-0{margin:0 !important}:host(.duet-theme-turva2) .duet-callout.duet-theme-turva .author,:host(.duet-theme-turva2) .duet-callout.duet-theme-turva blockquote{color:#172a3b}";
 const DuetCalloutStyle0 = duetCalloutCss;
@@ -35,11 +35,11 @@ const DuetCallout$1 = /*@__PURE__*/ proxyCustomElement(class DuetCallout extends
     <path d="M6.6591 0.557547L9.2031 2.33355C7.0911 5.21355 6.1311 7.18155 5.8431 8.90955C7.4751 9.34155 8.7231 10.5415 8.7231 12.6535C8.7231 15.2935 6.9471 16.9255 4.6431 16.9255C2.0511 16.9255 0.227096 15.1975 0.227096 12.2695C0.227096 8.28555 2.3871 4.34955 6.6591 0.557547ZM17.9871 8.95755C19.6191 9.34155 20.8671 10.5415 20.8671 12.6535C20.8671 15.2935 19.1391 16.9255 16.8351 16.9255C14.2431 16.9255 12.4191 15.1975 12.4191 12.2695C12.4191 8.28555 14.5791 4.34955 18.8511 0.557547L21.3951 2.33355C19.2351 5.21355 18.3231 7.18155 17.9871 8.95755Z"/>
     </svg>
     `;
-        return (h(Host, { key: '2d1eadb42a67c31dd1d5e3498f00254e08b9b2cd' }, h("div", { key: '6e5be94e6e61eaf272e52f9de9070f8de6a9484d', class: {
+        return (h(Host, { key: '85f99d167ac281ddceb8a8a69da07d854be973f7' }, h("div", { key: '14ccbc1c5d5f56368fefdcfa8ac2b48f46c3e0b7', class: {
                 "duet-callout": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-m-0": this.margin === "none",
-            } }, h("figure", { key: '1652580bcf78ac7c5ddb8b0a254de66725b98e9b', class: "container" }, h("duet-icon", { key: '541cfe32ac9e9155924e22e7bf00850b70b79602', class: "callout-icon", shape: "brand-rotated", background: "primary-lighter", "background-opacity": "0.75", "background-rotation": this.theme === "turva" ? "0" : "7", color: "secondary", icon: icon, size: "auto", margin: "none", theme: this.theme }), h("blockquote", { key: '59af18b18c95e816e8dc446a3bcbe45f9c13f4fe' }, h("slot", { key: 'f90f9674baa8d9e81c688920babcccc9e3e20468' })), this.hasAuthorSlot && (h("figcaption", { key: 'ee4f1307e15ebfa58d6b7d29a7bdea93b3b5868f', class: "author" }, h("span", { key: 'e6861f2ba21ba016d94cf482d93c614e5433e805' }, "\u2014 "), h("slot", { key: 'c9cede4ee6f69cbf35c591d4c23787ccc7c7c8d1', name: "author" })))))));
+            } }, h("figure", { key: 'fe2a9c932a02907cda19e0f258e36a1c5a83a1bc', class: "container" }, h("duet-icon", { key: 'f9ddcf0c22344b4490cd3433e4d85e644a8b4e63', class: "callout-icon", shape: "brand-rotated", background: "primary-lighter", "background-opacity": "0.75", "background-rotation": this.theme === "turva" ? "0" : "7", color: "secondary", icon: icon, size: "auto", margin: "none", theme: this.theme }), h("blockquote", { key: '11b22131f070c316b6cadd833f0fb5d12bf0ed4a' }, h("slot", { key: '6448a4a8b760c12a583b4454c183f32c26a8e4cf' })), this.hasAuthorSlot && (h("figcaption", { key: '3d98ce3b4e9a1d81ba99d1c8cbb38eacc91bb2d0', class: "author" }, h("span", { key: '9a8f0ab6cbeba79793fbc1926924e4d4acc3cf5b' }, "\u2014 "), h("slot", { key: '928a1113e8f44b3f6439a9ce1ec5f96771b95270', name: "author" })))))));
     }
     get element() { return this; }
     static get style() { return DuetCalloutStyle0; }

package/lib/dist-custom-elements/duet-caption.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetCaption$1, d as defineCustomElement$1 } from './p-de35873c.js';
+import { D as DuetCaption$1, d as defineCustomElement$1 } from './p-dc970fdb.js';
 
 const DuetCaption = DuetCaption$1;
 const defineCustomElement = defineCustomElement$1;

package/lib/dist-custom-elements/duet-card.js

@@ -1,15 +1,15 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, c as createEvent, h, F as Fragment, d as Host } from './p-47d05b62.js';
+import { p as proxyCustomElement, H, c as createEvent, h, F as Fragment, d as Host } from './p-fddb3ec1.js';
 import { i as inheritGlobalTheme } from './p-3757c660.js';
 import { c as createID } from './p-5e59e970.js';
 import { i as isKeyboardClick, s as subscribeTabbingChange, u as unsubscribeTabbingChange } from './p-8db11326.js';
 import { g as getElementsFromNamedSlot } from './p-f21662ea.js';
 import { s as sanitizeString } from './p-9c3c64b9.js';
-import { g as getColorByName } from './p-77260ba8.js';
-import { d as defineCustomElement$3 } from './p-aa4ebea4.js';
-import { d as defineCustomElement$2 } from './p-4e53b45e.js';
+import { g as getColorByName } from './p-499da71e.js';
+import { d as defineCustomElement$3 } from './p-d5c72ea3.js';
+import { d as defineCustomElement$2 } from './p-db2b09ab.js';
 
 const duetHeadingLevels = ["h1", "h2", "h3", "h4", "h5", "h6"];
 const duetBlock = "div";

package/lib/dist-custom-elements/duet-checkbox.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetCheckbox$1, d as defineCustomElement$1 } from './p-0c829768.js';
+import { D as DuetCheckbox$1, d as defineCustomElement$1 } from './p-10893657.js';
 
 const DuetCheckbox = DuetCheckbox$1;
 const defineCustomElement = defineCustomElement$1;

package/lib/dist-custom-elements/duet-checkmark.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetCheckmark$1, d as defineCustomElement$1 } from './p-1271d1b9.js';
+import { D as DuetCheckmark$1, d as defineCustomElement$1 } from './p-778364d6.js';
 
 const DuetCheckmark = DuetCheckmark$1;
 const defineCustomElement = defineCustomElement$1;

package/lib/dist-custom-elements/duet-chip.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetChip$1, d as defineCustomElement$1 } from './p-a000e044.js';
+import { D as DuetChip$1, d as defineCustomElement$1 } from './p-25f8ea4b.js';
 
 const DuetChip = DuetChip$1;
 const defineCustomElement = defineCustomElement$1;

package/lib/dist-custom-elements/duet-choice-group.js

@@ -1,16 +1,16 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, h, d as Host } from './p-47d05b62.js';
+import { p as proxyCustomElement, H, h, d as Host } from './p-fddb3ec1.js';
 import { i as inheritGlobalTheme } from './p-3757c660.js';
 import { c as checkNamedSlotElement } from './p-f21662ea.js';
-import { d as defineCustomElement$8 } from './p-de35873c.js';
-import { d as defineCustomElement$7 } from './p-f7d93067.js';
-import { d as defineCustomElement$6 } from './p-aa4ebea4.js';
-import { d as defineCustomElement$5 } from './p-1027ea53.js';
-import { d as defineCustomElement$4 } from './p-be9b9c9d.js';
-import { d as defineCustomElement$3 } from './p-80bbbb3a.js';
-import { d as defineCustomElement$2 } from './p-911326a0.js';
+import { d as defineCustomElement$8 } from './p-dc970fdb.js';
+import { d as defineCustomElement$7 } from './p-3883f329.js';
+import { d as defineCustomElement$6 } from './p-d5c72ea3.js';
+import { d as defineCustomElement$5 } from './p-f290964d.js';
+import { d as defineCustomElement$4 } from './p-f479ee47.js';
+import { d as defineCustomElement$3 } from './p-85f0068e.js';
+import { d as defineCustomElement$2 } from './p-36f6ec52.js';
 
 const duetChoiceGroupCss = "*.sc-duet-choice-group,*.sc-duet-choice-group::after,*.sc-duet-choice-group::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-choice-group-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;width:100%}.horizontal.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group{display:block;margin-bottom:-12px}.horizontal.sc-duet-choice-group-h .duet-choice-group.duet-no-stacking.sc-duet-choice-group{display:flex}@media (min-width: 48em){.horizontal.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group{margin-bottom:0}}@media (max-width: 35.9375em){.horizontal.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group{display:flex}}.horizontal.duet-choice-group-breakpoint-x-small.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:flex}@media (max-width: 22.5em){.horizontal.duet-choice-group-breakpoint-x-small.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:block}}.horizontal.duet-choice-group-breakpoint-small.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:block}@media (min-width: 36em){.horizontal.duet-choice-group-breakpoint-small.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:flex}}.horizontal.duet-choice-group-breakpoint-medium.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:block}@media (min-width: 48em){.horizontal.duet-choice-group-breakpoint-medium.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:flex}}.horizontal.duet-choice-group-breakpoint-large.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:block}@media (min-width: 62em){.horizontal.duet-choice-group-breakpoint-large.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:flex}}.horizontal.duet-choice-group-breakpoint-x-large.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:block}@media (min-width: 64.0625em){.horizontal.duet-choice-group-breakpoint-x-large.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:flex}}.duet-choice-group.sc-duet-choice-group{position:relative;width:100%;margin-bottom:-12px}";
 const DuetChoiceGroupStyle0 = duetChoiceGroupCss;

package/lib/dist-custom-elements/duet-choice.js

@@ -1,16 +1,16 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-47d05b62.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-fddb3ec1.js';
 import { i as inheritGlobalTheme } from './p-3757c660.js';
 import { D as DuetStringsExternalDefaults } from './p-9b044291.js';
 import { c as createID } from './p-5e59e970.js';
 import { i as isKeyboardClick, a as isQuestionKey, s as subscribeTabbingChange, u as unsubscribeTabbingChange, b as isEscapeKey } from './p-8db11326.js';
 import { g as getLocaleString, a as getLanguage, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './p-d9b2e80e.js';
 import { h as hasSlot } from './p-f21662ea.js';
-import { d as defineCustomElement$4 } from './p-de35873c.js';
-import { d as defineCustomElement$3 } from './p-aa4ebea4.js';
-import { d as defineCustomElement$2 } from './p-4e53b45e.js';
+import { d as defineCustomElement$4 } from './p-dc970fdb.js';
+import { d as defineCustomElement$3 } from './p-d5c72ea3.js';
+import { d as defineCustomElement$2 } from './p-db2b09ab.js';
 
 var messagingInfo={"title":"messaging-info","tags":"messaging info information circle","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M13.5 17.25A2.252 2.252 0 0 1 11.25 15v-3.75h-.75a.75.75 0 0 1 0-1.5h.75c.827 0 1.5.673 1.5 1.5V15c0 .414.336.75.75.75h.75a.75.75 0 0 1 0 1.5z\"/><circle cx=\"11.625\" cy=\"7.125\" r=\"1.125\"/><path d=\"M12 24C5.383 24 0 18.617 0 12S5.383 0 12 0s12 5.383 12 12-5.383 12-12 12zm0-22.5C6.21 1.5 1.5 6.21 1.5 12S6.21 22.5 12 22.5 22.5 17.79 22.5 12 17.79 1.5 12 1.5z\"/></svg>"};
 

package/lib/dist-custom-elements/duet-collapsible.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-47d05b62.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-fddb3ec1.js';
 import { a as actionArrowDownSmall } from './p-115c79b6.js';
 import { f as font_size_medium, t as tokens } from './p-eb60efcc.js';
 import { i as inheritGlobalTheme } from './p-3757c660.js';
@@ -9,8 +9,8 @@ import { c as createID } from './p-5e59e970.js';
 import { i as isKeyboardClick, s as subscribeTabbingChange, u as unsubscribeTabbingChange } from './p-8db11326.js';
 import { h as hasSlot } from './p-f21662ea.js';
 import { s as sanitizeString } from './p-9c3c64b9.js';
-import { d as defineCustomElement$3 } from './p-de35873c.js';
-import { d as defineCustomElement$2 } from './p-aa4ebea4.js';
+import { d as defineCustomElement$3 } from './p-dc970fdb.js';
+import { d as defineCustomElement$2 } from './p-d5c72ea3.js';
 
 const duetCollapsibleCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}::slotted([slot=after-heading]){display:inline-block}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-bottom:16px !important;display:block;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:600;line-height:1.5;color:rgb(8, 42, 77)}:host(.duet-theme-turva){font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}:host(.duet-m-0){margin:0 !important}.duet-collapsible-content{display:none;padding-left:18px;margin-top:8px;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;font-variant-numeric:tabular-nums;-webkit-hyphens:auto;hyphens:auto;line-height:1.5;color:rgb(8, 42, 77)}@media (max-width: 35.9375em){.duet-collapsible-content{font-size:0.875rem}}.duet-collapsible-content.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}:host([open])>.duet-collapsible-content{display:block}.duet-collapsible-heading{-webkit-user-select:none;user-select:none;display:flex;flex-direction:column;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:600;line-height:1.5;color:rgb(8, 42, 77);text-align:left;cursor:pointer;border-radius:4px}.duet-collapsible-heading.full-width{width:100%}.duet-collapsible-heading.duet-collapsible-heading-centered{margin:auto}.duet-collapsible-heading.duet-collapsible-heading-centered .duet-collapsible-heading-caption{margin-inline:auto}.duet-collapsible-heading.duet-collapsible-normal-weight{font-weight:400}.duet-collapsible-heading.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-collapsible-heading .duet-collapsible-heading-content{min-width:0}.duet-collapsible-heading.has-after-heading .duet-collapsible-heading-content+div{margin-left:16px}.duet-collapsible-heading.has-after-heading .duet-collapsible-heading-content+div.float-right{margin-left:auto}.duet-collapsible-heading.has-caption{gap:4px}.duet-collapsible-heading.has-caption .duet-collapsible-heading-caption{margin-left:18px;font-weight:inherit}.duet-collapsible-heading .duet-collapsible-heading-wrapper{display:flex;align-items:center;width:inherit;margin:inherit}.duet-collapsible-heading:focus{outline:0}:host(.user-is-tabbing) .duet-collapsible-heading:focus{border-radius:4px;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-collapsible-heading.duet-theme-turva:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-collapsible-heading-icon{margin-right:8px !important;display:flex;align-items:center;justify-content:center;color:rgb(8, 42, 77);transition:transform 300ms ease}.duet-collapsible-heading-icon:last-child,.duet-collapsible-heading-icon:last-of-type{margin-right:0 !important}[aria-expanded=true] .duet-collapsible-heading-icon{transform:rotate(180deg)}:host(.negative) .duet-collapsible-heading,:host(.negative) .duet-collapsible-content,:host(.negative) .duet-collapsible-heading-icon{color:rgb(255, 255, 255)}:host(.duet-theme-turva2){color:#172a3b}:host(.duet-theme-turva2) .duet-collapsible-content.duet-theme-turva,:host(.duet-theme-turva2) .duet-collapsible-heading.duet-theme-turva{color:rgb(23, 28, 58)}";
 const DuetCollapsibleStyle0 = duetCollapsibleCss;