@swisspost/design-system-components 10.0.0-next.49 → 10.0.0-next.51

package/dist/cjs/post-closebutton_15.cjs.entry.js

@@ -1,32 +1,92 @@
 'use strict';
 
 var index = require('./index-CpDyH7Ww.js');
-var _package = require('./package-CR0YynRY.js');
-var breakpoints = require('./breakpoints-DmZ_BQGo.js');
-var eventFrom = require('./event-from-C6kpQwhw.js');
+var _package = require('./package-D1eOXW8H.js');
 var index$1 = require('./index-DtvYdwe1.js');
+var breakpoints = require('./breakpoints-CEkeixld.js');
+var eventFrom = require('./event-from-CLvtSUKf.js');
 var index_browser = require('./index.browser-Doj636JV.js');
 var placement = require('./placement-qEFR9hmI.js');
-var getRoot = require('./get-root-CfQ2PogP.js');
+var getRoot = require('./get-root-CyMf3Vsd.js');
 
-const postClosebuttonCss = ".btn-icon-close{padding:0;border:unset;min-height:unset;min-width:unset;width:var(--post-device-sizing-notification-1);height:var(--post-device-sizing-notification-1);border-radius:var(--post-device-border-radius-round);background-color:var(--post-scheme-color-interactive-button-tertiary-enabled-bg);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg)}.btn-icon-close>post-icon{min-width:var(--post-device-sizing-interactive-icon-size4);width:var(--post-device-sizing-interactive-icon-size4);height:var(--post-device-sizing-interactive-icon-size4)}.btn-icon-close:not(:disabled):hover,.btn-icon-close.pretend-hover{cursor:pointer;background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-icon-close:not(:disabled):hover,.btn-icon-close.pretend-hover{color:HighlightText !important}}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}";
+const focusableSelector = `:where(${[
+    'button',
+    'input:not([type="hidden"])',
+    '[tabindex]',
+    'select',
+    'textarea',
+    '[contenteditable]',
+    'a[href]',
+    'iframe',
+    'audio[controls]',
+    'video[controls]',
+    'area[href]',
+    'details > summary:first-of-type',
+].join(',')})`;
+const focusDisablingSelector = `:where(${[
+    '[inert]',
+    '[inert] *',
+    ':disabled',
+    'dialog:not([open]) *',
+    '[popover]:not(:popover-open) *',
+    'details:not([open]) > *:not(details > summary:first-of-type)',
+    'details:not([open]) > *:not(details > summary:first-of-type) *',
+    '[tabindex^="-"]',
+    '[hidden]:not([hidden="false"])',
+].join(',')})`;
+function getFocusableChildren(element) {
+    const focusableChildren = element.querySelectorAll(`${focusableSelector}:not(${focusDisablingSelector})`);
+    const visibleFocusableChildren = Array.from(focusableChildren).filter(child => {
+        const style = window.getComputedStyle(child.parentElement);
+        return style.display !== 'none' && style.visibility !== 'hidden';
+    });
+    return visibleFocusableChildren;
+}
+
+const BUTTON_TYPES = ['button', 'submit', 'reset'];
+
+const postClosebuttonCss = ".visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}post-closebutton .btn{padding:0;border:unset;min-height:unset;min-width:unset;width:var(--post-device-sizing-notification-1);height:var(--post-device-sizing-notification-1);border-radius:var(--post-device-border-radius-round);background-color:var(--post-scheme-color-interactive-button-tertiary-enabled-bg);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg)}post-closebutton .btn>post-icon{min-width:var(--post-device-sizing-interactive-icon-size4);width:var(--post-device-sizing-interactive-icon-size4);height:var(--post-device-sizing-interactive-icon-size4)}post-closebutton .btn:not(:disabled):hover,post-closebutton .btn.pretend-hover{cursor:pointer;background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-closebutton .btn:not(:disabled):hover,post-closebutton .btn.pretend-hover{color:HighlightText !important}}";
 
 const PostClosebutton = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
+        this.mutationObserver = new MutationObserver(this.checkContent.bind(this));
+        /**
+         * Overrides the close button's type ("button" by default)
+         */
+        this.buttonType = 'button';
+    }
+    validateButtonType() {
+        index$1.checkEmptyOrOneOf(this, 'buttonType', BUTTON_TYPES);
     }
     componentDidLoad() {
-        this.checkHiddenLabel();
+        this.checkContent();
+    }
+    connectedCallback() {
+        this.mutationObserver.observe(this.host, {
+            childList: true,
+            characterData: true,
+            subtree: true,
+        });
     }
-    checkHiddenLabel(slot = this.host.shadowRoot.querySelector('.visually-hidden slot')) {
-        if (slot.assignedNodes().length === 0) {
+    disconnectedCallback() {
+        if (this.mutationObserver) {
+            this.mutationObserver.disconnect();
+        }
+    }
+    checkContent() {
+        this.validateButtonType();
+        if (!this.host.querySelector('.visually-hidden').textContent) {
             console.error(`The \`${this.host.localName}\` component requires content for accessibility.`);
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'ee54a84df2fbb214706f5f2eb527769b03846819', "data-version": _package.version }, index.h("button", { key: '39ce661db0611bbe4387a32a9d7c91b1f5bc8b17', class: "btn btn-icon-close", type: "button" }, index.h("post-icon", { key: '26aced13eacfa369e82178e5551372700499e556', "aria-hidden": "true", name: "closex" }), index.h("span", { key: '01bcad725724a3ae95e79e25d58958eb4ee2ffa3', class: "visually-hidden" }, index.h("slot", { key: 'bd794bf53acbf2fbcf1855ce882bcd442d2a846f', onSlotchange: () => this.checkHiddenLabel() })))));
+        return (index.h(index.Host, { key: '9b5bb7e95c6cf3039119ce485e963ac672834bc3', "data-version": _package.version }, index.h("button", { key: '084709a7c632a8c665905a667fa6498cae1972a6', class: "btn", type: this.buttonType }, index.h("post-icon", { key: 'e19209e0c8de59d3e187531e0185d8f2d5c85408', "aria-hidden": "true", name: "closex" }), index.h("span", { key: '233184a45391e5a9b89635345f2324a87f5e9558', class: "visually-hidden" }, index.h("slot", { key: 'c213ac1dbdd98d83a8b2dc1b74c85926404ad1c1' })))));
     }
     get host() { return index.getElement(this); }
+    static get watchers() { return {
+        "buttonType": ["validateButtonType"]
+    }; }
 };
 PostClosebutton.style = postClosebuttonCss;
 
@@ -54,41 +114,7 @@ function slideDown(el, translateSize = '-100%') {
     });
 }
 
-const focusableSelector = `:where(${[
-    'button',
-    'input:not([type="hidden"])',
-    '[tabindex]',
-    'select',
-    'textarea',
-    '[contenteditable]',
-    'a[href]',
-    'iframe',
-    'audio[controls]',
-    'video[controls]',
-    'area[href]',
-    'details > summary:first-of-type',
-].join(',')})`;
-const focusDisablingSelector = `:where(${[
-    '[inert]',
-    '[inert] *',
-    ':disabled',
-    'dialog:not([open]) *',
-    '[popover]:not(:popover-open) *',
-    'details:not([open]) > *:not(details > summary:first-of-type)',
-    'details:not([open]) > *:not(details > summary:first-of-type) *',
-    '[tabindex^="-"]',
-    '[hidden]:not([hidden="false"])',
-].join(',')})`;
-function getFocusableChildren(element) {
-    const focusableChildren = element.querySelectorAll(`${focusableSelector}:not(${focusDisablingSelector})`);
-    const visibleFocusableChildren = Array.from(focusableChildren).filter(child => {
-        const style = window.getComputedStyle(child.parentElement);
-        return style.display !== 'none' && style.visibility !== 'hidden';
-    });
-    return visibleFocusableChildren;
-}
-
-const postHeaderCss = "*,::before,::after{box-sizing:border-box}:host{z-index:1020;position:relative;--post-logo-height:calc(var(--post-global-header-expanded-height) - var(--post-header-scroll-top, 0px));--post-global-header-top:calc( var(--post-global-header-reduced-height) - var(--post-global-header-expanded-height) );--post-local-header-top:calc( var(--post-global-header-reduced-height) + var(--post-local-header-reduced-height) - var(--post-local-header-expanded-height) );--post-global-controls-top:clamp( 1000 * var(--post-global-header-top),  calc(-1 * min(var(--post-header-scroll-top, 0px) / 4, var(--post-global-header-reduced-height))), 0px )}@media screen and (min-width: 1024px){:host:has(.global-sub>*:not(.logo):focus-within),:host:has(.local-sub:focus-within){--post-global-header-top:0;--post-local-header-top:var(--post-global-header-expanded-height);--post-logo-height:var(--post-global-header-expanded-height);--post-global-controls-top:0}}.d-flex{display:flex}.space-between{justify-content:space-between}.global-header{background-color:#fc0;display:flex;justify-content:space-between;position:sticky;padding-inline:4px;height:var(--post-global-header-expanded-height)}@media screen and (max-width: 1023.98px){.global-header{z-index:4;inset-block-start:0}}@media screen and (min-width: 1024px){.global-header{z-index:5;padding-inline-end:8px;inset-block-start:var(--post-global-header-top);transition:inset-block-start .2s ease-in-out}}.global-header:has(+.local-header.no-navigation.no-title){box-shadow:var(--post-device-elevation-300)}.global-sub{display:flex;align-items:center;gap:24px}@media screen and (min-width: 1024px){.global-sub:not(:has(.logo)){position:relative;transition:inset-block-start .2s ease-in-out;inset-block-start:var(--post-global-controls-top)}.global-sub:not(:last-child):not(:first-child){flex-grow:1}}.align-end{align-items:flex-end}.logo{flex:1 0 auto;height:var(--post-global-header-expanded-height);width:var(--post-global-header-expanded-height);min-height:var(--post-global-header-reduced-height);align-self:flex-end}@media screen and (min-width: 1024px){.logo{transition:height .2 ease-in-out;height:var(--post-logo-height)}}::slotted(ul){margin-block:0 !important;list-style:none;display:flex;padding-inline-start:0;gap:1rem;flex-shrink:0 !important}.local-header{display:flex;position:sticky;inset-block-start:var(--post-local-header-top);flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px;min-height:var(--post-local-header-expanded-min-height);background:#fff;transition:box-shadow .2s ease-in-out}.local-header::after{content:\"\";position:absolute;width:100%;height:1px;background-color:#e1e0dc;inset-block-end:-1px;z-index:1}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.local-header::after{background-color:Highlight}}@media screen and (min-width: 1024px){.local-header{z-index:3;box-shadow:var(--post-device-elevation-300);transition:box-shadow .2s ease-in-out,inset-block-start .2s ease-in-out}.local-header:not(.no-title){padding-block-start:18px}}@media screen and (max-width: 1023.98px){.local-header{z-index:3;padding-block:8px;flex-wrap:wrap;gap:12px}.local-header.local-header-mobile-extended::after{inset-block-end:0}.local-header:not(.local-header-mobile-extended){box-shadow:var(--post-device-elevation-300)}}.local-header.no-navigation{padding-block:0}.local-header.no-navigation .navigation{display:none}.local-header.no-navigation.no-title{display:none}.local-sub{margin-inline-end:16px}@media screen and (max-width: 1023.98px){.local-sub{margin-inline-end:4px}}::slotted(.list-inline){margin:0 !important;z-index:3 !important;position:relative !important}@media screen and (min-width: 1024px){.mobile-toggle{display:none}}.navigation{width:100%}@media screen and (min-width: 1024px){.navigation{inset-block-start:var(--post-global-header-reduced-height)}.navigation::before{display:block;content:\"\";position:absolute;inset:0;z-index:2;background:#fff}}@media screen and (max-width: 1023.98px){.navigation{position:sticky;z-index:2;inset-inline:0;inset-block-start:var(--post-header-height)}.mobile-menu{background-color:#fafafa}::slotted(post-mainnavigation),.navigation-footer{padding-block:16px 24px;padding-inline:40px}::slotted(post-mainnavigation),.navigation-footer,.navigation-target-group{display:none;flex-direction:column}.navigation.extended ::slotted(post-mainnavigation),.navigation.extended .navigation-footer,.navigation.extended .navigation-target-group{display:flex}::slotted(post-mainnavigation){padding-block:24px}.navigation.extended>div{display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;height:calc(min(var(--post-header-scroll-parent-height, 100dvh),100dvh) - var(--post-header-height))}.navigation.extended.megadropdown-open>div{overflow-y:hidden}.navigation.extended ::slotted(post-mainnavigation){flex-grow:1 !important}.navigation-footer{background-color:#f0efed;gap:24px}.navigation-footer ::slotted(post-language-switch){margin-top:16px}}@media screen and (max-width: 1023.98px)and (max-width: 599.98px){.navigation-footer{gap:16px}}@media screen and (max-width: 599.98px){::slotted(post-mainnavigation),.navigation-footer{padding-inline:16px}}";
+const postHeaderCss = "*,::before,::after{box-sizing:border-box}:host{z-index:1020;position:relative;--post-logo-height:calc(var(--post-global-header-expanded-height) - var(--post-header-scroll-top, 0px));--post-global-header-top:calc( var(--post-global-header-reduced-height) - var(--post-global-header-expanded-height) );--post-local-header-top:calc( var(--post-global-header-reduced-height) + var(--post-local-header-reduced-height) - var(--post-local-header-expanded-height) );--post-global-controls-top:clamp( 1000 * var(--post-global-header-top),  calc(-1 * min(var(--post-header-scroll-top, 0px) / 4, var(--post-global-header-reduced-height))), 0px )}@media screen and (min-width: 1024px){:host:has(.global-sub>*:not(.logo):focus-within),:host:has(.local-sub:focus-within){--post-global-header-top:0;--post-local-header-top:var(--post-global-header-expanded-height);--post-logo-height:var(--post-global-header-expanded-height);--post-global-controls-top:0}}.d-flex{display:flex}.space-between{justify-content:space-between}.global-header{background-color:#fc0;display:flex;justify-content:space-between;position:sticky;padding-inline:4px;height:var(--post-global-header-expanded-height)}@media screen and (max-width: 1023.98px){.global-header{z-index:4;inset-block-start:0}}@media screen and (min-width: 1024px){.global-header{z-index:5;padding-inline-end:8px;inset-block-start:var(--post-global-header-top);transition:inset-block-start .2s ease-in-out}}.global-header:has(+.local-header.no-navigation.no-title){box-shadow:var(--post-device-elevation-300)}.global-sub{display:flex;align-items:center;gap:4px}@media screen and (min-width: 1024px){.global-sub:not(:has(.logo)){position:relative;transition:inset-block-start .2s ease-in-out;inset-block-start:var(--post-global-controls-top)}.global-sub:not(:last-child):not(:first-child){flex-grow:1}}.align-end{align-items:flex-end}.logo{flex:1 0 auto;height:var(--post-global-header-expanded-height);width:var(--post-global-header-expanded-height);min-height:var(--post-global-header-reduced-height);align-self:flex-end}@media screen and (min-width: 1024px){.logo{transition:height .2 ease-in-out;height:var(--post-logo-height)}}::slotted(ul){margin-block:0 !important;list-style:none;display:flex;padding-inline-start:0;gap:1rem;flex-shrink:0 !important}.local-header{display:flex;position:sticky;inset-block-start:var(--post-local-header-top);flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px;min-height:var(--post-local-header-expanded-min-height);background:#fff;transition:box-shadow .2s ease-in-out}.local-header::after{content:\"\";position:absolute;width:100%;height:1px;background-color:#e1e0dc;inset-block-end:-1px;z-index:1}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.local-header::after{background-color:Highlight}}@media screen and (min-width: 1024px){.local-header{z-index:3;box-shadow:var(--post-device-elevation-300);transition:box-shadow .2s ease-in-out,inset-block-start .2s ease-in-out}.local-header:not(.no-title){padding-block-start:18px}}@media screen and (max-width: 1023.98px){.local-header{z-index:3;padding-block:8px;flex-wrap:wrap;gap:12px}.local-header.local-header-mobile-extended::after{inset-block-end:0}.local-header:not(.local-header-mobile-extended){box-shadow:var(--post-device-elevation-300)}}.local-header.no-navigation{padding-block:0}.local-header.no-navigation .navigation{display:none}.local-header.no-navigation.no-title{display:none}.local-sub{margin-inline-end:16px}@media screen and (max-width: 1023.98px){.local-sub{margin-inline-end:4px}}::slotted(.list-inline){margin:0 !important;z-index:3 !important;position:relative !important}@media screen and (min-width: 1024px){.mobile-toggle{display:none}}.navigation{width:100%}@media screen and (min-width: 1024px){.navigation{display:flex;align-items:center;justify-content:space-between;inset-block-start:var(--post-global-header-reduced-height)}.navigation::before{display:block;content:\"\";position:absolute;inset:0;z-index:2;background:#fff}}@media screen and (max-width: 1023.98px){.navigation{position:sticky;z-index:2;inset-inline:0;inset-block-start:var(--post-header-height)}.mobile-menu{background-color:#fafafa}::slotted(post-mainnavigation),.navigation-footer{padding-block:16px 24px;padding-inline:40px}.navigation-header,::slotted(post-mainnavigation),.navigation-footer{display:none;flex-direction:column}.navigation.extended .navigation-header,.navigation.extended ::slotted(post-mainnavigation),.navigation.extended .navigation-footer{display:flex}::slotted(post-mainnavigation){padding-block:24px}.navigation.extended>div{display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;height:calc(min(var(--post-header-scroll-parent-height, 100dvh),100dvh) - var(--post-header-height))}.navigation.extended.megadropdown-open>div{overflow-y:hidden}.navigation.extended ::slotted(post-mainnavigation){flex-grow:1 !important}.navigation-footer{background-color:#f0efed;gap:24px}.navigation-footer ::slotted(post-language-switch){margin-top:16px}}@media screen and (max-width: 1023.98px)and (max-width: 599.98px){.navigation-footer{gap:16px}}@media screen and (max-width: 599.98px){::slotted(post-mainnavigation),.navigation-footer{padding-inline:16px}}";
 
 var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -193,7 +219,8 @@ const PostHeader = class {
         window.removeEventListener('postBreakpoint:device', this.breakpointChange);
         window.removeEventListener('resize', this.throttledResize);
         window.removeEventListener('scroll', this.handleScrollEvent);
-        scrollParent.removeEventListener('scroll', this.handleScrollEvent);
+        if (scrollParent)
+            scrollParent.removeEventListener('scroll', this.handleScrollEvent);
         document.removeEventListener('postToggleMegadropdown', this.megadropdownStateHandler);
         this.host.removeEventListener('keydown', this.keyboardHandler);
         this.host.removeEventListener('click', this.handleLinkClick);
@@ -338,15 +365,11 @@ const PostHeader = class {
         });
     }
     renderNavigation() {
-        const navigationClasses = ['navigation'];
-        const mobileMenuScrollTop = this.mobileMenu?.scrollTop ?? 0;
-        if (this.mobileMenuExtended) {
-            navigationClasses.push('extended');
+        const mainNavigation = (index.h("slot", { name: "post-mainnavigation", onSlotchange: () => this.checkNavigationExistence() }));
+        if (this.device === 'desktop') {
+            return (index.h("div", { class: { 'navigation': true, 'megadropdown-open': this.megadropdownOpen } }, mainNavigation, index.h("slot", { name: "navigation-controls" })));
         }
-        if (this.megadropdownOpen) {
-            navigationClasses.push('megadropdown-open');
-        }
-        return (index.h("div", { class: navigationClasses.join(' '), style: { '--post-header-navigation-current-inset': `${mobileMenuScrollTop}px` } }, index.h("div", { class: "mobile-menu", ref: el => (this.mobileMenu = el) }, index.h("div", { class: "navigation-target-group" }, (this.device === 'mobile' || this.device === 'tablet') && (index.h("slot", { name: "target-group" }))), index.h("slot", { name: "post-mainnavigation", onSlotchange: () => this.checkNavigationExistence() }), (this.device === 'mobile' || this.device === 'tablet') && (index.h("div", { class: "navigation-footer" }, index.h("slot", { name: "meta-navigation" }), index.h("slot", { name: "post-language-switch" }))))));
+        return (index.h("div", { class: { navigation: true, extended: this.mobileMenuExtended }, style: { '--post-header-navigation-current-inset': `${this.mobileMenu?.scrollTop ?? 0}px` } }, index.h("div", { class: "mobile-menu", ref: el => (this.mobileMenu = el) }, index.h("div", { class: "navigation-header" }, index.h("slot", { name: "navigation-controls" }), index.h("slot", { name: "target-group" })), mainNavigation, index.h("div", { class: "navigation-footer" }, index.h("slot", { name: "meta-navigation" }), index.h("slot", { name: "post-language-switch" })))));
     }
     render() {
         const localHeaderClasses = ['local-header'];
@@ -356,8 +379,7 @@ const PostHeader = class {
             localHeaderClasses.push('no-navigation');
         if (!this.hasTitle)
             localHeaderClasses.push('no-title');
-        return (index.h(index.Host, { key: 'd327fc8735749f46cb8b38531a8514978f92c197', "data-version": _package.version, "data-color-scheme": "light" }, index.h("div", { key: '07b7a4861cc11d55fce5d749a1d074d37900b48f', class: "global-header" }, index.h("div", { key: 'bb23cf58b62b53e273921bb0a27a2371983bc8a8', class: "global-sub" }, index.h("div", { key: '0028ff1ba8be25a238d944eaf25f9679b9e163c6', class: "logo" }, index.h("slot", { key: '98e0584188a391b99df904fbdf463606548859c7', name: "post-logo" }))), index.h("div", { key: '6da75517e0923191cc4d478a3f0c7e20d89b860d', class: "global-sub" }, this.device === 'desktop' && index.h("slot", { key: 'bf5730915d734e9accb0e10bcd0d48ee99781930', name: "target-group" })), index.h("div", { key: '64f3eafd98d8c34248de4fb78619bb7f3147e5e9', class: "global-sub" }, !this.hasMobileMenu && (index.h("slot", { key: 'c3ad33a44bf25fede0afbea50937626142e69b6e', name: "meta-navigation" })), index.h("slot", { key: 'e85d50753a40958be785deebfe01ffbee91f120b', name: "global-controls" }), !this.hasMobileMenu && index.h("slot", { key: 'e423f47daa544cb7bd11ed54f0ecef93a50e6470', name: "post-language-switch" }), this.hasNavigation && (index.h("div", { key: '96be5d590fbee1986238e1b7b22a1e6928c1c97f', onClick: () => this.toggleMobileMenu(), class: "mobile-toggle" }, index.h("slot", { key: '4c9db8b0c416cbd2ffa4e1df6b05aea757bdc6a6', name: "post-togglebutton" }))))), index.h("div", { key: '43285a4032f7ae356145ce6fb62e3c9896ad8542', class: localHeaderClasses.join(' ') }, index.h("slot", { key: '74c2313baa4da4bf37d13189c07645374df684d1', name: "title", onSlotchange: () => this.checkTitleExistence() }), this.hasTitle &&
-            (index.h("div", { key: '414b5378922221715071a5d8cfc0b7920018a5b3', class: "local-sub" }, index.h("slot", { key: 'acb09003e517669a50405a04e5dafa983e78b5f2', name: "local-controls" }), index.h("slot", { key: '8e1043c4d2e25b6b9432a2ba1885d2128abb9f85' }))), this.device === 'desktop' && this.renderNavigation()), this.device !== 'desktop' && this.renderNavigation()));
+        return (index.h(index.Host, { key: 'fd3c4a534af28b2e35f4a02502283e04be0d9683', "data-version": _package.version, "data-color-scheme": "light" }, index.h("div", { key: '61c70adea7525d3daa7690ac9243c7697df5c8bc', class: "global-header" }, index.h("div", { key: '1fdb106a9624a07d3ad3fd1cb4eade9b05282ab5', class: "global-sub" }, index.h("div", { key: '2c62bccfa8d5fa9642528db265e76aac0d13022c', class: "logo" }, index.h("slot", { key: '75b87c2428b7ccad6940976e46156b807257cbc5', name: "post-logo" }))), index.h("div", { key: 'c1950198cbac96132ca5b1c886bb94238c53b903', class: "global-sub" }, this.device === 'desktop' && index.h("slot", { key: '2e695987df3da854db3ec18cc4b1283d0f06dfd1', name: "target-group" })), index.h("div", { key: '50366842180e3aae87d4e4da68a8f73c2f62c347', class: "global-sub" }, index.h("slot", { key: '7eba07e3dddbc26843a50b39a69953a01d9e2a5e', name: "global-controls" }), !this.hasMobileMenu && index.h("slot", { key: 'aa9fc50e2eb8eee4e3d9de76ccbf564ac30a8d03', name: "meta-navigation" }), !this.hasMobileMenu && index.h("slot", { key: '7742f0d0e30d5b0d90ca9352fec72e49a97ec3cb', name: "post-language-switch" }), index.h("slot", { key: 'a3545c4bb2a61c00105763059f3bd66ddd829681', name: "global-login" }), this.hasNavigation && (index.h("div", { key: 'bb8df618571ea8cadb89b0cd8d50bba7c0dec038', onClick: () => this.toggleMobileMenu(), class: "mobile-toggle" }, index.h("slot", { key: '83b9542127213e39644c280cf9f4e19aaf3f071a', name: "post-togglebutton" }))))), index.h("div", { key: '2ab719d2610d46050fc99345237b7b9cc54fd467', class: localHeaderClasses.join(' ') }, index.h("slot", { key: '0e02b3f7421a1c67e99fdc92aadcf61153665820', name: "title", onSlotchange: () => this.checkTitleExistence() }), this.hasTitle && (index.h("div", { key: '94b091a29727bd556a4907ac4bdb2f8757483135', class: "local-sub" }, index.h("slot", { key: '7647015350e21278b104ff4538525abeaea98442', name: "local-controls" }), index.h("slot", { key: '4e42d3fe5c4f676b7bb836c976c1d7e59a1052ae' }))), this.device === 'desktop' && this.renderNavigation()), this.device !== 'desktop' && this.renderNavigation()));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {
@@ -481,7 +503,7 @@ const PostIcon = class {
         this.validateAnimation();
     }
     render() {
-        return (index.h(index.Host, { key: '521fb549cef7d0838c999628cf69c5c23e87dfc6', "data-version": _package.version }, index.h("span", { key: 'cc9ca579bd90fee8cec7868c697bfe59dd677246', style: this.getStyles() })));
+        return (index.h(index.Host, { key: '0031b3e2e4016f9b28cade66fa435741940946a7', "data-version": _package.version }, index.h("span", { key: '0efbcdd5f1dd737640238a0ab81b67ca8218adec', style: this.getStyles() })));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {
@@ -547,7 +569,7 @@ const PostLanguageOption = class {
                 this.emitChange();
             }
         };
-        return (index.h(index.Host, { key: 'deaee69d7e0c551af5162ae124f78c9418aba062', "data-version": _package.version, role: this.variant === 'list' ? 'listitem' : undefined }, this.url ? (index.h("a", { "aria-current": this.active ? 'page' : undefined, href: this.url, hrefLang: lang, lang: lang, onClick: () => this.emitChange(), onKeyDown: emitOnKeyDown }, index.h("slot", null), index.h("span", { class: "visually-hidden" }, this.name))) : (index.h("button", { "aria-current": this.active ? 'true' : undefined, lang: lang, onClick: () => this.emitChange(), onKeyDown: emitOnKeyDown }, index.h("slot", null), index.h("span", { class: "visually-hidden" }, this.name)))));
+        return (index.h(index.Host, { key: 'b86bf33feb890e5dfbfae16f45ce2e56fdfaf16a', "data-version": _package.version, role: this.variant === 'list' ? 'listitem' : undefined }, this.url ? (index.h("a", { "aria-current": this.active ? 'page' : undefined, href: this.url, hrefLang: lang, lang: lang, onClick: () => this.emitChange(), onKeyDown: emitOnKeyDown }, index.h("slot", null), index.h("span", { class: "visually-hidden" }, this.name))) : (index.h("button", { "aria-current": this.active ? 'true' : undefined, lang: lang, onClick: () => this.emitChange(), onKeyDown: emitOnKeyDown }, index.h("slot", null), index.h("span", { class: "visually-hidden" }, this.name)))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {
@@ -639,7 +661,7 @@ const PostLanguageSwitch = class {
         return (index.h(index.Host, { "data-version": _package.version }, index.h("div", { class: "post-language-switch-list", role: "list", "aria-label": this.caption, "aria-describedby": this.listSpanId }, index.h("span", { id: this.listSpanId, class: "visually-hidden" }, this.description), index.h("slot", null))));
     }
     renderDropdown() {
-        return (index.h(index.Host, { "data-version": _package.version }, index.h("post-menu-trigger", { for: this.menuId }, index.h("button", { class: "post-language-switch-trigger" }, this.activeLang, index.h("span", { class: "visually-hidden" }, this.caption), index.h("span", { class: "visually-hidden" }, this.description), index.h("post-icon", { "aria-hidden": "true", name: "chevrondown" }))), index.h("post-menu", { id: this.menuId, class: "post-language-switch-dropdown-container" }, index.h("slot", null))));
+        return (index.h(index.Host, { "data-version": _package.version }, index.h("post-menu-trigger", { for: this.menuId }, index.h("button", { class: "post-language-switch-trigger" }, this.activeLang, index.h("span", { class: "visually-hidden" }, this.caption), index.h("span", { class: "visually-hidden" }, this.description), index.h("post-icon", { "aria-hidden": "true", name: "chevrondown" }))), index.h("post-menu", { id: this.menuId, class: "post-language-switch-dropdown-container", label: this.caption }, index.h("slot", null))));
     }
     render() {
         return this.variant === 'list' ? this.renderList() : this.renderDropdown();
@@ -685,7 +707,7 @@ const PostList = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '27dc0177ba3d81149b6b5dce24d6f18b8f57c9e5', "data-version": _package.version }, index.h("div", { key: 'f860eaeafc60605c67fb0c47e452ecfdbf03d002', ref: el => (this.titleEl = el), id: this.titleId, class: `list-title${this.titleHidden ? ' visually-hidden' : ''}` }, index.h("slot", { key: '17e20fdcf588649a9d678f873687cdedaef931aa' })), index.h("div", { key: 'aebdcd2fe4b5a4d232b0fe3de7f6273c93f505f6', role: "list", "aria-labelledby": this.titleId }, index.h("slot", { key: 'fa15f227e3251d44d1519421960bb5f3056fc371', name: "post-list-item" }))));
+        return (index.h(index.Host, { key: '908588a3f1261efbb85dbefade9f85f8ec6f16f8', "data-version": _package.version }, index.h("div", { key: '44b224379be814dab98e16ad12a3ca0f10e61ac0', ref: el => (this.titleEl = el), id: this.titleId, class: `list-title${this.titleHidden ? ' visually-hidden' : ''}` }, index.h("slot", { key: '1aed36b7c286796a4d617643e7606e63bc2dd95a' })), index.h("div", { key: '3e1d137712b3e7616bab450426964f6c9334198e', role: "list", "aria-labelledby": this.titleId }, index.h("slot", { key: 'fd5abb2fca95d32295fbfa158795413264200ae8', name: "post-list-item" }))));
     }
     get host() { return index.getElement(this); }
 };
@@ -701,7 +723,7 @@ const PostListItem = class {
         this.host.setAttribute('slot', 'post-list-item');
     }
     render() {
-        return (index.h(index.Host, { key: 'd15e750cd663def9363bedd020f09e634aba14c9', role: "listitem", slot: "post-list-item", version: _package.version }, index.h("slot", { key: '361853e5c5994de4e5a5884cc32d7c7280b62b56' })));
+        return (index.h(index.Host, { key: '67204f0c31a6bc4cad3359030a8da57a045de7c5', role: "listitem", slot: "post-list-item", version: _package.version }, index.h("slot", { key: '0c68073c601a3792880fc0e68af24a4a204548ed' })));
     }
     get host() { return index.getElement(this); }
 };
@@ -728,7 +750,7 @@ const PostLogo = class {
     render() {
         const logoLink = this.url && (typeof this.url === 'string' ? this.url : this.url.href);
         const LogoTag = logoLink ? 'a' : 'span';
-        return (index.h(index.Host, { key: '1c268056329697baccc5bf65b1e66acd8531d5f3', "data-version": _package.version }, index.h(LogoTag, { key: '9b73fc4922a5ea0f72d761e82136ef1111eb7e21', class: `logo ${logoLink ? 'logo-link' : ''}`, ...(logoLink ? { href: logoLink } : {}) }, index.h("span", { key: '4042a64056f3d22a99d6b245201be20d1afe5dc0', class: "description" }, index.h("slot", { key: 'eb437f087d952b4f4a961bcba0dc18eb6836c6c9', onSlotchange: () => this.checkDescription() })), index.h("svg", { key: 'b658e94d0e7f63d2f80245e12017f87f50a0b2c9', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 72 72", "aria-hidden": "true" }, index.h("g", { key: '90c0c8f64d0c9023dfa7296e68333232b9023276', id: "Logo" }, index.h("rect", { key: 'a1dfd6e0bcaedb485398f1896603af36e3f119dc', fill: "#ffcc00", x: "0", y: "0", width: "72", height: "72" }), index.h("polygon", { key: '44d5ee8e45b7b320d75530e00ab1ff8dc4b8e21c', fill: "#ff0000", points: "34,32.3 34,19 19.7,19 19.7,29.1 10,29.1 10,42.9 19.7,42.9 19.7,53 34,53 34,39.7 30.6,39.7 30.6,49.8 23.1,49.8 23.1,39.7 13.4,39.7 13.4,32.3 23.1,32.3 23.1,22.2 30.6,22.2 30.6,32.3" }), index.h("path", { key: '788524d12213fdfe0d21712b14d72e30d0195b4d', d: "M53.56234,31.10526c0,2.41272-1.99154,4.29475-4.51723,4.29475H45.2v-8.3h3.84511C51.66802,27.1,53.56234,28.78889,53.56234,31.10526z M50.69666,19H36v34h9.2V42.9h5.49666c6.75131,0,11.9971-5.15137,11.9971-11.8057C62.69376,24.39136,57.35099,19,50.69666,19z" }))))));
+        return (index.h(index.Host, { key: 'acd3bfab8d395cde2d79066580a8e53e65c426f4', "data-version": _package.version }, index.h(LogoTag, { key: 'c5c2f8a2be6204bb693d5d53fd95e75133518a1d', class: `logo ${logoLink ? 'logo-link' : ''}`, ...(logoLink ? { href: logoLink } : {}) }, index.h("span", { key: '675b756441237173c1046b74c2dfe2dfc08bfd7f', class: "description" }, index.h("slot", { key: '710fd3483f56ad353e1a99f4fff2acc78ee53b46', onSlotchange: () => this.checkDescription() })), index.h("svg", { key: 'e72b70e26da0fefd52a7e9aec41772dd5c9f0258', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 72 72", "aria-hidden": "true" }, index.h("g", { key: 'b67d56c9319bb576a56c76c5299f4a81c93d6c3c', id: "Logo" }, index.h("rect", { key: '8c073060a51c5e6942c1b33fc5c2a3a7eb422f07', fill: "#ffcc00", x: "0", y: "0", width: "72", height: "72" }), index.h("polygon", { key: 'f97840922aa977b0f74bc5e8a88ff99136c80e46', fill: "#ff0000", points: "34,32.3 34,19 19.7,19 19.7,29.1 10,29.1 10,42.9 19.7,42.9 19.7,53 34,53 34,39.7 30.6,39.7 30.6,49.8 23.1,49.8 23.1,39.7 13.4,39.7 13.4,32.3 23.1,32.3 23.1,22.2 30.6,22.2 30.6,32.3" }), index.h("path", { key: 'f7faf347bb660e2a4550b48fc2d997ad01b2b8ae', d: "M53.56234,31.10526c0,2.41272-1.99154,4.29475-4.51723,4.29475H45.2v-8.3h3.84511C51.66802,27.1,53.56234,28.78889,53.56234,31.10526z M50.69666,19H36v34h9.2V42.9h5.49666c6.75131,0,11.9971-5.15137,11.9971-11.8057C62.69376,24.39136,57.35099,19,50.69666,19z" }))))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {
@@ -737,7 +759,7 @@ const PostLogo = class {
 };
 PostLogo.style = postLogoCss;
 
-const postMainnavigationCss = "post-mainnavigation post-list-item>a{text-decoration:none;border-radius:0}post-mainnavigation post-list-item post-megadropdown-trigger button{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;text-align:start}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button{background-color:ButtonFace !important}post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:Highlight !important}}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item post-megadropdown-trigger button{flex:0 0 fit-content;white-space:nowrap;display:flex;align-items:center;justify-content:space-between}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}post-mainnavigation post-list-item>a:focus-visible,post-mainnavigation post-list-item post-megadropdown-trigger button:focus-visible{border-radius:4px;outline-offset:-2px !important}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{content:\"\";mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m23.6 13.2-7.5 7.6-7.6-7.6.9-.9 6.6 6.6 6.6-6.6z'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;height:24px;width:24px}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation>button,post-mainnavigation post-megadropdown-trigger button{border:1px solid ButtonBorder !important}post-mainnavigation>button:hover::after,post-mainnavigation>button[aria-expanded=true]::after,post-mainnavigation post-megadropdown-trigger button:hover::after,post-mainnavigation post-megadropdown-trigger button[aria-expanded=true]::after{color:HighlightText}}@media screen and (min-width: 1024px){post-mainnavigation{display:block;position:relative;height:var(--post-main-navigation-height, 0);background:#fff;user-select:none}post-mainnavigation nav{flex:1 1 auto;overflow:hidden;scroll-behavior:smooth}post-mainnavigation .scroll-control{cursor:pointer;position:absolute;inset-block:0;z-index:5;padding:16px;background:#fff;box-shadow:var(--post-device-elevation-500);line-height:1}post-mainnavigation .scroll-control.scroll-left{inset-inline-start:0}post-mainnavigation .scroll-control.scroll-right{inset-inline-end:0}post-mainnavigation .scroll-control.d-none{display:none}post-mainnavigation .scroll-control post-icon{font-size:1rem}post-mainnavigation post-list>[role=list]{flex-direction:row;max-width:100vw}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{position:sticky;padding-inline:12px;height:var(--post-main-navigation-height, 0);gap:4px;font-size:16px;z-index:4}}@media screen and (min-width: 1024px)and (max-width: 1023.98px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{z-index:5}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a .nav-el-active,post-mainnavigation post-list-item>button .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-active{font-weight:700;text-align:center;opacity:0}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{position:absolute;opacity:1;text-align:center;width:100%;inset-inline-start:0}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a.selected,post-mainnavigation post-list-item>a[aria-current=page]:not(post-megadropdown *),post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.selected,post-mainnavigation post-list-item>button[aria-current=page]:not(post-megadropdown *),post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.selected,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page]:not(post-megadropdown *),post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff;font-weight:700}post-mainnavigation post-list-item>a.selected .nav-el-active,post-mainnavigation post-list-item>a[aria-current=page]:not(post-megadropdown *) .nav-el-active,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item>button.selected .nav-el-active,post-mainnavigation post-list-item>button[aria-current=page]:not(post-megadropdown *) .nav-el-active,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button.selected .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page]:not(post-megadropdown *) .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-active{opacity:1}post-mainnavigation post-list-item>a.selected .nav-el-inactive,post-mainnavigation post-list-item>a[aria-current=page]:not(post-megadropdown *) .nav-el-inactive,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item>button.selected .nav-el-inactive,post-mainnavigation post-list-item>button[aria-current=page]:not(post-megadropdown *) .nav-el-inactive,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button.selected .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page]:not(post-megadropdown *) .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-inactive{opacity:0}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}}@media screen and (min-width: 1024px)and (max-width: 599.98px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{font-size:14px}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{padding-inline-end:12px;transition:border-block-end-color 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{width:calc(100% - 28px)}post-mainnavigation post-list-item>button::after,post-mainnavigation post-list-item post-megadropdown-trigger button::after{transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button[aria-expanded=true]::after,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]::after{transform:rotate(180deg)}}@media screen and (min-width: 1024px){post-mainnavigation post-megadropdown button:not(.btn-icon-close),post-mainnavigation post-megadropdown a{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-megadropdown button:not(.btn-icon-close)::before,post-mainnavigation post-megadropdown a::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-megadropdown button:not(.btn-icon-close).selected,post-mainnavigation post-megadropdown button:not(.btn-icon-close)[aria-current=page],post-mainnavigation post-megadropdown button:not(.btn-icon-close)[aria-expanded=true],post-mainnavigation post-megadropdown a.selected,post-mainnavigation post-megadropdown a[aria-current=page],post-mainnavigation post-megadropdown a[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-megadropdown button:not(.btn-icon-close):hover,post-mainnavigation post-megadropdown a:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-megadropdown button:not(.btn-icon-close):hover::before,post-mainnavigation post-megadropdown a:hover::before{background-color:#504f4b}}@media screen and (max-width: 1023.98px){post-mainnavigation nav{transform:none !important}post-mainnavigation .scroll-control{display:none}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-list-item>a::before,post-mainnavigation post-list-item>button::before,post-mainnavigation post-list-item post-megadropdown-trigger button::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-list-item>a.selected,post-mainnavigation post-list-item>a[aria-current=page],post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.selected,post-mainnavigation post-list-item>button[aria-current=page],post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.selected,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page],post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-list-item>a:hover::before,post-mainnavigation post-list-item>button:hover::before,post-mainnavigation post-list-item post-megadropdown-trigger button:hover::before{background-color:#504f4b}post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{display:none}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{transform:rotate(-90deg)}}";
+const postMainnavigationCss = ":root{--post-icon-2113:url(\"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxkZWZzPjxzeW1ib2wgaWQ9ImktMjExMyIgdmlld0JveD0iMCAwIDMyIDMyIj48cGF0aCBkPSJtMjMuNiAxMy4yLTcuNSA3LjYtNy42LTcuNi45LS45IDYuNiA2LjYgNi42LTYuNnoiLz48L3N5bWJvbD48L2RlZnM+PHVzZSBocmVmPSIjaS0yMTEzIi8+PC9zdmc+\")}post-mainnavigation post-list-item>a{text-decoration:none;border-radius:0}post-mainnavigation post-list-item post-megadropdown-trigger button{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;text-align:start}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button{background-color:ButtonFace !important}post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:Highlight !important}}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item post-megadropdown-trigger button{flex:0 0 fit-content;white-space:nowrap;display:flex;align-items:center;justify-content:space-between}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}post-mainnavigation post-list-item>a:focus-visible,post-mainnavigation post-list-item post-megadropdown-trigger button:focus-visible{border-radius:4px;outline-offset:-2px !important}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{content:\"\";mask-image:var(--post-icon-2113);background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;height:24px;width:24px}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation>button,post-mainnavigation post-megadropdown-trigger button{border:1px solid ButtonBorder !important}post-mainnavigation>button:hover::after,post-mainnavigation>button[aria-expanded=true]::after,post-mainnavigation post-megadropdown-trigger button:hover::after,post-mainnavigation post-megadropdown-trigger button[aria-expanded=true]::after{color:HighlightText}}@media screen and (min-width: 1024px){post-mainnavigation{display:flex;overflow:hidden;height:var(--post-main-navigation-height, 0);background:#fff;user-select:none}post-mainnavigation nav{flex:1 1 auto;overflow:hidden;scroll-behavior:smooth}post-mainnavigation .scroll-control{cursor:pointer;z-index:5;padding:1rem;background:#fff;box-shadow:var(--post-device-elevation-500);line-height:1}post-mainnavigation .scroll-control.scroll-left{margin-inline-end:-3rem}post-mainnavigation .scroll-control.scroll-right{margin-inline-start:-3rem}post-mainnavigation .scroll-control.d-none{display:none}post-mainnavigation .scroll-control post-icon{font-size:1rem}post-mainnavigation post-list>[role=list]{flex-direction:row;max-width:100vw}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{position:sticky;padding-inline:12px;height:var(--post-main-navigation-height, 0);gap:4px;font-size:16px;z-index:4}}@media screen and (min-width: 1024px)and (max-width: 1023.98px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{z-index:5}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a .nav-el-active,post-mainnavigation post-list-item>button .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-active{font-weight:700;text-align:center;opacity:0}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{position:absolute;opacity:1;text-align:center;width:100%;inset-inline-start:0}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a.active,post-mainnavigation post-list-item>a[aria-current=page]:not(post-megadropdown *),post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.active,post-mainnavigation post-list-item>button[aria-current=page]:not(post-megadropdown *),post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page]:not(post-megadropdown *),post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff;font-weight:700}post-mainnavigation post-list-item>a.active .nav-el-active,post-mainnavigation post-list-item>a[aria-current=page]:not(post-megadropdown *) .nav-el-active,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item>button.active .nav-el-active,post-mainnavigation post-list-item>button[aria-current=page]:not(post-megadropdown *) .nav-el-active,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button.active .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page]:not(post-megadropdown *) .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-active{opacity:1}post-mainnavigation post-list-item>a.active .nav-el-inactive,post-mainnavigation post-list-item>a[aria-current=page]:not(post-megadropdown *) .nav-el-inactive,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item>button.active .nav-el-inactive,post-mainnavigation post-list-item>button[aria-current=page]:not(post-megadropdown *) .nav-el-inactive,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button.active .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page]:not(post-megadropdown *) .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-inactive{opacity:0}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}}@media screen and (min-width: 1024px)and (max-width: 599.98px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{font-size:14px}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{padding-inline-end:12px;transition:border-block-end-color 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{width:calc(100% - 28px)}post-mainnavigation post-list-item>button::after,post-mainnavigation post-list-item post-megadropdown-trigger button::after{transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button[aria-expanded=true]::after,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]::after{transform:rotate(180deg)}}@media screen and (min-width: 1024px){post-mainnavigation post-megadropdown button:not(:is(post-closebutton *)),post-mainnavigation post-megadropdown a{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-megadropdown button:not(:is(post-closebutton *))::before,post-mainnavigation post-megadropdown a::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-megadropdown button:not(:is(post-closebutton *)).active,post-mainnavigation post-megadropdown button:not(:is(post-closebutton *))[aria-current=page],post-mainnavigation post-megadropdown button:not(:is(post-closebutton *))[aria-expanded=true],post-mainnavigation post-megadropdown a.active,post-mainnavigation post-megadropdown a[aria-current=page],post-mainnavigation post-megadropdown a[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-megadropdown button:not(:is(post-closebutton *)):hover,post-mainnavigation post-megadropdown a:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-megadropdown button:not(:is(post-closebutton *)):hover::before,post-mainnavigation post-megadropdown a:hover::before{background-color:#504f4b}}@media screen and (max-width: 1023.98px){post-mainnavigation nav{transform:none !important}post-mainnavigation .scroll-control{display:none}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-list-item>a::before,post-mainnavigation post-list-item>button::before,post-mainnavigation post-list-item post-megadropdown-trigger button::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-list-item>a.active,post-mainnavigation post-list-item>a[aria-current=page],post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.active,post-mainnavigation post-list-item>button[aria-current=page],post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-current=page],post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-list-item>a:hover::before,post-mainnavigation post-list-item>button:hover::before,post-mainnavigation post-list-item post-megadropdown-trigger button:hover::before{background-color:#504f4b}post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{display:none}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{transform:rotate(-90deg)}}";
 
 const SCROLL_REPEAT_INTERVAL = 100; // Interval for repeated scrolling when holding down scroll button
 const NAVBAR_DISABLE_DURATION = 400; // Duration to temporarily disable navbar interactions during scrolling
@@ -882,12 +904,12 @@ const PostMainnavigation = class {
         }, NAVBAR_DISABLE_DURATION);
     }
     render() {
-        return (index.h(index.Host, { key: '1876abaa01a705b5bed07b6f4ab7f795ca994759', slot: "post-mainnavigation", version: _package.version }, index.h("div", { key: 'c61592c959287dcf329921e11dd0d1414329b15a', "aria-hidden": "true", class: { 'scroll-control scroll-left': true, 'd-none': !this.canScrollLeft }, onMouseDown: e => this.handleScrollButtonClick(e, 'left') }, index.h("post-icon", { key: '51b460d2bfdb0ce52e2639f7521de67477972fba', "aria-hidden": "true", name: "chevronleft" })), index.h("nav", { key: '54d8f2a52c935713251d752b30ff163bf7bd8b5f', ref: el => (this.navbar = el) }, index.h("slot", { key: '749a000aa37381cbcf7a68514f77a4ff3da7e90b' })), index.h("div", { key: 'a42aa9a06704dfd4ebb2357b3dc1efa21f7ac136', "aria-hidden": "true", class: { 'scroll-control scroll-right': true, 'd-none': !this.canScrollRight }, onMouseDown: e => this.handleScrollButtonClick(e, 'right') }, index.h("post-icon", { key: '64ef94d58da05da4ea86c9458b7775c431d0461b', "aria-hidden": "true", name: "chevronright" }))));
+        return (index.h(index.Host, { key: '04ae6ffdd6560113431b70c3c27f16057fc9a87d', slot: "post-mainnavigation", version: _package.version }, index.h("div", { key: '2f79728dcbbfe94a343b880e2ba07331f45c9f30', "aria-hidden": "true", class: { 'scroll-control scroll-left': true, 'd-none': !this.canScrollLeft }, onMouseDown: e => this.handleScrollButtonClick(e, 'left') }, index.h("post-icon", { key: '3e762484bbcd03ac0d67b4ab722ffcd862bb073e', "aria-hidden": "true", name: "chevronleft" })), index.h("nav", { key: '1150bfdf724e4d93b45f1fff071fba56d31d15b5', ref: el => (this.navbar = el) }, index.h("slot", { key: '3496b7c6d2d75300b1727148ff9b9965717d9909' })), index.h("div", { key: '1fa6dd50d9650ab6e5047c607f7e5ed0416ed245', "aria-hidden": "true", class: { 'scroll-control scroll-right': true, 'd-none': !this.canScrollRight }, onMouseDown: e => this.handleScrollButtonClick(e, 'right') }, index.h("post-icon", { key: '9487d621e1d7289a0afeb1d0443ec8bc70cd5f3e', "aria-hidden": "true", name: "chevronright" }))));
     }
 };
 PostMainnavigation.style = postMainnavigationCss;
 
-const postMegadropdownCss = "@keyframes slide-in{0%{transform:translateX(100%)}100%{transform:translateX(0%)}}@keyframes slide-out{from{transform:translateX(0%)}to{transform:translateX(100%)}}@keyframes slide-down{from{transform:translateY(-100%)}to{transform:translateY(0%)}}@keyframes slide-up{0%{transform:translateY(0%)}100%{transform:translateY(-100%)}}*,::before,::after{box-sizing:border-box}.megadropdown-container{box-shadow:0 8px 6px rgba(0,0,0,.16);position:absolute;background-color:#fafafa;border:none;z-index:1;width:100%;inset-block-start:100%;inset-inline-start:0;border-radius:0}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.megadropdown-container{border-block-end:1px solid CanvasText}}.megadropdown-container.slide-in{animation:slide-down 350ms forwards}.megadropdown-container.slide-out{animation:slide-up 350ms forwards}@media screen and (max-width: 1023.98px){.megadropdown-container{z-index:5;position:fixed;inset-block-start:var(--post-header-navigation-current-inset);inset-inline:0;height:calc(min(var(--post-header-scroll-parent-height, 100dvh),100dvh) - var(--post-header-height));border-block-start:unset;overflow-y:auto;overscroll-behavior:contain}.megadropdown-container.slide-in{animation:slide-in 350ms forwards}.megadropdown-container.slide-out{animation:slide-out 350ms forwards}}@media screen and (min-width: 1024px){.megadropdown-container{max-height:calc(100vh - var(--post-header-height) - 48px);overflow-y:auto}}.megadropdown{padding:31px 40px 40px;background-color:#fafafa}@media screen and (max-width: 1023.98px){.megadropdown{display:flex;flex-direction:column;width:inherit;padding:16px 32px 24px}}@media screen and (max-width: 599.98px){.megadropdown{padding-inline:16px}}.megadropdown .megadropdown-content{gap:1.5rem;display:grid;grid-template-columns:repeat(auto-fit, minmax(min(15vw, 100%), 1fr));grid-auto-rows:1fr auto;grid-auto-flow:dense}@media screen and (max-width: 1023.98px){.megadropdown .megadropdown-content{grid-template-columns:repeat(auto-fit, minmax(min(35vw, 100%), 1fr))}}@media screen and (max-width: 599.98px){.megadropdown .megadropdown-content{grid-template-columns:1fr}}.megadropdown h2{display:none;margin-block:0 8px;font-weight:900}.megadropdown h2 a{text-decoration:none;display:none;font-weight:inherit;border-block:0}@media screen and (max-width: 1023.98px){.megadropdown h2{display:block;font-size:1.25rem}}@media screen and (max-width: 599.98px){.megadropdown h2{font-size:1.125rem}}.megadropdown post-list{display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:0px}.megadropdown post-list>[role=list]{flex-direction:unset;display:unset}.megadropdown post-list>*{width:100%}.megadropdown post-list .list-title{display:flex;flex-direction:column-reverse;height:100%}.megadropdown post-list .list-title h3{font-size:20px;display:block;font-weight:900}.megadropdown post-list .list-title h3:not(:has(a)),.megadropdown post-list .list-title h3 a{padding:16px 12px 14px 8px}.megadropdown post-list .list-title h3:not(:has(a)){position:relative}.megadropdown post-list .list-title h3:not(:has(a))::before{content:\"\";background-color:#050400;inset-block-end:0;inset-inline-start:0;width:100%;height:2px;position:absolute}.megadropdown post-list .list-title h3 a{border-radius:0;text-decoration:none;font-size:inherit;display:flex;align-items:center;justify-content:space-between;min-height:53px;width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative;height:unset;font-weight:900}.megadropdown post-list .list-title h3 a::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}.megadropdown post-list .list-title h3 a.selected,.megadropdown post-list .list-title h3 a[aria-current=page],.megadropdown post-list .list-title h3 a[aria-expanded=true]{background-color:#050400;color:#fff}.megadropdown post-list .list-title h3 a:hover{background-color:#504f4b;color:#fff}.megadropdown post-list .list-title h3 a:hover::before{background-color:#504f4b}.megadropdown post-list .list-title h3 a::before{height:2px}@media screen and (max-width: 1023.98px){.megadropdown post-list .list-title h3{font-size:1rem}.megadropdown post-list .list-title h3:not(:has(a)),.megadropdown post-list .list-title h3 a{padding:14px 12px 12px 8px}}@media screen and (max-width: 599.98px){.megadropdown post-list .list-title h3{font-size:.875rem}}.megadropdown post-list-item>a{padding-block:13px 12px;padding-inline-start:8px;display:flex;text-decoration:none;width:100%;min-width:100%;height:auto;min-height:48px;white-space:normal;word-break:break-word}.megadropdown post-list-item>a:hover{border-block-width:0}@media screen and (min-width: 1024px){.megadropdown post-list-item>a{font-size:1.25rem}}@media screen and (max-width: 1023.98px){.megadropdown post-list-item>a{padding-block:12px 11px}}@media screen and (max-width: 599.98px){.megadropdown post-list-item>a{font-size:.875rem}}.megadropdown .back-button{display:none;margin-block-end:2rem}.megadropdown .back-button .btn{width:auto}@media screen and (max-width: 1023.98px){.megadropdown .back-button{order:-1;display:block}}.megadropdown .close-button{position:absolute;inset-block-start:1rem;inset-inline-end:1rem}@media screen and (max-width: 1023.98px){.megadropdown .close-button{display:none}}";
+const postMegadropdownCss = "@keyframes slide-in{0%{transform:translateX(100%)}100%{transform:translateX(0%)}}@keyframes slide-out{from{transform:translateX(0%)}to{transform:translateX(100%)}}@keyframes slide-down{from{transform:translateY(-100%)}to{transform:translateY(0%)}}@keyframes slide-up{0%{transform:translateY(0%)}100%{transform:translateY(-100%)}}*,::before,::after{box-sizing:border-box}.megadropdown-container{box-shadow:0 8px 6px rgba(0,0,0,.16);position:absolute;background-color:#fafafa;border:none;z-index:1;width:100%;inset-block-start:100%;inset-inline-start:0;border-radius:0}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.megadropdown-container{border-block-end:1px solid CanvasText}}.megadropdown-container.slide-in{animation:slide-down 350ms forwards}.megadropdown-container.slide-out{animation:slide-up 350ms forwards}@media screen and (max-width: 1023.98px){.megadropdown-container{z-index:5;position:fixed;inset-block-start:var(--post-header-navigation-current-inset);inset-inline:0;height:calc(min(var(--post-header-scroll-parent-height, 100dvh),100dvh) - var(--post-header-height));border-block-start:unset;overflow-y:auto;overscroll-behavior:contain}.megadropdown-container.slide-in{animation:slide-in 350ms forwards}.megadropdown-container.slide-out{animation:slide-out 350ms forwards}}@media screen and (min-width: 1024px){.megadropdown-container{max-height:calc(100vh - var(--post-header-height) - 48px);overflow-y:auto}}.megadropdown{padding:31px 40px 40px;background-color:#fafafa}@media screen and (max-width: 1023.98px){.megadropdown{display:flex;flex-direction:column;width:inherit;padding:16px 32px 24px}}@media screen and (max-width: 599.98px){.megadropdown{padding-inline:16px}}.megadropdown .megadropdown-content{gap:1.5rem;display:grid;grid-template-columns:repeat(auto-fit, minmax(min(15vw, 100%), 1fr));grid-auto-rows:1fr auto;grid-auto-flow:dense}@media screen and (max-width: 1023.98px){.megadropdown .megadropdown-content{grid-template-columns:repeat(auto-fit, minmax(min(35vw, 100%), 1fr))}}@media screen and (max-width: 599.98px){.megadropdown .megadropdown-content{grid-template-columns:1fr}}.megadropdown h2{display:none;margin-block:0 8px;font-weight:900}.megadropdown h2 a{text-decoration:none;display:none;font-weight:inherit;border-block:0}@media screen and (max-width: 1023.98px){.megadropdown h2{display:block;font-size:1.25rem}}@media screen and (max-width: 599.98px){.megadropdown h2{font-size:1.125rem}}.megadropdown post-list{display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:0px}.megadropdown post-list>[role=list]{flex-direction:unset;display:unset}.megadropdown post-list>*{width:100%}.megadropdown post-list .list-title{display:flex;flex-direction:column-reverse;height:100%}.megadropdown post-list .list-title h3{font-size:20px;display:block;font-weight:900}.megadropdown post-list .list-title h3:not(:has(a)),.megadropdown post-list .list-title h3 a{padding:16px 12px 14px 8px}.megadropdown post-list .list-title h3:not(:has(a)){position:relative}.megadropdown post-list .list-title h3:not(:has(a))::before{content:\"\";background-color:#050400;inset-block-end:0;inset-inline-start:0;width:100%;height:2px;position:absolute}.megadropdown post-list .list-title h3 a{border-radius:0;text-decoration:none;font-size:inherit;display:flex;align-items:center;justify-content:space-between;min-height:53px;width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative;height:unset;font-weight:900}.megadropdown post-list .list-title h3 a::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}.megadropdown post-list .list-title h3 a.active,.megadropdown post-list .list-title h3 a[aria-current=page],.megadropdown post-list .list-title h3 a[aria-expanded=true]{background-color:#050400;color:#fff}.megadropdown post-list .list-title h3 a:hover{background-color:#504f4b;color:#fff}.megadropdown post-list .list-title h3 a:hover::before{background-color:#504f4b}.megadropdown post-list .list-title h3 a::before{height:2px}@media screen and (max-width: 1023.98px){.megadropdown post-list .list-title h3{font-size:1rem}.megadropdown post-list .list-title h3:not(:has(a)),.megadropdown post-list .list-title h3 a{padding:14px 12px 12px 8px}}@media screen and (max-width: 599.98px){.megadropdown post-list .list-title h3{font-size:.875rem}}.megadropdown post-list-item>a{padding-block:13px 12px;padding-inline-start:8px;display:flex;text-decoration:none;width:100%;min-width:100%;height:auto;min-height:48px;white-space:normal;word-break:break-word}.megadropdown post-list-item>a:hover{border-block-width:0}@media screen and (min-width: 1024px){.megadropdown post-list-item>a{font-size:1.25rem}}@media screen and (max-width: 1023.98px){.megadropdown post-list-item>a{padding-block:12px 11px}}@media screen and (max-width: 599.98px){.megadropdown post-list-item>a{font-size:.875rem}}.megadropdown .back-button{display:none;margin-block-end:2rem}.megadropdown .back-button .btn{width:auto}@media screen and (max-width: 1023.98px){.megadropdown .back-button{order:-1;display:block}}.megadropdown .close-button{position:absolute;inset-block-start:1rem;inset-inline-end:1rem}@media screen and (max-width: 1023.98px){.megadropdown .close-button{display:none}}";
 
 const PostMegadropdown = class {
     constructor(hostRef) {
@@ -922,11 +944,20 @@ const PostMegadropdown = class {
             this.hide(false);
         };
     }
-    breakpointChange(e) {
-        this.device = e.detail;
-        if (this.device === 'desktop' && this.isVisible) {
-            this.animationClass = null;
-        }
+    get megadropdownTrigger() {
+        const hostId = this.host.getAttribute('id');
+        return hostId ? document.querySelector(`post-megadropdown-trigger[for="${hostId}"] > button`) : null;
+    }
+    connectedCallback() {
+        window.addEventListener('postBreakpoint:device', this.breakpointChange.bind(this));
+    }
+    componentDidRender() {
+        this.getFocusableElements();
+    }
+    componentDidLoad() {
+        this.checkInitialAriaCurrent();
+        this.setupObserver();
+        this.handleAriaCurrentChange([]);
     }
     disconnectedCallback() {
         this.removeListeners();
@@ -934,9 +965,7 @@ const PostMegadropdown = class {
         if (PostMegadropdown.activeDropdown === this) {
             PostMegadropdown.activeDropdown = null;
         }
-    }
-    componentDidRender() {
-        this.getFocusableElements();
+        this.defaultSlotObserver.disconnect();
     }
     /**
      * Toggles the dropdown visibility based on its current state.
@@ -985,8 +1014,11 @@ const PostMegadropdown = class {
     async focusFirst() {
         this.firstFocusableEl?.focus();
     }
-    connectedCallback() {
-        window.addEventListener('postBreakpoint:device', this.breakpointChange.bind(this));
+    breakpointChange(e) {
+        this.device = e.detail;
+        if (this.device === 'desktop' && this.isVisible) {
+            this.animationClass = null;
+        }
     }
     /**
      * Forces the dropdown to close without animation.
@@ -1018,14 +1050,6 @@ const PostMegadropdown = class {
     getFocusableElements() {
         const focusableEls = Array.from(this.host.querySelectorAll('post-list-item, h3, .back-button'));
         const focusableChildren = focusableEls.flatMap(el => Array.from(getFocusableChildren(el)));
-        const hostId = this.host.getAttribute('id');
-        // Proceed if the host has an ID and one of its focusable children is marked as the current page (`aria-current="page"`)
-        if (hostId && focusableChildren.some(el => el.getAttribute('aria-current') === 'page')) {
-            // Find the trigger element via its "for" attribute, then locate its button and set `aria-current="page"`
-            document
-                .querySelector(`post-megadropdown-trigger[for="${hostId}"] > button`)
-                .classList.add('selected');
-        }
         this.firstFocusableEl = focusableChildren[0];
         this.lastFocusableEl = focusableChildren[focusableChildren.length - 1];
     }
@@ -1051,9 +1075,59 @@ const PostMegadropdown = class {
             }
         }
     }
+    /**
+     * Sets up a MutationObserver on the host to watch for changes
+     * in `aria-current` attributes.
+     */
+    setupObserver() {
+        const config = {
+            subtree: true,
+            attributes: true,
+            attributeFilter: ['aria-current'],
+        };
+        this.defaultSlotObserver = new MutationObserver(this.handleAriaCurrentChange.bind(this));
+        this.defaultSlotObserver.observe(this.host, config);
+    }
+    /**
+     * Adds or removes the 'active' class on the megadropdown trigger button
+     * based on the active state.
+     *
+     * @param isActive - Whether the trigger should appear active
+     */
+    setTriggerActive(isActive) {
+        const trigger = this.megadropdownTrigger;
+        if (!trigger)
+            return;
+        if (isActive) {
+            trigger.classList.add('active');
+        }
+        else {
+            trigger.classList.remove('active');
+        }
+    }
+    /**
+     * Updates the megadropdown trigger state when the megadropdown content changes.
+     * Checks if any element inside the megadropdown has `aria-current="page"`
+     * and sets the trigger as active accordingly.
+     */
+    handleAriaCurrentChange(mutations) {
+        if (!mutations.length)
+            return;
+        const hasCurrentPage = mutations.some(m => m.target instanceof HTMLElement && m.target.getAttribute('aria-current') === 'page');
+        this.setTriggerActive(hasCurrentPage);
+    }
+    /**
+     * Checks on initialization if any element inside the megadropdown
+     * has `aria-current="page"` and sets the trigger as active if so.
+     */
+    checkInitialAriaCurrent() {
+        const hasCurrentPage = this.host.querySelector('[aria-current="page"]');
+        if (hasCurrentPage)
+            this.setTriggerActive(true);
+    }
     render() {
         const containerStyle = this.isVisible ? {} : { display: 'none' };
-        return (index.h(index.Host, { key: '18685d3da311fd0563a3c5a498df1e1fef96b524', version: _package.version }, index.h("div", { key: 'fb3feb160e46b80ed60c202871152ac3f7862f83', class: `megadropdown-container ${this.animationClass || ''}`, style: containerStyle, onAnimationEnd: () => this.handleAnimationEnd() }, index.h("div", { key: '34e0d3e68bd9bfbeec8ebe37b8977076c91cfe02', class: "megadropdown" }, index.h("slot", { key: '67d17ec51f7436f2a8acc1216b37820ff999f985', name: "megadropdown-title" }), index.h("div", { key: '6671d31fcc17d435991a253f04a83bbe56551942', class: "megadropdown-content" }, index.h("slot", { key: 'd0d313a98202f2d502e4574bed8802682d4da6f3' })), index.h("div", { key: 'd42560e7a4f3142cb548a1ffb97ad391fd14871f', onClick: () => this.hide(true), class: "back-button" }, index.h("slot", { key: '76f0a36d5ca87834b9d857a8f13d53ecb82f9a24', name: "back-button" })), index.h("div", { key: 'a9ea0c1f24f5c997a1a4c9432f0c7d537b8d6da0', onClick: () => this.hide(true), class: "close-button" }, index.h("slot", { key: '1c815102d7f4d1e21aaaaffcf277d98454eda17d', name: "close-button" }))))));
+        return (index.h(index.Host, { key: '40023f8684db4cfff78f69d2d5786e4c3a0332b4', version: _package.version }, index.h("div", { key: '986f114148d355b7a6e92c19d1c02c925eb27fce', class: `megadropdown-container ${this.animationClass || ''}`, style: containerStyle, onAnimationEnd: () => this.handleAnimationEnd() }, index.h("div", { key: 'c14d01be681f596148d39f272375615eafdf25c0', class: "megadropdown" }, index.h("slot", { key: '5f60ff26e694c107c569e06d30e18a5940d3e7b1', name: "megadropdown-title" }), index.h("div", { key: '49202a8a0dcebc086220db637cf25d96510b6eac', class: "megadropdown-content" }, index.h("slot", { key: '98593b2824d21f065b4c183c8980d94136b175bf' })), index.h("div", { key: 'ed1dfbbebd101a98153657007f8037c0282b47ef', onClick: () => this.hide(true), class: "back-button" }, index.h("slot", { key: '4e737d72e77271cb025976ae5e5fe4d5f653480a', name: "back-button" })), index.h("div", { key: '0bf1316c091efbf294be89efeebae7937c013b29', onClick: () => this.hide(true), class: "close-button" }, index.h("slot", { key: '594a412944fff3fee09639b85cc13a9291b96a10', name: "close-button" }))))));
     }
     get host() { return index.getElement(this); }
 };
@@ -1156,7 +1230,7 @@ const PostMegadropdownTrigger = class {
         document.removeEventListener('postToggleMegadropdown', this.handleToggleMegadropdown);
     }
     render() {
-        return (index.h(index.Host, { key: 'b5194e2160ffc439f3219807ec86196c01f60d31', "data-version": _package.version, "tab-index": "-1" }, index.h("button", { key: '3bf811bc35c85fc570a0b6ba3af9b5f7765676cb' }, index.h("slot", { key: '15b6f17c8b812b43b4aec56b5396b4e194ccd711' }))));
+        return (index.h(index.Host, { key: 'a817027c84bb4a3418807ccbb200d36190e03d6f', "data-version": _package.version, "tab-index": "-1" }, index.h("button", { key: '1e560734f4a5f742a9efa2bff6833c1ae3e11117' }, index.h("slot", { key: '42bf1a30f432b1fcf8e0fec1cd1d499126623234' }))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {
@@ -1168,7 +1242,7 @@ __decorate$1([
 ], PostMegadropdownTrigger.prototype, "handleToggleMegadropdown", void 0);
 PostMegadropdownTrigger.style = postMegadropdownTriggerCss;
 
-const postMenuCss = ":host{display:block}:where([part=menu]){display:flex;flex-direction:column;padding-block:.5rem}";
+const postMenuCss = ":host{display:block}:where([part=menu]){display:flex;flex-direction:column;padding-block:.5rem}::slotted([slot=header]){margin-top:-0.5rem;padding:1rem;display:flex;align-items:center;gap:.5rem;border-block-end:1px solid #050400;font-weight:700}@media screen and (max-width: 1023.98px){::slotted([slot=header]){padding:.75rem 1rem}}@media screen and (max-width: 779.98px){::slotted([slot=header]){padding:.5rem 1rem}}";
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -1257,6 +1331,9 @@ const PostMenu = class {
     validatePlacement() {
         index$1.checkEmptyOrOneOf(this, 'placement', placement.PLACEMENT_TYPES);
     }
+    validateLabel() {
+        index$1.checkRequiredAndType(this, 'label', 'string');
+    }
     connectedCallback() {
         this.root = getRoot.getRoot(this.host);
         this.host.addEventListener('keydown', this.handleKeyDown);
@@ -1269,6 +1346,7 @@ const PostMenu = class {
     }
     componentDidLoad() {
         this.validatePlacement();
+        this.validateLabel();
         if (this.popoverRef) {
             this.popoverRef.addEventListener('postToggle', this.handlePostToggle);
         }
@@ -1345,8 +1423,9 @@ const PostMenu = class {
         }
     }
     getSlottedItems() {
-        const slot = this.host.shadowRoot.querySelector('slot');
-        const slottedElements = slot ? slot.assignedElements() : [];
+        const slot = this.host.shadowRoot.querySelectorAll('slot');
+        const slottedElements = [];
+        slot.forEach(slotItem => slottedElements.push(...slotItem.assignedElements()));
         return (slottedElements
             // If the element is a slot, get the assigned elements
             .flatMap(el => (el instanceof HTMLSlotElement ? el.assignedElements() : el))
@@ -1354,11 +1433,12 @@ const PostMenu = class {
             .flatMap(el => Array.from(getFocusableChildren(el))));
     }
     render() {
-        return (index.h(index.Host, { key: '7b7fe6fccd27d3ff12eae3094b1a55b9b9778eb1', "data-version": _package.version }, index.h("post-popovercontainer", { key: '6dae2883febd1e96ae1b34518dd2e9c634fafecb', placement: this.placement, ref: e => (this.popoverRef = e) }, index.h("div", { key: 'e19c107831b020aa0039ea7a18465e4bb72380c4', part: "menu" }, index.h("slot", { key: '9d9862e73dd222435d196e67c540bf8266952d94' })))));
+        return (index.h(index.Host, { key: 'd98d7b0a1c607732ab12c94f8d872408a053c19b', "data-version": _package.version }, index.h("post-popovercontainer", { key: '669e6062e5ff0dfac0d311cc8fdd0bb51735aac1', placement: this.placement, ref: e => (this.popoverRef = e) }, index.h("div", { key: '6bc1abb7b764e9e6985a839904ed5575ea20a519', part: "menu" }, index.h("slot", { key: '6b8670f2e80ed93761797b9161ddf54bb88f73ec', name: "header" }), index.h("slot", { key: '971f39ae63f22a503e36aeecb67575304ce14248' })))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {
-        "placement": ["validatePlacement"]
+        "placement": ["validatePlacement"],
+        "label": ["validateLabel"]
     }; }
 };
 __decorate([
@@ -1441,7 +1521,7 @@ const PostMenuTrigger = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '14592f9564fdb09b2e809374d5794bf71f576dbb', "data-version": _package.version, "tab-index": "-1" }, index.h("slot", { key: 'a0f463000420df39035cc5a48369d230394b5e04' })));
+        return (index.h(index.Host, { key: 'e4ab1c0cd7227b83994cbd74f2bb3fe88c48126e', "data-version": _package.version, "tab-index": "-1" }, index.h("slot", { key: '9c5aa5d42457f6716c7607b50b5453cdce8d50d0' })));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {
@@ -4411,9 +4491,9 @@ const PostPopovercontainer = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '1594b782ac56ae23eba2df3f452ad40015ace67d', "data-version": _package.version, popover: this.manualClose ? 'manual' : 'auto' }, index.h("div", { key: '565cbf870aca9abbc665525a627922d1cfdb9195', class: "popover-content" }, this.arrow && (index.h("span", { key: 'add7d6f7b176e7365b5a0c25fa81dd2a9520e7f3', class: "arrow", ref: el => {
+        return (index.h(index.Host, { key: '493d032d16ace815b6c031e77dbcc673f26d149b', "data-version": _package.version, popover: this.manualClose ? 'manual' : 'auto' }, index.h("div", { key: '97bb357cada0456b3aa458e12768d9ad5458ef24', class: "popover-content" }, this.arrow && (index.h("span", { key: 'f5f2256470edad5a8ca89c32b3a44ef0fe388eea', class: "arrow", ref: el => {
                 this.arrowRef = el;
-            } })), index.h("slot", { key: '308138890a4148c5c94b675e2a6b911fef1c31b5' }))));
+            } })), index.h("slot", { key: 'f259b6ad624cf392e0d41026b4eab586009cb3c7' }))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {
@@ -4470,7 +4550,7 @@ const PostTogglebutton = class {
         this.host.addEventListener('keydown', (e) => this.handleKeydown(e));
     }
     render() {
-        return (index.h(index.Host, { key: 'f6b56dc64dbff8ef94e4104eebe845a04f113c75', "data-version": _package.version, role: "button", tabindex: "0", "aria-pressed": this.toggled.toString() }, index.h("slot", { key: '2846bb617c7a68ba6390fe27b043265569a9fd55' })));
+        return (index.h(index.Host, { key: '190c53c4bbada662698addcb288bcb50a8d179b3', "data-version": _package.version, role: "button", tabindex: "0", "aria-pressed": this.toggled.toString() }, index.h("slot", { key: '544bf7d937386a6e65be75e249f3dcc080054d74' })));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/post-collapsible_2.cjs.entry.js

@@ -1,11 +1,11 @@
 'use strict';
 
 var index = require('./index-CpDyH7Ww.js');
-var _package = require('./package-CR0YynRY.js');
-var breakpoints = require('./breakpoints-DmZ_BQGo.js');
+var _package = require('./package-D1eOXW8H.js');
+var breakpoints = require('./breakpoints-CEkeixld.js');
 var index$1 = require('./index-DtvYdwe1.js');
-var eventFrom = require('./event-from-C6kpQwhw.js');
-var getRoot = require('./get-root-CfQ2PogP.js');
+var eventFrom = require('./event-from-CLvtSUKf.js');
+var getRoot = require('./get-root-CyMf3Vsd.js');
 
 function isMotionReduced() {
     return breakpoints.IS_BROWSER ? window.matchMedia('(prefers-reduced-motion: reduce)').matches : false;