@duetds/components 4.32.0 → 4.34.0

package/hydrate/index.js

@@ -6,7 +6,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 /*!
- Stencil Mock Doc v2.10.0 | MIT Licensed | https://stenciljs.com
+ Stencil Mock Doc v2.12.1 | MIT Licensed | https://stenciljs.com
  */
 const CONTENT_REF_ID = 'r';
 const ORG_LOCATION_ID = 'o';
@@ -551,7 +551,7 @@ class MockCSSStyleDeclaration {
         const splt = rule.split(':');
         if (splt.length > 1) {
           const prop = splt[0].trim();
-          const value = splt[1].trim();
+          const value = splt.slice(1).join(':').trim();
           if (prop !== '' && value !== '') {
             this._styles.set(jsCaseToCssCase(prop), value);
           }
@@ -1514,6 +1514,9 @@ class MockNode {
     return null;
   }
   contains(otherNode) {
+    if (otherNode === this) {
+      return true;
+    }
     return this.childNodes.includes(otherNode);
   }
   removeChild(childNode) {
@@ -4701,7 +4704,7 @@ function hydrateFactory($stencilWindow, $stencilHydrateOpts, $stencilHydrateResu
 
 
 const NAMESPACE = 'duet';
-const BUILD = /* duet */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: true, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: true, constructableCSS: false, cssAnnotations: true, cssVarShim: false, devTools: false, disconnectedCallback: true, dynamicImportShim: false, element: false, event: true, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: true, hostListenerTargetDocument: true, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: true, hydrateServerSide: true, hydratedAttribute: false, hydratedClass: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, safari10: false, scoped: true, scriptDataOpts: false, shadowDelegatesFocus: true, shadowDom: true, shadowDomShim: true, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: true, taskQueue: true, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: true, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
+const BUILD = /* duet */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: true, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: true, cmpWillUpdate: false, connectedCallback: true, constructableCSS: false, cssAnnotations: true, cssVarShim: false, devTools: false, disconnectedCallback: true, dynamicImportShim: false, element: false, event: true, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: true, hostListenerTargetDocument: true, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: true, hydrateServerSide: true, hydratedAttribute: false, hydratedClass: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, safari10: false, scoped: true, scriptDataOpts: false, shadowDelegatesFocus: true, shadowDom: true, shadowDomShim: true, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: true, taskQueue: true, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: true, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
 
 const TAB_KEY = 9;
 var appGlobalScript = () => {
@@ -5170,7 +5173,8 @@ const createElm = (e, t, o, n) => {
  const n = createTime("scheduleUpdate", e.$cmpMeta$.$tagName$), s = e.$lazyInstance$ ;
  let l;
  return t ? ((e.$flags$ |= 256, e.$queuedListeners$ && (e.$queuedListeners$.map((([e, t]) => safeCall(s, e, t))), 
- e.$queuedListeners$ = null)), (l = safeCall(s, "componentWillLoad"))) : (BUILD.cmpWillUpdate ), n(), then(l, (() => updateComponent(e, s, t)));
+ e.$queuedListeners$ = null)), (l = safeCall(s, "componentWillLoad"))) : (BUILD.cmpWillUpdate ), (l = then(l, (() => safeCall(s, "componentWillRender")))), 
+ n(), then(l, (() => updateComponent(e, s, t)));
 }, updateComponent = async (e, t, o) => {
  const n = e.$hostElement$, s = createTime("update", e.$cmpMeta$.$tagName$), l = n["s-rc"];
  o && attachStyles(e);
@@ -5635,6 +5639,9 @@ const getLocale = (lang) => {
   }
   throw new Error(`Locale for "${lang}" not found`);
 };
+/**
+ * Takes any json object that is passed and/or htmlencoded and converts it to proper json
+ */
 const sanitizeString = (string) => {
   const argIsString = typeof string === "string";
   if (argIsString) {
@@ -5642,7 +5649,7 @@ const sanitizeString = (string) => {
       return JSON.parse(convertHtmlQuotes(string));
     }
     catch (e) {
-      console.log("getLocaleString received a string, that didnt parse to json object", string, e);
+      console.log("sanitizeString received a string, that didnt parse to json object", string, e);
     }
   }
   return string;
@@ -5654,7 +5661,7 @@ const sanitizeString = (string) => {
  * @param {object} langObject - {fi: "finnish", sv: "swedish", en: "english"} | string will get JSON.parsed
  * @param {boolean} languageOverride = false - in case you want to override the actual language set in html tag
  * @default {object} {locale: "fi-FI", money: "€"}
- * @returns {(string|Object)} given example contains {fi:"something"} and langua===fi this will return "something"
+ * @returns {(string|Object)} given example contains {fi:"something"} and language===fi this will return "something"
  */
 const getLocaleString = (langObject, languageOverride) => {
   const obj = sanitizeString(langObject);
@@ -5962,6 +5969,7 @@ const sizeTappableSquare = "48px";
 const sizeIconXSmall = "16px";
 const sizeIconXxxSmall = "7px";
 const sizeButtonBorder = "2px";
+const sizeButtonTinyBorder = "1px";
 const sizeIconMedium = "24px";
 const sizeIconSmall = "20px";
 const opacity85 = "0.85";
@@ -6111,6 +6119,7 @@ var tokens$2 = /*#__PURE__*/Object.freeze({
   sizeIconXSmall: sizeIconXSmall,
   sizeIconXxxSmall: sizeIconXxxSmall,
   sizeButtonBorder: sizeButtonBorder,
+  sizeButtonTinyBorder: sizeButtonTinyBorder,
   sizeIconMedium: sizeIconMedium,
   sizeIconSmall: sizeIconSmall,
   opacity85: opacity85,
@@ -6144,26 +6153,73 @@ var tokens$2 = /*#__PURE__*/Object.freeze({
   mediaQueryXxxLarge: mediaQueryXxxLarge
 });
 
-const MATCH_DASH_CASE = /-([a-z])/g;
-function replaceDashCase(g) {
-  return g[1].toUpperCase();
+const allowedThemes = ["turva"];
+function isDashCase(str) {
+  const dash = str.includes("-");
+  const barredString = str.includes(" ") || str.includes("_");
+  const barredStartingString = str.charAt(0) === "-";
+  return dash && !barredString && !barredStartingString;
+}
+function capitalize(str = "") {
+  return `${str.charAt(0).toUpperCase()}${str.slice(1)}`;
+}
+function lowerCaseFirst(str = "") {
+  return `${str.charAt(0).toLowerCase()}${str.slice(1)}`;
+}
+function camelize(str = "") {
+  const arr = str.split("-");
+  //loop through each element of the array and capitalize the first letter.'
+  arr.forEach((string, index) => {
+    arr[index] = capitalize(string);
+  });
+  return arr.join("");
 }
-function convertToCamelCase(string) {
-  return string.replace(MATCH_DASH_CASE, replaceDashCase);
+function getTheme(theme = "") {
+  if (allowedThemes.includes(theme.toLowerCase())) {
+    return theme.toLowerCase();
+  }
+  return "";
+}
+function hasColor(str = "") {
+  return str.indexOf("Color") === 0 || str.indexOf("color") === 0;
 }
-function convertToColorName(name) {
-  if (name.indexOf("color-") === -1 && name.indexOf("-") !== -1) {
-    return convertToCamelCase(`color-${name}`);
+function addColor(str = "") {
+  if (str && !isDashCase(str) && !hasColor(str)) {
+    return `color${capitalize(str)}`;
   }
-  if (name.indexOf("color") === -1) {
-    return convertToCamelCase(`color${name.charAt(0).toUpperCase()}${name.slice(1)}`);
+  return str;
+}
+function addTheme(str, theme) {
+  const hasTheme = getTheme(theme).length;
+  if (hasTheme && str.indexOf(theme) === -1) {
+    return `${str}${capitalize(theme)}`;
   }
-  return convertToCamelCase(name);
+  return str;
 }
-function getColorByName(name) {
-  if (name) {
-    return tokens$2[convertToColorName(name)];
+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$2[themedColor];
+  if (!resolvedToken) {
+    resolvedToken = tokens$2[defaultColor];
+  }
+  return resolvedToken;
+}
+function convertToColorName(name = "", theme = "") {
+  let colorResolution = name;
+  const dash = isDashCase(name);
+  if (dash) {
+    colorResolution = camelize(colorResolution);
+  }
+  colorResolution = addColor(colorResolution);
+  colorResolution = addTheme(colorResolution, theme);
+  // takes care of the case where colorPrimaryDark ends up with ColorPrimaryDark
+  colorResolution = lowerCaseFirst(colorResolution);
+  return colorResolution;
 }
 
 const duetButtonCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-button,*.sc-duet-button::after,*.sc-duet-button::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-button-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:8px !important;margin-bottom:12px !important;position:relative;z-index:1;display:inline-flex;width:auto;max-width:100%;vertical-align:bottom;-webkit-tap-highlight-color:transparent}/*!@:host:last-child, :host:last-of-type*/.sc-duet-button-h:last-child,.sc-duet-button-h:last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){/*!@:host*/.sc-duet-button-h{width:100%}}/*!@:host(.duet-small)*/.duet-small.sc-duet-button-h{margin-right:2px !important;margin-bottom:8px !important}/*!@:host(.duet-small):last-child, :host(.duet-small):last-of-type*/.duet-small.sc-duet-button-h:last-child,.duet-small.sc-duet-button-h:last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){/*!@:host(.duet-small)*/.duet-small.sc-duet-button-h{width:auto}}/*!@:host(.duet-expand)*/.duet-expand.sc-duet-button-h{width:100% !important}/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-button-h{margin:0 !important}/*!@:host(.duet-fixed)*/.duet-fixed.sc-duet-button-h{width:auto !important}/*!@:host(:last-child)*/.sc-duet-button-h:last-child{margin-right:0 !important}/*!@.duet-button-container*/.duet-button-container.sc-duet-button{position:relative;width:100%}/*!@.duet-button*/.duet-button.sc-duet-button{padding:14px 27px 15px !important;-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:block;width:100%;min-width:8rem;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;font-variant-numeric:tabular-nums;-webkit-hyphens:auto;hyphens:auto;line-height:1.1;color:#0077b3 !important;text-align:center;text-decoration:none;cursor:pointer;background:transparent;border-style:solid;border-width:2px;border-radius:20rem;transition:background-color 300ms ease, color 300ms ease, border 300ms ease, box-shadow 300ms ease}/*!@.duet-button.duet-p-0*/.duet-button.duet-p-0.sc-duet-button{padding:0 !important}/*!@.duet-button.duet-m-0*/.duet-button.duet-m-0.sc-duet-button{margin:0 !important}/*!@.duet-button.duet-button-is-small:not(.duet-button-icon-only)*/.duet-button.duet-button-is-small.sc-duet-button:not(.duet-button-icon-only){padding:9px 19px 10px !important;min-width:5.3333333333rem;font-size:0.875rem}/*!@.duet-button.duet-button-is-small:not(.duet-button-icon-only).icon*/.duet-button.duet-button-is-small.sc-duet-button:not(.duet-button-icon-only).icon{padding-left:48px !important}/*!@.duet-button.duet-button-is-small:not(.duet-button-icon-only).icon-right*/.duet-button.duet-button-is-small.sc-duet-button:not(.duet-button-icon-only).icon-right{padding-right:48px !important;padding-left:20px !important}/*!@.duet-theme-turva .duet-button*/.duet-theme-turva.sc-duet-button .duet-button.sc-duet-button{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#c60c30 !important}/*!@.duet-button .duet-button-contents*/.duet-button.sc-duet-button .duet-button-contents.sc-duet-button{position:relative;display:inline-block;margin:0 auto;pointer-events:none}/*!@.duet-button.duet-no-wrap*/.duet-button.duet-no-wrap.sc-duet-button{white-space:nowrap}/*!@.duet-button.icon*/.duet-button.icon.sc-duet-button{padding-left:52px !important}/*!@.duet-button.icon-right*/.duet-button.icon-right.sc-duet-button{padding-right:52px !important;padding-left:28px !important}/*!@.duet-button svg*/.duet-button.sc-duet-button svg.sc-duet-button{width:100%;min-width:100%;fill:currentColor}/*!@.duet-button .duet-button-icon*/.duet-button.sc-duet-button .duet-button-icon.sc-duet-button{position:absolute;top:50%;left:-28px;display:flex;align-items:center;justify-content:center;width:16px;height:16px;margin:0 !important;transform:translateY(-50%)}/*!@.duet-button .duet-button-icon duet-icon*/.duet-button.sc-duet-button .duet-button-icon.sc-duet-button duet-icon.sc-duet-button{width:16px;height:16px}/*!@.duet-button .duet-button-icon.right*/.duet-button.sc-duet-button .duet-button-icon.right.sc-duet-button{right:-28px;left:auto}/*!@.duet-button .duet-button-icon.large*/.duet-button.sc-duet-button .duet-button-icon.large.sc-duet-button{left:-32px;width:20px;height:20px}/*!@.duet-button .duet-button-icon.large duet-icon*/.duet-button.sc-duet-button .duet-button-icon.large.sc-duet-button duet-icon.sc-duet-button{width:20px;height:20px}/*!@.duet-button .duet-button-icon.large.right*/.duet-button.sc-duet-button .duet-button-icon.large.right.sc-duet-button{right:-32px;left:auto}/*!@.duet-button .duet-button-icon.medium-small*/.duet-button.sc-duet-button .duet-button-icon.medium-small.sc-duet-button{left:-16px;width:10px;height:10px;padding-top:1px}/*!@.duet-button .duet-button-icon.medium-small duet-icon*/.duet-button.sc-duet-button .duet-button-icon.medium-small.sc-duet-button duet-icon.sc-duet-button{width:10px;height:10px}/*!@.duet-button .duet-button-icon.medium-small.right*/.duet-button.sc-duet-button .duet-button-icon.medium-small.right.sc-duet-button{right:-16px;left:auto}/*!@.duet-button .duet-button-icon.small*/.duet-button.sc-duet-button .duet-button-icon.small.sc-duet-button{left:-16px;width:7px;height:7px}/*!@.duet-button .duet-button-icon.small duet-icon*/.duet-button.sc-duet-button .duet-button-icon.small.sc-duet-button duet-icon.sc-duet-button{width:7px;height:7px}/*!@.duet-button .duet-button-icon.small.right*/.duet-button.sc-duet-button .duet-button-icon.small.right.sc-duet-button{right:-16px;left:auto}/*!@.duet-button:focus*/.duet-button.sc-duet-button:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@.duet-theme-turva .duet-button:focus*/.duet-theme-turva.sc-duet-button .duet-button.sc-duet-button:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-button:active*/.duet-button.sc-duet-button:active{opacity:0.75;transition:none}/*!@.duet-button.default*/.duet-button.default.sc-duet-button{border-color:#e1e3e6}/*!@.duet-theme-turva .duet-button.default*/.duet-theme-turva.sc-duet-button .duet-button.default.sc-duet-button{color:#c60c30 !important;border-color:#e4e4e6}/*!@.duet-button.default:hover*/.duet-button.default.sc-duet-button:hover{border-color:#0077b3}/*!@.duet-theme-turva .duet-button.default:hover*/.duet-theme-turva.sc-duet-button .duet-button.default.sc-duet-button:hover{border-color:#c60c30}/*!@.duet-button.default.duet-button-negative*/.duet-button.default.duet-button-negative.sc-duet-button{background-color:white}/*!@.duet-theme-turva .duet-button.default.duet-button-negative*/.duet-theme-turva.sc-duet-button .duet-button.default.duet-button-negative.sc-duet-button{background-color:#e4e4e6 !important}/*!@.duet-button.default.duet-button-negative:hover*/.duet-button.default.duet-button-negative.sc-duet-button:hover{color:#0077b3 !important;border-color:#0077b3}/*!@.duet-theme-turva .duet-button.default.duet-button-negative:hover*/.duet-theme-turva.sc-duet-button .duet-button.default.duet-button-negative.sc-duet-button:hover{color:#c60c30 !important;border-color:#c60c30}/*!@.duet-button.primary*/.duet-button.primary.sc-duet-button{color:white !important;background:#0077b3;border-color:#0077b3}/*!@.duet-theme-turva .duet-button.primary*/.duet-theme-turva.sc-duet-button .duet-button.primary.sc-duet-button{color:white !important;background:#c60c30;border-color:#c60c30}/*!@.duet-button.primary:hover*/.duet-button.primary.sc-duet-button:hover{background:#005f8f;border-color:#005f8f;box-shadow:0 4px 20px rgba(34, 34, 34, 0.1)}/*!@.duet-theme-turva .duet-button.primary:hover*/.duet-theme-turva.sc-duet-button .duet-button.primary.sc-duet-button:hover{background:#940925;border-color:#940925}/*!@.duet-button.primary:focus*/.duet-button.primary.sc-duet-button:focus{outline:0;box-shadow:0 0 0 1px white, 0 0 0 4px rgba(0, 119, 179, 0.75)}/*!@.duet-theme-turva .duet-button.primary:focus*/.duet-theme-turva.sc-duet-button .duet-button.primary.sc-duet-button:focus{box-shadow:0 0 0 1px white, 0 0 0 4px rgba(23, 28, 58, 0.7)}/*!@.duet-button.secondary*/.duet-button.secondary.sc-duet-button{color:#00294d !important;background:transparent;border-color:#00294d}/*!@.duet-theme-turva .duet-button.secondary*/.duet-theme-turva.sc-duet-button .duet-button.secondary.sc-duet-button{color:#171c3a !important;border-color:#171c3a}/*!@.duet-button.secondary:hover*/.duet-button.secondary.sc-duet-button:hover{color:#0077b3 !important;border-color:#0077b3}/*!@.duet-theme-turva .duet-button.secondary:hover*/.duet-theme-turva.sc-duet-button .duet-button.secondary.sc-duet-button:hover{color:#c60c30 !important;border-color:#c60c30}/*!@.duet-button.secondary.duet-button-negative*/.duet-button.secondary.duet-button-negative.sc-duet-button{color:#e1e3e6 !important;border-color:white}/*!@.duet-theme-turva .duet-button.secondary.duet-button-negative*/.duet-theme-turva.sc-duet-button .duet-button.secondary.duet-button-negative.sc-duet-button{color:#e4e4e6 !important}/*!@.duet-button.secondary.duet-button-negative:hover*/.duet-button.secondary.duet-button-negative.sc-duet-button:hover{color:#0077b3 !important;border-color:#0077b3}/*!@.duet-theme-turva .duet-button.secondary.duet-button-negative:hover*/.duet-theme-turva.sc-duet-button .duet-button.secondary.duet-button-negative.sc-duet-button:hover{color:#c60c30 !important;border-color:#c60c30}/*!@.duet-button.negative*/.duet-button.negative.sc-duet-button{color:#00294d !important;background:white;border-color:white}/*!@.duet-theme-turva .duet-button.negative*/.duet-theme-turva.sc-duet-button .duet-button.negative.sc-duet-button{color:#171c3a !important}/*!@.duet-button.negative:hover*/.duet-button.negative.sc-duet-button:hover{color:white !important;background:transparent;border-color:white}/*!@.duet-button.negative:focus*/.duet-button.negative.sc-duet-button:focus{outline:0;box-shadow:0 0 0 1px #00294d, 0 0 0 4px rgba(255, 255, 255, 0.7)}/*!@.duet-theme-turva .duet-button.negative:focus*/.duet-theme-turva.sc-duet-button .duet-button.negative.sc-duet-button:focus{box-shadow:0 0 0 1px #171c3a, 0 0 0 4px rgba(255, 255, 255, 0.7)}/*!@.duet-button.destructive*/.duet-button.destructive.sc-duet-button{color:#de2362 !important;background:white;border-color:#de2362}/*!@.duet-theme-turva .duet-button.destructive*/.duet-theme-turva.sc-duet-button .duet-button.destructive.sc-duet-button{color:#e02a0d !important;background:white;border-color:#e02a0d}/*!@.duet-button.destructive:hover*/.duet-button.destructive.sc-duet-button:hover{color:white !important;background:#b21c4e;border-color:#b21c4e}/*!@.duet-theme-turva .duet-button.destructive:hover*/.duet-theme-turva.sc-duet-button .duet-button.destructive.sc-duet-button:hover{color:white !important;background:#b3220a;border-color:#b3220a}/*!@.duet-button.plain*/.duet-button.plain.sc-duet-button{min-width:48px;padding-right:0 !important;padding-left:0 !important;line-height:1.5;text-align:left;background:transparent;border:0;border-color:transparent;border-radius:4px}/*!@.duet-theme-turva .duet-button.plain*/.duet-theme-turva.sc-duet-button .duet-button.plain.sc-duet-button{color:#c60c30 !important;background:transparent;border-color:transparent}/*!@.duet-button.plain.icon*/.duet-button.plain.icon.sc-duet-button{padding-left:20px !important}/*!@.duet-button.plain.icon.icon-right*/.duet-button.plain.icon.icon-right.sc-duet-button{padding-right:20px !important;padding-left:0 !important}/*!@.duet-button.plain.icon.medium*/.duet-button.plain.icon.medium.sc-duet-button{padding-left:24px !important}/*!@.duet-button.plain.icon.medium.icon-right*/.duet-button.plain.icon.medium.icon-right.sc-duet-button{padding-right:24px !important;padding-left:0 !important}/*!@.duet-button.plain.icon.large*/.duet-button.plain.icon.large.sc-duet-button{padding-left:30px !important}/*!@.duet-button.plain.icon.large.icon-right*/.duet-button.plain.icon.large.icon-right.sc-duet-button{padding-right:30px !important;padding-left:0 !important}/*!@.duet-button.plain .duet-button-icon.left*/.duet-button.plain.sc-duet-button .duet-button-icon.left.sc-duet-button{left:-16.6666666667px !important}/*!@.duet-button.plain .duet-button-icon.left.medium*/.duet-button.plain.sc-duet-button .duet-button-icon.left.medium.sc-duet-button{left:-24px !important}/*!@.duet-button.plain .duet-button-icon.left.large*/.duet-button.plain.sc-duet-button .duet-button-icon.left.large.sc-duet-button{left:-30px !important}/*!@.duet-button.plain .duet-button-icon.right*/.duet-button.plain.sc-duet-button .duet-button-icon.right.sc-duet-button{right:-16.6666666667px !important}/*!@.duet-button.plain .duet-button-icon.right.medium*/.duet-button.plain.sc-duet-button .duet-button-icon.right.medium.sc-duet-button{right:-24px !important}/*!@.duet-button.plain .duet-button-icon.right.large*/.duet-button.plain.sc-duet-button .duet-button-icon.right.large.sc-duet-button{right:-30px !important}/*!@.duet-button.plain[disabled]*/.duet-button.plain[disabled].sc-duet-button{color:#657787 !important;background:transparent !important;border-color:transparent !important}/*!@.duet-theme-turva .duet-button.plain[disabled]*/.duet-theme-turva.sc-duet-button .duet-button.plain[disabled].sc-duet-button{color:transparent !important;background:transparent !important;border-color:#e4e4e6 !important}/*!@.duet-button.plain:hover*/.duet-button.plain.sc-duet-button:hover{color:#004d80 !important;background:transparent !important}/*!@.duet-theme-turva .duet-button.plain:hover*/.duet-theme-turva.sc-duet-button .duet-button.plain.sc-duet-button:hover{color:#940925 !important}/*!@.duet-button.plain.duet-button-negative*/.duet-button.plain.duet-button-negative.sc-duet-button{color:white !important}/*!@.duet-theme-turva .duet-button.plain.duet-button-negative*/.duet-theme-turva.sc-duet-button .duet-button.plain.duet-button-negative.sc-duet-button{color:#e4e4e6 !important}/*!@.duet-button.plain.duet-button-negative:hover*/.duet-button.plain.duet-button-negative.sc-duet-button:hover{color:#0077b3 !important}/*!@.duet-theme-turva .duet-button.plain.duet-button-negative:hover*/.duet-theme-turva.sc-duet-button .duet-button.plain.duet-button-negative.sc-duet-button:hover{color:#c60c30 !important}/*!@.duet-button.duet-button-icon-only*/.duet-button.duet-button-icon-only.sc-duet-button{min-width:48px;min-height:48px;padding:0 !important}/*!@.duet-button.duet-button-icon-only .duet-button-contents*/.duet-button.duet-button-icon-only.sc-duet-button .duet-button-contents.sc-duet-button{position:static}/*!@.duet-button.duet-button-icon-only .duet-button-icon.left.large,\n.duet-button.duet-button-icon-only .duet-button-icon.left.medium,\n.duet-button.duet-button-icon-only .duet-button-icon.left.small*/.duet-button.duet-button-icon-only.sc-duet-button .duet-button-icon.left.large.sc-duet-button,.duet-button.duet-button-icon-only.sc-duet-button .duet-button-icon.left.medium.sc-duet-button,.duet-button.duet-button-icon-only.sc-duet-button .duet-button-icon.left.small.sc-duet-button{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}/*!@.duet-button[disabled], .duet-button[disabled]:hover, .duet-button.duet-button-negative[disabled], .duet-button.duet-button-negative[disabled]:hover*/.duet-button[disabled].sc-duet-button,.duet-button[disabled].sc-duet-button:hover,.duet-button.duet-button-negative[disabled].sc-duet-button,.duet-button.duet-button-negative[disabled].sc-duet-button:hover{color:#657787 !important;background:#e1e3e6 !important;border-color:#e1e3e6 !important;box-shadow:none !important}/*!@.duet-theme-turva .duet-button[disabled], .duet-theme-turva .duet-button[disabled]:hover, .duet-theme-turva .duet-button.duet-button-negative [disabled], .duet-theme-turva .duet-button.duet-button-negative [disabled]:hover*/.duet-theme-turva.sc-duet-button .duet-button[disabled].sc-duet-button,.duet-theme-turva.sc-duet-button .duet-button[disabled].sc-duet-button:hover,.duet-theme-turva.sc-duet-button .duet-button.duet-button-negative.sc-duet-button [disabled].sc-duet-button,.duet-theme-turva.sc-duet-button .duet-button.duet-button-negative.sc-duet-button [disabled].sc-duet-button:hover{color:#747475 !important;background:#e4e4e6 !important;border-color:#e4e4e6 !important}/*!@.duet-button-is-loading.primary*/.duet-button-is-loading.primary.sc-duet-button{color:white}/*!@.duet-button-is-loading.default*/.duet-button-is-loading.default.sc-duet-button{color:#0077b3}/*!@.duet-button-is-loading.default.duet-theme-turva*/.duet-button-is-loading.default.duet-theme-turva.sc-duet-button{color:#c60c30}/*!@.duet-button-is-loading .duet-button-contents*/.duet-button-is-loading.sc-duet-button .duet-button-contents.sc-duet-button{visibility:hidden;opacity:0}";
@@ -6676,7 +6732,7 @@ class DuetCard {
   }; }
 }
 
-const duetCheckboxCss = "*.sc-duet-checkbox,*.sc-duet-checkbox::after,*.sc-duet-checkbox::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-checkbox-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:8px !important;margin-bottom:12px !important;display:inline-flex;width:100%;vertical-align:bottom;-webkit-tap-highlight-color:transparent}.sc-duet-checkbox-h:last-child,.sc-duet-checkbox-h:last-of-type{margin-right:0 !important}.sc-duet-checkbox-h:last-of-type:not(:only-child){margin-bottom:0 !important}.duet-m-0.sc-duet-checkbox-h{margin:0 !important}.duet-label.sc-duet-checkbox{position:relative;z-index:100;display:inline;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;line-height:1.5;color:#00294d;vertical-align:top;cursor:pointer;background:transparent;transition:300ms ease}.duet-theme-turva.sc-duet-checkbox .duet-label.sc-duet-checkbox{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}.duet-label.sc-duet-checkbox span.sc-duet-checkbox{display:inline-block;width:calc(100% - 32px);font-size:1rem;font-weight:400;vertical-align:top}.duet-checkbox-container.sc-duet-checkbox{position:relative;width:100%;height:100%}.duet-checkbox.sc-duet-checkbox{padding:14px !important;position:absolute;top:0;left:0;z-index:2;width:100%;height:100%;cursor:pointer;opacity:0}.duet-checkbox.sc-duet-checkbox+label.sc-duet-checkbox::before{z-index:100;display:inline-block;width:20px;height:20px;margin:2px 10px 1px 1px;vertical-align:top;content:\"\";background:white;border:1px solid #00294d;border-radius:4px}.duet-theme-turva.sc-duet-checkbox .duet-checkbox.sc-duet-checkbox+label.sc-duet-checkbox::before{border-color:#171c3a}.duet-checkbox.sc-duet-checkbox:checked+label.sc-duet-checkbox::before{background:#00294d;border:1px solid #00294d}.duet-theme-turva.sc-duet-checkbox .duet-checkbox.sc-duet-checkbox:checked+label.sc-duet-checkbox::before{background:#171c3a;border-color:#171c3a}.duet-checkbox.sc-duet-checkbox:focus+label.sc-duet-checkbox::before{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva.sc-duet-checkbox .duet-checkbox.sc-duet-checkbox:focus+label.sc-duet-checkbox::before{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-checkbox.sc-duet-checkbox+label.sc-duet-checkbox{position:static}.duet-checkbox.sc-duet-checkbox:checked+label.sc-duet-checkbox::after{position:absolute;top:6px;left:5px;z-index:200;width:12px;height:12px;pointer-events:none;content:\"\";background:transparent url(\"data:image/svg+xml,%3Csvg%20fill%3D%27white%27%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M23.374.287a1.5%2C1.5%2C0%2C0%2C0-2.093.345L7.246%2C20.2%2C2.561%2C15.511A1.5%2C1.5%2C0%2C1%2C0%2C.439%2C17.632l5.935%2C5.934a1.525%2C1.525%2C0%2C0%2C0%2C2.279-.186l15.066-21A1.5%2C1.5%2C0%2C0%2C0%2C23.374.287Z%27%20%2F%3E%3C%2Fsvg%3E\") no-repeat 0 0;background-size:100% auto}.duet-checkbox[disabled].sc-duet-checkbox{cursor:default}.duet-checkbox[disabled].sc-duet-checkbox+label.sc-duet-checkbox{color:#657787}.duet-theme-turva.sc-duet-checkbox .duet-checkbox[disabled].sc-duet-checkbox+label.sc-duet-checkbox{color:#747475}.duet-checkbox[disabled].sc-duet-checkbox+label.sc-duet-checkbox::before{border-color:#cfd2d4}.duet-theme-turva.sc-duet-checkbox .duet-checkbox[disabled].sc-duet-checkbox+label.sc-duet-checkbox::before{border-color:#cfcfd1}.duet-checkbox[disabled].sc-duet-checkbox:checked+label.sc-duet-checkbox::before{background:#657787;border:1px solid #657787}.duet-theme-turva.sc-duet-checkbox .duet-checkbox[disabled].sc-duet-checkbox:checked+label.sc-duet-checkbox::before{background:#747475;border-color:#747475}.duet-label-hidden.sc-duet-checkbox .duet-label.sc-duet-checkbox span.sc-duet-checkbox{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}";
+const duetCheckboxCss = "*.sc-duet-checkbox,*.sc-duet-checkbox::after,*.sc-duet-checkbox::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-checkbox-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:8px !important;margin-bottom:12px !important;display:inline-flex;width:100%;vertical-align:bottom;-webkit-tap-highlight-color:transparent}.sc-duet-checkbox-h:last-child,.sc-duet-checkbox-h:last-of-type{margin-right:0 !important}.sc-duet-checkbox-h:last-child:not(:only-child){margin-bottom:0 !important}.duet-m-0.sc-duet-checkbox-h{margin:0 !important}.duet-label.sc-duet-checkbox{position:relative;z-index:100;display:inline;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;line-height:1.5;color:#00294d;vertical-align:top;cursor:pointer;background:transparent;transition:300ms ease}.duet-theme-turva.sc-duet-checkbox .duet-label.sc-duet-checkbox{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}.duet-label.sc-duet-checkbox span.sc-duet-checkbox{display:inline-block;width:calc(100% - 32px);font-size:1rem;font-weight:400;vertical-align:top}.duet-checkbox-container.sc-duet-checkbox{position:relative;width:100%;height:100%}.duet-checkbox.sc-duet-checkbox{padding:14px !important;position:absolute;top:0;left:0;z-index:2;width:100%;height:100%;cursor:pointer;opacity:0}.duet-checkbox.sc-duet-checkbox+label.sc-duet-checkbox::before{z-index:100;display:inline-block;width:20px;height:20px;margin:2px 10px 1px 1px;vertical-align:top;content:\"\";background:white;border:1px solid #00294d;border-radius:4px}.duet-theme-turva.sc-duet-checkbox .duet-checkbox.sc-duet-checkbox+label.sc-duet-checkbox::before{border-color:#171c3a}.duet-checkbox.sc-duet-checkbox:checked+label.sc-duet-checkbox::before{background:#00294d;border:1px solid #00294d}.duet-theme-turva.sc-duet-checkbox .duet-checkbox.sc-duet-checkbox:checked+label.sc-duet-checkbox::before{background:#171c3a;border-color:#171c3a}.duet-checkbox.sc-duet-checkbox:focus+label.sc-duet-checkbox::before{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva.sc-duet-checkbox .duet-checkbox.sc-duet-checkbox:focus+label.sc-duet-checkbox::before{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-checkbox.sc-duet-checkbox+label.sc-duet-checkbox{position:static}.duet-checkbox.sc-duet-checkbox:checked+label.sc-duet-checkbox::after{position:absolute;top:6px;left:5px;z-index:200;width:12px;height:12px;pointer-events:none;content:\"\";background:transparent url(\"data:image/svg+xml,%3Csvg%20fill%3D%27white%27%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M23.374.287a1.5%2C1.5%2C0%2C0%2C0-2.093.345L7.246%2C20.2%2C2.561%2C15.511A1.5%2C1.5%2C0%2C1%2C0%2C.439%2C17.632l5.935%2C5.934a1.525%2C1.525%2C0%2C0%2C0%2C2.279-.186l15.066-21A1.5%2C1.5%2C0%2C0%2C0%2C23.374.287Z%27%20%2F%3E%3C%2Fsvg%3E\") no-repeat 0 0;background-size:100% auto}.duet-checkbox[disabled].sc-duet-checkbox{cursor:default}.duet-checkbox[disabled].sc-duet-checkbox+label.sc-duet-checkbox{color:#657787}.duet-theme-turva.sc-duet-checkbox .duet-checkbox[disabled].sc-duet-checkbox+label.sc-duet-checkbox{color:#747475}.duet-checkbox[disabled].sc-duet-checkbox+label.sc-duet-checkbox::before{border-color:#cfd2d4}.duet-theme-turva.sc-duet-checkbox .duet-checkbox[disabled].sc-duet-checkbox+label.sc-duet-checkbox::before{border-color:#cfcfd1}.duet-checkbox[disabled].sc-duet-checkbox:checked+label.sc-duet-checkbox::before{background:#657787;border:1px solid #657787}.duet-theme-turva.sc-duet-checkbox .duet-checkbox[disabled].sc-duet-checkbox:checked+label.sc-duet-checkbox::before{background:#747475;border-color:#747475}.duet-label-hidden.sc-duet-checkbox .duet-label.sc-duet-checkbox span.sc-duet-checkbox{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}";
 
 class DuetCheckbox {
   constructor(hostRef) {
@@ -6809,11 +6865,24 @@ class DuetCheckbox {
 
 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>"};
 
+const focusElement = (element) => {
+  if ("setFocus" in element) {
+    element.setFocus();
+  }
+  else {
+    element.focus();
+  }
+};
+const FocusGuard = ({ moveFocusTo }) => {
+  return hAsync("div", { class: "duet-focus-guard", "aria-hidden": "true", tabIndex: 0, onFocus: () => focusElement(moveFocusTo) });
+};
+
 const duetChoiceCss = "*.sc-duet-choice,*.sc-duet-choice::after,*.sc-duet-choice::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-choice-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;display:inline-flex;flex-direction:column;width:auto;max-width:100%;vertical-align:bottom;-webkit-tap-highlight-color:transparent}.sc-duet-choice-h:last-child,.sc-duet-choice-h:last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){.sc-duet-choice-h{width:100%}}.duet-expand.sc-duet-choice-h{width:100% !important}.duet-m-0.sc-duet-choice-h{margin:0 !important}.duet-fixed.sc-duet-choice-h{width:auto !important}.vertical.sc-duet-choice-h{margin-right:0 !important}.horizontal.sc-duet-choice-h{margin-bottom:0 !important}@media (min-width: 48em){.horizontal-responsive.sc-duet-choice-h{margin-bottom:0 !important;margin-right:16px !important}.horizontal-responsive.sc-duet-choice-h:last-child,.horizontal-responsive.sc-duet-choice-h:last-of-type{margin-right:0 !important}}.sc-duet-choice-h:last-child:not(:only-child){margin-right:0 !important}.duet-choice-card.sc-duet-choice{position:relative;display:block;width:100%;min-width:8rem;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;-webkit-hyphens:auto;hyphens:auto;line-height:1.1;color:#00294d !important;text-align:left;background:white;border-width:2px}.duet-choice-card.duet-p-0.sc-duet-choice{padding:0 !important}.duet-choice-card.duet-m-0.sc-duet-choice{margin:0 !important}.duet-theme-turva.sc-duet-choice .duet-choice-card.sc-duet-choice{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a !important}.duet-choice-card-flextainer.sc-duet-choice{display:flex}.duet-choice-label.sc-duet-choice{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:block;width:100%;padding:20px 48px 20px 16px;font-size:1rem;font-weight:600;text-decoration:none;cursor:pointer;border:2px solid #e1e3e6;border-radius:4px;transition:background-color 150ms ease}.has-info.sc-duet-choice .duet-choice-label.sc-duet-choice{padding-right:110px;border-top-right-radius:0;border-bottom-right-radius:0}.info.sc-duet-choice .duet-choice-label.sc-duet-choice{border-bottom-right-radius:0;border-bottom-left-radius:0}.duet-theme-turva.sc-duet-choice .duet-choice-label.sc-duet-choice{border-color:#e4e4e6}.duet-theme-turva.sc-duet-choice .info.sc-duet-choice .duet-choice-label.sc-duet-choice{border-color:#e4e4e6}.duet-choice-label.sc-duet-choice:not(.no-hover):hover{border-color:#909599}.duet-choice-label.sc-duet-choice:not(.no-hover):hover .duet-checkmark-container.sc-duet-choice{border-color:#909599}.duet-theme-turva.sc-duet-choice .duet-choice-label.sc-duet-choice:not(.no-hover):hover{border-color:#747475}.duet-theme-turva.sc-duet-choice .duet-choice-label.sc-duet-choice:not(.no-hover):hover .duet-checkmark-container.sc-duet-choice{border-color:#747475}.duet-theme-turva.sc-duet-choice .info.sc-duet-choice .duet-choice-label.sc-duet-choice:not(.no-hover):hover{border-color:#747475}.duet-choice-label.sc-duet-choice:active{opacity:0.75;transition:none !important}.has-icon.sc-duet-choice .duet-choice-label.sc-duet-choice{padding-left:48px}.checked.sc-duet-choice .duet-choice-label.sc-duet-choice{color:#0077b3 !important;background:#f3f9fc;border-color:#0077b3 !important}.checked.sc-duet-choice .duet-choice-label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{border-color:#0077b3}.duet-theme-turva.sc-duet-choice .checked.sc-duet-choice .duet-choice-label.sc-duet-choice{color:#171c3a !important;background:#f5f5f7;border-color:#171c3a !important}.duet-theme-turva.sc-duet-choice .checked.sc-duet-choice .duet-choice-label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{border-color:#c60c30}.checked.collapsible.sc-duet-choice .duet-choice-label.sc-duet-choice{border-bottom:0 !important;border-bottom-right-radius:0;border-bottom-left-radius:0}input.sc-duet-choice:focus{outline:0}.user-is-tabbing.sc-duet-choice-h input.sc-duet-choice:checked:focus+.duet-choice-label.sc-duet-choice{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3)}.user-is-tabbing.sc-duet-choice-h input.sc-duet-choice:not(:checked):focus+.duet-choice-label.sc-duet-choice{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.user-is-tabbing.duet-theme-turva.sc-duet-choice-h input.sc-duet-choice:checked:focus+.duet-choice-label.sc-duet-choice{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2)}.user-is-tabbing.duet-theme-turva.sc-duet-choice-h input.sc-duet-choice:not(:checked):focus+.duet-choice-label.sc-duet-choice{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice{color:#657787 !important;cursor:default !important;background:#f5f8fa !important;border-color:#e1e3e6 !important}input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice .duet-checkmark.sc-duet-choice{border-color:#657787 !important}.duet-theme-turva.sc-duet-choice input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice{color:#747475 !important;background:#f5f5f7 !important;border-color:#e4e4e6 !important}.duet-theme-turva.sc-duet-choice input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice .duet-checkmark.sc-duet-choice{border-color:#747475 !important}.checked.sc-duet-choice input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice{background:#e1e3e6 !important;border-color:#e1e3e6 !important}.duet-theme-turva.sc-duet-choice .checked.sc-duet-choice input[disabled].sc-duet-choice+.duet-choice-label.sc-duet-choice{background:#e4e4e6 !important;border-color:#e4e4e6 !important}.duet-checkmark-container.sc-duet-choice{position:absolute;top:17.7777777778px;right:16px;width:20px;height:20px;border:1px solid #909599;border-radius:4px;transition:border 300ms ease}.duet-theme-turva.sc-duet-choice .duet-checkmark-container.sc-duet-choice{border-color:#747475}.checked.sc-duet-choice .duet-checkmark-container.sc-duet-choice{background:#0077b3;border-color:#0077b3;transition:none}.duet-theme-turva.sc-duet-choice .checked.sc-duet-choice .duet-checkmark-container.sc-duet-choice{background:#171c3a;border-color:#171c3a !important}.duet-checkmark-container.duet-checkmark-radio.sc-duet-choice{border-radius:50%}[disabled].sc-duet-choice+label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{border-color:#cfd2d4 !important}.duet-theme-turva.sc-duet-choice [disabled].sc-duet-choice+label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{border-color:#cfcfd1 !important}.checked.sc-duet-choice [disabled].sc-duet-choice+label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{background:#cfd2d4 !important}.duet-theme-turva.sc-duet-choice .checked.sc-duet-choice [disabled].sc-duet-choice+label.sc-duet-choice .duet-checkmark-container.sc-duet-choice{background:#cfcfd1 !important}.duet-checkmark.sc-duet-choice{position:absolute;top:10px;left:3px;width:5.3333333333px;height:11.8518518519px;border-top:2px solid white;border-right:2px solid white;opacity:1;transform:scaleX(-1) rotate(135deg) translateZ(0);transform-origin:left top;animation-name:duet-checkmark;animation-duration:600ms;animation-timing-function:ease-out;animation-fill-mode:forwards}@keyframes duet-checkmark{0%{width:0;height:0;opacity:1}20%{width:5.3333333333px;height:0;opacity:1}40%,100%{width:5.3333333333px;height:11.8518518519px;opacity:1}}.duet-choice-card-icon.sc-duet-choice{position:absolute;top:50%;left:16px;transform:translateY(-50%)}.duet-choice-card-icon.sc-duet-choice duet-icon.sc-duet-choice{display:block}.duet-choice-section-hidden.sc-duet-choice{display:none}.duet-choice-card-info.duet-choice-card-collapsed.sc-duet-choice,.duet-choice-card-collapsed.duet-choice-card-collapsible.sc-duet-choice{position:relative;width:auto;padding:0 !important;background:unset !important;border:0;border-radius:0}.duet-choice-card-info.sc-duet-choice,.duet-choice-card-collapsible.sc-duet-choice{padding:28px !important;position:relative;z-index:200;width:100%;font-weight:400;color:#00294d;border:2px solid #e1e3e6;border-top:0;border-radius:0 0 4px 4px}.duet-theme-turva.sc-duet-choice .duet-choice-card-info.sc-duet-choice,.duet-theme-turva.sc-duet-choice .duet-choice-card-collapsible.sc-duet-choice{color:#171c3a;border-color:#171c3a}.checked.sc-duet-choice .duet-choice-card-info.sc-duet-choice,.checked.sc-duet-choice .duet-choice-card-collapsible.sc-duet-choice{display:block}.duet-choice-card-info-expanded.sc-duet-choice,.duet-choice-card-collapsible-expanded.sc-duet-choice{display:block}.duet-choice-card-collapsible.sc-duet-choice{background:white;border:2px solid #0077b3;border-top:0}.duet-choice-card-collapsible.duet-theme-turva.sc-duet-choice{background:white;border-color:#171c3a}.duet-choice-card-collapsible-disabled.sc-duet-choice{background:#f5f8fa;border-color:#e1e3e6}.duet-choice-card-collapsible-disabled.duet-theme-turva.sc-duet-choice{background:#f5f5f7;border-color:#e4e4e6}.duet-choice-card-info.sc-duet-choice{font-size:0.875rem;line-height:1.5;background:#f5f8fa;transition:150ms ease-out}.duet-choice-card-info.duet-theme-turva.sc-duet-choice{background:#f5f5f7;border-color:#e4e4e6}.duet-choice-info-toggle.sc-duet-choice{display:flex;flex-shrink:0;justify-content:center;width:57.6px;padding-top:18px;cursor:pointer;background:white;border:2px solid #e1e3e6;border-left:0 none;border-top-right-radius:4px;border-bottom-right-radius:4px;-webkit-appearance:none;appearance:none}.duet-choice-info-toggle[aria-expanded=true].sc-duet-choice{background:#f5f8fa;border-bottom:0;border-bottom-right-radius:0}.duet-choice-info-toggle[disabled].sc-duet-choice{pointer-events:none;background:#f5f8fa !important;border-color:#e1e3e6 !important}.duet-choice-info-toggle[disabled].sc-duet-choice .duet-choice-info-icon.sc-duet-choice{color:#909599 !important}.duet-choice-info-toggle[disabled].duet-theme-turva.sc-duet-choice{background:#f5f5f7 !important;border-color:#e4e4e6 !important}.duet-choice-info-toggle[disabled].duet-theme-turva.sc-duet-choice .duet-choice-info-icon.sc-duet-choice{color:#747475 !important}.duet-choice-info-toggle.sc-duet-choice:focus{outline:none}.user-is-tabbing.sc-duet-choice-h .duet-choice-info-toggle.sc-duet-choice:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-choice-label.sc-duet-choice:not(.no-hover):hover .duet-choice-info-toggle.sc-duet-choice{border-left-color:#909599}.checked.sc-duet-choice .duet-choice-info-toggle.sc-duet-choice{border-left-color:#0077b3 !important}.duet-choice-info-toggle.sc-duet-choice duet-icon.sc-duet-choice{display:block}.duet-choice-info-toggle.sc-duet-choice .duet-choice-info-icon.sc-duet-choice{color:#0077b3}.duet-theme-turva.sc-duet-choice .duet-choice-info-toggle.sc-duet-choice .duet-choice-info-icon.sc-duet-choice{color:#c60c30}.duet-choice-input.sc-duet-choice{position:absolute !important;width:auto;height:auto;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);color:transparent}";
 
 /**
  * @slot unnamed default slot - The component’s primary content. All child nodes that do not have a slot attribute defined are inserted into this primary slot.
  * @slot info - Info content. Anything inserted into this slot is displayed in a collapsible info box.
+ * @slot collapsible_header - header that is only added to collapsible element, this header should be used when the components collapsible area contains additional interactive elements (such as form items) and should be user for a short description of the content below it, it is mandatory for good accessibility to use this - and aria-decribe-by will point to it. If you use the collapsible area with simple text - describe-by will point to this area
  * @slot additional - Additional content. Anything inserted into this slot is displayed as additional content under the label and caption
  */
 class DuetChoice {
@@ -6822,8 +6891,11 @@ class DuetChoice {
     this.duetChange = createEvent$2(this, "duetChange", 7);
     this.duetFocus = createEvent$2(this, "duetFocus", 7);
     this.duetBlur = createEvent$2(this, "duetBlur", 7);
+    this.hasHeader = false;
     this.choiceId = createID("DuetChoice");
     this.expandId = createID("DuetChoiceExpand");
+    this.headerId = createID("DuetChoiceHeader");
+    this.infoButtonId = createID("DuetChoiceInfoButton");
     /**
      * State() variables
      * Inlined decorator, alphabetical order.
@@ -6901,6 +6973,24 @@ class DuetChoice {
      * browser from displaying its own validation errors.
      */
     this.required = false;
+    /**
+     * Placeholder defaults
+     * @default { fi: "pp.kk.vvvv", en: "dd.mm.yyyy", sv: "dd.mm.åååå" }
+     */
+    this.infoLabelDefaults = {
+      fi: "Lisätietoja",
+      en: "More information about",
+      sv: "Mera information om",
+    };
+    /**
+     * Hint text to display before the user types into the date picker input.
+     * @default  {
+     *     fi: "Lisätietoja",
+     *     en: "More information about",
+     *     sv: "Mera information om",
+     *   }
+     */
+    this.infoLabel = getLocaleString(this.infoLabelDefaults, getLanguage());
     this.onMouseEnter = () => {
       this.isHovering = true;
     };
@@ -6975,6 +7065,7 @@ class DuetChoice {
   componentWillLoad() {
     inheritGlobalTheme(this);
     this.hasInfo = !!this.element.querySelector("[slot='info']");
+    this.hasHeader = !!this.element.querySelector('[slot="header"]');
     this.hasAdditional = !!this.element.querySelector("[slot='additional']");
   }
   /**
@@ -6995,8 +7086,11 @@ class DuetChoice {
   handleHostKeyDown() {
     this.isKeyDown = true;
   }
-  handleHostKeyUp() {
+  handleHostKeyUp(ev) {
     this.isKeyDown = false;
+    if (isEscapeKey(ev) && this.isInfoOpen) {
+      this.toggleInfo();
+    }
   }
   /**
    * Sets focus on the specified `duet-choice`. Use this method instead of the global
@@ -7010,7 +7104,12 @@ class DuetChoice {
       return this.accessibleDescribedBy;
     }
     if (this.collapsible || this.hasInfo) {
-      return this.expandId;
+      if (this.hasHeader) {
+        return this.headerId;
+      }
+      else {
+        return this.expandId;
+      }
     }
     return null;
   }
@@ -7059,23 +7158,13 @@ class DuetChoice {
         info: this.isInfoOpen,
         collapsible: this.collapsible,
         "duet-p-0": this.padding === "none",
-      } }, hAsync("input", { class: "duet-choice-input", type: this.type, onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.onChange, disabled: this.disabled || this.groupDisabled, required: this.required, id: identifier, name: this.name, value: this.value, checked: this.checked, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.getAriaDescribedby(), onKeyDown: this.handleKeyDown, ref: input => (this.nativeInput = input) }), hAsync("label", { htmlFor: identifier, class: { "duet-choice-label": true, "no-hover": this.isHovering }, onClick: this.onClick }, this.icon && (hAsync("div", { class: "duet-choice-card-icon" }, hAsync("duet-icon", { margin: "none", size: "small", name: this.icon, color: "currentColor" }))), this.label, this.hasInfo ||
-      // this is an incredibly dirty way of both hiding the expanded / collapsed state text
-      // and an extremely bad way of notifying any screenreaders about state - unfortunately
-      // this is extremely difficult to do consistently across browsers so this hack is the best way todo it
-      (this.collapsible && (hAsync("span", { lang: "en", style: { opacity: "0", pointerEvents: "none", fontSize: "0", lineHeight: "0" } }, this.collapsible
-        ? this.checked
-          ? ", Expanded"
-          : ", Collapsed"
-        : this.isInfoOpen
-          ? ", Expanded"
-          : ", Collapsed"))), this.caption && (hAsync("div", null, hAsync("duet-spacer", { size: "xx-small" }), hAsync("duet-caption", { margin: "none", selected: this.checked }, this.caption))), this.hasAdditional && (hAsync("div", null, hAsync("duet-spacer", { size: "xx-small" }), hAsync("slot", { name: "additional" }))), hAsync("div", { class: { "duet-checkmark-container": true, "duet-checkmark-radio": this.type === "radio" } }, this.checked && hAsync("div", { class: "duet-checkmark" })))), this.hasInfo && !this.collapsible && (hAsync("button", { class: {
+      } }, hAsync("input", { class: "duet-choice-input", type: this.type, onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.onChange, disabled: this.disabled || this.groupDisabled, required: this.required, id: identifier, name: this.name, value: this.value, checked: this.checked, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.getAriaDescribedby(), onKeyDown: this.handleKeyDown, ref: input => (this.nativeInput = input) }), hAsync("label", { htmlFor: identifier, class: { "duet-choice-label": true, "no-hover": this.isHovering }, onClick: this.onClick }, this.icon && (hAsync("div", { class: "duet-choice-card-icon" }, hAsync("duet-icon", { margin: "none", size: "small", name: this.icon, color: "currentColor" }))), this.label, this.caption && (hAsync("div", null, hAsync("duet-spacer", { size: "xx-small" }), hAsync("duet-caption", { margin: "none", selected: this.checked }, this.caption))), this.hasAdditional && (hAsync("div", null, hAsync("duet-spacer", { size: "xx-small" }), hAsync("slot", { name: "additional" }))), hAsync("div", { class: { "duet-checkmark-container": true, "duet-checkmark-radio": this.type === "radio" } }, this.checked && hAsync("div", { class: "duet-checkmark" })))), this.hasInfo && !this.collapsible && (hAsync("button", { ref: button => (this.infoButtonEl = button), id: this.infoButtonId, class: {
         "duet-choice-info-toggle": true,
         "duet-theme-turva": this.theme === "turva",
-      }, onMouseEnter: this.onMouseEnter, onMouseLeave: this.onMouseLeave, onClick: this.toggleInfo, disabled: this.disabled || this.groupDisabled, "aria-expanded": this.isInfoOpen ? "true" : "false", "aria-controls": this.expandId, "aria-flowto": this.expandId, tabindex: this.type === "radio" && !this.checked ? "-1" : "0", type: "button" }, hAsync("duet-visually-hidden", { "aria-hidden": !this.isBlurred ? "true" : "false" }, this.accessibleLabelInfoButton), hAsync("div", { class: "duet-choice-info-icon" }, hAsync("duet-icon", { icon: messagingInfo.svg, margin: "none", size: "small", color: "currentColor" }))))), this.collapsible || this.hasInfo ? (hAsync("div", { class: this.getClassNames(), id: this.expandId }, hAsync("span", { class: {
+      }, onMouseEnter: this.onMouseEnter, onMouseLeave: this.onMouseLeave, onClick: this.toggleInfo, disabled: this.disabled || this.groupDisabled, "aria-expanded": this.isInfoOpen ? "true" : "false", "aria-label": `${this.infoLabel} ${this.label}`, "aria-controls": this.expandId, "aria-flowto": this.expandId, tabindex: this.type === "radio" && !this.checked ? "-1" : "0", type: "button" }, hAsync("duet-visually-hidden", { "aria-hidden": !this.isBlurred ? "true" : "false" }, this.accessibleLabelInfoButton), hAsync("div", { class: "duet-choice-info-icon" }, hAsync("duet-icon", { icon: messagingInfo.svg, margin: "none", size: "small", color: "currentColor" }))))), this.collapsible || this.hasInfo ? (hAsync("div", { class: this.getClassNames(), id: this.expandId }, hAsync("span", { class: {
         "duet-choice-section-visible": this.collapsible ? this.checked : this.isInfoOpen,
         "duet-choice-section-hidden": this.collapsible ? !this.checked : !this.isInfoOpen,
-      } }, this.hasInfo ? (hAsync("span", null, hAsync("slot", { name: "info" }), hAsync("slot", null))) : (hAsync("span", null, hAsync("slot", null)))))) : null));
+      } }, hAsync("span", { id: this.headerId }, hAsync("slot", { name: "header" })), this.hasInfo ? (hAsync("span", null, hAsync("span", { "aria-relevant": "all", "aria-atomic": "true", "aria-live": this.isInfoOpen ? "polite" : "off" }, hAsync("slot", { name: "info" })), hAsync("slot", null))) : (hAsync("span", null, hAsync("slot", null)))), this.isInfoOpen && hAsync(FocusGuard, { moveFocusTo: this.infoButtonEl }))) : null));
   }
   get element() { return getElement(this); }
   static get style() { return duetChoiceCss; }
@@ -7107,6 +7196,8 @@ class DuetChoice {
       "groupResponsive": [4, "group-responsive"],
       "disabled": [516],
       "required": [4],
+      "infoLabelDefaults": [1, "accessible-label-info-default"],
+      "infoLabel": [1, "info-label"],
       "isHovering": [32],
       "isInfoOpen": [32],
       "isBlurred": [32],
@@ -7118,19 +7209,41 @@ class DuetChoice {
   }; }
 }
 
-const watchForOptions = (containerEl, tagName, onChange) => {
+const watchFor = (containerEl, tagName, onChange, changeHandler, options = {
+  childList: true,
+  subtree: true,
+}) => {
   let mutation;
   if (typeof MutationObserver !== "undefined") {
     mutation = new MutationObserver(mutationList => {
-      onChange(getSelectedOption(mutationList, tagName));
-    });
-    mutation.observe(containerEl, {
-      childList: true,
-      subtree: true,
+      onChange(changeHandler(mutationList, tagName));
     });
+    mutation.observe(containerEl, options);
   }
   return mutation;
 };
+const watchForOptions = (containerEl, tagName, onChange) => {
+  return watchFor(containerEl, tagName, onChange, getSelectedOption);
+};
+const watchForElement = (containerEl, tagName, onChange) => {
+  return watchFor(containerEl, tagName, onChange, getElementItem, {
+    childList: true,
+    subtree: true,
+  });
+};
+const getElementItem = (mutationList) => {
+  let addedNode = false;
+  let removedNode = false;
+  mutationList.forEach(mut => {
+    if (mut.addedNodes.length) {
+      addedNode = true;
+    }
+    if (mut.removedNodes.length) {
+      removedNode = true;
+    }
+  });
+  return { addedNode, removedNode, mutationList };
+};
 const getSelectedOption = (mutationList, tagName) => {
   let newOption;
   mutationList.forEach(mut => {
@@ -7438,6 +7551,7 @@ const size_tappable_square = "48px";
 const size_icon_x_small = "16px";
 const size_icon_xxx_small = "7px";
 const size_button_border = "2px";
+const size_button_tiny_border = "1px";
 const size_icon_medium = "24px";
 const size_icon_small = "20px";
 const opacity_85 = "0.85";
@@ -7585,6 +7699,7 @@ var tokens = {
 	size_icon_x_small: size_icon_x_small,
 	size_icon_xxx_small: size_icon_xxx_small,
 	size_button_border: size_button_border,
+	size_button_tiny_border: size_button_tiny_border,
 	size_icon_medium: size_icon_medium,
 	size_icon_small: size_icon_small,
 	opacity_85: opacity_85,
@@ -7735,6 +7850,7 @@ var tokens$1 = /*#__PURE__*/Object.freeze({
   size_icon_x_small: size_icon_x_small,
   size_icon_xxx_small: size_icon_xxx_small,
   size_button_border: size_button_border,
+  size_button_tiny_border: size_button_tiny_border,
   size_icon_medium: size_icon_medium,
   size_icon_small: size_icon_small,
   opacity_85: opacity_85,
@@ -7771,6 +7887,9 @@ var tokens$1 = /*#__PURE__*/Object.freeze({
 
 const duetCollapsibleCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-collapsible,*.sc-duet-collapsible::after,*.sc-duet-collapsible::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-collapsible-h{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:#00294d}/*!@:host(.duet-theme-turva)*/.duet-theme-turva.sc-duet-collapsible-h{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-collapsible-h{margin:0 !important}/*!@.duet-collapsible-content*/.duet-collapsible-content.sc-duet-collapsible{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:#00294d}@media (max-width: 35.9375em){/*!@.duet-collapsible-content*/.duet-collapsible-content.sc-duet-collapsible{font-size:0.875rem}}/*!@.duet-collapsible-content.duet-theme-turva*/.duet-collapsible-content.duet-theme-turva.sc-duet-collapsible{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}/*!@:host([open]) .duet-collapsible-content*/[open].sc-duet-collapsible-h .duet-collapsible-content.sc-duet-collapsible{display:block}/*!@.duet-collapsible-heading*/.duet-collapsible-heading.sc-duet-collapsible{-webkit-user-select:none;user-select:none;display:flex;align-items:center;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:#00294d;cursor:pointer;border-radius:4px}/*!@.duet-collapsible-heading.duet-collapsible-normal-weight*/.duet-collapsible-heading.duet-collapsible-normal-weight.sc-duet-collapsible{font-weight:400}/*!@.duet-collapsible-heading.duet-theme-turva*/.duet-collapsible-heading.duet-theme-turva.sc-duet-collapsible{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}/*!@.duet-collapsible-heading .duet-collapsible-heading-content*/.duet-collapsible-heading.sc-duet-collapsible .duet-collapsible-heading-content.sc-duet-collapsible{flex:1}/*!@.duet-collapsible-heading:focus*/.duet-collapsible-heading.sc-duet-collapsible:focus{outline:0}/*!@:host(.user-is-tabbing) .duet-collapsible-heading:focus*/.user-is-tabbing.sc-duet-collapsible-h .duet-collapsible-heading.sc-duet-collapsible: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-theme-turva) .duet-collapsible-heading:focus*/.user-is-tabbing.duet-theme-turva.sc-duet-collapsible-h .duet-collapsible-heading.sc-duet-collapsible:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-collapsible-heading-icon*/.duet-collapsible-heading-icon.sc-duet-collapsible{margin-right:8px !important;display:flex;align-items:center;justify-content:center;color:#00294d;transition:transform 300ms ease}/*!@.duet-collapsible-heading-icon:last-child, .duet-collapsible-heading-icon:last-of-type*/.duet-collapsible-heading-icon.sc-duet-collapsible:last-child,.duet-collapsible-heading-icon.sc-duet-collapsible:last-of-type{margin-right:0 !important}/*!@[aria-expanded=true] .duet-collapsible-heading-icon*/[aria-expanded=true].sc-duet-collapsible .duet-collapsible-heading-icon.sc-duet-collapsible{transform:rotate(180deg)}";
 
+/**
+ * @part duet-collapsible-heading-content - piercing selector for styling the heading content
+ */
 class DuetCollapsible {
   constructor(hostRef) {
     registerInstance(this, hostRef);
@@ -7889,7 +8008,7 @@ class DuetCollapsible {
         "duet-collapsible-heading": true,
         "duet-theme-turva": this.theme === "turva",
         "duet-collapsible-normal-weight": this.headingWeight === "normal",
-      }, style: { "font-size": this.getFontSizeFromTokens() }, role: "button", tabindex: "0", ref: button => (this.nativeButton = button), "aria-expanded": this.open ? "true" : "false", "aria-controls": this.id, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, hAsync("div", { class: "duet-collapsible-heading-icon" }, hAsync("duet-icon", { margin: "none", color: this.theme === "turva" ? "secondary-turva" : "secondary", size: this.getEquivalentIconSize(), icon: actionArrowDownSmall.svg })), hAsync("div", { class: "duet-collapsible-heading-content" }, this.heading)), hAsync("div", { id: this.id, class: { "duet-collapsible-content": true, "duet-theme-turva": this.theme === "turva" } }, hAsync("slot", null))));
+      }, style: { "font-size": this.getFontSizeFromTokens() }, role: "button", tabindex: "0", ref: button => (this.nativeButton = button), "aria-expanded": this.open ? "true" : "false", "aria-controls": this.id, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, hAsync("div", { class: "duet-collapsible-heading-icon" }, hAsync("duet-icon", { margin: "none", color: this.theme === "turva" ? "secondary-turva" : "secondary", size: this.getEquivalentIconSize(), icon: actionArrowDownSmall.svg })), hAsync("div", { class: "duet-collapsible-heading-content", part: "duet-collapsible-heading-content" }, this.heading)), hAsync("div", { id: this.id, class: { "duet-collapsible-content": true, "duet-theme-turva": this.theme === "turva" } }, hAsync("slot", null))));
   }
   get element() { return getElement(this); }
   static get style() { return duetCollapsibleCss; }
@@ -7959,18 +8078,6 @@ class DuetCookieConsent {
   }; }
 }
 
-const focusElement = (element) => {
-  if ("setFocus" in element) {
-    element.setFocus();
-  }
-  else {
-    element.focus();
-  }
-};
-const FocusGuard = ({ moveFocusTo }) => {
-  return hAsync("div", { class: "duet-focus-guard", "aria-hidden": "true", tabIndex: 0, onFocus: () => focusElement(moveFocusTo) });
-};
-
 const formatOptionsShort = { day: "numeric", month: "long" };
 const formatOptionsLong = { day: "numeric", month: "long", year: "numeric" };
 const i18n$2 = {
@@ -8403,14 +8510,14 @@ class DuetDatePicker {
      */
     this.margin = "auto";
     /**
-     * The currently active language. This setting changes the month/year/day
+     * The currently active language. This setting changes the month/year/day.
      * names and button labels as well as all screen reader labels.
-     * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing
+     * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing.
      * @default "fi"
      */
     this.language = getLanguage();
     /**
-     * Placeholder defaults
+     * Placeholder defaults.
      * @default { fi: "pp.kk.vvvv", en: "dd.mm.yyyy", sv: "dd.mm.åååå" }
      */
     this.placeholderDefaults = {
@@ -8473,7 +8580,7 @@ class DuetDatePicker {
      */
     this.min = "";
     /**
-     * Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD
+     * Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.
      * This setting can be used alone or together with the min property.
      */
     this.max = "";
@@ -8857,49 +8964,221 @@ class DuetDivider {
   }; }
 }
 
-const duetEmptyStateCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-empty-state,*.sc-duet-empty-state::after,*.sc-duet-empty-state::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-empty-state-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%;height:100%}/*!@.duet-empty-state*/.duet-empty-state.sc-duet-empty-state{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;width:100%;height:100%;padding:48px;color:#00294d;text-align:center;background:#f5f8fa;border-radius:4px}/*!@.duet-empty-state.duet-theme-turva*/.duet-empty-state.duet-theme-turva.sc-duet-empty-state{color:#171c3a;background:#f5f5f7}";
+const debounce = (func, timeout = 50) => {
+  let timer;
+  return (...args) => {
+    clearTimeout(timer);
+    timer = setTimeout(() => {
+      func.apply(undefined, args);
+    }, timeout);
+  };
+};
 
-class DuetEmptyState {
+/**
+ * Produces a function which uses template strings to do simple interpolation from objects.
+ *
+ * Usage:
+ *    var makeMeKing = generateTemplateFn('${name} is now the king of ${country}!');
+ *
+ *    console.log(makeMeKing({ name: 'Bryan', country: 'Scotland'}));
+ *    // Logs 'Bryan is now the king of Scotland!'
+ */
+const generateTemplateFn = (function () {
+  const cache = {};
+  function generateTemplate(template) {
+    if (typeof template !== "string") {
+      template = template.outerHTML;
+    }
+    let fn = cache[template];
+    if (!fn) {
+      // Replace ${expressions} (etc) with ${map.expressions}.
+      const sanitized = template
+        .replace(/\$\{([\s]*[^;\s\{]+[\s]*)\}/g, function (_, match) {
+        return `\$\{map.${match.trim()}\}`;
+      })
+        // Afterwards, replace anything that's not ${map.expressions}' (etc) with a blank string.
+        .replace(/(\$\{(?!map\.)[^}]+\})/g, "");
+      fn = Function("map", `return \`${sanitized}\``);
+    }
+    return fn;
+  }
+  return generateTemplate;
+})();
+
+const duetEditableTableCss = "/*!@duet-editable-table*/duet-editable-table.sc-duet-editable-table{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@.duet-editable-table-header tr .duet-editable-table-header-hidden*/.duet-editable-table-header.sc-duet-editable-table tr.sc-duet-editable-table .duet-editable-table-header-hidden.sc-duet-editable-table{padding:0 !important;font-size:0;border-bottom:0}";
+
+class DuetEditableTable {
   constructor(hostRef) {
     registerInstance(this, hostRef);
+    this.template = undefined;
     /**
-     * Theme of the empty state component.
+     * State() variables
+     * @internal
+     */
+    this.tick = Date.now();
+    /**
+     * Map of items that contain list of things.
+     */
+    this.items = new Map();
+    /**
+     * Key used to set vertical alignment of action buttons
+     */
+    this.alignment = "middle";
+    /**
+     * Array of internationalized defaults for the default groups labels.
+     */
+    this.groupsLabelDefaults = {
+      fi: "Kaikki",
+      en: "All items",
+      sv: "Alla objekt",
+    };
+    /**
+     * Array of internationalized defaults for the default action labels.
+     */
+    this.actionLabelDefaults = {
+      fi: "Toiminnot",
+      en: "Actions",
+      sv: "Handlingar",
+    };
+    /**
+     * Array of group names that you want the editable table to display (can be used to hide or show groups depending on conditions).
+     * @default { id: "all", label: this.groupsLabelDefaults, actionLabel: this.actionLabelDefaults }.
+     * @example [{ id: "success", label: {fi: "Onnistunut", en: "Success", sv: "Alt klart", }}].
+     */
+    this.groups = [
+      { id: "all", label: this.groupsLabelDefaults, actionLabel: this.actionLabelDefaults },
+    ];
+    /**
+     * Array of actions that are mapped via the map variable to the various groups defined in group.
+     * @default undefined
+     * @example [{
+                variation: "default",
+                icon: "action-edit-2",
+                id: "edit",
+                map: ["success"],
+                label: {
+                  fi: " Label",
+                  en: " Label",
+                  sv: " Label",
+                }
+              }]
+     */
+    this.actions = undefined;
+    /**
+     * Shows or hides the table labels.
+     */
+    this.hideGroups = false;
+    /**
+     * Exposes the aria role for optimizing accessibility.
+     */
+    this.accessibleRole = undefined;
+    /**
+     * Theme of the table.
      */
     this.theme = "";
     /**
-     * Icon shown in the empty state component.
+     * Private methods.
      */
-    this.icon = "messaging-question";
+    this.kick = debounce(() => {
+      this.tick = Date.now();
+    }, 100); // will trigger re-render
     /**
-     * The size of the empty state message.
+     * If a user defines a template section within editable table, try to read an use it.
      */
-    this.size = "medium";
+    this.getTemplate = () => {
+      const templateDom = this.element.getElementsByTagName("template");
+      if (templateDom === null || templateDom === void 0 ? void 0 : templateDom.length) {
+        const templateString = templateDom[0].content.firstElementChild.outerHTML;
+        return generateTemplateFn(templateString);
+      }
+      else {
+        return false;
+      }
+    };
+    this.getItemData = (data) => {
+      const { item, group, uid } = data;
+      if (this.template) {
+        return {
+          group,
+          uid,
+          item: this.template(item),
+        };
+      }
+      return { item, group, uid };
+    };
+    this.filterMap = needle => {
+      if (needle === "all") {
+        return Array.from(this.items);
+      }
+      return Array.from(this.items).filter(item => needle === item[1].group);
+    };
   }
   /**
    * Component lifecycle events.
    */
   componentWillLoad() {
+    // look for a <template> region in the duet-editable-table
+    this.template = this.getTemplate();
+    // take care of the case where groups and actions are defined as html properties instead of javascript objects
+    if (typeof this.groups === "string") {
+      this.internalGroupArray = sanitizeString(this.groups);
+    }
+    else {
+      this.internalGroupArray = this.groups;
+    }
+    if (typeof this.actions === "string") {
+      this.internalActionsArray = sanitizeString(this.actions);
+    }
+    else {
+      this.internalActionsArray = this.actions;
+    }
     inheritGlobalTheme(this);
   }
   /**
-   * render() function
-   * Always the last one in the class.
+   * Method to force an update of a tabular data array.
+   * when called the method will rerender the entire tabular structure.
    */
+  async updateTable(passedItems = undefined) {
+    this.items = new Map(passedItems || this.items);
+    this.kick();
+  }
   render() {
-    return (hAsync(Host, null, hAsync("div", { class: {
-        "duet-empty-state": true,
+    return (hAsync(Host, { class: {
         "duet-theme-turva": this.theme === "turva",
-        "duet-is-small": this.size === "small",
-      } }, hAsync("duet-icon", { color: "currentColor", name: this.icon, size: this.size === "small" ? "large" : "x-large" }), hAsync("div", null, hAsync("slot", null)))));
+      } }, this.internalGroupArray.map(group => {
+      const currentGroup = this.filterMap(group.id);
+      if (!currentGroup.length) {
+        return;
+      }
+      return (hAsync("duet-table", { variation: "plain", breakpoint: "none", role: "", margin: this.hideGroups ? "none" : "auto" }, hAsync("table", { class: "duet-editable-table", "aria-role": this.accessibleRole }, hAsync("thead", { class: "duet-editable-table-header" }, hAsync("tr", null, hAsync("th", { class: {
+          "duet-editable-table-header-hidden": this.hideGroups,
+        } }, !this.hideGroups ? (getLocaleString(group.label)) : (hAsync("duet-visually-hidden", null, getLocaleString(group.label)))), hAsync("th", { class: {
+          "duet-editable-table-header-hidden": this.hideGroups,
+        } }, hAsync("duet-visually-hidden", null, group.actionLabel
+        ? getLocaleString(group.actionLabel)
+        : getLocaleString(this.actionLabelDefaults))))), hAsync("tbody", null, currentGroup.map(dataAsArray => {
+        const [key, value] = dataAsArray;
+        return (hAsync("duet-editable-table-item", { theme: this.theme, keyName: key, data: this.getItemData(value), groupId: group.id, part: group.id, alignment: this.alignment, actions: this.internalActionsArray }));
+      })))));
+    })));
   }
-  static get style() { return duetEmptyStateCss; }
+  get element() { return getElement(this); }
+  static get style() { return duetEditableTableCss; }
   static get cmpMeta() { return {
     "$flags$": 9,
-    "$tagName$": "duet-empty-state",
+    "$tagName$": "duet-editable-table",
     "$members$": {
+      "items": [1040],
+      "alignment": [1],
+      "groupsLabelDefaults": [16],
+      "actionLabelDefaults": [16],
+      "groups": [1],
+      "actions": [1],
+      "hideGroups": [4, "hide-table-labels"],
+      "accessibleRole": [1, "accessible-role"],
       "theme": [1025],
-      "icon": [1],
-      "size": [1]
+      "tick": [32],
+      "updateTable": [64]
     },
     "$listeners$": undefined,
     "$lazyBundleId$": "-",
@@ -8907,69 +9186,95 @@ class DuetEmptyState {
   }; }
 }
 
-const duetFieldsetCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-fieldset,*.sc-duet-fieldset::after,*.sc-duet-fieldset::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-fieldset-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-bottom:12px !important;display:block;width:100%}/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-fieldset-h{margin:0 !important}/*!@fieldset*/fieldset.sc-duet-fieldset{border:0}/*!@legend*/legend.sc-duet-fieldset{position:absolute !important;top:0;width:1px !important;height:1px !important;padding:0 !important;overflow:hidden !important;clip:rect(1px, 1px, 1px, 1px) !important;border:0 !important}/*!@.duet-legend-wrapper*/.duet-legend-wrapper.sc-duet-fieldset{position:relative;display:block;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\";font-size:1rem;font-weight:600;line-height:1.5;color:#00294d;text-align:left;background:transparent}/*!@.duet-theme-turva .duet-legend-wrapper*/.duet-theme-turva.sc-duet-fieldset .duet-legend-wrapper.sc-duet-fieldset{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}/*!@.duet-fieldset-label*/.duet-fieldset-label.sc-duet-fieldset{margin-bottom:12px !important;margin-top:8px}/*!@.duet-legend-has-caption .duet-fieldset-label*/.duet-legend-has-caption.sc-duet-fieldset .duet-fieldset-label.sc-duet-fieldset{margin-bottom:6px !important}/*!@.duet-legend-has-tooltip .duet-fieldset-label*/.duet-legend-has-tooltip.sc-duet-fieldset .duet-fieldset-label.sc-duet-fieldset{padding-right:36px}@media (min-width: 48em){/*!@.duet-legend-has-tooltip .duet-fieldset-label*/.duet-legend-has-tooltip.sc-duet-fieldset .duet-fieldset-label.sc-duet-fieldset{margin-bottom:3px !important;padding-right:0}}@media (min-width: 48em){/*!@.duet-legend-has-tooltip.duet-legend-has-caption .duet-fieldset-label*/.duet-legend-has-tooltip.duet-legend-has-caption.sc-duet-fieldset .duet-fieldset-label.sc-duet-fieldset{margin-bottom:-3px !important}}/*!@.duet-fieldset-caption*/.duet-fieldset-caption.sc-duet-fieldset{margin-bottom:12px !important}/*!@.duet-fieldset-help*/.duet-fieldset-help.sc-duet-fieldset{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:0.875rem;font-weight:400;line-height:1.25;color:#de2362;border-radius:4px}/*!@.duet-fieldset-help span*/.duet-fieldset-help.sc-duet-fieldset span.sc-duet-fieldset{display:block;margin-top:12px}/*!@.duet-theme-turva .duet-fieldset-help*/.duet-theme-turva.sc-duet-fieldset .duet-fieldset-help.sc-duet-fieldset{color:#e02a0d}/*!@::slotted(duet-tooltip)*/.sc-duet-fieldset-s>duet-tooltip{position:absolute;top:4px;right:0}@media (min-width: 48em){/*!@::slotted(duet-tooltip)*/.sc-duet-fieldset-s>duet-tooltip{position:relative;right:auto}}/*!@.duet-legend-hidden*/.duet-legend-hidden.sc-duet-fieldset{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}";
+const duetEditableTableButtonCss = "*.sc-duet-editable-table-button,*.sc-duet-editable-table-button::after,*.sc-duet-editable-table-button::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-editable-table-button-h button.sc-duet-editable-table-button{display:flex;align-content:space-between;justify-content:center;min-width:32px;max-width:32px;height:100%;min-height:32px;max-height:32px;padding:0;margin:0;cursor:pointer !important;background-color:transparent;border:1px solid;border-radius:50%}.sc-duet-editable-table-button-h button.sc-duet-editable-table-button duet-icon.sc-duet-editable-table-button{align-self:center}";
 
-/**
- * @slot unnamed default slot - The component’s primary content. All child nodes that do not have a slot attribute defined are inserted into this primary slot.
- * @slot tooltip - Use to place a tooltip alongside the fieldset label.
- */
-class DuetFieldset {
+class DuetEditableTableButton {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.errorId = createID("DuetError");
-    this.labelId = createID("DuetLabel");
-    this.hasTooltip = false;
+    this.duetEditableItemAction = createEvent$2(this, "duetEditableItemAction", 7);
+    this.isHovering = false;
     /**
-     * Theme of the fieldset.
+     * Theme of the empty state component.
      */
-    this.theme = "";
+    this.theme = undefined;
     /**
-     * Controls the margin of the component.
+     * action items passed from host component
+     * @internal
      */
-    this.margin = "auto";
+    this.actions = undefined;
     /**
-     * Visually hide the label, but still show it to screen readers.
+     * uid that gets passed along when the action is emitted
+     * @internal
      */
-    this.labelHidden = false;
-    this.checkHasTooltip = () => {
-      this.hasTooltip = !!this.element.querySelector("[slot='tooltip']");
+    this.uid = "";
+    /**
+     * group associated with action
+     * @internal
+     */
+    this.group = "";
+    /**
+     * key of the item in the map
+     * @internal
+     */
+    this.keyName = "";
+    this.onMouseEnter = () => {
+      this.isHovering = true;
+    };
+    this.onMouseLeave = () => {
+      this.isHovering = false;
+    };
+    this.getColours = (byName = false) => {
+      let colorHover = this.actions.color_hover;
+      let colorBlur = this.actions.color;
+      if (byName) {
+        colorHover = getColorByName(this.actions.color_hover, this.theme);
+        colorBlur = getColorByName(this.actions.color, this.theme);
+      }
+      return this.isHovering ? colorHover : colorBlur;
     };
   }
   /**
+   /**
    * Component lifecycle events.
    */
   componentWillLoad() {
     inheritGlobalTheme(this);
-    this.checkHasTooltip();
+  }
+  /**
+   /**
+   * private functions
+   */
+  emitActionEvent(ev) {
+    this.duetEditableItemAction.emit({
+      originalEvent: ev,
+      uid: this.uid,
+      group: this.group,
+      action: this.actions.id,
+      keyName: this.keyName,
+      component: "duet-editable-table-item",
+    });
   }
   /**
    * render() function
    * Always the last one in the class.
    */
   render() {
-    return (hAsync(Host, { class: { "duet-m-0": this.margin === "none" } }, hAsync("fieldset", { "aria-labelledby": `${this.labelId} ${this.errorId}`, class: {
-        "duet-fieldset": true,
-        "duet-theme-turva": this.theme === "turva",
-      } }, hAsync("legend", { id: this.labelId }, hAsync("span", null, this.label), this.caption && hAsync("span", null, this.caption)), hAsync("div", { class: {
-        "duet-legend-wrapper": true,
-        "duet-legend-has-caption": !!this.caption,
-        "duet-legend-has-tooltip": this.hasTooltip,
-        "duet-legend-hidden": this.labelHidden,
-      } }, hAsync("div", { class: "duet-fieldset-label" }, hAsync("span", { "aria-hidden": "true" }, this.label), hAsync("slot", { onSlotchange: this.checkHasTooltip, name: "tooltip" })), this.caption && (hAsync("div", { class: "duet-fieldset-caption", "aria-hidden": "true" }, hAsync("duet-caption", { margin: "none" }, this.caption)))), hAsync("slot", null), hAsync("span", { class: "duet-fieldset-help", id: this.errorId, "aria-live": "assertive", "aria-relevant": "additions removals" }, this.error && hAsync("span", null, this.error)))));
+    return (hAsync("button", { style: {
+        "border-color": this.getColours(true),
+      }, onMouseEnter: this.onMouseEnter, onMouseLeave: this.onMouseLeave, role: "menuitem", class: "duet-editable-table-actions-items-button", "aria-label": this.actions.label ? getLocaleString(this.actions.label) : undefined, onClick: ev => this.emitActionEvent(ev) }, hAsync("duet-icon", { class: "duet-editable-table-actions-items-icon", size: "x-small", name: this.actions.icon, color: this.getColours(), margin: "none" })));
   }
-  get element() { return getElement(this); }
-  static get style() { return duetFieldsetCss; }
+  get el() { return getElement(this); }
+  static get style() { return duetEditableTableButtonCss; }
   static get cmpMeta() { return {
-    "$flags$": 9,
-    "$tagName$": "duet-fieldset",
+    "$flags$": 2,
+    "$tagName$": "duet-editable-table-button",
     "$members$": {
       "theme": [1025],
-      "margin": [1],
-      "caption": [1],
-      "label": [1],
-      "error": [1],
-      "labelHidden": [4, "label-hidden"],
-      "hasTooltip": [32]
+      "actions": [16],
+      "uid": [1],
+      "group": [1],
+      "keyName": [1, "key-name"],
+      "isHovering": [32]
     },
     "$listeners$": undefined,
     "$lazyBundleId$": "-",
@@ -8977,74 +9282,288 @@ class DuetFieldset {
   }; }
 }
 
-var actionArrowRight={"title":"action-arrow-right","tags":"action arrow right caret","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M5.499 24a.752.752 0 0 1-.53-1.281L15.689 12 4.969 1.28c-.142-.141-.22-.33-.22-.53s.078-.389.22-.53c.141-.142.33-.22.53-.22s.389.078.53.22l10.72 10.72a1.5 1.5 0 0 1 .001 2.119L6.029 23.78a.743.743 0 0 1-.53.22z\"/></svg>"};
-
-var actionNewWindow={"title":"action-new-window","tags":"arrow open new window tab external link square box rectangle action","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M10.25 2a.75.75 0 1 1 0 1.5h-6.5A2.252 2.252 0 0 0 1.5 5.75v14.5a2.252 2.252 0 0 0 2.25 2.25h14.5a2.252 2.252 0 0 0 2.25-2.25v-6.5a.75.75 0 0 1 1.5 0v6.5A3.754 3.754 0 0 1 18.25 24H3.75A3.754 3.754 0 0 1 0 20.25V5.75A3.754 3.754 0 0 1 3.75 2zm12.985-2c.1 0 .198.02.29.058l.025.011a.726.726 0 0 1 .15.091l.066.059a.755.755 0 0 1 .109.138l.051.1c.04.092.06.192.06.293l-.001 6.363c0 .2-.078.389-.22.53a.743.743 0 0 1-.53.22.743.743 0 0 1-.53-.22.743.743 0 0 1-.22-.53V2.559L15.28 9.764a.75.75 0 0 1-1.06-1.06l7.204-7.205h-4.553a.744.744 0 0 1-.75-.75c0-.2.078-.388.22-.53A.743.743 0 0 1 16.87 0z\"/></svg>"};
-
-var actionNewWindowSmall={"title":"action-new-window-small","tags":"arrow open new window tab external linksquare box rectangle action small","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M10.5 2a1.5 1.5 0 0 1 .14 3H3.75c-.38 0-.7.28-.74.65l-.01.1v14.5c0 .38.28.7.65.74l.1.01h14.5c.38 0 .7-.28.74-.65l.01-.1v-6.89a1.5 1.5 0 0 1 3 0v6.89A3.75 3.75 0 0 1 18.25 24H3.75A3.75 3.75 0 0 1 0 20.25V5.75A3.75 3.75 0 0 1 3.75 2zm12-2c.78 0 1.42.6 1.5 1.36V7.5a1.5 1.5 0 0 1-3 .14V5.12l-5.44 5.44a1.5 1.5 0 0 1-2.22-2l.1-.12L18.88 3H16.5A1.5 1.5 0 0 1 15 1.64V1.5c0-.78.6-1.42 1.36-1.5h.14z\"/></svg>"};
+//simple functional component that renders the data in the table
+const TableData = ({ data, groupId, alignment }, _children) => {
+  if (typeof data === "string") {
+    return (hAsync("td", { innerHTML: data, class: "duet-editable-table-content", part: `${groupId}content`, style: { verticalAlign: alignment } }));
+  }
+  else {
+    return (hAsync("td", { class: "duet-editable-table-content", part: `${groupId}content`, style: { verticalAlign: alignment } }, data));
+  }
+};
 
-const duetFooterCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-footer,*.sc-duet-footer::after,*.sc-duet-footer::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-footer-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;flex-shrink:0;width:100%}/*!@.duet-footer*/.duet-footer.sc-duet-footer{display:block;width:100%;padding-top:20px;padding-bottom:16px;margin-top:48px;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;line-height:1.5;color:white;text-align:left;background:#00294d}/*!@.duet-footer.duet-p-0*/.duet-footer.duet-p-0.sc-duet-footer{padding:0 !important}/*!@.duet-footer.duet-m-0*/.duet-footer.duet-m-0.sc-duet-footer{margin:0 !important}@media (min-width: 36em){/*!@.duet-footer*/.duet-footer.sc-duet-footer{padding-top:36px}}@media (min-width: 62em){/*!@.duet-footer*/.duet-footer.sc-duet-footer{padding-top:48px;padding-bottom:36px}}/*!@.duet-footer.duet-theme-turva*/.duet-footer.duet-theme-turva.sc-duet-footer{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";background:#c60c30}/*!@.duet-footer a*/.duet-footer.sc-duet-footer a.sc-duet-footer{color:white;text-decoration:none}@media (min-width: 62em){/*!@.duet-footer a*/.duet-footer.sc-duet-footer a.sc-duet-footer{border-radius:4px}}/*!@.duet-footer a:focus*/.duet-footer.sc-duet-footer a.sc-duet-footer:focus{outline:0}/*!@:host(.user-is-tabbing) .duet-footer a:focus*/.user-is-tabbing.sc-duet-footer-h .duet-footer.sc-duet-footer a.sc-duet-footer:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@:host(.user-is-tabbing) .duet-theme-turva a:focus*/.user-is-tabbing.sc-duet-footer-h .duet-theme-turva.sc-duet-footer a.sc-duet-footer:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-footer-wrapper*/.duet-footer-wrapper.sc-duet-footer{position:relative;margin:0 auto}@media (min-width: 62em){/*!@.duet-footer-wrapper*/.duet-footer-wrapper.sc-duet-footer{padding:0 72px 0 48px}}@media (min-width: 76.25em){/*!@.duet-footer-wrapper*/.duet-footer-wrapper.sc-duet-footer{max-width:1110px;padding:0 20px 0 0}}/*!@.duet-footer-top*/.duet-footer-top.sc-duet-footer{width:100%}@media (min-width: 62em){/*!@.duet-footer-top*/.duet-footer-top.sc-duet-footer{display:flex;flex-direction:row;align-items:center;justify-content:space-between}}/*!@duet-logo*/duet-logo.sc-duet-footer{margin-left:16px !important}@media (min-width: 36em){/*!@duet-logo*/duet-logo.sc-duet-footer{margin-left:28px !important}}@media (min-width: 62em){/*!@duet-logo*/duet-logo.sc-duet-footer{margin-left:0 !important}}/*!@.duet-footer-link*/.duet-footer-link.sc-duet-footer{padding:16px !important;display:flex;flex-direction:row;align-items:center;width:100%;font-weight:600;border-bottom:1px solid rgba(255, 255, 255, 0.2);transition:background-color 300ms ease}@media (min-width: 36em){/*!@.duet-footer-link*/.duet-footer-link.sc-duet-footer{padding-right:20px !important;padding-left:28px !important}}@media (min-width: 62em){/*!@.duet-footer-link*/.duet-footer-link.sc-duet-footer{width:auto;min-width:0;padding-right:0 !important;padding-left:0 !important;border:0}}/*!@.duet-footer-link:first-of-type*/.duet-footer-link.sc-duet-footer:first-of-type{margin-top:20px;border-top:1px solid rgba(255, 255, 255, 0.2)}@media (min-width: 62em){/*!@.duet-footer-link:first-of-type*/.duet-footer-link.sc-duet-footer:first-of-type{margin:0;border:0}}/*!@.duet-footer-link span*/.duet-footer-link.sc-duet-footer span.sc-duet-footer{display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}/*!@.duet-footer-link:hover*/.duet-footer-link.sc-duet-footer:hover{background:rgba(0, 0, 0, 0.1)}@media (min-width: 62em){/*!@.duet-footer-link:hover*/.duet-footer-link.sc-duet-footer:hover{background:transparent}}/*!@.duet-footer-icon*/.duet-footer-icon.sc-duet-footer{display:flex;align-items:center;justify-content:center;padding:12px;margin-right:16px;background:#0077b3;border-radius:50%;transition:300ms ease}/*!@.duet-theme-turva .duet-footer-icon*/.duet-theme-turva.sc-duet-footer .duet-footer-icon.sc-duet-footer{background:transparent;box-shadow:0 0 0 1px white}/*!@a:hover .duet-footer-icon*/a.sc-duet-footer:hover .duet-footer-icon.sc-duet-footer{background:#006ba1}/*!@.duet-theme-turva a:hover .duet-footer-icon*/.duet-theme-turva.sc-duet-footer a.sc-duet-footer:hover .duet-footer-icon.sc-duet-footer{background:transparent}/*!@.duet-footer-arrow*/.duet-footer-arrow.sc-duet-footer{display:flex;align-items:center;justify-content:center;width:20px;min-width:20px;max-width:20px;height:20px;max-height:20px;margin-left:auto;color:white;transition:transform 300ms ease}@media (min-width: 62em){/*!@.duet-footer-arrow*/.duet-footer-arrow.sc-duet-footer{width:10px;min-width:10px;margin-top:3px;margin-left:8px}}@media (min-width: 62em){/*!@.duet-footer-arrow*/.duet-footer-arrow.sc-duet-footer{margin-right:0}}/*!@a:hover .duet-footer-arrow*/a.sc-duet-footer:hover .duet-footer-arrow.sc-duet-footer{transform:translateX(4px)}/*!@.duet-footer-arrow duet-icon*/.duet-footer-arrow.sc-duet-footer duet-icon.sc-duet-footer{width:20px;height:20px}@media (min-width: 62em){/*!@.duet-footer-arrow duet-icon*/.duet-footer-arrow.sc-duet-footer duet-icon.sc-duet-footer{width:10px;height:10px}}/*!@.duet-footer-menu*/.duet-footer-menu.sc-duet-footer{padding:20px !important;font-size:0.875rem}@media (min-width: 36em){/*!@.duet-footer-menu*/.duet-footer-menu.sc-duet-footer{padding:28px !important}}@media (min-width: 62em){/*!@.duet-footer-menu*/.duet-footer-menu.sc-duet-footer{padding-left:8px !important}}/*!@.duet-footer-menu a*/.duet-footer-menu.sc-duet-footer a.sc-duet-footer{text-decoration:none}/*!@.duet-footer-menu a:hover, .duet-footer-menu a:focus*/.duet-footer-menu.sc-duet-footer a.sc-duet-footer:hover,.duet-footer-menu.sc-duet-footer a.sc-duet-footer:focus{text-decoration:underline}/*!@.duet-footer-menu a:hover .duet-footer-divider, .duet-footer-menu a:focus .duet-footer-divider*/.duet-footer-menu.sc-duet-footer a.sc-duet-footer:hover .duet-footer-divider.sc-duet-footer,.duet-footer-menu.sc-duet-footer a.sc-duet-footer:focus .duet-footer-divider.sc-duet-footer{text-decoration:none}/*!@.duet-footer-menu .duet-footer-divider*/.duet-footer-menu.sc-duet-footer .duet-footer-divider.sc-duet-footer{display:inline-block;margin:0 8px}/*!@.duet-footer-menu a:last-of-type .duet-footer-divider*/.duet-footer-menu.sc-duet-footer a.sc-duet-footer:last-of-type .duet-footer-divider.sc-duet-footer{display:none}/*!@.duet-footer-copyright*/.duet-footer-copyright.sc-duet-footer{color:white}/*!@.duet-footer-simple*/.duet-footer-simple.sc-duet-footer{padding:0;margin:0;margin-top:16px;color:#00294d;background:transparent !important;border-top:1px solid #e1e3e6}/*!@.duet-footer-simple .duet-footer-wrapper*/.duet-footer-simple.sc-duet-footer .duet-footer-wrapper.sc-duet-footer{max-width:100%;padding:0 20px;margin:0}@media (min-width: 62em){/*!@.duet-footer-simple .duet-footer-wrapper*/.duet-footer-simple.sc-duet-footer .duet-footer-wrapper.sc-duet-footer{padding:0 36px}}@media (min-width: 106.25em){/*!@.duet-footer-simple .duet-footer-wrapper*/.duet-footer-simple.sc-duet-footer .duet-footer-wrapper.sc-duet-footer{padding:0 48px}}/*!@.duet-footer-simple .duet-footer-copyright,\n.duet-footer-simple .duet-footer-menu a*/.duet-footer-simple.sc-duet-footer .duet-footer-copyright.sc-duet-footer,.duet-footer-simple.sc-duet-footer .duet-footer-menu.sc-duet-footer a.sc-duet-footer{color:#00294d}/*!@.duet-footer-simple .duet-footer-menu*/.duet-footer-simple.sc-duet-footer .duet-footer-menu.sc-duet-footer{padding:20px 0 !important}/*!@.duet-footer-simple.duet-theme-turva*/.duet-footer-simple.duet-theme-turva.sc-duet-footer{color:#171c3a;border-color:#e4e4e6}/*!@.duet-footer-simple.duet-theme-turva .duet-footer-copyright,\n.duet-footer-simple.duet-theme-turva .duet-footer-menu a*/.duet-footer-simple.duet-theme-turva.sc-duet-footer .duet-footer-copyright.sc-duet-footer,.duet-footer-simple.duet-theme-turva.sc-duet-footer .duet-footer-menu.sc-duet-footer a.sc-duet-footer{color:#171c3a}/*!@.duet-footer-external*/.duet-footer-external.sc-duet-footer{display:inline-block;margin-left:4px;color:#0077b3}/*!@.duet-theme-turva .duet-footer-external*/.duet-theme-turva.sc-duet-footer .duet-footer-external.sc-duet-footer{color:white}/*!@.duet-footer-simple.duet-theme-turva .duet-footer-external*/.duet-footer-simple.duet-theme-turva.sc-duet-footer .duet-footer-external.sc-duet-footer{color:#c60c30}";
+const duetEditableTableItemCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-editable-table-item,*.sc-duet-editable-table-item::after,*.sc-duet-editable-table-item::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-editable-table-item-h{display:table-row;height:32px}/*!@.duet-editable-table-content, .duet-editable-table-actions*/.duet-editable-table-content.sc-duet-editable-table-item,.duet-editable-table-actions.sc-duet-editable-table-item{height:32px;padding:12px 0;vertical-align:middle;break-word:break-all;border-bottom:1px solid #e1e3e6}/*!@.duet-editable-table-actions-items*/.duet-editable-table-actions-items.sc-duet-editable-table-item{display:flex;justify-content:flex-end}/*!@.duet-editable-table-actions-items duet-editable-table-button*/.duet-editable-table-actions-items.sc-duet-editable-table-item duet-editable-table-button.sc-duet-editable-table-item{padding-left:8px}/*!@.duet-editable-table .editable-item-small*/.duet-editable-table.sc-duet-editable-table-item .editable-item-small.sc-duet-editable-table-item{font-size:0.75rem;font-weight:400}";
 
-const i18n$1 = {
-  fi: { lahi: "© LähiTapiola", turva: "© Turva" },
-  sv: { lahi: "© LokalTapiola", turva: "© Turva" },
-  en: { lahi: "© LocalTapiola", turva: "© Turva" },
-};
-const createEvent$1 = (ev, data) => ({
-  component: "duet-footer",
-  data,
-  originalEvent: ev,
-});
-class DuetFooter {
+class DuetEditableTableItem {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.duetChange = createEvent$2(this, "duetChange", 3);
-    this.duetLogoClick = createEvent$2(this, "duetLogoClick", 7);
-    this.duetMenuClick = createEvent$2(this, "duetMenuClick", 7);
-    this.duetItemClick = createEvent$2(this, "duetItemClick", 7);
-    this.duetAnalytics = createEvent$2(this, "duetAnalytics", 7);
-    /**
-     * State() variables
-     * Inlined decorator, alphabetical order.
-     */
-    this.processedItems = null;
-    this.processedMenu = null;
+    this.duetEditableItemAction = createEvent$2(this, "duetEditableItemAction", 7);
+    this.isHovering = false;
     /**
-     * Theme of the navigation.
+     * Theme of the empty state component.
      */
     this.theme = "";
     /**
-     * Style variation of the footer.
-     */
-    this.variation = "default";
-    /**
-     * Controls the margin of the component.
+     * Actions that can be performed on the element
      */
-    this.margin = "auto";
+    this.actions = undefined;
     /**
-     * URL that the logo link points to.
+     * GroupId used to pierce the shadowdom - gets concatenated with "content & actions" and used as part="groupIDcontent/actions" to pierce the content/Action item
+     * @internal
      */
-    this.logoHref = "/";
+    this.groupId = "";
     /**
-     * The currently active language. This setting changes the logo to match the
-     * chosen language.
-     * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing
-     * @default "fi"
+     * Key used to set vertical alignment of action buttons
      */
-    this.language = getLanguage();
+    this.alignment = "middle";
     /**
-     * Property to change accessibleLabelExternal defaults on the component.
-     * normally you would handle these strings on an application level and override @accessibleLabelExternal when needed
-     * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
+     * Key used to identify item, when running actions
      */
-    this.accessibleLabelExternalDefaults = DuetStringsExternalDefaults;
+    this.keyName = "";
     /**
-     * Adds accessible label for tooltip that is shown in external link (url & external have both been set)
-     * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
+     * Object of data itemsused to render the entire row
      */
-    this.accessibleLabelExternal = getLocaleString(this.accessibleLabelExternalDefaults, this.language);
-    /**
-     * Component event handling.
+    this.data = undefined;
+  }
+  watchPropHandler(_newValue, _oldValue) {
+    // console.log("The new value of activated is: ", _newValue)
+  }
+  /**
+   /**
+   * Component lifecycle events.
+   */
+  componentWillLoad() {
+    inheritGlobalTheme(this);
+  }
+  /**
+   /**
+   * private functions
+   */
+  /**
+   * render() function
+   * Always the last one in the class.
+   */
+  render() {
+    return (hAsync(Host, { role: "row" }, hAsync(TableData, { data: this.data.item, alignment: this.alignment, groupId: this.groupId }), hAsync("td", { class: "duet-editable-table-actions", style: { verticalAlign: this.alignment } }, hAsync("div", { class: "duet-editable-table-actions-items", part: `${this.groupId}actions` }, this.actions.map(result => {
+      const { map = undefined } = result;
+      // if map has been specified, only show the current action if groupID matches the map array
+      if (map && !map.includes(this.groupId)) {
+        return;
+      }
+      return (hAsync("duet-editable-table-button", { keyName: this.keyName, group: this.data.group, uid: this.data.uid, actions: result, theme: this.theme }));
+    })))));
+  }
+  get el() { return getElement(this); }
+  static get watchers() { return {
+    "data": ["watchPropHandler"]
+  }; }
+  static get style() { return duetEditableTableItemCss; }
+  static get cmpMeta() { return {
+    "$flags$": 9,
+    "$tagName$": "duet-editable-table-item",
+    "$members$": {
+      "theme": [1025],
+      "actions": [16],
+      "groupId": [1, "group-id"],
+      "alignment": [1],
+      "keyName": [1, "key-name"],
+      "data": [1040],
+      "isHovering": [32]
+    },
+    "$listeners$": undefined,
+    "$lazyBundleId$": "-",
+    "$attrsToReflect$": []
+  }; }
+}
+
+const duetEmptyStateCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-empty-state,*.sc-duet-empty-state::after,*.sc-duet-empty-state::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-empty-state-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%;height:100%}/*!@.duet-empty-state*/.duet-empty-state.sc-duet-empty-state{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;width:100%;height:100%;padding:48px;color:#00294d;text-align:center;background:#f5f8fa;border-radius:4px}/*!@.duet-empty-state.duet-theme-turva*/.duet-empty-state.duet-theme-turva.sc-duet-empty-state{color:#171c3a;background:#f5f5f7}";
+
+class DuetEmptyState {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    /**
+     * Theme of the empty state component.
+     */
+    this.theme = "";
+    /**
+     * Icon shown in the empty state component.
+     */
+    this.icon = "messaging-question";
+    /**
+     * The size of the empty state message.
+     */
+    this.size = "medium";
+  }
+  /**
+   * Component lifecycle events.
+   */
+  componentWillLoad() {
+    inheritGlobalTheme(this);
+  }
+  /**
+   * render() function
+   * Always the last one in the class.
+   */
+  render() {
+    return (hAsync(Host, null, hAsync("div", { class: {
+        "duet-empty-state": true,
+        "duet-theme-turva": this.theme === "turva",
+        "duet-is-small": this.size === "small",
+      } }, hAsync("duet-icon", { color: "currentColor", name: this.icon, size: this.size === "small" ? "large" : "x-large" }), hAsync("div", null, hAsync("slot", null)))));
+  }
+  static get style() { return duetEmptyStateCss; }
+  static get cmpMeta() { return {
+    "$flags$": 9,
+    "$tagName$": "duet-empty-state",
+    "$members$": {
+      "theme": [1025],
+      "icon": [1],
+      "size": [1]
+    },
+    "$listeners$": undefined,
+    "$lazyBundleId$": "-",
+    "$attrsToReflect$": []
+  }; }
+}
+
+const duetFieldsetCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-fieldset,*.sc-duet-fieldset::after,*.sc-duet-fieldset::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-fieldset-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-bottom:12px !important;display:block;width:100%}/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-fieldset-h{margin:0 !important}/*!@fieldset*/fieldset.sc-duet-fieldset{border:0}/*!@legend*/legend.sc-duet-fieldset{position:absolute !important;top:0;width:1px !important;height:1px !important;padding:0 !important;overflow:hidden !important;clip:rect(1px, 1px, 1px, 1px) !important;border:0 !important}/*!@.duet-legend-wrapper*/.duet-legend-wrapper.sc-duet-fieldset{position:relative;display:block;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\";font-size:1rem;font-weight:600;line-height:1.5;color:#00294d;text-align:left;background:transparent}/*!@.duet-theme-turva .duet-legend-wrapper*/.duet-theme-turva.sc-duet-fieldset .duet-legend-wrapper.sc-duet-fieldset{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}/*!@.duet-fieldset-label*/.duet-fieldset-label.sc-duet-fieldset{margin-bottom:12px !important;margin-top:8px}/*!@.duet-legend-has-caption .duet-fieldset-label*/.duet-legend-has-caption.sc-duet-fieldset .duet-fieldset-label.sc-duet-fieldset{margin-bottom:6px !important}/*!@.duet-legend-has-tooltip .duet-fieldset-label*/.duet-legend-has-tooltip.sc-duet-fieldset .duet-fieldset-label.sc-duet-fieldset{padding-right:36px}@media (min-width: 48em){/*!@.duet-legend-has-tooltip .duet-fieldset-label*/.duet-legend-has-tooltip.sc-duet-fieldset .duet-fieldset-label.sc-duet-fieldset{margin-bottom:3px !important;padding-right:0}}@media (min-width: 48em){/*!@.duet-legend-has-tooltip.duet-legend-has-caption .duet-fieldset-label*/.duet-legend-has-tooltip.duet-legend-has-caption.sc-duet-fieldset .duet-fieldset-label.sc-duet-fieldset{margin-bottom:-3px !important}}/*!@.duet-fieldset-caption*/.duet-fieldset-caption.sc-duet-fieldset{margin-bottom:12px !important}/*!@.duet-fieldset-help*/.duet-fieldset-help.sc-duet-fieldset{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:0.875rem;font-weight:400;line-height:1.25;color:#de2362;border-radius:4px}/*!@.duet-fieldset-help span*/.duet-fieldset-help.sc-duet-fieldset span.sc-duet-fieldset{display:block;margin-top:12px}/*!@.duet-theme-turva .duet-fieldset-help*/.duet-theme-turva.sc-duet-fieldset .duet-fieldset-help.sc-duet-fieldset{color:#e02a0d}/*!@::slotted(duet-tooltip)*/.sc-duet-fieldset-s>duet-tooltip{position:absolute;top:4px;right:0}@media (min-width: 48em){/*!@::slotted(duet-tooltip)*/.sc-duet-fieldset-s>duet-tooltip{position:relative;right:auto}}/*!@.duet-legend-hidden*/.duet-legend-hidden.sc-duet-fieldset{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}";
+
+/**
+ * @slot unnamed default slot - The component’s primary content. All child nodes that do not have a slot attribute defined are inserted into this primary slot.
+ * @slot tooltip - Use to place a tooltip alongside the fieldset label.
+ */
+class DuetFieldset {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.errorId = createID("DuetError");
+    this.labelId = createID("DuetLabel");
+    this.hasTooltip = false;
+    /**
+     * Theme of the fieldset.
+     */
+    this.theme = "";
+    /**
+     * Controls the margin of the component.
+     */
+    this.margin = "auto";
+    /**
+     * Visually hide the label, but still show it to screen readers.
+     */
+    this.labelHidden = false;
+    this.checkHasTooltip = () => {
+      this.hasTooltip = !!this.element.querySelector("[slot='tooltip']");
+    };
+  }
+  /**
+   * Component lifecycle events.
+   */
+  componentWillLoad() {
+    inheritGlobalTheme(this);
+    this.checkHasTooltip();
+  }
+  /**
+   * render() function
+   * Always the last one in the class.
+   */
+  render() {
+    return (hAsync(Host, { class: { "duet-m-0": this.margin === "none" } }, hAsync("fieldset", { "aria-labelledby": `${this.labelId} ${this.errorId}`, class: {
+        "duet-fieldset": true,
+        "duet-theme-turva": this.theme === "turva",
+      } }, hAsync("legend", { id: this.labelId }, hAsync("span", null, this.label), this.caption && hAsync("span", null, this.caption)), hAsync("div", { class: {
+        "duet-legend-wrapper": true,
+        "duet-legend-has-caption": !!this.caption,
+        "duet-legend-has-tooltip": this.hasTooltip,
+        "duet-legend-hidden": this.labelHidden,
+      } }, hAsync("div", { class: "duet-fieldset-label" }, hAsync("span", { "aria-hidden": "true" }, this.label), hAsync("slot", { onSlotchange: this.checkHasTooltip, name: "tooltip" })), this.caption && (hAsync("div", { class: "duet-fieldset-caption", "aria-hidden": "true" }, hAsync("duet-caption", { margin: "none" }, this.caption)))), hAsync("slot", null), hAsync("span", { class: "duet-fieldset-help", id: this.errorId, "aria-live": "assertive", "aria-relevant": "additions removals" }, this.error && hAsync("span", null, this.error)))));
+  }
+  get element() { return getElement(this); }
+  static get style() { return duetFieldsetCss; }
+  static get cmpMeta() { return {
+    "$flags$": 9,
+    "$tagName$": "duet-fieldset",
+    "$members$": {
+      "theme": [1025],
+      "margin": [1],
+      "caption": [1],
+      "label": [1],
+      "error": [1],
+      "labelHidden": [4, "label-hidden"],
+      "hasTooltip": [32]
+    },
+    "$listeners$": undefined,
+    "$lazyBundleId$": "-",
+    "$attrsToReflect$": []
+  }; }
+}
+
+var actionArrowRight={"title":"action-arrow-right","tags":"action arrow right caret","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M5.499 24a.752.752 0 0 1-.53-1.281L15.689 12 4.969 1.28c-.142-.141-.22-.33-.22-.53s.078-.389.22-.53c.141-.142.33-.22.53-.22s.389.078.53.22l10.72 10.72a1.5 1.5 0 0 1 .001 2.119L6.029 23.78a.743.743 0 0 1-.53.22z\"/></svg>"};
+
+var actionNewWindow={"title":"action-new-window","tags":"arrow open new window tab external link square box rectangle action","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M10.25 2a.75.75 0 1 1 0 1.5h-6.5A2.252 2.252 0 0 0 1.5 5.75v14.5a2.252 2.252 0 0 0 2.25 2.25h14.5a2.252 2.252 0 0 0 2.25-2.25v-6.5a.75.75 0 0 1 1.5 0v6.5A3.754 3.754 0 0 1 18.25 24H3.75A3.754 3.754 0 0 1 0 20.25V5.75A3.754 3.754 0 0 1 3.75 2zm12.985-2c.1 0 .198.02.29.058l.025.011a.726.726 0 0 1 .15.091l.066.059a.755.755 0 0 1 .109.138l.051.1c.04.092.06.192.06.293l-.001 6.363c0 .2-.078.389-.22.53a.743.743 0 0 1-.53.22.743.743 0 0 1-.53-.22.743.743 0 0 1-.22-.53V2.559L15.28 9.764a.75.75 0 0 1-1.06-1.06l7.204-7.205h-4.553a.744.744 0 0 1-.75-.75c0-.2.078-.388.22-.53A.743.743 0 0 1 16.87 0z\"/></svg>"};
+
+var actionNewWindowSmall={"title":"action-new-window-small","tags":"arrow open new window tab external linksquare box rectangle action small","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M10.5 2a1.5 1.5 0 0 1 .14 3H3.75c-.38 0-.7.28-.74.65l-.01.1v14.5c0 .38.28.7.65.74l.1.01h14.5c.38 0 .7-.28.74-.65l.01-.1v-6.89a1.5 1.5 0 0 1 3 0v6.89A3.75 3.75 0 0 1 18.25 24H3.75A3.75 3.75 0 0 1 0 20.25V5.75A3.75 3.75 0 0 1 3.75 2zm12-2c.78 0 1.42.6 1.5 1.36V7.5a1.5 1.5 0 0 1-3 .14V5.12l-5.44 5.44a1.5 1.5 0 0 1-2.22-2l.1-.12L18.88 3H16.5A1.5 1.5 0 0 1 15 1.64V1.5c0-.78.6-1.42 1.36-1.5h.14z\"/></svg>"};
+
+const duetFooterCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-footer,*.sc-duet-footer::after,*.sc-duet-footer::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-footer-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;flex-shrink:0;width:100%}/*!@.duet-footer*/.duet-footer.sc-duet-footer{display:block;width:100%;padding-top:20px;padding-bottom:16px;margin-top:48px;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;line-height:1.5;color:white;text-align:left;background:#00294d}/*!@.duet-footer.duet-p-0*/.duet-footer.duet-p-0.sc-duet-footer{padding:0 !important}/*!@.duet-footer.duet-m-0*/.duet-footer.duet-m-0.sc-duet-footer{margin:0 !important}@media (min-width: 36em){/*!@.duet-footer*/.duet-footer.sc-duet-footer{padding-top:36px}}@media (min-width: 62em){/*!@.duet-footer*/.duet-footer.sc-duet-footer{padding-top:48px;padding-bottom:36px}}/*!@.duet-footer.duet-theme-turva*/.duet-footer.duet-theme-turva.sc-duet-footer{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";background:#c60c30}/*!@.duet-footer a*/.duet-footer.sc-duet-footer a.sc-duet-footer{color:white;text-decoration:none}@media (min-width: 62em){/*!@.duet-footer a*/.duet-footer.sc-duet-footer a.sc-duet-footer{border-radius:4px}}/*!@.duet-footer a:focus*/.duet-footer.sc-duet-footer a.sc-duet-footer:focus{outline:0}/*!@:host(.user-is-tabbing) .duet-footer a:focus*/.user-is-tabbing.sc-duet-footer-h .duet-footer.sc-duet-footer a.sc-duet-footer:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@:host(.user-is-tabbing) .duet-theme-turva a:focus*/.user-is-tabbing.sc-duet-footer-h .duet-theme-turva.sc-duet-footer a.sc-duet-footer:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-footer-wrapper*/.duet-footer-wrapper.sc-duet-footer{position:relative;margin:0 auto}@media (min-width: 62em){/*!@.duet-footer-wrapper*/.duet-footer-wrapper.sc-duet-footer{padding:0 72px 0 48px}}@media (min-width: 76.25em){/*!@.duet-footer-wrapper*/.duet-footer-wrapper.sc-duet-footer{max-width:1110px;padding:0 20px 0 0}}/*!@.duet-footer-top*/.duet-footer-top.sc-duet-footer{width:100%}@media (min-width: 62em){/*!@.duet-footer-top*/.duet-footer-top.sc-duet-footer{display:flex;flex-direction:row;align-items:center;justify-content:space-between}}/*!@duet-logo*/duet-logo.sc-duet-footer{margin-left:16px !important}@media (min-width: 36em){/*!@duet-logo*/duet-logo.sc-duet-footer{margin-left:28px !important}}@media (min-width: 62em){/*!@duet-logo*/duet-logo.sc-duet-footer{margin-left:0 !important}}/*!@.duet-footer-link*/.duet-footer-link.sc-duet-footer{padding:16px !important;display:flex;flex-direction:row;align-items:center;width:100%;font-weight:600;border-bottom:1px solid rgba(255, 255, 255, 0.2);transition:background-color 300ms ease}@media (min-width: 36em){/*!@.duet-footer-link*/.duet-footer-link.sc-duet-footer{padding-right:20px !important;padding-left:28px !important}}@media (min-width: 62em){/*!@.duet-footer-link*/.duet-footer-link.sc-duet-footer{width:auto;min-width:0;padding-right:0 !important;padding-left:0 !important;border:0}}/*!@.duet-footer-link:first-of-type*/.duet-footer-link.sc-duet-footer:first-of-type{margin-top:20px;border-top:1px solid rgba(255, 255, 255, 0.2)}@media (min-width: 62em){/*!@.duet-footer-link:first-of-type*/.duet-footer-link.sc-duet-footer:first-of-type{margin:0;border:0}}/*!@.duet-footer-link span*/.duet-footer-link.sc-duet-footer span.sc-duet-footer{display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}/*!@.duet-footer-link:hover*/.duet-footer-link.sc-duet-footer:hover{background:rgba(0, 0, 0, 0.1)}@media (min-width: 62em){/*!@.duet-footer-link:hover*/.duet-footer-link.sc-duet-footer:hover{background:transparent}}/*!@.duet-footer-icon*/.duet-footer-icon.sc-duet-footer{display:flex;align-items:center;justify-content:center;padding:12px;margin-right:16px;background:#0077b3;border-radius:50%;transition:300ms ease}/*!@.duet-theme-turva .duet-footer-icon*/.duet-theme-turva.sc-duet-footer .duet-footer-icon.sc-duet-footer{background:transparent;box-shadow:0 0 0 1px white}/*!@a:hover .duet-footer-icon*/a.sc-duet-footer:hover .duet-footer-icon.sc-duet-footer{background:#006ba1}/*!@.duet-theme-turva a:hover .duet-footer-icon*/.duet-theme-turva.sc-duet-footer a.sc-duet-footer:hover .duet-footer-icon.sc-duet-footer{background:transparent}/*!@.duet-footer-arrow*/.duet-footer-arrow.sc-duet-footer{display:flex;align-items:center;justify-content:center;width:20px;min-width:20px;max-width:20px;height:20px;max-height:20px;margin-left:auto;color:white;transition:transform 300ms ease}@media (min-width: 62em){/*!@.duet-footer-arrow*/.duet-footer-arrow.sc-duet-footer{width:10px;min-width:10px;margin-top:3px;margin-left:8px}}@media (min-width: 62em){/*!@.duet-footer-arrow*/.duet-footer-arrow.sc-duet-footer{margin-right:0}}/*!@a:hover .duet-footer-arrow*/a.sc-duet-footer:hover .duet-footer-arrow.sc-duet-footer{transform:translateX(4px)}/*!@.duet-footer-arrow duet-icon*/.duet-footer-arrow.sc-duet-footer duet-icon.sc-duet-footer{width:20px;height:20px}@media (min-width: 62em){/*!@.duet-footer-arrow duet-icon*/.duet-footer-arrow.sc-duet-footer duet-icon.sc-duet-footer{width:10px;height:10px}}/*!@.duet-footer-menu*/.duet-footer-menu.sc-duet-footer{padding:20px !important;font-size:0.875rem}@media (min-width: 36em){/*!@.duet-footer-menu*/.duet-footer-menu.sc-duet-footer{padding:28px !important}}@media (min-width: 62em){/*!@.duet-footer-menu*/.duet-footer-menu.sc-duet-footer{padding-left:8px !important}}/*!@.duet-footer-menu a*/.duet-footer-menu.sc-duet-footer a.sc-duet-footer{text-decoration:none;white-space:nowrap}/*!@.duet-footer-menu a:hover, .duet-footer-menu a:focus*/.duet-footer-menu.sc-duet-footer a.sc-duet-footer:hover,.duet-footer-menu.sc-duet-footer a.sc-duet-footer:focus{text-decoration:underline}/*!@.duet-footer-menu a:hover .duet-footer-divider, .duet-footer-menu a:focus .duet-footer-divider*/.duet-footer-menu.sc-duet-footer a.sc-duet-footer:hover .duet-footer-divider.sc-duet-footer,.duet-footer-menu.sc-duet-footer a.sc-duet-footer:focus .duet-footer-divider.sc-duet-footer{text-decoration:none}/*!@.duet-footer-menu .duet-footer-divider*/.duet-footer-menu.sc-duet-footer .duet-footer-divider.sc-duet-footer{display:inline-block;margin:0 8px}/*!@.duet-footer-menu a:last-of-type .duet-footer-divider*/.duet-footer-menu.sc-duet-footer a.sc-duet-footer:last-of-type .duet-footer-divider.sc-duet-footer{display:none}/*!@.duet-footer-copyright*/.duet-footer-copyright.sc-duet-footer{color:white}/*!@.duet-footer-simple*/.duet-footer-simple.sc-duet-footer{padding:0;margin:0;margin-top:16px;color:#00294d;background:transparent !important;border-top:1px solid #e1e3e6}/*!@.duet-footer-simple .duet-footer-wrapper*/.duet-footer-simple.sc-duet-footer .duet-footer-wrapper.sc-duet-footer{max-width:100%;padding:0 20px;margin:0}@media (min-width: 62em){/*!@.duet-footer-simple .duet-footer-wrapper*/.duet-footer-simple.sc-duet-footer .duet-footer-wrapper.sc-duet-footer{padding:0 36px}}@media (min-width: 106.25em){/*!@.duet-footer-simple .duet-footer-wrapper*/.duet-footer-simple.sc-duet-footer .duet-footer-wrapper.sc-duet-footer{padding:0 48px}}/*!@.duet-footer-simple .duet-footer-copyright,\n.duet-footer-simple .duet-footer-menu a*/.duet-footer-simple.sc-duet-footer .duet-footer-copyright.sc-duet-footer,.duet-footer-simple.sc-duet-footer .duet-footer-menu.sc-duet-footer a.sc-duet-footer{color:#00294d}/*!@.duet-footer-simple .duet-footer-menu*/.duet-footer-simple.sc-duet-footer .duet-footer-menu.sc-duet-footer{padding:20px 0 !important}/*!@.duet-footer-simple.duet-theme-turva*/.duet-footer-simple.duet-theme-turva.sc-duet-footer{color:#171c3a;border-color:#e4e4e6}/*!@.duet-footer-simple.duet-theme-turva .duet-footer-copyright,\n.duet-footer-simple.duet-theme-turva .duet-footer-menu a*/.duet-footer-simple.duet-theme-turva.sc-duet-footer .duet-footer-copyright.sc-duet-footer,.duet-footer-simple.duet-theme-turva.sc-duet-footer .duet-footer-menu.sc-duet-footer a.sc-duet-footer{color:#171c3a}/*!@.duet-footer-external*/.duet-footer-external.sc-duet-footer{display:inline-block;margin-left:4px;color:#0077b3}/*!@.duet-theme-turva .duet-footer-external*/.duet-theme-turva.sc-duet-footer .duet-footer-external.sc-duet-footer{color:white}/*!@.duet-footer-simple.duet-theme-turva .duet-footer-external*/.duet-footer-simple.duet-theme-turva.sc-duet-footer .duet-footer-external.sc-duet-footer{color:#c60c30}";
+
+const i18n$1 = {
+  fi: { lahi: "© LähiTapiola", turva: "© Turva" },
+  sv: { lahi: "© LokalTapiola", turva: "© Turva" },
+  en: { lahi: "© LocalTapiola", turva: "© Turva" },
+};
+const createEvent$1 = (ev, data) => ({
+  component: "duet-footer",
+  data,
+  originalEvent: ev,
+});
+class DuetFooter {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.duetChange = createEvent$2(this, "duetChange", 3);
+    this.duetLogoClick = createEvent$2(this, "duetLogoClick", 7);
+    this.duetMenuClick = createEvent$2(this, "duetMenuClick", 7);
+    this.duetItemClick = createEvent$2(this, "duetItemClick", 7);
+    this.duetAnalytics = createEvent$2(this, "duetAnalytics", 7);
+    /**
+     * State() variables
+     * Inlined decorator, alphabetical order.
+     */
+    this.processedItems = null;
+    this.processedMenu = null;
+    /**
+     * Theme of the navigation.
+     */
+    this.theme = "";
+    /**
+     * Style variation of the footer.
+     */
+    this.variation = "default";
+    /**
+     * Controls the margin of the component.
+     */
+    this.margin = "auto";
+    /**
+     * URL that the logo link points to.
+     */
+    this.logoHref = "/";
+    /**
+     * The currently active language. This setting changes the logo to match the
+     * chosen language.
+     * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing
+     * @default "fi"
+     */
+    this.language = getLanguage();
+    /**
+     * Property to change accessibleLabelExternal defaults on the component.
+     * normally you would handle these strings on an application level and override @accessibleLabelExternal when needed
+     * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
+     */
+    this.accessibleLabelExternalDefaults = DuetStringsExternalDefaults;
+    /**
+     * Adds accessible label for tooltip that is shown in external link (url & external have both been set)
+     * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
+     */
+    this.accessibleLabelExternal = getLocaleString(this.accessibleLabelExternalDefaults, this.language);
+    /**
+     * Component event handling.
      */
     this.handleClick = (event) => {
       if (event.data.analyticsId) {
@@ -9137,6 +9656,12 @@ function isGridItem(element) {
 class DuetGrid {
   constructor(hostRef) {
     registerInstance(this, hostRef);
+    this.mql = [
+      window.matchMedia(media_query_large.replace(/'/g, "")),
+      window.matchMedia(media_query_medium.replace(/'/g, "")),
+      window.matchMedia(media_query_small.replace(/'/g, "")),
+    ];
+    this.distributeFormElement = false;
     /**
      * Enable or disable the automatic responsive behaviour of the grid component.
      * Setting this option to "true" makes sure that contents are stacked vertically
@@ -9153,7 +9678,9 @@ class DuetGrid {
      */
     this.direction = "horizontal";
     /**
-     * Adjusts the vertical alignment of the grid items.
+     * Adjusts the vertical alignment of the grid items, if set to "form_distribute"
+     * the grid will try to calculate correct paddings for any duet-input fields inside duet-grid-items,
+     * so that they align even when displaying errors.
      */
     this.alignment = "top";
     /**
@@ -9165,14 +9692,39 @@ class DuetGrid {
      */
     this.mobile = "";
   }
+  /**
+   * Private functions
+   */
+  /**
+   * Returns the element height including margins
+   * @param element - element
+   * @returns {number}
+   */
+  outerHeight(element) {
+    const height = element.offsetHeight, style = window.getComputedStyle(element);
+    return ["top", "bottom"]
+      .map(side => parseInt(style[`margin-${side}`]))
+      .reduce((total, side) => total + side, height);
+  }
   /**
    * Component lifecycle events.
    */
   async connectedCallback() {
     const el = this.element;
+    this.distributeFormElement = this.alignment === "form_distribute";
     this.mutationO = watchForOptions(el, "duet-grid-item", () => {
       this.updateGridItems();
     });
+    // the next two functions are used to watch for changes in the grid items, and are process intensive - so only run when needed
+    if (this.distributeFormElement) {
+      this.mutation1 = watchForElement(el, "duet-input", () => {
+        this.updateGridItemsWithInputFields();
+      });
+      // listen for potential mediaquery changes and reset layout
+      for (let i = 0; i < this.mql.length; i++) {
+        this.mql[i].addEventListener("change", this.updateGridItemsWithInputFields.bind(this));
+      }
+    }
     this.updateGridItems();
   }
   disconnectedCallback() {
@@ -9180,6 +9732,14 @@ class DuetGrid {
       this.mutationO.disconnect();
       this.mutationO = undefined;
     }
+    if (this.mutation1) {
+      this.mutation1.disconnect();
+      this.mutation1 = undefined;
+    }
+    // listen for potential mediaquery changes and reset layout
+    for (let i = 0; i < this.mql.length; i++) {
+      this.mql[i].removeEventListener("change", this.updateGridItemsWithInputFields.bind(this));
+    }
   }
   /**
    * Local methods
@@ -9191,6 +9751,29 @@ class DuetGrid {
       item.breakpoint = this.breakpoint;
     });
   }
+  async updateGridItemsWithInputFields() {
+    const items = Array.from(this.element.children).filter(isGridItem);
+    // if layout changes to columns instead of row, remove all padding
+    const hasColumnLayout = window ? window.getComputedStyle(this.element).flexDirection === "column" : false;
+    let maxHeight = 0;
+    const sizes = [];
+    items.forEach(item => {
+      const inputErrorDom = item.querySelector("span.duet-input-error");
+      const height = inputErrorDom ? this.outerHeight(inputErrorDom) : 0;
+      sizes.push(height);
+    });
+    maxHeight = Math.max(...sizes);
+    items.forEach(item => {
+      const inputErrorDom = item.querySelector("span.duet-input-error");
+      const height = inputErrorDom ? this.outerHeight(inputErrorDom) : 0;
+      if (height < maxHeight && !hasColumnLayout) {
+        item.setAttribute("style", `padding-bottom: ${maxHeight - height}px;`);
+      }
+      else if (height === maxHeight || hasColumnLayout) {
+        item.setAttribute("style", `padding-bottom: 0px;`);
+      }
+    });
+  }
   /**
    * render() function
    * Always the last one in the class.
@@ -9200,7 +9783,7 @@ class DuetGrid {
         "duet-grid": true,
         "duet-no-stacking": !this.responsive,
         "duet-grid-align-top": this.alignment === "top",
-        "duet-grid-align-bottom": this.alignment === "bottom",
+        "duet-grid-align-bottom": this.alignment === "bottom" || this.alignment === "form_distribute",
         "duet-grid-align-center": this.alignment === "center",
         "duet-grid-align-stretch": this.alignment === "stretch",
         "duet-grid-align-baseline": this.alignment === "baseline",
@@ -9235,7 +9818,8 @@ class DuetGrid {
       "direction": [1],
       "alignment": [1],
       "distribution": [1],
-      "mobile": [1]
+      "mobile": [1],
+      "distributeFormElement": [32]
     },
     "$listeners$": undefined,
     "$lazyBundleId$": "-",
@@ -9316,6 +9900,8 @@ class DuetGridItem {
   }; }
 }
 
+var formSearch={"title":"form-search","tags":"form search magnifying glass","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M23.245 23.996a.743.743 0 0 1-.53-.22L16.2 17.26a9.824 9.824 0 0 1-2.553 1.579 9.766 9.766 0 0 1-7.51.069 9.745 9.745 0 0 1-5.359-5.262c-1.025-2.412-1.05-5.08-.069-7.51S3.558 1.802 5.97.777a9.744 9.744 0 0 1 7.51-.069c2.431.981 4.334 2.849 5.359 5.262s1.05 5.08.069 7.51a9.807 9.807 0 0 1-1.649 2.718l6.517 6.518a.75.75 0 0 1-.531 1.28zM9.807 1.49a8.259 8.259 0 0 0-3.25.667c-2.044.869-3.627 2.481-4.458 4.54s-.81 4.318.058 6.362a8.26 8.26 0 0 0 4.54 4.458 8.259 8.259 0 0 0 6.362-.059 8.285 8.285 0 0 0 2.594-1.736.365.365 0 0 1 .077-.076 8.245 8.245 0 0 0 1.786-2.728 8.255 8.255 0 0 0-.059-6.362 8.257 8.257 0 0 0-4.54-4.458 8.28 8.28 0 0 0-3.11-.608z\"/></svg>"};
+
 var navigationContactDropdown={"title":"navigation-contact-dropdown","tags":"navigation contact dropdown speech bubbles","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M20.247 24a.743.743 0 0 1-.53-.22l-4.28-4.28h-.439c-3.308 0-6-2.692-6-6s2.692-6 6-6h3c3.309.001 6 2.692 6 6a5.974 5.974 0 0 1-3 5.179v4.571a.75.75 0 0 1-.751.75zm-5.25-15c-2.481 0-4.5 2.019-4.5 4.5s2.019 4.5 4.5 4.5h.75c.198 0 .391.08.53.22l3.22 3.22v-3.213c0-.289.169-.555.429-.678a4.51 4.51 0 0 0 2.571-4.049 4.504 4.504 0 0 0-4.498-4.499h-3.002z\"/><path d=\"M3.747 16.5a.747.747 0 0 1-.75-.75v-4.57a5.967 5.967 0 0 1-2.65-3.171A5.948 5.948 0 0 1 .57 3.431 6.014 6.014 0 0 1 5.985 0h3.012a6.04 6.04 0 0 1 5.752 4.286.751.751 0 0 1-.718.964.755.755 0 0 1-.719-.536A4.531 4.531 0 0 0 8.997 1.5h-3a4.511 4.511 0 0 0-4.071 2.572c-.512 1.084-.571 2.302-.167 3.431s1.224 2.032 2.308 2.545c.261.123.43.39.43.678v3.214l1.72-1.72a.744.744 0 0 1 1.06 0 .752.752 0 0 1 0 1.061l-3 3a.744.744 0 0 1-.53.219z\"/></svg>"};
 
 var navigationLanguage={"title":"navigation-language","tags":"navigation language earth world map","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M11.996 24c-2.732 0-5.309-.901-7.453-2.605l-.017-.012-.031-.025a12.68 12.68 0 0 1-.238-.196c-.071-.06-.142-.122-.213-.184l-.143-.126c-.13-.118-.257-.24-.381-.363l-.018-.018a11.904 11.904 0 0 1-3.445-9.695l.001-.007c.018-.174.041-.348.067-.523l.019-.125c.028-.174.058-.348.093-.521l.003-.013C1.379 4.031 6.321 0 11.996 0c6.617 0 12 5.383 12 12 0 1.083-.148 2.164-.44 3.214l-.009.032a12.172 12.172 0 0 1-.671 1.809s-.072.155-.1.212a11.896 11.896 0 0 1-.189.368A11.987 11.987 0 0 1 11.996 24zm-6.181-3.519a10.388 10.388 0 0 0 6.181 2.019c3.471 0 6.642-1.669 8.611-4.497h-.59a2.244 2.244 0 0 1-2.22-1.879L17.111 12h-.944a2.252 2.252 0 0 1-2.182-2.796l.75-3A2.245 2.245 0 0 1 16.917 4.5h2.416A10.49 10.49 0 0 0 1.934 9h4.391c1.034 0 1.932.701 2.183 1.704l.75 3a2.235 2.235 0 0 1-.592 2.137c-.425.425-.99.659-1.591.659h-.464zm-4.248-9.687-.015.116a9.092 9.092 0 0 0-.053.96l-.002.17c.001.145.005.29.011.435l.006.127c.009.154.02.308.035.461l.005.041c.071.68.209 1.354.411 2.003l.009.028a10.457 10.457 0 0 0 2.537 4.222l.75-3.751A.75.75 0 0 1 5.996 15h1.079a.75.75 0 0 0 .728-.932l-.75-3a.751.751 0 0 0-.729-.568H1.606l-.039.294zM16.917 6a.75.75 0 0 0-.728.568l-.75 3a.752.752 0 0 0 .728.932h1.579c.368 0 .679.264.74.627l.791 4.75a.748.748 0 0 0 .74.626h1.461c.171-.358.321-.727.449-1.1l.021-.062A10.486 10.486 0 0 0 20.598 6z\"/></svg>"};
@@ -9506,7 +10092,41 @@ const enableBodyScroll = targetElement => {
   }
 };
 
-const duetHeaderCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-header,*.sc-duet-header::after,*.sc-duet-header::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-header-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%}@supports (position: -webkit-sticky){/*!@:host*/.sc-duet-header-h{position:-webkit-sticky;top:-4rem;z-index:400}}@supports (position: sticky){/*!@:host*/.sc-duet-header-h{position:sticky;top:-4rem;z-index:400}}/*!@.duet-header-reserved-space*/.duet-header-reserved-space.sc-duet-header{height:4rem}@media (min-width: 62em){/*!@.duet-header-reserved-space.duet-with-links*/.duet-header-reserved-space.duet-with-links.sc-duet-header{height:7rem}}/*!@.duet-header*/.duet-header.sc-duet-header{-webkit-user-select:none;user-select:none;position:fixed;top:0;left:0;z-index:400;display:block;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\";font-size:0.875rem;font-weight:400;line-height:1.5;color:#00294d;text-align:left}/*!@.duet-header.duet-theme-turva*/.duet-header.duet-theme-turva.sc-duet-header{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}@media (min-width: 62em){/*!@.duet-header.duet-theme-turva*/.duet-header.duet-theme-turva.sc-duet-header{box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13)}}@media (min-width: 62em){/*!@.duet-header*/.duet-header.sc-duet-header{position:absolute;box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07)}/*!@.duet-header.duet-header-inactive*/.duet-header.duet-header-inactive.sc-duet-header{position:fixed}}/*!@.duet-header **/.duet-header.sc-duet-header *.sc-duet-header{-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}/*!@.duet-header-top*/.duet-header-top.sc-duet-header{position:relative;z-index:200;display:flex;flex-direction:row;align-items:center;width:100%;height:4rem;padding:0 16px;background:white;border-bottom:1px solid #e1e3e6;box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07)}@media (min-width: 62em){/*!@.duet-header-top*/.duet-header-top.sc-duet-header{z-index:100;padding:0 28px;box-shadow:none}/*!@.duet-header-top duet-logo*/.duet-header-top.sc-duet-header duet-logo.sc-duet-header{padding-right:4px}}@media (min-width: 106.25em){/*!@.duet-header-top*/.duet-header-top.sc-duet-header{padding:0 48px}}/*!@.duet-theme-turva .duet-header-top*/.duet-theme-turva.sc-duet-header .duet-header-top.sc-duet-header{border-color:#e4e4e6;box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13)}@media (min-width: 62em){/*!@.duet-theme-turva .duet-header-top*/.duet-theme-turva.sc-duet-header .duet-header-top.sc-duet-header{box-shadow:none}}/*!@.duet-theme-turva .duet-header-top duet-logo*/.duet-theme-turva.sc-duet-header .duet-header-top.sc-duet-header duet-logo.sc-duet-header{left:-80px !important;margin-top:-8px !important}/*!@.duet-header-top .duet-header-region*/.duet-header-top.sc-duet-header .duet-header-region.sc-duet-header{max-width:200px;padding-left:16px;margin-top:1px;margin-right:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-left:1px solid #cfd2d4}/*!@.duet-theme-turva .duet-header-top .duet-header-region*/.duet-theme-turva.sc-duet-header .duet-header-top.sc-duet-header .duet-header-region.sc-duet-header{border-color:#cfcfd1}@media (max-width: 35.9375em){/*!@.duet-header-top .duet-header-region*/.duet-header-top.sc-duet-header .duet-header-region.sc-duet-header{display:none}}@media (min-width: 62em){/*!@.duet-header-top .duet-header-region*/.duet-header-top.sc-duet-header .duet-header-region.sc-duet-header{padding-left:19px}}/*!@.duet-header-bottom*/.duet-header-bottom.sc-duet-header{position:fixed;top:4rem;bottom:0;left:0;z-index:100;display:flex;flex-direction:column;width:100%;overflow-y:auto;visibility:hidden;background:#f5f8fa;opacity:0;-webkit-overflow-scrolling:touch}/*!@.duet-theme-turva .duet-header-bottom*/.duet-theme-turva.sc-duet-header .duet-header-bottom.sc-duet-header{background:#f5f5f7}@media (min-width: 62em){/*!@.duet-header-bottom*/.duet-header-bottom.sc-duet-header{position:relative;top:auto;bottom:auto;z-index:200;flex-direction:row;overflow:visible;visibility:visible;background:white;opacity:1}/*!@.duet-header-bottom.duet-header-inactive*/.duet-header-bottom.duet-header-inactive.sc-duet-header{position:relative}}/*!@.duet-header-bottom.active*/.duet-header-bottom.active.sc-duet-header{visibility:visible;opacity:1;transition:opacity 300ms ease, visibility 300ms ease}@media (min-width: 62em){/*!@.duet-header-bottom*/.duet-header-bottom.sc-duet-header{position:relative;transition:none !important}}/*!@.duet-header-items,\n.duet-header-bottom-utils,\n.duet-header-utils*/.duet-header-items.sc-duet-header,.duet-header-bottom-utils.sc-duet-header,.duet-header-utils.sc-duet-header{opacity:0;transition:transform 600ms ease, opacity 600ms ease;transform:translateY(-28px)}@media (min-width: 62em){/*!@.duet-header-items,\n.duet-header-bottom-utils,\n.duet-header-utils*/.duet-header-items.sc-duet-header,.duet-header-bottom-utils.sc-duet-header,.duet-header-utils.sc-duet-header{opacity:1;transition:none !important;transform:none}}/*!@.active .duet-header-items,\n.active .duet-header-bottom-utils,\n.active .duet-header-utils*/.active.sc-duet-header .duet-header-items.sc-duet-header,.active.sc-duet-header .duet-header-bottom-utils.sc-duet-header,.active.sc-duet-header .duet-header-utils.sc-duet-header{opacity:1;transform:translateY(0)}/*!@.duet-header-items*/.duet-header-items.sc-duet-header{position:relative;z-index:300;display:block;width:100%;font-size:1rem;font-weight:400;line-height:1.5;background:white}@media (min-width: 62em){/*!@.duet-header-items*/.duet-header-items.sc-duet-header{z-index:100;display:flex;flex-direction:row;padding:0 21.5384615385px}}@media (min-width: 106.25em){/*!@.duet-header-items*/.duet-header-items.sc-duet-header{padding-left:43.6363636364px}}/*!@.duet-header-items a*/.duet-header-items.sc-duet-header a.sc-duet-header{position:relative;display:block;width:100%;height:48px;padding:0 20px;overflow:hidden;font-size:1rem;font-weight:600;line-height:48px;color:#00294d;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;border-bottom:1px solid #e1e3e6;border-radius:0}@media (min-width: 62em){/*!@.duet-header-items a*/.duet-header-items.sc-duet-header a.sc-duet-header{border-radius:4px}}/*!@.duet-theme-turva .duet-header-items a*/.duet-theme-turva.sc-duet-header .duet-header-items.sc-duet-header a.sc-duet-header{font-weight:600;color:#171c3a;border-color:#e1e3e6}/*!@.duet-header-items a:hover*/.duet-header-items.sc-duet-header a.sc-duet-header:hover{color:#004d80}/*!@.duet-theme-turva .duet-header-items a:hover*/.duet-theme-turva.sc-duet-header .duet-header-items.sc-duet-header a.sc-duet-header:hover{color:#444445}/*!@.duet-header-items a:focus*/.duet-header-items.sc-duet-header a.sc-duet-header:focus{outline:0}/*!@:host(.user-is-tabbing) .duet-header-items a:focus*/.user-is-tabbing.sc-duet-header-h .duet-header-items.sc-duet-header a.sc-duet-header:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@:host(.user-is-tabbing) .duet-theme-turva .duet-header-items a:focus*/.user-is-tabbing.sc-duet-header-h .duet-theme-turva.sc-duet-header .duet-header-items.sc-duet-header a.sc-duet-header:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}@media (min-width: 62em){/*!@.duet-header-items a*/.duet-header-items.sc-duet-header a.sc-duet-header{width:auto;max-width:300px;padding:0 12px;overflow:hidden;font-size:0.875rem;text-overflow:ellipsis;border:0}}/*!@.duet-header-items a.active*/.duet-header-items.sc-duet-header a.active.sc-duet-header{color:#0077b3;-moz-osx-font-smoothing:auto;-webkit-font-smoothing:subpixel-antialiased}/*!@.duet-theme-turva .duet-header-items a.active*/.duet-theme-turva.sc-duet-header .duet-header-items.sc-duet-header a.active.sc-duet-header{color:#c60c30}/*!@.duet-header-items a.active:hover*/.duet-header-items.sc-duet-header a.active.sc-duet-header:hover{color:#0077b3}/*!@.duet-theme-turva .duet-header-items a.active:hover*/.duet-theme-turva.sc-duet-header .duet-header-items.sc-duet-header a.active.sc-duet-header:hover{color:#c60c30}/*!@.duet-header-items a.active::after*/.duet-header-items.sc-duet-header a.active.sc-duet-header::after{position:absolute;top:0;bottom:0;left:0;width:4px;content:\"\";background:#0077b3}/*!@.duet-theme-turva .duet-header-items a.active::after*/.duet-theme-turva.sc-duet-header .duet-header-items.sc-duet-header a.active.sc-duet-header::after{background:#c60c30}@media (min-width: 62em){/*!@.duet-header-items a.active::after*/.duet-header-items.sc-duet-header a.active.sc-duet-header::after{top:auto;left:12px;width:calc(100% - 24px);height:3px}}/*!@.duet-header-toggle*/.duet-header-toggle.sc-duet-header{display:flex;align-items:center;justify-content:center;width:48px;height:48px;margin-right:-8px;margin-left:auto;cursor:pointer;border-radius:4px;-webkit-appearance:none;appearance:none}/*!@.duet-header-toggle:focus*/.duet-header-toggle.sc-duet-header:focus{outline:0}/*!@:host(.user-is-tabbing) .duet-header-toggle:focus*/.user-is-tabbing.sc-duet-header-h .duet-header-toggle.sc-duet-header:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@:host(.user-is-tabbing) .duet-theme-turva .duet-header-toggle:focus*/.user-is-tabbing.sc-duet-header-h .duet-theme-turva.sc-duet-header .duet-header-toggle.sc-duet-header:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}@media (min-width: 62em){/*!@.duet-header-toggle*/.duet-header-toggle.sc-duet-header{display:none}}/*!@.duet-header-hamburger*/.duet-header-hamburger.sc-duet-header{position:relative;width:24px;height:24px;margin-top:5px !important;pointer-events:none;transition:0.4s ease-in-out;backface-visibility:hidden}/*!@.duet-header-hamburger .duet-header-bar*/.duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header{position:absolute;left:0;display:block;width:100%;height:2px;background:#00294d;border-radius:20rem;opacity:1;transition:0.25s ease-in-out;transform:rotate(0deg) scale(0.98)}/*!@.duet-theme-turva .duet-header-hamburger .duet-header-bar*/.duet-theme-turva.sc-duet-header .duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header{background:#171c3a}/*!@.duet-header-hamburger .duet-header-bar:nth-child(1)*/.duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header:nth-child(1){top:0}/*!@.duet-header-hamburger .duet-header-bar:nth-child(2), .duet-header-hamburger .duet-header-bar:nth-child(3)*/.duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header:nth-child(2),.duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header:nth-child(3){top:7px}/*!@.duet-header-hamburger .duet-header-bar:nth-child(4)*/.duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header:nth-child(4){top:14px}/*!@button.active .duet-header-hamburger .duet-header-bar:nth-child(1)*/button.active.sc-duet-header .duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header:nth-child(1){top:7px;left:50%;width:0%}/*!@button.active .duet-header-hamburger .duet-header-bar:nth-child(2)*/button.active.sc-duet-header .duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header:nth-child(2){transform:rotate(45deg)}/*!@button.active .duet-header-hamburger .duet-header-bar:nth-child(3)*/button.active.sc-duet-header .duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header:nth-child(3){transform:rotate(-45deg)}/*!@button.active .duet-header-hamburger .duet-header-bar:nth-child(4)*/button.active.sc-duet-header .duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header:nth-child(4){top:7px;left:50%;width:0%}/*!@.duet-header-utils*/.duet-header-utils.sc-duet-header{display:flex;flex-direction:column;width:100%}@media (min-width: 62em){/*!@.duet-header-utils*/.duet-header-utils.sc-duet-header{position:absolute;top:-4rem;right:0;z-index:999999999;flex-direction:row;align-items:center;justify-content:space-between;width:auto;margin-right:20px}}@media (min-width: 106.25em){/*!@.duet-header-utils*/.duet-header-utils.sc-duet-header{margin-right:36px}}@media (min-width: 62em){/*!@.duet-header-bottom-utils*/.duet-header-bottom-utils.sc-duet-header{position:absolute;top:0;right:0;z-index:999999999;margin-right:20px}}@media (min-width: 106.25em){/*!@.duet-header-bottom-utils*/.duet-header-bottom-utils.sc-duet-header{margin-right:36px}}/*!@button*/button.sc-duet-header{font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}/*!@.duet-theme-turva button*/.duet-theme-turva.sc-duet-header button.sc-duet-header{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}/*!@.duet-header-button*/.duet-header-button.sc-duet-header{position:relative;display:flex;align-items:center;width:100%;height:48px;padding:0 20px;overflow:hidden;font-size:1rem;font-weight:400;line-height:48px;color:#00294d;text-align:left;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;border-bottom:1px solid #e1e3e6;border-radius:4px;-webkit-appearance:none;appearance:none}/*!@.duet-theme-turva .duet-header-button*/.duet-theme-turva.sc-duet-header .duet-header-button.sc-duet-header{color:#171c3a;border-color:#e4e4e6}/*!@.duet-header-button:hover*/.duet-header-button.sc-duet-header:hover{color:#004d80}/*!@.duet-theme-turva .duet-header-button:hover*/.duet-theme-turva.sc-duet-header .duet-header-button.sc-duet-header:hover{color:#444445}/*!@.duet-header-button:focus*/.duet-header-button.sc-duet-header:focus{outline:0}/*!@:host(.user-is-tabbing) .duet-header-button:focus*/.user-is-tabbing.sc-duet-header-h .duet-header-button.sc-duet-header:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@:host(.user-is-tabbing) .duet-theme-turva .duet-header-button:focus*/.user-is-tabbing.sc-duet-header-h .duet-theme-turva.sc-duet-header .duet-header-button.sc-duet-header:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-header-button:active*/.duet-header-button.sc-duet-header:active{opacity:0.75}@media (min-width: 62em){/*!@.duet-header-button*/.duet-header-button.sc-duet-header{width:auto;max-width:200px;height:4rem;padding:0 16px;font-size:0.875rem;line-height:4rem;border:0}/*!@.duet-header-button::before*/.duet-header-button.sc-duet-header::before{position:absolute;top:50%;right:0;width:1px;height:20px;content:\"\";background:#cfd2d4;transform:translateY(-50%)}/*!@.duet-theme-turva .duet-header-button::before*/.duet-theme-turva.sc-duet-header .duet-header-button.sc-duet-header::before{background:#cfcfd1}}/*!@.duet-header-button.active*/.duet-header-button.active.sc-duet-header{color:#0077b3;border-radius:0}/*!@.duet-theme-turva .duet-header-button.active*/.duet-theme-turva.sc-duet-header .duet-header-button.active.sc-duet-header{color:#c60c30}/*!@.duet-header-button.active:hover*/.duet-header-button.active.sc-duet-header:hover{color:#0077b3}/*!@.duet-theme-turva .duet-header-button.active:hover*/.duet-theme-turva.sc-duet-header .duet-header-button.active.sc-duet-header:hover{color:#c60c30}/*!@.duet-header-button.active::after*/.duet-header-button.active.sc-duet-header::after{position:absolute;top:0;bottom:0;left:0;width:3px;content:\"\";background:#0077b3}/*!@.duet-theme-turva .duet-header-button.active::after*/.duet-theme-turva.sc-duet-header .duet-header-button.active.sc-duet-header::after{color:#c60c30}/*!@.duet-header-no-action*/.duet-header-no-action.sc-duet-header{pointer-events:none}/*!@.duet-header-user-label*/.duet-header-user-label.sc-duet-header{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (min-width: 62em){/*!@.duet-header-utils > *:last-child::before,\n.duet-header-utils > *:last-child button::before*/.duet-header-utils.sc-duet-header>*.sc-duet-header:last-child::before,.duet-header-utils.sc-duet-header>*.sc-duet-header:last-child button.sc-duet-header::before{display:none}}@media (min-width: 62em){/*!@.duet-header-utils > *:last-child .duet-header-dropdown-content*/.duet-header-utils.sc-duet-header>*.sc-duet-header:last-child .duet-header-dropdown-content.sc-duet-header{right:0;left:auto}}/*!@.duet-header-language*/.duet-header-language.sc-duet-header{text-transform:uppercase}/*!@.duet-header-icon*/.duet-header-icon.sc-duet-header{display:inline-flex;min-width:12px;margin-right:12px;font-size:0;line-height:normal;vertical-align:baseline}@media (min-width: 62em){/*!@.duet-header-icon*/.duet-header-icon.sc-duet-header{margin-right:8px}}/*!@.duet-header-caret*/.duet-header-caret.sc-duet-header{position:absolute;top:50%;right:20px;display:flex;width:10px;height:10px;margin-left:8px;line-height:normal;pointer-events:none;transition:300ms ease;transform:translateY(-50%);transform-origin:50% 50%}@media (min-width: 62em){/*!@.duet-header-caret*/.duet-header-caret.sc-duet-header{width:7px;height:7px}}/*!@.duet-header-caret duet-icon*/.duet-header-caret.sc-duet-header duet-icon.sc-duet-header{width:10px}/*!@.duet-header-dropdown-toggle.active .duet-header-caret*/.duet-header-dropdown-toggle.active.sc-duet-header .duet-header-caret.sc-duet-header{transform:translateY(-50%) rotate(180deg)}/*!@.duet-header-dropdown-toggle:focus*/.duet-header-dropdown-toggle.sc-duet-header:focus{outline:0}/*!@:host(.user-is-tabbing) .duet-header-dropdown-toggle:focus*/.user-is-tabbing.sc-duet-header-h .duet-header-dropdown-toggle.sc-duet-header:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@:host(.user-is-tabbing) .duet-theme-turva .duet-header-dropdown-toggle:focus*/.user-is-tabbing.sc-duet-header-h .duet-theme-turva.sc-duet-header .duet-header-dropdown-toggle.sc-duet-header:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-header-dropdown-toggle:active*/.duet-header-dropdown-toggle.sc-duet-header:active{outline:none}/*!@.duet-header-badge*/.duet-header-badge.sc-duet-header{display:inline-block;width:6px;height:6px;margin-top:16px;margin-left:5px;vertical-align:top;background:#f7b228;border-radius:50%;box-shadow:0 0 0 1px #c18b1f}/*!@.duet-theme-turva .duet-header-badge*/.duet-theme-turva.sc-duet-header .duet-header-badge.sc-duet-header{background:#faa40f}/*!@.duet-header-dropdown*/.duet-header-dropdown.sc-duet-header{position:relative}@media (min-width: 62em){/*!@.duet-header-dropdown .duet-header-dropdown-toggle*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.sc-duet-header{z-index:200;padding-right:36px;overflow:hidden;transition:border 300ms ease}}/*!@.duet-header-dropdown .duet-header-dropdown-toggle::after*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.sc-duet-header::after{display:none !important}@media (min-width: 62em){/*!@.duet-header-dropdown .duet-header-dropdown-toggle::after*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.sc-duet-header::after{position:absolute;top:auto;bottom:0;left:0;display:block !important;width:100%;height:3px;content:\"\";background:#0077b3;transition:300ms ease;transform:translateY(3px)}/*!@.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle::after*/.duet-theme-turva.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.sc-duet-header::after{background:#c60c30}}/*!@.duet-header-dropdown .duet-header-dropdown-toggle.active, .duet-header-dropdown .duet-header-dropdown-toggle.active:hover*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.active.sc-duet-header,.duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.active.sc-duet-header:hover{color:#004d80;border-bottom:1px solid #f5f8fa}/*!@.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active, .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active:hover*/.duet-theme-turva.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.active.sc-duet-header,.duet-theme-turva.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.active.sc-duet-header:hover{color:#444445;border-color:#f5f5f7}@media (min-width: 62em){/*!@.duet-header-dropdown .duet-header-dropdown-toggle.active, .duet-header-dropdown .duet-header-dropdown-toggle.active:hover*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.active.sc-duet-header,.duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.active.sc-duet-header:hover{border:0}/*!@.duet-header-dropdown .duet-header-dropdown-toggle.active::after, .duet-header-dropdown .duet-header-dropdown-toggle.active:hover::after*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.active.sc-duet-header::after,.duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.active.sc-duet-header:hover::after{position:absolute;top:auto;bottom:0;left:0;width:100%;height:3px;transform:translateY(0)}}/*!@.duet-header-dropdown .duet-header-dropdown-content*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header{display:none;padding-bottom:16px;background:#f5f8fa;border-bottom:1px solid #e1e3e6}/*!@.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content*/.duet-theme-turva.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header{background:#f5f5f7;border-color:#e1e3e6}@media (min-width: 62em){/*!@.duet-header-dropdown .duet-header-dropdown-content*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header{position:absolute;top:100%;left:0;z-index:600;display:block;min-width:170px;padding-top:16px;padding-left:0;visibility:hidden;border:0;border-radius:4px;border-top-left-radius:0;border-top-right-radius:0;box-shadow:0 4px 10px 0 rgba(0, 41, 77, 0.15);opacity:0;transition:300ms ease;transform:scale(0.85) translateZ(0) translateY(-20px)}}/*!@.duet-header-dropdown .duet-header-dropdown-content.active*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.active.sc-duet-header{display:block}@media (min-width: 62em){/*!@.duet-header-dropdown .duet-header-dropdown-content.active*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.active.sc-duet-header{visibility:visible;opacity:1;transform:translateZ(0) translateY(0)}}/*!@.duet-header-dropdown .duet-header-dropdown-content a*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header{padding:3px 8px 4px !important;position:relative;display:block;width:100%;padding-right:16px;padding-left:48px !important;overflow:hidden;font-size:0.875rem;font-weight:400;line-height:1.5;color:#00294d;text-align:left;text-decoration:none;white-space:nowrap;cursor:pointer;transition:300ms ease}/*!@.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a*/.duet-theme-turva.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header{color:#171c3a}@media (min-width: 62em){/*!@.duet-header-dropdown .duet-header-dropdown-content a*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header{padding-left:20px !important}}@media (min-width: 62em){/*!@.duet-header-dropdown .duet-header-dropdown-content a:hover*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header:hover{background:#e6f2f8}/*!@.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:hover*/.duet-theme-turva.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header:hover{background:#f9e6ea}}/*!@.duet-header-dropdown .duet-header-dropdown-content a:focus*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header:focus{outline:0}/*!@:host(.user-is-tabbing) .duet-header-dropdown .duet-header-dropdown-content a:focus*/.user-is-tabbing.sc-duet-header-h .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@:host(.user-is-tabbing) .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:focus*/.user-is-tabbing.sc-duet-header-h .duet-theme-turva.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-header-dropdown .duet-header-dropdown-content a.active*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.active.sc-duet-header{padding-right:36px;font-weight:600;vertical-align:baseline;pointer-events:none}/*!@.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a.active*/.duet-theme-turva.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.active.sc-duet-header{font-weight:700}@media (min-width: 62em){/*!@.duet-header-dropdown .duet-header-dropdown-content a.active*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.active.sc-duet-header{color:white;background:#0077b3}/*!@.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a.active*/.duet-theme-turva.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.active.sc-duet-header{background:#c60c30}}/*!@.duet-header-dropdown .duet-header-dropdown-content .duet-header-link-external*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header .duet-header-link-external.sc-duet-header{margin-left:4px}/*!@.duet-header-back .duet-header-top*/.duet-header-back.sc-duet-header .duet-header-top.sc-duet-header{flex-direction:row;align-items:center;justify-content:center}/*!@.duet-header-back duet-button*/.duet-header-back.sc-duet-header duet-button.sc-duet-header{position:absolute;top:50%;left:36px;transform:translateY(-50%)}@media (max-width: 35.9375em){/*!@.duet-header-back duet-button*/.duet-header-back.sc-duet-header duet-button.sc-duet-header{left:20px;max-width:40px;padding:0 12px;overflow:hidden}}/*!@.duet-header-back .duet-header-toggle*/.duet-header-back.sc-duet-header .duet-header-toggle.sc-duet-header{display:none !important}/*!@.duet-header-skip*/.duet-header-skip.sc-duet-header{padding:8px 16px 9px !important;position:absolute;top:-100%;left:-100%;z-index:200;width:1px;min-width:160px;height:1px;overflow:hidden;font-weight:600;color:#0077b3;text-align:center;text-decoration:none;background:white;border-radius:4px;opacity:0}/*!@.duet-header-skip:focus*/.duet-header-skip.sc-duet-header:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@.duet-theme-turva .duet-header-skip:focus, .duet-header-skip:focus.duet-theme-turva*/.duet-theme-turva.sc-duet-header .duet-header-skip.sc-duet-header:focus,.duet-header-skip.sc-duet-header:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-theme-turva .duet-header-skip*/.duet-theme-turva.sc-duet-header .duet-header-skip.sc-duet-header{min-width:120px;color:#171c3a}@media (min-width: 106.25em){/*!@.duet-header-skip*/.duet-header-skip.sc-duet-header{margin-left:20px}}/*!@.duet-header-skip:focus*/.duet-header-skip.sc-duet-header:focus{top:12px;left:20px;width:auto;height:auto;outline:0;opacity:1}";
+const DuetHeaderIcon = (props, _children) => {
+  const iconSize = props.iconSize ? props.iconSize : "x-small";
+  return (hAsync("span", { class: "duet-header-icon" },
+    hAsync("duet-icon", { margin: "none", size: iconSize, icon: props.icon, color: "currentColor" })));
+};
+
+const DuetHeaderDropdown = (props, _children) => {
+  const accessibleLabel = props.accessibleText ? props.accessibleText : props.label;
+  return (hAsync("div", { class: { ["duet-header-dropdown"]: true, [props.className]: !!props.className } },
+    hAsync("button", { ref: props.toggleRef, "aria-haspopup": "listbox", "aria-controls": props.id, "aria-expanded": props.isOpen ? "true" : "false", "aria-labelledby": `${props.id}-accessible-label`, id: `${props.id}-button`, type: "button", class: {
+        [props.id]: true,
+        "duet-header-dropdown-toggle": true,
+        "duet-header-button": true,
+        active: props.active,
+      }, onClick: props.onToggle },
+      props.icon && hAsync(DuetHeaderIcon, { icon: props.icon }),
+      hAsync("span", { "aria-hidden": "true", id: `${props.id}-label`, class: "duet-header-dropdown-label" }, props.label),
+      props.badge && hAsync("div", { class: "duet-header-badge" }),
+      hAsync("div", { class: "duet-header-caret", "aria-hidden": "true" },
+        hAsync("duet-icon", { margin: "none", size: "auto", icon: actionArrowDownSmall.svg, color: "currentColor" })),
+      hAsync("duet-visually-hidden", { id: `${props.id}-accessible-label` }, accessibleLabel)),
+    hAsync("div", { ref: props.itemsRef, tabindex: "-1", role: "menu", id: props.id, "aria-labelledby": `${props.id}-button`, class: {
+        "duet-header-dropdown-content": true,
+        [`${props.id}-items`]: true,
+        active: props.isOpen,
+      } }, _children)));
+};
+
+const DuetHeaderHamburger = () => (hAsync("div", { class: "duet-header-hamburger" },
+  hAsync("span", { class: "duet-header-bar" }),
+  hAsync("span", { class: "duet-header-bar" }),
+  hAsync("span", { class: "duet-header-bar" }),
+  hAsync("span", { class: "duet-header-bar" })));
+
+const duetHeaderCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-header,*.sc-duet-header::after,*.sc-duet-header::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-header-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%}@supports (position: -webkit-sticky){/*!@:host*/.sc-duet-header-h{position:-webkit-sticky;top:-4rem;z-index:400}}@supports (position: sticky){/*!@:host*/.sc-duet-header-h{position:sticky;top:-4rem;z-index:400}}@supports (position: -webkit-sticky){/*!@:host(.duet-header-multi-level-desktop-variation)*/.duet-header-multi-level-desktop-variation.sc-duet-header-h{top:0}}@supports (position: sticky){/*!@:host(.duet-header-multi-level-desktop-variation)*/.duet-header-multi-level-desktop-variation.sc-duet-header-h{top:0}}/*!@.duet-header-reserved-space*/.duet-header-reserved-space.sc-duet-header{height:4rem}@media (min-width: 62em){/*!@.duet-header-reserved-space.duet-with-links*/.duet-header-reserved-space.duet-with-links.sc-duet-header{height:7rem}}/*!@.duet-header*/.duet-header.sc-duet-header{-webkit-user-select:none;user-select:none;position:fixed;top:0;left:0;z-index:400;display:block;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\";font-size:0.875rem;font-weight:400;line-height:1.5;color:#00294d;text-align:left}/*!@.duet-header.duet-theme-turva*/.duet-header.duet-theme-turva.sc-duet-header{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}@media (min-width: 62em){/*!@.duet-header.duet-theme-turva*/.duet-header.duet-theme-turva.sc-duet-header{box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13)}}@media (min-width: 62em){/*!@.duet-header*/.duet-header.sc-duet-header{position:absolute;box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07)}/*!@.duet-header.duet-header-inactive*/.duet-header.duet-header-inactive.sc-duet-header{position:fixed}}/*!@.duet-header **/.duet-header.sc-duet-header *.sc-duet-header{-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}/*!@.duet-header-top*/.duet-header-top.sc-duet-header{position:relative;z-index:200;display:flex;flex-direction:row;align-items:center;width:100%;height:4rem;padding:0 16px;background:white;border-bottom:1px solid #e1e3e6;box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07)}@media (min-width: 62em){/*!@.duet-header-top*/.duet-header-top.sc-duet-header{z-index:100;padding:0 28px;box-shadow:none}/*!@.duet-header-top duet-logo*/.duet-header-top.sc-duet-header duet-logo.sc-duet-header{padding-right:4px}}@media (min-width: 106.25em){/*!@.duet-header-top*/.duet-header-top.sc-duet-header{padding:0 48px}}/*!@.duet-theme-turva .duet-header-top*/.duet-theme-turva.sc-duet-header .duet-header-top.sc-duet-header{border-color:#e4e4e6;box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13)}@media (min-width: 62em){/*!@.duet-theme-turva .duet-header-top*/.duet-theme-turva.sc-duet-header .duet-header-top.sc-duet-header{box-shadow:none}}/*!@.duet-theme-turva .duet-header-top duet-logo*/.duet-theme-turva.sc-duet-header .duet-header-top.sc-duet-header duet-logo.sc-duet-header{left:-80px !important;margin-top:-8px !important}/*!@.duet-header-top .duet-header-region*/.duet-header-top.sc-duet-header .duet-header-region.sc-duet-header{max-width:200px;padding-left:16px;margin-top:1px;margin-right:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-left:1px solid #cfd2d4}/*!@.duet-theme-turva .duet-header-top .duet-header-region*/.duet-theme-turva.sc-duet-header .duet-header-top.sc-duet-header .duet-header-region.sc-duet-header{border-color:#cfcfd1}@media (max-width: 35.9375em){/*!@.duet-header-top .duet-header-region*/.duet-header-top.sc-duet-header .duet-header-region.sc-duet-header{display:none}}@media (min-width: 62em){/*!@.duet-header-top .duet-header-region*/.duet-header-top.sc-duet-header .duet-header-region.sc-duet-header{padding-left:19px}}/*!@.duet-header-bottom*/.duet-header-bottom.sc-duet-header{position:fixed;top:4rem;bottom:0;left:0;z-index:100;display:flex;flex-direction:column;width:100%;overflow-y:auto;visibility:hidden;background:#f3f9fc;opacity:0;-webkit-overflow-scrolling:touch}/*!@.duet-theme-turva .duet-header-bottom*/.duet-theme-turva.sc-duet-header .duet-header-bottom.sc-duet-header{background:#f5f5f7}@media (min-width: 62em){/*!@.duet-header-bottom*/.duet-header-bottom.sc-duet-header{position:relative;top:auto;bottom:auto;z-index:200;flex-direction:row;overflow:visible;visibility:visible;background:white;opacity:1}/*!@.duet-header-bottom.duet-header-inactive*/.duet-header-bottom.duet-header-inactive.sc-duet-header{position:relative}}/*!@.duet-header-bottom.active*/.duet-header-bottom.active.sc-duet-header{visibility:visible;opacity:1;transition:opacity 300ms ease, visibility 300ms ease}@media (min-width: 62em){/*!@.duet-header-bottom*/.duet-header-bottom.sc-duet-header{position:relative;transition:none !important}}/*!@.duet-header-items,\n.duet-header-bottom-utils,\n.duet-header-utils*/.duet-header-items.sc-duet-header,.duet-header-bottom-utils.sc-duet-header,.duet-header-utils.sc-duet-header{opacity:0;transition:transform 600ms ease, opacity 600ms ease;transform:translateY(-28px)}@media (min-width: 62em){/*!@.duet-header-items,\n.duet-header-bottom-utils,\n.duet-header-utils*/.duet-header-items.sc-duet-header,.duet-header-bottom-utils.sc-duet-header,.duet-header-utils.sc-duet-header{opacity:1;transition:none !important;transform:none}}/*!@.active .duet-header-items,\n.active .duet-header-bottom-utils,\n.active .duet-header-utils*/.active.sc-duet-header .duet-header-items.sc-duet-header,.active.sc-duet-header .duet-header-bottom-utils.sc-duet-header,.active.sc-duet-header .duet-header-utils.sc-duet-header{opacity:1;transform:translateY(0)}/*!@.duet-header-items*/.duet-header-items.sc-duet-header{position:relative;z-index:300;display:block;width:100%;font-size:1rem;font-weight:400;line-height:1.5;background:white}@media (min-width: 62em){/*!@.duet-header-items*/.duet-header-items.sc-duet-header{z-index:100;display:flex;flex-direction:row;padding:0 21.5384615385px}}@media (min-width: 106.25em){/*!@.duet-header-items*/.duet-header-items.sc-duet-header{padding-left:43.6363636364px}}/*!@.duet-header-items .duet-header-item-container*/.duet-header-items.sc-duet-header .duet-header-item-container.sc-duet-header{border-bottom:1px solid #e1e3e6;border-radius:0}@media (min-width: 62em){/*!@.duet-header-items .duet-header-item-container*/.duet-header-items.sc-duet-header .duet-header-item-container.sc-duet-header{border:0}}/*!@.duet-header-items .duet-header-second-level .duet-header-item*/.duet-header-items.sc-duet-header .duet-header-second-level.sc-duet-header .duet-header-item.sc-duet-header{padding:0 40px;border:0}/*!@.duet-header-items .duet-header-second-level .duet-header-button*/.duet-header-items.sc-duet-header .duet-header-second-level.sc-duet-header .duet-header-button.sc-duet-header{border:0}/*!@.duet-header-items .duet-header-second-level .duet-header-dropdown-content*/.duet-header-items.sc-duet-header .duet-header-second-level.sc-duet-header .duet-header-dropdown-content.sc-duet-header{padding:0;border:0}/*!@.duet-header-items .duet-header-third-level .duet-header-item*/.duet-header-items.sc-duet-header .duet-header-third-level.sc-duet-header .duet-header-item.sc-duet-header{padding:0 75px}/*!@.duet-header-items .duet-header-item*/.duet-header-items.sc-duet-header .duet-header-item.sc-duet-header{position:relative;display:flex;align-items:center;width:100%;padding:0 20px;overflow:hidden;font-size:1rem;line-height:48px;color:#00294d;text-decoration:none;text-overflow:ellipsis;white-space:nowrap}@media (min-width: 62em){/*!@.duet-header-items .duet-header-item*/.duet-header-items.sc-duet-header .duet-header-item.sc-duet-header{border-radius:4px}}/*!@.duet-theme-turva .duet-header-items .duet-header-item*/.duet-theme-turva.sc-duet-header .duet-header-items.sc-duet-header .duet-header-item.sc-duet-header{font-weight:600;color:#171c3a;border-color:#e1e3e6}/*!@.duet-header-items .duet-header-item:hover*/.duet-header-items.sc-duet-header .duet-header-item.sc-duet-header:hover{color:#004d80}/*!@.duet-theme-turva .duet-header-items .duet-header-item:hover*/.duet-theme-turva.sc-duet-header .duet-header-items.sc-duet-header .duet-header-item.sc-duet-header:hover{color:#444445}/*!@.duet-header-items .duet-header-item:focus*/.duet-header-items.sc-duet-header .duet-header-item.sc-duet-header:focus{outline:0}/*!@:host(.user-is-tabbing) .duet-header-items .duet-header-item:focus*/.user-is-tabbing.sc-duet-header-h .duet-header-items.sc-duet-header .duet-header-item.sc-duet-header:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@:host(.user-is-tabbing) .duet-theme-turva .duet-header-items .duet-header-item:focus*/.user-is-tabbing.sc-duet-header-h .duet-theme-turva.sc-duet-header .duet-header-items.sc-duet-header .duet-header-item.sc-duet-header:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}@media (min-width: 62em){/*!@.duet-header-items .duet-header-item*/.duet-header-items.sc-duet-header .duet-header-item.sc-duet-header{width:auto;max-width:300px;padding:0 12px;overflow:hidden;font-size:0.875rem;text-overflow:ellipsis;border:0}}/*!@.duet-header-items .duet-header-item.active*/.duet-header-items.sc-duet-header .duet-header-item.active.sc-duet-header{color:#0077b3;-moz-osx-font-smoothing:auto;-webkit-font-smoothing:subpixel-antialiased}/*!@.duet-theme-turva .duet-header-items .duet-header-item.active*/.duet-theme-turva.sc-duet-header .duet-header-items.sc-duet-header .duet-header-item.active.sc-duet-header{color:#c60c30}/*!@.duet-header-items .duet-header-item.active:hover*/.duet-header-items.sc-duet-header .duet-header-item.active.sc-duet-header:hover{color:#0077b3}/*!@.duet-theme-turva .duet-header-items .duet-header-item.active:hover*/.duet-theme-turva.sc-duet-header .duet-header-items.sc-duet-header .duet-header-item.active.sc-duet-header:hover{color:#c60c30}/*!@.duet-header-items .duet-header-item.active::after*/.duet-header-items.sc-duet-header .duet-header-item.active.sc-duet-header::after{position:absolute;top:0;bottom:0;left:0;width:4px;content:\"\";background:#0077b3}/*!@.duet-theme-turva .duet-header-items .duet-header-item.active::after*/.duet-theme-turva.sc-duet-header .duet-header-items.sc-duet-header .duet-header-item.active.sc-duet-header::after{background:#c60c30}@media (min-width: 62em){/*!@.duet-header-items .duet-header-item.active::after*/.duet-header-items.sc-duet-header .duet-header-item.active.sc-duet-header::after{top:auto;left:12px;width:calc(100% - 24px);height:3px}}/*!@.duet-header-third-level-active .duet-header-items .duet-header-first-level.active*/.duet-header-third-level-active.sc-duet-header .duet-header-items.sc-duet-header .duet-header-first-level.active.sc-duet-header{color:#00294d}/*!@.duet-header-third-level-active .duet-header-items .duet-header-first-level.active::after*/.duet-header-third-level-active.sc-duet-header .duet-header-items.sc-duet-header .duet-header-first-level.active.sc-duet-header::after{display:none}/*!@.duet-header-third-level-active .duet-header-items .duet-header-second-level button*/.duet-header-third-level-active.sc-duet-header .duet-header-items.sc-duet-header .duet-header-second-level.sc-duet-header button.sc-duet-header{color:#00294d}/*!@.duet-header-toggle*/.duet-header-toggle.sc-duet-header{display:flex;align-items:center;justify-content:center;width:48px;height:48px;margin-right:-8px;margin-left:auto;cursor:pointer;border-radius:4px;-webkit-appearance:none;appearance:none}/*!@.duet-header-toggle:focus*/.duet-header-toggle.sc-duet-header:focus{outline:0}/*!@:host(.user-is-tabbing) .duet-header-toggle:focus*/.user-is-tabbing.sc-duet-header-h .duet-header-toggle.sc-duet-header:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@:host(.user-is-tabbing) .duet-theme-turva .duet-header-toggle:focus*/.user-is-tabbing.sc-duet-header-h .duet-theme-turva.sc-duet-header .duet-header-toggle.sc-duet-header:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}@media (min-width: 62em){/*!@.duet-header-toggle*/.duet-header-toggle.sc-duet-header{display:none}}/*!@.duet-header-hamburger*/.duet-header-hamburger.sc-duet-header{position:relative;width:24px;height:24px;margin-top:5px !important;pointer-events:none;transition:0.4s ease-in-out;backface-visibility:hidden}/*!@.duet-header-hamburger .duet-header-bar*/.duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header{position:absolute;left:0;display:block;width:100%;height:2px;background:#00294d;border-radius:20rem;opacity:1;transition:0.25s ease-in-out;transform:rotate(0deg) scale(0.98)}/*!@.duet-theme-turva .duet-header-hamburger .duet-header-bar*/.duet-theme-turva.sc-duet-header .duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header{background:#171c3a}/*!@.duet-header-hamburger .duet-header-bar:nth-child(1)*/.duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header:nth-child(1){top:0}/*!@.duet-header-hamburger .duet-header-bar:nth-child(2), .duet-header-hamburger .duet-header-bar:nth-child(3)*/.duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header:nth-child(2),.duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header:nth-child(3){top:7px}/*!@.duet-header-hamburger .duet-header-bar:nth-child(4)*/.duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header:nth-child(4){top:14px}/*!@button.active .duet-header-hamburger .duet-header-bar:nth-child(1)*/button.active.sc-duet-header .duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header:nth-child(1){top:7px;left:50%;width:0%}/*!@button.active .duet-header-hamburger .duet-header-bar:nth-child(2)*/button.active.sc-duet-header .duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header:nth-child(2){transform:rotate(45deg)}/*!@button.active .duet-header-hamburger .duet-header-bar:nth-child(3)*/button.active.sc-duet-header .duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header:nth-child(3){transform:rotate(-45deg)}/*!@button.active .duet-header-hamburger .duet-header-bar:nth-child(4)*/button.active.sc-duet-header .duet-header-hamburger.sc-duet-header .duet-header-bar.sc-duet-header:nth-child(4){top:7px;left:50%;width:0%}/*!@.duet-header-utils*/.duet-header-utils.sc-duet-header{display:flex;flex-direction:column;width:100%}@media (min-width: 62em){/*!@.duet-header-utils*/.duet-header-utils.sc-duet-header{position:absolute;top:-4rem;right:0;z-index:999999999;flex-direction:row;align-items:center;justify-content:space-between;width:auto;margin-right:20px}}@media (min-width: 106.25em){/*!@.duet-header-utils*/.duet-header-utils.sc-duet-header{margin-right:36px}}@media (min-width: 62em){/*!@.duet-header-bottom-utils*/.duet-header-bottom-utils.sc-duet-header{position:absolute;top:0;right:0;z-index:999999999;margin-right:20px}}@media (min-width: 106.25em){/*!@.duet-header-bottom-utils*/.duet-header-bottom-utils.sc-duet-header{margin-right:36px}}/*!@button*/button.sc-duet-header{font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}/*!@.duet-theme-turva button*/.duet-theme-turva.sc-duet-header button.sc-duet-header{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}/*!@.duet-header-button*/.duet-header-button.sc-duet-header{position:relative;display:flex;align-items:center;width:100%;height:48px;padding:0 20px;overflow:hidden;font-size:1rem;font-weight:400;line-height:48px;color:#00294d;text-align:left;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;border-bottom:1px solid #e1e3e6;border-radius:4px;-webkit-appearance:none;appearance:none}/*!@.duet-theme-turva .duet-header-button*/.duet-theme-turva.sc-duet-header .duet-header-button.sc-duet-header{color:#171c3a;border-color:#e4e4e6}/*!@.duet-header-button:hover*/.duet-header-button.sc-duet-header:hover{color:#004d80}/*!@.duet-theme-turva .duet-header-button:hover*/.duet-theme-turva.sc-duet-header .duet-header-button.sc-duet-header:hover{color:#444445}/*!@.duet-header-button:focus*/.duet-header-button.sc-duet-header:focus{outline:0}/*!@:host(.user-is-tabbing) .duet-header-button:focus*/.user-is-tabbing.sc-duet-header-h .duet-header-button.sc-duet-header:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@:host(.user-is-tabbing) .duet-theme-turva .duet-header-button:focus*/.user-is-tabbing.sc-duet-header-h .duet-theme-turva.sc-duet-header .duet-header-button.sc-duet-header:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-header-button:active*/.duet-header-button.sc-duet-header:active{opacity:0.75}@media (min-width: 62em){/*!@.duet-header-button*/.duet-header-button.sc-duet-header{width:auto;max-width:200px;height:4rem;padding:0 16px;font-size:0.875rem;line-height:4rem;border:0}/*!@.duet-header-button::before*/.duet-header-button.sc-duet-header::before{position:absolute;top:50%;right:0;width:1px;height:20px;content:\"\";background:#cfd2d4;transform:translateY(-50%)}/*!@.duet-theme-turva .duet-header-button::before*/.duet-theme-turva.sc-duet-header .duet-header-button.sc-duet-header::before{background:#cfcfd1}}/*!@.duet-header-button.active*/.duet-header-button.active.sc-duet-header{color:#0077b3;border-radius:0}/*!@.duet-theme-turva .duet-header-button.active*/.duet-theme-turva.sc-duet-header .duet-header-button.active.sc-duet-header{color:#c60c30}/*!@.duet-header-button.active:hover*/.duet-header-button.active.sc-duet-header:hover{color:#0077b3}/*!@.duet-theme-turva .duet-header-button.active:hover*/.duet-theme-turva.sc-duet-header .duet-header-button.active.sc-duet-header:hover{color:#c60c30}/*!@.duet-header-button.active::after*/.duet-header-button.active.sc-duet-header::after{position:absolute;top:0;bottom:0;left:0;width:3px;content:\"\";background:#0077b3}/*!@.duet-theme-turva .duet-header-button.active::after*/.duet-theme-turva.sc-duet-header .duet-header-button.active.sc-duet-header::after{color:#c60c30}/*!@.duet-header-utils .duet-header-button.duet-header-logout*/.duet-header-utils.sc-duet-header .duet-header-button.duet-header-logout.sc-duet-header{align-self:center;justify-content:center;width:auto;height:2.5rem;margin:2.25rem 0;font-weight:600;border:2px solid #00294d;border-radius:20rem}/*!@.duet-theme-turva .duet-header-utils .duet-header-button.duet-header-logout*/.duet-theme-turva.sc-duet-header .duet-header-utils.sc-duet-header .duet-header-button.duet-header-logout.sc-duet-header{border-color:#171c3a}/*!@.duet-header-utils .duet-header-button.duet-header-logout .duet-header-icon*/.duet-header-utils.sc-duet-header .duet-header-button.duet-header-logout.sc-duet-header .duet-header-icon.sc-duet-header{margin-right:0.5rem}/*!@.duet-header-utils .duet-header-button.duet-header-logout .duet-header-button-label*/.duet-header-utils.sc-duet-header .duet-header-button.duet-header-logout.sc-duet-header .duet-header-button-label.sc-duet-header{font-size:0.875rem}@media (min-width: 62em){/*!@.duet-header-utils .duet-header-button.duet-header-logout*/.duet-header-utils.sc-duet-header .duet-header-button.duet-header-logout.sc-duet-header{height:4rem;margin:0;font-weight:400;border:0}/*!@.duet-header-utils .duet-header-button.duet-header-logout .duet-header-icon*/.duet-header-utils.sc-duet-header .duet-header-button.duet-header-logout.sc-duet-header .duet-header-icon.sc-duet-header{margin-right:0.75rem}}/*!@.duet-header-no-action*/.duet-header-no-action.sc-duet-header{pointer-events:none}/*!@.duet-header-user-label*/.duet-header-user-label.sc-duet-header{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (min-width: 62em){/*!@.duet-header-utils > *:last-child::before,\n.duet-header-utils > *:last-child button::before*/.duet-header-utils.sc-duet-header>*.sc-duet-header:last-child::before,.duet-header-utils.sc-duet-header>*.sc-duet-header:last-child button.sc-duet-header::before{display:none}}@media (min-width: 62em){/*!@.duet-header-utils > *:last-child .duet-header-dropdown-content*/.duet-header-utils.sc-duet-header>*.sc-duet-header:last-child .duet-header-dropdown-content.sc-duet-header{right:0;left:auto}}/*!@.duet-header-language*/.duet-header-language.sc-duet-header{text-transform:uppercase}/*!@.duet-header-icon*/.duet-header-icon.sc-duet-header{display:inline-flex;min-width:12px;margin-right:12px;font-size:0;line-height:normal;vertical-align:baseline}@media (min-width: 62em){/*!@.duet-header-icon*/.duet-header-icon.sc-duet-header{margin-right:8px}}/*!@.duet-header-caret*/.duet-header-caret.sc-duet-header{position:absolute;top:50%;right:20px;display:flex;width:10px;height:10px;margin-left:8px;line-height:normal;pointer-events:none;transition:300ms ease;transform:translateY(-50%);transform-origin:50% 50%}@media (min-width: 62em){/*!@.duet-header-caret*/.duet-header-caret.sc-duet-header{width:7px;height:7px}}/*!@.duet-header-caret duet-icon*/.duet-header-caret.sc-duet-header duet-icon.sc-duet-header{width:10px}/*!@.duet-header-dropdown-toggle.active .duet-header-caret*/.duet-header-dropdown-toggle.active.sc-duet-header .duet-header-caret.sc-duet-header{transform:translateY(-50%) rotate(180deg)}/*!@.duet-header-dropdown-toggle:focus*/.duet-header-dropdown-toggle.sc-duet-header:focus{outline:0}/*!@:host(.user-is-tabbing) .duet-header-dropdown-toggle:focus*/.user-is-tabbing.sc-duet-header-h .duet-header-dropdown-toggle.sc-duet-header:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@:host(.user-is-tabbing) .duet-theme-turva .duet-header-dropdown-toggle:focus*/.user-is-tabbing.sc-duet-header-h .duet-theme-turva.sc-duet-header .duet-header-dropdown-toggle.sc-duet-header:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-header-dropdown-toggle:active*/.duet-header-dropdown-toggle.sc-duet-header:active{outline:none}/*!@.duet-header-badge*/.duet-header-badge.sc-duet-header{display:inline-block;width:6px;height:6px;margin-top:-1rem;margin-left:5px;vertical-align:top;background:#f7b228;border-radius:50%;box-shadow:0 0 0 1px #c18b1f}/*!@.duet-theme-turva .duet-header-badge*/.duet-theme-turva.sc-duet-header .duet-header-badge.sc-duet-header{background:#faa40f}/*!@.duet-header-dropdown*/.duet-header-dropdown.sc-duet-header{position:relative}@media (min-width: 62em){/*!@.duet-header-dropdown .duet-header-dropdown-toggle*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.sc-duet-header{z-index:200;padding-right:36px;overflow:hidden;transition:border 300ms ease}}/*!@.duet-header-dropdown .duet-header-dropdown-toggle::after*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.sc-duet-header::after{display:none !important}@media (min-width: 62em){/*!@.duet-header-dropdown .duet-header-dropdown-toggle::after*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.sc-duet-header::after{position:absolute;top:auto;bottom:0;left:0;display:block !important;width:100%;height:3px;content:\"\";background:#0077b3;transition:300ms ease;transform:translateY(3px)}/*!@.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle::after*/.duet-theme-turva.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.sc-duet-header::after{background:#c60c30}}/*!@.duet-header-dropdown .duet-header-dropdown-toggle.active, .duet-header-dropdown .duet-header-dropdown-toggle.active:hover*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.active.sc-duet-header,.duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.active.sc-duet-header:hover{color:#004d80;border-bottom:1px solid #f5f8fa}/*!@.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active, .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active:hover*/.duet-theme-turva.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.active.sc-duet-header,.duet-theme-turva.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.active.sc-duet-header:hover{color:#444445;border-color:#f5f5f7}@media (min-width: 62em){/*!@.duet-header-dropdown .duet-header-dropdown-toggle.active, .duet-header-dropdown .duet-header-dropdown-toggle.active:hover*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.active.sc-duet-header,.duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.active.sc-duet-header:hover{border:0}/*!@.duet-header-dropdown .duet-header-dropdown-toggle.active::after, .duet-header-dropdown .duet-header-dropdown-toggle.active:hover::after*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.active.sc-duet-header::after,.duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.active.sc-duet-header:hover::after{position:absolute;top:auto;bottom:0;left:0;width:100%;height:3px;transform:translateY(0)}}/*!@.duet-header-dropdown .duet-header-dropdown-content*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header{display:none;padding-bottom:16px;background:#f3f9fc;border-bottom:1px solid #e1e3e6}/*!@.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content*/.duet-theme-turva.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header{background:#f5f5f7;border-color:#e1e3e6}@media (min-width: 62em){/*!@.duet-header-dropdown .duet-header-dropdown-content*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header{position:absolute;top:100%;left:0;z-index:600;display:block;min-width:150px;padding-top:16px;padding-left:0;visibility:hidden;border:0;border-radius:4px;border-top-left-radius:0;border-top-right-radius:0;box-shadow:0 4px 10px 0 rgba(0, 41, 77, 0.15);opacity:0;transition:300ms ease;transform:scale(0.85) translateZ(0) translateY(-20px)}}@media (min-width: 64.0625em){/*!@.duet-header-dropdown .duet-header-dropdown-content*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header{min-width:170px}}/*!@.duet-header-dropdown .duet-header-dropdown-content.active*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.active.sc-duet-header{display:block}@media (min-width: 62em){/*!@.duet-header-dropdown .duet-header-dropdown-content.active*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.active.sc-duet-header{visibility:visible;opacity:1;transform:translateZ(0) translateY(0)}}/*!@.duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item)*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header:not(.duet-header-item){padding:3px 8px 4px !important;position:relative;display:block;width:100%;padding-right:16px;padding-left:48px !important;overflow:hidden;font-size:0.875rem;font-weight:400;line-height:1.5;color:#00294d;text-align:left;text-decoration:none;white-space:nowrap;cursor:pointer;transition:300ms ease}/*!@.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item)*/.duet-theme-turva.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header:not(.duet-header-item){color:#171c3a}@media (min-width: 62em){/*!@.duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item)*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header:not(.duet-header-item){padding-right:20px !important;padding-left:20px !important}}@media (min-width: 62em){/*!@.duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):hover*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header:not(.duet-header-item):hover{background:#e6f2f8}/*!@.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):hover*/.duet-theme-turva.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header:not(.duet-header-item):hover{background:#f9e6ea}}/*!@.duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header:not(.duet-header-item):focus{outline:0}/*!@:host(.user-is-tabbing) .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus*/.user-is-tabbing.sc-duet-header-h .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header:not(.duet-header-item):focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@:host(.user-is-tabbing) .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus*/.user-is-tabbing.sc-duet-header-h .duet-theme-turva.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header:not(.duet-header-item):focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header:not(.duet-header-item).active{padding-right:36px;font-weight:600;vertical-align:baseline;pointer-events:none}/*!@.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active*/.duet-theme-turva.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header:not(.duet-header-item).active{font-weight:700}@media (min-width: 62em){/*!@.duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header:not(.duet-header-item).active{color:white;background:#0077b3}/*!@.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active*/.duet-theme-turva.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header:not(.duet-header-item).active{background:#c60c30}}/*!@.duet-header-dropdown .duet-header-dropdown-content .duet-header-link-external*/.duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header .duet-header-link-external.sc-duet-header{margin-left:4px}/*!@.duet-header-back .duet-header-top*/.duet-header-back.sc-duet-header .duet-header-top.sc-duet-header{flex-direction:row;align-items:center;justify-content:center}/*!@.duet-header-back duet-button*/.duet-header-back.sc-duet-header duet-button.sc-duet-header{position:absolute;top:50%;left:36px;transform:translateY(-50%)}@media (max-width: 35.9375em){/*!@.duet-header-back duet-button*/.duet-header-back.sc-duet-header duet-button.sc-duet-header{left:20px;max-width:40px;padding:0 12px;overflow:hidden}}/*!@.duet-header-back .duet-header-toggle*/.duet-header-back.sc-duet-header .duet-header-toggle.sc-duet-header{display:none !important}/*!@.duet-header-skip*/.duet-header-skip.sc-duet-header{padding:15px 28px 16px !important;position:absolute;top:-100%;left:-100%;z-index:200;width:1px;min-width:190px;height:1px;overflow:hidden;font-weight:600;color:#0077b3;text-align:center;text-decoration:none;background:white;border-radius:4px;opacity:0}/*!@.duet-header-skip:focus*/.duet-header-skip.sc-duet-header:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@.duet-theme-turva .duet-header-skip:focus, .duet-header-skip:focus.duet-theme-turva*/.duet-theme-turva.sc-duet-header .duet-header-skip.sc-duet-header:focus,.duet-header-skip.sc-duet-header:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-theme-turva .duet-header-skip*/.duet-theme-turva.sc-duet-header .duet-header-skip.sc-duet-header{min-width:120px;color:#171c3a}@media (min-width: 106.25em){/*!@.duet-header-skip*/.duet-header-skip.sc-duet-header{margin-left:20px}}/*!@.duet-header-skip:focus*/.duet-header-skip.sc-duet-header:focus{top:12px;left:20px;width:auto;height:auto;outline:0;opacity:1}/*!@.duet-header-multi-level-desktop*/.duet-header-multi-level-desktop.sc-duet-header{height:6rem}/*!@.duet-header-multi-level-desktop .duet-header-top*/.duet-header-multi-level-desktop.sc-duet-header .duet-header-top.sc-duet-header{justify-content:space-between;height:6rem}/*!@.duet-header-multi-level-desktop .duet-header-button*/.duet-header-multi-level-desktop.sc-duet-header .duet-header-button.sc-duet-header{height:6rem}/*!@.duet-header-multi-level-desktop .logo-and-segment*/.duet-header-multi-level-desktop.sc-duet-header .logo-and-segment.sc-duet-header{display:flex;flex-basis:0;flex-direction:column;flex-grow:1;padding-top:1rem}/*!@.duet-header-multi-level-desktop .logo-and-segment .duet-header-dropdown*/.duet-header-multi-level-desktop.sc-duet-header .logo-and-segment.sc-duet-header .duet-header-dropdown.sc-duet-header{z-index:400;margin-left:2rem}/*!@.duet-header-multi-level-desktop .logo-and-segment .duet-header-dropdown .duet-header-dropdown-content*/.duet-header-multi-level-desktop.sc-duet-header .logo-and-segment.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header{background:#f3f9fc}/*!@.duet-header-multi-level-desktop .logo-and-segment button*/.duet-header-multi-level-desktop.sc-duet-header .logo-and-segment.sc-duet-header button.sc-duet-header{align-items:flex-start;height:2rem;font-weight:600;line-height:1rem}/*!@.duet-header-multi-level-desktop .logo-and-segment button::before*/.duet-header-multi-level-desktop.sc-duet-header .logo-and-segment.sc-duet-header button.sc-duet-header::before{display:none}/*!@.duet-header-multi-level-desktop .logo-and-segment .duet-header-caret*/.duet-header-multi-level-desktop.sc-duet-header .logo-and-segment.sc-duet-header .duet-header-caret.sc-duet-header{top:25%}/*!@.duet-header-multi-level-desktop-nav*/.duet-header-multi-level-desktop-nav.sc-duet-header{display:flex}/*!@.duet-header-multi-level-desktop-nav .duet-header-dropdown*/.duet-header-multi-level-desktop-nav.sc-duet-header .duet-header-dropdown.sc-duet-header{position:static}/*!@.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-toggle*/.duet-header-multi-level-desktop-nav.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.sc-duet-header{z-index:400;padding-right:1rem;font-size:1rem;font-weight:600}/*!@.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-toggle.active*/.duet-header-multi-level-desktop-nav.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.active.sc-duet-header{color:#0077b3}/*!@.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content*/.duet-header-multi-level-desktop-nav.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header{z-index:399;display:flex;justify-content:center;width:100%;height:4.5rem;padding:0;background:#f3f9fc;border-top:1px solid #e1e3e6;border-bottom:1px solid #e1e3e6;box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07);transition:none}/*!@.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a*/.duet-header-multi-level-desktop-nav.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:auto;min-width:6rem;height:100%;padding:0 1rem !important;font-weight:600}/*!@.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a::after*/.duet-header-multi-level-desktop-nav.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header::after{position:absolute;top:auto;bottom:0;left:0;display:block !important;width:100%;height:3px;content:\"\";background:#0077b3;transition:300ms ease;transform:translateY(3px)}/*!@.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a.active*/.duet-header-multi-level-desktop-nav.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.active.sc-duet-header{font-weight:600;color:#0077b3;background:none}/*!@.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a.active::after*/.duet-header-multi-level-desktop-nav.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.active.sc-duet-header::after{transform:translateY(0)}/*!@.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a .duet-header-icon*/.duet-header-multi-level-desktop-nav.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header .duet-header-icon.sc-duet-header{margin:0}/*!@.duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content .duet-header-badge*/.duet-header-multi-level-desktop-nav.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header .duet-header-badge.sc-duet-header{position:absolute;margin-top:-2rem;margin-right:-2.25rem}/*!@.duet-header-multi-level-desktop-nav button::before*/.duet-header-multi-level-desktop-nav.sc-duet-header button.sc-duet-header::before{display:none}/*!@.duet-header-multi-level-desktop-nav .duet-header-caret*/.duet-header-multi-level-desktop-nav.sc-duet-header .duet-header-caret.sc-duet-header{display:none}/*!@.duet-header-multi-level-desktop-utils*/.duet-header-multi-level-desktop-utils.sc-duet-header{display:flex;flex-basis:0;flex-grow:1;justify-content:flex-end}/*!@.duet-header-multi-level-desktop-utils > :last-child::before*/.duet-header-multi-level-desktop-utils.sc-duet-header>.sc-duet-header:last-child::before{display:none}/*!@.duet-header-multi-level-desktop-utils .duet-header-dropdown*/.duet-header-multi-level-desktop-utils.sc-duet-header .duet-header-dropdown.sc-duet-header{z-index:400}/*!@.duet-header-multi-level-desktop-utils .duet-header-dropdown .duet-header-dropdown-content*/.duet-header-multi-level-desktop-utils.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header{background:#f3f9fc}/*!@.duet-header-multi-level-desktop-utils .duet-header-button-label,\n.duet-header-multi-level-desktop-utils .duet-header-dropdown-label*/.duet-header-multi-level-desktop-utils.sc-duet-header .duet-header-button-label.sc-duet-header,.duet-header-multi-level-desktop-utils.sc-duet-header .duet-header-dropdown-label.sc-duet-header{display:none}@media (min-width: 64.0625em){/*!@.duet-header-multi-level-desktop-utils .duet-header-button-label,\n.duet-header-multi-level-desktop-utils .duet-header-dropdown-label*/.duet-header-multi-level-desktop-utils.sc-duet-header .duet-header-button-label.sc-duet-header,.duet-header-multi-level-desktop-utils.sc-duet-header .duet-header-dropdown-label.sc-duet-header{display:initial}}/*!@.duet-header-multi-level-desktop .duet-theme-turva .logo-and-segment .duet-header-dropdown .duet-header-dropdown-content*/.duet-header-multi-level-desktop.sc-duet-header .duet-theme-turva.sc-duet-header .logo-and-segment.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header{background:#fcf3f4}/*!@.duet-header-multi-level-desktop .duet-theme-turva .duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-toggle.active*/.duet-header-multi-level-desktop.sc-duet-header .duet-theme-turva.sc-duet-header .duet-header-multi-level-desktop-nav.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-toggle.active.sc-duet-header{color:#c60c30}/*!@.duet-header-multi-level-desktop .duet-theme-turva .duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content*/.duet-header-multi-level-desktop.sc-duet-header .duet-theme-turva.sc-duet-header .duet-header-multi-level-desktop-nav.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header{background:#fcf3f4;border-color:#e4e4e6}/*!@.duet-header-multi-level-desktop .duet-theme-turva .duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a::after*/.duet-header-multi-level-desktop.sc-duet-header .duet-theme-turva.sc-duet-header .duet-header-multi-level-desktop-nav.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.sc-duet-header::after{background:#c60c30}/*!@.duet-header-multi-level-desktop .duet-theme-turva .duet-header-multi-level-desktop-nav .duet-header-dropdown .duet-header-dropdown-content a.active*/.duet-header-multi-level-desktop.sc-duet-header .duet-theme-turva.sc-duet-header .duet-header-multi-level-desktop-nav.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header a.active.sc-duet-header{color:#c60c30;background:none}/*!@.duet-header-multi-level-desktop .duet-theme-turva .duet-header-multi-level-desktop-utils .duet-header-dropdown .duet-header-dropdown-content*/.duet-header-multi-level-desktop.sc-duet-header .duet-theme-turva.sc-duet-header .duet-header-multi-level-desktop-utils.sc-duet-header .duet-header-dropdown.sc-duet-header .duet-header-dropdown-content.sc-duet-header{background:#fcf3f4}";
 
 const createEvent = (ev, data) => ({
   component: "duet-header",
@@ -9514,14 +10134,15 @@ const createEvent = (ev, data) => ({
   originalEvent: ev,
 });
 /**
- * @slot utility - A slot for utilities, such as a notification drawer
- * @slot logo-utility - A slot to place elements alongside the logo. This takes precedence over the **region** prop.
+ * @slot utility - A slot for utilities, such as a notification drawer or shopping basket.
+ * @slot logo-utility - A slot to place elements alongside the logo. This takes precedence over the **region** prop. Note: not available in desktop multilevel header.
  */
 class DuetHeader {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.duetChange = createEvent$2(this, "duetChange", 3);
     this.duetSessionClick = createEvent$2(this, "duetSessionClick", 7);
+    this.duetSearchClick = createEvent$2(this, "duetSearchClick", 7);
     this.duetUserClick = createEvent$2(this, "duetUserClick", 7);
     this.duetLanguageSelect = createEvent$2(this, "duetLanguageSelect", 7);
     this.duetLogoClick = createEvent$2(this, "duetLogoClick", 7);
@@ -9530,7 +10151,15 @@ class DuetHeader {
     this.duetItemClick = createEvent$2(this, "duetItemClick", 7);
     this.duetSkipClick = createEvent$2(this, "duetSkipClick", 7);
     this.duetAnalytics = createEvent$2(this, "duetAnalytics", 7);
+    var _a;
+    /**
+     * Own Properties
+     */
+    this.subMenuItemRefs = {};
+    this.subMenuButtonRefs = {};
     this.hasLanguageChanged = false;
+    this.mql = [window.matchMedia(media_query_large.replace(/'/g, ""))];
+    this.boundMqlFunctions = [];
     /**
      * State() variables
      * Inlined decorator, alphabetical order.
@@ -9538,12 +10167,17 @@ class DuetHeader {
     this.isContactOpen = false;
     this.isLanguageOpen = false;
     this.isSlideOutOpen = false;
+    this.isSegmentOpen = false;
+    this.openMenu = null;
+    this.closedActives = null;
     this.processedItems = null;
     this.processedLanguageItems = null;
     this.processedContactItems = null;
     this.processedSession = null;
+    this.processedSearch = null;
     this.processedUser = null;
     this.processedBack = null;
+    this.renderDesktopNav = (_a = this.mql[0]) === null || _a === void 0 ? void 0 : _a.matches;
     /**
      * Theme of the header.
      */
@@ -9649,6 +10283,7 @@ class DuetHeader {
     this.logoHref = "/";
     /**
      * The href of the current page item that is shown as “active”.
+     * Note: not available in multilevel headers.
      */
     this.currentHref = "/";
     /**
@@ -9658,10 +10293,12 @@ class DuetHeader {
     this.skipToId = "";
     /**
      * Region that is shown next to the logo. If empty, region will be hidden.
+     * Note: not available in desktop multilevel header.
      */
     this.region = "";
     /**
      * Label of the contact menu. If empty, contact menu will be hidden.
+     * Note: not available in multilevel headers.
      */
     this.contact = "";
     this.handleClick = (event) => {
@@ -9680,6 +10317,11 @@ class DuetHeader {
       this.handleClick(e);
       this.duetSessionClick.emit(e);
     };
+    this.handleSearchClick = (ev) => {
+      const e = createEvent(ev, this.processedSearch);
+      this.handleClick(e);
+      this.duetSearchClick.emit(e);
+    };
     this.handleUserClick = (ev) => {
       const e = createEvent(ev, this.processedUser);
       this.handleClick(e);
@@ -9702,40 +10344,55 @@ class DuetHeader {
       this.duetLogoClick.emit(e);
     };
     this.handleArrowKeys = ev => {
-      if (this.isContactOpen || this.isLanguageOpen) {
-        let button;
-        if (isArrowLeftKey(ev) || isArrowUpKey(ev)) {
-          button = ev.target.previousElementSibling;
-        }
-        else if (isArrowRightKey(ev) || isArrowDownKey(ev)) {
-          button = ev.target.nextElementSibling;
-        }
-        if (button) {
-          ev.preventDefault();
-          button.focus();
-        }
+      let button;
+      if (isArrowLeftKey(ev) || isArrowUpKey(ev)) {
+        button = ev.target.previousElementSibling;
+      }
+      else if (isArrowRightKey(ev) || isArrowDownKey(ev)) {
+        button = ev.target.nextElementSibling;
+      }
+      if (button) {
+        ev.preventDefault();
+        button.focus();
       }
     };
-    this.toggleMenu = (ev, type) => {
+    this.toggleMenu = (ev, type, id, active) => {
       let el;
       ev.preventDefault();
       ev.stopPropagation();
+      if (active === true && !this.openMenu) {
+        const closedActives = this.closedActives ? [...this.closedActives] : [];
+        const index = closedActives.findIndex(i => i === id);
+        if (index > -1) {
+          closedActives.splice(index, 1);
+          this.closedActives = [...closedActives];
+        }
+        else {
+          this.closedActives = [...closedActives, id];
+        }
+      }
+      else {
+        this.openMenu = this.openMenu === id ? null : id;
+      }
       // For language menu
       if (type === "language") {
         this.isContactOpen = false;
         this.isLanguageOpen = !this.isLanguageOpen;
+        this.isSegmentOpen = false;
         el = this.languageItemsEl;
       }
       // For contact menu
       else if (type === "contact") {
         this.isLanguageOpen = false;
         this.isContactOpen = !this.isContactOpen;
+        this.isSegmentOpen = false;
         el = this.contactItemsEl;
       }
       // For mobile menu
       else if (type === "mobile") {
         this.isContactOpen = false;
         this.isLanguageOpen = false;
+        this.isSegmentOpen = false;
         el = this.navigationEl;
         this.isSlideOutOpen = !this.isSlideOutOpen;
         if (this.isSlideOutOpen) {
@@ -9745,7 +10402,19 @@ class DuetHeader {
           enableBodyScroll(this.navigationEl);
         }
       }
-      if (this.isSlideOutOpen || this.isLanguageOpen || this.isContactOpen) {
+      else if (type === "sub") {
+        this.isContactOpen = false;
+        this.isLanguageOpen = false;
+        this.isSegmentOpen = false;
+        el = this.subMenuItemRefs[id];
+      }
+      else if (type === "segment") {
+        this.isContactOpen = false;
+        this.isLanguageOpen = false;
+        this.isSegmentOpen = !this.isSegmentOpen;
+        el = this.segmentItemsEl;
+      }
+      if (this.isSlideOutOpen || this.isLanguageOpen || this.isContactOpen || this.isSegmentOpen || this.openMenu) {
         const drawer = this.element.querySelector("duet-notification-drawer");
         if (drawer) {
           drawer.close(false);
@@ -9764,10 +10433,21 @@ class DuetHeader {
     inheritGlobalTheme(this);
     this.refresh();
   }
+  connectedCallback() {
+    for (let i = 0; i < this.mql.length; i++) {
+      const bound = this.refresh.bind(this);
+      this.mql[i].addEventListener("change", bound);
+      this.boundMqlFunctions[i] = bound;
+    }
+  }
   disconnectedCallback() {
     if (this.navigationEl) {
       enableBodyScroll(this.navigationEl);
     }
+    for (let i = 0; i < this.mql.length; i++) {
+      this.mql[i].removeEventListener("change", this.boundMqlFunctions[i]);
+    }
+    this.boundMqlFunctions = [];
   }
   /**
    * Component event handling.
@@ -9780,7 +10460,7 @@ class DuetHeader {
     }
   }
   handleKeyDown(ev) {
-    if (this.isContactOpen || this.isLanguageOpen) {
+    if (this.isContactOpen || this.isLanguageOpen || this.isSegmentOpen) {
       const activeElement = this.element.shadowRoot.activeElement;
       // When Space is pressed
       if (isSpaceKey(ev) && activeElement) {
@@ -9792,6 +10472,12 @@ class DuetHeader {
         else if (this.isLanguageOpen) {
           this.closeMenus(true);
         }
+        else if (this.isSegmentOpen) {
+          this.closeMenus();
+        }
+        else if (this.openMenu) {
+          this.closeMenus();
+        }
         activeElement.click();
       }
     }
@@ -9821,10 +10507,15 @@ class DuetHeader {
    * Local methods.
    */
   async refresh() {
+    if (this.renderDesktopNav !== this.mql[0].matches) {
+      this.renderDesktopNav = this.mql[0].matches;
+      this.openMenu = null;
+    }
     this.processedItems = parsePossibleJSON(this.items);
     this.processedLanguageItems = parsePossibleJSON(this.languageItems);
     this.processedContactItems = parsePossibleJSON(this.contactItems);
     this.processedSession = parsePossibleJSON(this.session);
+    this.processedSearch = parsePossibleJSON(this.search);
     this.processedUser = parsePossibleJSON(this.user);
     this.processedBack = parsePossibleJSON(this.back);
   }
@@ -9841,7 +10532,7 @@ class DuetHeader {
    * Closes all dropdown menus in header when called.
    */
   async closeMenus(moveFocusToButton = false) {
-    if (this.isContactOpen || this.isLanguageOpen) {
+    if (this.isContactOpen || this.isLanguageOpen || this.isSegmentOpen || this.openMenu) {
       if (this.isContactOpen && moveFocusToButton) {
         this.contactItemsButtonEl.focus({
           preventScroll: true,
@@ -9852,8 +10543,20 @@ class DuetHeader {
           preventScroll: true,
         });
       }
+      if (this.isSegmentOpen && moveFocusToButton) {
+        this.segmentItemsButtonEl.focus({
+          preventScroll: true,
+        });
+      }
+      if (this.openMenu && moveFocusToButton) {
+        this.subMenuButtonRefs[this.openMenu].focus({
+          preventScroll: true,
+        });
+      }
       this.isContactOpen = false;
       this.isLanguageOpen = false;
+      this.isSegmentOpen = false;
+      this.openMenu = null;
     }
   }
   /**
@@ -9869,45 +10572,93 @@ class DuetHeader {
    */
   render() {
     const { skipLabel, changeLanguage, activeLanguage } = this.accessibleI18nLabels;
-    return (hAsync("div", { class: {
+    const skipToLabel = this.skipToId ? (hAsync("a", { href: this.skipToId, class: "duet-header-skip", onClick: this.handleSkipClick }, skipLabel)) : null;
+    const logo = (hAsync("duet-logo", { href: this.logoHref, size: "medium", ref: el => (this.logoEl = el), language: this.language, theme: this.theme, onClick: this.handleLogoClick }));
+    const largeLogo = (hAsync("duet-logo", { href: this.logoHref, size: "large", ref: el => (this.logoEl = el), language: this.language, theme: this.theme, onClick: this.handleLogoClick }));
+    const contactDropdown = this.contact && this.processedContactItems ? (hAsync(DuetHeaderDropdown, { id: "duet-header-contact", label: this.contact, icon: navigationContactDropdown.svg, active: this.isContactOpen, isOpen: this.isContactOpen, badge: false, toggleRef: el => (this.contactItemsButtonEl = el), itemsRef: el => (this.contactItemsEl = el), onToggle: event => this.toggleMenu(event, "contact") }, this.processedContactItems.map(item => (hAsync("a", { role: "menuitem", href: item.href || "#", id: item.id, onClick: event => this.handleContactClick(event, item), onKeyDown: ev => this.handleArrowKeys(ev), target: item.external ? "_blank" : "_self" }, item.label, Build.isBrowser  ))))) : null;
+    const languageDropdown = this.language && this.processedLanguageItems ? (hAsync(DuetHeaderDropdown, { id: "duet-header-language", label: this.language, icon: navigationLanguage.svg, accessibleText: `${changeLanguage}${this.hasLanguageChanged ? `, ${activeLanguage}` : ""}`, active: this.isLanguageOpen, isOpen: this.isLanguageOpen, badge: false, toggleRef: el => (this.languageItemsButtonEl = el), itemsRef: el => (this.languageItemsEl = el), onToggle: event => this.toggleMenu(event, "language") }, this.processedLanguageItems.map(item => (hAsync("a", { class: { active: this.language === item.country }, "aria-selected": this.language === item.country, role: "menuitem", id: item.id, lang: item.country, href: item.href || "#", onClick: event => this.handleLanguageClick(event, item), onKeyDown: this.handleArrowKeys }, item.label))))) : null;
+    const processedUserWithLink = this.processedUser && this.processedUser.href ? (hAsync("a", { href: this.processedUser.href || "#", id: this.processedUser.id, class: "duet-header-user duet-header-button", onClick: this.handleUserClick }, hAsync(DuetHeaderIcon, { icon: navigationUser.svg }), hAsync("span", { class: "duet-header-user-label" }, this.processedUser.label))) : null;
+    const processedUserWithoutLink = this.processedUser && !this.processedUser.href ? (hAsync("span", { id: this.processedUser.id, class: "duet-header-user duet-header-button duet-header-no-action" }, hAsync(DuetHeaderIcon, { icon: navigationUser.svg }), hAsync("span", { class: "duet-header-user-label" }, this.processedUser.label))) : null;
+    const processedSessionIconSize = this.renderDesktopNav ? "x-small" : "small";
+    const processedSession = this.processedSession ? (hAsync("a", { href: this.processedSession.href || "#", id: this.processedSession.id, class: "duet-header-logout duet-header-button", onClick: this.handleSessionClick }, hAsync(DuetHeaderIcon, { icon: this.processedSession.type === "logout" ? navigationLogout.svg : navigationLogin.svg, iconSize: processedSessionIconSize }), hAsync("span", { class: "duet-header-button-label" }, this.processedSession.label))) : null;
+    const processedSearch = this.processedSearch ? (hAsync("a", { href: this.processedSearch.href || "#", id: this.processedSearch.id, class: "duet-header-search duet-header-button", onClick: this.handleSearchClick }, hAsync(DuetHeaderIcon, { icon: formSearch.svg }), hAsync("span", { class: "duet-header-button-label" }, this.processedSearch.label))) : null;
+    // Back variation
+    if (this.processedBack) {
+      return (hAsync(Host, { class: "duet-header-back-variation" }, hAsync("div", { class: "duet-header-reserved-space" }, hAsync("header", { class: {
+          "duet-header": true,
+          "duet-theme-turva": this.theme === "turva",
+          "duet-header-back": true,
+          "duet-header-inactive": true,
+        } }, hAsync("div", { class: "duet-header-top" }, skipToLabel, hAsync("duet-button", { url: this.processedBack.href, id: this.processedBack.id, theme: this.theme, variation: "plain", color: this.theme === "turva" ? "secondary-turva" : "secondary", icon: "navigation-arrow-left", iconSize: "large", onClick: this.handleBackClick }, this.processedBack.label), logo, hAsync("slot", { name: "logo-utility" }))))));
+    }
+    // multi level desktop variation
+    const itemsHaveSubItems = this.processedItems && this.processedItems.some(item => item.items && item.items.length > 0);
+    if (this.renderDesktopNav && itemsHaveSubItems) {
+      const activeSegment = this.processedItems.find(item => item.active);
+      const isThirdLevelActive = this.processedItems &&
+        this.processedItems.some(item => item.items &&
+          item.items.some(secondLevelItem => secondLevelItem.items && secondLevelItem.items.some(thirdLevelItem => thirdLevelItem.active === true)));
+      const segmentId = "duet-header-segment";
+      return (hAsync(Host, { class: "duet-header-multi-level-desktop-variation" }, hAsync("div", { class: {
+          "duet-header-multi-level-desktop": true,
+          "duet-header-multi-level-desktop-third-level-is-open": isThirdLevelActive,
+        } }, hAsync("header", { class: {
+          "duet-header": true,
+          "duet-theme-turva": this.theme === "turva",
+          "duet-header-inactive": !this.processedItems,
+        } }, hAsync("div", { class: "duet-header-top" }, skipToLabel, hAsync("div", { class: "logo-and-segment" }, largeLogo, this.processedItems && (hAsync(DuetHeaderDropdown, { id: segmentId, label: activeSegment.label, active: this.isSegmentOpen, isOpen: this.isSegmentOpen, badge: false, toggleRef: el => (this.segmentItemsButtonEl = el), itemsRef: el => (this.segmentItemsEl = el), onToggle: event => this.toggleMenu(event, "segment") }, this.processedItems.map(item => (hAsync("a", { class: { active: activeSegment === item }, role: "menuitem", href: item.href || "#", id: item.id, onClick: event => this.handleItemClick(event, item), onKeyDown: ev => this.handleArrowKeys(ev), target: item.external ? "_blank" : "_self" }, item.icon && (hAsync("div", { class: "duet-header-icon" }, hAsync("duet-icon", { margin: "none", size: "x-small", name: item.icon, color: "currentColor" }))), hAsync("span", null, item.label), item.badge && hAsync("div", { class: "duet-header-badge" }))))))), hAsync("nav", { class: "duet-header-multi-level-desktop-nav" }, activeSegment.items &&
+        activeSegment.items
+          .filter(secondLevelItem => secondLevelItem.items && secondLevelItem.items.length > 0)
+          .map((secondLevelItem, secondLevelItemIndex) => {
+          const id = secondLevelItem.id || `segment-item-${secondLevelItemIndex}`;
+          return (hAsync(DuetHeaderDropdown, { id: id, label: secondLevelItem.label, active: (!this.openMenu && secondLevelItem.active === true) || this.openMenu === id, isOpen: this.openMenu === id, badge: secondLevelItem.badge, toggleRef: el => (this.subMenuButtonRefs[id] = el), itemsRef: el => (this.subMenuItemRefs[id] = el), onToggle: event => this.toggleMenu(event, "sub", id) }, secondLevelItem.items &&
+            secondLevelItem.items.map(thirdLevelItem => (hAsync("a", { class: { active: thirdLevelItem.active }, role: "menuitem", href: thirdLevelItem.href || "#", id: thirdLevelItem.id, onClick: event => this.handleItemClick(event, thirdLevelItem), onKeyDown: ev => this.handleArrowKeys(ev), target: thirdLevelItem.external ? "_blank" : "_self" }, thirdLevelItem.icon && (hAsync("div", { class: "duet-header-icon" }, hAsync("duet-icon", { margin: "none", size: "medium", name: thirdLevelItem.icon, color: "currentColor" }))), hAsync("span", null, thirdLevelItem.label), thirdLevelItem.badge && hAsync("div", { class: "duet-header-badge" }))))));
+        })), hAsync("div", { class: "duet-header-multi-level-desktop-utils" }, processedSearch, languageDropdown, processedSession), hAsync("slot", { name: "utility" }))))));
+    }
+    // Default variation
+    const isThirdLevelActive = this.processedItems &&
+      this.processedItems.some(item => item.items &&
+        item.items.some(secondLevelItem => secondLevelItem.items && secondLevelItem.items.some(thirdLevelItem => thirdLevelItem.active === true)));
+    return (hAsync(Host, { class: {
+        "duet-header-default-variation": true,
+      } }, hAsync("div", { class: {
         "duet-header-reserved-space": true,
         "duet-with-links": !!this.processedItems,
-        "duet-without-links": !this.processedItems,
+        "duet-header-third-level-active": isThirdLevelActive,
       } }, hAsync("header", { class: {
         "duet-header": true,
         "duet-theme-turva": this.theme === "turva",
-        "duet-header-back": !!this.processedBack,
         "duet-header-inactive": !this.processedItems,
-      } }, hAsync("div", { class: "duet-header-top" }, this.skipToId && (hAsync("a", { href: this.skipToId, class: "duet-header-skip", onClick: this.handleSkipClick }, skipLabel)), this.processedBack && (hAsync("duet-button", { url: this.processedBack.href, id: this.processedBack.id, theme: this.theme, variation: "plain", color: this.theme === "turva" ? "secondary-turva" : "secondary", icon: "navigation-arrow-left", iconSize: "large", onClick: this.handleBackClick }, this.processedBack.label)), hAsync("duet-logo", { href: this.logoHref, size: "medium", ref: el => (this.logoEl = el), language: this.language, theme: this.theme, onClick: this.handleLogoClick }), hAsync("slot", { name: "logo-utility" }, this.region && !this.processedBack && hAsync("div", { class: "duet-header-region" }, this.region)), (this.processedItems ||
-      this.processedLanguageItems ||
-      this.processedContactItems ||
+      } }, hAsync("div", { class: "duet-header-top" }, skipToLabel, logo, hAsync("slot", { name: "logo-utility" }, this.region && hAsync("div", { class: "duet-header-region" }, this.region)), (this.processedItems ||
+      languageDropdown ||
+      contactDropdown ||
       this.processedSession ||
-      this.processedUser) && (hAsync("button", { class: { "duet-header-toggle": true, active: this.isSlideOutOpen }, onClick: event => this.toggleMenu(event, "mobile"), type: "button" }, hAsync("duet-visually-hidden", null, this.accessibleLabel), hAsync("div", { class: "duet-header-hamburger" }, hAsync("span", { class: "duet-header-bar" }), hAsync("span", { class: "duet-header-bar" }), hAsync("span", { class: "duet-header-bar" }), hAsync("span", { class: "duet-header-bar" }))))), !this.processedBack && (hAsync("div", { ref: el => (this.navigationEl = el), class: {
+      this.processedUser) && (hAsync("button", { class: { "duet-header-toggle": true, active: this.isSlideOutOpen }, onClick: event => this.toggleMenu(event, "mobile"), type: "button" }, hAsync("duet-visually-hidden", null, this.accessibleLabel), hAsync(DuetHeaderHamburger, null)))), hAsync("div", { ref: el => (this.navigationEl = el), class: {
         "duet-header-bottom": true,
         active: this.isSlideOutOpen,
         inactive: !this.processedItems,
       } }, hAsync("nav", { class: "duet-header-items", role: "navigation" }, this.processedItems &&
-      this.processedItems.map(item => (hAsync("a", { class: { active: this.currentHref === item.href }, href: item.href || "#", id: item.id, onClick: event => this.handleItemClick(event, item) }, item.label, item.badge && hAsync("div", { class: "duet-header-badge" }))))), hAsync("div", { class: "duet-header-bottom-utils" }, hAsync("slot", { name: "utility" })), hAsync("div", { class: "duet-header-utils" }, this.contact && this.processedContactItems && (hAsync("div", { class: "duet-header-dropdown" }, hAsync("button", { ref: el => (this.contactItemsButtonEl = el), class: {
-        "duet-header-contact": true,
-        "duet-header-dropdown-toggle": true,
-        "duet-header-button": true,
-        active: this.isContactOpen,
-      }, type: "button", "aria-haspopup": "listbox", "aria-controls": "duet-header-contact", "aria-expanded": this.isContactOpen ? "true" : "false", id: "duet-header-contact-button", onClick: event => this.toggleMenu(event, "contact") }, hAsync("div", { class: "duet-header-icon" }, hAsync("duet-icon", { margin: "none", size: "x-small", icon: navigationContactDropdown.svg, color: "currentColor" })), hAsync("span", { id: "duet-header-contact-label" }, this.contact), hAsync("div", { class: "duet-header-caret" }, hAsync("duet-icon", { margin: "none", size: "auto", icon: actionArrowDownSmall.svg, color: "currentColor" }))), hAsync("div", { ref: el => (this.contactItemsEl = el), tabindex: "-1", role: "menu", id: "duet-header-contact", "aria-labelledby": "duet-header-contact-button", class: {
-        "duet-header-dropdown-content": true,
-        "duet-header-contact-items": true,
-        active: this.isContactOpen,
-      } }, this.processedContactItems &&
-      this.processedContactItems.map(item => (hAsync("a", { role: "menuitem", href: item.href || "#", id: item.id, onClick: event => this.handleContactClick(event, item), onKeyDown: ev => this.handleArrowKeys(ev), target: item.external ? "_blank" : "_self" }, item.label, Build.isBrowser  )))))), this.language && this.processedLanguageItems && (hAsync("div", { class: "duet-header-dropdown" }, hAsync("button", { ref: el => (this.languageItemsButtonEl = el), "aria-haspopup": "listbox", "aria-controls": "duet-header-language", "aria-expanded": this.isLanguageOpen ? "true" : "false", id: "duet-header-language-button", type: "button", class: {
-        "duet-header-language": true,
-        "duet-header-dropdown-toggle": true,
-        "duet-header-button": true,
-        active: this.isLanguageOpen,
-      }, onClick: event => this.toggleMenu(event, "language") }, hAsync("div", { class: "duet-header-icon" }, hAsync("duet-icon", { margin: "none", size: "x-small", icon: navigationLanguage.svg, color: "currentColor" })), hAsync("span", { "aria-hidden": "true" }, this.language), hAsync("div", { class: "duet-header-caret" }, hAsync("duet-icon", { margin: "none", size: "auto", icon: actionArrowDownSmall.svg, color: "currentColor" })), hAsync("duet-visually-hidden", null, changeLanguage, this.hasLanguageChanged && hAsync("span", null, ", ", activeLanguage))), hAsync("div", { ref: el => (this.languageItemsEl = el), tabindex: "-1", role: "menu", id: "duet-header-language", "aria-labelledby": "duet-header-language-button", class: {
-        "duet-header-dropdown-content": true,
-        "duet-header-language-items": true,
-        active: this.isLanguageOpen,
-      } }, this.processedLanguageItems &&
-      this.processedLanguageItems.map(item => (hAsync("a", { class: { active: this.language === item.country }, "aria-selected": this.language === item.country, role: "menuitem", id: item.id, lang: item.country, href: item.href || "#", onClick: event => this.handleLanguageClick(event, item), onKeyDown: ev => this.handleArrowKeys(ev) }, item.label)))))), this.processedUser && this.processedUser.href && (hAsync("a", { href: this.processedUser.href || "#", id: this.processedUser.id, class: "duet-header-user duet-header-button", onClick: this.handleUserClick }, hAsync("span", { class: "duet-header-icon" }, hAsync("duet-icon", { margin: "none", size: "x-small", icon: navigationUser.svg, color: "currentColor" })), hAsync("span", { class: "duet-header-user-label" }, this.processedUser.label))), this.processedUser && !this.processedUser.href && (hAsync("span", { id: this.processedUser.id, class: "duet-header-user duet-header-button duet-header-no-action" }, hAsync("span", { class: "duet-header-icon" }, hAsync("duet-icon", { margin: "none", size: "x-small", icon: navigationUser.svg, color: "currentColor" })), hAsync("span", { class: "duet-header-user-label" }, this.processedUser.label))), this.processedSession && (hAsync("a", { href: this.processedSession.href || "#", id: this.processedSession.id, class: "duet-header-logout duet-header-button", onClick: this.handleSessionClick }, hAsync("span", { class: "duet-header-icon" }, hAsync("duet-icon", { margin: "none", size: "x-small", icon: this.processedSession.type === "logout" ? navigationLogout.svg : navigationLogin.svg, color: "currentColor" })), this.processedSession.label))))))));
+      this.processedItems.map((item, itemIndex) => (hAsync("div", { class: "duet-header-item-container" }, hAsync("a", { class: {
+          "duet-header-first-level": true,
+          "duet-header-item": true,
+          active: (!itemsHaveSubItems && this.currentHref === item.href) || item.active === true,
+        }, href: item.href || "#", id: item.id || `header-item-${itemIndex}`, onClick: event => this.handleItemClick(event, item) }, item.label, item.badge && hAsync("div", { class: "duet-header-badge" })), item.items &&
+        item.items
+          .filter(secondLevelitem => secondLevelitem.items && secondLevelitem.items.length > 0)
+          .map((secondLevelItem, secondLevelItemIndex) => {
+          const id = secondLevelItem.id || `header-item-${itemIndex}-${secondLevelItemIndex}`;
+          return (hAsync(DuetHeaderDropdown, { id: id, className: "duet-header-second-level", label: secondLevelItem.label, icon: `${secondLevelItem.icon}.svg`, active: (!this.openMenu &&
+              secondLevelItem.active === true &&
+              !(this.closedActives && !!this.closedActives.find(i => i === id))) ||
+              this.openMenu === id, isOpen: (!this.openMenu &&
+              secondLevelItem.active === true &&
+              !(this.closedActives && !!this.closedActives.find(i => i === id))) ||
+              this.openMenu === id, badge: secondLevelItem.badge, toggleRef: el => (this.subMenuButtonRefs[id] = el), itemsRef: el => (this.subMenuItemRefs[id] = el), onToggle: event => this.toggleMenu(event, "sub", id, secondLevelItem.active === true) }, hAsync("div", { class: "duet-header-third-level" }, secondLevelItem.items &&
+            secondLevelItem.items.map(thirdLevelItem => (hAsync("a", { class: {
+                "duet-header-item": true,
+                active: thirdLevelItem.active === true,
+              }, role: "menuitem", href: thirdLevelItem.href || "#", id: thirdLevelItem.id, onClick: event => this.handleItemClick(event, item), onKeyDown: ev => this.handleArrowKeys(ev), target: thirdLevelItem.external ? "_blank" : "_self" }, thirdLevelItem.icon && (hAsync("div", { class: "duet-header-icon" }, hAsync("duet-icon", { margin: "none", size: "medium", name: thirdLevelItem.icon, color: "currentColor" }))), hAsync("span", null, thirdLevelItem.label), thirdLevelItem.badge && hAsync("div", { class: "duet-header-badge" })))))));
+        }))))), hAsync("div", { class: "duet-header-bottom-utils" }, hAsync("slot", { name: "utility" })), hAsync("div", { class: "duet-header-utils" }, !itemsHaveSubItems && contactDropdown, languageDropdown, !itemsHaveSubItems && (hAsync(Fragment, null, processedUserWithLink, processedUserWithoutLink)), processedSearch, processedSession))))));
   }
   get element() { return getElement(this); }
   static get watchers() { return {
@@ -9938,6 +10689,7 @@ class DuetHeader {
       "items": [8],
       "region": [1],
       "session": [8],
+      "search": [8],
       "back": [8],
       "contact": [1],
       "contactItems": [8, "contact-items"],
@@ -9945,12 +10697,17 @@ class DuetHeader {
       "isContactOpen": [32],
       "isLanguageOpen": [32],
       "isSlideOutOpen": [32],
+      "isSegmentOpen": [32],
+      "openMenu": [32],
+      "closedActives": [32],
       "processedItems": [32],
       "processedLanguageItems": [32],
       "processedContactItems": [32],
       "processedSession": [32],
+      "processedSearch": [32],
       "processedUser": [32],
       "processedBack": [32],
+      "renderDesktopNav": [32],
       "closeMenus": [64],
       "setFocus": [64]
     },
@@ -9960,7 +10717,7 @@ class DuetHeader {
   }; }
 }
 
-const duetHeadingCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-heading,*.sc-duet-heading::after,*.sc-duet-heading::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-heading-h{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%}/*!@.duet-heading*/.duet-heading.sc-duet-heading{margin-bottom:16px !important;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\";font-style:normal;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.25;color:#00294d;text-decoration:none;letter-spacing:-0.01rem;word-break:break-word}@media (min-width: 36em){/*!@.duet-heading*/.duet-heading.sc-duet-heading{margin-bottom:20px !important}}/*!@.duet-heading.duet-theme-turva*/.duet-heading.duet-theme-turva.sc-duet-heading{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-style:italic;font-weight:700;color:#171c3a}/*!@.duet-heading.duet-heading-border*/.duet-heading.duet-heading-border.sc-duet-heading{padding-bottom:20px;border-bottom:1px solid #e1e3e6}/*!@.duet-heading.duet-heading-hyphenate*/.duet-heading.duet-heading-hyphenate.sc-duet-heading{-webkit-hyphens:auto;hyphens:auto}/*!@.duet-heading.h0*/.duet-heading.h0.sc-duet-heading{font-size:9.4vw}/*!@.duet-heading.h0.duet-p-0*/.duet-heading.h0.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h0.duet-m-0*/.duet-heading.h0.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 31.914893617rem){/*!@.duet-heading.h0*/.duet-heading.h0.sc-duet-heading{font-size:3rem}}@media (min-width: 47.8723404255rem){/*!@.duet-heading.h0*/.duet-heading.h0.sc-duet-heading{font-size:4.5rem}}@media (max-width: 22.5em){/*!@.duet-heading.h0*/.duet-heading.h0.sc-duet-heading{font-size:2.25rem}}/*!@.duet-heading.h1*/.duet-heading.h1.sc-duet-heading{font-size:7vw}/*!@.duet-heading.h1.duet-p-0*/.duet-heading.h1.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h1.duet-m-0*/.duet-heading.h1.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 32.1428571429rem){/*!@.duet-heading.h1*/.duet-heading.h1.sc-duet-heading{font-size:2.25rem}}@media (min-width: 42.8571428571rem){/*!@.duet-heading.h1*/.duet-heading.h1.sc-duet-heading{font-size:3rem}}@media (max-width: 22.5em){/*!@.duet-heading.h1*/.duet-heading.h1.sc-duet-heading{font-size:1.5rem}}/*!@.duet-heading.h2*/.duet-heading.h2.sc-duet-heading{font-size:5.8vw}/*!@.duet-heading.h2.duet-p-0*/.duet-heading.h2.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h2.duet-m-0*/.duet-heading.h2.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 25.8620689655rem){/*!@.duet-heading.h2*/.duet-heading.h2.sc-duet-heading{font-size:1.5rem}}@media (min-width: 38.7931034483rem){/*!@.duet-heading.h2*/.duet-heading.h2.sc-duet-heading{font-size:2.25rem}}@media (max-width: 22.5em){/*!@.duet-heading.h2*/.duet-heading.h2.sc-duet-heading{font-size:1.375rem}}/*!@.duet-heading.h3*/.duet-heading.h3.sc-duet-heading{margin-bottom:12px !important;font-size:4.2vw}/*!@.duet-heading.h3.duet-p-0*/.duet-heading.h3.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h3.duet-m-0*/.duet-heading.h3.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 29.7619047619rem){/*!@.duet-heading.h3*/.duet-heading.h3.sc-duet-heading{font-size:1.25rem}}@media (min-width: 35.7142857143rem){/*!@.duet-heading.h3*/.duet-heading.h3.sc-duet-heading{font-size:1.5rem}}/*!@.duet-heading.h3.duet-theme-turva*/.duet-heading.h3.duet-theme-turva.sc-duet-heading{font-style:normal}/*!@.duet-heading.h3.duet-heading-border*/.duet-heading.h3.duet-heading-border.sc-duet-heading{padding-bottom:20px}/*!@.duet-heading.h4*/.duet-heading.h4.sc-duet-heading{margin-bottom:8px !important;font-size:4vw;letter-spacing:0}/*!@.duet-heading.h4.duet-p-0*/.duet-heading.h4.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h4.duet-m-0*/.duet-heading.h4.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 27.5rem){/*!@.duet-heading.h4*/.duet-heading.h4.sc-duet-heading{font-size:1.1rem}}@media (min-width: 31.25rem){/*!@.duet-heading.h4*/.duet-heading.h4.sc-duet-heading{font-size:1.25rem}}/*!@.duet-heading.h4.duet-theme-turva*/.duet-heading.h4.duet-theme-turva.sc-duet-heading{font-style:normal;font-weight:700}/*!@.duet-heading.h4.duet-heading-border*/.duet-heading.h4.duet-heading-border.sc-duet-heading{padding-bottom:20px}/*!@.duet-heading.h5*/.duet-heading.h5.sc-duet-heading{margin-bottom:8px !important;font-size:4vw;font-weight:600;letter-spacing:0}/*!@.duet-heading.h5.duet-p-0*/.duet-heading.h5.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h5.duet-m-0*/.duet-heading.h5.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 27.5rem){/*!@.duet-heading.h5*/.duet-heading.h5.sc-duet-heading{font-size:1.1rem}}@media (min-width: 28.4090909091rem){/*!@.duet-heading.h5*/.duet-heading.h5.sc-duet-heading{font-size:1.1363636364rem}}/*!@.duet-heading.h5.duet-theme-turva*/.duet-heading.h5.duet-theme-turva.sc-duet-heading{font-style:normal;font-weight:700}/*!@.duet-heading.h5.duet-heading-border*/.duet-heading.h5.duet-heading-border.sc-duet-heading{padding-bottom:16px}/*!@.duet-heading.h6*/.duet-heading.h6.sc-duet-heading{margin-bottom:8px !important;font-size:1rem;font-weight:600;letter-spacing:0}/*!@.duet-heading.h6.duet-p-0*/.duet-heading.h6.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h6.duet-m-0*/.duet-heading.h6.duet-m-0.sc-duet-heading{margin:0 !important}/*!@.duet-heading.h6.duet-theme-turva*/.duet-heading.h6.duet-theme-turva.sc-duet-heading{font-style:normal;font-weight:700}/*!@.duet-heading.h6.duet-heading-border*/.duet-heading.h6.duet-heading-border.sc-duet-heading{padding-bottom:16px}/*!@.duet-heading.duet-semibold, .duet-heading.duet-theme-turva.duet-semibold*/.duet-heading.duet-semibold.sc-duet-heading,.duet-heading.duet-theme-turva.duet-semibold.sc-duet-heading{font-style:normal !important;font-weight:600 !important}";
+const duetHeadingCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-heading,*.sc-duet-heading::after,*.sc-duet-heading::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-heading-h{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%}/*!@.duet-heading*/.duet-heading.sc-duet-heading{margin-bottom:16px !important;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\";font-style:normal;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.25;color:#00294d;text-decoration:none;letter-spacing:-0.01rem;word-break:break-word}@media (min-width: 36em){/*!@.duet-heading*/.duet-heading.sc-duet-heading{margin-bottom:20px !important}}/*!@.duet-heading.duet-theme-turva*/.duet-heading.duet-theme-turva.sc-duet-heading{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-style:italic;font-weight:700;color:#171c3a}/*!@.duet-heading.duet-heading-border*/.duet-heading.duet-heading-border.sc-duet-heading{padding-bottom:20px;border-bottom:1px solid #e1e3e6}/*!@.duet-heading.duet-heading-border.duet-heading-border-solid*/.duet-heading.duet-heading-border.duet-heading-border-solid.sc-duet-heading{border-bottom-color:#657787}/*!@.duet-heading.duet-heading-hyphenate*/.duet-heading.duet-heading-hyphenate.sc-duet-heading{-webkit-hyphens:auto;hyphens:auto}/*!@.duet-heading.h0*/.duet-heading.h0.sc-duet-heading{font-size:9.4vw}/*!@.duet-heading.h0.duet-p-0*/.duet-heading.h0.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h0.duet-m-0*/.duet-heading.h0.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 31.914893617rem){/*!@.duet-heading.h0*/.duet-heading.h0.sc-duet-heading{font-size:3rem}}@media (min-width: 47.8723404255rem){/*!@.duet-heading.h0*/.duet-heading.h0.sc-duet-heading{font-size:4.5rem}}@media (max-width: 22.5em){/*!@.duet-heading.h0*/.duet-heading.h0.sc-duet-heading{font-size:2.25rem}}/*!@.duet-heading.h1*/.duet-heading.h1.sc-duet-heading{font-size:7vw}/*!@.duet-heading.h1.duet-p-0*/.duet-heading.h1.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h1.duet-m-0*/.duet-heading.h1.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 32.1428571429rem){/*!@.duet-heading.h1*/.duet-heading.h1.sc-duet-heading{font-size:2.25rem}}@media (min-width: 42.8571428571rem){/*!@.duet-heading.h1*/.duet-heading.h1.sc-duet-heading{font-size:3rem}}@media (max-width: 22.5em){/*!@.duet-heading.h1*/.duet-heading.h1.sc-duet-heading{font-size:1.5rem}}/*!@.duet-heading.h2*/.duet-heading.h2.sc-duet-heading{font-size:5.8vw}/*!@.duet-heading.h2.duet-p-0*/.duet-heading.h2.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h2.duet-m-0*/.duet-heading.h2.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 25.8620689655rem){/*!@.duet-heading.h2*/.duet-heading.h2.sc-duet-heading{font-size:1.5rem}}@media (min-width: 38.7931034483rem){/*!@.duet-heading.h2*/.duet-heading.h2.sc-duet-heading{font-size:2.25rem}}@media (max-width: 22.5em){/*!@.duet-heading.h2*/.duet-heading.h2.sc-duet-heading{font-size:1.375rem}}/*!@.duet-heading.h3*/.duet-heading.h3.sc-duet-heading{margin-bottom:12px !important;font-size:4.2vw}/*!@.duet-heading.h3.duet-p-0*/.duet-heading.h3.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h3.duet-m-0*/.duet-heading.h3.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 29.7619047619rem){/*!@.duet-heading.h3*/.duet-heading.h3.sc-duet-heading{font-size:1.25rem}}@media (min-width: 35.7142857143rem){/*!@.duet-heading.h3*/.duet-heading.h3.sc-duet-heading{font-size:1.5rem}}/*!@.duet-heading.h3.duet-theme-turva*/.duet-heading.h3.duet-theme-turva.sc-duet-heading{font-style:normal}/*!@.duet-heading.h3.duet-heading-border*/.duet-heading.h3.duet-heading-border.sc-duet-heading{padding-bottom:20px}/*!@.duet-heading.h4*/.duet-heading.h4.sc-duet-heading{margin-bottom:8px !important;font-size:4vw;letter-spacing:0}/*!@.duet-heading.h4.duet-p-0*/.duet-heading.h4.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h4.duet-m-0*/.duet-heading.h4.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 27.5rem){/*!@.duet-heading.h4*/.duet-heading.h4.sc-duet-heading{font-size:1.1rem}}@media (min-width: 31.25rem){/*!@.duet-heading.h4*/.duet-heading.h4.sc-duet-heading{font-size:1.25rem}}/*!@.duet-heading.h4.duet-theme-turva*/.duet-heading.h4.duet-theme-turva.sc-duet-heading{font-style:normal;font-weight:700}/*!@.duet-heading.h4.duet-heading-border*/.duet-heading.h4.duet-heading-border.sc-duet-heading{padding-bottom:20px}/*!@.duet-heading.h5*/.duet-heading.h5.sc-duet-heading{margin-bottom:8px !important;font-size:4vw;font-weight:600;letter-spacing:0}/*!@.duet-heading.h5.duet-p-0*/.duet-heading.h5.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h5.duet-m-0*/.duet-heading.h5.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 27.5rem){/*!@.duet-heading.h5*/.duet-heading.h5.sc-duet-heading{font-size:1.1rem}}@media (min-width: 28.4090909091rem){/*!@.duet-heading.h5*/.duet-heading.h5.sc-duet-heading{font-size:1.1363636364rem}}/*!@.duet-heading.h5.duet-theme-turva*/.duet-heading.h5.duet-theme-turva.sc-duet-heading{font-style:normal;font-weight:700}/*!@.duet-heading.h5.duet-heading-border*/.duet-heading.h5.duet-heading-border.sc-duet-heading{padding-bottom:16px}/*!@.duet-heading.h6*/.duet-heading.h6.sc-duet-heading{margin-bottom:8px !important;font-size:1rem;font-weight:600;letter-spacing:0}/*!@.duet-heading.h6.duet-p-0*/.duet-heading.h6.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h6.duet-m-0*/.duet-heading.h6.duet-m-0.sc-duet-heading{margin:0 !important}/*!@.duet-heading.h6.duet-theme-turva*/.duet-heading.h6.duet-theme-turva.sc-duet-heading{font-style:normal;font-weight:700}/*!@.duet-heading.h6.duet-heading-border*/.duet-heading.h6.duet-heading-border.sc-duet-heading{padding-bottom:16px}/*!@.duet-heading.duet-semibold, .duet-heading.duet-theme-turva.duet-semibold*/.duet-heading.duet-semibold.sc-duet-heading,.duet-heading.duet-theme-turva.duet-semibold.sc-duet-heading{font-style:normal !important;font-weight:600 !important}";
 
 class DuetHeading {
   constructor(hostRef) {
@@ -9974,7 +10731,7 @@ class DuetHeading {
      */
     this.margin = "auto";
     /**
-     * Enable or disable the border underneath the heading.
+     * Enable or disable the border underneath the heading, solid will darken the border
      */
     this.border = false;
     /**
@@ -10011,7 +10768,8 @@ class DuetHeading {
     const color = getColorByName(this.color);
     return (hAsync(TagName, { class: {
         "duet-heading": true,
-        "duet-heading-border": this.border,
+        "duet-heading-border": this.border !== false,
+        "duet-heading-border-solid": this.border === "solid",
         "duet-semibold": this.weight === "semibold",
         "duet-heading-hyphenate": this.hyphenate,
         "duet-m-0": this.margin === "none",
@@ -10028,7 +10786,7 @@ class DuetHeading {
       "level": [513],
       "margin": [1],
       "visualLevel": [1, "visual-level"],
-      "border": [4],
+      "border": [8],
       "weight": [1],
       "color": [1],
       "theme": [1025],
@@ -10361,11 +11119,13 @@ class DuetIcon {
    * Always the last one in the class.
    */
   render() {
-    const color = this.color === "currentColor" ? "currentColor" : getColorByName(this.color) || getColorByName(this.outline);
+    const color = this.color === "currentColor"
+      ? "currentColor"
+      : getColorByName(this.color, this.theme) || getColorByName(this.outline, this.theme);
     const styles = {
       color,
-      background: getColorByName(this.background),
-      "border-color": getColorByName(this.outline),
+      background: getColorByName(this.background, this.theme),
+      "border-color": getColorByName(this.outline, this.theme),
     };
     return (hAsync(Host, { class: {
         "duet-m-0": this.margin === "none",
@@ -10412,8 +11172,6 @@ class DuetIcon {
 
 var formEmail={"title":"form-email","tags":"form email","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M12 23.999c-3.205 0-6.218-1.248-8.484-3.514S.001 15.206.001 12.001s1.248-6.218 3.514-8.485C5.782 1.25 8.795.001 12 .001s6.218 1.248 8.485 3.514A11.92 11.92 0 0 1 24 12v2.25A3.754 3.754 0 0 1 20.25 18a3.77 3.77 0 0 1-3.48-2.365A6.009 6.009 0 0 1 12 18c-3.308 0-6-2.692-6-6s2.692-6 6-6 6 2.692 6 6v2.25c0 1.241 1.009 2.25 2.25 2.25s2.25-1.009 2.25-2.25V12c0-2.804-1.092-5.441-3.075-7.424A10.433 10.433 0 0 0 12 1.501c-2.804 0-5.441 1.092-7.424 3.075S1.501 9.196 1.501 12c0 2.805 1.092 5.441 3.075 7.424s4.619 3.074 7.423 3.074c2.257 0 4.494-.746 6.299-2.1a.749.749 0 1 1 .9 1.199A12.049 12.049 0 0 1 12 23.999zM12 7.5c-2.481 0-4.5 2.019-4.5 4.5s2.019 4.5 4.5 4.5 4.5-2.019 4.5-4.5-2.019-4.5-4.5-4.5z\"/></svg>"};
 
-var formSearch={"title":"form-search","tags":"form search magnifying glass","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M23.245 23.996a.743.743 0 0 1-.53-.22L16.2 17.26a9.824 9.824 0 0 1-2.553 1.579 9.766 9.766 0 0 1-7.51.069 9.745 9.745 0 0 1-5.359-5.262c-1.025-2.412-1.05-5.08-.069-7.51S3.558 1.802 5.97.777a9.744 9.744 0 0 1 7.51-.069c2.431.981 4.334 2.849 5.359 5.262s1.05 5.08.069 7.51a9.807 9.807 0 0 1-1.649 2.718l6.517 6.518a.75.75 0 0 1-.531 1.28zM9.807 1.49a8.259 8.259 0 0 0-3.25.667c-2.044.869-3.627 2.481-4.458 4.54s-.81 4.318.058 6.362a8.26 8.26 0 0 0 4.54 4.458 8.259 8.259 0 0 0 6.362-.059 8.285 8.285 0 0 0 2.594-1.736.365.365 0 0 1 .077-.076 8.245 8.245 0 0 0 1.786-2.728 8.255 8.255 0 0 0-.059-6.362 8.257 8.257 0 0 0-4.54-4.458 8.28 8.28 0 0 0-3.11-.608z\"/></svg>"};
-
 /**
  * This function restores cursor position after changing input
  *
@@ -10463,7 +11221,7 @@ function cleanValue(input, regex) {
   return newValue;
 }
 
-const duetInputCss = "*.sc-duet-input,*.sc-duet-input::after,*.sc-duet-input::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-input-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;display:inline-flex;width:100%;min-width:calc(33.333% - 8px);max-width:100%;text-align:left;vertical-align:bottom}.sc-duet-input-h:last-child,.sc-duet-input-h:last-of-type{margin-right:0 !important}@media (min-width: 36em){.sc-duet-input-h{width:calc(50% - 16px - 3px)}}.duet-expand.sc-duet-input-h{width:100% !important}.duet-m-0.sc-duet-input-h{margin:0 !important}duet-tooltip.sc-duet-input{position:absolute;top:12px;right:0}@media (min-width: 48em){duet-tooltip.sc-duet-input{position:relative;top:4px;right:auto}}duet-caption.sc-duet-input:not(:last-of-type){margin-bottom:0}.duet-input-icon.sc-duet-input{position:absolute;top:50%;right:16px;z-index:200;width:20px;height:20px;font-size:0;line-height:normal;color:#00294d;pointer-events:none;transform:translateY(-50%)}.duet-theme-turva.sc-duet-input .duet-input-icon.sc-duet-input{color:#171c3a}.duet-input-container.sc-duet-input{position:relative;width:100%;height:100%}.duet-input.sc-duet-input{position:relative;z-index:100;display:block !important;width:100% !important;min-width:8rem;max-width:initial !important;height:auto !important;padding:12px 14px !important;margin:initial !important;margin-bottom:initial !important;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 !important;font-variant-numeric:tabular-nums;line-height:1.5 !important;color:#00294d !important;cursor:initial !important;background:white !important;background-clip:initial !important;border:1px solid #909599 !important;border-radius:4px !important;box-shadow:initial !important;transition:box-shadow 150ms ease, border 150ms ease !important}.duet-input.is-number.sc-duet-input{padding-right:112px !important}.duet-input.is-date.sc-duet-input{padding-right:64px !important}.has-error.sc-duet-input .duet-input.sc-duet-input{border-color:#de2362 !important}.has-error.sc-duet-input .duet-input.sc-duet-input+.duet-input-icon.sc-duet-input{color:#de2362 !important}.duet-theme-turva.has-error.sc-duet-input .duet-input.sc-duet-input{border-color:#e02a0d !important}.duet-theme-turva.has-error.sc-duet-input .duet-input.sc-duet-input+.duet-input-icon.sc-duet-input{color:#e02a0d !important}.has-icon.sc-duet-input .duet-input.sc-duet-input{padding-right:48px !important}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a !important;border-color:#747475 !important}.duet-input.sc-duet-input::-ms-clear{display:none}.duet-input.sc-duet-input::-webkit-contacts-auto-fill-button{display:none !important}.duet-input.sc-duet-input::-webkit-input-placeholder{color:#657787;opacity:1 !important;transition:color 300ms ease}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input::-webkit-input-placeholder{color:#747475}.duet-input.sc-duet-input:focus::-webkit-input-placeholder{color:#cfd2d4}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input:focus::-webkit-input-placeholder{color:#cfcfd1}.duet-input.sc-duet-input::-moz-placeholder{color:#657787;opacity:1 !important}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input::-moz-placeholder{color:#747475}.duet-input.sc-duet-input:focus::-moz-placeholder{color:#cfd2d4}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input:focus::-moz-placeholder{color:#cfcfd1}.duet-input.sc-duet-input:-ms-input-placeholder{color:#657787}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input:-ms-input-placeholder{color:#747475}.duet-input.sc-duet-input:focus:-ms-input-placeholder{color:#cfd2d4}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input:focus:-ms-input-placeholder{color:#cfcfd1}.duet-input[disabled].sc-duet-input{color:#00294d !important;cursor:text !important;background:#f5f8fa !important;border-color:#f5f8fa !important;box-shadow:none !important;opacity:1 !important;-webkit-text-fill-color:#00294d !important}.duet-theme-turva.sc-duet-input .duet-input[disabled].sc-duet-input{color:#171c3a !important;background:#f5f5f7 !important;border-color:#f5f5f7 !important;-webkit-text-fill-color:#171c3a !important}.duet-input.sc-duet-input:hover:not(:disabled){box-shadow:0 0 0 1px #909599 !important}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input:hover:not(:disabled){box-shadow:0 0 0 1px #747475 !important}.has-error.sc-duet-input .duet-input.sc-duet-input:hover:not(:disabled){box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-input .duet-input.sc-duet-input:hover:not(:disabled){box-shadow:0 0 0 1px #e02a0d}.duet-input.sc-duet-input:focus{border-color:#0077b3 !important;outline:0;box-shadow:0 0 0 1px #0077b3 !important;transition:none}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input:focus{border-color:#171c3a !important;box-shadow:0 0 0 1px #171c3a !important}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input:focus+.duet-input-icon.sc-duet-input{color:#171c3a}.has-error.sc-duet-input .duet-input.sc-duet-input:focus{box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-input .duet-input.sc-duet-input:focus{box-shadow:0 0 0 1px #e02a0d}.duet-input.sc-duet-input:focus+.duet-input-icon.sc-duet-input{color:#0077b3}.duet-input[type=search].sc-duet-input:not(:placeholder-shown):focus+.duet-input-icon.sc-duet-input{display:none}.duet-input.sc-duet-input:not(:focus):not(:hover):invalid{box-shadow:none !important}.duet-input[type=number].sc-duet-input::-webkit-inner-spin-button,.duet-input[type=number].sc-duet-input::-webkit-outer-spin-button,.duet-input[type=time].sc-duet-input::-webkit-inner-spin-button,.duet-input[type=time].sc-duet-input::-webkit-outer-spin-button{display:none;margin:0;-webkit-appearance:none}.duet-input.sc-duet-input::-webkit-search-cancel-button{margin-right:-28px}.duet-input-help.sc-duet-input{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:0.875rem;font-weight:400;line-height:1.25;color:#657787;border-radius:4px}.duet-input-help.sc-duet-input span.sc-duet-input{display:block;margin-top:8px}.duet-theme-turva.sc-duet-input .duet-input-help.sc-duet-input{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#747475}.has-error.sc-duet-input .duet-input-help.sc-duet-input{color:#de2362}.duet-theme-turva.has-error.sc-duet-input .duet-input-help.sc-duet-input{color:#e02a0d}.duet-label-hidden.sc-duet-input duet-label.sc-duet-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}.duet-input-relative.sc-duet-input{position:relative;width:100%}";
+const duetInputCss = "*.sc-duet-input,*.sc-duet-input::after,*.sc-duet-input::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-input-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;display:inline-flex;width:100%;min-width:calc(33.333% - 8px);max-width:100%;text-align:left;vertical-align:bottom}.sc-duet-input-h:last-child,.sc-duet-input-h:last-of-type{margin-right:0 !important}@media (min-width: 36em){.sc-duet-input-h{width:calc(50% - 16px - 3px)}}.duet-expand.sc-duet-input-h{width:100% !important}.duet-m-0.sc-duet-input-h{margin:0 !important}duet-tooltip.sc-duet-input{position:absolute;top:12px;right:0}@media (min-width: 48em){duet-tooltip.sc-duet-input{position:relative;top:4px;right:auto}}duet-caption.sc-duet-input:not(:last-of-type){margin-bottom:0}.duet-input-placeholder.sc-duet-input{position:absolute;top:-9px;left:9px;z-index:200;display:block;width:auto;max-width:60%;padding:0 0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:white}.duet-input-icon.sc-duet-input{position:absolute;top:50%;right:16px;z-index:200;width:20px;height:20px;font-size:0;line-height:normal;color:#00294d;pointer-events:none;transform:translateY(-50%)}.duet-theme-turva.sc-duet-input .duet-input-icon.sc-duet-input{color:#171c3a}.duet-input-container.sc-duet-input{position:relative;width:100%;height:100%}.duet-input.sc-duet-input{position:relative;z-index:100;display:block !important;width:100% !important;min-width:8rem;max-width:initial !important;height:auto !important;padding:12px 14px !important;margin:initial !important;margin-bottom:initial !important;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 !important;font-variant-numeric:tabular-nums;line-height:1.5 !important;color:#00294d !important;cursor:initial !important;background:white !important;background-clip:initial !important;border:1px solid #909599 !important;border-radius:4px !important;box-shadow:initial !important;transition:box-shadow 150ms ease, border 150ms ease !important}.duet-input.is-number.sc-duet-input{padding-right:112px !important}.duet-input.is-date.sc-duet-input{padding-right:64px !important}.has-error.sc-duet-input .duet-input.sc-duet-input{border-color:#de2362 !important}.has-error.sc-duet-input .duet-input.sc-duet-input+.duet-input-icon.sc-duet-input{color:#de2362 !important}.duet-theme-turva.has-error.sc-duet-input .duet-input.sc-duet-input{border-color:#e02a0d !important}.duet-theme-turva.has-error.sc-duet-input .duet-input.sc-duet-input+.duet-input-icon.sc-duet-input{color:#e02a0d !important}.has-icon.sc-duet-input .duet-input.sc-duet-input{padding-right:48px !important}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a !important;border-color:#747475 !important}.duet-input.sc-duet-input::-ms-clear{display:none}.duet-input.sc-duet-input::-webkit-contacts-auto-fill-button{display:none !important}.duet-input.sc-duet-input::-webkit-input-placeholder{color:#657787;opacity:1 !important;transition:color 300ms ease}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input::-webkit-input-placeholder{color:#747475}.duet-input.sc-duet-input:focus::-webkit-input-placeholder{color:#cfd2d4}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input:focus::-webkit-input-placeholder{color:#cfcfd1}.duet-input.sc-duet-input::-moz-placeholder{color:#657787;opacity:1 !important}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input::-moz-placeholder{color:#747475}.duet-input.sc-duet-input:focus::-moz-placeholder{color:#cfd2d4}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input:focus::-moz-placeholder{color:#cfcfd1}.duet-input.sc-duet-input:-ms-input-placeholder{color:#657787}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input:-ms-input-placeholder{color:#747475}.duet-input.sc-duet-input:focus:-ms-input-placeholder{color:#cfd2d4}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input:focus:-ms-input-placeholder{color:#cfcfd1}.duet-input[disabled].sc-duet-input{color:#00294d !important;cursor:text !important;background:#f5f8fa !important;border-color:#f5f8fa !important;box-shadow:none !important;opacity:1 !important;-webkit-text-fill-color:#00294d !important}.duet-theme-turva.sc-duet-input .duet-input[disabled].sc-duet-input{color:#171c3a !important;background:#f5f5f7 !important;border-color:#f5f5f7 !important;-webkit-text-fill-color:#171c3a !important}.duet-input.sc-duet-input:hover:not(:disabled){box-shadow:0 0 0 1px #909599 !important}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input:hover:not(:disabled){box-shadow:0 0 0 1px #747475 !important}.has-error.sc-duet-input .duet-input.sc-duet-input:hover:not(:disabled){box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-input .duet-input.sc-duet-input:hover:not(:disabled){box-shadow:0 0 0 1px #e02a0d}.duet-input.sc-duet-input:focus{border-color:#0077b3 !important;outline:0;box-shadow:0 0 0 1px #0077b3 !important;transition:none}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input:focus{border-color:#171c3a !important;box-shadow:0 0 0 1px #171c3a !important}.duet-theme-turva.sc-duet-input .duet-input.sc-duet-input:focus+.duet-input-icon.sc-duet-input{color:#171c3a}.has-error.sc-duet-input .duet-input.sc-duet-input:focus{box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-input .duet-input.sc-duet-input:focus{box-shadow:0 0 0 1px #e02a0d}.duet-input.sc-duet-input:focus+.duet-input-icon.sc-duet-input{color:#0077b3}.duet-input[type=search].sc-duet-input:not(:placeholder-shown):focus+.duet-input-icon.sc-duet-input{display:none}.duet-input.sc-duet-input:not(:focus):not(:hover):invalid{box-shadow:none !important}.duet-input[type=number].sc-duet-input::-webkit-inner-spin-button,.duet-input[type=number].sc-duet-input::-webkit-outer-spin-button,.duet-input[type=time].sc-duet-input::-webkit-inner-spin-button,.duet-input[type=time].sc-duet-input::-webkit-outer-spin-button{display:none;margin:0;-webkit-appearance:none}.duet-input.sc-duet-input::-webkit-search-cancel-button{margin-right:-28px}.duet-input-help.sc-duet-input{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:0.875rem;font-weight:400;line-height:1.25;color:#657787;border-radius:4px}.duet-input-help.sc-duet-input span.sc-duet-input{display:block;margin-top:8px}.duet-theme-turva.sc-duet-input .duet-input-help.sc-duet-input{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#747475}.has-error.sc-duet-input .duet-input-help.sc-duet-input{color:#de2362}.duet-theme-turva.has-error.sc-duet-input .duet-input-help.sc-duet-input{color:#e02a0d}.duet-label-hidden.sc-duet-input duet-label.sc-duet-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}.duet-input-relative.sc-duet-input{position:relative;width:100%}";
 
 const icons = {
   search: formSearch,
@@ -10603,7 +11361,7 @@ class DuetInput {
       // (in webkit based browsers settings value trigger cursor position and will set it to EndOfText)
       restoreCursor();
     }
-    this.isCaptionVisible = !!(this.caption || (this.placeholder && this.echoPlaceholder && this.value));
+    this.isCaptionVisible = !!this.caption;
     const emitEvent = () => this.duetChange.emit({
       value: this.value,
       component: "duet-input",
@@ -10622,7 +11380,7 @@ class DuetInput {
   componentWillLoad() {
     inheritGlobalTheme(this);
     this.disallowedPatternChange();
-    this.isCaptionVisible = !!(this.caption || (this.placeholder && this.echoPlaceholder && this.value));
+    this.isCaptionVisible = !!this.caption;
   }
   /**
    * Sets focus on the specified `duet-input`. Use this method instead of the global
@@ -10657,12 +11415,12 @@ class DuetInput {
         "duet-input-top-caption-shown": this.isCaptionVisible,
         "has-icon": !!this.icon || (this.type !== "text" && this.type !== "tel" && this.type !== "password"),
         "has-error": !!this.error,
-      } }, hAsync("duet-label", { theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, margin: this.isCaptionVisible ? "small" : "auto", id: this.labelId, for: identifier }, this.label), this.tooltip && (hAsync("duet-tooltip", { direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), this.caption && (hAsync("duet-caption", { id: this.topCaptionId, size: "medium" }, this.caption)), this.placeholder && this.echoPlaceholder && this.value && (hAsync("duet-caption", { id: this.topCaptionPlaceholderId, size: "small" }, this.placeholder)), hAsync("div", { class: "duet-input-relative" }, hAsync("input", Object.assign({ ref: input => (this.nativeInput = input), onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, type: this.type, class: {
+      } }, hAsync("duet-label", { theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, margin: this.isCaptionVisible ? "small" : "auto", id: this.labelId, for: identifier }, this.label), this.tooltip && (hAsync("duet-tooltip", { direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), this.caption && (hAsync("duet-caption", { id: this.topCaptionId, size: "medium" }, this.caption)), hAsync("div", { class: "duet-input-relative" }, this.placeholder && this.echoPlaceholder && this.value && (hAsync("duet-caption", { id: this.topCaptionPlaceholderId, class: "duet-input-placeholder", margin: "none", size: "small" }, this.placeholder)), hAsync("input", Object.assign({ ref: input => (this.nativeInput = input), onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, type: this.type, class: {
         "duet-input": true,
         disabled: this.disabled,
         "is-number": this.component === "number",
         "is-date": this.component === "date",
-      }, value: this.value, disabled: this.disabled, "aria-invalid": this.error ? "true" : "false", "aria-labelledby": `${this.labelId} ${this.errorId}`, "aria-controls": this.accessibleControls, "aria-autocomplete": this.accessibleAutocomplete, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": `${this.isCaptionVisible ? this.topCaptionId : ""} ${this.accessibleDescribedBy}`, placeholder: this.placeholder, spellcheck: "false", minlength: this.minlength, maxlength: this.maxlength, autocomplete: this.autoComplete, required: this.required, role: this.role, name: this.name, id: identifier }, inputProps)), !this.icon && this.type !== "text" && this.type !== "tel" && this.type !== "password" && (hAsync("div", { class: "duet-input-icon" }, hAsync("duet-icon", { margin: "none", size: "small", icon: icons[this.type].svg, color: "currentColor" }))), this.icon && (hAsync("div", { class: "duet-input-icon" }, hAsync("duet-icon", { margin: "none", size: "small", name: this.icon, color: "currentColor" }))), hAsync("slot", null)), hAsync("span", { class: "duet-input-help", id: this.errorId, "aria-live": "assertive", "aria-relevant": "additions removals" }, this.error && hAsync("span", null, this.error)))));
+      }, value: this.value, disabled: this.disabled, "aria-invalid": this.error ? "true" : "false", "aria-labelledby": `${this.labelId} ${this.errorId}`, "aria-controls": this.accessibleControls, "aria-autocomplete": this.accessibleAutocomplete, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": `${this.isCaptionVisible ? this.topCaptionId : ""} ${this.accessibleDescribedBy}`, placeholder: this.placeholder, spellcheck: "false", minlength: this.minlength, maxlength: this.maxlength, autocomplete: this.autoComplete, required: this.required, role: this.role, name: this.name, id: identifier }, inputProps)), !this.icon && this.type !== "text" && this.type !== "tel" && this.type !== "password" && (hAsync("div", { class: "duet-input-icon" }, hAsync("duet-icon", { margin: "none", size: "small", icon: icons[this.type].svg, color: "currentColor" }))), this.icon && (hAsync("div", { class: "duet-input-icon" }, hAsync("duet-icon", { margin: "none", size: "small", name: this.icon, color: "currentColor" }))), hAsync("slot", null)), hAsync("span", { class: "duet-input-help", id: this.errorId, "aria-live": "assertive", "aria-relevant": "additions removals" }, this.error && hAsync("span", { class: "duet-input-error" }, this.error)))));
   }
   get element() { return getElement(this); }
   static get watchers() { return {
@@ -10869,6 +11627,9 @@ class DuetLayout {
 
 const duetLinkCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-link,*.sc-duet-link::after,*.sc-duet-link::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-link-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:inline}/*!@.duet-link*/.duet-link.sc-duet-link{display:inline;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-style:normal;font-weight:400;color:#0077b3;text-decoration:underline;border-radius:4px;transition:300ms ease}/*!@.duet-link:focus*/.duet-link.sc-duet-link:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@.duet-theme-turva .duet-link:focus, .duet-link:focus.duet-theme-turva*/.duet-theme-turva.sc-duet-link .duet-link.sc-duet-link:focus,.duet-link.sc-duet-link:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-link.duet-theme-turva*/.duet-link.duet-theme-turva.sc-duet-link{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#c60c30}/*!@.duet-link:hover*/.duet-link.sc-duet-link:hover{color:#004d80;text-decoration:none}/*!@.duet-link:hover.duet-theme-turva*/.duet-link.sc-duet-link:hover.duet-theme-turva{color:#940925}/*!@.duet-link:active*/.duet-link.sc-duet-link:active{opacity:0.75;transition:none}/*!@.duet-link-external*/.duet-link-external.sc-duet-link{margin-left:4px}";
 
+/**
+ * @part duet-link - piercing selector for styling the link
+ */
 class DuetLink {
   constructor(hostRef) {
     registerInstance(this, hostRef);
@@ -10924,7 +11685,7 @@ class DuetLink {
         "duet-link": true,
         "duet-link-is-external": this.external,
         "duet-theme-turva": this.theme === "turva",
-      }, target: this.external ? "_blank" : "_self", "aria-label": this.accessibleLabel, id: this.identifier, ref: el => (this.nativeLink = el) }, hAsync("slot", null), Build.isBrowser  )));
+      }, target: this.external ? "_blank" : "_self", "aria-label": this.accessibleLabel, id: this.identifier, ref: el => (this.nativeLink = el), part: "duet-link" }, hAsync("slot", null), Build.isBrowser  )));
   }
   static get delegatesFocus() { return true; }
   static get style() { return duetLinkCss; }
@@ -11066,7 +11827,7 @@ class DuetList {
   }; }
 }
 
-const duetListItemCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-list-item,*.sc-duet-list-item::after,*.sc-duet-list-item::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-list-item-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:flex;flex-flow:row;width:100%;overflow:visible;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-style:normal;font-weight:400;font-variant-numeric:tabular-nums;line-height:1.25;color:#00294d}@media (max-width: 35.9375em){/*!@:host*/.sc-duet-list-item-h{flex-wrap:wrap}}/*!@:host dt,\n:host dd*/.sc-duet-list-item-h dt.sc-duet-list-item,.sc-duet-list-item-h dd.sc-duet-list-item{-webkit-hyphens:auto;hyphens:auto;text-align:left;word-break:break-all;word-break:break-word;margin-inline-start:0}@media (max-width: 35.9375em){/*!@:host dt,\n:host dd*/.sc-duet-list-item-h dt.sc-duet-list-item,.sc-duet-list-item-h dd.sc-duet-list-item{flex:inherit;flex-basis:100% !important;width:100%;padding-bottom:4px !important}}/*!@:host dt*/.sc-duet-list-item-h dt.sc-duet-list-item{padding:16px !important;font-weight:600}@media (max-width: 35.9375em){/*!@:host dt*/.sc-duet-list-item-h dt.sc-duet-list-item{padding-bottom:4px !important}}/*!@.duet-theme-turva :host dt*/.duet-theme-turva .sc-duet-list-item-h dt.sc-duet-list-item{font-weight:700}/*!@:host dd*/.sc-duet-list-item-h dd.sc-duet-list-item{padding:16px !important;margin-left:auto;text-align:left}@media (max-width: 35.9375em){/*!@:host dd*/.sc-duet-list-item-h dd.sc-duet-list-item{padding-top:0 !important}}/*!@:host(:not(.duet-list-striped)) dt*/.sc-duet-list-item-h:not(.duet-list-striped) dt.sc-duet-list-item{padding:8px !important;padding-left:0 !important}@media (max-width: 35.9375em){/*!@:host(:not(.duet-list-striped)) dt*/.sc-duet-list-item-h:not(.duet-list-striped) dt.sc-duet-list-item{padding-bottom:4px !important}}/*!@:host(:not(.duet-list-striped)) dd*/.sc-duet-list-item-h:not(.duet-list-striped) dd.sc-duet-list-item{padding:8px !important;padding-left:0 !important}@media (max-width: 35.9375em){/*!@:host(:not(.duet-list-striped)) dd*/.sc-duet-list-item-h:not(.duet-list-striped) dd.sc-duet-list-item{padding-top:0 !important}}/*!@:host(.duet-theme-turva)*/.duet-theme-turva.sc-duet-list-item-h{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}/*!@:host(.duet-list-striped:nth-child(odd)) dt,\n:host(.duet-list-striped:nth-child(odd)) dd*/.duet-list-striped.sc-duet-list-item-h:nth-child(odd) dt.sc-duet-list-item,.duet-list-striped.sc-duet-list-item-h:nth-child(odd) dd.sc-duet-list-item{background:#f5f8fa}/*!@:host(.duet-list-striped.duet-theme-turva:nth-child(odd)) dt,\n:host(.duet-list-striped.duet-theme-turva:nth-child(odd)) dd*/.duet-list-striped.duet-theme-turva.sc-duet-list-item-h:nth-child(odd) dt.sc-duet-list-item,.duet-list-striped.duet-theme-turva.sc-duet-list-item-h:nth-child(odd) dd.sc-duet-list-item{background:#f5f5f7}/*!@:host(.duet-list-width-30) dt*/.duet-list-width-30.sc-duet-list-item-h dt.sc-duet-list-item{flex-basis:33%}/*!@:host(.duet-list-width-30) dd*/.duet-list-width-30.sc-duet-list-item-h dd.sc-duet-list-item{flex-basis:67%}/*!@:host(.duet-list-width-50) dt*/.duet-list-width-50.sc-duet-list-item-h dt.sc-duet-list-item{flex-basis:47%}/*!@:host(.duet-list-width-50) dd*/.duet-list-width-50.sc-duet-list-item-h dd.sc-duet-list-item{flex-basis:53%}/*!@:host(.duet-list-width-70) dt*/.duet-list-width-70.sc-duet-list-item-h dt.sc-duet-list-item{flex-basis:65%}/*!@:host(.duet-list-width-70) dd*/.duet-list-width-70.sc-duet-list-item-h dd.sc-duet-list-item{flex-basis:35%}/*!@:host(.duet-p-0) dt,\n:host(.duet-p-0) dd*/.duet-p-0.sc-duet-list-item-h dt.sc-duet-list-item,.duet-p-0.sc-duet-list-item-h dd.sc-duet-list-item{padding-top:0 !important;padding-bottom:4px !important}@media (max-width: 35.9375em){/*!@:host(.duet-list-mobile-center) dt,\n:host(.duet-list-mobile-center) dd*/.duet-list-mobile-center.sc-duet-list-item-h dt.sc-duet-list-item,.duet-list-mobile-center.sc-duet-list-item-h dd.sc-duet-list-item{text-align:center}}@media (max-width: 61.9375em){/*!@:host(.duet-list-breakpoint-large)*/.duet-list-breakpoint-large.sc-duet-list-item-h{flex-wrap:wrap}/*!@:host(.duet-list-breakpoint-large) dt,\n:host(.duet-list-breakpoint-large) dd*/.duet-list-breakpoint-large.sc-duet-list-item-h dt.sc-duet-list-item,.duet-list-breakpoint-large.sc-duet-list-item-h dd.sc-duet-list-item{flex:inherit;flex-basis:100% !important;width:100%;padding-bottom:4px !important}/*!@:host(.duet-list-breakpoint-large) dd*/.duet-list-breakpoint-large.sc-duet-list-item-h dd.sc-duet-list-item{padding-top:0 !important}}/*!@:host(.duet-list-breakpoint-large.duet-list-striped) dd*/.duet-list-breakpoint-large.duet-list-striped.sc-duet-list-item-h dd.sc-duet-list-item{padding-bottom:16px !important}@media (max-width: 61.9375em){/*!@:host(.duet-list-breakpoint-large.duet-list-mobile-center) dt,\n:host(.duet-list-breakpoint-large.duet-list-mobile-center) dd*/.duet-list-breakpoint-large.duet-list-mobile-center.sc-duet-list-item-h dt.sc-duet-list-item,.duet-list-breakpoint-large.duet-list-mobile-center.sc-duet-list-item-h dd.sc-duet-list-item{text-align:center !important}}";
+const duetListItemCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-list-item,*.sc-duet-list-item::after,*.sc-duet-list-item::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-list-item-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:flex;flex-flow:row;width:100%;overflow:visible;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-style:normal;font-weight:400;font-variant-numeric:tabular-nums;line-height:1.25;color:#00294d}@media (max-width: 35.9375em){/*!@:host*/.sc-duet-list-item-h{flex-wrap:wrap}}/*!@:host dt,\n:host dd*/.sc-duet-list-item-h dt.sc-duet-list-item,.sc-duet-list-item-h dd.sc-duet-list-item{margin-inline-start:0;-webkit-hyphens:auto;hyphens:auto;text-align:left;word-break:break-all;word-break:break-word}@media (max-width: 35.9375em){/*!@:host dt,\n:host dd*/.sc-duet-list-item-h dt.sc-duet-list-item,.sc-duet-list-item-h dd.sc-duet-list-item{flex:inherit;flex-basis:100% !important;width:100%;padding-bottom:4px !important}}/*!@:host dt*/.sc-duet-list-item-h dt.sc-duet-list-item{padding:16px !important;font-weight:600}@media (max-width: 35.9375em){/*!@:host dt*/.sc-duet-list-item-h dt.sc-duet-list-item{padding-bottom:4px !important}}/*!@.duet-theme-turva :host dt*/.duet-theme-turva .sc-duet-list-item-h dt.sc-duet-list-item{font-weight:700}/*!@:host dd*/.sc-duet-list-item-h dd.sc-duet-list-item{padding:16px !important;margin-left:auto;text-align:left}@media (max-width: 35.9375em){/*!@:host dd*/.sc-duet-list-item-h dd.sc-duet-list-item{padding-top:0 !important}}/*!@:host(:not(.duet-list-striped)) dt*/.sc-duet-list-item-h:not(.duet-list-striped) dt.sc-duet-list-item{padding:8px !important;padding-left:0 !important}@media (max-width: 35.9375em){/*!@:host(:not(.duet-list-striped)) dt*/.sc-duet-list-item-h:not(.duet-list-striped) dt.sc-duet-list-item{padding-bottom:4px !important}}/*!@:host(:not(.duet-list-striped)) dd*/.sc-duet-list-item-h:not(.duet-list-striped) dd.sc-duet-list-item{padding:8px !important;padding-left:0 !important}@media (max-width: 35.9375em){/*!@:host(:not(.duet-list-striped)) dd*/.sc-duet-list-item-h:not(.duet-list-striped) dd.sc-duet-list-item{padding-top:0 !important}}/*!@:host(.duet-theme-turva)*/.duet-theme-turva.sc-duet-list-item-h{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}/*!@:host(.duet-list-striped:nth-child(odd)) dt,\n:host(.duet-list-striped:nth-child(odd)) dd*/.duet-list-striped.sc-duet-list-item-h:nth-child(odd) dt.sc-duet-list-item,.duet-list-striped.sc-duet-list-item-h:nth-child(odd) dd.sc-duet-list-item{background:#f5f8fa}/*!@:host(.duet-list-striped.duet-theme-turva:nth-child(odd)) dt,\n:host(.duet-list-striped.duet-theme-turva:nth-child(odd)) dd*/.duet-list-striped.duet-theme-turva.sc-duet-list-item-h:nth-child(odd) dt.sc-duet-list-item,.duet-list-striped.duet-theme-turva.sc-duet-list-item-h:nth-child(odd) dd.sc-duet-list-item{background:#f5f5f7}/*!@:host(.duet-list-width-30) dt*/.duet-list-width-30.sc-duet-list-item-h dt.sc-duet-list-item{flex-basis:33%}/*!@:host(.duet-list-width-30) dd*/.duet-list-width-30.sc-duet-list-item-h dd.sc-duet-list-item{flex-basis:67%}/*!@:host(.duet-list-width-50) dt*/.duet-list-width-50.sc-duet-list-item-h dt.sc-duet-list-item{flex-basis:47%}/*!@:host(.duet-list-width-50) dd*/.duet-list-width-50.sc-duet-list-item-h dd.sc-duet-list-item{flex-basis:53%}/*!@:host(.duet-list-width-70) dt*/.duet-list-width-70.sc-duet-list-item-h dt.sc-duet-list-item{flex-basis:65%}/*!@:host(.duet-list-width-70) dd*/.duet-list-width-70.sc-duet-list-item-h dd.sc-duet-list-item{flex-basis:35%}/*!@:host(.duet-p-0) dt,\n:host(.duet-p-0) dd*/.duet-p-0.sc-duet-list-item-h dt.sc-duet-list-item,.duet-p-0.sc-duet-list-item-h dd.sc-duet-list-item{padding-top:0 !important;padding-bottom:4px !important}@media (max-width: 35.9375em){/*!@:host(.duet-list-mobile-center) dt,\n:host(.duet-list-mobile-center) dd*/.duet-list-mobile-center.sc-duet-list-item-h dt.sc-duet-list-item,.duet-list-mobile-center.sc-duet-list-item-h dd.sc-duet-list-item{text-align:center}}@media (max-width: 61.9375em){/*!@:host(.duet-list-breakpoint-large)*/.duet-list-breakpoint-large.sc-duet-list-item-h{flex-wrap:wrap}/*!@:host(.duet-list-breakpoint-large) dt,\n:host(.duet-list-breakpoint-large) dd*/.duet-list-breakpoint-large.sc-duet-list-item-h dt.sc-duet-list-item,.duet-list-breakpoint-large.sc-duet-list-item-h dd.sc-duet-list-item{flex:inherit;flex-basis:100% !important;width:100%;padding-bottom:4px !important}/*!@:host(.duet-list-breakpoint-large) dd*/.duet-list-breakpoint-large.sc-duet-list-item-h dd.sc-duet-list-item{padding-top:0 !important}}/*!@:host(.duet-list-breakpoint-large.duet-list-striped) dd*/.duet-list-breakpoint-large.duet-list-striped.sc-duet-list-item-h dd.sc-duet-list-item{padding-bottom:16px !important}@media (max-width: 61.9375em){/*!@:host(.duet-list-breakpoint-large.duet-list-mobile-center) dt,\n:host(.duet-list-breakpoint-large.duet-list-mobile-center) dd*/.duet-list-breakpoint-large.duet-list-mobile-center.sc-duet-list-item-h dt.sc-duet-list-item,.duet-list-breakpoint-large.duet-list-mobile-center.sc-duet-list-item-h dd.sc-duet-list-item{text-align:center !important}}";
 
 /**
  * @slot label - The list item component’s label content. Use this to put content into description list’s dt element.
@@ -11547,7 +12308,7 @@ class DuetNotification {
   }; }
 }
 
-const duetNotificationDrawerCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-notification-drawer,*.sc-duet-notification-drawer::after,*.sc-duet-notification-drawer::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-notification-drawer-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%}/*!@.duet-drawer*/.duet-drawer.sc-duet-notification-drawer{position:relative}@media (min-width: 62em){/*!@.duet-drawer*/.duet-drawer.sc-duet-notification-drawer{display:inline-block}}/*!@.duet-drawer-toggle*/.duet-drawer-toggle.sc-duet-notification-drawer{position:relative;display:flex;align-items:center;width:100%;height:48px;padding:0 20px;overflow:hidden;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;line-height:48px;color:#00294d;text-align:left;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;border-bottom:1px solid #e1e3e6;border-radius:0;-webkit-appearance:none;appearance:none}@media (min-width: 62em){/*!@.duet-drawer-toggle*/.duet-drawer-toggle.sc-duet-notification-drawer{z-index:200;width:auto;max-width:200px;padding:0 30px 0 12px;overflow:hidden;font-size:0.875rem;line-height:4rem;background-color:white;border:0;border-radius:4px;transition:border 300ms ease}}/*!@.duet-theme-turva .duet-drawer-toggle*/.duet-theme-turva.sc-duet-notification-drawer .duet-drawer-toggle.sc-duet-notification-drawer{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a;border-color:#e4e4e6}/*!@.duet-drawer-toggle:active*/.duet-drawer-toggle.sc-duet-notification-drawer:active{opacity:0.75}/*!@.duet-drawer-toggle:focus*/.duet-drawer-toggle.sc-duet-notification-drawer:focus{outline:0}/*!@:host(.user-is-tabbing) .duet-drawer-toggle:focus*/.user-is-tabbing.sc-duet-notification-drawer-h .duet-drawer-toggle.sc-duet-notification-drawer:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@:host(.user-is-tabbing) .duet-theme-turva .duet-drawer-toggle:focus*/.user-is-tabbing.sc-duet-notification-drawer-h .duet-theme-turva.sc-duet-notification-drawer .duet-drawer-toggle.sc-duet-notification-drawer:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-drawer-toggle:hover*/.duet-drawer-toggle.sc-duet-notification-drawer:hover{color:#004d80}/*!@.duet-theme-turva .duet-drawer-toggle:hover*/.duet-theme-turva.sc-duet-notification-drawer .duet-drawer-toggle.sc-duet-notification-drawer:hover{color:#444445}/*!@.duet-drawer-toggle::after*/.duet-drawer-toggle.sc-duet-notification-drawer::after{display:none !important}@media (min-width: 62em){/*!@.duet-drawer-toggle::after*/.duet-drawer-toggle.sc-duet-notification-drawer::after{position:absolute;top:auto;bottom:0;left:0;display:block !important;width:100%;height:3px;content:\"\";background:#0077b3;transition:300ms ease;transform:translateY(3px)}/*!@.duet-theme-turva .duet-drawer-toggle::after*/.duet-theme-turva.sc-duet-notification-drawer .duet-drawer-toggle.sc-duet-notification-drawer::after{background:#c60c30}}/*!@.duet-drawer-toggle[aria-expanded=true], .duet-drawer-toggle[aria-expanded=true]:hover*/.duet-drawer-toggle[aria-expanded=true].sc-duet-notification-drawer,.duet-drawer-toggle[aria-expanded=true].sc-duet-notification-drawer:hover{color:#004d80;border-bottom:1px solid #f5f8fa;border-radius:0}/*!@.duet-theme-turva .duet-drawer-toggle[aria-expanded=true], .duet-theme-turva .duet-drawer-toggle[aria-expanded=true]:hover*/.duet-theme-turva.sc-duet-notification-drawer .duet-drawer-toggle[aria-expanded=true].sc-duet-notification-drawer,.duet-theme-turva.sc-duet-notification-drawer .duet-drawer-toggle[aria-expanded=true].sc-duet-notification-drawer:hover{color:#444445;border-color:#f5f5f7}@media (min-width: 62em){/*!@.duet-drawer-toggle[aria-expanded=true], .duet-drawer-toggle[aria-expanded=true]:hover*/.duet-drawer-toggle[aria-expanded=true].sc-duet-notification-drawer,.duet-drawer-toggle[aria-expanded=true].sc-duet-notification-drawer:hover{border:0}/*!@.duet-drawer-toggle[aria-expanded=true]::after, .duet-drawer-toggle[aria-expanded=true]:hover::after*/.duet-drawer-toggle[aria-expanded=true].sc-duet-notification-drawer::after,.duet-drawer-toggle[aria-expanded=true].sc-duet-notification-drawer:hover::after{left:0;width:100%;transform:translateY(0)}}/*!@.duet-drawer-icon*/.duet-drawer-icon.sc-duet-notification-drawer{position:relative;display:inline-flex;min-width:12px;margin-right:12px;font-size:0;line-height:normal;vertical-align:baseline}@media (min-width: 62em){/*!@.duet-drawer-icon*/.duet-drawer-icon.sc-duet-notification-drawer{margin-right:8px}}/*!@.duet-drawer-label*/.duet-drawer-label.sc-duet-notification-drawer{line-height:1}/*!@.duet-drawer-caret*/.duet-drawer-caret.sc-duet-notification-drawer{position:absolute;top:50%;right:20px;display:flex;width:10px;height:10px;margin-left:8px;line-height:normal;pointer-events:none;transition:300ms ease;transform:translateY(-50%);transform-origin:50% 50%}@media (min-width: 62em){/*!@.duet-drawer-caret*/.duet-drawer-caret.sc-duet-notification-drawer{right:16px;width:7px;height:7px}}/*!@.duet-drawer-caret duet-icon*/.duet-drawer-caret.sc-duet-notification-drawer duet-icon.sc-duet-notification-drawer{width:10px}/*!@.duet-drawer-toggle[aria-expanded=true] .duet-drawer-caret*/.duet-drawer-toggle[aria-expanded=true].sc-duet-notification-drawer .duet-drawer-caret.sc-duet-notification-drawer{transform:translateY(-50%) rotate(180deg)}/*!@.duet-drawer-badge*/.duet-drawer-badge.sc-duet-notification-drawer{position:absolute;top:0;right:0;display:inline-block;width:6px;height:6px;background:#f7b228;border-radius:50%;box-shadow:0 0 0 1px #c18b1f}/*!@.duet-theme-turva .duet-drawer-badge*/.duet-theme-turva.sc-duet-notification-drawer .duet-drawer-badge.sc-duet-notification-drawer{background:#faa40f}/*!@.duet-drawer-content*/.duet-drawer-content.sc-duet-notification-drawer{display:none;background-color:#f5f8fa;border-bottom:1px solid #e1e3e6}/*!@.duet-drawer-content:focus*/.duet-drawer-content.sc-duet-notification-drawer:focus{outline:0}/*!@.duet-theme-turva .duet-drawer-content*/.duet-theme-turva.sc-duet-notification-drawer .duet-drawer-content.sc-duet-notification-drawer{background-color:#f5f5f7;border-color:#e1e3e6}@media (min-width: 62em){/*!@.duet-drawer-content*/.duet-drawer-content.sc-duet-notification-drawer{position:absolute;top:100%;z-index:600;display:block;width:450px;max-height:420px;padding-left:0;overflow-y:auto;visibility:hidden;background-color:white;border:1px solid #e1e3e6;border-radius:4px;border-top-left-radius:0;border-top-right-radius:0;box-shadow:0 4px 10px 0 rgba(0, 41, 77, 0.15);opacity:0;transition:300ms ease;transform:scale(0.95) translateZ(0) translateY(-10px);transform-origin:50% 0;scrollbar-width:none}/*!@.duet-drawer-content::-webkit-scrollbar*/.duet-drawer-content.sc-duet-notification-drawer::-webkit-scrollbar{display:none}/*!@.duet-theme-turva .duet-drawer-content*/.duet-theme-turva.sc-duet-notification-drawer .duet-drawer-content.sc-duet-notification-drawer{background-color:white}/*!@.duet-drawer-content.duet-drawer-left*/.duet-drawer-content.duet-drawer-left.sc-duet-notification-drawer{right:0}/*!@.duet-drawer-content.duet-drawer-right*/.duet-drawer-content.duet-drawer-right.sc-duet-notification-drawer{left:0}}/*!@.duet-drawer-content.duet-drawer-open*/.duet-drawer-content.duet-drawer-open.sc-duet-notification-drawer{display:block}@media (min-width: 62em){/*!@.duet-drawer-content.duet-drawer-open*/.duet-drawer-content.duet-drawer-open.sc-duet-notification-drawer{visibility:visible;opacity:1;transform:scale(1) translateZ(0) translateY(0)}}";
+const duetNotificationDrawerCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-notification-drawer,*.sc-duet-notification-drawer::after,*.sc-duet-notification-drawer::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-notification-drawer-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%}/*!@.duet-drawer*/.duet-drawer.sc-duet-notification-drawer{position:relative}@media (min-width: 62em){/*!@.duet-drawer*/.duet-drawer.sc-duet-notification-drawer{display:inline-block}}/*!@.duet-drawer-toggle*/.duet-drawer-toggle.sc-duet-notification-drawer{position:relative;display:flex;align-items:center;width:100%;height:48px;padding:0 20px;overflow:hidden;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;line-height:48px;color:#00294d;text-align:left;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;background-color:white;border-bottom:1px solid #e1e3e6;border-radius:0;-webkit-appearance:none;appearance:none}@media (min-width: 62em){/*!@.duet-drawer-toggle*/.duet-drawer-toggle.sc-duet-notification-drawer{z-index:200;width:auto;max-width:200px;padding:0 30px 0 12px;overflow:hidden;font-size:0.875rem;line-height:4rem;border:0;border-radius:4px;transition:border 300ms ease}}/*!@.duet-theme-turva .duet-drawer-toggle*/.duet-theme-turva.sc-duet-notification-drawer .duet-drawer-toggle.sc-duet-notification-drawer{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a;background-color:white;border-color:#e4e4e6}/*!@.duet-drawer-toggle:active*/.duet-drawer-toggle.sc-duet-notification-drawer:active{opacity:0.75}/*!@.duet-drawer-toggle:focus*/.duet-drawer-toggle.sc-duet-notification-drawer:focus{outline:0}/*!@:host(.user-is-tabbing) .duet-drawer-toggle:focus*/.user-is-tabbing.sc-duet-notification-drawer-h .duet-drawer-toggle.sc-duet-notification-drawer:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@:host(.user-is-tabbing) .duet-theme-turva .duet-drawer-toggle:focus*/.user-is-tabbing.sc-duet-notification-drawer-h .duet-theme-turva.sc-duet-notification-drawer .duet-drawer-toggle.sc-duet-notification-drawer:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-drawer-toggle:hover*/.duet-drawer-toggle.sc-duet-notification-drawer:hover{color:#004d80}/*!@.duet-theme-turva .duet-drawer-toggle:hover*/.duet-theme-turva.sc-duet-notification-drawer .duet-drawer-toggle.sc-duet-notification-drawer:hover{color:#444445}/*!@.duet-drawer-toggle::after*/.duet-drawer-toggle.sc-duet-notification-drawer::after{display:none !important}@media (min-width: 62em){/*!@.duet-drawer-toggle::after*/.duet-drawer-toggle.sc-duet-notification-drawer::after{position:absolute;top:auto;bottom:0;left:0;display:block !important;width:100%;height:3px;content:\"\";background:#0077b3;transition:300ms ease;transform:translateY(3px)}/*!@.duet-theme-turva .duet-drawer-toggle::after*/.duet-theme-turva.sc-duet-notification-drawer .duet-drawer-toggle.sc-duet-notification-drawer::after{background:#c60c30}}/*!@.duet-drawer-toggle[aria-expanded=true], .duet-drawer-toggle[aria-expanded=true]:hover*/.duet-drawer-toggle[aria-expanded=true].sc-duet-notification-drawer,.duet-drawer-toggle[aria-expanded=true].sc-duet-notification-drawer:hover{color:#004d80;border-bottom:1px solid #f5f8fa;border-radius:0}/*!@.duet-theme-turva .duet-drawer-toggle[aria-expanded=true], .duet-theme-turva .duet-drawer-toggle[aria-expanded=true]:hover*/.duet-theme-turva.sc-duet-notification-drawer .duet-drawer-toggle[aria-expanded=true].sc-duet-notification-drawer,.duet-theme-turva.sc-duet-notification-drawer .duet-drawer-toggle[aria-expanded=true].sc-duet-notification-drawer:hover{color:#444445;border-color:#f5f5f7}@media (min-width: 62em){/*!@.duet-drawer-toggle[aria-expanded=true], .duet-drawer-toggle[aria-expanded=true]:hover*/.duet-drawer-toggle[aria-expanded=true].sc-duet-notification-drawer,.duet-drawer-toggle[aria-expanded=true].sc-duet-notification-drawer:hover{border:0}/*!@.duet-drawer-toggle[aria-expanded=true]::after, .duet-drawer-toggle[aria-expanded=true]:hover::after*/.duet-drawer-toggle[aria-expanded=true].sc-duet-notification-drawer::after,.duet-drawer-toggle[aria-expanded=true].sc-duet-notification-drawer:hover::after{left:0;width:100%;transform:translateY(0)}}/*!@.duet-drawer-icon*/.duet-drawer-icon.sc-duet-notification-drawer{position:relative;display:inline-flex;min-width:12px;margin-right:12px;font-size:0;line-height:normal;vertical-align:baseline}@media (min-width: 62em){/*!@.duet-drawer-icon*/.duet-drawer-icon.sc-duet-notification-drawer{margin-right:8px}}/*!@.duet-drawer-label*/.duet-drawer-label.sc-duet-notification-drawer{line-height:1}/*!@.duet-drawer-caret*/.duet-drawer-caret.sc-duet-notification-drawer{position:absolute;top:50%;right:20px;display:flex;width:10px;height:10px;margin-left:8px;line-height:normal;pointer-events:none;transition:300ms ease;transform:translateY(-50%);transform-origin:50% 50%}@media (min-width: 62em){/*!@.duet-drawer-caret*/.duet-drawer-caret.sc-duet-notification-drawer{right:16px;width:7px;height:7px}}/*!@.duet-drawer-caret duet-icon*/.duet-drawer-caret.sc-duet-notification-drawer duet-icon.sc-duet-notification-drawer{width:10px}/*!@.duet-drawer-toggle[aria-expanded=true] .duet-drawer-caret*/.duet-drawer-toggle[aria-expanded=true].sc-duet-notification-drawer .duet-drawer-caret.sc-duet-notification-drawer{transform:translateY(-50%) rotate(180deg)}/*!@.duet-drawer-badge*/.duet-drawer-badge.sc-duet-notification-drawer{position:absolute;top:0;right:0;display:inline-block;width:6px;height:6px;background:#f7b228;border-radius:50%;box-shadow:0 0 0 1px #c18b1f}/*!@.duet-theme-turva .duet-drawer-badge*/.duet-theme-turva.sc-duet-notification-drawer .duet-drawer-badge.sc-duet-notification-drawer{background:#faa40f}/*!@.duet-drawer-content*/.duet-drawer-content.sc-duet-notification-drawer{display:none;background-color:white;border-bottom:1px solid #e1e3e6}/*!@.duet-drawer-content:focus*/.duet-drawer-content.sc-duet-notification-drawer:focus{outline:0}/*!@.duet-theme-turva .duet-drawer-content*/.duet-theme-turva.sc-duet-notification-drawer .duet-drawer-content.sc-duet-notification-drawer{background-color:white;border-color:#e1e3e6}@media (min-width: 62em){/*!@.duet-drawer-content*/.duet-drawer-content.sc-duet-notification-drawer{position:absolute;top:100%;z-index:600;display:block;width:450px;max-height:420px;padding-left:0;overflow-y:auto;visibility:hidden;background-color:white;border:1px solid #e1e3e6;border-radius:4px;border-top-left-radius:0;border-top-right-radius:0;box-shadow:0 4px 10px 0 rgba(0, 41, 77, 0.15);opacity:0;transition:300ms ease;transform:scale(0.95) translateZ(0) translateY(-10px);transform-origin:50% 0;scrollbar-width:none}/*!@.duet-drawer-content::-webkit-scrollbar*/.duet-drawer-content.sc-duet-notification-drawer::-webkit-scrollbar{display:none}/*!@.duet-theme-turva .duet-drawer-content*/.duet-theme-turva.sc-duet-notification-drawer .duet-drawer-content.sc-duet-notification-drawer{background-color:white}/*!@.duet-drawer-content.duet-drawer-left*/.duet-drawer-content.duet-drawer-left.sc-duet-notification-drawer{right:0}/*!@.duet-drawer-content.duet-drawer-right*/.duet-drawer-content.duet-drawer-right.sc-duet-notification-drawer{left:0}}/*!@.duet-drawer-content.duet-drawer-open*/.duet-drawer-content.duet-drawer-open.sc-duet-notification-drawer{display:block}@media (min-width: 62em){/*!@.duet-drawer-content.duet-drawer-open*/.duet-drawer-content.duet-drawer-open.sc-duet-notification-drawer{visibility:visible;opacity:1;transform:scale(1) translateZ(0) translateY(0)}}";
 
 const ESC_KEY = 27;
 class DuetNotificationDrawer {
@@ -12105,13 +12866,16 @@ class DuetNumberInput {
   }; }
 }
 
-const duetParagraphCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-paragraph,*.sc-duet-paragraph::after,*.sc-duet-paragraph::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-paragraph-h{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%}/*!@.duet-paragraph*/.duet-paragraph.sc-duet-paragraph{margin-bottom:16px !important;display:block;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\";font-size:1rem;font-style:normal;font-weight:400;font-variant-numeric:tabular-nums;-webkit-hyphens:auto;hyphens:auto;line-height:1.5;color:#00294d}/*!@.duet-paragraph.duet-p-0*/.duet-paragraph.duet-p-0.sc-duet-paragraph{padding:0 !important}/*!@.duet-paragraph.duet-m-0*/.duet-paragraph.duet-m-0.sc-duet-paragraph{margin:0 !important}/*!@.duet-paragraph.duet-theme-turva*/.duet-paragraph.duet-theme-turva.sc-duet-paragraph{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}/*!@.duet-paragraph.duet-paragraph-small*/.duet-paragraph.duet-paragraph-small.sc-duet-paragraph{font-size:0.875rem}/*!@.duet-paragraph.duet-m-0*/.duet-paragraph.duet-m-0.sc-duet-paragraph{margin:0 !important}/*!@.duet-paragraph.intro*/.duet-paragraph.intro.sc-duet-paragraph{font-size:2.7vw;margin-bottom:28px !important;-webkit-hyphens:inherit;hyphens:inherit}@media (max-width: 37.037037037rem){/*!@.duet-paragraph.intro*/.duet-paragraph.intro.sc-duet-paragraph{font-size:1rem}}@media (min-width: 46.2962962963rem){/*!@.duet-paragraph.intro*/.duet-paragraph.intro.sc-duet-paragraph{font-size:1.25rem}}/*!@.duet-paragraph.intro.duet-m-0*/.duet-paragraph.intro.duet-m-0.sc-duet-paragraph{margin:0 !important}/*!@::slotted(a)*/.sc-duet-paragraph-s>a{font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-style:normal;font-weight:400;color:#0077b3;text-decoration:underline;transition:300ms ease}/*!@::slotted(a).duet-theme-turva*/.sc-duet-paragraph-s>a.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:#c60c30}/*!@::slotted(a):hover*/.sc-duet-paragraph-s>a:hover{color:#004d80;text-decoration:none}/*!@::slotted(a):hover.duet-theme-turva*/.sc-duet-paragraph-s>a:hover.duet-theme-turva{color:#940925}/*!@::slotted(a):active*/.sc-duet-paragraph-s>a:active{opacity:0.75;transition:none}";
+const duetParagraphCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-paragraph,*.sc-duet-paragraph::after,*.sc-duet-paragraph::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-paragraph-h{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%}/*!@.duet-paragraph*/.duet-paragraph.sc-duet-paragraph{margin-bottom:16px !important;display:block;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\";font-size:1rem;font-style:normal;font-weight:400;font-variant-numeric:tabular-nums;-webkit-hyphens:auto;hyphens:auto;line-height:1.5;color:#00294d}/*!@.duet-paragraph.duet-p-0*/.duet-paragraph.duet-p-0.sc-duet-paragraph{padding:0 !important}/*!@.duet-paragraph.duet-m-0*/.duet-paragraph.duet-m-0.sc-duet-paragraph{margin:0 !important}/*!@.duet-paragraph.duet-theme-turva*/.duet-paragraph.duet-theme-turva.sc-duet-paragraph{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}/*!@.duet-paragraph.duet-paragraph-small*/.duet-paragraph.duet-paragraph-small.sc-duet-paragraph{font-size:0.875rem}/*!@.duet-paragraph.duet-paragraph-semi-bold*/.duet-paragraph.duet-paragraph-semi-bold.sc-duet-paragraph{font-weight:600}/*!@.duet-paragraph.duet-paragraph-bold*/.duet-paragraph.duet-paragraph-bold.sc-duet-paragraph{font-weight:700}/*!@.duet-paragraph.duet-m-0*/.duet-paragraph.duet-m-0.sc-duet-paragraph{margin:0 !important}/*!@.duet-paragraph.intro*/.duet-paragraph.intro.sc-duet-paragraph{font-size:2.7vw;margin-bottom:28px !important;-webkit-hyphens:inherit;hyphens:inherit}@media (max-width: 37.037037037rem){/*!@.duet-paragraph.intro*/.duet-paragraph.intro.sc-duet-paragraph{font-size:1rem}}@media (min-width: 46.2962962963rem){/*!@.duet-paragraph.intro*/.duet-paragraph.intro.sc-duet-paragraph{font-size:1.25rem}}/*!@.duet-paragraph.intro.duet-m-0*/.duet-paragraph.intro.duet-m-0.sc-duet-paragraph{margin:0 !important}/*!@::slotted(a)*/.sc-duet-paragraph-s>a{font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-style:normal;font-weight:400;color:#0077b3;text-decoration:underline;transition:300ms ease}/*!@::slotted(a).duet-theme-turva*/.sc-duet-paragraph-s>a.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:#c60c30}/*!@::slotted(a):hover*/.sc-duet-paragraph-s>a:hover{color:#004d80;text-decoration:none}/*!@::slotted(a):hover.duet-theme-turva*/.sc-duet-paragraph-s>a:hover.duet-theme-turva{color:#940925}/*!@::slotted(a):active*/.sc-duet-paragraph-s>a:active{opacity:0.75;transition:none}";
 
+/**
+ * @part duet-paragraph - piercing selector for styling the paragraph
+ */
 class DuetParagraph {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     /**
-     * Theme of the card.
+     * Theme of the paragraph.
      */
     this.theme = "";
     /**
@@ -12122,6 +12886,10 @@ class DuetParagraph {
      * Controls the size of the paragraph.
      */
     this.size = "medium";
+    /**
+     * Controls the Font-Weight of the paragraph.
+     */
+    this.weight = undefined;
     /**
      * Style variation of the paragraph.
      */
@@ -12147,10 +12915,12 @@ class DuetParagraph {
     return (hAsync("p", { class: {
         "duet-paragraph": true,
         "duet-paragraph-small": this.size === "small",
+        "duet-paragraph-semi-bold": this.weight === "semi-bold",
+        "duet-paragraph-bold": this.weight === "bold",
         "duet-m-0": this.margin === "none",
         [this.variation]: true,
         "duet-theme-turva": this.theme === "turva",
-      }, style: { color } }, hAsync("slot", null)));
+      }, style: { color }, part: "duet-paragraph" }, hAsync("slot", null)));
   }
   get element() { return getElement(this); }
   static get style() { return duetParagraphCss; }
@@ -12161,6 +12931,7 @@ class DuetParagraph {
       "theme": [1025],
       "margin": [1],
       "size": [1],
+      "weight": [1],
       "variation": [1],
       "color": [1]
     },
@@ -12170,6 +12941,84 @@ class DuetParagraph {
   }; }
 }
 
+const duetProgressCss = "*,*::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;width:100%;height:inherit}.duet-progress{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;width:100%;min-height:1px;}.duet-progress .progress-bar{position:relative;display:block;width:100%;height:inherit;min-height:1px;background-color:#f3f9fc;border-radius:0;box-shadow:none}.duet-theme-turva .duet-progress .progress-bar{background-color:#fcf3f4}.duet-progress .progress-bar>span{display:block;height:inherit;text-indent:-9999px;background-color:#0077b3;border-radius:0}.duet-theme-turva .duet-progress .progress-bar>span{background-color:#c60c30}.duet-progress progress[value]{display:flex;width:100%;height:inherit;min-height:1px;color:#0077b3;border:0 none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.duet-theme-turva .duet-progress progress[value]{color:#c60c30}.duet-progress progress[value]::-webkit-progress-bar{background-color:#f3f9fc;border-radius:0}.duet-theme-turva .duet-progress progress[value]::-webkit-progress-bar{background-color:#fcf3f4}.duet-progress progress[value]::-webkit-progress-value{background-color:#0077b3;background-size:35px 20px, 100% 100%, 100% 100%;border-radius:0;-webkit-animation:animate-stripes 5s linear infinite;animation:animate-stripes 5s linear infinite}.duet-theme-turva .duet-progress progress[value]::-webkit-progress-value{background-color:#c60c30}.duet-progress progress[value] ::-moz-progress-bar{background-color:#f3f9fc}.duet-theme-turva .duet-progress progress[value] ::-moz-progress-bar{background-color:#fcf3f4}";
+
+class DuetProgress {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    /**
+     * Own Properties
+     */
+    this.progressId = createID("DuetProgress");
+    this.progressLabelId = createID("DuetProgressLabel");
+    /**
+     * Defaults for accessibleLabel
+     */
+    this.accessibleLabelUploadDefaults = {
+      fi: ["lähetys valmis", "lähetys käynnissä"],
+      sv: ["Uppladdningen är klar", "Uppladdning pågår"],
+      en: ["upload completed", "upload in progress"],
+    };
+    /**
+     * Adds accessible label for upload in progress and upload complete states
+     * @default {fi: ["lähetys valmis", "lähetys käynnissä"],sv: ["Uppladdningen är klar", "Uppladdning pågår"], en:  ["completed", "in progress"]}
+     */
+    this.accessibleLabelUpload = getLocaleString(this.accessibleLabelUploadDefaults);
+    /**
+     * Progress of the bar, a value from 0-100
+     */
+    this.progress = 0;
+    /**
+     * Height of progressbar
+     */
+    this.height = "10px";
+    /**
+     * Theme of the input.
+     */
+    this.theme = "";
+  }
+  /**
+   * Component lifecycle events.
+   */
+  componentWillLoad() {
+    inheritGlobalTheme(this);
+  }
+  /**
+   * render() function
+   * Always the last one in the class.
+   */
+  render() {
+    return (hAsync(Host, null, hAsync("div", { "aria-live": this.accessibleLabel ? "polite" : "off", "aria-hidden": this.accessibleLabel ? "false" : "true", "aria-atomic": "true", style: {
+        height: this.height,
+      }, id: this.progressId, class: {
+        "duet-progress": true,
+        "duet-progress-done": this.progress === 100,
+        "duet-progress-start": this.progress === 0,
+        "duet-progress-inprogress": this.progress < 99 && this.progress !== 0,
+        "duet-theme-turva": this.theme === "turva",
+      } }, hAsync("duet-visually-hidden", null, hAsync("label", { htmlFor: this.progressLabelId }, this.progress !== 0 && (hAsync("span", null, this.accessibleLabel, ", ", this.accessibleLabelUpload[this.progress < 99 ? 1 : 0])))), this.caption && (hAsync("div", { class: "duet-progress-caption" }, hAsync("span", null, this.caption))), hAsync("progress", { id: this.progressLabelId, "aria-describedby": this.accessibleDescribedBy, role: "progressbar", value: this.progress, max: "100", "aria-valuemin": "0", "aria-valuemax": "100" }, hAsync("div", { class: "progress-bar" }, hAsync("span", { style: { width: `${this.progress}%;` } }, "Progress: ", this.progress, "%"))))));
+  }
+  get element() { return getElement(this); }
+  static get style() { return duetProgressCss; }
+  static get cmpMeta() { return {
+    "$flags$": 0,
+    "$tagName$": "duet-progress",
+    "$members$": {
+      "accessibleDescribedBy": [1, "accessible-described-by"],
+      "accessibleLabel": [1, "accessible-label"],
+      "accessibleLabelUploadDefaults": [1, "accessible-label-upload-defaults"],
+      "accessibleLabelUpload": [1, "accessible-label-upload"],
+      "progress": [1538],
+      "caption": [1],
+      "height": [1],
+      "theme": [1025]
+    },
+    "$listeners$": undefined,
+    "$lazyBundleId$": "-",
+    "$attrsToReflect$": [["progress", "progress"]]
+  }; }
+}
+
 const duetRadioCss = "*.sc-duet-radio,*.sc-duet-radio::after,*.sc-duet-radio::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-radio-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:28px !important;margin-bottom:12px !important;display:inline-flex;width:100%;vertical-align:bottom;-webkit-tap-highlight-color:transparent}.sc-duet-radio-h:last-child,.sc-duet-radio-h:last-of-type{margin-right:0 !important}.vertical.sc-duet-radio-h{margin-right:0 !important}.horizontal.sc-duet-radio-h{margin-bottom:0 !important;width:auto}.horizontal.sc-duet-radio-h .duet-label.sc-duet-radio span.sc-duet-radio{max-width:100%}@media (min-width: 48em){.horizontal-responsive.sc-duet-radio-h{margin-right:28px !important;margin-bottom:0 !important;width:auto}.horizontal-responsive.sc-duet-radio-h:last-child,.horizontal-responsive.sc-duet-radio-h:last-of-type{margin-right:0 !important}.horizontal-responsive.sc-duet-radio-h .duet-label.sc-duet-radio span.sc-duet-radio{max-width:100%}}.duet-m-0.sc-duet-radio-h{margin:0 !important}.sc-duet-radio-h:last-child:not(:only-child){margin-right:0 !important;margin-bottom:0 !important}.duet-label.sc-duet-radio{position:relative;z-index:100;display:flex;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\";font-size:1rem;font-weight:400;line-height:1.5;color:#00294d;cursor:pointer;background:transparent}.duet-theme-turva.sc-duet-radio .duet-label.sc-duet-radio{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}.duet-label.sc-duet-radio span.sc-duet-radio{flex-grow:1;font-size:1rem}.duet-label-hidden.sc-duet-radio .duet-label.sc-duet-radio{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}.duet-radio-container.sc-duet-radio{position:relative;width:100%;height:100%}.duet-radio.sc-duet-radio{padding:14px !important;position:absolute;top:0;left:0;z-index:200;width:100%;height:100%;cursor:pointer;opacity:0}.duet-radio.sc-duet-radio+label.sc-duet-radio::before{z-index:100;flex-shrink:0;width:20px;height:20px;margin:2px 10px 1px 1px;content:\"\";background:white;border:1px solid #00294d;border-radius:50%}.duet-theme-turva.sc-duet-radio .duet-radio.sc-duet-radio+label.sc-duet-radio::before{border-color:#171c3a}.duet-radio.sc-duet-radio:focus+label.sc-duet-radio::before{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva.sc-duet-radio .duet-radio.sc-duet-radio:focus+label.sc-duet-radio::before{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-radio.sc-duet-radio:checked+label.sc-duet-radio::after{position:absolute;top:6px;left:5px;z-index:200;flex-shrink:0;width:12px;height:12px;content:\"\";background:#00294d;border-radius:50%}.duet-theme-turva.sc-duet-radio .duet-radio.sc-duet-radio:checked+label.sc-duet-radio::after{background:#171c3a}.duet-radio[disabled].sc-duet-radio{cursor:default}.duet-radio[disabled].sc-duet-radio+label.sc-duet-radio{color:#657787}.duet-theme-turva.sc-duet-radio .duet-radio[disabled].sc-duet-radio+label.sc-duet-radio{color:#747475}.duet-radio[disabled].sc-duet-radio+label.sc-duet-radio::before{border-color:#cfd2d4}.duet-theme-turva.sc-duet-radio .duet-radio[disabled].sc-duet-radio+label.sc-duet-radio::before{border-color:#cfcfd1}.duet-radio[disabled].sc-duet-radio:checked+label.sc-duet-radio::before{border:1px solid #657787}.duet-radio[disabled].sc-duet-radio:checked+label.sc-duet-radio::after{background:#657787}.duet-theme-turva.sc-duet-radio .duet-radio[disabled].sc-duet-radio:checked+label.sc-duet-radio::after{background:#747475;border-color:#747475}";
 
 class DuetRadio {
@@ -12658,7 +13507,7 @@ class DuetRangeSlider {
   }; }
 }
 
-const duetSelectCss = "@charset \"UTF-8\";*.sc-duet-select,*.sc-duet-select::after,*.sc-duet-select::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-select-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;display:inline-flex;width:100%;max-width:100%;vertical-align:bottom}.sc-duet-select-h:last-child,.sc-duet-select-h:last-of-type{margin-right:0 !important}@media (min-width: 36em){.sc-duet-select-h{width:calc(50% - 16px - 3px)}.duet-expand.sc-duet-select-h{width:100% !important}}.duet-m-0.sc-duet-select-h{margin:0 !important}duet-tooltip.sc-duet-select{position:absolute;top:12px;right:0}@media (min-width: 48em){duet-tooltip.sc-duet-select{position:relative;top:4px;right:auto}}.duet-select-container.sc-duet-select{position:relative;width:100%}.duet-select-wrapper.sc-duet-select{position:relative;width:100%;padding:15px 14px !important;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;line-height:1.25}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-select-wrapper.sc-duet-select::after{content:\"  \"}.duet-select-wrapper.sc-duet-select select.sc-duet-select{position:absolute;top:0;right:0;bottom:0;left:0;z-index:200;width:100%;height:100%;padding:0;margin:0;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;cursor:pointer;border:0;outline:none;opacity:0}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{border-color:#909599;box-shadow:0 0 0 1px #909599}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{border-color:#747475;box-shadow:0 0 0 1px #747475}.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{box-shadow:0 0 0 1px #e02a0d}.duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{border-color:#0077b3;outline:0;box-shadow:0 0 0 1px #0077b3;transition:none}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{border-color:#171c3a;box-shadow:0 0 0 1px #171c3a}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:#171c3a}.duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:#0077b3}.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{box-shadow:0 0 0 1px #e02a0d}.duet-select-wrapper.sc-duet-select select[disabled].sc-duet-select{cursor:default !important}.duet-select-wrapper.sc-duet-select select[disabled].sc-duet-select+.duet-select.sc-duet-select{color:#00294d !important;cursor:default !important;background:#f5f8fa !important;border-color:#f5f8fa !important;box-shadow:none !important;opacity:1 !important;-webkit-text-fill-color:#00294d !important}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select[disabled].sc-duet-select+.duet-select.sc-duet-select{color:#171c3a !important;background:#f5f5f7 !important;border-color:#f5f5f7 !important;-webkit-text-fill-color:#171c3a !important}.duet-select.sc-duet-select{position:absolute;top:0;right:0;bottom:0;left:0;z-index:100;display:block;width:100%;min-width:8rem;padding:12px 14px !important;padding-right:48px !important;overflow:hidden;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;line-height:1.5;color:#00294d;text-align:left;text-overflow:ellipsis;white-space:nowrap;background:white;border:1px solid #909599;border-radius:4px;transition:150ms ease}.has-error.sc-duet-select .duet-select.sc-duet-select{border-color:#de2362 !important}.has-error.sc-duet-select .duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:#de2362 !important}.duet-theme-turva.has-error.sc-duet-select .duet-select.sc-duet-select{border-color:#e02a0d !important}.duet-theme-turva.has-error.sc-duet-select .duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:#e02a0d !important}.duet-theme-turva.sc-duet-select .duet-select.sc-duet-select{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a;border-color:#747475}.duet-select.sc-duet-select svg.sc-duet-select{position:absolute;top:50%;right:16px;z-index:200;width:20px;height:20px;color:#00294d;pointer-events:none;transform:translateY(-50%)}.duet-theme-turva.sc-duet-select .duet-select.sc-duet-select svg.sc-duet-select{color:#171c3a}.duet-select-help.sc-duet-select{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:0.875rem;font-weight:400;line-height:1.25;color:#657787;border-radius:4px}.duet-select-help.sc-duet-select span.sc-duet-select{display:block;margin-top:8px}.duet-theme-turva.sc-duet-select .duet-select-help.sc-duet-select{color:#747475}.has-error.sc-duet-select .duet-select-help.sc-duet-select{color:#de2362}.duet-theme-turva.has-error.sc-duet-select .duet-select-help.sc-duet-select{color:#e02a0d}.duet-label-hidden.sc-duet-select duet-label.sc-duet-select{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}";
+const duetSelectCss = "@charset \"UTF-8\";*.sc-duet-select,*.sc-duet-select::after,*.sc-duet-select::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-select-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;display:inline-flex;width:100%;max-width:100%;vertical-align:bottom}.sc-duet-select-h:last-child,.sc-duet-select-h:last-of-type{margin-right:0 !important}@media (min-width: 36em){.sc-duet-select-h{width:calc(50% - 16px - 3px)}.duet-expand.sc-duet-select-h{width:100% !important}}.duet-m-0.sc-duet-select-h{margin:0 !important}duet-tooltip.sc-duet-select{position:absolute;top:12px;right:0}@media (min-width: 48em){duet-tooltip.sc-duet-select{position:relative;top:4px;right:auto}}.duet-select-placeholder.sc-duet-select{position:absolute;top:-9px;left:9px;z-index:200;display:block;width:auto;max-width:60%;padding:0 0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:white}.duet-select-container.sc-duet-select{position:relative;width:100%}.duet-select-wrapper.sc-duet-select{position:relative;width:100%;padding:15px 14px !important;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;line-height:1.25}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-select-wrapper.sc-duet-select::after{content:\"  \"}.duet-select-wrapper.sc-duet-select select.sc-duet-select{position:absolute;top:0;right:0;bottom:0;left:0;z-index:200;width:100%;height:100%;padding:0;margin:0;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;cursor:pointer;border:0;outline:none;opacity:0}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{border-color:#909599;box-shadow:0 0 0 1px #909599}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{border-color:#747475;box-shadow:0 0 0 1px #747475}.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:hover+.duet-select.sc-duet-select{box-shadow:0 0 0 1px #e02a0d}.duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{border-color:#0077b3;outline:0;box-shadow:0 0 0 1px #0077b3;transition:none}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{border-color:#171c3a;box-shadow:0 0 0 1px #171c3a}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:#171c3a}.duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:#0077b3}.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-select .duet-select-wrapper.sc-duet-select select.sc-duet-select:focus+.duet-select.sc-duet-select{box-shadow:0 0 0 1px #e02a0d}.duet-select-wrapper.sc-duet-select select[disabled].sc-duet-select{cursor:default !important}.duet-select-wrapper.sc-duet-select select[disabled].sc-duet-select+.duet-select.sc-duet-select{color:#00294d !important;cursor:default !important;background:#f5f8fa !important;border-color:#f5f8fa !important;box-shadow:none !important;opacity:1 !important;-webkit-text-fill-color:#00294d !important}.duet-theme-turva.sc-duet-select .duet-select-wrapper.sc-duet-select select[disabled].sc-duet-select+.duet-select.sc-duet-select{color:#171c3a !important;background:#f5f5f7 !important;border-color:#f5f5f7 !important;-webkit-text-fill-color:#171c3a !important}.duet-select.sc-duet-select{position:absolute;top:0;right:0;bottom:0;left:0;z-index:100;display:block;width:100%;min-width:8rem;padding:12px 14px !important;padding-right:48px !important;overflow:hidden;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;line-height:1.5;color:#00294d;text-align:left;text-overflow:ellipsis;white-space:nowrap;background:white;border:1px solid #909599;border-radius:4px;transition:150ms ease}.has-error.sc-duet-select .duet-select.sc-duet-select{border-color:#de2362 !important}.has-error.sc-duet-select .duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:#de2362 !important}.duet-theme-turva.has-error.sc-duet-select .duet-select.sc-duet-select{border-color:#e02a0d !important}.duet-theme-turva.has-error.sc-duet-select .duet-select.sc-duet-select .duet-select-icon.sc-duet-select{color:#e02a0d !important}.duet-theme-turva.sc-duet-select .duet-select.sc-duet-select{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a;border-color:#747475}.duet-select.sc-duet-select svg.sc-duet-select{position:absolute;top:50%;right:16px;z-index:200;width:20px;height:20px;color:#00294d;pointer-events:none;transform:translateY(-50%)}.duet-theme-turva.sc-duet-select .duet-select.sc-duet-select svg.sc-duet-select{color:#171c3a}.duet-select-help.sc-duet-select{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:0.875rem;font-weight:400;line-height:1.25;color:#657787;border-radius:4px}.duet-select-help.sc-duet-select span.sc-duet-select{display:block;margin-top:8px}.duet-theme-turva.sc-duet-select .duet-select-help.sc-duet-select{color:#747475}.has-error.sc-duet-select .duet-select-help.sc-duet-select{color:#de2362}.duet-theme-turva.has-error.sc-duet-select .duet-select-help.sc-duet-select{color:#e02a0d}.duet-label-hidden.sc-duet-select duet-label.sc-duet-select{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}";
 
 function isOptionGroup(item) {
   return "options" in item;
@@ -12780,14 +13629,14 @@ class DuetSelect {
     if (this.nativeSelect) {
       this.nativeSelect.value = this.value;
     }
-    this.isCaptionVisible = !!(this.caption || (this.placeholder && this.echoPlaceholder && this.value));
+    this.isCaptionVisible = !!this.caption;
   }
   /**
    * Component lifecycle events.
    */
   componentWillLoad() {
     inheritGlobalTheme(this);
-    this.isCaptionVisible = !!(this.caption || (this.placeholder && this.echoPlaceholder && this.value));
+    this.isCaptionVisible = !!this.caption;
     this.refresh();
   }
   /**
@@ -12830,7 +13679,7 @@ class DuetSelect {
         "duet-theme-turva": this.theme === "turva",
         "duet-input-top-caption-shown": this.isCaptionVisible,
         "has-error": !!this.error,
-      } }, hAsync("duet-label", { theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, id: this.labelId, for: identifier }, this.label), this.tooltip && (hAsync("duet-tooltip", { direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), this.caption && (hAsync("duet-caption", { id: this.topCaptionId, size: "medium" }, this.caption)), this.placeholder && this.echoPlaceholder && this.value && (hAsync("duet-caption", { id: this.topCaptionPlaceholderId, size: "small" }, this.placeholder)), hAsync("div", { class: "duet-select-wrapper" }, hAsync("select", { ref: select => (this.nativeSelect = select), disabled: this.disabled, name: this.name, id: identifier, role: this.role, "aria-labelledby": `${this.labelId} ${this.errorId}`, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.onChange, required: this.required, "aria-describedby": this.accessibleDescribedBy }, this.placeholder && (hAsync("option", { disabled: true, selected: true, value: "" }, this.placeholder)), !this.processedItems ? (hAsync("option", null, "Virhe valintoja ladattaessa. P\u00E4ivit\u00E4 sivu ja kokeile uusiksi.")) : (this.processedItems.map(item => {
+      } }, hAsync("duet-label", { theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, id: this.labelId, for: identifier }, this.label), this.tooltip && (hAsync("duet-tooltip", { direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), this.caption && (hAsync("duet-caption", { id: this.topCaptionId, size: "medium" }, this.caption)), hAsync("div", { class: "duet-select-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (hAsync("duet-caption", { id: this.topCaptionPlaceholderId, class: "duet-select-placeholder", size: "small" }, this.placeholder)), hAsync("select", { ref: select => (this.nativeSelect = select), disabled: this.disabled, name: this.name, id: identifier, role: this.role, "aria-labelledby": `${this.labelId} ${this.errorId}`, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.onChange, required: this.required, "aria-describedby": this.accessibleDescribedBy }, this.placeholder && (hAsync("option", { disabled: true, selected: true, value: "" }, this.placeholder)), !this.processedItems ? (hAsync("option", null, "Virhe valintoja ladattaessa. P\u00E4ivit\u00E4 sivu ja kokeile uusiksi.")) : (this.processedItems.map(item => {
       return isOptionGroup(item) ? this.renderOptionGroup(item) : this.renderOption(item);
     }))), hAsync("div", { class: "duet-select", "aria-hidden": "true" }, hAsync("span", { key: this.value }, this.getSelectedItemLabel()), hAsync("svg", { role: "img", class: "duet-select-icon", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { d: "m12 18.999c-.4 0-.776-.156-1.059-.438l-10.721-10.72c-.142-.142-.22-.33-.22-.531 0-.2.078-.389.22-.53.142-.142.33-.22.53-.22s.389.078.53.22l10.72 10.719 10.72-10.719c.142-.142.33-.22.53-.22s.389.078.53.22c.142.142.22.33.22.53s-.078.389-.22.53l-10.72 10.72c-.282.283-.659.439-1.06.439z" })))), hAsync("span", { class: "duet-select-help", id: this.errorId, "aria-live": "assertive", "aria-relevant": "additions removals" }, this.error && hAsync("span", null, this.error)))));
   }
@@ -13263,7 +14112,7 @@ class DuetTab {
   }; }
 }
 
-const duetTabGroupCss = "*.sc-duet-tab-group,*.sc-duet-tab-group::after,*.sc-duet-tab-group::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-tab-group-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;display:block;width:100%}.duet-tab-group-tabs.sc-duet-tab-group{margin-bottom:28px !important;display:block;width:100%;max-width:100%;padding-top:2px;list-style:none}.duet-tab-group-tabs.duet-m-0.sc-duet-tab-group{margin:0 !important}.duet-tab-group-tabs.duet-tab-group-hidden.sc-duet-tab-group{display:none}@media (min-width: 36em){.duet-tab-group-tabs.duet-tab-group-hidden.sc-duet-tab-group{display:block}}.duet-tab-variation-plain.sc-duet-tab-group .duet-tab-group-tabs.sc-duet-tab-group{border-bottom:1px solid #e1e3e6}.duet-theme-turva.duet-tab-variation-plain.sc-duet-tab-group .duet-tab-group-tabs.sc-duet-tab-group{border-bottom-color:#e4e4e6 !important}@media (min-width: 36em){duet-select.sc-duet-tab-group{display:none !important}}.duet-tab-button.sc-duet-tab-group{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:block;width:100%;padding:20px;margin-top:-2px;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.1;color:#00294d !important;text-align:left;text-decoration:none;cursor:pointer;background:white;border:2px solid #e1e3e6;border-style:solid;border-radius:0;transition:150ms ease}.duet-tab-button.duet-p-0.sc-duet-tab-group{padding:0 !important}.duet-tab-button.duet-m-0.sc-duet-tab-group{margin:0 !important}.duet-theme-turva.sc-duet-tab-group .duet-tab-button.sc-duet-tab-group{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a !important;border-color:#e4e4e6}.duet-tab-button.duet-p-0.sc-duet-tab-group{padding:0 !important}@media (min-width: 36em){.duet-tab-button.sc-duet-tab-group{display:inline-block;width:auto;margin-left:-2px;border-right:2px solid #e1e3e6;border-radius:0}}.duet-tab-button.sc-duet-tab-group:hover{z-index:200;border-color:#909599}.duet-theme-turva.sc-duet-tab-group .duet-tab-button.sc-duet-tab-group:hover{border-color:#747475 !important}.duet-tab-button.sc-duet-tab-group:active{opacity:0.75;transition:none}.duet-tab-button.selected.sc-duet-tab-group{z-index:201;color:white !important;background:#00294d;border-color:#00294d;outline:0;box-shadow:none !important}.duet-theme-turva.sc-duet-tab-group .duet-tab-button.selected.sc-duet-tab-group{color:white !important;background-color:#444445;border-color:#444445 !important}.duet-tab-button.sc-duet-tab-group:focus{z-index:200;outline:0}.user-is-tabbing.sc-duet-tab-group-h .duet-tab-button.sc-duet-tab-group:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3 !important}.user-is-tabbing.sc-duet-tab-group-h .duet-theme-turva.sc-duet-tab-group .duet-tab-button.sc-duet-tab-group:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a !important}.duet-tab-button.sc-duet-tab-group:first-child{border-top-left-radius:4px;border-top-right-radius:4px}@media (min-width: 36em){.duet-tab-button.sc-duet-tab-group:first-child{border-top-right-radius:0;border-bottom-left-radius:4px}}.duet-tab-button.sc-duet-tab-group:last-child{border-bottom-right-radius:4px;border-bottom-left-radius:4px}@media (min-width: 36em){.duet-tab-button.sc-duet-tab-group:last-child{border-radius:0;border-top-right-radius:4px;border-bottom-right-radius:4px}}.duet-tab-variation-plain.sc-duet-tab-group .duet-tab-button.sc-duet-tab-group{display:inline-block;width:auto;padding-right:0;padding-left:0;border:0;border-radius:0;transition:none}.duet-tab-variation-plain.sc-duet-tab-group .duet-tab-button.sc-duet-tab-group+.duet-tab-button.sc-duet-tab-group{margin-left:36px}.duet-tab-variation-plain.sc-duet-tab-group .duet-tab-button.selected.sc-duet-tab-group{color:#0077b3 !important;background:white;border-bottom:3px solid #0077b3}.duet-theme-turva.duet-tab-variation-plain.sc-duet-tab-group .duet-tab-button.selected.sc-duet-tab-group{color:#c60c30 !important;border-bottom-color:#c60c30 !important}.duet-tab-group-content.sc-duet-tab-group{position:relative;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\";font-size:1rem;font-weight:400;line-height:1.5;color:#00294d;text-align:left}.duet-theme-turva.sc-duet-tab-group .duet-tab-group-content.sc-duet-tab-group{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}";
+const duetTabGroupCss = "*.sc-duet-tab-group,*.sc-duet-tab-group::after,*.sc-duet-tab-group::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-tab-group-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;display:block;width:100%}.duet-tab-group-tabs.sc-duet-tab-group{margin-bottom:28px !important;display:block;width:100%;max-width:100%;padding-top:2px;list-style:none}.duet-tab-group-tabs.duet-m-0.sc-duet-tab-group{margin:0 !important}.duet-tab-group-tabs.duet-tab-group-hidden.sc-duet-tab-group{display:none}@media (min-width: 36em){.duet-tab-group-tabs.duet-tab-group-hidden.sc-duet-tab-group{display:block}}.duet-tab-variation-plain.sc-duet-tab-group .duet-tab-group-tabs.sc-duet-tab-group{border-bottom:1px solid #e1e3e6}.duet-theme-turva.duet-tab-variation-plain.sc-duet-tab-group .duet-tab-group-tabs.sc-duet-tab-group{border-bottom-color:#e4e4e6 !important}@media (min-width: 36em){duet-select.sc-duet-tab-group{display:none !important}}.duet-tab-button.sc-duet-tab-group{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:block;width:100%;padding:20px;margin-top:-2px;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.1;color:#00294d !important;text-align:left;text-decoration:none;cursor:pointer;background:white;border:2px solid #e1e3e6;border-style:solid;border-radius:0;transition:150ms ease}.duet-tab-button.duet-p-0.sc-duet-tab-group{padding:0 !important}.duet-tab-button.duet-m-0.sc-duet-tab-group{margin:0 !important}.duet-theme-turva.sc-duet-tab-group .duet-tab-button.sc-duet-tab-group{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a !important;border-color:#e4e4e6}.duet-tab-button.duet-p-0.sc-duet-tab-group{padding:0 !important}@media (min-width: 36em){.duet-tab-button.sc-duet-tab-group{display:inline-block;width:auto;margin-left:-2px;border-right:2px solid #e1e3e6;border-radius:0}}.duet-tab-button.sc-duet-tab-group:hover{z-index:200;border-color:#909599}.duet-theme-turva.sc-duet-tab-group .duet-tab-button.sc-duet-tab-group:hover{border-color:#747475 !important}.duet-tab-button.sc-duet-tab-group:active{opacity:0.75;transition:none}.duet-tab-button.selected.sc-duet-tab-group{z-index:201;color:white !important;background:#00294d;border-color:#00294d;outline:0;box-shadow:none !important}.duet-theme-turva.sc-duet-tab-group .duet-tab-button.selected.sc-duet-tab-group{color:white !important;background-color:#171c3a;border-color:#171c3a !important}.duet-tab-button.sc-duet-tab-group:focus{z-index:200;outline:0}.user-is-tabbing.sc-duet-tab-group-h .duet-tab-button.sc-duet-tab-group:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3 !important}.user-is-tabbing.sc-duet-tab-group-h .duet-theme-turva.sc-duet-tab-group .duet-tab-button.sc-duet-tab-group:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a !important}.duet-tab-button.sc-duet-tab-group:first-child{border-top-left-radius:4px;border-top-right-radius:4px}@media (min-width: 36em){.duet-tab-button.sc-duet-tab-group:first-child{border-top-right-radius:0;border-bottom-left-radius:4px}}.duet-tab-button.sc-duet-tab-group:last-child{border-bottom-right-radius:4px;border-bottom-left-radius:4px}@media (min-width: 36em){.duet-tab-button.sc-duet-tab-group:last-child{border-radius:0;border-top-right-radius:4px;border-bottom-right-radius:4px}}.duet-tab-variation-plain.sc-duet-tab-group .duet-tab-button.sc-duet-tab-group{display:inline-block;width:auto;padding-right:0;padding-left:0;border:0;border-radius:0;transition:none}.duet-tab-variation-plain.sc-duet-tab-group .duet-tab-button.sc-duet-tab-group+.duet-tab-button.sc-duet-tab-group{margin-left:36px}.duet-tab-variation-plain.sc-duet-tab-group .duet-tab-button.selected.sc-duet-tab-group{color:#0077b3 !important;background:white;border-bottom:3px solid #0077b3}.duet-theme-turva.duet-tab-variation-plain.sc-duet-tab-group .duet-tab-button.selected.sc-duet-tab-group{color:#c60c30 !important;border-bottom-color:#c60c30 !important}.duet-tab-group-content.sc-duet-tab-group{position:relative;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\";font-size:1rem;font-weight:400;line-height:1.5;color:#00294d;text-align:left}.duet-theme-turva.sc-duet-tab-group .duet-tab-group-content.sc-duet-tab-group{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}";
 
 class DuetTabGroup {
   constructor(hostRef) {
@@ -13463,7 +14312,7 @@ class DuetTabGroup {
   }; }
 }
 
-const duetTableCss = "duet-table{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-bottom:20px !important;display:block;font-variant-numeric:tabular-nums}duet-table table,duet-table thead,duet-table tbody,duet-table tfoot,duet-table th,duet-table td,duet-table tr{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}duet-table.duet-m-0{margin:0 !important}duet-table table{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\";font-size:1rem;text-align:left;border-spacing:0;border-collapse:separate}duet-table.duet-theme-turva table{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}duet-table td{-webkit-hyphens:auto;hyphens:auto;color:#00294d}duet-table.duet-theme-turva td{color:#171c3a}duet-table th{font-weight:600;line-height:1.25;color:#657787;text-align:left}duet-table.duet-theme-turva th{color:#747475}duet-table tbody th{font-weight:600;color:#00294d}duet-table.duet-theme-turva tbody th{color:#171c3a}.duet-table-flattened table,.duet-table-flattened thead,.duet-table-flattened tbody,.duet-table-flattened tfoot,.duet-table-flattened th,.duet-table-flattened td,.duet-table-flattened tr{display:block}.duet-table-flattened thead tr{position:absolute !important;top:0;width:1px !important;height:1px !important;padding:0 !important;overflow:hidden !important;clip:rect(1px, 1px, 1px, 1px) !important;border:0 !important}.duet-table-flattened td{line-height:1.25}.duet-table-flattened td:not(:last-child){margin-bottom:16px !important}.duet-table-flattened tbody td,.duet-table-flattened tbody th,.duet-table-flattened tfoot td{padding:0 !important;text-align:left !important}.duet-table-flattened tbody th{font-weight:600;line-height:1.25;color:#657787;text-align:left}.duet-table-flattened td[data-heading]::before{margin-bottom:4px !important;display:block;font-size:1rem;font-weight:600;color:#00294d;content:attr(data-heading)}.duet-table-flattened.duet-theme-turva td[data-heading]::before{color:#171c3a}.duet-table-sticky thead th{position:sticky;top:0;background:white}.duet-table-striped td,.duet-table-striped th{padding:20px !important}@media (max-width: 35.9375em){.duet-table-striped td,.duet-table-striped th{padding:20px 12px !important}}.duet-table-striped tbody th{background:white}.duet-table-striped.duet-table-sticky thead th{border-bottom:1px solid #e1e3e6}.duet-table-striped.duet-table-sticky.duet-theme-turva thead th{border-bottom-color:#e4e4e6}.duet-table-striped tbody:not(:first-of-type) th{padding-top:40px !important}.duet-table-striped tbody:only-of-type tr:nth-of-type(odd){background:rgba(0, 80, 128, 0.04)}.duet-table-striped.duet-theme-turva tbody:only-of-type tr:nth-of-type(odd){background:rgba(23, 28, 58, 0.04)}.duet-table-striped tbody:not(:only-of-type) tr:nth-of-type(even){background:rgba(0, 80, 128, 0.04)}.duet-table-striped.duet-theme-turva tbody:not(:only-of-type) tr:nth-of-type(even){background:rgba(23, 28, 58, 0.04)}.duet-table-striped tfoot td{border-top:1px solid #e1e3e6}.duet-table-striped.duet-theme-turva tfoot td{border-top-color:#e4e4e6}.duet-table-striped.duet-table-flattened tbody:not(:first-of-type) th{padding-top:20px !important}.duet-table-striped.duet-table-flattened tr{padding:20px !important}.duet-table-striped.duet-table-flattened tfoot td{border-top:0}.duet-table-striped.duet-table-flattened tfoot tr{border-top:1px solid #e1e3e6}.duet-table-striped.duet-table-flattened.duet-theme-turva tfoot tr{border-top-color:#e4e4e6}.duet-table-minimal th,.duet-table-plain th{padding:16px !important;border-bottom:1px solid #657787}.duet-table-minimal th:first-child,.duet-table-plain th:first-child{padding-left:0 !important}.duet-table-minimal th:last-child,.duet-table-plain th:last-child{padding-right:0 !important}.duet-theme-turva.duet-table-minimal th,.duet-theme-turva.duet-table-plain th{border-bottom-color:#444445}.duet-table-minimal tbody th,.duet-table-plain tbody th{padding-top:40px !important;border-bottom-color:#e1e3e6}.duet-theme-turva.duet-table-minimal tbody th,.duet-theme-turva.duet-table-plain tbody th{border-bottom-color:#e4e4e6}.duet-table-minimal td,.duet-table-plain td{padding:16px !important}.duet-table-minimal td:first-child,.duet-table-plain td:first-child{padding-left:0 !important}.duet-table-minimal td:last-child,.duet-table-plain td:last-child{padding-right:0 !important}.duet-table-minimal tbody td,.duet-table-plain tbody td{border-bottom:1px solid #e1e3e6}.duet-theme-turva.duet-table-minimal tbody td,.duet-theme-turva.duet-table-plain tbody td{border-bottom-color:#e4e4e6}.duet-table-flattened.duet-table-minimal tbody:first-of-type th,.duet-table-flattened.duet-table-plain tbody:first-of-type th{padding-top:0 !important}.duet-table-flattened.duet-table-minimal td,.duet-table-flattened.duet-table-plain td,.duet-table-flattened.duet-table-minimal tbody th,.duet-table-flattened.duet-table-plain tbody th{border-bottom:0}.duet-table-flattened.duet-table-minimal tr,.duet-table-flattened.duet-table-plain tr{padding:20px 0 !important}.duet-table-flattened.duet-table-minimal tbody th,.duet-table-flattened.duet-table-plain tbody th{padding-top:20px !important}.duet-table-flattened.duet-table-minimal tfoot td,.duet-table-flattened.duet-table-plain tfoot td{margin-bottom:4px !important}.duet-table-flattened.duet-table-minimal tbody:not(:only-of-type) tr:first-child,.duet-table-flattened.duet-table-plain tbody:not(:only-of-type) tr:first-child{border-bottom:0}.duet-table-plain.duet-table-flattened tbody tr{border-bottom:1px solid #e1e3e6}.duet-table-plain.duet-table-flattened.duet-theme-turva tbody tr{border-bottom-color:#e4e4e6}.duet-table-minimal tbody tr,.duet-table-minimal tbody tr td{vertical-align:top;border-bottom:0 none}.duet-table-minimal tbody tr:last-of-type,.duet-table-minimal tbody tr:last-of-type td{border-bottom:1px solid #e1e3e6}.duet-table-minimal.duet-table-flattened tbody tr,.duet-table-minimal.duet-table-flattened tbody tr td{border-bottom:0 none}.duet-table-minimal.duet-table-flattened tbody tr td[data-heading]::before{display:none}.duet-table-minimal.duet-table-flattened tfoot{border-top:1px solid #e1e3e6}.duet-table-minimal.duet-table-flattened.duet-theme-turva tfoot{border-top-color:#e4e4e6}.duet-table-scrollable{position:relative;width:100%;overflow-x:auto;background:linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, 0)), linear-gradient(-90deg, #fff 0%, rgba(255, 255, 255, 0)) 100% 0, radial-gradient(farthest-side at 0% 50%, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0)), radial-gradient(farthest-side at 100% 50%, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0)) 100% 0%;background-repeat:no-repeat;background-attachment:local, local, scroll, scroll;background-size:100px 100%, 100px 100%, 12px 100%, 12px 100%}.duet-table-selected-column{background:rgba(0, 119, 179, 0.08)}.duet-theme-turva .duet-table-selected-column{background:rgba(68, 68, 69, 0.08)}";
+const duetTableCss = "duet-table{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-bottom:20px !important;display:block;font-variant-numeric:tabular-nums}duet-table table,duet-table thead,duet-table tbody,duet-table tfoot,duet-table th,duet-table td,duet-table tr{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}duet-table.duet-m-0{margin:0 !important}duet-table table{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\";font-size:1rem;text-align:left;border-spacing:0;border-collapse:separate}duet-table.duet-theme-turva table{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}duet-table td{-webkit-hyphens:auto;hyphens:auto;color:#00294d}duet-table.duet-theme-turva td{color:#171c3a}duet-table th{font-weight:600;line-height:1.25;color:#657787;text-align:left}duet-table.duet-theme-turva th{color:#747475}duet-table tbody th{font-weight:600;color:#00294d}duet-table.duet-theme-turva tbody th{color:#171c3a}.duet-table-flattened table,.duet-table-flattened thead,.duet-table-flattened tbody,.duet-table-flattened tfoot,.duet-table-flattened th,.duet-table-flattened td,.duet-table-flattened tr{display:block}.duet-table-flattened thead tr{position:absolute !important;top:0;width:1px !important;height:1px !important;padding:0 !important;overflow:hidden !important;clip:rect(1px, 1px, 1px, 1px) !important;border:0 !important}.duet-table-flattened td{line-height:1.25}.duet-table-flattened td:not(:last-child){margin-bottom:16px !important}.duet-table-flattened tbody td,.duet-table-flattened tbody th,.duet-table-flattened tfoot td{padding:0 !important;text-align:left !important}.duet-table-flattened tbody th{font-weight:600;line-height:1.25;color:#657787;text-align:left}.duet-table-flattened td[data-heading]::before{margin-bottom:4px !important;display:block;font-size:1rem;font-weight:600;color:#00294d;content:attr(data-heading)}.duet-table-flattened.duet-theme-turva td[data-heading]::before{color:#171c3a}.duet-table-sticky thead th{position:sticky;top:0;background:white}.duet-table-striped td,.duet-table-striped th{padding:20px !important}@media (max-width: 35.9375em){.duet-table-striped td,.duet-table-striped th{padding:20px 12px !important}}.duet-table-striped tbody th{background:white}.duet-table-striped.duet-table-sticky thead th{border-bottom:1px solid #e1e3e6}.duet-table-striped.duet-table-sticky.duet-theme-turva thead th{border-bottom-color:#e4e4e6}.duet-table-striped tbody:not(:first-of-type) th{padding-top:40px !important}.duet-table-striped tbody:only-of-type tr:nth-of-type(odd){background:rgba(0, 80, 128, 0.04)}.duet-table-striped.duet-theme-turva tbody:only-of-type tr:nth-of-type(odd){background:rgba(23, 28, 58, 0.04)}.duet-table-striped tbody:not(:only-of-type) tr:nth-of-type(even){background:rgba(0, 80, 128, 0.04)}.duet-table-striped.duet-theme-turva tbody:not(:only-of-type) tr:nth-of-type(even){background:rgba(23, 28, 58, 0.04)}.duet-table-striped tfoot td{border-top:1px solid #e1e3e6}.duet-table-striped.duet-theme-turva tfoot td{border-top-color:#e4e4e6}.duet-table-striped.duet-table-flattened tbody:not(:first-of-type) th{padding-top:20px !important}.duet-table-striped.duet-table-flattened tr{padding:20px !important}.duet-table-striped.duet-table-flattened tfoot td{border-top:0}.duet-table-striped.duet-table-flattened tfoot tr{border-top:1px solid #e1e3e6}.duet-table-striped.duet-table-flattened.duet-theme-turva tfoot tr{border-top-color:#e4e4e6}.duet-table-fixed th,.duet-table-minimal th,.duet-table-plain th{padding:16px !important;border-bottom:1px solid #657787}.duet-table-fixed th:first-child,.duet-table-minimal th:first-child,.duet-table-plain th:first-child{padding-left:0 !important}.duet-table-fixed th:last-child,.duet-table-minimal th:last-child,.duet-table-plain th:last-child{padding-right:0 !important}.duet-theme-turva.duet-table-fixed th,.duet-theme-turva.duet-table-minimal th,.duet-theme-turva.duet-table-plain th{border-bottom-color:#444445}.duet-table-fixed tbody th,.duet-table-minimal tbody th,.duet-table-plain tbody th{padding-top:40px !important;border-bottom-color:#e1e3e6}.duet-theme-turva.duet-table-fixed tbody th,.duet-theme-turva.duet-table-minimal tbody th,.duet-theme-turva.duet-table-plain tbody th{border-bottom-color:#e4e4e6}.duet-table-fixed td,.duet-table-minimal td,.duet-table-plain td{padding:16px !important}.duet-table-fixed td:first-child,.duet-table-minimal td:first-child,.duet-table-plain td:first-child{padding-left:0 !important}.duet-table-fixed td:last-child,.duet-table-minimal td:last-child,.duet-table-plain td:last-child{padding-right:0 !important}.duet-table-fixed tbody td,.duet-table-minimal tbody td,.duet-table-plain tbody td{border-bottom:1px solid #e1e3e6}.duet-theme-turva.duet-table-fixed tbody td,.duet-theme-turva.duet-table-minimal tbody td,.duet-theme-turva.duet-table-plain tbody td{border-bottom-color:#e4e4e6}.duet-table-flattened.duet-table-fixed tbody:first-of-type th,.duet-table-flattened.duet-table-minimal tbody:first-of-type th,.duet-table-flattened.duet-table-plain tbody:first-of-type th{padding-top:0 !important}.duet-table-flattened.duet-table-fixed td,.duet-table-flattened.duet-table-minimal td,.duet-table-flattened.duet-table-plain td,.duet-table-flattened.duet-table-fixed tbody th,.duet-table-flattened.duet-table-minimal tbody th,.duet-table-flattened.duet-table-plain tbody th{border-bottom:0}.duet-table-flattened.duet-table-fixed tr,.duet-table-flattened.duet-table-minimal tr,.duet-table-flattened.duet-table-plain tr{padding:20px 0 !important}.duet-table-flattened.duet-table-fixed tbody th,.duet-table-flattened.duet-table-minimal tbody th,.duet-table-flattened.duet-table-plain tbody th{padding-top:20px !important}.duet-table-flattened.duet-table-fixed tfoot td,.duet-table-flattened.duet-table-minimal tfoot td,.duet-table-flattened.duet-table-plain tfoot td{margin-bottom:4px !important}.duet-table-flattened.duet-table-fixed tbody:not(:only-of-type) tr:first-child,.duet-table-flattened.duet-table-minimal tbody:not(:only-of-type) tr:first-child,.duet-table-flattened.duet-table-plain tbody:not(:only-of-type) tr:first-child{border-bottom:0}.duet-table-plain.duet-table-flattened tbody tr{border-bottom:1px solid #e1e3e6}.duet-table-plain.duet-table-flattened.duet-theme-turva tbody tr{border-bottom-color:#e4e4e6}.duet-table-minimal tbody tr,.duet-table-minimal tbody tr td{vertical-align:top;border-bottom:0 none}.duet-table-minimal tbody tr:last-of-type,.duet-table-minimal tbody tr:last-of-type td{border-bottom:1px solid #e1e3e6}.duet-table-minimal.duet-table-flattened tbody tr,.duet-table-minimal.duet-table-flattened tbody tr td{border-bottom:0 none}.duet-table-minimal.duet-table-flattened tbody tr td[data-heading]::before{display:none}.duet-table-minimal.duet-table-flattened tfoot{border-top:1px solid #e1e3e6}.duet-table-minimal.duet-table-flattened.duet-theme-turva tfoot{border-top-color:#e4e4e6}.duet-table-fixed table{table-layout:fixed}.duet-table-fixed tbody tr,.duet-table-fixed tbody tr td,.duet-table-fixed tbody tr td:first-child{padding:4px !important;vertical-align:text-bottom;border-bottom:0 none}.duet-table-fixed thead{display:none}.duet-table-fixed tbody tr,.duet-table-fixed tbody tr td{border-bottom:0 none}.duet-table-fixed:not(.duet-table-flattened) tfoot{border-top:1px solid #e1e3e6}.duet-table-fixed:not(.duet-table-flattened).duet-theme-turva tfoot{border-top-color:#e4e4e6}.duet-table-scrollable{position:relative;width:100%;overflow-x:auto;background:linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, 0)), linear-gradient(-90deg, #fff 0%, rgba(255, 255, 255, 0)) 100% 0, radial-gradient(farthest-side at 0% 50%, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0)), radial-gradient(farthest-side at 100% 50%, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0)) 100% 0%;background-repeat:no-repeat;background-attachment:local, local, scroll, scroll;background-size:100px 100%, 100px 100%, 12px 100%, 12px 100%}.duet-table-selected-column{background:rgba(0, 119, 179, 0.08)}.duet-theme-turva .duet-table-selected-column{background:rgba(68, 68, 69, 0.08)}";
 
 // remove wrapping speech marks.
 // media query tokens are wrapped in speech marks,
@@ -13591,7 +14440,7 @@ class DuetTable {
   }; }
 }
 
-const duetTextareaCss = "*.sc-duet-textarea,*.sc-duet-textarea::after,*.sc-duet-textarea::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-textarea-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;display:block;width:100%;max-width:100%;text-align:left}.sc-duet-textarea-h:last-child,.sc-duet-textarea-h:last-of-type{margin-right:0 !important}@media (min-width: 36em){.sc-duet-textarea-h{width:calc(50% - 16px - 3px)}.duet-expand.sc-duet-textarea-h{width:100% !important}}.duet-m-0.sc-duet-textarea-h{margin:0 !important}duet-tooltip.sc-duet-textarea{position:absolute;top:12px;right:0}@media (min-width: 48em){duet-tooltip.sc-duet-textarea{position:relative;top:4px;right:auto}}.duet-textarea-container.sc-duet-textarea{position:relative;width:100%;height:100%}.duet-textarea-container.sc-duet-textarea .duet-input-top-caption.sc-duet-textarea{display:none}.duet-textarea-container.duet-input-top-caption-shown.sc-duet-textarea .duet-input-top-caption.sc-duet-textarea{display:flex !important}.duet-textarea.sc-duet-textarea{padding:15px !important;position:relative;z-index:100;display:block;width:100%;min-width:8rem;min-height:160px;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;line-height:1.25;color:#00294d;resize:vertical;background:white;border:1px solid #909599;border-radius:4px;transition:150ms ease}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a;border-color:#747475}.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea{border-color:#de2362 !important}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea{border-color:#e02a0d !important}.duet-textarea.sc-duet-textarea::-webkit-input-placeholder{color:#657787;opacity:1 !important;transition:color 300ms ease}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea::-webkit-input-placeholder{color:#747475}.duet-textarea.sc-duet-textarea:focus::-webkit-input-placeholder{color:#cfd2d4}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus::-webkit-input-placeholder{color:#cfcfd1}.duet-textarea.sc-duet-textarea::-moz-placeholder{color:#657787;opacity:1 !important}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea::-moz-placeholder{color:#747475}.duet-textarea.sc-duet-textarea:focus::-moz-placeholder{color:#cfd2d4}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus::-moz-placeholder{color:#cfcfd1}.duet-textarea.sc-duet-textarea:-ms-input-placeholder{color:#657787}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:-ms-input-placeholder{color:#747475}.duet-textarea.sc-duet-textarea:focus:-ms-input-placeholder{color:#cfd2d4}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus:-ms-input-placeholder{color:#cfcfd1}.duet-textarea[disabled].sc-duet-textarea{color:#657787 !important;cursor:default !important;background:#f5f8fa !important;border-color:#f5f8fa !important}.duet-theme-turva.sc-duet-textarea .duet-textarea[disabled].sc-duet-textarea{color:#747475 !important;background:#f5f5f7 !important;border-color:#f5f5f7 !important}.duet-textarea.sc-duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #909599}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #747475}.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #e02a0d}.duet-textarea.sc-duet-textarea:focus{border-color:#0077b3;outline:0;box-shadow:0 0 0 1px #0077b3;transition:none}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus{border-color:#171c3a;box-shadow:0 0 0 1px #171c3a}.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus{box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus{box-shadow:0 0 0 1px #e02a0d}.duet-textarea.sc-duet-textarea:not(:focus):not(:hover):invalid{box-shadow:none}.duet-textarea-help.sc-duet-textarea{font-size:0.875rem;line-height:1.25}.duet-textarea-help.sc-duet-textarea span.sc-duet-textarea{display:block;margin-top:8px}.has-error.sc-duet-textarea .duet-textarea-help.sc-duet-textarea{color:#de2362}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea-help.sc-duet-textarea{color:#e02a0d}.duet-label-hidden.sc-duet-textarea duet-label.sc-duet-textarea{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}.duet-character-count.sc-duet-textarea{display:block;margin:8px 0 0 auto}";
+const duetTextareaCss = "*.sc-duet-textarea,*.sc-duet-textarea::after,*.sc-duet-textarea::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-textarea-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;display:block;width:100%;max-width:100%;text-align:left}.sc-duet-textarea-h:last-child,.sc-duet-textarea-h:last-of-type{margin-right:0 !important}@media (min-width: 36em){.sc-duet-textarea-h{width:calc(50% - 16px - 3px)}.duet-expand.sc-duet-textarea-h{width:100% !important}}.duet-m-0.sc-duet-textarea-h{margin:0 !important}duet-tooltip.sc-duet-textarea{position:absolute;top:12px;right:0}@media (min-width: 48em){duet-tooltip.sc-duet-textarea{position:relative;top:4px;right:auto}}.duet-textarea-container.sc-duet-textarea{position:relative;width:100%;height:100%}.duet-textarea-container.sc-duet-textarea .duet-input-top-caption.sc-duet-textarea{display:none}.duet-textarea-container.duet-input-top-caption-shown.sc-duet-textarea .duet-input-top-caption.sc-duet-textarea{display:flex !important}.duet-textarea-wrapper.sc-duet-textarea{position:relative}.duet-textarea-placeholder.sc-duet-textarea{position:absolute;top:-9px;left:9px;z-index:200;display:block;width:auto;max-width:60%;padding:0 0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:white}.duet-textarea.sc-duet-textarea{padding:15px !important;position:relative;z-index:100;display:block;width:100%;min-width:8rem;min-height:160px;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;line-height:1.25;color:#00294d;resize:vertical;background:white;border:1px solid #909599;border-radius:4px;transition:150ms ease}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a;border-color:#747475}.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea{border-color:#de2362 !important}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea{border-color:#e02a0d !important}.duet-textarea.sc-duet-textarea::-webkit-input-placeholder{color:#657787;opacity:1 !important;transition:color 300ms ease}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea::-webkit-input-placeholder{color:#747475}.duet-textarea.sc-duet-textarea:focus::-webkit-input-placeholder{color:#cfd2d4}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus::-webkit-input-placeholder{color:#cfcfd1}.duet-textarea.sc-duet-textarea::-moz-placeholder{color:#657787;opacity:1 !important}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea::-moz-placeholder{color:#747475}.duet-textarea.sc-duet-textarea:focus::-moz-placeholder{color:#cfd2d4}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus::-moz-placeholder{color:#cfcfd1}.duet-textarea.sc-duet-textarea:-ms-input-placeholder{color:#657787}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:-ms-input-placeholder{color:#747475}.duet-textarea.sc-duet-textarea:focus:-ms-input-placeholder{color:#cfd2d4}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus:-ms-input-placeholder{color:#cfcfd1}.duet-textarea[disabled].sc-duet-textarea{color:#657787 !important;cursor:default !important;background:#f5f8fa !important;border-color:#f5f8fa !important}.duet-theme-turva.sc-duet-textarea .duet-textarea[disabled].sc-duet-textarea{color:#747475 !important;background:#f5f5f7 !important;border-color:#f5f5f7 !important}.duet-textarea.sc-duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #909599}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #747475}.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #e02a0d}.duet-textarea.sc-duet-textarea:focus{border-color:#0077b3;outline:0;box-shadow:0 0 0 1px #0077b3;transition:none}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus{border-color:#171c3a;box-shadow:0 0 0 1px #171c3a}.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus{box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus{box-shadow:0 0 0 1px #e02a0d}.duet-textarea.sc-duet-textarea:not(:focus):not(:hover):invalid{box-shadow:none}.duet-textarea-help.sc-duet-textarea{font-size:0.875rem;line-height:1.25}.duet-textarea-help.sc-duet-textarea span.sc-duet-textarea{display:block;margin-top:8px}.has-error.sc-duet-textarea .duet-textarea-help.sc-duet-textarea{color:#de2362}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea-help.sc-duet-textarea{color:#e02a0d}.duet-label-hidden.sc-duet-textarea duet-label.sc-duet-textarea{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}.duet-character-count.sc-duet-textarea{display:block;margin:8px 0 0 auto}";
 
 const CharacterCount = ({ value, maxlength, label, theme }) => {
   if (maxlength == null) {
@@ -13692,7 +14541,7 @@ class DuetTextarea {
         cleanValue(this.nativeInput, this.disallowPatternRegex);
       }
       this.value = this.nativeInput.value;
-      this.isCaptionVisible = !!(this.caption || (this.placeholder && this.echoPlaceholder && this.value));
+      this.isCaptionVisible = !!this.caption;
       this.duetInput.emit({
         originalEvent: ev,
         value: this.value,
@@ -13731,7 +14580,7 @@ class DuetTextarea {
   componentWillLoad() {
     inheritGlobalTheme(this);
     this.disallowedPatternChange();
-    this.isCaptionVisible = !!(this.caption || (this.placeholder && this.echoPlaceholder && this.value));
+    this.isCaptionVisible = !!this.caption;
     if (this.counter && this.maxlength == null) {
       console.warn("[DUET WARNING]: counter will only take effect if maxlength is set");
     }
@@ -13765,7 +14614,7 @@ class DuetTextarea {
         "duet-label-hidden": this.labelHidden,
         "duet-input-top-caption-shown": this.isCaptionVisible,
         "has-error": !!this.error,
-      } }, hAsync("duet-label", { theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, margin: this.isCaptionVisible ? "small" : "auto", id: this.labelId, for: identifier }, this.label), this.tooltip && (hAsync("duet-tooltip", { direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), this.caption && (hAsync("duet-caption", { id: this.topCaptionId, size: "medium" }, this.caption)), this.placeholder && this.echoPlaceholder && this.value && (hAsync("duet-caption", { id: this.topCaptionPlaceholderId, size: "small" }, this.placeholder)), hAsync("textarea", { onInput: this.handleInput, onChange: this.handleChange, onBlur: this.handleBlur, onFocus: this.handleFocus, ref: input => (this.nativeInput = input), class: { "duet-textarea": true, disabled: this.disabled }, value: this.value, disabled: this.disabled, "aria-labelledby": `${this.labelId} ${this.errorId}`, "aria-controls": this.accessibleControls, "aria-autocomplete": this.accessibleAutocomplete, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": `${this.isCaptionVisible ? this.topCaptionId : ""} ${this.accessibleDescribedBy}`, placeholder: this.placeholder, spellcheck: "false", required: this.required, minlength: this.minlength, maxlength: this.maxlength, role: this.role, name: this.name, id: identifier }), hAsync("duet-grid", { alignment: "stretch" }, hAsync("duet-grid-item", { margin: "none", fill: true }, hAsync("div", { class: "duet-textarea-help", id: this.errorId, "aria-live": "assertive", "aria-relevant": "additions removals" }, this.error && hAsync("span", null, this.error))), hAsync("duet-grid-item", { margin: "none", class: "duet-character-count-caption" }, this.counter && (hAsync(CharacterCount, { theme: this.theme, value: this.value, maxlength: this.maxlength, label: this.counterLabel })))))));
+      } }, hAsync("duet-label", { theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, margin: this.isCaptionVisible ? "small" : "auto", id: this.labelId, for: identifier }, this.label), this.tooltip && (hAsync("duet-tooltip", { direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), this.caption && (hAsync("duet-caption", { id: this.topCaptionId, size: "medium" }, this.caption)), hAsync("div", { class: "duet-textarea-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (hAsync("duet-caption", { id: this.topCaptionPlaceholderId, class: "duet-textarea-placeholder", size: "small" }, this.placeholder)), hAsync("textarea", { onInput: this.handleInput, onChange: this.handleChange, onBlur: this.handleBlur, onFocus: this.handleFocus, ref: input => (this.nativeInput = input), class: { "duet-textarea": true, disabled: this.disabled }, value: this.value, disabled: this.disabled, "aria-labelledby": `${this.labelId} ${this.errorId}`, "aria-controls": this.accessibleControls, "aria-autocomplete": this.accessibleAutocomplete, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": `${this.isCaptionVisible ? this.topCaptionId : ""} ${this.accessibleDescribedBy}`, placeholder: this.placeholder, spellcheck: "false", required: this.required, minlength: this.minlength, maxlength: this.maxlength, role: this.role, name: this.name, id: identifier })), hAsync("duet-grid", { alignment: "stretch" }, hAsync("duet-grid-item", { margin: "none", fill: true }, hAsync("div", { class: "duet-textarea-help", id: this.errorId, "aria-live": "assertive", "aria-relevant": "additions removals" }, this.error && hAsync("span", null, this.error))), hAsync("duet-grid-item", { margin: "none", class: "duet-character-count-caption" }, this.counter && (hAsync(CharacterCount, { theme: this.theme, value: this.value, maxlength: this.maxlength, label: this.counterLabel })))))));
   }
   get element() { return getElement(this); }
   static get watchers() { return {
@@ -14317,6 +15166,1274 @@ class DuetTray {
   }; }
 }
 
+var errorCodes = [
+	{
+		type: "default",
+		system_message: "unknown error",
+		message: {
+			fi: "Tapahtui tuntematon virhe, ole hyvä ja yritä uudelleen.",
+			sv: "Ett okänt fel uppstod, försök igen.",
+			en: "An unknown error occured, please try again."
+		}
+	},
+	{
+		type: "400",
+		system_message: "Bad Request: The server could not understand the request due to invalid syntax.",
+		message: {
+			fi: "Tiedostoa ei hyväksytty.",
+			sv: "Servern avvisade din fil.",
+			en: "The server rejected your file."
+		}
+	},
+	{
+		type: "401",
+		system_message: "Not Authenticated: The client must authenticate itself to get the requested response...",
+		message: {
+			fi: "Vain kirjautunut käyttäjä voi lähettää tiedostoja.",
+			sv: "Du måste vara inloggad för att ladda upp filer.",
+			en: "You need to be logged in to upload files."
+		}
+	},
+	{
+		type: "403",
+		system_message: "No Access: The client does not have access rights to the content.",
+		message: {
+			fi: "Ei oikeuksia lähettää tiedostoja.",
+			sv: "Du har inte rätt åtkomsträttigheter för att ladda upp filer.",
+			en: "You do not have the correct access rights to upload files."
+		}
+	},
+	{
+		type: "413",
+		system_message: "Payload too large",
+		message: {
+			fi: "Tiedosto oli liian vastaanotettavaksi.",
+			sv: "Filen var för stor för servern att hantera.",
+			en: "The file was to large for the server to handle."
+		}
+	},
+	{
+		type: "415",
+		system_message: "Unsupported media type",
+		message: {
+			fi: "Tiedoston tyyppi oli väärä.",
+			sv: "Servern avvisade filen eftersom den hade fel typ.",
+			en: "The server rejected the file because it had the wrong type."
+		}
+	},
+	{
+		type: "429",
+		system_message: "Too many request from same address",
+		message: {
+			fi: "Liian monta yritystä, ole hyvä ja yritä myöhemmin uudelleen.",
+			sv: "Servern har fått många förfrågningar från dig, försök igen senare.",
+			en: "The server has received to many request from you, please try again later."
+		}
+	},
+	{
+		type: "500",
+		system_message: "Internal Server Error",
+		message: {
+			fi: "Palvelin ilmoitti tuntemattomasta virheestä ja lataus epäonnistui.",
+			sv: "Servern rapporterade ett okänt fel och uppladdningen misslyckades.",
+			en: "The server reported an unknown error and the upload failed."
+		}
+	},
+	{
+		type: "duet-upload-100",
+		system_message: "File extension not allowed",
+		message: {
+			fi: "Tiedoston tyyppi ei ole sallittu.",
+			sv: "Du kan inte ladda upp filer av den type.",
+			en: "You cannot upload files with that extension."
+		}
+	},
+	{
+		type: "duet-upload-001",
+		system_message: "File transfer failed",
+		message: {
+			fi: "Tiedoston lähetys keskeytyi, ole hyvä ja yritä uudelleen.",
+			sv: "Din anslutning till servern avbröts, försök igen.",
+			en: "Your connection to the server was interrupted, try again."
+		}
+	},
+	{
+		type: "duet-upload-101",
+		system_message: "File mimetype not allowed",
+		message: {
+			fi: "Tiedoston tyyppi ei ole sallittu.",
+			sv: "Du kan inte ladda upp filer av den typ.",
+			en: "You cannot upload files of that type."
+		}
+	},
+	{
+		type: "duet-upload-201",
+		system_message: "File is too large",
+		message: {
+			fi: "Tiedosto on liian iso.",
+			sv: "Filen är större än tillåtet.",
+			en: "The file is larger than permitted."
+		}
+	},
+	{
+		type: "duet-upload-202",
+		system_message: "The combined size of all files is too large",
+		message: {
+			fi: "Tiedostojen yhteenlaskettu koko on liian iso.",
+			sv: "Du har nått den maximala kombinerade filstorleken.",
+			en: "You have reached the maximum combined filesize."
+		}
+	},
+	{
+		type: "duet-upload-301",
+		system_message: "The maximum file limit has been reached",
+		message: {
+			fi: "Liitteiden maksimimäärä saavutettu.",
+			sv: "Maximalt antal bilagor har uppnåtts.",
+			en: "Maximum number of attachments reached."
+		}
+	}
+];
+
+const getError = (code) => {
+  let error = {
+    type: undefined,
+    system_message: undefined,
+    message: undefined,
+  };
+  error = errorCodes.filter(errorItem => {
+    // the == is intentional we may be comparing numbers to strings - and that is ok here
+    return errorItem.type == code;
+  })[0];
+  if (!error) {
+    error = errorCodes.filter(errorItem => {
+      return errorItem.type === "default";
+    })[0];
+  }
+  return error;
+};
+const getI18nError = (errorCode) => {
+  const errorFromJson = getError(errorCode);
+  const i18String = getLocaleString(errorFromJson.message);
+  if (i18String === "" || !i18String) {
+    return errorFromJson.system_message;
+  }
+  else {
+    return i18String;
+  }
+};
+
+const ErrorItem = ({ data }) => {
+  const { item, error } = data;
+  const { name } = item;
+  const { type } = error;
+  return (hAsync("span", { class: "duet-upload-item-error", role: "status" },
+    hAsync("duet-paragraph", { class: "duet-upload-item-name", color: "danger", margin: "none", weight: "semi-bold" },
+      hAsync("duet-icon", { margin: "none", size: "xx-small", name: "messaging-attachment" }),
+      " ",
+      name),
+    hAsync("duet-paragraph", { class: "duet-upload-item-error-label", size: "small", margin: "none", color: "danger" }, getI18nError(type))));
+};
+
+const ProgressItem = ({ progress, name }) => (hAsync("span", null,
+  hAsync("duet-paragraph", { color: "secondary", margin: "none", size: "small" }, name),
+  hAsync("duet-spacer", { size: "xx-small" }),
+  hAsync("duet-progress", { progress: Math.ceil(progress), "aria-hidden": true })));
+
+const formatBytes = (bytes, decimals = 2) => {
+  if (bytes === 0) {
+    return "0 Bytes";
+  }
+  const k = 1024;
+  const dm = decimals < 0 ? 0 : decimals;
+  const sizes = ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
+  const i = Math.floor(Math.log(bytes) / Math.log(k));
+  return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + " " + sizes[i];
+};
+
+const SuccessItem = ({ data, showLinks }) => {
+  const { item, size, uploaded, url, meta } = data;
+  const { name } = item;
+  const ContentName = (hAsync("span", { class: "duet-upload-item-name" },
+    hAsync("duet-icon", { margin: "none", size: "xx-small", name: "messaging-attachment" }),
+    hAsync("duet-spacer", { size: "xx-small", direction: "horizontal" }),
+    name));
+  const SizeText = (hAsync("span", { class: "duet-upload-item-size", style: { fontSize: "14px", fontWeight: "400" } },
+    "(",
+    formatBytes(size),
+    ")"));
+  const FilenameLine = uploaded && url && showLinks ? (hAsync("duet-paragraph", { color: "secondary", margin: "none", weight: "semi-bold" },
+    hAsync("duet-link", { url: url, external: true }, ContentName),
+    hAsync("duet-spacer", { size: "xx-small", direction: "horizontal" }),
+    SizeText)) : (hAsync("duet-paragraph", { color: "secondary", margin: "none", weight: "semi-bold" },
+    ContentName,
+    hAsync("duet-spacer", { size: "xx-small", direction: "horizontal" }),
+    SizeText));
+  const Badges = meta && meta.badges ? (hAsync("span", null,
+    hAsync("duet-spacer", { size: "xx-small" }),
+    meta.badges.map(badgeText => (hAsync("duet-badge", { color: "primary" }, badgeText))))) : undefined;
+  return (hAsync("span", { class: "duet-upload-item-success" },
+    hAsync("div", null, FilenameLine),
+    Badges));
+};
+
+const validateFileExtension = (name, allowedExtensions) => {
+  if (!allowedExtensions) {
+    return true;
+  }
+  const ext = name.split(".");
+  const validExtension = allowedExtensions.split(",");
+  const extension = ext[ext.length - 1];
+  return validExtension.includes(extension);
+};
+const validateFileMime = (type, allowedMimetypes) => {
+  if (!allowedMimetypes || !type) {
+    return true;
+  }
+  const validMimeTypes = allowedMimetypes.split(",");
+  let valid = false;
+  validMimeTypes.forEach(mimeType => {
+    const allowedTypes = mimeType.split("/");
+    const fileType = type.split("/");
+    if (allowedTypes[0] === fileType[0] && (allowedTypes[1] === fileType[1] || allowedTypes[1] === "*")) {
+      valid = true;
+    }
+  });
+  return valid;
+};
+const validateFileSize = (size, maxBytes) => {
+  if (!maxBytes || !size) {
+    return true;
+  }
+  return maxBytes >= size;
+};
+const validateFile = (item, validators) => {
+  const { allowedMimetypes, allowedExtensions, maxBytes } = validators;
+  let valid = false;
+  let errorMessage = getError("default");
+  if (item) {
+    const { name, type, size } = item;
+    const mime = validateFileMime(type, allowedMimetypes);
+    const ext = validateFileExtension(name, allowedExtensions);
+    const bytes = validateFileSize(size, maxBytes);
+    if (!mime) {
+      errorMessage = getError("duet-upload-101");
+    }
+    if (!ext) {
+      errorMessage = getError("duet-upload-100");
+    }
+    if (!bytes) {
+      errorMessage = getError("duet-upload-201");
+    }
+    valid = mime && ext && bytes;
+  }
+  else {
+    valid = false;
+  }
+  return {
+    valid,
+    errorMessage: valid ? undefined : getLocaleString(errorMessage.message),
+    errorSystem: valid ? undefined : errorMessage.system_message,
+    errorType: valid ? undefined : errorMessage.type,
+  };
+};
+const validateTotalSizeIsAboveMax = (filelist, maxTotalBytes) => {
+  let total = 0;
+  if (maxTotalBytes) {
+    filelist.forEach(item => {
+      if (item.valid && item.size) {
+        total += item.size;
+      }
+    });
+    if (total < maxTotalBytes) {
+      return true;
+    }
+  }
+  return false;
+};
+const validateTotalAmountIsAboveMax = (filelist, maxFiles) => {
+  let total = 0;
+  if (maxFiles) {
+    filelist.forEach(item => {
+      if (item.valid) {
+        total++;
+      }
+    });
+    if (total > maxFiles) {
+      return true;
+    }
+  }
+  return false;
+};
+
+const makeXhrRequest = ({ payload, options, onFailure, onSuccess, onProgress }) => {
+  const { type = "POST", xhr, uri, argument = null, headers = null } = options;
+  xhr.open(type, `${uri}${argument || ""}`, true);
+  const { data, name } = payload;
+  // headers must be added after open
+  if (headers) {
+    Object.keys(headers).forEach(key => {
+      xhr.setRequestHeader(key, headers[key]);
+    });
+  }
+  if (type === "POST") {
+    xhr.onreadystatechange = () => {
+      // Call a function when the state changes.
+      if (xhr.readyState === XMLHttpRequest.DONE && xhr.status >= 200 && xhr.status < 300) {
+        // Request finished without errors
+        onSuccess(xhr, name, xhr.status);
+      }
+      if (xhr.readyState === XMLHttpRequest.DONE && xhr.status >= 300 && xhr.status < 999) {
+        // Request finished with errors
+        onFailure(xhr, name, xhr.status);
+      }
+    };
+    onProgress(name);
+  }
+  xhr.send(data);
+  return xhr;
+};
+
+const duetUploadCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-upload,*.sc-duet-upload::after,*.sc-duet-upload::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-upload-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@::slotted([slot=header])*/.sc-duet-upload-s>[slot=header]{margin-bottom:16px}/*!@::slotted([slot=fileheader])*/.sc-duet-upload-s>[slot=fileheader]{margin:16px 0 0 0}/*!@::slotted([slot=filefooter])*/.sc-duet-upload-s>[slot=filefooter]{margin-top:16px}/*!@.duet-upload*/.duet-upload.sc-duet-upload{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@.duet-upload-item-size*/.duet-upload-item-size.sc-duet-upload{font-size:0.75rem;font-weight:400}/*!@.duet-upload-filelist*/.duet-upload-filelist.sc-duet-upload{margin-bottom:25px}/*!@.duet-upload-filelist-empty*/.duet-upload-filelist-empty.sc-duet-upload{display:flex;align-items:center;justify-content:center;width:100%;height:75px;margin:0 auto;font-size:1rem;font-weight:400;background-color:#f5f8fa}";
+
+/**
+ * @slot header  - named slot - to place content after description / caption
+ * @slot fileheader - named slot - to place content above "filelist" (only displayed when "filelist" contains items)
+ * @slot filefooter - named slot - to place content below "filelist" (only displayed when "filelist" contains items)
+ */
+class DuetUpload {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.duetChange = createEvent$2(this, "duetChange", 3);
+    this.duetBlur = createEvent$2(this, "duetBlur", 7);
+    this.duetFocus = createEvent$2(this, "duetFocus", 7);
+    this.duetDone = createEvent$2(this, "duetDone", 3);
+    this.duetState = createEvent$2(this, "duetState", 3);
+    this.duetDelete = createEvent$2(this, "duetDelete", 3);
+    this.duetCancel = createEvent$2(this, "duetCancel", 3);
+    this.duetProgress = createEvent$2(this, "duetProgress", 3);
+    this.duetUpload = createEvent$2(this, "duetUpload", 3);
+    /**
+     * Own Properties
+     */
+    this.buttonId = createID("DuetButton");
+    this.labelId = createID("DuetLabel");
+    this.uploadId = createID("DuetUpload");
+    this.editableTableId = createID("DuetEditableTable");
+    this.filesInProgress = new Map();
+    this.fileMaxReached = false;
+    this.bytesMaxReached = false;
+    this.internalStatusMessageLabel = undefined;
+    /**
+     * Properties
+     */
+    this.DefaultGroups = {
+      inprogress: "inprogress",
+      success: "success",
+      failure: "failure",
+    };
+    /**
+     * State() variables
+     */
+    this.tick = Date.now();
+    /**
+     * If external is set to true, the upload component will not actually upload the files, but only keep states
+     * it will be up to you to handle the upload and return progress information to the upload-component
+     */
+    this.external = false;
+    /**
+     * If set the upload component will not display an upload button, you will have to create one yourself
+     * and call the exposed method startUpload
+     */
+    this.hideButton = false;
+    /**
+     * Default actions added to the internally used duet-editable-table
+     */
+    this.actions = [
+      {
+        icon: "action-delete",
+        color: "color-danger",
+        color_hover: "primary-dark",
+        id: "delete",
+        map: ["success", "failure"],
+        label: {
+          fi: "Poista tiedosto",
+          en: "Poista tiedosto",
+          sv: "Ta bort filen",
+        },
+      },
+      {
+        icon: "navigation-close",
+        color: "primary",
+        color_hover: "primary-dark",
+        id: "cancel",
+        map: ["inprogress"],
+        label: {
+          fi: "Keskeytä lähetys",
+          en: "Cancel the upload",
+          sv: "Stop överföringen",
+        },
+      },
+    ];
+    /**
+     * If enabled the editable-table will display links on successfully uploaded items,
+     * this requires the server can respond with link URIs in the correct format
+     * and that the files are accessible to the user
+     */
+    this.showLinks = false;
+    /**
+     * Property to change the aria upload progress text read aloud by screenreaders
+     * @default {
+     *     fi: {
+     *       inProgress: "Lähetetään {filesUploaded} lähetettävästä {filesTotal} tiedostosta",
+     *       inProgressWithErrors:
+     *         "Lähetetään {filesInProgress} tiedostoa, lähetetty {filesUploaded} lähetettävästä {filesTotal} tiedostosta, {filesWithErrors} tiedostossa on virheitä",
+     *       done: "Kaikki {filesTotal} tiedostoa lähetetty onnistuneesti",
+     *       doneWithErrors:
+     *         "Lähetys valmis, {filesUploaded} tiedostoa on lähetetty onnistuneesti, {filesWithErrors} tiedostossa oli virheitä",
+     *       files: "tiedostot",
+     *       file: "tiedosto",
+     *     },
+     *     sv: {
+     *       inProgress: "Adding {filesUploaded} of {filesTotal}",
+     *       inProgressWithErrors:
+     *         "Laddar upp {filesInProgress}, {filesUploaded} uppladdad av {filesTotal}, {filesWithErrors} misslyckades",
+     *       done: "Alla {filesTotal} har lagts till",
+     *       doneWithErrors: "Handling slutförd, {filesUploaded} har lagts till, {filesWithErrors} misslyckades",
+     *       files: "filer",
+     *       file: "fil",
+     *     },
+     *     en: {
+     *       inProgress: "Adding {filesUploaded} of {filesTotal}",
+     *       inProgressWithErrors:
+     *         "Uploading {filesInProgress}, {filesUploaded} uploaded of {filesTotal}, {filesWithErrors} failed",
+     *       done: "All {filesTotal} added successfully",
+     *       doneWithErrors: "Action completed, {filesUploaded} has been added successfully, {filesWithErrors} had errors",
+     *       files: "tiedostoa",
+     *       file: "tiedosto",
+     *     },
+     *   }
+     */
+    this.statusLabelDefaults = {
+      fi: {
+        inProgress: "Lähetetään {filesUploaded} lähetettävästä {filesTotal} tiedostosta",
+        inProgressWithErrors: "Lähetetään {filesInProgress} tiedostoa, lähetetty {filesUploaded} lähetettävästä {filesTotal} tiedostosta, {filesWithErrors} tiedostossa on virheitä",
+        done: "Kaikki {filesTotal} tiedostoa lähetetty onnistuneesti",
+        doneWithErrors: "Lähetys valmis, {filesUploaded} tiedostoa on lähetetty onnistuneesti, {filesWithErrors} tiedostossa oli virheitä",
+        files: "tiedostot",
+        file: "tiedosto",
+      },
+      sv: {
+        inProgress: "Adding {filesUploaded} of {filesTotal}",
+        inProgressWithErrors: "Laddar upp {filesInProgress}, {filesUploaded} uppladdad av {filesTotal}, {filesWithErrors} misslyckades",
+        done: "Alla {filesTotal} har lagts till",
+        doneWithErrors: "Handling slutförd, {filesUploaded} har lagts till, {filesWithErrors} misslyckades",
+        files: "filer",
+        file: "fil",
+      },
+      en: {
+        inProgress: "Adding {filesUploaded} of {filesTotal}",
+        inProgressWithErrors: "Uploading {filesInProgress}, {filesUploaded} uploaded of {filesTotal}, {filesWithErrors} failed",
+        done: "All {filesTotal} added successfully",
+        doneWithErrors: "Action completed, {filesUploaded} has been added successfully, {filesWithErrors} had errors",
+        files: "tiedostoa",
+        file: "tiedosto",
+      },
+    };
+    /**
+     * Strings used for the status aria-label
+     */
+    this.statusMessageLabel = getLocaleString(this.statusLabelDefaults);
+    /**
+     * Property to change button label defaults on the component.
+     * @default {
+        fi: "Lisää liite",
+        sv: "Lägg till en bilaga",
+        en: "Add an attachment",
+      }
+     */
+    this.buttonLabelDefaults = {
+      fi: "Lisää liite",
+      sv: "Lägg till en bilaga",
+      en: "Add an attachment",
+    };
+    /**
+     * Label of button
+     * @default { fi: "Lisää liite", sv: "Lägg till en bilaga", en: "Add an attachment" }
+     */
+    this.buttonLabel = getLocaleString(this.buttonLabelDefaults);
+    /**
+     * accessible aria-Label of button
+     */
+    this.accessibleButtonLabel = undefined;
+    /**
+     * Theme of the input.
+     */
+    this.theme = "";
+    /**
+     * Makes the input component disabled. This prevents users from being able to
+     * interact with the upload component, and conveys its inactive state to assistive technologies.
+     */
+    this.disabled = false;
+    /**
+     * Controls the margin of the component.
+     */
+    this.margin = "auto";
+    /**
+     * Set whether the input is required or not. Please note that this is necessary for
+     * accessible inputs when the user is required to fill them. When using this property
+     * you need to also set “novalidate” attribute to your form element to prevent
+     * browser from displaying its own validation errors.
+     */
+    this.required = false;
+    /**
+     * Key used to set vertical alignment of action buttons
+     */
+    this.alignment = "middle";
+    /**
+     * Visually hides the groups labels in the editable table list used to display the list of files
+     */
+    this.hideGroups = false;
+    /**
+     * Map of string that contain list of uploaded files.
+     */
+    this.files = new Map();
+    /**
+     * Property to read if the internally used editable-table contains errors or not
+     */
+    this.valid = !this.required;
+    /**
+     * Property to change labelDefaults defaults on the component.
+     * normally you would handle these strings on an application level and override @label when needed
+     * @default { fi: "Lisää liite",sv: "Lägg till en bilaga",en: "Add attachments"}
+     */
+    this.labelDefaults = {
+      fi: "Lisää liite",
+      sv: "Lägg till en bilaga",
+      en: "Add attachments",
+    };
+    /**
+     * Label for the input.
+     * @default { fi: "Lisää liite",sv: "Lägg till en bilaga",en: "Add attachments"}
+     */
+    this.label = getLocaleString(this.labelDefaults);
+    /**
+     * Property to change descriptionDefaults defaults on the component.
+     * @default {
+        fi: "Voit liittää {filetypes}-muotoisia tiedostoja sekä yleisimpiä videotiedostoja. Voit lähettää {maxbytes} verran tiedostoja yhdellä kertaa, ja lisätä enintään {maxfiles} liitettä kerrallaan.",
+        sv: "Du kan bifoga filer i flg. formater {filetypes} samt de vanligaste videofilerna. Du kan ladda upp {maxbytes} filer åt gången och lägga till upp till {maxfiles} bilagor åt gången.",
+        en: "You may attach the following filetypes: {filetypes} - as well as the most common video files. You can upload {maxbytes} of files at a time, and add up to {maxfiles} attachments at a time.",
+      }
+     */
+    this.descriptionDefaults = {
+      fi: "Voit liittää {filetypes}-muotoisia tiedostoja sekä yleisimpiä videotiedostoja. Voit lähettää {maxbytes} verran tiedostoja yhdellä kertaa, ja lisätä enintään {maxfiles} liitettä kerrallaan.",
+      sv: "Du kan bifoga filer i flg. formater {filetypes} samt de vanligaste videofilerna. Du kan ladda upp {maxbytes} filer åt gången och lägga till upp till {maxfiles} bilagor åt gången.",
+      en: "You may attach the following filetypes: {filetypes} - as well as the most common video files. You can upload {maxbytes} of files at a time, and add up to {maxfiles} attachments at a time.",
+    };
+    /**
+     * Description for the upload component.
+     * @default {
+        fi: "Voit liittää {filetypes}-muotoisia tiedostoja sekä yleisimpiä videotiedostoja. Voit lähettää {maxbytes} verran tiedostoja yhdellä kertaa, ja lisätä enintään {maxfiles} liitettä kerrallaan.",
+        sv: "Du kan bifoga filer i flg. formater {filetypes} samt de vanligaste videofilerna. Du kan ladda upp {maxbytes} filer åt gången och lägga till upp till {maxfiles} bilagor åt gången.",
+        en: "You may attach the following filetypes: {filetypes} - as well as the most common video files. You can upload {maxbytes} of files at a time, and add up to {maxfiles} attachments at a time.",
+      }
+     */
+    this.description = getLocaleString(this.descriptionDefaults);
+    /**
+     * Defaults for the filelist's empty state.
+     * @default {
+        fi: "Ei vielä lisättyjä tiedostoja.",
+        sv: "Inga filer har lagts till ännu.",
+        en: "No files added yet.",
+       }
+     */
+    this.fileListEmptyDefaults = {
+      fi: "Ei vielä lisättyjä tiedostoja.",
+      sv: "Inga filer har lagts till ännu.",
+      en: "No files added yet.",
+    };
+    /**
+     * Label for the filelist's empty state.
+     * @default { fi: "Ei vielä lisättyjä tiedostoja.",sv: "Inga filer har lagts till ännu.",en: "No files added yet."}
+     */
+    this.fileListEmpty = getLocaleString(this.fileListEmptyDefaults);
+    /**
+     * Display the input in error state along with an error message.
+     */
+    this.error = "";
+    /**
+     * Use maxBytes to specify the maximum size in Bytes of a file that can be uploaded.
+     */
+    this.maxBytes = 200000000;
+    /**
+     * Use maxBytesTotal to specify the maximum size in Bytes of All files combined that can be uploaded.
+     */
+    this.maxBytesTotal = undefined;
+    /**
+     * Use maxFiles to specify the maximum amount of files that can be uploaded
+     */
+    this.maxFiles = 99;
+    /**
+     * A string of commaseperated file type values that are allowed
+     * @example: .pdf,.doc,.docx
+     */
+    this.allowedExtensions = "all";
+    /**
+     * A string of commaseperated mime type values that are allowed
+     * @example: image/*,application/msword,
+     */
+    this.allowedMimetypes = "*";
+    /**
+     * Use multiple to allow the user to select multiple files when uploading
+     */
+    this.multiple = true;
+    /**
+     * Use limitSelection to enforce the value in allowedExtension & allowedMimetypes when selecting files,
+     * by default this is off, setting this to true will limit the users choices to what has been explicitly set
+     */
+    this.limitSelection = false;
+    /**
+     * Private functions
+     */
+    this.listenForActionEvents = () => {
+      this.element.addEventListener("duetEditableItemAction", (e) => {
+        const detail = e.detail;
+        const { action, keyName, originalEvent } = detail;
+        switch (action) {
+          case "delete":
+            this.onDelete(keyName, originalEvent);
+            break;
+          case "cancel":
+            this.onCancel(keyName, originalEvent);
+            break;
+          // code block
+        }
+      });
+    };
+    this.verifyValidity = () => {
+      const { invalid, valid } = this.getFilesAsArray();
+      const oldValid = this.valid;
+      this.valid = invalid.length === 0 && valid.length !== 0;
+      if (this.valid !== oldValid) {
+        this.duetState.emit({
+          originalEvent: undefined,
+          data: { valid: this.valid, from: "componentWillRender" },
+          component: "duet-upload",
+        });
+      }
+    };
+    this.getGroupFromItemData = (item) => {
+      if (item.valid && item.progress === 100) {
+        // if the item has a group, move the file to that group instead
+        // of into the standard success group
+        if (item.group) {
+          return item.group;
+        }
+        return this.DefaultGroups.success;
+      }
+      else if (item.progress > 0 && item.progress !== 100) {
+        return this.DefaultGroups.inprogress;
+      }
+      else if (!item.valid) {
+        return this.DefaultGroups.failure;
+      }
+      else if (item.group) {
+        return item.group;
+      }
+      else {
+        return "none";
+      }
+    };
+    this.getItemHTMLFromItemData = (data, group) => {
+      if (group === this.DefaultGroups.success) {
+        return hAsync(SuccessItem, { data: data, showLinks: this.showLinks });
+      }
+      else if (group === this.DefaultGroups.inprogress) {
+        return hAsync(ProgressItem, { progress: data.progress, name: data.item.name });
+      }
+      else if (group === this.DefaultGroups.failure) {
+        return hAsync(ErrorItem, { data: data });
+      }
+      else if (data.group) {
+        return data.html;
+      }
+      else {
+        return "none";
+      }
+    };
+    this.convertToDuetEditableTableItems = () => {
+      // we're always recreating the map - in order to force an update down stream.
+      const itemData = new Map();
+      //walk the files Map and convert to DuetEditableTableItemData
+      this.files.forEach((data, key, _originalMap) => {
+        const group = this.getGroupFromItemData(data);
+        const item = this.getItemHTMLFromItemData(data, group);
+        itemData.set(key, {
+          uid: data.uid,
+          item,
+          group,
+        });
+      });
+      return itemData;
+    };
+    this.kick = debounce(() => {
+      this.tick = Date.now();
+    }, 30); // will trigger re-render
+    this.genHashName = () => Date.now().toString(36) + Math.random();
+    this.updateValueInMap = (item, key, value, kick = true) => {
+      const fileItem = this.files.get(item);
+      fileItem[key] = value;
+      this.files.set(item, fileItem);
+      if (kick) {
+        this.kick();
+      }
+    };
+    this.updateProgress = (ev, name) => {
+      const updateProgressHelper = percentComplete => {
+        this.updateValueInMap(name, "progress", percentComplete);
+        this.onProgress(name, percentComplete, ev);
+      };
+      if (ev.lengthComputable) {
+        const percentComplete = (ev.loaded / ev.total) * 100;
+        updateProgressHelper(percentComplete);
+      }
+      else {
+        console.log("cant read progress");
+      }
+    };
+    this.trackProgress = (name, remove = false) => {
+      if (remove) {
+        this.filesInProgress.delete(name);
+      }
+      else {
+        this.filesInProgress.set(name, "inprogress");
+      }
+      if (this.filesInProgress.size === 0) {
+        this.onDone();
+      }
+    };
+    this.getFilesAsArray = () => {
+      const filesInQueue = [];
+      const filesInError = [];
+      this.files.forEach(value => {
+        if (value.valid && !value.deleted) {
+          filesInQueue.push(value);
+        }
+        else if (!value.valid && !value.deleted) {
+          filesInError.push(value);
+        }
+      });
+      return { valid: filesInQueue, invalid: filesInError };
+    };
+    this.resetFormFields = () => {
+      /**
+       * You cannot modify a FileList, nor remove single items from it
+       * This completely removes all items in the FileList
+       * We reset the form fields to always be able to re-upload files
+       * and because we handle all uploads and states internally in the component (not relying on native form elements)
+       */
+      /* TODO: it may be a good idea to just update the list so that this always matches what is in the files map,
+       * TODO: this would remove the capability of Re-uploading, unless we can catch and remove the user file from the form filelist before the upload is canceled by the browser
+       * TODO: but for now we'll just reset the form fields
+       */
+      this.nativeInput.value = "";
+    };
+    this.startUpload = async (ev, metaData = undefined) => {
+      await this.setFocus();
+      this.metaData = metaData;
+      this.nativeInput.click();
+      this.onUpload(ev, metaData);
+      ev.stopPropagation();
+      ev.preventDefault();
+      return;
+    };
+    /**
+     * Eventlisteners for the XHR requests
+     */
+    this.transferComplete = name => {
+      this.updateValueInMap(name, "progress", 100, false);
+      this.trackProgress(name, true);
+    };
+    this.transferDone = (xhr, name, status) => {
+      this.updateValueInMap(name, "status", status, false);
+      this.updateValueInMap(name, "uploaded", true, false);
+      try {
+        const response = JSON.parse(xhr.response);
+        this.updateValueInMap(name, "url", response.url);
+      }
+      catch (e) {
+        this.updateValueInMap(name, "url", null);
+        console.error("Server did not respond with expected response {url: string}");
+      }
+      return;
+    };
+    this.transferDoneWithFailure = (xhr, name, status) => {
+      try {
+        const { error } = JSON.parse(xhr.response);
+        this.updateValueInMap(name, "error", { message: error.message, type: error.type }, false);
+      }
+      catch (e) {
+        console.error("Server did not respond with expected response error:{message: string, type: int}");
+        this.updateValueInMap(name, "error", { type: status }, false);
+      }
+      this.updateValueInMap(name, "valid", false, true);
+    };
+    this.transferFailed = name => {
+      this.updateValueInMap(name, "error", getError("duet-upload-001"));
+    };
+    this.transferCanceled = name => {
+      this.files.delete(name);
+      this.validateTotals(name);
+      this.kick();
+    };
+    this.validateTotals = (name) => {
+      const isTotalSizeOverMaxSize = validateTotalSizeIsAboveMax(this.files, this.maxBytesTotal);
+      const isTotalFileAmountAboveMax = validateTotalAmountIsAboveMax(this.files, this.maxFiles);
+      if (isTotalSizeOverMaxSize && name) {
+        this.updateValueInMap(name, "error", getError("duet-upload-202"), false);
+      }
+      if (isTotalFileAmountAboveMax && name) {
+        this.updateValueInMap(name, "error", getError("duet-upload-301"), false);
+      }
+      this.bytesMaxReached = isTotalSizeOverMaxSize;
+      this.fileMaxReached = isTotalFileAmountAboveMax;
+      return {
+        bytesMaxReached: isTotalSizeOverMaxSize,
+        fileMaxReached: isTotalFileAmountAboveMax,
+      };
+    };
+    this.onDelete = (key, ev) => {
+      const deletedItem = this.files.get(key);
+      this.files.delete(key);
+      this.validateTotals();
+      this.kick();
+      this.duetDelete.emit({
+        originalEvent: ev,
+        data: { deletion: deletedItem },
+        component: "duet-upload",
+      });
+      if (!this.external) {
+        this.makeXHRDeleteRequest(deletedItem);
+      }
+      this.resetFormFields();
+    };
+    this.onCancel = (key, ev) => {
+      const cancelledItem = this.files.get(key);
+      this.files.delete(key);
+      if (!this.external) {
+        const { xhr } = cancelledItem;
+        xhr.abort();
+      }
+      else {
+        this.kick();
+      }
+      this.resetFormFields();
+      this.duetCancel.emit({
+        originalEvent: ev,
+        data: { cancelled: cancelledItem },
+        component: "duet-upload",
+      });
+    };
+    this.onUpload = (ev, metaData) => {
+      this.duetUpload.emit({
+        originalEvent: ev,
+        metaData,
+        component: "duet-upload",
+      });
+    };
+    this.onBlur = (ev) => {
+      this.duetBlur.emit({
+        originalEvent: ev,
+        component: "duet-upload",
+      });
+    };
+    this.onProgress = (key, percentComplete, ev) => {
+      this.duetChange.emit({
+        originalEvent: ev,
+        data: {
+          key,
+          percentComplete,
+        },
+        component: "duet-upload",
+      });
+    };
+    this.onFocus = (ev) => {
+      this.duetFocus.emit({
+        originalEvent: ev,
+        component: "duet-upload",
+      });
+    };
+    this.onDone = () => {
+      this.duetDone.emit({
+        component: "duet-upload",
+        data: { files: this.files },
+      });
+    };
+  }
+  watchValidHandler(newValue, oldValue) {
+    if (newValue !== oldValue) {
+      this.kick();
+    }
+  }
+  /**
+   * Component lifecycle events.
+   */
+  componentWillLoad() {
+    if (typeof this.statusMessageLabel === "string") {
+      this.internalStatusMessageLabel = sanitizeString(this.groups);
+    }
+    else {
+      this.internalStatusMessageLabel = this.statusMessageLabel;
+    }
+    inheritGlobalTheme(this);
+    this.listenForActionEvents();
+  }
+  componentWillRender() {
+    // listen to the events from the component
+    this.verifyValidity();
+  }
+  /**
+   * XHR request utilities
+   */
+  makeXHRPostRequest(data) {
+    const xhr = new XMLHttpRequest();
+    const name = data.get("name");
+    xhr.upload.addEventListener("progress", ev => {
+      this.updateProgress(ev, name);
+    });
+    xhr.upload.addEventListener("load", () => {
+      this.transferComplete(name);
+    });
+    xhr.upload.addEventListener("error", () => {
+      this.transferFailed(name);
+    });
+    xhr.upload.addEventListener("abort", () => {
+      this.transferCanceled(name);
+    });
+    return makeXhrRequest({
+      payload: { data, name },
+      options: { type: "POST", uri: this.uri, xhr, argument: null, headers: null },
+      onFailure: this.transferDoneWithFailure,
+      onSuccess: this.transferDone,
+      onProgress: this.trackProgress,
+    });
+  }
+  makeXHRDeleteRequest(data) {
+    const { uid, item } = data;
+    const xhr = new XMLHttpRequest();
+    // don't present server issues to user on deletes, just remove them from the visible list
+    return makeXhrRequest({
+      payload: { data: null, name },
+      options: {
+        type: "DELETE",
+        xhr,
+        uri: this.uri,
+        arguments: `?key=${uid}&name=${item.name}`,
+        headers: {
+          "x-fileuid": uid,
+          "x-filename": item.name,
+        },
+      },
+      onFailure: this.transferDoneWithFailure,
+      onSuccess: this.transferDone,
+      onProgress: this.trackProgress,
+    });
+  }
+  /**
+   * Component event handling.
+   */
+  async onChange(ev) {
+    var _a;
+    const selectedFiles = Array.from((_a = this.nativeInput) === null || _a === void 0 ? void 0 : _a.files);
+    // FileList is a nice array like structure but
+    // to ensure uniqueness of files we use a mapping structure and
+    // key to the name (makes it easier to delete as well)
+    if (selectedFiles) {
+      for (const item of selectedFiles) {
+        const { valid, errorMessage, errorType, errorSystem } = validateFile(item, {
+          maxBytes: this.maxBytes,
+          allowedExtensions: this.allowedExtensions,
+          allowedMimetypes: this.allowedMimetypes,
+        });
+        const uid = this.genHashName();
+        const fileListItem = {
+          uid,
+          item: item,
+          size: item.size,
+          meta: this.metaData,
+          uploaded: false,
+          valid,
+          error: {
+            type: valid ? undefined : errorType,
+            message: valid ? undefined : errorMessage,
+            system_message: valid ? undefined : errorSystem,
+          },
+          progress: 0,
+          deleted: false,
+          xhr: false,
+          url: false,
+        };
+        this.files.set(item.name, fileListItem);
+        // validate that we haven't hit any maxfiles or maxbytes limits before we upload
+        const { bytesMaxReached, fileMaxReached } = this.validateTotals(item.name);
+        if (bytesMaxReached) {
+          // in case one of the global maxes have been reached, invalidate the file
+          this.updateValueInMap(item.name, "valid", false, false);
+        }
+        else if (fileMaxReached) {
+          // in case one of the global maxes have been reached, invalidate the file
+          this.updateValueInMap(item.name, "valid", false, false);
+        }
+        else if (valid && !this.external) {
+          // if all is well AND external file upload handling has not been set, start upload
+          const data = new FormData();
+          data.append("file", item);
+          data.append("uid", uid);
+          data.append("name", item.name);
+          data.append("metadata", JSON.stringify({ uid, url: this.uri, size: item.size, meta: fileListItem.meta }));
+          try {
+            fileListItem.xhr = await this.makeXHRPostRequest(data);
+          }
+          catch (e) {
+            // in case one of the global maxes have been reached, invalidate the file
+            this.updateValueInMap(item.name, "valid", false, false);
+          }
+        }
+        // kick the stat to force update
+        this.kick();
+      }
+    }
+    // reset the form, so that a user may upload a file again (with the same name)
+    this.resetFormFields();
+    // reset the internal metaData state
+    this.metaData = undefined;
+    this.duetChange.emit({
+      originalEvent: ev,
+      data: { files: this.files },
+      component: "duet-upload",
+    });
+  }
+  /**
+   * Sets focus on the specified `duet-input`. Use this method instead of the global
+   * `input.focus()`.
+   */
+  async setFocus(options) {
+    if (this.nativeInput) {
+      this.nativeInput.focus(options);
+    }
+    return;
+  }
+  /**
+   * Method for invoking the upload sequence
+   */
+  async upload(metaData = undefined) {
+    await this.setFocus();
+    this.metaData = metaData;
+    this.nativeInput.click();
+    return;
+  }
+  /**
+   * Get list of files, divided in errors and valid sections
+   */
+  async getFiles() {
+    if (!this.files || this.files.size === 0) {
+      return false;
+    }
+    return this.getFilesAsArray();
+  }
+  /**
+   * Convenience method for updating the value of a key:value inside an item in the files attribute
+   */
+  async updateValue(item, key, value) {
+    this.updateValueInMap(item, key, value);
+  }
+  /**
+   * render() function
+   * Always the last one in the class.
+   */
+  render() {
+    const identifier = this.identifier || this.uploadId;
+    let caption = this.description.replace(/{maxfiles}/g, this.maxFiles.toString());
+    caption = caption.replace(/{maxbytes}/g, `${Math.floor(this.maxBytes / 1024 / 1024)} MB`);
+    caption = caption.replace(/{filetypes}/g, this.allowedExtensions.split(",").join(", "));
+    return (hAsync(Host, { class: { "duet-m-0": this.margin === "none" } }, hAsync("duet-fieldset", { label: this.label, caption: caption }, hAsync("slot", { name: "header" }), !this.files.size && (hAsync("duet-label", { theme: this.theme === "turva" ? "turva" : "default", size: "small", class: {
+        "duet-upload-filelist-empty": !this.files.size,
+        "duet-upload-filelist": true,
+        "duet-upload-filelist-filled": this.files.size,
+      }, id: this.labelId, for: identifier }, this.fileListEmpty)), !!this.files.size && hAsync("slot", { name: "fileheader" }), !!this.files.size && (hAsync("duet-upload-aria-status", { invalid: this.getFilesAsArray().invalid.length, valid: this.getFilesAsArray().valid.length, inprogress: this.filesInProgress.size, total: this.files.size, statusMessageLabel: this.internalStatusMessageLabel })), !!this.files.size && (hAsync("duet-editable-table", { "aria-live": "polite", "aria-relevant": "removals", accessibleRole: "log", id: this.editableTableId, groups: this.groups, actions: this.actions, hideGroups: this.hideGroups, alignment: this.alignment, items: this.convertToDuetEditableTableItems() })), !!this.files.size && hAsync("slot", { name: "filefooter" }), hAsync("duet-spacer", { size: "large" }), !this.hideButton && (hAsync("duet-button", { id: this.buttonId, onClick: this.startUpload, "accessible-controls": identifier, disabled: this.fileMaxReached, "accessible-label": this.accessibleButtonLabel, "accessible-owns": identifier, size: "small", variation: "secondary", fixed: true, icon: "action-add-circle" }, this.buttonLabel)), hAsync("duet-spacer", { size: "medium" }), (this.fileMaxReached || this.bytesMaxReached) && (hAsync("duet-alert", null, this.fileMaxReached && getI18nError("duet-upload-301"), this.bytesMaxReached && getI18nError("duet-upload-202"))), hAsync("duet-spacer", { size: "medium" }), hAsync("duet-visually-hidden", null, hAsync("input", { 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,
+      }, disabled: this.disabled, "aria-hidden": "true", required: this.required, name: this.name, id: this.identifier, multiple: this.multiple, capture: "user" })))));
+  }
+  get element() { return getElement(this); }
+  static get watchers() { return {
+    "valid": ["watchValidHandler"]
+  }; }
+  static get style() { return duetUploadCss; }
+  static get cmpMeta() { return {
+    "$flags$": 9,
+    "$tagName$": "duet-upload",
+    "$members$": {
+      "accessibleActiveDescendant": [1, "accessible-active-descendant"],
+      "accessibleDescribedBy": [1, "accessible-described-by"],
+      "accessibleControls": [1, "accessible-controls"],
+      "accessibleOwns": [1, "accessible-owns"],
+      "external": [4],
+      "hideButton": [4, "hide-upload-button"],
+      "actions": [1],
+      "uri": [1],
+      "showLinks": [4, "show-links"],
+      "caption": [1],
+      "statusLabelDefaults": [1, "status-label-default"],
+      "statusMessageLabel": [1, "status-message-label"],
+      "buttonLabelDefaults": [1, "button-label-default"],
+      "buttonLabel": [1, "button-label"],
+      "accessibleButtonLabel": [1, "accessible-button-label"],
+      "theme": [1025],
+      "disabled": [516],
+      "identifier": [1],
+      "margin": [1],
+      "required": [4],
+      "groups": [1],
+      "alignment": [1],
+      "hideGroups": [4, "hide-table-labels"],
+      "files": [1040],
+      "valid": [1540],
+      "labelDefaults": [1, "label-default"],
+      "label": [1],
+      "descriptionDefaults": [1, "description-default"],
+      "description": [1],
+      "fileListEmptyDefaults": [1, "list-empty-default"],
+      "fileListEmpty": [1, "file-list-empty"],
+      "error": [1],
+      "name": [1],
+      "maxBytes": [2, "max-bytes"],
+      "maxBytesTotal": [2, "max-bytes-total"],
+      "maxFiles": [2, "max-files"],
+      "allowedExtensions": [1, "allowed-extensions"],
+      "allowedMimetypes": [1, "allowed-mimetypes"],
+      "multiple": [4],
+      "limitSelection": [4, "limit-selection"],
+      "value": [1025],
+      "tick": [32],
+      "setFocus": [64],
+      "upload": [64],
+      "getFiles": [64],
+      "updateValue": [64]
+    },
+    "$listeners$": undefined,
+    "$lazyBundleId$": "-",
+    "$attrsToReflect$": [["disabled", "disabled"], ["valid", "valid"]]
+  }; }
+}
+
+class DuetUploadAriaStatus {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    /**
+     * State() variables
+     */
+    this.statusMessage = null;
+    /**
+     * Status labels used in the component
+     */
+    this.statusMessageLabel = null;
+    /**
+     * Adds accessible label that is read aloud
+     */
+    this.accessibleAriaLive = "polite";
+    /**
+     * valid file amount
+     */
+    this.valid = undefined;
+    /**
+     * total files
+     */
+    this.total = undefined;
+    /**
+     * invalid file amount
+     */
+    this.invalid = undefined;
+    /**
+     * valid file amount
+     */
+    this.inprogress = undefined;
+    /**
+     * Private functions
+     */
+    this.replacePlaceHolders = (statusString) => {
+      const addFiles = (amount) => {
+        return amount > 1 ? `${amount} ${this.statusMessageLabel.files}` : `${amount} ${this.statusMessageLabel.file}`;
+      };
+      return statusString
+        .replace("{filesUploaded}", addFiles(this.valid))
+        .replace("{filesInProgress}", addFiles(this.inprogress))
+        .replace("{filesTotal}", addFiles(this.total))
+        .replace("{filesWithErrors}", addFiles(this.invalid));
+    };
+    this.getStatusMessage = () => {
+      const { done, inProgress, doneWithErrors, inProgressWithErrors } = this.statusMessageLabel;
+      const hasErrors = this.invalid > 0;
+      const isInProgress = this.inprogress > 0;
+      const isInProgressWithErrors = this.inprogress > 0 && hasErrors;
+      const isDone = this.valid === this.total && !isInProgress && !hasErrors;
+      const isDoneWithErrors = this.valid + this.invalid === this.total && !isInProgress;
+      if (isDone) {
+        this.statusMessage = this.replacePlaceHolders(done);
+        return;
+      }
+      else if (isInProgressWithErrors) {
+        this.statusMessage = this.replacePlaceHolders(inProgressWithErrors);
+        return;
+      }
+      else if (isInProgress) {
+        this.statusMessage = this.replacePlaceHolders(inProgress);
+        return;
+      }
+      else if (isDoneWithErrors) {
+        this.statusMessage = this.replacePlaceHolders(doneWithErrors);
+        return;
+      }
+      return;
+    };
+  }
+  watchHandler(newValue, oldValue) {
+    if (newValue !== oldValue) {
+      this.getStatusMessage();
+    }
+  }
+  /**
+   * render() function
+   * Always the last one in the class.
+   */
+  render() {
+    return (hAsync(Host, { role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, hAsync("duet-visually-hidden", null, this.statusMessage)));
+  }
+  static get watchers() { return {
+    "valid": ["watchHandler"],
+    "invalid": ["watchHandler"],
+    "inprogress": ["watchHandler"],
+    "total": ["watchHandler"]
+  }; }
+  static get cmpMeta() { return {
+    "$flags$": 9,
+    "$tagName$": "duet-upload-aria-status",
+    "$members$": {
+      "statusMessageLabel": [16],
+      "accessibleAriaLive": [1, "accessible-aria-live"],
+      "valid": [2],
+      "total": [2],
+      "invalid": [2],
+      "inprogress": [2],
+      "statusMessage": [32]
+    },
+    "$listeners$": undefined,
+    "$lazyBundleId$": "-",
+    "$attrsToReflect$": []
+  }; }
+}
+
 const duetVisuallyHiddenCss = "/*!@:host*/.sc-duet-visually-hidden-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:absolute !important;top:0;width:1px !important;height:1px !important;padding:0 !important;overflow:hidden !important;clip:rect(1px, 1px, 1px, 1px) !important;border:0 !important}";
 
 class DuetVisuallyHidden {
@@ -14354,6 +16471,9 @@ registerComponents([
   DuetCookieConsent,
   DuetDatePicker,
   DuetDivider,
+  DuetEditableTable,
+  DuetEditableTableButton,
+  DuetEditableTableItem,
   DuetEmptyState,
   DuetFieldset,
   DuetFooter,
@@ -14375,6 +16495,7 @@ registerComponents([
   DuetNotificationDrawer,
   DuetNumberInput,
   DuetParagraph,
+  DuetProgress,
   DuetRadio,
   DuetRadioGroup,
   DuetRangeSlider,
@@ -14390,6 +16511,8 @@ registerComponents([
   DuetToggle,
   DuetTooltip,
   DuetTray,
+  DuetUpload,
+  DuetUploadAriaStatus,
   DuetVisuallyHidden,
 ]);