@swisspost/internet-header 1.5.0-beta.2 → 1.5.0

package/dist/cjs/swisspost-internet-breadcrumbs.cjs.entry.js

@@ -5,15 +5,15 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-5751975e.js');
 const index$1 = require('./index-e7245d60.js');
 const bodyScrollLock_esm = require('./bodyScrollLock.esm-59f17217.js');
-const svgIcon_component = require('./svg-icon.component-10fbda11.js');
-const store = require('./store-47e14589.js');
+const svgIcon_component = require('./svg-icon.component-be93f876.js');
+const store = require('./store-d0d514fc.js');
 const _commonjsHelpers = require('./_commonjsHelpers-537d719a.js');
-const svgSprite_component = require('./svg-sprite.component-c3b454b3.js');
-const language_service = require('./language.service-a80ae01d.js');
-const utils = require('./utils-b6014257.js');
+const svgSprite_component = require('./svg-sprite.component-1bd7a058.js');
+const language_service = require('./language.service-7dbf739d.js');
+const utils = require('./utils-60853c5d.js');
 
 /*!
-* tabbable 5.3.3
+* tabbable 6.0.1
 * @license MIT, https://github.com/focus-trap/tabbable/blob/master/LICENSE
 */
 var candidateSelectors = ['input', 'select', 'textarea', 'a[href]', 'button', '[tabindex]:not(slot)', 'audio[controls]', 'video[controls]', '[contenteditable]:not([contenteditable="false"])', 'details>summary:first-of-type', 'details'];
@@ -25,23 +25,22 @@ var getRootNode = !NoElement && Element.prototype.getRootNode ? function (elemen
 } : function (element) {
   return element.ownerDocument;
 };
+
 /**
  * @param {Element} el container to check in
  * @param {boolean} includeContainer add container to check
  * @param {(node: Element) => boolean} filter filter candidates
  * @returns {Element[]}
  */
-
 var getCandidates = function getCandidates(el, includeContainer, filter) {
   var candidates = Array.prototype.slice.apply(el.querySelectorAll(candidateSelector));
-
   if (includeContainer && matches.call(el, candidateSelector)) {
     candidates.unshift(el);
   }
-
   candidates = candidates.filter(filter);
   return candidates;
 };
+
 /**
  * @callback GetShadowRoot
  * @param {Element} element to check for shadow root
@@ -55,9 +54,9 @@ var getCandidates = function getCandidates(el, includeContainer, filter) {
  */
 
 /**
- * @typedef {Object} CandidatesScope
- * @property {Element} scope contains inner candidates
- * @property {Element[]} candidates
+ * @typedef {Object} CandidateScope
+ * @property {Element} scopeParent contains inner candidates
+ * @property {Element[]} candidates list of candidates found in the scope parent
  */
 
 /**
@@ -66,7 +65,7 @@ var getCandidates = function getCandidates(el, includeContainer, filter) {
  *  if a function, implies shadow support is enabled and either returns the shadow root of an element
  *  or a boolean stating if it has an undisclosed shadow root
  * @property {(node: Element) => boolean} filter filter candidates
- * @property {boolean} flatten if true then result will flatten any CandidatesScope into the returned list
+ * @property {boolean} flatten if true then result will flatten any CandidateScope into the returned list
  * @property {ShadowRootFilter} shadowRootFilter filter shadow roots;
  */
 
@@ -74,44 +73,38 @@ var getCandidates = function getCandidates(el, includeContainer, filter) {
  * @param {Element[]} elements list of element containers to match candidates from
  * @param {boolean} includeContainer add container list to check
  * @param {IterativeOptions} options
- * @returns {Array.<Element|CandidatesScope>}
+ * @returns {Array.<Element|CandidateScope>}
  */
-
-
 var getCandidatesIteratively = function getCandidatesIteratively(elements, includeContainer, options) {
   var candidates = [];
   var elementsToCheck = Array.from(elements);
-
   while (elementsToCheck.length) {
     var element = elementsToCheck.shift();
-
     if (element.tagName === 'SLOT') {
       // add shadow dom slot scope (slot itself cannot be focusable)
       var assigned = element.assignedElements();
       var content = assigned.length ? assigned : element.children;
       var nestedCandidates = getCandidatesIteratively(content, true, options);
-
       if (options.flatten) {
         candidates.push.apply(candidates, nestedCandidates);
       } else {
         candidates.push({
-          scope: element,
+          scopeParent: element,
           candidates: nestedCandidates
         });
       }
     } else {
       // check candidate element
       var validCandidate = matches.call(element, candidateSelector);
-
       if (validCandidate && options.filter(element) && (includeContainer || !elements.includes(element))) {
         candidates.push(element);
-      } // iterate over shadow content if possible
-
+      }
 
-      var shadowRoot = element.shadowRoot || // check for an undisclosed shadow
+      // iterate over shadow content if possible
+      var shadowRoot = element.shadowRoot ||
+      // check for an undisclosed shadow
       typeof options.getShadowRoot === 'function' && options.getShadowRoot(element);
       var validShadowRoot = !options.shadowRootFilter || options.shadowRootFilter(element);
-
       if (shadowRoot && validShadowRoot) {
         // add shadow dom scope IIF a shadow root node was given; otherwise, an undisclosed
         //  shadow exists, so look at light dom children as fallback BUT create a scope for any
@@ -120,12 +113,11 @@ var getCandidatesIteratively = function getCandidatesIteratively(elements, inclu
         //  slotted somewhere _inside_ the undisclosed shadow) -- the scope is created below,
         //  _after_ we return from this recursive call
         var _nestedCandidates = getCandidatesIteratively(shadowRoot === true ? element.children : shadowRoot.children, true, options);
-
         if (options.flatten) {
           candidates.push.apply(candidates, _nestedCandidates);
         } else {
           candidates.push({
-            scope: element,
+            scopeParent: element,
             candidates: _nestedCandidates
           });
         }
@@ -136,10 +128,8 @@ var getCandidatesIteratively = function getCandidatesIteratively(elements, inclu
       }
     }
   }
-
   return candidates;
 };
-
 var getTabindex = function getTabindex(node, isScope) {
   if (node.tabIndex < 0) {
     // in Chrome, <details/>, <audio controls/> and <video controls/> elements get a default
@@ -157,29 +147,23 @@ var getTabindex = function getTabindex(node, isScope) {
       return 0;
     }
   }
-
   return node.tabIndex;
 };
-
 var sortOrderedTabbables = function sortOrderedTabbables(a, b) {
   return a.tabIndex === b.tabIndex ? a.documentOrder - b.documentOrder : a.tabIndex - b.tabIndex;
 };
-
 var isInput = function isInput(node) {
   return node.tagName === 'INPUT';
 };
-
 var isHiddenInput = function isHiddenInput(node) {
   return isInput(node) && node.type === 'hidden';
 };
-
 var isDetailsWithSummary = function isDetailsWithSummary(node) {
   var r = node.tagName === 'DETAILS' && Array.prototype.slice.apply(node.children).some(function (child) {
     return child.tagName === 'SUMMARY';
   });
   return r;
 };
-
 var getCheckedRadio = function getCheckedRadio(nodes, form) {
   for (var i = 0; i < nodes.length; i++) {
     if (nodes[i].checked && nodes[i].form === form) {
@@ -187,20 +171,15 @@ var getCheckedRadio = function getCheckedRadio(nodes, form) {
     }
   }
 };
-
 var isTabbableRadio = function isTabbableRadio(node) {
   if (!node.name) {
     return true;
   }
-
   var radioScope = node.form || getRootNode(node);
-
   var queryRadios = function queryRadios(name) {
     return radioScope.querySelectorAll('input[type="radio"][name="' + name + '"]');
   };
-
   var radioSet;
-
   if (typeof window !== 'undefined' && typeof window.CSS !== 'undefined' && typeof window.CSS.escape === 'function') {
     radioSet = queryRadios(window.CSS.escape(node.name));
   } else {
@@ -212,31 +191,59 @@ var isTabbableRadio = function isTabbableRadio(node) {
       return false;
     }
   }
-
   var checked = getCheckedRadio(radioSet, node.form);
   return !checked || checked === node;
 };
-
 var isRadio = function isRadio(node) {
   return isInput(node) && node.type === 'radio';
 };
-
 var isNonTabbableRadio = function isNonTabbableRadio(node) {
   return isRadio(node) && !isTabbableRadio(node);
 };
 
+// determines if a node is ultimately attached to the window's document
+var isNodeAttached = function isNodeAttached(node) {
+  var _nodeRootHost;
+  // The root node is the shadow root if the node is in a shadow DOM; some document otherwise
+  //  (but NOT _the_ document; see second 'If' comment below for more).
+  // If rootNode is shadow root, it'll have a host, which is the element to which the shadow
+  //  is attached, and the one we need to check if it's in the document or not (because the
+  //  shadow, and all nodes it contains, is never considered in the document since shadows
+  //  behave like self-contained DOMs; but if the shadow's HOST, which is part of the document,
+  //  is hidden, or is not in the document itself but is detached, it will affect the shadow's
+  //  visibility, including all the nodes it contains). The host could be any normal node,
+  //  or a custom element (i.e. web component). Either way, that's the one that is considered
+  //  part of the document, not the shadow root, nor any of its children (i.e. the node being
+  //  tested).
+  // To further complicate things, we have to look all the way up until we find a shadow HOST
+  //  that is attached (or find none) because the node might be in nested shadows...
+  // If rootNode is not a shadow root, it won't have a host, and so rootNode should be the
+  //  document (per the docs) and while it's a Document-type object, that document does not
+  //  appear to be the same as the node's `ownerDocument` for some reason, so it's safer
+  //  to ignore the rootNode at this point, and use `node.ownerDocument`. Otherwise,
+  //  using `rootNode.contains(node)` will _always_ be true we'll get false-positives when
+  //  node is actually detached.
+  var nodeRootHost = getRootNode(node).host;
+  var attached = !!((_nodeRootHost = nodeRootHost) !== null && _nodeRootHost !== void 0 && _nodeRootHost.ownerDocument.contains(nodeRootHost) || node.ownerDocument.contains(node));
+  while (!attached && nodeRootHost) {
+    var _nodeRootHost2;
+    // since it's not attached and we have a root host, the node MUST be in a nested shadow DOM,
+    //  which means we need to get the host's host and check if that parent host is contained
+    //  in (i.e. attached to) the document
+    nodeRootHost = getRootNode(nodeRootHost).host;
+    attached = !!((_nodeRootHost2 = nodeRootHost) !== null && _nodeRootHost2 !== void 0 && _nodeRootHost2.ownerDocument.contains(nodeRootHost));
+  }
+  return attached;
+};
 var isZeroArea = function isZeroArea(node) {
   var _node$getBoundingClie = node.getBoundingClientRect(),
-      width = _node$getBoundingClie.width,
-      height = _node$getBoundingClie.height;
-
+    width = _node$getBoundingClie.width,
+    height = _node$getBoundingClie.height;
   return width === 0 && height === 0;
 };
-
 var isHidden = function isHidden(node, _ref) {
   var displayCheck = _ref.displayCheck,
-      getShadowRoot = _ref.getShadowRoot;
-
+    getShadowRoot = _ref.getShadowRoot;
   // NOTE: visibility will be `undefined` if node is detached from the document
   //  (see notes about this further down), which means we will consider it visible
   //  (this is legacy behavior from a very long way back)
@@ -245,44 +252,19 @@ var isHidden = function isHidden(node, _ref) {
   if (getComputedStyle(node).visibility === 'hidden') {
     return true;
   }
-
   var isDirectSummary = matches.call(node, 'details>summary:first-of-type');
   var nodeUnderDetails = isDirectSummary ? node.parentElement : node;
-
   if (matches.call(nodeUnderDetails, 'details:not([open]) *')) {
     return true;
-  } // The root node is the shadow root if the node is in a shadow DOM; some document otherwise
-  //  (but NOT _the_ document; see second 'If' comment below for more).
-  // If rootNode is shadow root, it'll have a host, which is the element to which the shadow
-  //  is attached, and the one we need to check if it's in the document or not (because the
-  //  shadow, and all nodes it contains, is never considered in the document since shadows
-  //  behave like self-contained DOMs; but if the shadow's HOST, which is part of the document,
-  //  is hidden, or is not in the document itself but is detached, it will affect the shadow's
-  //  visibility, including all the nodes it contains). The host could be any normal node,
-  //  or a custom element (i.e. web component). Either way, that's the one that is considered
-  //  part of the document, not the shadow root, nor any of its children (i.e. the node being
-  //  tested).
-  // If rootNode is not a shadow root, it won't have a host, and so rootNode should be the
-  //  document (per the docs) and while it's a Document-type object, that document does not
-  //  appear to be the same as the node's `ownerDocument` for some reason, so it's safer
-  //  to ignore the rootNode at this point, and use `node.ownerDocument`. Otherwise,
-  //  using `rootNode.contains(node)` will _always_ be true we'll get false-positives when
-  //  node is actually detached.
-
-
-  var nodeRootHost = getRootNode(node).host;
-  var nodeIsAttached = (nodeRootHost === null || nodeRootHost === void 0 ? void 0 : nodeRootHost.ownerDocument.contains(nodeRootHost)) || node.ownerDocument.contains(node);
-
-  if (!displayCheck || displayCheck === 'full') {
+  }
+  if (!displayCheck || displayCheck === 'full' || displayCheck === 'legacy-full') {
     if (typeof getShadowRoot === 'function') {
       // figure out if we should consider the node to be in an undisclosed shadow and use the
       //  'non-zero-area' fallback
       var originalNode = node;
-
       while (node) {
         var parentElement = node.parentElement;
         var rootNode = getRootNode(node);
-
         if (parentElement && !parentElement.shadowRoot && getShadowRoot(parentElement) === true // check if there's an undisclosed shadow
         ) {
           // node has an undisclosed shadow which means we can only treat it as a black box, so we
@@ -299,25 +281,27 @@ var isHidden = function isHidden(node, _ref) {
           node = parentElement;
         }
       }
-
       node = originalNode;
-    } // else, `getShadowRoot` might be true, but all that does is enable shadow DOM support
+    }
+    // else, `getShadowRoot` might be true, but all that does is enable shadow DOM support
     //  (i.e. it does not also presume that all nodes might have undisclosed shadows); or
     //  it might be a falsy value, which means shadow DOM support is disabled
+
     // Since we didn't find it sitting in an undisclosed shadow (or shadows are disabled)
     //  now we can just test to see if it would normally be visible or not, provided it's
     //  attached to the main document.
     // NOTE: We must consider case where node is inside a shadow DOM and given directly to
     //  `isTabbable()` or `isFocusable()` -- regardless of `getShadowRoot` option setting.
 
-
-    if (nodeIsAttached) {
+    if (isNodeAttached(node)) {
       // this works wherever the node is: if there's at least one client rect, it's
       //  somehow displayed; it also covers the CSS 'display: contents' case where the
       //  node itself is hidden in place of its contents; and there's no need to search
       //  up the hierarchy either
       return !node.getClientRects().length;
-    } // Else, the node isn't attached to the document, which means the `getClientRects()`
+    }
+
+    // Else, the node isn't attached to the document, which means the `getClientRects()`
     //  API will __always__ return zero rects (this can happen, for example, if React
     //  is used to render nodes onto a detached tree, as confirmed in this thread:
     //  https://github.com/facebook/react/issues/9117#issuecomment-284228870)
@@ -330,7 +314,13 @@ var isHidden = function isHidden(node, _ref) {
     //  APIs on nodes in detached containers has actually implicitly used tabbable in what
     //  was later (as of v5.2.0 on Apr 9, 2021) called `displayCheck="none"` mode -- essentially
     //  considering __everything__ to be visible because of the innability to determine styles.
-
+    //
+    // v6.0.0: As of this major release, the default 'full' option __no longer treats detached
+    //  nodes as visible with the 'none' fallback.__
+    if (displayCheck !== 'legacy-full') {
+      return true; // hidden
+    }
+    // else, fallback to 'none' mode and consider the node visible
   } else if (displayCheck === 'non-zero-area') {
     // NOTE: Even though this tests that the node's client rect is non-zero to determine
     //  whether it's displayed, and that a detached node will __always__ have a zero-area
@@ -338,88 +328,79 @@ var isHidden = function isHidden(node, _ref) {
     //  this mode, we do want to consider nodes that have a zero area to be hidden at all
     //  times, and that includes attached or not.
     return isZeroArea(node);
-  } // visible, as far as we can tell, or per current `displayCheck` mode
-
+  }
 
+  // visible, as far as we can tell, or per current `displayCheck=none` mode, we assume
+  //  it's visible
   return false;
-}; // form fields (nested) inside a disabled fieldset are not focusable/tabbable
+};
+
+// form fields (nested) inside a disabled fieldset are not focusable/tabbable
 //  unless they are in the _first_ <legend> element of the top-most disabled
 //  fieldset
-
-
 var isDisabledFromFieldset = function isDisabledFromFieldset(node) {
   if (/^(INPUT|BUTTON|SELECT|TEXTAREA)$/.test(node.tagName)) {
-    var parentNode = node.parentElement; // check if `node` is contained in a disabled <fieldset>
-
+    var parentNode = node.parentElement;
+    // check if `node` is contained in a disabled <fieldset>
     while (parentNode) {
       if (parentNode.tagName === 'FIELDSET' && parentNode.disabled) {
         // look for the first <legend> among the children of the disabled <fieldset>
         for (var i = 0; i < parentNode.children.length; i++) {
-          var child = parentNode.children.item(i); // when the first <legend> (in document order) is found
-
+          var child = parentNode.children.item(i);
+          // when the first <legend> (in document order) is found
           if (child.tagName === 'LEGEND') {
             // if its parent <fieldset> is not nested in another disabled <fieldset>,
             // return whether `node` is a descendant of its first <legend>
             return matches.call(parentNode, 'fieldset[disabled] *') ? true : !child.contains(node);
           }
-        } // the disabled <fieldset> containing `node` has no <legend>
-
-
+        }
+        // the disabled <fieldset> containing `node` has no <legend>
         return true;
       }
-
       parentNode = parentNode.parentElement;
     }
-  } // else, node's tabbable/focusable state should not be affected by a fieldset's
-  //  enabled/disabled state
-
+  }
 
+  // else, node's tabbable/focusable state should not be affected by a fieldset's
+  //  enabled/disabled state
   return false;
 };
-
 var isNodeMatchingSelectorFocusable = function isNodeMatchingSelectorFocusable(options, node) {
-  if (node.disabled || isHiddenInput(node) || isHidden(node, options) || // For a details element with a summary, the summary element gets the focus
+  if (node.disabled || isHiddenInput(node) || isHidden(node, options) ||
+  // For a details element with a summary, the summary element gets the focus
   isDetailsWithSummary(node) || isDisabledFromFieldset(node)) {
     return false;
   }
-
   return true;
 };
-
 var isNodeMatchingSelectorTabbable = function isNodeMatchingSelectorTabbable(options, node) {
   if (isNonTabbableRadio(node) || getTabindex(node) < 0 || !isNodeMatchingSelectorFocusable(options, node)) {
     return false;
   }
-
   return true;
 };
-
 var isValidShadowRootTabbable = function isValidShadowRootTabbable(shadowHostNode) {
   var tabIndex = parseInt(shadowHostNode.getAttribute('tabindex'), 10);
-
   if (isNaN(tabIndex) || tabIndex >= 0) {
     return true;
-  } // If a custom element has an explicit negative tabindex,
+  }
+  // If a custom element has an explicit negative tabindex,
   // browsers will not allow tab targeting said element's children.
-
-
   return false;
 };
+
 /**
- * @param {Array.<Element|CandidatesScope>} candidates
+ * @param {Array.<Element|CandidateScope>} candidates
  * @returns Element[]
  */
-
-
 var sortByOrder = function sortByOrder(candidates) {
   var regularTabbables = [];
   var orderedTabbables = [];
   candidates.forEach(function (item, i) {
-    var isScope = !!item.scope;
-    var element = isScope ? item.scope : item;
+    var isScope = !!item.scopeParent;
+    var element = isScope ? item.scopeParent : item;
     var candidateTabindex = getTabindex(element, isScope);
     var elements = isScope ? sortByOrder(item.candidates) : element;
-
     if (candidateTabindex === 0) {
       isScope ? regularTabbables.push.apply(regularTabbables, elements) : regularTabbables.push(element);
     } else {
@@ -437,11 +418,9 @@ var sortByOrder = function sortByOrder(candidates) {
     return acc;
   }, []).concat(regularTabbables);
 };
-
 var tabbable = function tabbable(el, options) {
   options = options || {};
   var candidates;
-
   if (options.getShadowRoot) {
     candidates = getCandidatesIteratively([el], options.includeContainer, {
       filter: isNodeMatchingSelectorTabbable.bind(null, options),
@@ -452,66 +431,65 @@ var tabbable = function tabbable(el, options) {
   } else {
     candidates = getCandidates(el, options.includeContainer, isNodeMatchingSelectorTabbable.bind(null, options));
   }
-
   return sortByOrder(candidates);
 };
 
-let key = 0;
-/**
- * Trap the focus inside a specific container by prepending/appending two focus trap
- * input boxes who return the focus into the container.
- *
- * @param props active: activate or deactivate the focus trap
- * @param children Child nodes
- * @returns
- */
-const FocusTrap = (props, children) => {
-  var _a;
-  // Default value for active is true
-  const active = (_a = props.active) !== null && _a !== void 0 ? _a : false;
-  const handleFocusIn = (event, mode) => {
-    if (!children.length) {
-      return;
-    }
-    // Try to get a list of tabbable elements
-    const containerIndex = mode === 'first' ? 0 : children.length - 1;
-    const container = children[containerIndex].$elm$;
-    const focusable = tabbable(container);
-    if (!focusable.length) {
-      return;
-    }
-    // We can trap the focus, cancel the event
-    event.preventDefault();
-    event.stopPropagation();
-    // Select the appropriate element from the list
-    const focusIndex = mode === 'first' ? 0 : focusable.length - 1;
-    let focusElement = focusable[focusIndex];
-    focusElement.focus();
-  };
-  key++;
-  return [
-    index.h("input", { type: "text", "aria-hidden": "true", class: "visually-hidden", key: `focus-trap-before-${key}`, onFocusin: e => active && handleFocusIn(e, 'last') }),
-    children,
-    index.h("input", { type: "text", "aria-hidden": "true", class: "visually-hidden", key: `focus-trap-after-${key}`, onFocusin: e => active && handleFocusIn(e, 'first') }),
-  ];
+let key = 0;
+/**
+ * Trap the focus inside a specific container by prepending/appending two focus trap
+ * input boxes who return the focus into the container.
+ *
+ * @param props active: activate or deactivate the focus trap
+ * @param children Child nodes
+ * @returns
+ */
+const FocusTrap = (props, children) => {
+  var _a;
+  // Default value for active is true
+  const active = (_a = props.active) !== null && _a !== void 0 ? _a : false;
+  const handleFocusIn = (event, mode) => {
+    if (!children.length) {
+      return;
+    }
+    // Try to get a list of tabbable elements
+    const containerIndex = mode === 'first' ? 0 : children.length - 1;
+    const container = children[containerIndex].$elm$;
+    const focusable = tabbable(container);
+    if (!focusable.length) {
+      return;
+    }
+    // We can trap the focus, cancel the event
+    event.preventDefault();
+    event.stopPropagation();
+    // Select the appropriate element from the list
+    const focusIndex = mode === 'first' ? 0 : focusable.length - 1;
+    let focusElement = focusable[focusIndex];
+    focusElement.focus();
+  };
+  key++;
+  return [
+    index.h("input", { type: "text", "aria-hidden": "true", class: "visually-hidden", key: `focus-trap-before-${key}`, onFocusin: e => active && handleFocusIn(e, 'last') }),
+    children,
+    index.h("input", { type: "text", "aria-hidden": "true", class: "visually-hidden", key: `focus-trap-after-${key}`, onFocusin: e => active && handleFocusIn(e, 'first') }),
+  ];
 };
 
-/**
- * Overlay implementation with focus trap according to
- * https://www.accessibility-developer-guide.com/examples/widgets/dialog/#modal-dialog
- *
- * @param props
- * @returns
- */
-const OverlayComponent = (props) => (index.h("div", { class: "overlay", onClick: () => props.onClick(), onKeyDown: e => props.onKeyDown !== undefined && props.onKeyDown(e), ref: e => e !== undefined && props.overlayRef(e) },
-  index.h("div", { class: "container", role: "dialog" },
-    index.h(FocusTrap, null,
-      index.h("div", { class: "overlay-container", tabindex: "-1" /* For initial focus */, role: "document", onClick: e => e.stopPropagation() },
-        index.h("button", { class: `overlay-close btn-blank d-inline-flex align-items-center nav-link ${props.overlay.id}`, onClick: () => props.onClick() },
-          index.h("span", { class: "visually-hidden" }, props.closeButtonText),
-          index.h(svgIcon_component.SvgIcon, { name: "pi-close" })),
-        index.h("iframe", { src: props.overlay.target, frameborder: "0", class: "frame", ref: e => e !== undefined && props.iFrameRef(e) }))),
-    index.h("div", { class: "loader-wrapper" },
+/**
+ * Overlay implementation with focus trap according to
+ * https://www.accessibility-developer-guide.com/examples/widgets/dialog/#modal-dialog
+ *
+ * @param props
+ * @returns
+ */
+const OverlayComponent = (props) => (index.h("div", { class: "overlay", onClick: () => props.onClick(), onKeyDown: e => props.onKeyDown !== undefined && props.onKeyDown(e), ref: e => e !== undefined && props.overlayRef(e) },
+  index.h("div", { class: "container", role: "dialog" },
+    index.h(FocusTrap, null,
+      index.h("div", { class: "overlay-container", tabindex: "-1" /* For initial focus */, role: "document", onClick: e => e.stopPropagation() },
+        index.h("button", { class: `overlay-close btn-blank d-inline-flex align-items-center nav-link ${props.overlay.id}`, onClick: () => props.onClick() },
+          index.h("span", { class: "visually-hidden" }, props.closeButtonText),
+          index.h(svgIcon_component.SvgIcon, { name: "pi-close" })),
+        index.h("iframe", { src: props.overlay.target, frameborder: "0", class: "frame", ref: e => e !== undefined && props.iFrameRef(e) }))),
+    index.h("div", { class: "loader-wrapper" },
       index.h("div", { class: "loader" })))));
 
 var iframeResizer$2 = _commonjsHelpers.createCommonjsModule(function (module) {
@@ -3252,235 +3230,235 @@ var js = {
 
 var iframeResizer = js;
 
-const MiddleLinks = (props) => {
-  return props.items.slice(1, -1).map(item => (index.h("li", { key: item.url },
-    index.h("a", { href: item.url, class: "nav-link", tabindex: props.focusable === false ? '-1' : undefined },
-      index.h("span", null, item.text)),
-    props.icons ? index.h(svgIcon_component.SvgIcon, { name: "pi-arrow-down", classNames: "rotate-270" }) : null)));
+const MiddleLinks = (props) => {
+  return props.items.slice(1, -1).map(item => (index.h("li", { key: item.url },
+    index.h("a", { href: item.url, class: "nav-link", tabindex: props.focusable === false ? '-1' : undefined },
+      index.h("span", null, item.text)),
+    props.icons ? index.h(svgIcon_component.SvgIcon, { name: "pi-arrow-down", classNames: "rotate-270" }) : null)));
 };
 
-const MiddleDropdown = (props) => {
-  return (index.h("div", { class: "middle-dropdown-container" },
-    index.h("button", { class: "middle-dropdown-button btn btn-blank", type: "button", onClick: event => props.clickHandler(event), tabindex: props.focusable === false ? '-1' : undefined },
-      index.h("span", { class: "visually-hidden" }, language_service.translate('Open menu')),
-      index.h("span", { "aria-hidden": "true" }, "...")),
-    index.h(svgIcon_component.SvgIcon, { name: "pi-arrow-down", classNames: "rotate-270" }),
-    props.dropdownOpen ? (index.h("nav", { class: "middle-dropdown" },
-      index.h("ul", { class: "no-list" },
-        index.h(MiddleLinks, { items: props.items, icons: false, focusable: props.focusable })))) : null));
+const MiddleDropdown = (props) => {
+  return (index.h("div", { class: "middle-dropdown-container" },
+    index.h("button", { class: "middle-dropdown-button btn btn-blank", type: "button", onClick: event => props.clickHandler(event), tabindex: props.focusable === false ? '-1' : undefined },
+      index.h("span", { class: "visually-hidden" }, language_service.translate('Open menu')),
+      index.h("span", { "aria-hidden": "true" }, "...")),
+    index.h(svgIcon_component.SvgIcon, { name: "pi-arrow-down", classNames: "rotate-270" }),
+    props.dropdownOpen ? (index.h("nav", { class: "middle-dropdown" },
+      index.h("ul", { class: "no-list" },
+        index.h(MiddleLinks, { items: props.items, icons: false, focusable: props.focusable })))) : null));
 };
 
-const BreadcrumbList = (props) => {
-  var _a;
-  const homeItem = props.items[0];
-  const lastItem = props.items[props.items.length - 1];
-  return (index.h("ol", { class: "no-list breadcrumbs-list" },
-    index.h("li", null,
-      index.h("a", { class: "home-link nav-link", href: homeItem.url, tabindex: props.focusable === false ? '-1' : undefined },
-        index.h("span", { class: "visually-hidden" }, homeItem.text),
-        index.h(svgIcon_component.SvgIcon, { name: "pi-home" })),
-      index.h(svgIcon_component.SvgIcon, { name: "pi-arrow-down", classNames: "rotate-270" })),
-    props.isConcatenated ? (index.h("li", null,
-      index.h(MiddleDropdown, { items: props.items, dropdownOpen: (_a = props.dropdownOpen) !== null && _a !== void 0 ? _a : false, clickHandler: e => props.clickHandler(e), focusable: props.focusable }))) : (index.h(MiddleLinks, { items: props.items, icons: true, focusable: props.focusable })),
-    index.h("li", null,
-      index.h("a", { class: "last-link nav-link", href: lastItem.url, tabindex: props.focusable === false ? '-1' : undefined, ref: el => (props.lastItemRef !== undefined ? props.lastItemRef(el) : null) }, lastItem.text))));
+const BreadcrumbList = (props) => {
+  var _a;
+  const homeItem = props.items[0];
+  const lastItem = props.items[props.items.length - 1];
+  return (index.h("ol", { class: "no-list breadcrumbs-list" },
+    index.h("li", null,
+      index.h("a", { class: "home-link nav-link", href: homeItem.url, tabindex: props.focusable === false ? '-1' : undefined },
+        index.h("span", { class: "visually-hidden" }, homeItem.text),
+        index.h(svgIcon_component.SvgIcon, { name: "pi-home" })),
+      index.h(svgIcon_component.SvgIcon, { name: "pi-arrow-down", classNames: "rotate-270" })),
+    props.isConcatenated ? (index.h("li", null,
+      index.h(MiddleDropdown, { items: props.items, dropdownOpen: (_a = props.dropdownOpen) !== null && _a !== void 0 ? _a : false, clickHandler: e => props.clickHandler(e), focusable: props.focusable }))) : (index.h(MiddleLinks, { items: props.items, icons: true, focusable: props.focusable })),
+    index.h("li", null,
+      index.h("a", { class: "last-link nav-link", href: lastItem.url, tabindex: props.focusable === false ? '-1' : undefined, ref: el => (props.lastItemRef !== undefined ? props.lastItemRef(el) : null) }, lastItem.text))));
 };
 
 const postInternetBreadcrumbsCss = "/*!\n * Bootstrap Utilities v5.1.3 (https://getbootstrap.com/)\n * Copyright 2011-2021 The Bootstrap Authors\n * Copyright 2011-2021 Twitter, Inc.\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)\n\n * The MIT License (MIT)\n\n * Copyright (c) 2011-2020 Twitter, Inc.\n * Copyright (c) 2011-2020 The Bootstrap Authors\n\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n\n * The above copyright notice and this permission notice shall be included in\n * all copies or substantial portions of the Software.\n\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n * THE SOFTWARE.\n */.btn-close{-webkit-box-sizing:content-box;box-sizing:content-box;width:1.5rem;height:1.5rem;padding:1rem 1rem;color:#000;background:transparent url(\"data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23000000' d='M16.267 16.667l6.667-6.533-0.933-1.067-6.667 6.667-6.667-6.667-0.933 1.067 6.667 6.533-6.667 6.667 1.067 0.933 6.533-6.667 6.667 6.667 0.933-1.067z'%3E%3C/path%3E%3C/svg%3E\") center/1.5rem auto no-repeat;border:0;border-radius:3px;opacity:0.5}.btn-close:hover{color:#000;text-decoration:none;opacity:0.75}.btn-close:focus{outline:0;-webkit-box-shadow:0 0 0 0.125rem rgba(51, 51, 51, 0.25);box-shadow:0 0 0 0.125rem rgba(51, 51, 51, 0.25);opacity:1}.btn-close:disabled,.btn-close.disabled{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:0.25}.btn-close-white{-webkit-filter:invert(1) grayscale(100%) brightness(200%);filter:invert(1) grayscale(100%) brightness(200%)}.btn-close{height:unset;min-height:1.5rem}@media (forced-colors: active), (-ms-high-contrast: active), (-ms-high-contrast: white-on-black){.btn-close{opacity:1;background:transparent url(\"data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23ffffff' d='M16.267 16.667l6.667-6.533-0.933-1.067-6.667 6.667-6.667-6.667-0.933 1.067 6.667 6.533-6.667 6.667 1.067 0.933 6.533-6.667 6.667 6.667 0.933-1.067z'%3E%3C/path%3E%3C/svg%3E\") center/1.5rem auto no-repeat}}.btn-close:focus{outline:2px solid var(--post-contrast-color);-webkit-box-shadow:none;box-shadow:none}.btn-close:focus:not(:focus-visible){outline:0}@media (forced-colors: active), (-ms-high-contrast: active), (-ms-high-contrast: white-on-black){.btn-close-white{-webkit-filter:none;filter:none}}.btn-default,.btn-secondary{border:2px solid rgba(var(--post-contrast-color-rgb), 0.2)}.btn-default:focus,.btn-secondary:focus,.btn-default:not(:disabled):hover,.btn-secondary:not(:disabled):hover,.pretend-hover.btn-default,.pretend-hover.btn-secondary{border-color:var(--post-contrast-color);color:var(--post-contrast-color)}:is(.bg-dark,.bg-primary,.bg-black,.bg-success,.bg-danger,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-petrol-bright,.bg-coral,.bg-coral-bright,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright) .btn-default,:is(.bg-dark,.bg-primary,.bg-black,.bg-success,.bg-danger,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-petrol-bright,.bg-coral,.bg-coral-bright,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright) .btn-secondary{border-color:var(--post-contrast-color)}:is(.bg-dark,.bg-primary,.bg-black,.bg-success,.bg-danger,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-petrol-bright,.bg-coral,.bg-coral-bright,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright) .btn-default:focus,:is(.bg-dark,.bg-primary,.bg-black,.bg-success,.bg-danger,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-petrol-bright,.bg-coral,.bg-coral-bright,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright) .btn-secondary:focus,:is(.bg-dark,.bg-primary,.bg-black,.bg-success,.bg-danger,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-petrol-bright,.bg-coral,.bg-coral-bright,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright) .btn-default:not(:disabled):hover,:is(.bg-dark,.bg-primary,.bg-black,.bg-success,.bg-danger,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-petrol-bright,.bg-coral,.bg-coral-bright,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright) .btn-secondary:not(:disabled):hover,:is(.bg-dark,.bg-primary,.bg-black,.bg-success,.bg-danger,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-petrol-bright,.bg-coral,.bg-coral-bright,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright) .pretend-hover.btn-default,:is(.bg-dark,.bg-primary,.bg-black,.bg-success,.bg-danger,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-petrol-bright,.bg-coral,.bg-coral-bright,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright) .pretend-hover.btn-secondary{border-color:rgba(var(--post-contrast-color-rgb), 0.4)}.btn-default:disabled,.btn-secondary:disabled{border-color:rgba(var(--post-contrast-color-rgb), 0.4);color:rgba(var(--post-contrast-color-rgb), 0.6)}.btn{min-height:3rem;padding:0 2rem;font-size:1rem;gap:1rem;outline:none;outline-offset:2px;display:-ms-inline-flexbox;display:inline-flex;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;max-width:100%;overflow:hidden;-webkit-transition:opacity 250ms, border-color 250ms, background-color 250ms, color 250ms;transition:opacity 250ms, border-color 250ms, background-color 250ms, color 250ms;border-width:2px;border-style:solid;border-radius:3px;background-color:transparent;-webkit-box-shadow:none;box-shadow:none;color:var(--post-contrast-color);font-family:inherit;font-weight:400;line-height:inherit;text-decoration:none !important;white-space:nowrap}.btn>.pi{width:1.25rem;height:1.25rem}.btn:is(:focus-visible,:focus-within,.pretend-focus){outline:2px solid var(--post-contrast-color)}.btn-primary{border-color:transparent;background-color:rgba(var(--post-contrast-color-rgb), 0.8);color:var(--post-contrast-color-inverted)}.btn-primary:focus,.btn-primary:not(:disabled):hover,.btn-primary.pretend-hover{background-color:var(--post-contrast-color);color:var(--post-contrast-color-inverted)}:is(.bg-dark,.bg-primary,.bg-black,.bg-success,.bg-danger,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-petrol-bright,.bg-coral,.bg-coral-bright,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright) .btn-primary{background-color:var(--post-contrast-color)}:is(.bg-dark,.bg-primary,.bg-black,.bg-success,.bg-danger,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-petrol-bright,.bg-coral,.bg-coral-bright,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright) .btn-primary:focus,:is(.bg-dark,.bg-primary,.bg-black,.bg-success,.bg-danger,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-petrol-bright,.bg-coral,.bg-coral-bright,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright) .btn-primary:not(:disabled):hover,:is(.bg-dark,.bg-primary,.bg-black,.bg-success,.bg-danger,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-petrol-bright,.bg-coral,.bg-coral-bright,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright) .btn-primary.pretend-hover{background-color:rgba(var(--post-contrast-color-rgb), 0.8)}:is(.bg-dark,.bg-primary,.bg-black,.bg-success,.bg-danger,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-petrol-bright,.bg-coral,.bg-coral-bright,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright) .btn-primary .pi{-webkit-filter:invert(0);filter:invert(0)}@media (forced-colors: active), (-ms-high-contrast: active), (-ms-high-contrast: white-on-black){.btn-primary{border-color:var(--post-contrast-color);background-color:ButtonFace}.btn-primary:not(:disabled,.disabled):hover,.btn-primary:not(:disabled,.disabled):focus-visible{border-color:highlight}.btn-primary .pi{-webkit-filter:invert(1) !important;filter:invert(1) !important}}.btn-primary:disabled{background-color:rgba(var(--post-contrast-color-rgb), 0.4)}.btn-primary .pi{-webkit-filter:invert(1);filter:invert(1);forced-color-adjust:none}:is(.bg-dark,.bg-primary,.bg-black,.bg-success,.bg-danger,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-petrol-bright,.bg-coral,.bg-coral-bright,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright) .btn-default .pi,:is(.bg-dark,.bg-primary,.bg-black,.bg-success,.bg-danger,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-petrol-bright,.bg-coral,.bg-coral-bright,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright) .btn-secondary .pi{-webkit-filter:invert(1);filter:invert(1)}.btn-link,.btn-tertiary{border:0;padding-right:0.375rem;padding-left:0.375rem}.btn-link:focus,.btn-link:not(:disabled):hover,.btn-link.pretend-hover,.btn-tertiary:focus,.btn-tertiary:not(:disabled):hover,.btn-tertiary.pretend-hover{color:rgba(var(--post-contrast-color-rgb), 0.8)}.btn-link:disabled,.btn-tertiary:disabled{color:rgba(var(--post-contrast-color-rgb), 0.6)}@media (forced-colors: active), (-ms-high-contrast: active), (-ms-high-contrast: white-on-black){.btn-link,.btn-tertiary{color:linktext;text-decoration:underline !important}}.btn-icon{min-width:3rem;padding-right:0.75rem;padding-left:0.75rem}.btn-icon.btn-sm{min-width:2rem;padding-right:0.375rem;padding-left:0.375rem}.btn-icon.btn-rg{min-width:2.5rem;padding-right:0.5625rem;padding-left:0.5625rem}.btn-icon.btn-lg{min-width:3.5rem;padding-right:0.875rem;padding-left:0.875rem}.btn-animated:not(.btn-link,.btn-tertiary)::after{content:\"\";position:absolute;right:1.25rem;width:0.625em;height:0.625em;-webkit-transform:rotateZ(315deg) translate(-2px, -2px);transform:rotateZ(315deg) translate(-2px, -2px);-webkit-transform-origin:center center;transform-origin:center center;-webkit-transition:opacity 250ms, -webkit-transform 250ms;transition:opacity 250ms, -webkit-transform 250ms;transition:opacity 250ms, transform 250ms;transition:opacity 250ms, transform 250ms, -webkit-transform 250ms;border-right:2px solid currentColor;border-bottom:2px solid currentColor;opacity:0}.btn-animated:not(.btn-link,.btn-tertiary).btn-sm::after{right:0.5rem}.btn-animated:not(.btn-link,.btn-tertiary).btn-rg::after{right:0.875rem}.btn-animated:not(.btn-link,.btn-tertiary).btn-lg::after{right:1.5rem}.btn-animated:not(.btn-link,.btn-tertiary)>span{-webkit-transition:-webkit-transform 250ms;transition:-webkit-transform 250ms;transition:transform 250ms;transition:transform 250ms, -webkit-transform 250ms}@media (prefers-reduced-motion: no-preference){.btn-animated:not(.btn-link,.btn-tertiary):focus>span,.btn-animated:not(.btn-link,.btn-tertiary):not(:disabled):hover>span,.btn-animated:not(.btn-link,.btn-tertiary).pretend-hover>span{-webkit-transform:translateX(-0.75rem);transform:translateX(-0.75rem)}.btn-animated:not(.btn-link,.btn-tertiary):focus.btn-sm>span,.btn-animated:not(.btn-link,.btn-tertiary):not(:disabled):hover.btn-sm>span,.btn-animated:not(.btn-link,.btn-tertiary).pretend-hover.btn-sm>span{-webkit-transform:translateX(-0.5rem);transform:translateX(-0.5rem)}.btn-animated:not(.btn-link,.btn-tertiary):focus.btn-rg>span,.btn-animated:not(.btn-link,.btn-tertiary):not(:disabled):hover.btn-rg>span,.btn-animated:not(.btn-link,.btn-tertiary).pretend-hover.btn-rg>span{-webkit-transform:translateX(-0.625rem);transform:translateX(-0.625rem)}.btn-animated:not(.btn-link,.btn-tertiary):focus.btn-lg>span,.btn-animated:not(.btn-link,.btn-tertiary):not(:disabled):hover.btn-lg>span,.btn-animated:not(.btn-link,.btn-tertiary).pretend-hover.btn-lg>span{-webkit-transform:translateX(-1rem);transform:translateX(-1rem)}.btn-animated:not(.btn-link,.btn-tertiary):focus::after,.btn-animated:not(.btn-link,.btn-tertiary):not(:disabled):hover::after,.btn-animated:not(.btn-link,.btn-tertiary).pretend-hover::after{-webkit-transform:rotateZ(315deg) translate(0, 0);transform:rotateZ(315deg) translate(0, 0);opacity:1}.btn-animated:not(.btn-link,.btn-tertiary)>span{-webkit-transform:translateX(0);transform:translateX(0)}}.btn-sm{min-height:2rem;padding:0 1rem;font-size:0.8125rem;gap:0.5rem}.btn-sm>.pi{width:1rem;height:1rem}.btn-rg{min-height:2.5rem;padding:0 1.5rem;font-size:1rem;gap:0.75rem}.btn-rg>.pi{width:1.125rem;height:1.125rem}.btn-lg{min-height:3.5rem;padding:0 2.5rem;font-size:1.0625rem;gap:1.25rem}.btn-lg>.pi{width:1.5rem;height:1.5rem}.btn-nightblue{border-color:transparent;background-color:#004976;color:#fff}.btn-nightblue:focus,.btn-nightblue:not(:disabled):hover,.btn-nightblue.pretend-hover{background-color:#002943}.btn-nightblue-bright{border-color:transparent;background-color:#0076a8;color:#fff}.btn-nightblue-bright:focus,.btn-nightblue-bright:not(:disabled):hover,.btn-nightblue-bright.pretend-hover{background-color:#005275}.btn-petrol{border-color:transparent;background-color:#006d68;color:#fff}.btn-petrol:focus,.btn-petrol:not(:disabled):hover,.btn-petrol.pretend-hover{background-color:#003a37}.btn-petrol-bright{border-color:transparent;background-color:#00968f;color:#fff}.btn-petrol-bright:focus,.btn-petrol-bright:not(:disabled):hover,.btn-petrol-bright.pretend-hover{background-color:#00635e}.btn-coral{border-color:transparent;background-color:#9e2a2f;color:#fff}.btn-coral:focus,.btn-coral:not(:disabled):hover,.btn-coral.pretend-hover{background-color:#761f23}.btn-coral-bright{border-color:transparent;background-color:#e03c31;color:#fff}.btn-coral-bright:focus,.btn-coral-bright:not(:disabled):hover,.btn-coral-bright.pretend-hover{background-color:#c1271d}.btn-olive{border-color:transparent;background-color:#716135;color:#fff}.btn-olive:focus,.btn-olive:not(:disabled):hover,.btn-olive.pretend-hover{background-color:#4e4325}.btn-olive-bright{border-color:transparent;background-color:#aa9d2e}.btn-olive-bright:focus,.btn-olive-bright:not(:disabled):hover,.btn-olive-bright.pretend-hover{background-color:#827823}.btn-purple{border-color:transparent;background-color:#80276c;color:#fff}.btn-purple:focus,.btn-purple:not(:disabled):hover,.btn-purple.pretend-hover{background-color:#591b4b}.btn-purple-bright{border-color:transparent;background-color:#c5299b;color:#fff}.btn-purple-bright:focus,.btn-purple-bright:not(:disabled):hover,.btn-purple-bright.pretend-hover{background-color:#9b207a}.btn-aubergine{border-color:transparent;background-color:#523178;color:#fff}.btn-aubergine:focus,.btn-aubergine:not(:disabled):hover,.btn-aubergine.pretend-hover{background-color:#392254}.btn-aubergine-bright{border-color:transparent;background-color:#7566a0;color:#fff}.btn-aubergine-bright:focus,.btn-aubergine-bright:not(:disabled):hover,.btn-aubergine-bright.pretend-hover{background-color:#5e5182}.btn-success{border-color:transparent;background-color:#2c911c;color:#fff}.btn-success:focus,.btn-success:not(:disabled):hover,.btn-success.pretend-hover{background-color:#1f6614}.btn-info{border-color:transparent;background-color:#fc0}.btn-info:focus,.btn-info:not(:disabled):hover,.btn-info.pretend-hover{background-color:#cca300}.btn-warning{border-color:transparent;background-color:#f49e00}.btn-warning:focus,.btn-warning:not(:disabled):hover,.btn-warning.pretend-hover{background-color:#c17d00}.btn-danger{border-color:transparent;background-color:#a51728;color:#fff}.btn-danger:focus,.btn-danger:not(:disabled):hover,.btn-danger.pretend-hover{background-color:#78111d}.row{--bs-gutter-x:30px;--bs-gutter-y:0;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-top:calc(-1 * var(--bs-gutter-y));margin-right:calc(-0.5 * var(--bs-gutter-x));margin-left:calc(-0.5 * var(--bs-gutter-x))}.row>*{-ms-flex-negative:0;flex-shrink:0;width:100%;max-width:100%;padding-right:calc(var(--bs-gutter-x) * 0.5);padding-left:calc(var(--bs-gutter-x) * 0.5);margin-top:var(--bs-gutter-y)}.col{-ms-flex:1 0 0%;flex:1 0 0%}.row-cols-auto>*{-ms-flex:0 0 auto;flex:0 0 auto;width:auto}.row-cols-1>*{-ms-flex:0 0 auto;flex:0 0 auto;width:100%}.row-cols-2>*{-ms-flex:0 0 auto;flex:0 0 auto;width:50%}.row-cols-3>*{-ms-flex:0 0 auto;flex:0 0 auto;width:33.3333333333%}.row-cols-4>*{-ms-flex:0 0 auto;flex:0 0 auto;width:25%}.row-cols-5>*{-ms-flex:0 0 auto;flex:0 0 auto;width:20%}.row-cols-6>*{-ms-flex:0 0 auto;flex:0 0 auto;width:16.6666666667%}.col-auto{-ms-flex:0 0 auto;flex:0 0 auto;width:auto}.col-1{-ms-flex:0 0 auto;flex:0 0 auto;width:8.33333333%}.col-2{-ms-flex:0 0 auto;flex:0 0 auto;width:16.66666667%}.col-3{-ms-flex:0 0 auto;flex:0 0 auto;width:25%}.col-4{-ms-flex:0 0 auto;flex:0 0 auto;width:33.33333333%}.col-5{-ms-flex:0 0 auto;flex:0 0 auto;width:41.66666667%}.col-6{-ms-flex:0 0 auto;flex:0 0 auto;width:50%}.col-7{-ms-flex:0 0 auto;flex:0 0 auto;width:58.33333333%}.col-8{-ms-flex:0 0 auto;flex:0 0 auto;width:66.66666667%}.col-9{-ms-flex:0 0 auto;flex:0 0 auto;width:75%}.col-10{-ms-flex:0 0 auto;flex:0 0 auto;width:83.33333333%}.col-11{-ms-flex:0 0 auto;flex:0 0 auto;width:91.66666667%}.col-12{-ms-flex:0 0 auto;flex:0 0 auto;width:100%}.offset-1{margin-left:8.33333333%}.offset-2{margin-left:16.66666667%}.offset-3{margin-left:25%}.offset-4{margin-left:33.33333333%}.offset-5{margin-left:41.66666667%}.offset-6{margin-left:50%}.offset-7{margin-left:58.33333333%}.offset-8{margin-left:66.66666667%}.offset-9{margin-left:75%}.offset-10{margin-left:83.33333333%}.offset-11{margin-left:91.66666667%}.g-0,.gx-0{--bs-gutter-x:0}.g-0,.gy-0{--bs-gutter-y:0}.g-1,.gx-1{--bs-gutter-x:0.25rem}.g-1,.gy-1{--bs-gutter-y:0.25rem}.g-2,.gx-2{--bs-gutter-x:0.5rem}.g-2,.gy-2{--bs-gutter-y:0.5rem}.g-3,.gx-3{--bs-gutter-x:1rem}.g-3,.gy-3{--bs-gutter-y:1rem}.g-4,.gx-4{--bs-gutter-x:1.5rem}.g-4,.gy-4{--bs-gutter-y:1.5rem}.g-5,.gx-5{--bs-gutter-x:3rem}.g-5,.gy-5{--bs-gutter-y:3rem}@media (min-width: 400px){.col-sm{-ms-flex:1 0 0%;flex:1 0 0%}.row-cols-sm-auto>*{-ms-flex:0 0 auto;flex:0 0 auto;width:auto}.row-cols-sm-1>*{-ms-flex:0 0 auto;flex:0 0 auto;width:100%}.row-cols-sm-2>*{-ms-flex:0 0 auto;flex:0 0 auto;width:50%}.row-cols-sm-3>*{-ms-flex:0 0 auto;flex:0 0 auto;width:33.3333333333%}.row-cols-sm-4>*{-ms-flex:0 0 auto;flex:0 0 auto;width:25%}.row-cols-sm-5>*{-ms-flex:0 0 auto;flex:0 0 auto;width:20%}.row-cols-sm-6>*{-ms-flex:0 0 auto;flex:0 0 auto;width:16.6666666667%}.col-sm-auto{-ms-flex:0 0 auto;flex:0 0 auto;width:auto}.col-sm-1{-ms-flex:0 0 auto;flex:0 0 auto;width:8.33333333%}.col-sm-2{-ms-flex:0 0 auto;flex:0 0 auto;width:16.66666667%}.col-sm-3{-ms-flex:0 0 auto;flex:0 0 auto;width:25%}.col-sm-4{-ms-flex:0 0 auto;flex:0 0 auto;width:33.33333333%}.col-sm-5{-ms-flex:0 0 auto;flex:0 0 auto;width:41.66666667%}.col-sm-6{-ms-flex:0 0 auto;flex:0 0 auto;width:50%}.col-sm-7{-ms-flex:0 0 auto;flex:0 0 auto;width:58.33333333%}.col-sm-8{-ms-flex:0 0 auto;flex:0 0 auto;width:66.66666667%}.col-sm-9{-ms-flex:0 0 auto;flex:0 0 auto;width:75%}.col-sm-10{-ms-flex:0 0 auto;flex:0 0 auto;width:83.33333333%}.col-sm-11{-ms-flex:0 0 auto;flex:0 0 auto;width:91.66666667%}.col-sm-12{-ms-flex:0 0 auto;flex:0 0 auto;width:100%}.offset-sm-0{margin-left:0}.offset-sm-1{margin-left:8.33333333%}.offset-sm-2{margin-left:16.66666667%}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:33.33333333%}.offset-sm-5{margin-left:41.66666667%}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:58.33333333%}.offset-sm-8{margin-left:66.66666667%}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:83.33333333%}.offset-sm-11{margin-left:91.66666667%}.g-sm-0,.gx-sm-0{--bs-gutter-x:0}.g-sm-0,.gy-sm-0{--bs-gutter-y:0}.g-sm-1,.gx-sm-1{--bs-gutter-x:0.25rem}.g-sm-1,.gy-sm-1{--bs-gutter-y:0.25rem}.g-sm-2,.gx-sm-2{--bs-gutter-x:0.5rem}.g-sm-2,.gy-sm-2{--bs-gutter-y:0.5rem}.g-sm-3,.gx-sm-3{--bs-gutter-x:1rem}.g-sm-3,.gy-sm-3{--bs-gutter-y:1rem}.g-sm-4,.gx-sm-4{--bs-gutter-x:1.5rem}.g-sm-4,.gy-sm-4{--bs-gutter-y:1.5rem}.g-sm-5,.gx-sm-5{--bs-gutter-x:3rem}.g-sm-5,.gy-sm-5{--bs-gutter-y:3rem}}@media (min-width: 600px){.col-rg{-ms-flex:1 0 0%;flex:1 0 0%}.row-cols-rg-auto>*{-ms-flex:0 0 auto;flex:0 0 auto;width:auto}.row-cols-rg-1>*{-ms-flex:0 0 auto;flex:0 0 auto;width:100%}.row-cols-rg-2>*{-ms-flex:0 0 auto;flex:0 0 auto;width:50%}.row-cols-rg-3>*{-ms-flex:0 0 auto;flex:0 0 auto;width:33.3333333333%}.row-cols-rg-4>*{-ms-flex:0 0 auto;flex:0 0 auto;width:25%}.row-cols-rg-5>*{-ms-flex:0 0 auto;flex:0 0 auto;width:20%}.row-cols-rg-6>*{-ms-flex:0 0 auto;flex:0 0 auto;width:16.6666666667%}.col-rg-auto{-ms-flex:0 0 auto;flex:0 0 auto;width:auto}.col-rg-1{-ms-flex:0 0 auto;flex:0 0 auto;width:8.33333333%}.col-rg-2{-ms-flex:0 0 auto;flex:0 0 auto;width:16.66666667%}.col-rg-3{-ms-flex:0 0 auto;flex:0 0 auto;width:25%}.col-rg-4{-ms-flex:0 0 auto;flex:0 0 auto;width:33.33333333%}.col-rg-5{-ms-flex:0 0 auto;flex:0 0 auto;width:41.66666667%}.col-rg-6{-ms-flex:0 0 auto;flex:0 0 auto;width:50%}.col-rg-7{-ms-flex:0 0 auto;flex:0 0 auto;width:58.33333333%}.col-rg-8{-ms-flex:0 0 auto;flex:0 0 auto;width:66.66666667%}.col-rg-9{-ms-flex:0 0 auto;flex:0 0 auto;width:75%}.col-rg-10{-ms-flex:0 0 auto;flex:0 0 auto;width:83.33333333%}.col-rg-11{-ms-flex:0 0 auto;flex:0 0 auto;width:91.66666667%}.col-rg-12{-ms-flex:0 0 auto;flex:0 0 auto;width:100%}.offset-rg-0{margin-left:0}.offset-rg-1{margin-left:8.33333333%}.offset-rg-2{margin-left:16.66666667%}.offset-rg-3{margin-left:25%}.offset-rg-4{margin-left:33.33333333%}.offset-rg-5{margin-left:41.66666667%}.offset-rg-6{margin-left:50%}.offset-rg-7{margin-left:58.33333333%}.offset-rg-8{margin-left:66.66666667%}.offset-rg-9{margin-left:75%}.offset-rg-10{margin-left:83.33333333%}.offset-rg-11{margin-left:91.66666667%}.g-rg-0,.gx-rg-0{--bs-gutter-x:0}.g-rg-0,.gy-rg-0{--bs-gutter-y:0}.g-rg-1,.gx-rg-1{--bs-gutter-x:0.25rem}.g-rg-1,.gy-rg-1{--bs-gutter-y:0.25rem}.g-rg-2,.gx-rg-2{--bs-gutter-x:0.5rem}.g-rg-2,.gy-rg-2{--bs-gutter-y:0.5rem}.g-rg-3,.gx-rg-3{--bs-gutter-x:1rem}.g-rg-3,.gy-rg-3{--bs-gutter-y:1rem}.g-rg-4,.gx-rg-4{--bs-gutter-x:1.5rem}.g-rg-4,.gy-rg-4{--bs-gutter-y:1.5rem}.g-rg-5,.gx-rg-5{--bs-gutter-x:3rem}.g-rg-5,.gy-rg-5{--bs-gutter-y:3rem}}@media (min-width: 780px){.col-md{-ms-flex:1 0 0%;flex:1 0 0%}.row-cols-md-auto>*{-ms-flex:0 0 auto;flex:0 0 auto;width:auto}.row-cols-md-1>*{-ms-flex:0 0 auto;flex:0 0 auto;width:100%}.row-cols-md-2>*{-ms-flex:0 0 auto;flex:0 0 auto;width:50%}.row-cols-md-3>*{-ms-flex:0 0 auto;flex:0 0 auto;width:33.3333333333%}.row-cols-md-4>*{-ms-flex:0 0 auto;flex:0 0 auto;width:25%}.row-cols-md-5>*{-ms-flex:0 0 auto;flex:0 0 auto;width:20%}.row-cols-md-6>*{-ms-flex:0 0 auto;flex:0 0 auto;width:16.6666666667%}.col-md-auto{-ms-flex:0 0 auto;flex:0 0 auto;width:auto}.col-md-1{-ms-flex:0 0 auto;flex:0 0 auto;width:8.33333333%}.col-md-2{-ms-flex:0 0 auto;flex:0 0 auto;width:16.66666667%}.col-md-3{-ms-flex:0 0 auto;flex:0 0 auto;width:25%}.col-md-4{-ms-flex:0 0 auto;flex:0 0 auto;width:33.33333333%}.col-md-5{-ms-flex:0 0 auto;flex:0 0 auto;width:41.66666667%}.col-md-6{-ms-flex:0 0 auto;flex:0 0 auto;width:50%}.col-md-7{-ms-flex:0 0 auto;flex:0 0 auto;width:58.33333333%}.col-md-8{-ms-flex:0 0 auto;flex:0 0 auto;width:66.66666667%}.col-md-9{-ms-flex:0 0 auto;flex:0 0 auto;width:75%}.col-md-10{-ms-flex:0 0 auto;flex:0 0 auto;width:83.33333333%}.col-md-11{-ms-flex:0 0 auto;flex:0 0 auto;width:91.66666667%}.col-md-12{-ms-flex:0 0 auto;flex:0 0 auto;width:100%}.offset-md-0{margin-left:0}.offset-md-1{margin-left:8.33333333%}.offset-md-2{margin-left:16.66666667%}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:33.33333333%}.offset-md-5{margin-left:41.66666667%}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:58.33333333%}.offset-md-8{margin-left:66.66666667%}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:83.33333333%}.offset-md-11{margin-left:91.66666667%}.g-md-0,.gx-md-0{--bs-gutter-x:0}.g-md-0,.gy-md-0{--bs-gutter-y:0}.g-md-1,.gx-md-1{--bs-gutter-x:0.25rem}.g-md-1,.gy-md-1{--bs-gutter-y:0.25rem}.g-md-2,.gx-md-2{--bs-gutter-x:0.5rem}.g-md-2,.gy-md-2{--bs-gutter-y:0.5rem}.g-md-3,.gx-md-3{--bs-gutter-x:1rem}.g-md-3,.gy-md-3{--bs-gutter-y:1rem}.g-md-4,.gx-md-4{--bs-gutter-x:1.5rem}.g-md-4,.gy-md-4{--bs-gutter-y:1.5rem}.g-md-5,.gx-md-5{--bs-gutter-x:3rem}.g-md-5,.gy-md-5{--bs-gutter-y:3rem}}@media (min-width: 1024px){.col-lg{-ms-flex:1 0 0%;flex:1 0 0%}.row-cols-lg-auto>*{-ms-flex:0 0 auto;flex:0 0 auto;width:auto}.row-cols-lg-1>*{-ms-flex:0 0 auto;flex:0 0 auto;width:100%}.row-cols-lg-2>*{-ms-flex:0 0 auto;flex:0 0 auto;width:50%}.row-cols-lg-3>*{-ms-flex:0 0 auto;flex:0 0 auto;width:33.3333333333%}.row-cols-lg-4>*{-ms-flex:0 0 auto;flex:0 0 auto;width:25%}.row-cols-lg-5>*{-ms-flex:0 0 auto;flex:0 0 auto;width:20%}.row-cols-lg-6>*{-ms-flex:0 0 auto;flex:0 0 auto;width:16.6666666667%}.col-lg-auto{-ms-flex:0 0 auto;flex:0 0 auto;width:auto}.col-lg-1{-ms-flex:0 0 auto;flex:0 0 auto;width:8.33333333%}.col-lg-2{-ms-flex:0 0 auto;flex:0 0 auto;width:16.66666667%}.col-lg-3{-ms-flex:0 0 auto;flex:0 0 auto;width:25%}.col-lg-4{-ms-flex:0 0 auto;flex:0 0 auto;width:33.33333333%}.col-lg-5{-ms-flex:0 0 auto;flex:0 0 auto;width:41.66666667%}.col-lg-6{-ms-flex:0 0 auto;flex:0 0 auto;width:50%}.col-lg-7{-ms-flex:0 0 auto;flex:0 0 auto;width:58.33333333%}.col-lg-8{-ms-flex:0 0 auto;flex:0 0 auto;width:66.66666667%}.col-lg-9{-ms-flex:0 0 auto;flex:0 0 auto;width:75%}.col-lg-10{-ms-flex:0 0 auto;flex:0 0 auto;width:83.33333333%}.col-lg-11{-ms-flex:0 0 auto;flex:0 0 auto;width:91.66666667%}.col-lg-12{-ms-flex:0 0 auto;flex:0 0 auto;width:100%}.offset-lg-0{margin-left:0}.offset-lg-1{margin-left:8.33333333%}.offset-lg-2{margin-left:16.66666667%}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:33.33333333%}.offset-lg-5{margin-left:41.66666667%}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:58.33333333%}.offset-lg-8{margin-left:66.66666667%}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:83.33333333%}.offset-lg-11{margin-left:91.66666667%}.g-lg-0,.gx-lg-0{--bs-gutter-x:0}.g-lg-0,.gy-lg-0{--bs-gutter-y:0}.g-lg-1,.gx-lg-1{--bs-gutter-x:0.25rem}.g-lg-1,.gy-lg-1{--bs-gutter-y:0.25rem}.g-lg-2,.gx-lg-2{--bs-gutter-x:0.5rem}.g-lg-2,.gy-lg-2{--bs-gutter-y:0.5rem}.g-lg-3,.gx-lg-3{--bs-gutter-x:1rem}.g-lg-3,.gy-lg-3{--bs-gutter-y:1rem}.g-lg-4,.gx-lg-4{--bs-gutter-x:1.5rem}.g-lg-4,.gy-lg-4{--bs-gutter-y:1.5rem}.g-lg-5,.gx-lg-5{--bs-gutter-x:3rem}.g-lg-5,.gy-lg-5{--bs-gutter-y:3rem}}@media (min-width: 1280px){.col-xl{-ms-flex:1 0 0%;flex:1 0 0%}.row-cols-xl-auto>*{-ms-flex:0 0 auto;flex:0 0 auto;width:auto}.row-cols-xl-1>*{-ms-flex:0 0 auto;flex:0 0 auto;width:100%}.row-cols-xl-2>*{-ms-flex:0 0 auto;flex:0 0 auto;width:50%}.row-cols-xl-3>*{-ms-flex:0 0 auto;flex:0 0 auto;width:33.3333333333%}.row-cols-xl-4>*{-ms-flex:0 0 auto;flex:0 0 auto;width:25%}.row-cols-xl-5>*{-ms-flex:0 0 auto;flex:0 0 auto;width:20%}.row-cols-xl-6>*{-ms-flex:0 0 auto;flex:0 0 auto;width:16.6666666667%}.col-xl-auto{-ms-flex:0 0 auto;flex:0 0 auto;width:auto}.col-xl-1{-ms-flex:0 0 auto;flex:0 0 auto;width:8.33333333%}.col-xl-2{-ms-flex:0 0 auto;flex:0 0 auto;width:16.66666667%}.col-xl-3{-ms-flex:0 0 auto;flex:0 0 auto;width:25%}.col-xl-4{-ms-flex:0 0 auto;flex:0 0 auto;width:33.33333333%}.col-xl-5{-ms-flex:0 0 auto;flex:0 0 auto;width:41.66666667%}.col-xl-6{-ms-flex:0 0 auto;flex:0 0 auto;width:50%}.col-xl-7{-ms-flex:0 0 auto;flex:0 0 auto;width:58.33333333%}.col-xl-8{-ms-flex:0 0 auto;flex:0 0 auto;width:66.66666667%}.col-xl-9{-ms-flex:0 0 auto;flex:0 0 auto;width:75%}.col-xl-10{-ms-flex:0 0 auto;flex:0 0 auto;width:83.33333333%}.col-xl-11{-ms-flex:0 0 auto;flex:0 0 auto;width:91.66666667%}.col-xl-12{-ms-flex:0 0 auto;flex:0 0 auto;width:100%}.offset-xl-0{margin-left:0}.offset-xl-1{margin-left:8.33333333%}.offset-xl-2{margin-left:16.66666667%}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:33.33333333%}.offset-xl-5{margin-left:41.66666667%}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:58.33333333%}.offset-xl-8{margin-left:66.66666667%}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:83.33333333%}.offset-xl-11{margin-left:91.66666667%}.g-xl-0,.gx-xl-0{--bs-gutter-x:0}.g-xl-0,.gy-xl-0{--bs-gutter-y:0}.g-xl-1,.gx-xl-1{--bs-gutter-x:0.25rem}.g-xl-1,.gy-xl-1{--bs-gutter-y:0.25rem}.g-xl-2,.gx-xl-2{--bs-gutter-x:0.5rem}.g-xl-2,.gy-xl-2{--bs-gutter-y:0.5rem}.g-xl-3,.gx-xl-3{--bs-gutter-x:1rem}.g-xl-3,.gy-xl-3{--bs-gutter-y:1rem}.g-xl-4,.gx-xl-4{--bs-gutter-x:1.5rem}.g-xl-4,.gy-xl-4{--bs-gutter-y:1.5rem}.g-xl-5,.gx-xl-5{--bs-gutter-x:3rem}.g-xl-5,.gy-xl-5{--bs-gutter-y:3rem}}@media (min-width: 1441px){.col-xxl{-ms-flex:1 0 0%;flex:1 0 0%}.row-cols-xxl-auto>*{-ms-flex:0 0 auto;flex:0 0 auto;width:auto}.row-cols-xxl-1>*{-ms-flex:0 0 auto;flex:0 0 auto;width:100%}.row-cols-xxl-2>*{-ms-flex:0 0 auto;flex:0 0 auto;width:50%}.row-cols-xxl-3>*{-ms-flex:0 0 auto;flex:0 0 auto;width:33.3333333333%}.row-cols-xxl-4>*{-ms-flex:0 0 auto;flex:0 0 auto;width:25%}.row-cols-xxl-5>*{-ms-flex:0 0 auto;flex:0 0 auto;width:20%}.row-cols-xxl-6>*{-ms-flex:0 0 auto;flex:0 0 auto;width:16.6666666667%}.col-xxl-auto{-ms-flex:0 0 auto;flex:0 0 auto;width:auto}.col-xxl-1{-ms-flex:0 0 auto;flex:0 0 auto;width:8.33333333%}.col-xxl-2{-ms-flex:0 0 auto;flex:0 0 auto;width:16.66666667%}.col-xxl-3{-ms-flex:0 0 auto;flex:0 0 auto;width:25%}.col-xxl-4{-ms-flex:0 0 auto;flex:0 0 auto;width:33.33333333%}.col-xxl-5{-ms-flex:0 0 auto;flex:0 0 auto;width:41.66666667%}.col-xxl-6{-ms-flex:0 0 auto;flex:0 0 auto;width:50%}.col-xxl-7{-ms-flex:0 0 auto;flex:0 0 auto;width:58.33333333%}.col-xxl-8{-ms-flex:0 0 auto;flex:0 0 auto;width:66.66666667%}.col-xxl-9{-ms-flex:0 0 auto;flex:0 0 auto;width:75%}.col-xxl-10{-ms-flex:0 0 auto;flex:0 0 auto;width:83.33333333%}.col-xxl-11{-ms-flex:0 0 auto;flex:0 0 auto;width:91.66666667%}.col-xxl-12{-ms-flex:0 0 auto;flex:0 0 auto;width:100%}.offset-xxl-0{margin-left:0}.offset-xxl-1{margin-left:8.33333333%}.offset-xxl-2{margin-left:16.66666667%}.offset-xxl-3{margin-left:25%}.offset-xxl-4{margin-left:33.33333333%}.offset-xxl-5{margin-left:41.66666667%}.offset-xxl-6{margin-left:50%}.offset-xxl-7{margin-left:58.33333333%}.offset-xxl-8{margin-left:66.66666667%}.offset-xxl-9{margin-left:75%}.offset-xxl-10{margin-left:83.33333333%}.offset-xxl-11{margin-left:91.66666667%}.g-xxl-0,.gx-xxl-0{--bs-gutter-x:0}.g-xxl-0,.gy-xxl-0{--bs-gutter-y:0}.g-xxl-1,.gx-xxl-1{--bs-gutter-x:0.25rem}.g-xxl-1,.gy-xxl-1{--bs-gutter-y:0.25rem}.g-xxl-2,.gx-xxl-2{--bs-gutter-x:0.5rem}.g-xxl-2,.gy-xxl-2{--bs-gutter-y:0.5rem}.g-xxl-3,.gx-xxl-3{--bs-gutter-x:1rem}.g-xxl-3,.gy-xxl-3{--bs-gutter-y:1rem}.g-xxl-4,.gx-xxl-4{--bs-gutter-x:1.5rem}.g-xxl-4,.gy-xxl-4{--bs-gutter-y:1.5rem}.g-xxl-5,.gx-xxl-5{--bs-gutter-x:3rem}.g-xxl-5,.gy-xxl-5{--bs-gutter-y:3rem}}.container,.container-fluid,.container-xs{width:100%;padding-right:var(--bs-gutter-x, 15px);padding-left:var(--bs-gutter-x, 15px);margin-right:auto;margin-left:auto}.container{max-width:1440px}.vertical-gutters{margin-bottom:-30px}.vertical-gutters>.col,.vertical-gutters>[class*=col-]{padding-bottom:30px}.row.border-gutters{margin-right:-1px;margin-bottom:-1px;margin-left:0}.row.border-gutters>.col,.row.border-gutters>[class*=col-]{padding-right:1px;padding-bottom:1px;padding-left:0}.container{padding-right:12px;padding-left:12px}.container-reset{margin-right:-12px;margin-left:-12px}.container-reset-left{margin-left:-12px}.container-reset-right{margin-right:-12px}@media (max-width: 399.98px){.container-fluid-xs{padding-right:1rem;padding-left:1rem}}@media (min-width: 400px){.container{padding-right:16px;padding-left:16px}}@media (min-width: 400px){.container-reset{margin-right:-16px;margin-left:-16px}}@media (min-width: 400px){.container-reset-left{margin-left:-16px}}@media (min-width: 400px){.container-reset-right{margin-right:-16px}}@media (min-width: 400px) and (max-width: 599.98px){.container-fluid-sm{padding-right:1rem;padding-left:1rem}}@media (min-width: 600px){.container{padding-right:32px;padding-left:32px}}@media (min-width: 600px){.container-reset{margin-right:-32px;margin-left:-32px}}@media (min-width: 600px){.container-reset-left{margin-left:-32px}}@media (min-width: 600px){.container-reset-right{margin-right:-32px}}@media (min-width: 600px) and (max-width: 779.98px){.container-fluid-rg{padding-right:1rem;padding-left:1rem}}@media (min-width: 780px) and (max-width: 1023.98px){.container-fluid-md{padding-right:1rem;padding-left:1rem}}@media (min-width: 1024px){.container{padding-right:40px;padding-left:40px}}@media (min-width: 1024px){.container-reset{margin-right:-40px;margin-left:-40px}}@media (min-width: 1024px){.container-reset-left{margin-left:-40px}}@media (min-width: 1024px){.container-reset-right{margin-right:-40px}}@media (min-width: 1024px) and (max-width: 1279.98px){.container-fluid-lg{padding-right:1rem;padding-left:1rem}}@media (min-width: 1280px){.container{padding-right:128px;padding-left:128px}}@media (min-width: 1280px){.container-reset{margin-right:-128px;margin-left:-128px}}@media (min-width: 1280px){.container-reset-left{margin-left:-128px}}@media (min-width: 1280px){.container-reset-right{margin-right:-128px}}@media (min-width: 1280px) and (max-width: 1440.98px){.container-fluid-xl{padding-right:1rem;padding-left:1rem}}@media (min-width: 1441px){.container-fluid-xxl{padding-right:1rem;padding-left:1rem}}@-webkit-keyframes progress-bar-stripes{0%{background-position-x:1rem}}@keyframes progress-bar-stripes{0%{background-position-x:1rem}}.progress{display:-ms-flexbox;display:flex;height:1rem;overflow:hidden;font-size:0.75rem;background-color:#cccccc;border-radius:3px}.progress-bar{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;overflow:hidden;color:#fff;text-align:center;white-space:nowrap;background-color:#333333;-webkit-transition:width 0.6s ease;transition:width 0.6s ease}@media (prefers-reduced-motion: reduce){.progress-bar{-webkit-transition:none;transition:none}}.progress-bar-striped{background-image:linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);background-size:1rem 1rem}.progress-bar-animated{-webkit-animation:1s linear infinite progress-bar-stripes;animation:1s linear infinite progress-bar-stripes}@media (prefers-reduced-motion: reduce){.progress-bar-animated{-webkit-animation:none;animation:none}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.spinner-bg{position:absolute;z-index:990;top:0;left:0;width:100%;height:100%}.loading-modal{display:-ms-inline-flexbox;display:inline-flex;position:absolute;z-index:990;top:0;right:0;bottom:0;left:0}.loader{width:3.5rem;height:3.5rem;-webkit-animation:spin 2s linear infinite;animation:spin 2s linear infinite;border:6px solid #fc0;border-radius:50%;border-right-color:transparent;border-bottom-color:#e6e6e6}.loader.loader-sm{width:2rem;height:2rem;border-width:0.25rem}.loader.loader-xs{width:0.75rem;height:0.75rem;border-width:2px}@media (forced-colors: active), (-ms-high-contrast: active), (-ms-high-contrast: white-on-black){.loader{border-color:Highlight;border-bottom-color:CanvasText;border-right-color:Canvas}@supports (forced-color-adjust: none){.loader{forced-color-adjust:none;border-right-color:transparent}}}@font-face{font-display:swap;font-family:\"Frutiger Neue For Post\";font-weight:700;src:url(\"https://fonts.post.ch/frutigerneueforpost/v2/FrutigerNeueforPostW05-Bold.woff2\") format(\"woff2\"), url(\"https://fonts.post.ch/frutigerneueforpost/v2/FrutigerNeueforPostW05-Bold.woff\") format(\"woff\")}@font-face{font-display:swap;font-family:\"Frutiger Neue For Post\";font-weight:400;src:url(\"https://fonts.post.ch/frutigerneueforpost/v2/FrutigerNeueforPostW05-Rg.woff2\") format(\"woff2\"), url(\"https://fonts.post.ch/frutigerneueforpost/v2/FrutigerNeueforPostW05-Rg.woff\") format(\"woff\")}@font-face{font-display:swap;font-family:\"Frutiger Neue For Post\";font-weight:300;src:url(\"https://fonts.post.ch/frutigerneueforpost/v2/FrutigerNeueforPostW05-Lt.woff2\") format(\"woff2\"), url(\"https://fonts.post.ch/frutigerneueforpost/v2/FrutigerNeueforPostW05-Lt.woff\") format(\"woff\")}*,:host,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host{font-family:\"Frutiger Neue For Post\", system-ui, sans-serif}button{font:inherit;padding:0}img,svg{max-width:100%;max-height:100%}@media (forced-colors: active){svg{color:white}}.no-list{list-style:none;padding-left:0;margin-top:0;margin-bottom:0}.btn-blank{background-color:transparent;border:none;border-radius:0;padding:0}.nav-link{text-decoration:none;color:rgba(0, 0, 0, 0.8);-webkit-transition:color 200ms;transition:color 200ms;background-color:transparent;border-radius:0;-webkit-box-shadow:none;box-shadow:none;border:0;margin:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;gap:0.5rem}.nav-link:hover,.nav-link:focus{color:black}.nav-link>svg{width:1.4em;height:1.4em;-ms-flex-negative:0;flex-shrink:0}.nav-link>span{-ms-flex-negative:1;flex-shrink:1}.box>*:first-child{margin-top:0}.box>*:last-child{margin-bottom:0}.mirrored{-webkit-transform:scaleX(-1);transform:scaleX(-1)}.rotate-270{-webkit-transform:rotate(270deg);transform:rotate(270deg)}.bold{font-weight:700}.light{font-weight:300}.d-flex{display:-ms-flexbox;display:flex}.d-inline-flex{display:-ms-inline-flexbox;display:inline-flex}.align-items-center{-ms-flex-align:center;align-items:center}@media (min-width: 1441px){.wide-container{margin:0 auto;max-width:1440px}}@media (max-width: 599.98px){.container{padding-right:16px;padding-left:16px}}@media (min-width: 600px) and (max-width: 1023.98px){.container{padding-right:32px;padding-left:32px}}@media (min-width: 1024px){.container{padding-right:40px;padding-left:40px}}.visually-hidden{position:absolute;width:1px;height:1px;border:0;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0)}@media (max-width: -0.02px){.hidden-xs{display:none}}@media (max-width: 399.98px){.hidden-sm{display:none}}@media (max-width: 599.98px){.hidden-rg{display:none}}@media (max-width: 779.98px){.hidden-md{display:none}}@media (max-width: 1023.98px){.hidden-lg{display:none}}@media (max-width: 1279.98px){.hidden-xl{display:none}}@media (max-width: 1440.98px){.hidden-xxl{display:none}}:host{display:block;position:relative}.breadcrumbs{font-size:1rem;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;gap:1rem}@media (max-width: 599.98px){.breadcrumbs{font-size:0.875rem}}.breadcrumbs-nav{white-space:nowrap;-ms-flex-positive:1;flex-grow:1;-ms-flex-negative:1;flex-shrink:1;min-width:0}.breadcrumbs-list,.nav-link{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.breadcrumbs-list li{display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0}.breadcrumbs-list li:last-child{-ms-flex-negative:2;flex-shrink:2;min-width:0;overflow:hidden;text-overflow:ellipsis}.breadcrumbs-list li:last-child a{border:2px solid transparent;outline-offset:0}.breadcrumbs-list svg{margin-left:0 !important;width:1.5em;height:1.5em;color:rgba(0, 0, 0, 0.6)}.breadcrumb-buttons{display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:flex-end;gap:1rem;-ms-flex-negative:0;flex-shrink:0}.breadcrumb-buttons .btn{cursor:pointer;gap:0.5rem;font-size:inherit}.breadcrumb-buttons .btn.btn-secondary>svg{width:1.5rem;height:1.5rem;margin:0}@media (min-width: 1024px){.breadcrumb-buttons .btn span{position:static;width:auto;height:auto;margin:auto;overflow:visible;clip:auto;visibility:visible}}.nav-link{gap:0;color:rgba(0, 0, 0, 0.6);font-weight:400}.middle-dropdown-container{position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.middle-dropdown{position:absolute;top:100%;left:0;background:white;border:1px solid #e6e6e6;padding:0.5rem 0;z-index:1}.middle-dropdown .nav-link{padding:0.5rem 1rem;-webkit-transition:color 200ms;transition:color 200ms}.middle-dropdown .nav-link:hover{background-color:#e6e6e6}.middle-dropdown-button{cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;gap:0.25rem;font-size:inherit;color:inherit}.middle-dropdown-button span{margin:0}.middle-dropdown-button svg{margin:0;-ms-flex-negative:0;flex-shrink:0;width:1.4em;height:1.4em}.overlay{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0, 0, 0, 0.6);z-index:calc(var(--header-z-index, 10) + 1);opacity:0;visibility:hidden;-webkit-transition:opacity 500ms, visibility 0s 500ms;transition:opacity 500ms, visibility 0s 500ms}.overlay.open{visibility:visible;opacity:1;-webkit-transition:opacity 500ms, visibility 0s 0s;transition:opacity 500ms, visibility 0s 0s}.overlay-container{position:relative;background:white;-webkit-box-shadow:0 0 40px rgba(0, 0, 0, 0.6);box-shadow:0 0 40px rgba(0, 0, 0, 0.6);visibility:hidden;-webkit-transform:translateY(3rem);transform:translateY(3rem);opacity:0;-webkit-transition:opacity 500ms, -webkit-transform 500ms;transition:opacity 500ms, -webkit-transform 500ms;transition:transform 500ms, opacity 500ms;transition:transform 500ms, opacity 500ms, -webkit-transform 500ms}iframe{display:block;width:1px;min-width:100%;overflow:auto;max-height:80vh}.overlay-close{position:absolute;top:1rem;right:1rem;cursor:pointer;padding:0.5rem;color:rgba(0, 0, 0, 0.8)}.overlay-close:hover,.overlay-close:focus{color:black}.overlay-close.phone{color:white}.overlay-close.phone:hover,.overlay-close.phone:focus{color:rgba(255, 255, 255, 0.8)}@media (min-width: 600px){.overlay-close span{position:static;width:auto;height:auto;margin:auto;overflow:visible;clip:auto;visibility:visible}}.loader-wrapper{position:absolute;display:grid;place-items:center;width:100%;height:100%;top:0;left:0}.loaded~.loader-wrapper{display:none}.hidden-control-breadcrumbs{position:absolute;top:100%;width:0;overflow:hidden;display:-ms-flexbox;display:flex;pointer-events:none}.hidden-control-breadcrumbs .breadcrumbs-nav{-ms-flex-negative:0;flex-shrink:0}.hidden-control-breadcrumbs .breadcrumbs-list li{-ms-flex-negative:0;flex-shrink:0}.visually-hidden{visibility:hidden}";
 
-const PostInternetBreadcrumbs = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.customItems = undefined;
-    this.customBreadcrumbItems = undefined;
-    this.overlayVisible = undefined;
-    this.isConcatenated = undefined;
-    this.dropdownOpen = false;
-    this.refsReady = false;
-  }
-  connectedCallback() {
-    this.debouncedResize = index$1.debounce(200, this.handleResize.bind(this));
-    window.addEventListener('resize', this.debouncedResize, { passive: true });
-  }
-  disconnectedCallback() {
-    window.removeEventListener('resize', this.debouncedResize);
-    window.removeEventListener('click', this.handleWindowClick);
-    bodyScrollLock_esm.clearAllBodyScrollLocks();
-  }
-  async componentWillLoad() {
-    // Wait for the config to arrive, then render the header
-    try {
-      this.customBreadcrumbItems =
-        typeof this.customItems === 'string' ? JSON.parse(this.customItems) : this.customItems;
-    }
-    catch (error) {
-      console.error(error);
-    }
-  }
-  componentDidLoad() {
-    // Initially check if breadcrumb items are concatenated
-    window.requestAnimationFrame(() => {
-      this.handleResize();
-    });
-  }
-  handleCustomConfigChage(newValue) {
-    try {
-      this.customBreadcrumbItems = typeof newValue === 'string' ? JSON.parse(newValue) : newValue;
-    }
-    catch (error) {
-      console.error(error);
-    }
-  }
-  handleResize() {
-    // Catch and exclude vertical resize events, e.g. scrolling in iPhone
-    if (window.innerWidth === this.lastWindowWidth) {
-      return;
-    }
-    this.lastWindowWidth = window.innerWidth;
-    this.checkConcatenation();
-  }
-  checkConcatenation() {
-    if (this.controlNavRef && this.visibleNavRef) {
-      this.refsReady = true;
-      // Delay the check
-      window.requestAnimationFrame(() => {
-        if (this.controlNavRef && this.visibleNavRef) {
-          this.isConcatenated = this.controlNavRef.clientWidth > this.visibleNavRef.clientWidth;
-        }
-      });
-    }
-  }
-  toggleOverlay(overlay, force) {
-    var _a;
-    const newVisibility = force !== null && force !== void 0 ? force : !this.overlayVisible;
-    if (newVisibility) {
-      // Will trigger overlayRef() once the HTLM is rendered
-      this.overlayVisible = newVisibility;
-      this.currentOverlay = overlay;
-      this.setBodyScroll(overlay);
-    }
-    else {
-      const activeToggler = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.breadcrumb-buttons [aria-expanded="true"]');
-      if (this.openAnimation && this.loadedAnimation) {
-        this.openAnimation.reverse();
-        this.loadedAnimation.reverse();
-        // Delay hiding overlay until after the animation finishes
-        Promise.all([this.openAnimation.finished, this.loadedAnimation.finished]).then(() => {
-          if (activeToggler) {
-            activeToggler.focus();
-          }
-          this.overlayVisible = newVisibility;
-          this.setBodyScroll(overlay);
-        });
-      }
-    }
-  }
-  /**
-   * Disable or re-enable body scrolling, depending on whether overlay is visible or not
-   */
-  setBodyScroll(overlay) {
-    if (this.overlayVisible) {
-      bodyScrollLock_esm.disableBodyScroll(overlay, { reserveScrollBarGap: true });
-    }
-    else {
-      bodyScrollLock_esm.enableBodyScroll(overlay);
-    }
-  }
-  toggleDropdown(force) {
-    this.dropdownOpen = force !== null && force !== void 0 ? force : !this.dropdownOpen;
-    if (this.dropdownOpen) {
-      requestAnimationFrame(() => {
-        document.addEventListener('click', this.handleWindowClick.bind(this), { once: true });
-      });
-    }
-  }
-  handleWindowClick() {
-    this.toggleDropdown(false);
-  }
-  registerIFrameResizer(iFrame) {
-    if (!iFrame) {
-      return;
-    }
-    iFrame.addEventListener('load', () => {
-      var _a, _b, _c;
-      iframeResizer.iframeResizer({
-        heightCalculationMethod: 'taggedElement',
-        scrolling: true,
-        checkOrigin: false,
-      }, iFrame);
-      const duration = utils.prefersReducedMotion ? 0 : 300;
-      this.loadedAnimation = (_a = iFrame.parentElement) === null || _a === void 0 ? void 0 : _a.animate([{ opacity: 1, visibility: 'visible', transform: 'translateY(0px)' }], { duration, fill: 'forwards' });
-      (_b = iFrame.parentElement) === null || _b === void 0 ? void 0 : _b.classList.add('loaded');
-      (_c = this.loadedAnimation) === null || _c === void 0 ? void 0 : _c.finished.then(() => {
-        var _a;
-        (_a = iFrame.parentElement) === null || _a === void 0 ? void 0 : _a.focus();
-      });
-    });
-  }
-  /**
-   * Reference function for the overlay element got called. It is either null (overlay closed)
-   * or contains the overlay element as parameter.
-   * @param e Overlay element or null
-   * @returns void
-   */
-  overlayRef(e) {
-    if (!e) {
-      return;
-    }
-    const duration = utils.prefersReducedMotion ? 0 : 500;
-    this.openAnimation = e.animate([{ opacity: 1, visibility: 'visible' }], {
-      duration,
-      fill: 'forwards',
-    });
-  }
-  handleKeyDown(event) {
-    if (event.key.toLowerCase() === 'escape') {
-      this.toggleOverlay(this.currentOverlay, false);
-    }
-  }
-  handleToggleDropdown() {
-    this.toggleDropdown();
-  }
-  handleToggleOverlay() {
-    this.toggleOverlay(this.currentOverlay, false);
-  }
-  handleControlNavRef(element) {
-    this.controlNavRef = element;
-    this.checkConcatenation();
-  }
-  handleVisibleNavRef(element) {
-    this.visibleNavRef = element;
-    this.checkConcatenation();
-  }
-  render() {
-    // There is something wrong entirely
-    if (!store.state) {
-      console.warn(`Internet Breadcrumbs: Could not load config. Please make sure that you included the <swisspost-internet-header></swisspost-internet-header> component.`);
-      return null;
-    }
-    // Config is not loaded yet
-    if (!store.state.localizedConfig) {
-      return null;
-    }
-    // Config has loaded but there is no breadcrumbs config
-    if (!store.state.localizedConfig.breadcrumb) {
-      console.warn(`Internet Header: Current project "${store.state.projectId}" does not include a breadcrumb config. The breadcrumbs will not be rendered. Remove `, document.querySelector('swisspost-internet-breadcrumbs'), `from your markup or configure the breadcrumbs in your portal config to stop seeing this warning.`);
-      return null;
-    }
-    const breadcrumbConfig = store.state.localizedConfig.breadcrumb;
-    const items = this.customBreadcrumbItems !== undefined
-      ? [...breadcrumbConfig.items, ...this.customBreadcrumbItems]
-      : breadcrumbConfig.items;
-    return (index.h(index.Host, null, index.h(svgSprite_component.SvgSprite, null), index.h("div", { class: "breadcrumbs" }, index.h("div", { class: "hidden-control-breadcrumbs", "aria-hidden": "true", tabindex: "-1" }, index.h("nav", { class: "breadcrumbs-nav", ref: e => e !== undefined && this.handleControlNavRef(e) }, index.h(BreadcrumbList, { items: items, focusable: false, clickHandler: () => { } }))), index.h("h2", { class: "visually-hidden" }, breadcrumbConfig.a11yLabel), index.h("nav", { ref: e => e !== undefined && this.handleVisibleNavRef(e), class: {
-        'breadcrumbs-nav': true,
-        'visually-hidden': !this.refsReady,
-      } }, index.h(BreadcrumbList, { items: items, dropdownOpen: this.dropdownOpen, isConcatenated: this.isConcatenated, clickHandler: () => this.handleToggleDropdown() })), index.h("div", { class: "breadcrumb-buttons" }, breadcrumbConfig.buttons.map(button => (index.h("button", { class: "btn btn-secondary btn-icon", key: button.text, "aria-expanded": `${!!this.overlayVisible && this.currentOverlay === button.overlay}`, onClick: () => this.toggleOverlay(button.overlay, true) }, index.h(svgIcon_component.SvgIcon, { name: button.svgIcon.name }), index.h("span", { class: "visually-hidden" }, button.text))))), this.overlayVisible && (index.h(OverlayComponent, { overlayRef: e => e !== undefined && this.overlayRef(e), iFrameRef: e => e !== undefined && this.registerIFrameResizer(e), overlay: this.currentOverlay, onClick: () => this.handleToggleOverlay(), onKeyDown: (e) => this.handleKeyDown(e), closeButtonText: store.state.localizedConfig.header.translations.closeButtonText }))), index.h("slot", null)));
-  }
-  get host() { return index.getElement(this); }
-  static get watchers() { return {
-    "customItems": ["handleCustomConfigChage"]
-  }; }
-};
+const PostInternetBreadcrumbs = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.customItems = undefined;
+    this.customBreadcrumbItems = undefined;
+    this.overlayVisible = undefined;
+    this.isConcatenated = undefined;
+    this.dropdownOpen = false;
+    this.refsReady = false;
+  }
+  connectedCallback() {
+    this.debouncedResize = index$1.debounce(200, this.handleResize.bind(this));
+    window.addEventListener('resize', this.debouncedResize, { passive: true });
+  }
+  disconnectedCallback() {
+    window.removeEventListener('resize', this.debouncedResize);
+    window.removeEventListener('click', this.handleWindowClick);
+    bodyScrollLock_esm.clearAllBodyScrollLocks();
+  }
+  async componentWillLoad() {
+    // Wait for the config to arrive, then render the header
+    try {
+      this.customBreadcrumbItems =
+        typeof this.customItems === 'string' ? JSON.parse(this.customItems) : this.customItems;
+    }
+    catch (error) {
+      console.error(error);
+    }
+  }
+  componentDidLoad() {
+    // Initially check if breadcrumb items are concatenated
+    window.requestAnimationFrame(() => {
+      this.handleResize();
+    });
+  }
+  handleCustomConfigChage(newValue) {
+    try {
+      this.customBreadcrumbItems = typeof newValue === 'string' ? JSON.parse(newValue) : newValue;
+    }
+    catch (error) {
+      console.error(error);
+    }
+  }
+  handleResize() {
+    // Catch and exclude vertical resize events, e.g. scrolling in iPhone
+    if (window.innerWidth === this.lastWindowWidth) {
+      return;
+    }
+    this.lastWindowWidth = window.innerWidth;
+    this.checkConcatenation();
+  }
+  checkConcatenation() {
+    if (this.controlNavRef && this.visibleNavRef) {
+      this.refsReady = true;
+      // Delay the check
+      window.requestAnimationFrame(() => {
+        if (this.controlNavRef && this.visibleNavRef) {
+          this.isConcatenated = this.controlNavRef.clientWidth > this.visibleNavRef.clientWidth;
+        }
+      });
+    }
+  }
+  toggleOverlay(overlay, force) {
+    var _a;
+    const newVisibility = force !== null && force !== void 0 ? force : !this.overlayVisible;
+    if (newVisibility) {
+      // Will trigger overlayRef() once the HTLM is rendered
+      this.overlayVisible = newVisibility;
+      this.currentOverlay = overlay;
+      this.setBodyScroll(overlay);
+    }
+    else {
+      const activeToggler = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.breadcrumb-buttons [aria-expanded="true"]');
+      if (this.openAnimation && this.loadedAnimation) {
+        this.openAnimation.reverse();
+        this.loadedAnimation.reverse();
+        // Delay hiding overlay until after the animation finishes
+        Promise.all([this.openAnimation.finished, this.loadedAnimation.finished]).then(() => {
+          if (activeToggler) {
+            activeToggler.focus();
+          }
+          this.overlayVisible = newVisibility;
+          this.setBodyScroll(overlay);
+        });
+      }
+    }
+  }
+  /**
+   * Disable or re-enable body scrolling, depending on whether overlay is visible or not
+   */
+  setBodyScroll(overlay) {
+    if (this.overlayVisible) {
+      bodyScrollLock_esm.disableBodyScroll(overlay, { reserveScrollBarGap: true });
+    }
+    else {
+      bodyScrollLock_esm.enableBodyScroll(overlay);
+    }
+  }
+  toggleDropdown(force) {
+    this.dropdownOpen = force !== null && force !== void 0 ? force : !this.dropdownOpen;
+    if (this.dropdownOpen) {
+      requestAnimationFrame(() => {
+        document.addEventListener('click', this.handleWindowClick.bind(this), { once: true });
+      });
+    }
+  }
+  handleWindowClick() {
+    this.toggleDropdown(false);
+  }
+  registerIFrameResizer(iFrame) {
+    if (!iFrame) {
+      return;
+    }
+    iFrame.addEventListener('load', () => {
+      var _a, _b, _c;
+      iframeResizer.iframeResizer({
+        heightCalculationMethod: 'taggedElement',
+        scrolling: true,
+        checkOrigin: false,
+      }, iFrame);
+      const duration = utils.prefersReducedMotion ? 0 : 300;
+      this.loadedAnimation = (_a = iFrame.parentElement) === null || _a === void 0 ? void 0 : _a.animate([{ opacity: 1, visibility: 'visible', transform: 'translateY(0px)' }], { duration, fill: 'forwards' });
+      (_b = iFrame.parentElement) === null || _b === void 0 ? void 0 : _b.classList.add('loaded');
+      (_c = this.loadedAnimation) === null || _c === void 0 ? void 0 : _c.finished.then(() => {
+        var _a;
+        (_a = iFrame.parentElement) === null || _a === void 0 ? void 0 : _a.focus();
+      });
+    });
+  }
+  /**
+   * Reference function for the overlay element got called. It is either null (overlay closed)
+   * or contains the overlay element as parameter.
+   * @param e Overlay element or null
+   * @returns void
+   */
+  overlayRef(e) {
+    if (!e) {
+      return;
+    }
+    const duration = utils.prefersReducedMotion ? 0 : 500;
+    this.openAnimation = e.animate([{ opacity: 1, visibility: 'visible' }], {
+      duration,
+      fill: 'forwards',
+    });
+  }
+  handleKeyDown(event) {
+    if (event.key.toLowerCase() === 'escape') {
+      this.toggleOverlay(this.currentOverlay, false);
+    }
+  }
+  handleToggleDropdown() {
+    this.toggleDropdown();
+  }
+  handleToggleOverlay() {
+    this.toggleOverlay(this.currentOverlay, false);
+  }
+  handleControlNavRef(element) {
+    this.controlNavRef = element;
+    this.checkConcatenation();
+  }
+  handleVisibleNavRef(element) {
+    this.visibleNavRef = element;
+    this.checkConcatenation();
+  }
+  render() {
+    // There is something wrong entirely
+    if (!store.state) {
+      console.warn(`Internet Breadcrumbs: Could not load config. Please make sure that you included the <swisspost-internet-header></swisspost-internet-header> component.`);
+      return null;
+    }
+    // Config is not loaded yet
+    if (!store.state.localizedConfig) {
+      return null;
+    }
+    // Config has loaded but there is no breadcrumbs config
+    if (!store.state.localizedConfig.breadcrumb) {
+      console.warn(`Internet Header: Current project "${store.state.projectId}" does not include a breadcrumb config. The breadcrumbs will not be rendered. Remove `, document.querySelector('swisspost-internet-breadcrumbs'), `from your markup or configure the breadcrumbs in your portal config to stop seeing this warning.`);
+      return null;
+    }
+    const breadcrumbConfig = store.state.localizedConfig.breadcrumb;
+    const items = this.customBreadcrumbItems !== undefined
+      ? [...breadcrumbConfig.items, ...this.customBreadcrumbItems]
+      : breadcrumbConfig.items;
+    return (index.h(index.Host, null, index.h(svgSprite_component.SvgSprite, null), index.h("div", { class: "breadcrumbs" }, index.h("div", { class: "hidden-control-breadcrumbs", "aria-hidden": "true", tabindex: "-1" }, index.h("nav", { class: "breadcrumbs-nav", ref: e => e !== undefined && this.handleControlNavRef(e) }, index.h(BreadcrumbList, { items: items, focusable: false, clickHandler: () => { } }))), index.h("h2", { class: "visually-hidden" }, breadcrumbConfig.a11yLabel), index.h("nav", { ref: e => e !== undefined && this.handleVisibleNavRef(e), class: {
+        'breadcrumbs-nav': true,
+        'visually-hidden': !this.refsReady,
+      } }, index.h(BreadcrumbList, { items: items, dropdownOpen: this.dropdownOpen, isConcatenated: this.isConcatenated, clickHandler: () => this.handleToggleDropdown() })), index.h("div", { class: "breadcrumb-buttons" }, breadcrumbConfig.buttons.map(button => (index.h("button", { class: "btn btn-secondary btn-icon", key: button.text, "aria-expanded": `${!!this.overlayVisible && this.currentOverlay === button.overlay}`, onClick: () => this.toggleOverlay(button.overlay, true) }, index.h(svgIcon_component.SvgIcon, { name: button.svgIcon.name }), index.h("span", { class: "visually-hidden" }, button.text))))), this.overlayVisible && (index.h(OverlayComponent, { overlayRef: e => e !== undefined && this.overlayRef(e), iFrameRef: e => e !== undefined && this.registerIFrameResizer(e), overlay: this.currentOverlay, onClick: () => this.handleToggleOverlay(), onKeyDown: (e) => this.handleKeyDown(e), closeButtonText: store.state.localizedConfig.header.translations.closeButtonText }))), index.h("slot", null)));
+  }
+  get host() { return index.getElement(this); }
+  static get watchers() { return {
+    "customItems": ["handleCustomConfigChage"]
+  }; }
+};
 PostInternetBreadcrumbs.style = postInternetBreadcrumbsCss;
 
 exports.swisspost_internet_breadcrumbs = PostInternetBreadcrumbs;