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

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

@@ -1,8 +1,8 @@
-import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-C8a0ddDa.js';
-import { v as version } from './package-Z01QMrov.js';
+import { r as registerInstance, h, H as Host, a as getElement, c as createEvent } from './index-C8a0ddDa.js';
+import { v as version } from './package-DO48NanC.js';
 import { t as throttle, b as breakpoint, I as IS_BROWSER } from './breakpoints-_0G7tavk.js';
-import { E as EventFrom } from './event-from-8U5GFtQP.js';
-import { e as checkEmptyOrOneOf, a as checkEmptyOrType, c as checkRequiredAndType, g as checkEmptyOrUrl } from './index-BWC0gtGU.js';
+import { E as EventFrom } from './event-from-kraHE1r3.js';
+import { d as checkEmptyOrOneOf, a as checkEmptyOrType, c as checkRequiredAndType, g as checkEmptyOrUrl } from './index-VmK3ABCB.js';
 import { n as nanoid } from './index.browser-BLchVpF6.js';
 import { P as PLACEMENT_TYPES } from './placement-DRiVosES.js';
 import { g as getRoot } from './get-root-hlzxoycr.js';
@@ -12,7 +12,6 @@ const postClosebuttonCss = ".btn-icon-close{padding:0;border:unset;min-height:un
 const PostClosebutton = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.postClick = createEvent(this, "postClick");
     }
     componentDidLoad() {
         this.checkHiddenLabel();
@@ -23,22 +22,22 @@ const PostClosebutton = class {
         }
     }
     render() {
-        return (h(Host, { key: '639599ff890ccf96684035e80449a99dcad7de85', "data-version": version }, h("button", { key: '0cc95e3c46a6d91ec3d31fff498b4c0b784de272', class: "btn btn-icon-close", type: "button", onClick: () => this.postClick.emit() }, h("post-icon", { key: 'e30566a7734bb6a64a03f8983da015e7e7ec8c90', "aria-hidden": "true", name: "closex" }), h("span", { key: '549ef38de408b6af78605f5e2f6f5c9aa291c04b', class: "visually-hidden" }, h("slot", { key: '0325e4b54cfa8cfea9ddf243c1c25730d9a4b88f', onSlotchange: () => this.checkHiddenLabel() })))));
+        return (h(Host, { key: 'ee54a84df2fbb214706f5f2eb527769b03846819', "data-version": version }, h("button", { key: '39ce661db0611bbe4387a32a9d7c91b1f5bc8b17', class: "btn btn-icon-close", type: "button" }, h("post-icon", { key: '26aced13eacfa369e82178e5551372700499e556', "aria-hidden": "true", name: "closex" }), h("span", { key: '01bcad725724a3ae95e79e25d58958eb4ee2ffa3', class: "visually-hidden" }, h("slot", { key: 'bd794bf53acbf2fbcf1855ce882bcd442d2a846f', onSlotchange: () => this.checkHiddenLabel() })))));
     }
     get host() { return getElement(this); }
 };
 PostClosebutton.style = postClosebuttonCss;
 
-const easing = 'ease';
-const duration = 500;
+const easing$1 = 'ease';
+const duration$1 = 500;
 const fill = 'forwards';
 function slideUp(el, translateSize = '-100%') {
     return el.animate([
         { transform: 'translateY(0)' }, // Starting position (no translation)
         { transform: `translateY(${translateSize})` }, // End position
     ], {
-        duration: duration,
-        easing,
+        duration: duration$1,
+        easing: easing$1,
         fill,
     });
 }
@@ -47,8 +46,8 @@ function slideDown(el, translateSize = '-100%') {
         { transform: `translateY(${translateSize})` }, // Starting position (no translation)
         { transform: 'translateY(0)' }, // End position
     ], {
-        duration: duration,
-        easing,
+        duration: duration$1,
+        easing: easing$1,
         fill,
     });
 }
@@ -87,7 +86,7 @@ function getFocusableChildren(element) {
     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}}:host(:not(:has([slot=title]))) .local-header{padding-block-start:0}:host(:not(:has([slot=title]))) .local-sub{display:none}.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-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;padding-block-start:18px;box-shadow:var(--post-device-elevation-300);transition:box-shadow .2s ease-in-out,inset-block-start .2s ease-in-out}}@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-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: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}}";
 
 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;
@@ -134,6 +133,7 @@ const PostHeader = class {
         this.throttledResize = throttle(50, () => this.updateLocalHeaderHeight());
         this.device = breakpoint.get('device');
         this.hasNavigation = false;
+        this.hasTitle = false;
         this.mobileMenuExtended = false;
         this.megadropdownOpen = false;
         this.breakpointChange = (e) => {
@@ -170,6 +170,7 @@ const PostHeader = class {
         this.host.addEventListener('click', this.handleLinkClick);
         window.addEventListener('postBreakpoint:device', this.breakpointChange);
         this.checkNavigationExistence();
+        this.checkTitleExistence();
         this.switchLanguageSwitchMode();
         this.handleScrollParentResize();
         this.lockBody(false, this.mobileMenuExtended, 'mobileMenuExtended');
@@ -207,6 +208,9 @@ const PostHeader = class {
     checkNavigationExistence() {
         this.hasNavigation = this.host.querySelectorAll('post-mainnavigation').length > 0;
     }
+    checkTitleExistence() {
+        this.hasTitle = this.host.querySelectorAll('[slot="title"]').length > 0;
+    }
     async closeMobileMenu() {
         this.mobileMenuAnimation.finish();
         const menuButton = this.getMenuButton();
@@ -346,9 +350,12 @@ const PostHeader = class {
         const localHeaderClasses = ['local-header'];
         if (this.mobileMenuExtended)
             localHeaderClasses.push('local-header-mobile-extended');
-        if (!this.hasNavigation)
+        if (this.device !== 'desktop' || !this.hasNavigation)
             localHeaderClasses.push('no-navigation');
-        return (h(Host, { key: 'ec2be7f6699d0b6be65c7ec05ccfaf11fe38551f', "data-version": version, "data-color-scheme": "light" }, h("div", { key: 'defa2d956e848f0270e1c36404bb0e32e6112ab2', class: "global-header" }, h("div", { key: 'b1db492439d45566140d8698310d68707d44f178', class: "global-sub" }, h("div", { key: 'a238bbbe5999e4ff858b9f7223eb3a82ae517dc3', class: "logo" }, h("slot", { key: '7b6a922842eaf01fdddad88079c5c4e27d9caf9d', name: "post-logo" }))), h("div", { key: '70b7e4f0a0e7dcd8458238f85d5cadfad5c8030d', class: "global-sub" }, this.device === 'desktop' && h("slot", { key: '9abe132d957d37848205cd5b045ed9d8e9040da4', name: "target-group" })), h("div", { key: '6666cb7b19cd3654020291cff4b3f7821f190416', class: "global-sub" }, !this.hasMobileMenu && (h("slot", { key: '446f14ba4b014b35b60dbf643ab1baace4cd1cd7', name: "meta-navigation" })), h("slot", { key: '6cdb4006e56ccdeb076cbe486a437ca56e4b259a', name: "global-controls" }), !this.hasMobileMenu && h("slot", { key: '6be456ce09dee5653c36e2320fa89345139232a4', name: "post-language-switch" }), this.hasNavigation && (h("div", { key: '28f87889a93aae2e78978cbd02e18dca58a486ef', onClick: () => this.toggleMobileMenu(), class: "mobile-toggle" }, h("slot", { key: '157b154a30cdaf4c17434c2a6c7a796ad945780c', name: "post-togglebutton" }))))), h("div", { key: 'ddf249e9b055659325cc9717f03ccd9345556e15', class: localHeaderClasses.join(' ') }, h("slot", { key: '858312b4c4ef74c76588f9cd0b49acfda39f6daf', name: "title" }), h("div", { key: '73db57db8df18d9106cb124cf95b0c2551ceda23', class: "local-sub" }, h("slot", { key: 'e36a9e8572878fe11ae326503b0cbcc4d03ddd3e', name: "local-controls" }), h("slot", { key: '354e22a83276f8fa8c79127c8cdcfbf0f12dbf91' })), this.device === 'desktop' && this.renderNavigation()), this.device !== 'desktop' && this.renderNavigation()));
+        if (!this.hasTitle)
+            localHeaderClasses.push('no-title');
+        return (h(Host, { key: 'd327fc8735749f46cb8b38531a8514978f92c197', "data-version": version, "data-color-scheme": "light" }, h("div", { key: '07b7a4861cc11d55fce5d749a1d074d37900b48f', class: "global-header" }, h("div", { key: 'bb23cf58b62b53e273921bb0a27a2371983bc8a8', class: "global-sub" }, h("div", { key: '0028ff1ba8be25a238d944eaf25f9679b9e163c6', class: "logo" }, h("slot", { key: '98e0584188a391b99df904fbdf463606548859c7', name: "post-logo" }))), h("div", { key: '6da75517e0923191cc4d478a3f0c7e20d89b860d', class: "global-sub" }, this.device === 'desktop' && h("slot", { key: 'bf5730915d734e9accb0e10bcd0d48ee99781930', name: "target-group" })), h("div", { key: '64f3eafd98d8c34248de4fb78619bb7f3147e5e9', class: "global-sub" }, !this.hasMobileMenu && (h("slot", { key: 'c3ad33a44bf25fede0afbea50937626142e69b6e', name: "meta-navigation" })), h("slot", { key: 'e85d50753a40958be785deebfe01ffbee91f120b', name: "global-controls" }), !this.hasMobileMenu && h("slot", { key: 'e423f47daa544cb7bd11ed54f0ecef93a50e6470', name: "post-language-switch" }), this.hasNavigation && (h("div", { key: '96be5d590fbee1986238e1b7b22a1e6928c1c97f', onClick: () => this.toggleMobileMenu(), class: "mobile-toggle" }, h("slot", { key: '4c9db8b0c416cbd2ffa4e1df6b05aea757bdc6a6', name: "post-togglebutton" }))))), h("div", { key: '43285a4032f7ae356145ce6fb62e3c9896ad8542', class: localHeaderClasses.join(' ') }, h("slot", { key: '74c2313baa4da4bf37d13189c07645374df684d1', name: "title", onSlotchange: () => this.checkTitleExistence() }), this.hasTitle &&
+            (h("div", { key: '414b5378922221715071a5d8cfc0b7920018a5b3', class: "local-sub" }, h("slot", { key: 'acb09003e517669a50405a04e5dafa983e78b5f2', name: "local-controls" }), h("slot", { key: '8e1043c4d2e25b6b9432a2ba1885d2128abb9f85' }))), this.device === 'desktop' && this.renderNavigation()), this.device !== 'desktop' && this.renderNavigation()));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
@@ -400,52 +407,58 @@ const PostIcon = class {
     validateScale() {
         checkEmptyOrType(this, 'scale', 'number');
     }
-    // Construct the icon URL according to the following rules:
-    // - URL = current domain + base[href] + meta[data-post-icon-base] (or component base)
-    // - If base[href] is not relative, it's used instead of current domain + base[href]
-    // - If meta[data-post-icon-base] (or component base) is not relative, it's used as is
+    /**
+     * Construct the icon URL according to the following rules:
+     * 1. `@base` (absolute URL) → use directly.
+     * 2. `@base` (relative URL) → resolve with `base href` and/or `origin`
+     *  - If `base href` is absolute → use just that.
+     *  - If `base href` is relative → prepend with `origin`.
+     *  - If `base href` does not exist → use only `origin`.
+     * 3. `@meta` (absolute URL) → use directly.
+     * 4. `@meta` (relative URL) → resolve with `base href` and/or `origin`. (same as above)
+     * 5. `CDN_URL` fallback → `https://unpkg.com/...`.
+     **/
     getUrl() {
         const fileName = `${this.name}.svg`;
         if (!IS_BROWSER && !this.base) {
             return `${CDN_URL}${fileName}`;
         }
+        const isAbsolute = (url) => /^https?:\/\//.test(url);
+        const normalizeUrl = (url) => (url && !url.endsWith('/') ? `${url}/` : url);
+        const cleanUrl = (url) => url.replace(/([^:])\/\//g, '$1/');
         const currentDomain = IS_BROWSER ? window.location.origin : '';
         const baseHref = IS_BROWSER
             ? document.querySelector('base[href]')?.getAttribute('href') || ''
             : '';
-        const isBaseHrefAbsolute = /^https?:\/\//.test(baseHref);
         const metaIconBase = IS_BROWSER
-            ? document
-                .querySelector('meta[name="design-system-settings"]')
-                ?.getAttribute('data-post-icon-base') || ''
+            ? document.querySelector('meta[name="design-system-settings"]')?.getAttribute('data-post-icon-base') || ''
             : '';
-        const iconBase = this.base || metaIconBase;
-        const isIconBaseAbsolute = /^https?:\/\//.test(iconBase);
-        const normalizedBaseHref = normalizeUrl(baseHref);
-        const normalizedIconBase = normalizeUrl(iconBase);
-        function normalizeUrl(url) {
-            if (!url)
-                return '';
-            return url.endsWith('/') ? url : `${url}/`;
-        }
+        // Function to build the first part of the URL when 'this.base' or 'metaIconBase' are relative
+        const buildUrlWithBase = (relativeUrl) => {
+            const normalizedHref = normalizeUrl(baseHref);
+            const normalizedRelative = normalizeUrl(relativeUrl);
+            if (isAbsolute(normalizedHref)) {
+                return `${normalizedHref}${normalizedRelative}`;
+            }
+            return `${currentDomain}${normalizedHref}${normalizedRelative}`;
+        };
         let url;
-        if (isIconBaseAbsolute) {
-            // If icon base is absolute, use it as is
-            url = `${normalizedIconBase}${fileName}`;
-        }
-        else if (isBaseHrefAbsolute) {
-            // If baseHref is absolute, don't use current domain
-            url = `${normalizedBaseHref}${normalizedIconBase}${fileName}`;
-        }
-        else if (iconBase || baseHref) {
-            // Standard case: domain + baseHref + iconBase
-            url = `${currentDomain}${normalizedBaseHref}${normalizedIconBase}${fileName}`;
+        // Highest Priority is this.base
+        if (this.base) {
+            url = isAbsolute(this.base)
+                ? `${normalizeUrl(this.base)}${fileName}`
+                : `${buildUrlWithBase(this.base)}${fileName}`;
+            return cleanUrl(url);
         }
-        else {
-            // Fallback to CDN if no paths are specified
-            url = `${CDN_URL}${fileName}`;
+        // Second Priority is metaIconBase
+        if (metaIconBase) {
+            url = isAbsolute(metaIconBase)
+                ? `${normalizeUrl(metaIconBase)}${fileName}`
+                : `${buildUrlWithBase(metaIconBase)}${fileName}`;
+            return cleanUrl(url);
         }
-        return url.replace(/([^:])\/\//g, '$1/');
+        // Fallback to CDN
+        return cleanUrl(`${CDN_URL}${fileName}`);
     }
     getStyles() {
         const url = this.getUrl();
@@ -466,7 +479,7 @@ const PostIcon = class {
         this.validateAnimation();
     }
     render() {
-        return (h(Host, { key: '3f90e071297fbca3c9ae7f0470c3deaf380f8a50', "data-version": version }, h("span", { key: '4b22a88a80e0b329d65508321a9b63a38894fae8', style: this.getStyles() })));
+        return (h(Host, { key: '521fb549cef7d0838c999628cf69c5c23e87dfc6', "data-version": version }, h("span", { key: 'cc9ca579bd90fee8cec7868c697bfe59dd677246', style: this.getStyles() })));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
@@ -481,7 +494,7 @@ PostIcon.style = postIconCss;
 
 const SWITCH_VARIANTS = ['list', 'menu'];
 
-const postLanguageOptionCss = "@keyframes popIn{from{transform:scale(0.9);opacity:0;transition-property:transform,opacity,overlay,display;transition-behavior:allow-discrete;transition-duration:var(--post-transition-duration, 0.35s);transition-timing-function:linear(0, 0.007, 0.029 2.2%, 0.118 4.7%, 0.625 14.4%, 0.826 19%, 0.902, 0.962, 1.008 26.1%, 1.041 28.7%, 1.064 32.1%, 1.07 36%, 1.061 40.5%, 1.015 53.4%, 0.999 61.6%, 0.995 71.2%, 1)}to{opacity:1;transform:scale(1)}}post-language-option{display:inline-block}post-language-option 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}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-language-option button{background-color:ButtonFace !important}post-language-option button:hover{background-color:Highlight !important}}post-language-option button .visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}post-language-option a{color:var(--post-current-fg);text-decoration:none}post-language-option :is(a,button){cursor:pointer;display:flex;align-items:center;justify-content:center;width:100%;height:100%;text-transform:uppercase}post-language-option :is(a,button){outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}post-language-option :is(a,button):is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;outline-offset:-2px !important;border-radius:4px}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-language-option :is(a,button):is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){post-language-option :is(a,button):is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;outline-offset:-2px !important;border-radius:4px}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-language-option :is(a,button):is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}post-language-option:where([variant=list]) :is(a,button){padding-inline:0;width:40px;height:40px;border-radius:2px}post-language-option:where([variant=list]) :is(a,button):hover{color:#504f4b}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-language-option:where([variant=list]) :is(a,button){border:1px solid ButtonBorder;color:ButtonText}}post-language-option:where([variant=list])[active]:not([active=false]) :is(a,button){background-color:#050400 !important;color:#fff;pointer-events:none}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-language-option:where([variant=list])[active]:not([active=false]) :is(a,button){background-color:Highlight !important;color:HighlightText}}post-language-option:where([variant=menu]){min-width:72px}post-language-option:where([variant=menu])[active]:not([active=false]){display:none}post-language-option:where([variant=menu]) :is(a,button){padding-block:13px;padding-inline:16px;box-sizing:border-box;justify-content:flex-start;position:relative;border-radius:0}post-language-option:where([variant=menu]) :is(a,button):hover{color:#fff;background-color:#504f4b}post-language-option:where([variant=menu]):first-child :is(a,button){border-start-start-radius:4px;border-start-end-radius:4px}post-language-option:where([variant=menu]):last-child :is(a,button){border-end-start-radius:4px;border-end-end-radius:4px}";
+const postLanguageOptionCss = "post-language-option{display:inline-block}post-language-option 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}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-language-option button{background-color:ButtonFace !important}post-language-option button:hover{background-color:Highlight !important}}post-language-option button .visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}post-language-option a{color:var(--post-current-fg);text-decoration:none}post-language-option :is(a,button){cursor:pointer;display:flex;align-items:center;justify-content:center;width:100%;height:100%;text-transform:uppercase}post-language-option :is(a,button){outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}post-language-option :is(a,button):is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;outline-offset:-2px !important;border-radius:4px}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-language-option :is(a,button):is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){post-language-option :is(a,button):is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;outline-offset:-2px !important;border-radius:4px}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-language-option :is(a,button):is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}post-language-option:where([variant=list]) :is(a,button){padding-inline:0;width:40px;height:40px;border-radius:2px}post-language-option:where([variant=list]) :is(a,button):hover{color:#504f4b}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-language-option:where([variant=list]) :is(a,button){border:1px solid ButtonBorder;color:ButtonText}}post-language-option:where([variant=list])[active]:not([active=false]) :is(a,button){background-color:#050400 !important;color:#fff;pointer-events:none}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-language-option:where([variant=list])[active]:not([active=false]) :is(a,button){background-color:Highlight !important;color:HighlightText}}post-language-option:where([variant=menu]){min-width:72px}post-language-option:where([variant=menu])[active]:not([active=false]){display:none}post-language-option:where([variant=menu]) :is(a,button){padding-block:13px;padding-inline:16px;box-sizing:border-box;justify-content:flex-start;position:relative;border-radius:0}post-language-option:where([variant=menu]) :is(a,button):hover{color:#fff;background-color:#504f4b}post-language-option:where([variant=menu]):first-child :is(a,button){border-start-start-radius:4px;border-start-end-radius:4px}post-language-option:where([variant=menu]):last-child :is(a,button){border-end-start-radius:4px;border-end-end-radius:4px}";
 
 const PostLanguageOption = class {
     constructor(hostRef) {
@@ -527,13 +540,12 @@ const PostLanguageOption = class {
     }
     render() {
         const lang = this.code.toLowerCase();
-        const role = this.variant === 'menu' ? 'menuitem' : undefined;
         const emitOnKeyDown = (e) => {
             if (e.key === 'Enter' || e.key === ' ') {
                 this.emitChange();
             }
         };
-        return (h(Host, { key: '565abb06373e341d429242f6d1943edfdb20f8d7', "data-version": version }, this.url ? (h("a", { role: role, "aria-current": this.active ? 'page' : undefined, href: this.url, hrefLang: lang, lang: lang, onClick: () => this.emitChange(), onKeyDown: emitOnKeyDown }, h("slot", null), h("span", { class: "visually-hidden" }, this.name))) : (h("button", { role: role, "aria-current": this.active ? 'true' : undefined, lang: lang, onClick: () => this.emitChange(), onKeyDown: emitOnKeyDown }, h("slot", null), h("span", { class: "visually-hidden" }, this.name)))));
+        return (h(Host, { key: 'deaee69d7e0c551af5162ae124f78c9418aba062', "data-version": version, role: this.variant === 'list' ? 'listitem' : undefined }, this.url ? (h("a", { "aria-current": this.active ? 'page' : undefined, href: this.url, hrefLang: lang, lang: lang, onClick: () => this.emitChange(), onKeyDown: emitOnKeyDown }, h("slot", null), h("span", { class: "visually-hidden" }, this.name))) : (h("button", { "aria-current": this.active ? 'true' : undefined, lang: lang, onClick: () => this.emitChange(), onKeyDown: emitOnKeyDown }, h("slot", null), h("span", { class: "visually-hidden" }, this.name)))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
@@ -619,14 +631,13 @@ const PostLanguageSwitch = class {
     updateChildrenVariant() {
         this.languageOptions.forEach(el => {
             el.setAttribute('variant', this.variant);
-            el.setAttribute('role', this.variant == 'menu' ? 'menuitem' : 'listitem');
         });
     }
     renderList() {
         return (h(Host, { "data-version": version }, h("div", { class: "post-language-switch-list", role: "list", "aria-label": this.caption, "aria-describedby": this.listSpanId }, h("span", { id: this.listSpanId, class: "visually-hidden" }, this.description), h("slot", null))));
     }
     renderDropdown() {
-        return (h(Host, { "data-version": version }, h("post-menu-trigger", { for: this.menuId }, h("button", { class: "post-language-switch-trigger" }, this.activeLang, h("span", { class: "visually-hidden" }, this.caption), h("span", { class: "visually-hidden" }, this.description), h("post-icon", { "aria-hidden": "true", name: "chevrondown" }))), h("post-menu", { id: this.menuId, class: "post-language-switch-dropdown-container", "aria-label": this.caption, role: "menu" }, h("slot", null))));
+        return (h(Host, { "data-version": version }, h("post-menu-trigger", { for: this.menuId }, h("button", { class: "post-language-switch-trigger" }, this.activeLang, h("span", { class: "visually-hidden" }, this.caption), h("span", { class: "visually-hidden" }, this.description), h("post-icon", { "aria-hidden": "true", name: "chevrondown" }))), h("post-menu", { id: this.menuId, class: "post-language-switch-dropdown-container" }, h("slot", null))));
     }
     render() {
         return this.variant === 'list' ? this.renderList() : this.renderDropdown();
@@ -643,7 +654,7 @@ __decorate$2([
 ], PostLanguageSwitch.prototype, "handlePostChange", null);
 PostLanguageSwitch.style = postLanguageSwitchCss;
 
-const postListCss = "@keyframes popIn{from{transform:scale(0.9);opacity:0;transition-property:transform,opacity,overlay,display;transition-behavior:allow-discrete;transition-duration:var(--post-transition-duration, 0.35s);transition-timing-function:linear(0, 0.007, 0.029 2.2%, 0.118 4.7%, 0.625 14.4%, 0.826 19%, 0.902, 0.962, 1.008 26.1%, 1.041 28.7%, 1.064 32.1%, 1.07 36%, 1.061 40.5%, 1.015 53.4%, 0.999 61.6%, 0.995 71.2%, 1)}to{opacity:1;transform:scale(1)}}post-list{display:flex;flex-direction:column;gap:var(--post-list-title-gap, 0)}post-list>[role=list]{display:flex;flex-direction:column;gap:var(--post-list-item-gap, 0)}post-list:where([horizontal]:not([horizontal=false])){flex-direction:row;align-items:center}post-list:where([horizontal]:not([horizontal=false]))>[role=list]{flex-direction:row;align-items:center}post-list>.list-title.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}";
+const postListCss = "post-list{display:flex;flex-direction:column;gap:var(--post-list-title-gap, 0)}post-list>[role=list]{display:flex;flex-direction:column;gap:var(--post-list-item-gap, 0)}post-list:where([horizontal]:not([horizontal=false])){flex-direction:row;align-items:center}post-list:where([horizontal]:not([horizontal=false]))>[role=list]{flex-direction:row;align-items:center}post-list>.list-title.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}";
 
 const PostList = class {
     constructor(hostRef) {
@@ -672,7 +683,7 @@ const PostList = class {
         }
     }
     render() {
-        return (h(Host, { key: '36b2afb0224903b411ca77257ab80d0a455bdf82', "data-version": version }, h("div", { key: 'af0b3536d697097bc841a7ea50871fc69c230aee', ref: el => (this.titleEl = el), id: this.titleId, class: `list-title${this.titleHidden ? ' visually-hidden' : ''}` }, h("slot", { key: '4e115aa68fdbb2c674065e7644f326e0990b4867' })), h("div", { key: '49c0032b0baca56af8015d457a2d134dc0a9d39b', role: "list", "aria-labelledby": this.titleId }, h("slot", { key: 'ec67e9a226b003c6f2e9aca019bef483fa22011e', name: "post-list-item" }))));
+        return (h(Host, { key: '27dc0177ba3d81149b6b5dce24d6f18b8f57c9e5', "data-version": version }, h("div", { key: 'f860eaeafc60605c67fb0c47e452ecfdbf03d002', ref: el => (this.titleEl = el), id: this.titleId, class: `list-title${this.titleHidden ? ' visually-hidden' : ''}` }, h("slot", { key: '17e20fdcf588649a9d678f873687cdedaef931aa' })), h("div", { key: 'aebdcd2fe4b5a4d232b0fe3de7f6273c93f505f6', role: "list", "aria-labelledby": this.titleId }, h("slot", { key: 'fa15f227e3251d44d1519421960bb5f3056fc371', name: "post-list-item" }))));
     }
     get host() { return getElement(this); }
 };
@@ -688,7 +699,7 @@ const PostListItem = class {
         this.host.setAttribute('slot', 'post-list-item');
     }
     render() {
-        return (h(Host, { key: 'c6e5d38b3b01e37bb59cf31d64228e12dcd47bde', role: "listitem", slot: "post-list-item", version: version }, h("slot", { key: '0e156cf6e671ff4835b0262ef44b9e4342e58b94' })));
+        return (h(Host, { key: 'd15e750cd663def9363bedd020f09e634aba14c9', role: "listitem", slot: "post-list-item", version: version }, h("slot", { key: '361853e5c5994de4e5a5884cc32d7c7280b62b56' })));
     }
     get host() { return getElement(this); }
 };
@@ -715,7 +726,7 @@ const PostLogo = class {
     render() {
         const logoLink = this.url && (typeof this.url === 'string' ? this.url : this.url.href);
         const LogoTag = logoLink ? 'a' : 'span';
-        return (h(Host, { key: 'd6279e660f4e48e1810a76cd7449a964908a327f', "data-version": version }, h(LogoTag, { key: 'aa1c6764aafb74cd7c670cc5281f267df5e684e2', class: `logo ${logoLink ? 'logo-link' : ''}`, ...(logoLink ? { href: logoLink } : {}) }, h("span", { key: 'ab4ab45ed0b58d309aef262335c2bfb12f42b5d6', class: "description" }, h("slot", { key: '4ddbcb53683853723b426a76b4614bee59d83777', onSlotchange: () => this.checkDescription() })), h("svg", { key: '2c78f3b6bb6364f5872032aeb32e29d315451c4d', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 72 72", "aria-hidden": "true" }, h("g", { key: '8d02b5cf5b5f88f52dcf49c0d40f6153a3dc5714', id: "Logo" }, h("rect", { key: '18901557af215a699c6070638c21e7ad552c071a', fill: "#ffcc00", x: "0", y: "0", width: "72", height: "72" }), h("polygon", { key: '56d26b229eb79d87ad41a8b1d8a98937150b1e6d', 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" }), h("path", { key: 'f1a2f2083359e4204c8af9d1e75d27c8b50df480', 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 (h(Host, { key: '1c268056329697baccc5bf65b1e66acd8531d5f3', "data-version": version }, h(LogoTag, { key: '9b73fc4922a5ea0f72d761e82136ef1111eb7e21', class: `logo ${logoLink ? 'logo-link' : ''}`, ...(logoLink ? { href: logoLink } : {}) }, h("span", { key: '4042a64056f3d22a99d6b245201be20d1afe5dc0', class: "description" }, h("slot", { key: 'eb437f087d952b4f4a961bcba0dc18eb6836c6c9', onSlotchange: () => this.checkDescription() })), h("svg", { key: 'b658e94d0e7f63d2f80245e12017f87f50a0b2c9', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 72 72", "aria-hidden": "true" }, h("g", { key: '90c0c8f64d0c9023dfa7296e68333232b9023276', id: "Logo" }, h("rect", { key: 'a1dfd6e0bcaedb485398f1896603af36e3f119dc', fill: "#ffcc00", x: "0", y: "0", width: "72", height: "72" }), 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" }), 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" }))))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
@@ -724,7 +735,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-expanded=true],post-mainnavigation post-list-item>button.selected,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-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-expanded=true] .nav-el-active,post-mainnavigation post-list-item>button.selected .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-expanded=true] .nav-el-active{opacity:1}post-mainnavigation post-list-item>a.selected .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-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-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.selected::after,post-mainnavigation post-list-item>button[aria-expanded=true]::after,post-mainnavigation post-list-item post-megadropdown-trigger button.selected::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-expanded=true],post-mainnavigation post-megadropdown a.selected,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-expanded=true],post-mainnavigation post-list-item>button.selected,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-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 = "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 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
@@ -869,12 +880,12 @@ const PostMainnavigation = class {
         }, NAVBAR_DISABLE_DURATION);
     }
     render() {
-        return (h(Host, { key: '94f9013416e0f22f7a571217495526cc03ed324b', slot: "post-mainnavigation", version: version }, h("div", { key: 'b82f1577a2a35adf39afbf8120f2a98b669048f0', "aria-hidden": "true", class: { 'scroll-control scroll-left': true, 'd-none': !this.canScrollLeft }, onMouseDown: e => this.handleScrollButtonClick(e, 'left') }, h("post-icon", { key: '6a83d6c33cd178eb415ef4e4a2f61af4869e03ae', "aria-hidden": "true", name: "chevronleft" })), h("nav", { key: '0ef8a3dd934e9de55099be6d10a8e8f8d7d3378b', ref: el => (this.navbar = el) }, h("slot", { key: '08191f7821e57ed7d516b79bd42a0c79f7d40d34' })), h("div", { key: 'b957afc9c60702dfc51ff33fa6fd2084db3cb3e8', "aria-hidden": "true", class: { 'scroll-control scroll-right': true, 'd-none': !this.canScrollRight }, onMouseDown: e => this.handleScrollButtonClick(e, 'right') }, h("post-icon", { key: 'c9ef19c1234443a51a32ffc380ff7247f3f22e08', "aria-hidden": "true", name: "chevronright" }))));
+        return (h(Host, { key: '1876abaa01a705b5bed07b6f4ab7f795ca994759', slot: "post-mainnavigation", version: version }, h("div", { key: 'c61592c959287dcf329921e11dd0d1414329b15a', "aria-hidden": "true", class: { 'scroll-control scroll-left': true, 'd-none': !this.canScrollLeft }, onMouseDown: e => this.handleScrollButtonClick(e, 'left') }, h("post-icon", { key: '51b460d2bfdb0ce52e2639f7521de67477972fba', "aria-hidden": "true", name: "chevronleft" })), h("nav", { key: '54d8f2a52c935713251d752b30ff163bf7bd8b5f', ref: el => (this.navbar = el) }, h("slot", { key: '749a000aa37381cbcf7a68514f77a4ff3da7e90b' })), h("div", { key: 'a42aa9a06704dfd4ebb2357b3dc1efa21f7ac136', "aria-hidden": "true", class: { 'scroll-control scroll-right': true, 'd-none': !this.canScrollRight }, onMouseDown: e => this.handleScrollButtonClick(e, 'right') }, h("post-icon", { key: '64ef94d58da05da4ea86c9458b7775c431d0461b', "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-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.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 PostMegadropdown = class {
     constructor(hostRef) {
@@ -887,6 +898,7 @@ const PostMegadropdown = class {
          * and updates automatically when the dropdown is toggled.
          */
         this.isVisible = false;
+        this.trigger = false;
         /** Holds the current animation class. */
         this.animationClass = null;
         this.handleClickOutside = (event) => {
@@ -921,7 +933,7 @@ const PostMegadropdown = class {
             PostMegadropdown.activeDropdown = null;
         }
     }
-    componentWillRender() {
+    componentDidRender() {
         this.getFocusableElements();
     }
     /**
@@ -1004,6 +1016,14 @@ 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];
     }
@@ -1031,7 +1051,7 @@ const PostMegadropdown = class {
     }
     render() {
         const containerStyle = this.isVisible ? {} : { display: 'none' };
-        return (h(Host, { key: 'b322cf2da9bc8f494045644e5a97e98195eae223', version: version }, h("div", { key: '6c17be4d41d19b5043736b588468b8e1def70f11', class: `megadropdown-container ${this.animationClass || ''}`, style: containerStyle, onAnimationEnd: () => this.handleAnimationEnd() }, h("div", { key: 'ba33f5c97239fcd7212cb435bfdd64a79b7910d7', class: "megadropdown" }, h("slot", { key: '0148730fada5d623b11071b69f9972013fbbcbce', name: "megadropdown-title" }), h("div", { key: '536c1b795d8a2e16ad9a105bd3db98cd9abfc0d6', class: "megadropdown-content" }, h("slot", { key: '3f66bfd1661ea42c938a31af6ceb8d1f1bbdbcd0' })), h("div", { key: '2f240c7264663fe6d1877e582a33b599ae137219', onClick: () => this.hide(true), class: "back-button" }, h("slot", { key: '0ad90d939722d07809fb9ea96ab2bb091ef78c1c', name: "back-button" })), h("div", { key: '1d038e119522ca98cc3ab4cdba178b87febcedb4', onClick: () => this.hide(true), class: "close-button" }, h("slot", { key: 'b4e3dd20b8e14291261b5b7939fadd6a8927c0a2', name: "close-button" }))))));
+        return (h(Host, { key: '18685d3da311fd0563a3c5a498df1e1fef96b524', version: version }, h("div", { key: 'fb3feb160e46b80ed60c202871152ac3f7862f83', class: `megadropdown-container ${this.animationClass || ''}`, style: containerStyle, onAnimationEnd: () => this.handleAnimationEnd() }, h("div", { key: '34e0d3e68bd9bfbeec8ebe37b8977076c91cfe02', class: "megadropdown" }, h("slot", { key: '67d17ec51f7436f2a8acc1216b37820ff999f985', name: "megadropdown-title" }), h("div", { key: '6671d31fcc17d435991a253f04a83bbe56551942', class: "megadropdown-content" }, h("slot", { key: 'd0d313a98202f2d502e4574bed8802682d4da6f3' })), h("div", { key: 'd42560e7a4f3142cb548a1ffb97ad391fd14871f', onClick: () => this.hide(true), class: "back-button" }, h("slot", { key: '76f0a36d5ca87834b9d857a8f13d53ecb82f9a24', name: "back-button" })), h("div", { key: 'a9ea0c1f24f5c997a1a4c9432f0c7d537b8d6da0', onClick: () => this.hide(true), class: "close-button" }, h("slot", { key: '1c815102d7f4d1e21aaaaffcf277d98454eda17d', name: "close-button" }))))));
     }
     get host() { return getElement(this); }
 };
@@ -1134,7 +1154,7 @@ const PostMegadropdownTrigger = class {
         document.removeEventListener('postToggleMegadropdown', this.handleToggleMegadropdown);
     }
     render() {
-        return (h(Host, { key: '315c957a6cf876da48209096b9f30a7d94e72c08', "data-version": version, "tab-index": "-1" }, h("button", { key: '2533ded6277d2cf97c0c108df49823833486b4de' }, h("slot", { key: 'bf9b18545e11b30eb40d351794ca104035ed47db' }))));
+        return (h(Host, { key: 'b5194e2160ffc439f3219807ec86196c01f60d31', "data-version": version, "tab-index": "-1" }, h("button", { key: '3bf811bc35c85fc570a0b6ba3af9b5f7765676cb' }, h("slot", { key: '15b6f17c8b812b43b4aec56b5396b4e194ccd711' }))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
@@ -1146,7 +1166,7 @@ __decorate$1([
 ], PostMegadropdownTrigger.prototype, "handleToggleMegadropdown", void 0);
 PostMegadropdownTrigger.style = postMegadropdownTriggerCss;
 
-const postMenuCss = "@keyframes popIn{from{transform:scale(0.9);opacity:0;transition-property:transform,opacity,overlay,display;transition-behavior:allow-discrete;transition-duration:var(--post-transition-duration, 0.35s);transition-timing-function:linear(0, 0.007, 0.029 2.2%, 0.118 4.7%, 0.625 14.4%, 0.826 19%, 0.902, 0.962, 1.008 26.1%, 1.041 28.7%, 1.064 32.1%, 1.07 36%, 1.061 40.5%, 1.015 53.4%, 0.999 61.6%, 0.995 71.2%, 1)}to{opacity:1;transform:scale(1)}}: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}";
 
 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;
@@ -1196,18 +1216,32 @@ const PostMenu = class {
             }
         };
         this.handlePostToggle = (event) => {
-            this.isVisible = event.detail;
+            this.isVisible = event.detail.isOpen;
             this.toggleMenu.emit(this.isVisible);
             requestAnimationFrame(() => {
                 if (this.isVisible) {
                     this.lastFocusedElement = this.root?.activeElement;
                     const menuItems = this.getSlottedItems();
-                    if (menuItems.length > 0) {
-                        menuItems[0].focus();
+                    if (event.detail.first) {
+                        if (menuItems.length > 0) {
+                            // Add role="menu" to the popovercontainer
+                            this.host.setAttribute('role', 'menu');
+                            // Add role="menuitem" to the focusable elements
+                            menuItems.forEach(item => {
+                                item.setAttribute('role', 'menuitem');
+                            });
+                            // Add aria-label to the menu
+                            if (this.label)
+                                this.host.setAttribute('aria-label', this.label);
+                        }
                     }
+                    menuItems[0].focus();
                 }
                 else if (this.lastFocusedElement) {
-                    this.lastFocusedElement.focus();
+                    setTimeout(() => {
+                        // This timeout is added for NVDA to announce the menu as collapsed
+                        this.lastFocusedElement.focus();
+                    }, 0);
                 }
             });
         };
@@ -1318,7 +1352,7 @@ const PostMenu = class {
             .flatMap(el => Array.from(getFocusableChildren(el))));
     }
     render() {
-        return (h(Host, { key: 'bca8873f7f98b03d3e6952bce4990d1c435bd5ec', "data-version": version, role: "menu" }, h("post-popovercontainer", { key: '805c1e528c4af6e35b7881395b2f9de9e430f8c8', placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: 'f534119e208f2bb387f39824736aee766f550fa8', part: "menu" }, h("slot", { key: 'ec9ae42dab9aebd93aafdbebd15d8c39736c84df' })))));
+        return (h(Host, { key: '7b7fe6fccd27d3ff12eae3094b1a55b9b9778eb1', "data-version": version }, h("post-popovercontainer", { key: '6dae2883febd1e96ae1b34518dd2e9c634fafecb', placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: 'e19c107831b020aa0039ea7a18465e4bb72380c4', part: "menu" }, h("slot", { key: '9d9862e73dd222435d196e67c540bf8266952d94' })))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
@@ -1405,7 +1439,7 @@ const PostMenuTrigger = class {
         }
     }
     render() {
-        return (h(Host, { key: '76b3c59cdae5c78cefaaf1ea2a9668a77bddd37e', "data-version": version, "tab-index": "-1" }, h("slot", { key: '3835d87c3795e694f7493ceb735bd638bdd2dea1' })));
+        return (h(Host, { key: '14592f9564fdb09b2e809374d5794bf71f576dbb', "data-version": version, "tab-index": "-1" }, h("slot", { key: 'a0f463000420df39035cc5a48369d230394b5e04' })));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
@@ -4103,12 +4137,28 @@ function apply() {
   injectStyles(document);
 }
 
-const postPopovercontainerCss = "@keyframes popIn{from{transform:scale(0.9);opacity:0;transition-property:transform,opacity,overlay,display;transition-behavior:allow-discrete;transition-duration:var(--post-transition-duration, 0.35s);transition-timing-function:linear(0, 0.007, 0.029 2.2%, 0.118 4.7%, 0.625 14.4%, 0.826 19%, 0.902, 0.962, 1.008 26.1%, 1.041 28.7%, 1.064 32.1%, 1.07 36%, 1.061 40.5%, 1.015 53.4%, 0.999 61.6%, 0.995 71.2%, 1)}to{opacity:1;transform:scale(1)}}@layer polyfill{@supports not selector(:popover-open){[popover]:not(.\\:popover-open){display:none}}}:where(post-popovercontainer){background-color:rgba(0,0,0,0);border:rgba(0,0,0,0);position:fixed;margin:0;padding:0;overflow:visible}:where(post-popovercontainer)>div{box-shadow:var(--post-device-elevation-300);width:max-content;max-width:100%;color:var(--post-current-fg);background-color:var(--post-current-bg);border-radius:4px}:where(post-popovercontainer)>div.animate-pop-in{animation:popIn .25s ease-out forwards}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:where(post-popovercontainer)>div{border:2px solid rgba(0,0,0,0)}}:where(post-popovercontainer)[tooltip]{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}:where(post-popovercontainer)[safe-space]::after{content:\"\";position:fixed;inset:0;z-index:-1;pointer-events:auto}:where(post-popovercontainer)[safe-space=triangle]::after{clip-path:polygon(var(--post-safe-space-cursor-x, 0) var(--post-safe-space-cursor-y, 0), var(--post-safe-space-popover-x-start, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-start, 0)), var(--post-safe-space-popover-x-end, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-end, 0)))}:where(post-popovercontainer)[safe-space=trapezoid]::after{clip-path:polygon(var(--post-safe-space-trigger-x-start, var(--post-safe-space-trigger-x, 0)) var(--post-safe-space-trigger-y, var(--post-safe-space-trigger-y-start, 0)), var(--post-safe-space-trigger-x-end, var(--post-safe-space-trigger-x, 0)) var(--post-safe-space-trigger-y, var(--post-safe-space-trigger-y-end, 0)), var(--post-safe-space-popover-x-end, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-end, 0)), var(--post-safe-space-popover-x-start, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-start, 0)))}:where(post-popovercontainer):not(:has(.arrow))>div{box-shadow:var(--post-device-elevation-300)}:where(post-popovercontainer):has(.arrow)>div{filter:drop-shadow(1px 2px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(2px 4px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(4px 8px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer):has(.arrow.top)>div{filter:drop-shadow(0px -2px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(0px -4px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(0px -8px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer):has(.arrow.left)>div{filter:drop-shadow(-2px 0px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(-4px 0px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(-8px 0px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer):has(.arrow.right)>div{filter:drop-shadow(2px 0px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(4px 0px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(8px 0px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer) .arrow{position:absolute;width:.5825rem;height:.5825rem;background-color:inherit;rotate:45deg;pointer-events:none;z-index:-1}:where(post-popovercontainer) .arrow.top{border-block-start:2px solid rgba(0,0,0,0);border-inline-start:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.right{border-block-start:2px solid rgba(0,0,0,0);border-inline-end:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.left{border-block-end:2px solid rgba(0,0,0,0);border-inline-start:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.bottom{border-block-end:2px solid rgba(0,0,0,0);border-inline-end:2px solid rgba(0,0,0,0)}";
+const duration = 250;
+const easing = 'ease-out';
+function popIn(el) {
+    if (!el)
+        return;
+    return el.animate([
+        { transform: 'scale(0.9)', opacity: 0 },
+        { transform: 'scale(1)', opacity: 1 },
+    ], {
+        duration,
+        easing,
+        fill: 'forwards',
+    });
+}
+
+const postPopovercontainerCss = "@layer polyfill{@supports not selector(:popover-open){[popover]:not(.\\:popover-open){display:none}}}:where(post-popovercontainer){background-color:rgba(0,0,0,0);border:rgba(0,0,0,0);position:fixed;margin:0;padding:0;overflow:visible}:where(post-popovercontainer)>div{box-shadow:var(--post-device-elevation-300);width:max-content;max-width:100%;color:var(--post-current-fg);background-color:var(--post-current-bg);border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:where(post-popovercontainer)>div{border:2px solid rgba(0,0,0,0)}}:where(post-popovercontainer)[tooltip]{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}:where(post-popovercontainer)[safe-space]::after{content:\"\";position:fixed;inset:0;z-index:-1;pointer-events:auto}:where(post-popovercontainer)[safe-space=triangle]::after{clip-path:polygon(var(--post-safe-space-cursor-x, 0) var(--post-safe-space-cursor-y, 0), var(--post-safe-space-popover-x-start, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-start, 0)), var(--post-safe-space-popover-x-end, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-end, 0)))}:where(post-popovercontainer)[safe-space=trapezoid]::after{clip-path:polygon(var(--post-safe-space-trigger-x-start, var(--post-safe-space-trigger-x, 0)) var(--post-safe-space-trigger-y, var(--post-safe-space-trigger-y-start, 0)), var(--post-safe-space-trigger-x-end, var(--post-safe-space-trigger-x, 0)) var(--post-safe-space-trigger-y, var(--post-safe-space-trigger-y-end, 0)), var(--post-safe-space-popover-x-end, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-end, 0)), var(--post-safe-space-popover-x-start, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-start, 0)))}:where(post-popovercontainer):not(:has(.arrow))>div{box-shadow:var(--post-device-elevation-300)}:where(post-popovercontainer):has(.arrow)>div{filter:drop-shadow(1px 2px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(2px 4px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(4px 8px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer):has(.arrow.top)>div{filter:drop-shadow(0px -2px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(0px -4px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(0px -8px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer):has(.arrow.left)>div{filter:drop-shadow(-2px 0px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(-4px 0px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(-8px 0px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer):has(.arrow.right)>div{filter:drop-shadow(2px 0px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(4px 0px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(8px 0px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer) .arrow{position:absolute;width:.5825rem;height:.5825rem;background-color:inherit;rotate:45deg;pointer-events:none;z-index:-1}:where(post-popovercontainer) .arrow.top{border-block-start:2px solid rgba(0,0,0,0);border-inline-start:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.right{border-block-start:2px solid rgba(0,0,0,0);border-inline-end:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.left{border-block-end:2px solid rgba(0,0,0,0);border-inline-start:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.bottom{border-block-end:2px solid rgba(0,0,0,0);border-inline-end:2px solid rgba(0,0,0,0)}";
 
 const PostPopovercontainer = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
         this.postToggle = createEvent(this, "postToggle");
+        this.firstOpen = true;
         /**
          * Defines the placement of the popovercontainer according to the floating-ui options available at https://floating-ui.com/docs/computePosition#placement.
          * Popovercontainers are automatically flipped to the opposite side if there is not enough available space and are shifted
@@ -4208,9 +4258,19 @@ const PostPopovercontainer = class {
         this.toggleTimeoutId = window.setTimeout(() => (this.toggleTimeoutId = null), 10);
         const isOpen = e.newState === 'open';
         if (isOpen) {
+            const content = this.host.querySelector('.popover-content');
             this.startAutoupdates();
+            if (content && this.animation === 'pop-in') {
+                popIn(content);
+            }
             if (this.safeSpace)
                 window.addEventListener('mousemove', this.mouseTrackingHandler.bind(this));
+            // Emit event with `first` flag only true on the first open
+            if (this.firstOpen) {
+                this.postToggle.emit({ isOpen, first: this.firstOpen });
+                this.firstOpen = false;
+                return;
+            }
         }
         else {
             if (typeof this.clearAutoUpdate === 'function')
@@ -4218,7 +4278,7 @@ const PostPopovercontainer = class {
             if (this.safeSpace)
                 window.removeEventListener('mousemove', this.mouseTrackingHandler.bind(this));
         }
-        this.postToggle.emit(isOpen);
+        this.postToggle.emit({ isOpen: isOpen, first: false });
     }
     /**
      * Start listening for DOM updates, scroll events etc. that have
@@ -4349,10 +4409,9 @@ const PostPopovercontainer = class {
         }
     }
     render() {
-        const animationClass = this.animation ? `animate-${this.animation}` : '';
-        return (h(Host, { key: '357f53696ca28ab2c137d47e2192038dc756c289', "data-version": version, popover: this.manualClose ? 'manual' : 'auto' }, h("div", { key: '9c40bdc5034ccf14157ee1ae8ce33fe58a9049e4', class: animationClass }, this.arrow && (h("span", { key: '6133ab54aaea6f198560ca5cb30f5604318203f6', class: "arrow", ref: el => {
+        return (h(Host, { key: '1594b782ac56ae23eba2df3f452ad40015ace67d', "data-version": version, popover: this.manualClose ? 'manual' : 'auto' }, h("div", { key: '565cbf870aca9abbc665525a627922d1cfdb9195', class: "popover-content" }, this.arrow && (h("span", { key: 'add7d6f7b176e7365b5a0c25fa81dd2a9520e7f3', class: "arrow", ref: el => {
                 this.arrowRef = el;
-            } })), h("slot", { key: '39f53833a3f570b2c8807a5903b531c6733b0ada' }))));
+            } })), h("slot", { key: '308138890a4148c5c94b675e2a6b911fef1c31b5' }))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
@@ -4409,7 +4468,7 @@ const PostTogglebutton = class {
         this.host.addEventListener('keydown', (e) => this.handleKeydown(e));
     }
     render() {
-        return (h(Host, { key: '1cebe1d1314e2c89f141869e07521e7f30e58617', "data-version": version, role: "button", tabindex: "0", "aria-pressed": this.toggled.toString() }, h("slot", { key: '8b8c33befde8e93eca73a6239170c3786e2cf2f2' })));
+        return (h(Host, { key: 'f6b56dc64dbff8ef94e4104eebe845a04f113c75', "data-version": version, role: "button", tabindex: "0", "aria-pressed": this.toggled.toString() }, h("slot", { key: '2846bb617c7a68ba6390fe27b043265569a9fd55' })));
     }
     get host() { return getElement(this); }
 };