@ebrains/components 3.0.0 → 3.1.0

package/dist/hydrate/index.mjs

@@ -2331,7 +2331,7 @@ class ColorPrimaryPalette {
         ];
     }
     render() {
-        return (hAsync("ul", { key: '8e734cf4a60694d3f9e3b8418cda0b5ae2b53c0c', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, this.colors.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }, hAsync("div", { class: "grid" }, hAsync("span", { class: "f-body-02" }, color.rgb), hAsync("span", { class: "f-body-02 w-full" }, color.cmyk), hAsync("eds-code-block", { code: color.hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { class: "grid" }, hAsync("span", { class: "f-body-02" }, color.pantoneC), hAsync("span", { class: "f-body-02" }, color.pantoneU))))))));
+        return (hAsync("ul", { key: 'baff427c72d8e73945459cd7988112758685e9dc', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, this.colors.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }, hAsync("div", { class: "grid" }, hAsync("span", { class: "f-body-02" }, color.rgb), hAsync("span", { class: "f-body-02 w-full" }, color.cmyk), hAsync("eds-code-block", { code: color.hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { class: "grid" }, hAsync("span", { class: "f-body-02" }, color.pantoneC), hAsync("span", { class: "f-body-02" }, color.pantoneU))))))));
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -2403,7 +2403,7 @@ class ColorSecondaryPalette {
         this.show = undefined;
     }
     render() {
-        return (hAsync("ul", { key: '5ed603d55cb6903a0dcfa620ae51a729a61cc883', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, this.colors.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }, hAsync("div", { class: "grid" }, hAsync("span", { class: "f-body-02" }, color.rgb), hAsync("span", { class: "f-body-02 w-full" }, color.cmyk), hAsync("eds-code-block", { code: color.hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { class: "grid" }, hAsync("span", { class: "f-body-02" }, color.pantoneC), hAsync("span", { class: "f-body-02" }, color.pantoneU))))))));
+        return (hAsync("ul", { key: 'f72b4b776eb902f9525ed7d8daf22f58e76adf6c', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, this.colors.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }, hAsync("div", { class: "grid" }, hAsync("span", { class: "f-body-02" }, color.rgb), hAsync("span", { class: "f-body-02 w-full" }, color.cmyk), hAsync("eds-code-block", { code: color.hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { class: "grid" }, hAsync("span", { class: "f-body-02" }, color.pantoneC), hAsync("span", { class: "f-body-02" }, color.pantoneU))))))));
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -2477,7 +2477,7 @@ class ColorSupportPalette {
         return 'text-default';
     }
     render() {
-        return (hAsync("ul", { key: '44b71e2df44c8c9d5a5ba570d25050a09566bf3f', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, this.colors.map((color) => {
+        return (hAsync("ul", { key: '0f2cc155ce4e73dc47272a4640834cb0ee2e22a5', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, this.colors.map((color) => {
             // compute once
             const textClass = this.getTextColor(color.background);
             return (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }, hAsync("div", { class: "grid" }, hAsync("span", { class: `f-body-02 ${textClass}` }, color.cmyk), hAsync("eds-code-block", { code: color.hex, style: { minWidth: '150px', marginRight: '5px' }, class: textClass })), hAsync("div", { class: "grid" }, hAsync("span", { class: `f-body-02 ${textClass}` }, color.pantoneC), hAsync("span", { class: `f-body-02 ${textClass}` }, color.pantoneU)))));
@@ -2637,7 +2637,7 @@ class ComponentsSection {
         }
     }
     render() {
-        return hAsync("div", { key: '9664cd887a7ac8a2a80f32e501cac7230620052e', class: "container" }, this.renderContent());
+        return hAsync("div", { key: '8d781f8e27f93eb003bd4390da57503dc17a945b', class: "container" }, this.renderContent());
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -2715,7 +2715,7 @@ class CorrectUseOfColors {
         registerInstance(this, hostRef);
     }
     render() {
-        return (hAsync("div", { key: '6f2e0d05692813eeb9f7edb52508efd608763908', class: "container" }, hAsync("p", { key: '78ab9fe995f873ae56b734550fb96d5cfcc94ecf', class: "f-body-01" }, "This guide demonstrates the correct usage of the", hAsync("eds-link", { key: '2dd1a95794b4e72c5fc54079b69ef48108fca4ac', label: "primary", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#primary-palette", "extra-class": "inline-block ml-4" }), "and", hAsync("eds-link", { key: 'db85859e08c5faa38cc8e04d9e7602486cac1921', label: "support", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#support-palette", "extra-class": "inline-block ml-4" }), "color palettes."), hAsync("div", { key: 'bbd0f8a9de6ab6d1ad08d79af9695ebee46568c4', class: "flex" }, hAsync("div", { key: '12fe2d6fa1f349e6431a6484e50b637f3a9539cf', class: "w-full" }, hAsync("ul", { key: '8750fcdacb4a408d1003153ef24c1aa1eb266d50', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, primary$1.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[150px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))), hAsync("div", { key: '899c5ac4127fdab0c26a619e5ba9e9abad682b84', class: "w-full" }, hAsync("ul", { key: '20324cb5001311ad3ff9dc138e2d7dfd4779a071', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, support.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[90px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }))))))), hAsync("p", { key: '8d9cf6a12252c3ab51779365467d9b5b8eda2aac', class: "f-body-01" }, "This guide demonstrates the correct usage of the", hAsync("eds-link", { key: '01fb910b11041bb7b9891edf0546ad6d48a1c59d', label: "purple", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#primary-palette", "extra-class": "inline-block ml-4" }), "and", hAsync("eds-link", { key: '0e16590a0ea3dd612c386ec8144d34c46d9cc239', label: "support", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#support-palette", "extra-class": "inline-block ml-4" }), "color palettes."), hAsync("div", { key: '409db013f54872918a046349932ffb03cbd5c7c8', class: "flex" }, hAsync("div", { key: '7a4caa407edcf4778769b087e14f1d7725d49541', class: "w-full" }, hAsync("ul", { key: '04a87008d35495235219096d6cee25c5b79c047a', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, purple$1.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[225px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))), hAsync("div", { key: '42412cb3ccd6019262724d160208c9c74ab0be87', class: "w-full" }, hAsync("ul", { key: '832b788f29badaf0e6b498b743400e98b3d62336', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, support.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[90px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }))))))), hAsync("p", { key: '7d5710b21829f9a98d11d9328528391bb35b9b5b', class: "f-body-01" }, "This guide demonstrates the correct usage of the", hAsync("eds-link", { key: 'afd01b3fbd6ba01f2e6f66c99a8d69e31a21bf1a', label: "blue", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#primary-palette", "extra-class": "inline-block ml-4" }), "and", hAsync("eds-link", { key: '560b790073d516e3a48217454d2926eb8e7619ae', label: "support", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#support-palette", "extra-class": "inline-block ml-4" }), "color palettes."), hAsync("div", { key: '81ec29cd9873c62aa9afffecc9f39ada4535452a', class: "flex" }, hAsync("div", { key: '358baaafe6def20de75387af5bac0cb69cb53daf', class: "w-full" }, hAsync("ul", { key: '338913f0d10c724834a9bf9102ebff0159ad4b42', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, blue.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[225px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))), hAsync("div", { key: 'baf990dd3cf2c6587e312e07b93b00e975608268', class: "w-full" }, hAsync("ul", { key: '60bb4363163e3d10eb61388a8f505d1da2027598', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, support.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[90px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }))))))), hAsync("p", { key: 'e607f95714c66a02cc8d7e336f2b0731bfeb916f', class: "f-body-01" }, "This guide demonstrates the correct usage of the", hAsync("eds-link", { key: '82b699d19d01e11eeea3c13d8e817d12c32ee4ca', label: "redish", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#primary-palette", "extra-class": "inline-block ml-4" }), "and", hAsync("eds-link", { key: '54f9a3e1e6b7629ace882a50f971e88d983e66d2', label: "support", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#support-palette", "extra-class": "inline-block ml-4" }), "color palettes."), hAsync("div", { key: 'bf1a294c09474031d042153d402e9fe84907d0f5', class: "flex" }, hAsync("div", { key: '5ec457417cf7a123aabd28e822d437e2706c228f', class: "w-full" }, hAsync("ul", { key: 'ee50fe6ddf736682fb69838f53875b88cd22507d', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, red$1.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[225px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))), hAsync("div", { key: '50fcc531966b131ec36acbf396e1676ea988d1ba', class: "w-full" }, hAsync("ul", { key: '01fa6bca1248df187df894f419ff77efe24bf426', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, support.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[90px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))))));
+        return (hAsync("div", { key: '1448b252afd426048e14a56782bad097bbc2cb04', class: "container" }, hAsync("p", { key: '0a0a0ead35d299893d307a1eb9a71e4234d066aa', class: "f-body-01" }, "This guide demonstrates the correct usage of the", hAsync("eds-link", { key: '83f480812bba9e85716bae68885b3fdc7ed241a7', label: "primary", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#primary-palette", "extra-class": "inline-block ml-4" }), "and", hAsync("eds-link", { key: '5c19085f34284f1a2aa3c525c9389611b75bfb1c', label: "support", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#support-palette", "extra-class": "inline-block ml-4" }), "color palettes."), hAsync("div", { key: 'd660baa9e8a74688099c0ec5e8c0a6a3f0519952', class: "flex" }, hAsync("div", { key: 'e3402503bc727c66c39dd6fdc38e8f41a79f6fda', class: "w-full" }, hAsync("ul", { key: '0b797f5b7339979cedb7fe29ecfa6ea36c656df7', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, primary$1.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[150px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))), hAsync("div", { key: '36362208d138fa0e1d892f52c0f2e8d063dedfd2', class: "w-full" }, hAsync("ul", { key: '5cbeeaf57b89f04f55e0a0c289d6d4b3ea3f5a64', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, support.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[90px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }))))))), hAsync("p", { key: '9b409f7d4d271ebd6334d1a973e3a3e4c329ab9b', class: "f-body-01" }, "This guide demonstrates the correct usage of the", hAsync("eds-link", { key: '1b4b5713f609774b37e2a84ae992098f4412da6b', label: "purple", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#primary-palette", "extra-class": "inline-block ml-4" }), "and", hAsync("eds-link", { key: '2aaef87146f0777ec614c27e5c309a862a32008a', label: "support", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#support-palette", "extra-class": "inline-block ml-4" }), "color palettes."), hAsync("div", { key: '8b0114f367da96c44094e88b642c3d80cc03eb3a', class: "flex" }, hAsync("div", { key: '0e7031b26c356592194c9590969d87f59a533b99', class: "w-full" }, hAsync("ul", { key: '9b081bf5903f907c50c3bd70b021dc1d5f13047f', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, purple$1.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[225px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))), hAsync("div", { key: '7a48e557e56d0f76556bddd5c0d7348347b522e5', class: "w-full" }, hAsync("ul", { key: 'de47269f2887ede6f63d78ea27216bdfca092e00', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, support.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[90px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }))))))), hAsync("p", { key: '6462727e41d5adbb78e6516cc514deab0c82a4ff', class: "f-body-01" }, "This guide demonstrates the correct usage of the", hAsync("eds-link", { key: '4e451a7a19184ea9febc308440f18aa9ffd7ba20', label: "blue", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#primary-palette", "extra-class": "inline-block ml-4" }), "and", hAsync("eds-link", { key: '00b0bfd638b09f74045600e1f8712ff291a9fefb', label: "support", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#support-palette", "extra-class": "inline-block ml-4" }), "color palettes."), hAsync("div", { key: 'defd084d15e5ea4ba08fc3bbd6e0b49177c5272f', class: "flex" }, hAsync("div", { key: 'd6bf7ff0ae322e935cc5757470a46ebe3d0d9044', class: "w-full" }, hAsync("ul", { key: 'e5446d344666bf651ea95740defb7ddc7a7b11c1', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, blue.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[225px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))), hAsync("div", { key: 'fea82f2022e4649db4f0e7496682d1da56b081fd', class: "w-full" }, hAsync("ul", { key: 'e678cd5f9af9969b3d5832102dc37ea2b720f88a', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, support.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[90px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }))))))), hAsync("p", { key: 'd2e63f7de74f17c40529f04195dfceab6d2064ce', class: "f-body-01" }, "This guide demonstrates the correct usage of the", hAsync("eds-link", { key: 'e038092dd9503209b495fcd19648891c8dcfd6e3', label: "redish", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#primary-palette", "extra-class": "inline-block ml-4" }), "and", hAsync("eds-link", { key: '8a08ec7cdb4f054bdf44b949da4490b6ffce4e2a', label: "support", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#support-palette", "extra-class": "inline-block ml-4" }), "color palettes."), hAsync("div", { key: '8d082cd4dddffb42b6d16d1c8b1269a2ba6f9b20', class: "flex" }, hAsync("div", { key: '9d5794ab3a57398babcd8d6f27df2d9ed2154c45', class: "w-full" }, hAsync("ul", { key: 'b83da37b2a99897f68c44cf5c8b910c7626f828e', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, red$1.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[225px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))), hAsync("div", { key: '2842ef771db390b7e486e3926107238b3f91f7f9', class: "w-full" }, hAsync("ul", { key: '59dda1da69095cda6ca70c92dec362b7ec6ae521', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, support.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[90px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))))));
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -2754,7 +2754,7 @@ class DocsContent {
         }
     }
     render() {
-        return hAsync("div", { key: 'd012b0c560b658efc52b6ed9c26f481d2ce38bd9', class: "container" }, this.renderContent());
+        return hAsync("div", { key: '4104127b2816de8034a5bde49162486930647142', class: "container" }, this.renderContent());
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -2787,7 +2787,7 @@ class DocsPalettes {
         }
     }
     render() {
-        return hAsync("div", { key: '81c8a0516dc577d0a9b04255aa021739abfd6c9e', class: "container" }, this.renderContent());
+        return hAsync("div", { key: 'b6a79a91f8609cc1dd6fdd09c15b33e90dea202b', class: "container" }, this.renderContent());
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -2856,7 +2856,7 @@ function matomoOptOut() {
     }
 }
 
-const edsAccordionCss = ":host{display:block;width:100%}.accordion-card{border-radius:16px;padding:1.5rem;transition:all 0.4s ease;position:relative;overflow:hidden;border:1px solid rgba(0, 0, 0, 0.1)}.accordion-card-default{background:var(--brand-black);color:var(--white)}.accordion-card-default:hover{border-color:rgba(0, 255, 157, 0.4);box-shadow:0 4px 20px rgba(0, 0, 0, 0.1)}.accordion-card-default .accordion-title{color:var(--white)}.accordion-card-default .accordion-description{color:var(--grey-light)}.accordion-card-default .accordion-chevron{color:var(--white)}.accordion-card-default .accordion-content{color:var(--grey-light)}.accordion-card-inverse{background:var(--white);color:var(--brand-black)}.accordion-card-inverse:hover{border-color:rgba(0, 255, 157, 0.4);box-shadow:0 4px 20px rgba(0, 0, 0, 0.1)}.accordion-card-inverse .accordion-title{color:var(--brand-black)}.accordion-card-inverse .accordion-description{color:var(--grey-dark)}.accordion-card-inverse .accordion-chevron{color:var(--brand-black)}.accordion-card-inverse .accordion-content{color:var(--grey-dark)}.accordion-header{display:flex;align-items:center;gap:1rem;cursor:pointer;width:100%;background:none;border:none;padding:0;text-align:left;-webkit-user-select:none;user-select:none}.accordion-header:focus-visible{outline:2px solid var(--brand-green);outline-offset:2px;border-radius:8px}.accordion-icon{width:48px;height:48px;min-width:48px;display:flex;align-items:center;justify-content:center;background:rgba(0, 255, 157, 0.1);border-radius:12px;color:var(--brand-green);flex-shrink:0}.accordion-card-inverse .accordion-icon{background:rgba(0, 0, 0, 0.05);color:var(--brand-black)}.accordion-header-text{flex-grow:1;min-width:0}.accordion-title{font-family:'Inter', var(--f-heading-fontFamily);font-weight:300;font-size:1.25rem;line-height:1.4;margin:0}.accordion-description{font-family:'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;font-size:0.9375rem;line-height:1.6;margin-top:0.25rem;margin-bottom:0}.accordion-chevron{flex-shrink:0;transition:transform 0.3s ease}.accordion-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows 0.4s ease}.accordion-panel.expanded{grid-template-rows:1fr}.accordion-panel-inner{overflow:hidden}.accordion-content{padding-top:1rem;font-family:'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;font-size:0.9375rem;line-height:1.6}.line-clamp-1{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}@media (max-width: 768px){.accordion-card{padding:1.25rem}.accordion-icon{width:40px;height:40px;min-width:40px}.accordion-title{font-size:1.125rem}.accordion-header{gap:0.75rem}}h3,p{margin:0}";
+const edsAccordionCss = ":host{display:block;width:100%}.accordion-card{border-radius:16px;padding:1.5rem;transition:all 0.4s ease;position:relative;overflow:hidden;border:1px solid rgba(0, 0, 0, 0.1)}.accordion-card-default{background:var(--brand-black);color:var(--white)}.accordion-card-default:hover{border-color:rgba(0, 255, 157, 0.4);box-shadow:0 4px 20px rgba(0, 0, 0, 0.1)}.accordion-card-default .accordion-title{color:var(--white)}.accordion-card-default .accordion-description{color:var(--grey-light)}.accordion-card-default .accordion-chevron{color:var(--white)}.accordion-card-default .accordion-content{color:var(--grey-light)}.accordion-card-inverse{background:var(--white);color:var(--brand-black)}.accordion-card-inverse:hover{border-color:rgba(0, 255, 157, 0.4);box-shadow:0 4px 20px rgba(0, 0, 0, 0.1)}.accordion-card-inverse .accordion-title{color:var(--brand-black)}.accordion-card-inverse .accordion-description{color:var(--grey-700)}.accordion-card-inverse .accordion-chevron{color:var(--brand-black)}.accordion-card-inverse .accordion-content{color:var(--grey-700)}.accordion-header{display:flex;align-items:center;gap:1rem;cursor:pointer;width:100%;background:none;border:none;padding:0;text-align:left;-webkit-user-select:none;user-select:none}.accordion-header:focus-visible{outline:2px solid var(--brand-green);outline-offset:2px;border-radius:8px}.accordion-icon{width:48px;height:48px;min-width:48px;display:flex;align-items:center;justify-content:center;background:rgba(0, 255, 157, 0.1);border-radius:12px;color:var(--brand-green);flex-shrink:0}.accordion-card-inverse .accordion-icon{background:rgba(0, 0, 0, 0.05);color:var(--brand-black)}.accordion-header-text{flex-grow:1;min-width:0}.accordion-title{font-family:'Inter', var(--f-heading-fontFamily);font-weight:300;font-size:1.25rem;line-height:1.4;margin:0}.accordion-description{font-family:'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;font-size:0.9375rem;line-height:1.6;margin-top:0.25rem;margin-bottom:0}.accordion-chevron{flex-shrink:0;transition:transform 0.3s ease}.accordion-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows 0.4s ease}.accordion-panel.expanded{grid-template-rows:1fr}.accordion-panel-inner{overflow:hidden}.accordion-content{padding-top:1rem;font-family:'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;font-size:0.9375rem;line-height:1.6}.line-clamp-1{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}@media (max-width: 768px){.accordion-card{padding:1.25rem}.accordion-icon{width:40px;height:40px;min-width:40px}.accordion-title{font-size:1.125rem}.accordion-header{gap:0.75rem}}h3,p{margin:0}";
 var EdsAccordionStyle0 = edsAccordionCss;
 
 /**
@@ -2914,7 +2914,7 @@ class EdsAccordion {
             'accordion-card',
             `accordion-card-${this.variant}`
         ].join(' ');
-        return (hAsync("div", { key: 'e9f44914fce505b97f90415ed72f322ff09fcee7', class: cardClasses }, hAsync("div", { key: 'd4c6ec563b66b14fc74bc872c953bd9e3e501a85', class: "accordion-header", onClick: this.handleClick, onKeyDown: this.handleKeyDown, role: "button", tabindex: 0, "aria-expanded": String(this.isExpanded), "aria-controls": "accordionSection" }, this.icon && (hAsync("div", { key: '9c365bc15aeec93ccc2021206e72e457a2032265', class: "accordion-icon" }, hAsync("eds-icon-wrapper", { key: '73742a6cb431342c62e1fd5661c39927dcb57bef', name: this.icon, size: 24 }))), hAsync("div", { key: '1ba17b07eedccb135dc5138ace783ea211b75d52', class: "accordion-header-text" }, hAsync("h3", { key: 'd8c34e66195fbe2863736d39f5a9e8276f30252a', class: "accordion-title" }, this.heading), this.description && (hAsync("p", { key: 'c24a3614a3f2d1bcd29a39cbd3384c25c1c50e47', class: `accordion-description ${!this.isExpanded && this.clampText ? 'line-clamp-1' : ''}` }, this.description))), hAsync("eds-icon-wrapper", { key: 'deecdbb3c0ec32079b3b913ed7976ae813b9468a', name: this.toggleIcon, size: 20, class: "accordion-chevron" })), hAsync("section", { key: 'f3767c81d79e2681c6317e3268cf1c966fba6bc2', id: "accordionSection", "aria-hidden": String(!this.isExpanded), class: `accordion-panel ${this.isExpanded ? 'expanded' : ''}` }, hAsync("div", { key: '08ce9281f2e7fc858f30d0b7c0da0b0739824193', class: "accordion-panel-inner" }, hAsync("div", { key: 'c9cdc6312fa279d1c1ee5753c7038b0a9ce3c624', class: "accordion-content" }, hAsync("slot", { key: 'aaec055131ce2ae7830aecfc2fc6ace50f05ded1' }))))));
+        return (hAsync("div", { key: '08061b87dfd54b49f8aa782f29e2a9c5c8bcd2ef', class: cardClasses }, hAsync("div", { key: '728033232d8e6aa348bc98d028a5bd62d32fd934', class: "accordion-header", onClick: this.handleClick, onKeyDown: this.handleKeyDown, role: "button", tabindex: 0, "aria-expanded": String(this.isExpanded), "aria-controls": "accordionSection" }, this.icon && (hAsync("div", { key: 'eeb4260c955a2d4394bc3663dc749afc45b6f87f', class: "accordion-icon" }, hAsync("eds-icon-wrapper", { key: '0896625a235bda97a098ac7b9a4ebec00e5fa587', name: this.icon, size: 24 }))), hAsync("div", { key: '3e6b85780bc597a84dc0eb5d2526f9e54c16148d', class: "accordion-header-text" }, hAsync("h3", { key: 'b5c5c0023bc23dc225183736f02683134a40da93', class: "accordion-title" }, this.heading), this.description && (hAsync("p", { key: 'eb04c90cef03a838a4f852b988f3a9984e593120', class: `accordion-description ${!this.isExpanded && this.clampText ? 'line-clamp-1' : ''}` }, this.description))), hAsync("eds-icon-wrapper", { key: '583d0bcc82a178c2a47eef586aede9c87e8ea456', name: this.toggleIcon, size: 20, class: "accordion-chevron" })), hAsync("section", { key: '8f820377d639ced2d0a4fe505452b6b408640400', id: "accordionSection", "aria-hidden": String(!this.isExpanded), class: `accordion-panel ${this.isExpanded ? 'expanded' : ''}` }, hAsync("div", { key: 'd41dc9c3ef21f14df3ca25138440356703fa35ed', class: "accordion-panel-inner" }, hAsync("div", { key: '156c3c9b139efcb964525147338ecdeeca538123', class: "accordion-content" }, hAsync("slot", { key: 'b19b54c279cca1a32b4ed0f5b0a319d87b7bf937' }))))));
     }
     get el() { return getElement(this); }
     static get style() { return EdsAccordionStyle0; }
@@ -3048,7 +3048,7 @@ class EdsAppRoot {
         this.combinedInitPromise = Promise.all([initKeycloakPromise, authStatusPromise]);
     }
     render() {
-        return (hAsync("div", { key: '10a75e7e117b2f3ab3d0ba8f2a26c122b2e0eed4' }, hAsync("eds-splash-screen", { key: 'ab527af22c9a9fe861bbed4759946428e3e7fdf0', inverse: true, initPromise: this.combinedInitPromise }), hAsync("eds-login", { key: '78e7face11e06df76b9dd29e99b7d968cc2cf32e', "keycloak-url": "http://localhost:8080", "keycloak-realm": "nigeor-realm", "keycloak-client-id": "stencil-app" }), hAsync("main", { key: '30f463e667ccc25062bbf2764fdabc8937b6097c' }, this.isAuthenticated ? hAsync("h1", null, "Welcome, authenticated user!") : hAsync("h1", null, "Please log in."))));
+        return (hAsync("div", { key: 'c9192fb7e315fa8fe41c9ee512f4573951865208' }, hAsync("eds-splash-screen", { key: 'e3d413597cc370692c593abd4017d97e1c172219', inverse: true, initPromise: this.combinedInitPromise }), hAsync("eds-login", { key: '2821e64738053db4809663aa918f98c4df358201', "keycloak-url": "http://localhost:8080", "keycloak-realm": "nigeor-realm", "keycloak-client-id": "stencil-app" }), hAsync("main", { key: '4680b74ec0f74b8060b020f726f6696b41b43a9e' }, this.isAuthenticated ? hAsync("h1", null, "Welcome, authenticated user!") : hAsync("h1", null, "Please log in."))));
     }
     static get cmpMeta() { return {
         "$flags$": 9,
@@ -3131,7 +3131,7 @@ class EdsAvatar {
      * @returns {JSX.Element} The rendered avatar component.
      */
     render() {
-        return (hAsync("div", { key: '00e163f2dd33c92bdfd8f45b6e2d3384afa32a30', class: this.containerClasses }, this.picture ? (hAsync("eds-img", { src: this.picture, width: 54, height: 54, sizes: "120px", alt: `${this.firstName} ${this.lastName}`, lazyload: true, withBg: true })) : (hAsync("abbr", { title: this.computedInitials || `${this.firstName} ${this.lastName}`, class: "!no-underline f-ui-01" }, this.computedInitials))));
+        return (hAsync("div", { key: '36f8cb598e0e53793ce8a49e9e2419f41ba8f160', class: this.containerClasses }, this.picture ? (hAsync("eds-img", { src: this.picture, width: 54, height: 54, sizes: "120px", alt: `${this.firstName} ${this.lastName}`, lazyload: true, withBg: true })) : (hAsync("abbr", { title: this.computedInitials || `${this.firstName} ${this.lastName}`, class: "!no-underline f-ui-01" }, this.computedInitials))));
     }
     static get style() { return EdsAvatarStyle0; }
     static get cmpMeta() { return {
@@ -3162,7 +3162,7 @@ class EdsBlockBreak {
         this.inverse = false;
     }
     render() {
-        return hAsync("hr", { key: '7b472ce3dcecc7a0c061d336c4edb1bec098c113', class: `${this.inverse ? 'border-default' : 'border-softer'}  my-16 inline-block w-full border-t-2` });
+        return hAsync("hr", { key: '2531c44fa20745f7860e4647f77ffa038a56d832', class: `${this.inverse ? 'border-default' : 'border-softer'}  my-16 inline-block w-full border-t-2` });
     }
     static get style() { return EdsBlockBreakStyle0; }
     static get cmpMeta() { return {
@@ -3322,7 +3322,7 @@ class EdsBreadcrumb {
      */
     render() {
         const itemsToRender = this.getTruncatedItems();
-        return (hAsync("nav", { key: 'a068d2deb011c0a303e5a4320f4f5913bfc36d4a', "aria-label": "Breadcrumb" }, hAsync("ol", { key: '63ab81ece8ff48546875320f4fd346638fac3bdc', class: "flex items-center space-x-2" }, itemsToRender.map((item, index) => {
+        return (hAsync("nav", { key: '95c13ac07de20bc04fb57ee990e5d21f928f3a86', "aria-label": "Breadcrumb" }, hAsync("ol", { key: '2a03ff53ac27eaa5e37ddfef32e9a4fe322755dd', class: "flex items-center space-x-2" }, itemsToRender.map((item, index) => {
             const isLast = index === itemsToRender.length - 1;
             return (hAsync("li", { class: "flex items-center" }, !item.isHidden ? ((() => {
                 const { fullLabel } = this.getLabels(item, isLast);
@@ -3403,7 +3403,7 @@ const cva = (base, config)=>{
     };
 };
 
-const edsButtonCss = "/* ============================================\n   EDS BUTTON - NEW EBRAINS VISUAL SYSTEM\n   ============================================ */\n\n*,\n::before,\n::after {\n  box-sizing: border-box;\n  border-width: 0;\n  border-style: solid;\n  border-color: currentColor;\n}\n\na {\n  color: inherit;\n  text-decoration: inherit;\n}\n\n/*\n  1. Change the font styles in all browsers.\n  2. Remove the margin in Firefox and Safari.\n  3. Remove default padding in all browsers.\n  */\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit;\n  font-feature-settings: inherit;\n  font-variation-settings: inherit;\n  font-size: 100%;\n  font-weight: inherit;\n  line-height: inherit;\n  letter-spacing: inherit;\n  color: inherit;\n  margin: 0;\n  padding: 0;\n}\n\n/*\n  Remove the inheritance of text transform in Edge and Firefox.\n  */\nbutton,\nselect {\n  text-transform: none;\n}\n\n/*\n  1. Correct the inability to style clickable types in iOS and Safari.\n  2. Remove default button styles.\n  */\nbutton,\ninput:where([type='button']),\ninput:where([type='reset']),\ninput:where([type='submit']) {\n  -webkit-appearance: button;\n  /* 1 */\n  background-color: transparent;\n  /* 2 */\n  background-image: none;\n  /* 2 */\n}\n\np {\n  margin: 0;\n}\n\n/*\n  Set the default cursor for buttons.\n  */\nbutton,\n[role=\"button\"] {\n  cursor: pointer;\n}\n\n/*\n  Make sure disabled buttons don't get the pointer cursor.\n  */\n:disabled {\n  cursor: default;\n}\n\n/* Make elements with the HTML hidden attribute stay hidden by default */\n[hidden] {\n  display: none;\n}\n\n/* ============================================\n   TYPOGRAPHY CLASSES\n   ============================================ */\n\n.f-body-01 {\n  font-family: var(--f-body-01-fontFamily);\n  font-weight: var(--f-body-01-fontWeight);\n  font-size: var(--f-body-01-fontSize);\n  line-height: var(--f-body-01-lineHeight);\n  letter-spacing: var(--f-body-01-letterSpacing);\n}\n\n.f-body-02 {\n  font-family: var(--f-body-02-fontFamily);\n  font-weight: var(--f-body-02-fontWeight);\n  font-size: var(--f-body-02-fontSize);\n  line-height: var(--f-body-02-lineHeight);\n  letter-spacing: var(--f-body-02-letterSpacing);\n}\n\n.f-ui-01 {\n  font-family: var(--f-ui-01-fontFamily);\n  font-weight: var(--f-ui-01-fontWeight);\n  font-size: var(--f-ui-01-fontSize);\n  line-height: var(--f-ui-01-lineHeight);\n  letter-spacing: var(--f-ui-01-letterSpacing);\n}\n\n.f-ui-02 {\n  font-family: var(--f-ui-02-fontFamily);\n  font-weight: var(--f-ui-02-fontWeight);\n  font-size: var(--f-ui-02-fontSize);\n  line-height: var(--f-ui-02-lineHeight);\n  letter-spacing: var(--f-ui-02-letterSpacing);\n}\n\n/* ============================================\n   BUTTON BORDER EFFECTS - NEW SYSTEM\n   ============================================ */\n\n.border-inside {\n  position: relative;\n\n  &::after {\n    pointer-events: none;\n    position: absolute;\n    inset: 0rem;\n    z-index: 1;\n    border-radius: 8px;\n    border-width: 2px;\n    border-color: rgba(7, 20, 13, 1); /* brand-black with opacity */\n    content: '';\n  }\n}\n\n.border-inside-inverse {\n  position: relative;\n\n  &::after {\n    pointer-events: none;\n    position: absolute;\n    inset: 0rem;\n    z-index: 1;\n    border-radius: 8px;\n    border-width: 2px;\n    border-color: rgba(255, 255, 255, 1); /* white border */\n    content: '';\n  }\n}\n\n.border-inside-pill {\n  &::after {\n    border-radius: 100px; /* pill shape */\n    content: '';\n  }\n}\n\n.border-inside-inverse.border-inside-pill {\n  &::after {\n    border-radius: 100px; /* pill shape for inverse border */\n  }\n}\n\n/* ============================================\n   LOADER SPINNER\n   ============================================ */\n\n.loader {\n  box-sizing: border-box;\n  display: inline-block;\n  height: 1rem;\n  width: 1rem;\n}\n\n@keyframes spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n.loader {\n  animation: spin 1s linear infinite;\n  border-radius: 9999px;\n  border: 3px solid rgba(7, 20, 13, 0.3); /* brand-black */\n  border-bottom-color: #07140D; /* brand-black */\n}\n\n/* ============================================\n   TRANSITIONS & EFFECTS\n   ============================================ */\n\n.effect-color {\n  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 300ms;\n  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n\n.effect-focus {\n  outline-width: 3px;\n  outline-offset: 2px;\n  outline-color: var(--brand-green); /* NEW: brand-green for focus */\n}\n\n.effect-focus:focus-visible {\n  outline-style: solid;\n}\n\n.effect-focus-within {\n  outline-width: 3px;\n  outline-offset: 2px;\n  outline-color: var(--brand-green); /* NEW: brand-green for focus */\n}\n\n.effect-focus-within:focus-within {\n  outline-style: solid;\n}\n\n/* ============================================\n   BRAND HOVER TRANSFORM EFFECT\n   ============================================ */\n.brand-hover-transform {\n  transition-property: transform, box-shadow, color, background-color;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 300ms;\n}\n\n.brand-hover-transform:hover {\n  transform: translateY(-2px);\n  box-shadow: 0 8px 20px rgba(0, 255, 157, 0.3);\n}\n\n.brand-hover-transform[aria-disabled=\"true\"]:hover,\n.brand-hover-transform:disabled:hover {\n  transform: none;\n  box-shadow: none;\n}\n\n/* Secondary Inverse Transform Effect */\n.secondary-inverse-transform {\n  transition-property: transform, background-color, color;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 300ms;\n}\n\n.secondary-inverse-transform:hover {\n  transform: translateY(-2px);\n}\n\n.secondary-inverse-transform[aria-disabled=\"true\"]:hover,\n.secondary-inverse-transform:disabled:hover {\n  transform: none;\n}\n\n/* ============================================\n   UTILITY CLASSES\n   ============================================ */\n\n.sr-only {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border-width: 0;\n}\n\n.pointer-events-none {\n  pointer-events: none;\n}\n\n.static {\n  position: static;\n}\n\n.fixed {\n  position: fixed;\n}\n\n.absolute {\n  position: absolute;\n}\n\n.relative {\n  position: relative;\n}\n\n.sticky {\n  position: sticky;\n}\n\n.inset-0 {\n  inset: 0rem;\n}\n\n.inset-x-16 {\n  left: 1rem;\n  right: 1rem;\n}\n\n/* ============================================\n   POSITIONING\n   ============================================ */\n\n.-top-8 {\n  top: -0.5rem;\n}\n\n.left-0 {\n  left: 0rem;\n}\n\n.left-1\\/2 {\n  left: 50%;\n}\n\n.left-4 {\n  left: 0.25rem;\n}\n\n.left-\\[4px\\] {\n  left: 4px;\n}\n\n.right-0 {\n  right: 0rem;\n}\n\n.right-4 {\n  right: 0.25rem;\n}\n\n.right-8 {\n  right: 0.5rem;\n}\n\n.right-\\[6px\\] {\n  right: 6px;\n}\n\n.top-0 {\n  top: 0rem;\n}\n\n.top-1\\/2 {\n  top: 50%;\n}\n\n/* ============================================\n   SPACING\n   ============================================ */\n\n.m-0 {\n  margin: 0rem;\n}\n\n.mx-auto {\n  margin-left: auto;\n  margin-right: auto;\n}\n\n.-ml-16 {\n  margin-left: -1rem;\n}\n\n.-mr-16 {\n  margin-right: -1rem;\n}\n\n.ml-0 {\n  margin-left: 0rem;\n}\n\n.ml-4 {\n  margin-left: 0.25rem;\n}\n\n.ml-64 {\n  margin-left: 4rem;\n}\n\n.ml-8 {\n  margin-left: 0.5rem;\n}\n\n.ml-auto {\n  margin-left: auto;\n}\n\n.mr-4 {\n  margin-right: 0.25rem;\n}\n\n.mr-8 {\n  margin-right: 0.5rem;\n}\n\n.mr-auto {\n  margin-right: auto;\n}\n\n/* ============================================\n   DISPLAY\n   ============================================ */\n\n.block {\n  display: block;\n}\n\n.\\!block {\n  display: block !important;\n}\n\n.inline-block {\n  display: inline-block;\n}\n\n.inline {\n  display: inline;\n}\n\n.flex {\n  display: flex;\n}\n\n.inline-flex {\n  display: inline-flex;\n}\n\n.hidden {\n  display: none;\n}\n\n/* ============================================\n   DIMENSIONS\n   ============================================ */\n\n.h-20 {\n  height: 1.25rem;\n}\n\n.h-24 {\n  height: 1.5rem;\n}\n\n.h-36 {\n  height: 2.25rem;\n}\n\n.h-40 {\n  height: 2.5rem;\n}\n\n.h-44 {\n  height: 2.75rem;\n}\n\n.h-48 {\n  height: 3rem;\n}\n\n.h-auto {\n  height: auto;\n}\n\n.h-full {\n  height: 100%;\n}\n\n.\\!min-h-20 {\n  min-height: 1.25rem !important;\n}\n\n.min-h-screen {\n  min-height: 100vh;\n}\n\n.w-20 {\n  width: 1.25rem;\n}\n\n.w-24 {\n  width: 1.5rem;\n}\n\n.w-full {\n  width: 100%;\n}\n\n.w-auto {\n  width: auto;\n}\n\n/* ============================================\n   FLEXBOX\n   ============================================ */\n\n.flex-none {\n  flex: none;\n}\n\n.grow {\n  flex-grow: 1;\n}\n\n.cursor-pointer {\n  cursor: pointer;\n}\n\n.resize {\n  resize: both;\n}\n\n.flex-row {\n  flex-direction: row;\n}\n\n.flex-row-reverse {\n  flex-direction: row-reverse;\n}\n\n.flex-col {\n  flex-direction: column;\n}\n\n.flex-wrap {\n  flex-wrap: wrap;\n}\n\n.items-center {\n  align-items: center;\n}\n\n.justify-center {\n  justify-content: center;\n}\n\n.justify-between {\n  justify-content: space-between;\n}\n\n.gap-4 {\n  gap: 0.25rem;\n}\n\n.gap-8 {\n  gap: 0.5rem;\n}\n\n.space-x-2> :not([hidden])~ :not([hidden]) {\n  --tw-space-x-reverse: 0;\n  margin-right: calc(0.125rem * var(--tw-space-x-reverse));\n  margin-left: calc(0.125rem * calc(1 - var(--tw-space-x-reverse)));\n}\n\n/* ============================================\n   OVERFLOW\n   ============================================ */\n\n.overflow-hidden {\n  overflow: hidden;\n}\n\n.overflow-x-auto {\n  overflow-x: auto;\n}\n\n.overflow-x-hidden {\n  overflow-x: hidden;\n}\n\n.overflow-y-scroll {\n  overflow-y: scroll;\n}\n\n/* ============================================\n   TEXT\n   ============================================ */\n\n.whitespace-nowrap {\n  white-space: nowrap;\n}\n\n.break-words {\n  overflow-wrap: break-word;\n}\n\n/* ============================================\n   BORDERS & RADIUS - NEW SYSTEM\n   ============================================ */\n\n.rounded {\n  border-radius: 0.25rem;\n}\n\n.rounded-full {\n  border-radius: 9999px;\n}\n\n.rounded-lg {\n  border-radius: 16px;\n}\n\n.rounded-md {\n  border-radius: 12px;\n}\n\n.rounded-pill {\n  border-radius: 100px; /* NEW: pill shape */\n}\n\n.rounded-sm {\n  border-radius: 8px;\n}\n\n.rounded-xxs {\n  border-radius: 2px;\n}\n\n.border {\n  border-width: 1px;\n}\n\n.border-\\[\\#0034CB\\] {\n  --tw-border-opacity: 1;\n  border-color: rgb(0 52 203 / var(--tw-border-opacity));\n}\n\n.border-\\[\\#d2d2d2\\] {\n  --tw-border-opacity: 1;\n  border-color: rgb(210 210 210 / var(--tw-border-opacity));\n}\n\n.border-softest {\n  border-color: var(--grey-light);\n}\n\n.border-b-softer {\n  border-bottom-color: rgba(7, 20, 13, 0.1); /* NEW: brand-black */\n}\n\n/* ============================================\n   BACKGROUNDS - NEW EBRAINS COLORS\n   ============================================ */\n\n/* Accent backgrounds - NEW green */\n.\\!bg-accent-dark {\n  background-color: var(--brand-green-dark) !important; /* NEW: #00C87B */\n}\n\n.bg-accent {\n  background-color: var(--brand-green); /* NEW: #00FF9D */\n}\n\n.bg-accent-dark {\n  background-color: var(--brand-green-dark); /* NEW: #00C87B */\n}\n\n/* Neutral backgrounds - NEW simplified greys */\n.\\!bg-darker {\n  background-color: var(--grey-dark) !important; /* NEW: #7A7B7A */\n}\n\n.bg-dark {\n  background-color: var(--grey-light); /* NEW: #ECECEC */\n}\n\n.bg-darker {\n  background-color: var(--grey-dark); /* NEW: #7A7B7A */\n}\n\n/* Strong backgrounds - NEW brand-black */\n.\\!bg-strong-dark {\n  background-color: var(--brand-black) !important; /* NEW: #07140D */\n}\n\n.bg-strong {\n  background-color: var(--grey-dark); /* NEW: #7A7B7A */\n}\n\n.bg-strong-dark {\n  background-color: var(--brand-black); /* NEW: #07140D */\n}\n\n.bg-stronger {\n  background-color: var(--brand-black); /* NEW: #07140D */\n}\n\n.bg-strongest {\n  background-color: var(--brand-black); /* NEW: #07140D (was pure black) */\n}\n\n/* Overlay */\n.bg-overlay {\n  background-color: rgba(7, 20, 13, 0.25); /* NEW: brand-black overlay */\n}\n\n/* ============================================\n   PADDING\n   ============================================ */\n\n.p-12 {\n  padding: 0.75rem;\n}\n\n.p-6 {\n  padding: 0.375rem;\n}\n\n.p-8 {\n  padding: 0.5rem;\n}\n\n.\\!px-0 {\n  padding-left: 0rem !important;\n  padding-right: 0rem !important;\n}\n\n.px-12 {\n  padding-left: 0.75rem;\n  padding-right: 0.75rem;\n}\n\n.px-16 {\n  padding-left: 1rem;\n  padding-right: 1rem;\n}\n\n.px-32 {\n  padding-left: 1.5rem;\n  padding-right: 1.5rem;\n}\n\n.py-8 {\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n}\n\n.py-12 {\n  padding-top: 0.75rem;\n  padding-bottom: 0.75rem;\n}\n\n.pl-2 {\n  padding-left: 0.125rem;\n}\n\n.pl-4 {\n  padding-left: 0.25rem;\n}\n\n.pl-8 {\n  padding-left: 0.5rem;\n}\n\n.pr-2 {\n  padding-right: 0.125rem;\n}\n\n.pr-4 {\n  padding-right: 0.25rem;\n}\n\n.pr-8 {\n  padding-right: 0.5rem;\n}\n\n/* ============================================\n   TEXT COLORS - NEW SYSTEM\n   ============================================ */\n\n.\\!text-current {\n  color: currentColor !important;\n}\n\n.text-accent {\n  color: var(--brand-green); /* NEW: #00FF9D */\n}\n\n.text-current {\n  color: currentColor;\n}\n\n.text-default {\n  color: var(--brand-black); /* NEW: #07140D (was pure black) */\n}\n\n.text-inverse {\n  color: var(--white);\n}\n\n.text-light {\n  color: var(--grey-dark); /* NEW: simplified to grey-dark */\n}\n\n\n.text-lightest {\n  color: var(--grey-light); /* NEW: simplified to grey-dark */\n}\n\n/* ============================================\n   OPACITY\n   ============================================ */\n\n.opacity-0 {\n  opacity: 0;\n}\n\n.opacity-20 {\n  opacity: 20;\n}\n\n/* ============================================\n   SHADOWS - NEW SYSTEM\n   ============================================ */\n\n.shadow {\n  --tw-shadow: 0 1px 3px rgba(7, 20, 13, 0.1); /* NEW: brand-black */\n  --tw-shadow-colored: 0 1px 3px var(--tw-shadow-color);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.shadow-accent {\n  --tw-shadow: 0 0 16px rgba(0, 255, 157, 0.5); /* NEW: brand-green glow */\n  --tw-shadow-colored: 0 0 16px var(--tw-shadow-color);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.underline-offset-4 {\n  text-underline-offset: 0.2em;\n}\n\n.\\@container {\n  container-type: inline-size;\n}\n\n/* ============================================\n   PSEUDO-ELEMENT EFFECTS\n   ============================================ */\n\n.after\\:effect-opacity::after {\n  transition-property: opacity;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 300ms;\n  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n\n.even\\:bg-inverse-softer:nth-child(even) {\n  background-color: rgba(255, 255, 255, .15);\n}\n\n.invalid\\:text-lightest:invalid {\n  color: var(--grey-dark); /* NEW: simplified */\n}\n\n/* ============================================\n   INTERACTIVE STATES - NEW COLORS\n   ============================================ */\n\n.focus-within\\:bg-transparent:focus-within {\n  background-color: transparent;\n}\n\n/* Hover states with NEW colors */\n\n.hover\\:border-0::hover {\n  border-width: 0px;\n}\n\n.hover\\:border-accent::hover {\n  border-color: var(--brand-green); /* NEW: #00FF9D */\n}\n\n.hover\\:text-default:hover {\n  color: var(--brand-black);\n}\n\n.hover\\:text-light:hover {\n  color: var(--grey-dark);\n}\n\n.hover\\:text-inverse:hover {\n  color: var(--white);\n}\n\n\n.hover\\:bg-accent:hover {\n  background-color: var(--brand-green); /* NEW: #00C87B */\n}\n\n.hover\\:bg-accent-dark:hover {\n  background-color: var(--brand-green-dark); /* NEW: #00C87B */\n}\n\n.hover\\:bg-dark:hover {\n  background-color: var(--grey-light); /* NEW: #ECECEC */\n}\n\n.hover\\:bg-darker:hover {\n  background-color: var(--grey-dark); /* NEW: #7A7B7A */\n}\n\n.hover\\:bg-default:hover {\n  background-color: var(--grey-light);\n}\n\n.hover\\:bg-inverse:hover {\n  background-color: var(--white);\n}\n\n.hover\\:bg-strong-dark:hover {\n  background-color: var(--brand-black); /* NEW: #07140D */\n}\n\n.hover\\:bg-transparent:hover {\n  background-color: transparent;\n}\n\n.hover\\:bg-strongest:hover {\n  background-color: var(--brand-black);\n}\n\n.hover\\:text-default:hover {\n  color: var(--brand-black); /* NEW: #07140D */\n}\n\n.hover\\:text-lighter:hover {\n  color: var(--grey-dark); /* NEW: #7A7B7A */\n}\n\n.hover\\:\\!underline:hover {\n  text-decoration-line: underline !important;\n}\n\n.hover\\:no-underline:hover {\n  text-decoration-line: none;\n}\n\n.hover\\:shadow-hover:hover {\n  --tw-shadow: 0 8px 24px rgba(7, 20, 13, 0.2); /* NEW: brand-black */\n  --tw-shadow-colored: 0 8px 24px var(--tw-shadow-color);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.focus\\:shadow-none:focus {\n  --tw-shadow: 0 0 #0000;\n  --tw-shadow-colored: 0 0 #0000;\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.focus\\:outline-none:focus {\n  outline: 2px solid transparent;\n  outline-offset: 2px;\n}\n\n/* ============================================\n   DISABLED STATES - NEW COLORS\n   ============================================ */\n\n.disabled\\:cursor-not-allowed:disabled {\n  cursor: not-allowed;\n}\n\n.disabled\\:bg-dark:disabled {\n  background-color: var(--grey-light); /* NEW: #ECECEC */\n}\n\n.disabled\\:text-lightest:disabled {\n  color: var(--grey-dark); /* NEW: #7A7B7A */\n}\n\n.aria-disabled\\:cursor-not-allowed[aria-disabled=\"true\"] {\n  cursor: not-allowed;\n}\n\n.aria-disabled\\:\\!border-transparent[aria-disabled=\"true\"] {\n  border-color: transparent !important;\n}\n\n.aria-disabled\\:bg-dark[aria-disabled=\"true\"] {\n  background-color: var(--grey-light); /* NEW: #ECECEC */\n}\n\n.aria-disabled\\:bg-transparent[aria-disabled=\"true\"] {\n  background-color: transparent;\n}\n\n.aria-disabled\\:text-light[aria-disabled=\"true\"] {\n  color: var(--grey-dark); /* NEW: #7A7B7A */\n}\n\n.aria-disabled\\:text-lightest[aria-disabled=\"true\"] {\n  color: var(--grey-dark); /* NEW: #7A7B7A */\n}\n\n.aria-disabled\\:line-through[aria-disabled=\"true\"] {\n  text-decoration-line: line-through;\n}\n\n.aria-disabled\\:shadow-none[aria-disabled=\"true\"] {\n  --tw-shadow: 0 0 #0000;\n  --tw-shadow-colored: 0 0 #0000;\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.aria-current-page\\:bg-darker[aria-current=\"page\"] {\n  background-color: var(--grey-dark); /* NEW: #7A7B7A */\n}\n\n/* ============================================\n   AFTER PSEUDO-ELEMENTS\n   ============================================ */\n\n.after\\:absolute::after {\n  position: absolute;\n}\n\n.after\\:inset-0::after {\n  inset: 0rem;\n}\n\n.after\\:inset-x-0::after {\n  left: 0rem;\n  right: 0rem;\n}\n\n.after\\:bottom-0::after {\n  bottom: 0rem;\n}\n\n.after\\:left-16::after {\n  left: 1rem;\n}\n\n.after\\:right-16::after {\n  right: 1rem;\n}\n\n.after\\:z-10::after {\n  z-index: 10;\n}\n\n.after\\:rounded-lg::after {\n  border-radius: 16px;\n}\n\n.after\\:rounded-t-lg::after {\n  border-top-left-radius: 16px;\n  border-top-right-radius: 16px;\n}\n\n.after\\:border-3::after {\n  border-width: 3px;\n}\n\n.after\\:border-b-2::after {\n  border-bottom-width: 2px;\n}\n\n.after\\:\\!border-transparent::after {\n  border-color: transparent !important;\n}\n\n.after\\:border-accent::after {\n  border-color: var(--brand-green); /* NEW: #00FF9D */\n}\n\n.after\\:border-accent-dark::after {\n  border-color: var(--brand-green-dark); /* NEW: #00FF9D */\n}\n\n.after\\:border-soft::after {\n  border-color: var(--grey-dark);\n}\n\n.after\\:border-softest::after {\n  border-color: var(--grey-light);\n}\n\n.after\\:opacity-0::after {\n  opacity: 0;\n}\n\n.after\\:content-\\[\\'\\'\\]::after {\n  --tw-content: '';\n  content: var(--tw-content);\n}\n\n.hover\\:text-accent:hover {\n  color: var(--brand-green);\n}\n\n.hover\\:after\\:\\border-accent:hover::after {\n  border-color: var(--brand-green);\n}\n\n.hover\\:after\\:\\!border-transparent:hover::after {\n  border-color: transparent !important;\n}\n\n.hover\\:after\\:opacity-100:hover::after {\n  opacity: 1;\n}\n\n.focus-visible\\:after\\:opacity-100:focus-visible::after {\n  opacity: 1;\n}\n\n.aria-disabled\\:after\\:\\!border-transparent[aria-disabled=\"true\"]::after {\n  border-color: transparent !important;\n}\n\n.aria-disabled\\:after\\:\\!border-0[aria-disabled=\"true\"]::after {\n  border-width: 0 !important;\n}\n\n.hover\\:before\\:opacity-100:hover::before {\n  opacity: 1;\n}\n\n/* ============================================\n   CTA BUTTON STYLES\n   ============================================ */\n\n/* CTA link style */\n.cta-link {\n  font-family: 'IBM Plex Mono', monospace;\n  font-size: var(--f-ui-01-fontSize);\n  color: var(--grey-dark);\n  text-decoration: none;\n  transition: color 0.3s ease;\n  display: inline-flex;\n  align-items: center;\n  gap: 0.25rem;\n}\n\n.cta-link:hover {\n  color: var(--brand-green);\n}\n\n/* CTA brand link style - always green */\n.cta-link-brand {\n  font-family: 'IBM Plex Mono', monospace;\n  font-size: var(--f-ui-02-fontSize);\n  color: var(--brand-green);\n  text-decoration: none;\n  transition: color 0.3s ease;\n  display: inline-flex;\n  align-items: center;\n  gap: 0.5rem;\n}\n\n.cta-link-brand:hover {\n  color: var(--brand-green-dark);\n}\n\n@media (min-width: 750px) {\n  .md\\:w-full {\n    width: 100%;\n  }\n\n  .md\\:flex {\n    display: flex;\n  }\n}";
+const edsButtonCss = "/* ============================================\n   EDS BUTTON - NEW EBRAINS VISUAL SYSTEM\n   ============================================ */\n\n*,\n::before,\n::after {\n  box-sizing: border-box;\n  border-width: 0;\n  border-style: solid;\n  border-color: currentColor;\n}\n\na {\n  color: inherit;\n  text-decoration: inherit;\n}\n\n/*\n  1. Change the font styles in all browsers.\n  2. Remove the margin in Firefox and Safari.\n  3. Remove default padding in all browsers.\n  */\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit;\n  font-feature-settings: inherit;\n  font-variation-settings: inherit;\n  font-size: 100%;\n  font-weight: inherit;\n  line-height: inherit;\n  letter-spacing: inherit;\n  color: inherit;\n  margin: 0;\n  padding: 0;\n}\n\n/*\n  Remove the inheritance of text transform in Edge and Firefox.\n  */\nbutton,\nselect {\n  text-transform: none;\n}\n\n/*\n  1. Correct the inability to style clickable types in iOS and Safari.\n  2. Remove default button styles.\n  */\nbutton,\ninput:where([type='button']),\ninput:where([type='reset']),\ninput:where([type='submit']) {\n  -webkit-appearance: button;\n  /* 1 */\n  background-color: transparent;\n  /* 2 */\n  background-image: none;\n  /* 2 */\n}\n\np {\n  margin: 0;\n}\n\n/*\n  Set the default cursor for buttons.\n  */\nbutton,\n[role=\"button\"] {\n  cursor: pointer;\n}\n\n/*\n  Make sure disabled buttons don't get the pointer cursor.\n  */\n:disabled {\n  cursor: default;\n}\n\n/* Make elements with the HTML hidden attribute stay hidden by default */\n[hidden] {\n  display: none;\n}\n\n/* ============================================\n   TYPOGRAPHY CLASSES\n   ============================================ */\n\n.f-body-01 {\n  font-family: var(--f-body-01-fontFamily);\n  font-weight: var(--f-body-01-fontWeight);\n  font-size: var(--f-body-01-fontSize);\n  line-height: var(--f-body-01-lineHeight);\n  letter-spacing: var(--f-body-01-letterSpacing);\n}\n\n.f-body-02 {\n  font-family: var(--f-body-02-fontFamily);\n  font-weight: var(--f-body-02-fontWeight);\n  font-size: var(--f-body-02-fontSize);\n  line-height: var(--f-body-02-lineHeight);\n  letter-spacing: var(--f-body-02-letterSpacing);\n}\n\n.f-ui-01 {\n  font-family: var(--f-ui-01-fontFamily);\n  font-weight: var(--f-ui-01-fontWeight);\n  font-size: var(--f-ui-01-fontSize);\n  line-height: var(--f-ui-01-lineHeight);\n  letter-spacing: var(--f-ui-01-letterSpacing);\n}\n\n.f-ui-02 {\n  font-family: var(--f-ui-02-fontFamily);\n  font-weight: var(--f-ui-02-fontWeight);\n  font-size: var(--f-ui-02-fontSize);\n  line-height: var(--f-ui-02-lineHeight);\n  letter-spacing: var(--f-ui-02-letterSpacing);\n}\n\n/* ============================================\n   BUTTON BORDER EFFECTS - NEW SYSTEM\n   ============================================ */\n\n.border-inside {\n  position: relative;\n\n  &::after {\n    pointer-events: none;\n    position: absolute;\n    inset: 0rem;\n    z-index: 1;\n    border-radius: 8px;\n    border-width: 2px;\n    border-color: rgba(7, 20, 13, 1); /* brand-black with opacity */\n    content: '';\n  }\n}\n\n.border-inside-inverse {\n  position: relative;\n\n  &::after {\n    pointer-events: none;\n    position: absolute;\n    inset: 0rem;\n    z-index: 1;\n    border-radius: 8px;\n    border-width: 2px;\n    border-color: rgba(255, 255, 255, 1); /* white border */\n    content: '';\n  }\n}\n\n.border-inside-pill {\n  &::after {\n    border-radius: 100px; /* pill shape */\n    content: '';\n  }\n}\n\n.border-inside-inverse.border-inside-pill {\n  &::after {\n    border-radius: 100px; /* pill shape for inverse border */\n  }\n}\n\n/* ============================================\n   LOADER SPINNER\n   ============================================ */\n\n.loader {\n  box-sizing: border-box;\n  display: inline-block;\n  height: 1rem;\n  width: 1rem;\n}\n\n@keyframes spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n.loader {\n  animation: spin 1s linear infinite;\n  border-radius: 9999px;\n  border: 3px solid rgba(7, 20, 13, 0.3); /* brand-black */\n  border-bottom-color: #07140D; /* brand-black */\n}\n\n/* ============================================\n   TRANSITIONS & EFFECTS\n   ============================================ */\n\n.effect-color {\n  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 300ms;\n  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n\n.effect-focus {\n  outline-width: 3px;\n  outline-offset: 2px;\n  outline-color: var(--brand-green); /* NEW: brand-green for focus */\n}\n\n.effect-focus:focus-visible {\n  outline-style: solid;\n}\n\n.effect-focus-within {\n  outline-width: 3px;\n  outline-offset: 2px;\n  outline-color: var(--brand-green); /* NEW: brand-green for focus */\n}\n\n.effect-focus-within:focus-within {\n  outline-style: solid;\n}\n\n/* ============================================\n   BRAND HOVER TRANSFORM EFFECT\n   ============================================ */\n.brand-hover-transform {\n  transition-property: transform, box-shadow, color, background-color;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 300ms;\n}\n\n.brand-hover-transform:hover {\n  transform: translateY(-2px);\n  box-shadow: 0 8px 20px rgba(0, 255, 157, 0.3);\n}\n\n.brand-hover-transform[aria-disabled=\"true\"]:hover,\n.brand-hover-transform:disabled:hover {\n  transform: none;\n  box-shadow: none;\n}\n\n/* Secondary Inverse Transform Effect */\n.secondary-inverse-transform {\n  transition-property: transform, background-color, color;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 300ms;\n}\n\n.secondary-inverse-transform:hover {\n  transform: translateY(-2px);\n}\n\n.secondary-inverse-transform[aria-disabled=\"true\"]:hover,\n.secondary-inverse-transform:disabled:hover {\n  transform: none;\n}\n\n/* ============================================\n   UTILITY CLASSES\n   ============================================ */\n\n.sr-only {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border-width: 0;\n}\n\n.pointer-events-none {\n  pointer-events: none;\n}\n\n.static {\n  position: static;\n}\n\n.fixed {\n  position: fixed;\n}\n\n.absolute {\n  position: absolute;\n}\n\n.relative {\n  position: relative;\n}\n\n.sticky {\n  position: sticky;\n}\n\n.inset-0 {\n  inset: 0rem;\n}\n\n.inset-x-16 {\n  left: 1rem;\n  right: 1rem;\n}\n\n/* ============================================\n   POSITIONING\n   ============================================ */\n\n.-top-8 {\n  top: -0.5rem;\n}\n\n.left-0 {\n  left: 0rem;\n}\n\n.left-1\\/2 {\n  left: 50%;\n}\n\n.left-4 {\n  left: 0.25rem;\n}\n\n.left-\\[4px\\] {\n  left: 4px;\n}\n\n.right-0 {\n  right: 0rem;\n}\n\n.right-4 {\n  right: 0.25rem;\n}\n\n.right-8 {\n  right: 0.5rem;\n}\n\n.right-\\[6px\\] {\n  right: 6px;\n}\n\n.top-0 {\n  top: 0rem;\n}\n\n.top-1\\/2 {\n  top: 50%;\n}\n\n/* ============================================\n   SPACING\n   ============================================ */\n\n.m-0 {\n  margin: 0rem;\n}\n\n.mx-auto {\n  margin-left: auto;\n  margin-right: auto;\n}\n\n.-ml-16 {\n  margin-left: -1rem;\n}\n\n.-mr-16 {\n  margin-right: -1rem;\n}\n\n.ml-0 {\n  margin-left: 0rem;\n}\n\n.ml-4 {\n  margin-left: 0.25rem;\n}\n\n.ml-64 {\n  margin-left: 4rem;\n}\n\n.ml-8 {\n  margin-left: 0.5rem;\n}\n\n.ml-auto {\n  margin-left: auto;\n}\n\n.mr-4 {\n  margin-right: 0.25rem;\n}\n\n.mr-8 {\n  margin-right: 0.5rem;\n}\n\n.mr-auto {\n  margin-right: auto;\n}\n\n/* ============================================\n   DISPLAY\n   ============================================ */\n\n.block {\n  display: block;\n}\n\n.\\!block {\n  display: block !important;\n}\n\n.inline-block {\n  display: inline-block;\n}\n\n.inline {\n  display: inline;\n}\n\n.flex {\n  display: flex;\n}\n\n.inline-flex {\n  display: inline-flex;\n}\n\n.hidden {\n  display: none;\n}\n\n/* ============================================\n   DIMENSIONS\n   ============================================ */\n\n.h-20 {\n  height: 1.25rem;\n}\n\n.h-24 {\n  height: 1.5rem;\n}\n\n.h-36 {\n  height: 2.25rem;\n}\n\n.h-40 {\n  height: 2.5rem;\n}\n\n.h-44 {\n  height: 2.75rem;\n}\n\n/* Min-height variants — used for button sizing so a label that wraps to\n   two lines grows (with its py-12 padding) instead of being clipped at a\n   fixed height. Single-line buttons keep the same height. */\n.min-h-36 {\n  min-height: 2.25rem;\n}\n\n.min-h-44 {\n  min-height: 2.75rem;\n}\n\n.h-48 {\n  height: 3rem;\n}\n\n.h-auto {\n  height: auto;\n}\n\n.h-full {\n  height: 100%;\n}\n\n.\\!min-h-20 {\n  min-height: 1.25rem !important;\n}\n\n.min-h-screen {\n  min-height: 100vh;\n}\n\n.w-20 {\n  width: 1.25rem;\n}\n\n.w-24 {\n  width: 1.5rem;\n}\n\n.w-full {\n  width: 100%;\n}\n\n.w-auto {\n  width: auto;\n}\n\n/* ============================================\n   FLEXBOX\n   ============================================ */\n\n.flex-none {\n  flex: none;\n}\n\n.grow {\n  flex-grow: 1;\n}\n\n.cursor-pointer {\n  cursor: pointer;\n}\n\n.resize {\n  resize: both;\n}\n\n.flex-row {\n  flex-direction: row;\n}\n\n.flex-row-reverse {\n  flex-direction: row-reverse;\n}\n\n.flex-col {\n  flex-direction: column;\n}\n\n.flex-wrap {\n  flex-wrap: wrap;\n}\n\n.items-center {\n  align-items: center;\n}\n\n.justify-center {\n  justify-content: center;\n}\n\n.justify-between {\n  justify-content: space-between;\n}\n\n.gap-4 {\n  gap: 0.25rem;\n}\n\n.gap-8 {\n  gap: 0.5rem;\n}\n\n.space-x-2> :not([hidden])~ :not([hidden]) {\n  --tw-space-x-reverse: 0;\n  margin-right: calc(0.125rem * var(--tw-space-x-reverse));\n  margin-left: calc(0.125rem * calc(1 - var(--tw-space-x-reverse)));\n}\n\n/* ============================================\n   OVERFLOW\n   ============================================ */\n\n.overflow-hidden {\n  overflow: hidden;\n}\n\n.overflow-x-auto {\n  overflow-x: auto;\n}\n\n.overflow-x-hidden {\n  overflow-x: hidden;\n}\n\n.overflow-y-scroll {\n  overflow-y: scroll;\n}\n\n/* ============================================\n   TEXT\n   ============================================ */\n\n.whitespace-nowrap {\n  white-space: nowrap;\n}\n\n.break-words {\n  overflow-wrap: break-word;\n}\n\n/* ============================================\n   BORDERS & RADIUS - NEW SYSTEM\n   ============================================ */\n\n.rounded {\n  border-radius: 0.25rem;\n}\n\n.rounded-full {\n  border-radius: 9999px;\n}\n\n.rounded-lg {\n  border-radius: 16px;\n}\n\n.rounded-md {\n  border-radius: 12px;\n}\n\n.rounded-pill {\n  border-radius: 100px; /* NEW: pill shape */\n}\n\n.rounded-sm {\n  border-radius: 8px;\n}\n\n.rounded-xxs {\n  border-radius: 2px;\n}\n\n.border {\n  border-width: 1px;\n}\n\n.border-\\[\\#0034CB\\] {\n  --tw-border-opacity: 1;\n  border-color: rgb(0 52 203 / var(--tw-border-opacity));\n}\n\n.border-\\[\\#d2d2d2\\] {\n  --tw-border-opacity: 1;\n  border-color: rgb(210 210 210 / var(--tw-border-opacity));\n}\n\n.border-softest {\n  border-color: var(--grey-light);\n}\n\n.border-b-softer {\n  border-bottom-color: rgba(7, 20, 13, 0.1); /* NEW: brand-black */\n}\n\n/* ============================================\n   BACKGROUNDS - NEW EBRAINS COLORS\n   ============================================ */\n\n/* Accent backgrounds - NEW green */\n.\\!bg-accent-dark {\n  background-color: var(--brand-green-dark) !important; /* NEW: #00C87B */\n}\n\n.bg-accent {\n  background-color: var(--brand-green); /* NEW: #00FF9D */\n}\n\n.bg-brand-light {\n  background-color: var(--green-200); /* light brand tint #d3ffdc — brandLight intent */\n}\n\n.bg-accent-dark {\n  background-color: var(--brand-green-dark); /* NEW: #00C87B */\n}\n\n/* Neutral backgrounds - NEW simplified greys */\n.\\!bg-darker {\n  background-color: var(--grey-dark) !important; /* NEW: #7A7B7A */\n}\n\n.bg-dark {\n  background-color: var(--grey-light); /* NEW: #ECECEC */\n}\n\n.bg-darker {\n  background-color: var(--grey-dark); /* NEW: #7A7B7A */\n}\n\n/* Strong backgrounds - NEW brand-black */\n.\\!bg-strong-dark {\n  background-color: var(--brand-black) !important; /* NEW: #07140D */\n}\n\n.bg-strong {\n  background-color: var(--grey-dark); /* NEW: #7A7B7A */\n}\n\n.bg-strong-dark {\n  background-color: var(--brand-black); /* NEW: #07140D */\n}\n\n.bg-stronger {\n  background-color: var(--brand-black); /* NEW: #07140D */\n}\n\n.bg-strongest {\n  background-color: var(--brand-black); /* NEW: #07140D (was pure black) */\n}\n\n/* Overlay */\n.bg-overlay {\n  background-color: rgba(7, 20, 13, 0.25); /* NEW: brand-black overlay */\n}\n\n/* ============================================\n   PADDING\n   ============================================ */\n\n.p-12 {\n  padding: 0.75rem;\n}\n\n.p-6 {\n  padding: 0.375rem;\n}\n\n.p-8 {\n  padding: 0.5rem;\n}\n\n.\\!px-0 {\n  padding-left: 0rem !important;\n  padding-right: 0rem !important;\n}\n\n.px-12 {\n  padding-left: 0.75rem;\n  padding-right: 0.75rem;\n}\n\n.px-16 {\n  padding-left: 1rem;\n  padding-right: 1rem;\n}\n\n.px-32 {\n  padding-left: 1.5rem;\n  padding-right: 1.5rem;\n}\n\n.py-8 {\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n}\n\n.py-12 {\n  padding-top: 0.75rem;\n  padding-bottom: 0.75rem;\n}\n\n.pl-2 {\n  padding-left: 0.125rem;\n}\n\n.pl-4 {\n  padding-left: 0.25rem;\n}\n\n.pl-8 {\n  padding-left: 0.5rem;\n}\n\n.pr-2 {\n  padding-right: 0.125rem;\n}\n\n.pr-4 {\n  padding-right: 0.25rem;\n}\n\n.pr-8 {\n  padding-right: 0.5rem;\n}\n\n/* ============================================\n   TEXT COLORS - NEW SYSTEM\n   ============================================ */\n\n.\\!text-current {\n  color: currentColor !important;\n}\n\n.text-accent {\n  color: var(--brand-green); /* NEW: #00FF9D */\n}\n\n.text-current {\n  color: currentColor;\n}\n\n.text-default {\n  color: var(--brand-black); /* NEW: #07140D (was pure black) */\n}\n\n.text-inverse {\n  color: var(--white);\n}\n\n.text-light {\n  color: var(--grey-dark); /* NEW: simplified to grey-dark */\n}\n\n\n.text-lightest {\n  color: var(--grey-light); /* NEW: simplified to grey-dark */\n}\n\n/* ============================================\n   OPACITY\n   ============================================ */\n\n.opacity-0 {\n  opacity: 0;\n}\n\n.opacity-20 {\n  opacity: 20;\n}\n\n/* ============================================\n   SHADOWS - NEW SYSTEM\n   ============================================ */\n\n.shadow {\n  --tw-shadow: 0 1px 3px rgba(7, 20, 13, 0.1); /* NEW: brand-black */\n  --tw-shadow-colored: 0 1px 3px var(--tw-shadow-color);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.shadow-accent {\n  --tw-shadow: 0 0 16px rgba(0, 255, 157, 0.5); /* NEW: brand-green glow */\n  --tw-shadow-colored: 0 0 16px var(--tw-shadow-color);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.underline-offset-4 {\n  text-underline-offset: 0.2em;\n}\n\n.\\@container {\n  container-type: inline-size;\n}\n\n/* ============================================\n   PSEUDO-ELEMENT EFFECTS\n   ============================================ */\n\n.after\\:effect-opacity::after {\n  transition-property: opacity;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 300ms;\n  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n\n.even\\:bg-inverse-softer:nth-child(even) {\n  background-color: rgba(255, 255, 255, .15);\n}\n\n.invalid\\:text-lightest:invalid {\n  color: var(--grey-dark); /* NEW: simplified */\n}\n\n/* ============================================\n   INTERACTIVE STATES - NEW COLORS\n   ============================================ */\n\n.focus-within\\:bg-transparent:focus-within {\n  background-color: transparent;\n}\n\n/* Hover states with NEW colors */\n\n.hover\\:border-0::hover {\n  border-width: 0px;\n}\n\n.hover\\:border-accent::hover {\n  border-color: var(--brand-green); /* NEW: #00FF9D */\n}\n\n.hover\\:text-default:hover {\n  color: var(--brand-black);\n}\n\n.hover\\:text-light:hover {\n  color: var(--grey-dark);\n}\n\n.hover\\:text-inverse:hover {\n  color: var(--white);\n}\n\n\n.hover\\:bg-accent:hover {\n  background-color: var(--brand-green); /* NEW: #00C87B */\n}\n\n.hover\\:bg-accent-dark:hover {\n  background-color: var(--brand-green-dark); /* NEW: #00C87B */\n}\n\n.hover\\:bg-dark:hover {\n  background-color: var(--grey-light); /* NEW: #ECECEC */\n}\n\n.hover\\:bg-darker:hover {\n  background-color: var(--grey-dark); /* NEW: #7A7B7A */\n}\n\n.hover\\:bg-default:hover {\n  background-color: var(--grey-light);\n}\n\n.hover\\:bg-inverse:hover {\n  background-color: var(--white);\n}\n\n.hover\\:bg-strong-dark:hover {\n  background-color: var(--brand-black); /* NEW: #07140D */\n}\n\n.hover\\:bg-transparent:hover {\n  background-color: transparent;\n}\n\n.hover\\:bg-strongest:hover {\n  background-color: var(--brand-black);\n}\n\n.hover\\:text-default:hover {\n  color: var(--brand-black); /* NEW: #07140D */\n}\n\n.hover\\:text-lighter:hover {\n  color: var(--grey-dark); /* NEW: #7A7B7A */\n}\n\n.hover\\:\\!underline:hover {\n  text-decoration-line: underline !important;\n}\n\n.hover\\:no-underline:hover {\n  text-decoration-line: none;\n}\n\n.hover\\:shadow-hover:hover {\n  --tw-shadow: 0 8px 24px rgba(7, 20, 13, 0.2); /* NEW: brand-black */\n  --tw-shadow-colored: 0 8px 24px var(--tw-shadow-color);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.focus\\:shadow-none:focus {\n  --tw-shadow: 0 0 #0000;\n  --tw-shadow-colored: 0 0 #0000;\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.focus\\:outline-none:focus {\n  outline: 2px solid transparent;\n  outline-offset: 2px;\n}\n\n/* ============================================\n   DISABLED STATES - NEW COLORS\n   ============================================ */\n\n.disabled\\:cursor-not-allowed:disabled {\n  cursor: not-allowed;\n}\n\n.disabled\\:bg-dark:disabled {\n  background-color: var(--grey-light); /* NEW: #ECECEC */\n}\n\n.disabled\\:text-lightest:disabled {\n  color: var(--grey-dark); /* NEW: #7A7B7A */\n}\n\n.aria-disabled\\:cursor-not-allowed[aria-disabled=\"true\"] {\n  cursor: not-allowed;\n}\n\n.aria-disabled\\:\\!border-transparent[aria-disabled=\"true\"] {\n  border-color: transparent !important;\n}\n\n.aria-disabled\\:bg-dark[aria-disabled=\"true\"] {\n  background-color: var(--grey-light); /* NEW: #ECECEC */\n}\n\n.aria-disabled\\:bg-transparent[aria-disabled=\"true\"] {\n  background-color: transparent;\n}\n\n.aria-disabled\\:text-light[aria-disabled=\"true\"] {\n  color: var(--grey-dark); /* NEW: #7A7B7A */\n}\n\n.aria-disabled\\:text-lightest[aria-disabled=\"true\"] {\n  color: var(--grey-dark); /* NEW: #7A7B7A */\n}\n\n.aria-disabled\\:line-through[aria-disabled=\"true\"] {\n  text-decoration-line: line-through;\n}\n\n.aria-disabled\\:shadow-none[aria-disabled=\"true\"] {\n  --tw-shadow: 0 0 #0000;\n  --tw-shadow-colored: 0 0 #0000;\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.aria-current-page\\:bg-darker[aria-current=\"page\"] {\n  background-color: var(--grey-dark); /* NEW: #7A7B7A */\n}\n\n/* ============================================\n   AFTER PSEUDO-ELEMENTS\n   ============================================ */\n\n.after\\:absolute::after {\n  position: absolute;\n}\n\n.after\\:inset-0::after {\n  inset: 0rem;\n}\n\n.after\\:inset-x-0::after {\n  left: 0rem;\n  right: 0rem;\n}\n\n.after\\:bottom-0::after {\n  bottom: 0rem;\n}\n\n.after\\:left-16::after {\n  left: 1rem;\n}\n\n.after\\:right-16::after {\n  right: 1rem;\n}\n\n.after\\:z-10::after {\n  z-index: 10;\n}\n\n.after\\:rounded-lg::after {\n  border-radius: 16px;\n}\n\n.after\\:rounded-t-lg::after {\n  border-top-left-radius: 16px;\n  border-top-right-radius: 16px;\n}\n\n.after\\:border-3::after {\n  border-width: 3px;\n}\n\n.after\\:border-b-2::after {\n  border-bottom-width: 2px;\n}\n\n.after\\:\\!border-transparent::after {\n  border-color: transparent !important;\n}\n\n.after\\:border-accent::after {\n  border-color: var(--brand-green); /* NEW: #00FF9D */\n}\n\n.after\\:border-accent-dark::after {\n  border-color: var(--brand-green-dark); /* NEW: #00FF9D */\n}\n\n.after\\:border-soft::after {\n  border-color: var(--grey-dark);\n}\n\n.after\\:border-softest::after {\n  border-color: var(--grey-light);\n}\n\n.after\\:opacity-0::after {\n  opacity: 0;\n}\n\n.after\\:content-\\[\\'\\'\\]::after {\n  --tw-content: '';\n  content: var(--tw-content);\n}\n\n.hover\\:text-accent:hover {\n  color: var(--brand-green);\n}\n\n.hover\\:after\\:\\border-accent:hover::after {\n  border-color: var(--brand-green);\n}\n\n.hover\\:after\\:\\!border-transparent:hover::after {\n  border-color: transparent !important;\n}\n\n.hover\\:after\\:opacity-100:hover::after {\n  opacity: 1;\n}\n\n.focus-visible\\:after\\:opacity-100:focus-visible::after {\n  opacity: 1;\n}\n\n.aria-disabled\\:after\\:\\!border-transparent[aria-disabled=\"true\"]::after {\n  border-color: transparent !important;\n}\n\n.aria-disabled\\:after\\:\\!border-0[aria-disabled=\"true\"]::after {\n  border-width: 0 !important;\n}\n\n.hover\\:before\\:opacity-100:hover::before {\n  opacity: 1;\n}\n\n/* ============================================\n   CTA BUTTON STYLES\n   ============================================ */\n\n/* CTA link style */\n.cta-link {\n  font-family: 'IBM Plex Mono', monospace;\n  font-size: var(--f-ui-01-fontSize);\n  color: var(--grey-dark);\n  text-decoration: none;\n  transition: color 0.3s ease;\n  display: inline-flex;\n  align-items: center;\n  gap: 0.25rem;\n}\n\n.cta-link:hover {\n  color: var(--brand-green);\n}\n\n/* CTA brand link style - always green */\n.cta-link-brand {\n  font-family: 'IBM Plex Mono', monospace;\n  font-size: var(--f-ui-02-fontSize);\n  color: var(--brand-green);\n  text-decoration: none;\n  transition: color 0.3s ease;\n  display: inline-flex;\n  align-items: center;\n  gap: 0.5rem;\n}\n\n.cta-link-brand:hover {\n  color: var(--brand-green-dark);\n}\n\n@media (min-width: 750px) {\n  .md\\:w-full {\n    width: 100%;\n  }\n\n  .md\\:flex {\n    display: flex;\n  }\n}";
 var EdsButtonStyle0 = edsButtonCss;
 
 /**
@@ -3429,7 +3429,10 @@ class EdsButton {
     constructor(hostRef) {
         registerInstance(this, hostRef);
         this.button = cva([
-            'relative items-center py-12 cursor-pointer',
+            'relative items-center cursor-pointer',
+            // Brand-green focus-visible outline (rules live in eds-button.css);
+            // without this class keyboard focus falls back to the browser ring.
+            'effect-focus',
             'aria-disabled:text-lightest aria-disabled:bg-dark aria-disabled:cursor-not-allowed',
             'disabled:text-lightest disabled:bg-dark disabled:cursor-not-allowed'
         ], {
@@ -3441,6 +3444,10 @@ class EdsButton {
                     ghost: '',
                     ghostInverse: 'text-inverse',
                     brand: 'bg-accent text-default hover:bg-strongest hover:text-inverse aria-disabled:shadow-none',
+                    // Light-green tint with brand-black text — an on-brand "unselected"
+                    // state (e.g. eds-rating / eds-nps) that brightens to solid brand on
+                    // hover/selection. Lives start-to-finish in the brand palette.
+                    brandLight: 'bg-brand-light text-default hover:bg-accent hover:text-default aria-disabled:shadow-none',
                     brandInverse: 'bg-accent text-default hover:bg-inverse hover:text-default aria-disabled:shadow-none',
                     neutral: 'bg-darker after:border-softest bg-inverse hover:bg-dark hover:text-light text-inverse aria-disabled:shadow-none',
                     cta: [
@@ -3459,8 +3466,8 @@ class EdsButton {
                     true: ''
                 },
                 size: {
-                    small: 'h-36 f-ui-02',
-                    large: 'h-44 f-ui-01'
+                    small: 'min-h-36 f-ui-02 py-8',
+                    large: 'min-h-44 f-ui-01 py-12'
                 },
                 hasIcon: {
                     true: '',
@@ -3633,7 +3640,7 @@ class EdsButton {
         const loaderBottomColor = this.intent === 'primary' || this.intent === 'secondaryInverse'
             ? '#FFFFFF' // White for dark backgrounds
             : '#07140D'; // Brand-black for light backgrounds (secondary, brand, etc.)
-        return (hAsync(Host, { key: '6f955c89a01cf823ff8fc34bfa92df85a3aa8327' }, hAsync(ElementType, { key: 'fabf5842d4c9583c7ff9e4415697c62c111dce68', tabindex: isInteractive ? '0' : '-1', "aria-label": this.label ? undefined : this.ariaLabel, "aria-disabled": this.disabled || this.loading ? 'true' : undefined, "aria-busy": this.loading ? 'true' : undefined, disabled: this.elementType === 'button' ? this.disabled || this.loading : undefined, role: this.elementType === 'a' ? 'button' : undefined, class: `${classes || ''}`, onClick: (event) => this.handleClick(event), onKeyDown: (event) => this.handleKeyDown(event) }, this.label && (hAsync("span", { key: '746feb603fd83b54bab92e62ab9aefcd6a232f54', class: `${this.loading ? 'opacity-0' : ''} ${this.icon && (this.intent !== 'cta' && this.intent !== 'cta-brand') ? (this.iconPos === 'right' ? (this.size === 'large' ? 'pr-4' : 'pr-2') : (this.size === 'large' ? 'pl-4' : 'pl-2')) : ''}`, "aria-hidden": this.loading ? 'true' : undefined }, this.label)), this.loading && (hAsync("span", { key: 'e0f54e409080548687304bae2f5d3e1b56863318', class: "absolute inset-0 flex items-center justify-center", "aria-hidden": "true" }, hAsync("span", { key: 'c2472f5d2730ef850a076471fa00c9db91496db7', class: "loader", style: {
+        return (hAsync(Host, { key: '263f3fd25c17d5f9d8ddcfcc57848d6c8e729994' }, hAsync(ElementType, { key: '9c9f68e332ca6fe14387fc239e880069596b0072', tabindex: isInteractive ? '0' : '-1', "aria-label": this.label ? undefined : this.ariaLabel, "aria-disabled": this.disabled || this.loading ? 'true' : undefined, "aria-busy": this.loading ? 'true' : undefined, disabled: this.elementType === 'button' ? this.disabled || this.loading : undefined, role: this.elementType === 'a' ? 'button' : undefined, class: `${classes || ''}`, onClick: (event) => this.handleClick(event), onKeyDown: (event) => this.handleKeyDown(event) }, this.label && (hAsync("span", { key: '285a0b07089eb7ebab3bd439000ea89c454164d0', class: `${this.loading ? 'opacity-0' : ''} ${this.icon && (this.intent !== 'cta' && this.intent !== 'cta-brand') ? (this.iconPos === 'right' ? (this.size === 'large' ? 'pr-4' : 'pr-2') : (this.size === 'large' ? 'pl-4' : 'pl-2')) : ''}`, "aria-hidden": this.loading ? 'true' : undefined }, this.label)), this.loading && (hAsync("span", { key: '36da873de3be79f2cfc3e4851dadd953e17109dc', class: "absolute inset-0 flex items-center justify-center", "aria-hidden": "true" }, hAsync("span", { key: '961913b2c22e6bd803c6639e617129843c877bfe', class: "loader", style: {
                 border: `3px solid ${loaderBorderColor}`,
                 borderBottomColor: loaderBottomColor
             } }))), this.icon ? (hAsync("eds-icon-wrapper", { name: this.icon, size: 20, "aria-hidden": "true" })) : null)));
@@ -3728,7 +3735,7 @@ class EdsCardApp {
     }; }
 }
 
-const edsCardCtaCss = ":host{display:flex;height:100%}.cta-container{height:auto;text-align:center;border-radius:16px;padding:1.5rem;position:relative;overflow:hidden;display:flex;flex-direction:column;flex-grow:1;justify-content:center}.cta-container-default{background-color:var(--brand-black);border:1px solid rgba(0, 255, 157, 0.25)}.cta-container-default .cta-title{color:var(--white)}.cta-container-default .cta-description{color:var(--grey-light)}.cta-container-default .cta-link{color:var(--grey-dark)}.cta-container-inverse{background-color:var(--white);border:1px solid rgba(0, 255, 157, 0.15)}.cta-container-inverse .cta-title{color:var(--brand-black)}.cta-container-inverse .cta-description{color:var(--grey-dark)}.cta-container-inverse .cta-link{color:var(--grey-dark)}.cta-container::before{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle at center, rgba(0, 255, 157, 0.1) 0%, transparent 50%);animation:rotate 20s linear infinite;pointer-events:none}@keyframes rotate{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.cta-content{position:relative;z-index:1;width:100%}.cta-title{font-family:'Inter', var(--f-heading-fontFamily);font-weight:300;font-size:clamp(1.5rem, 4vw, 2rem);letter-spacing:-0.02em;margin-bottom:1rem;line-height:1.2}.cta-description{font-family:'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;font-size:1rem;margin:0 0 1.5rem;line-height:1.6}.cta-actions{display:flex;gap:1rem;justify-content:center;margin-bottom:1.5rem;flex-wrap:wrap}.cta-links{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}@media (max-width: 768px){.cta-container{padding:1.5rem}.cta-title{font-size:1.25rem}.cta-description{font-size:0.875rem;margin-bottom:1rem}.cta-actions{gap:0.75rem;margin-bottom:1rem}.cta-links{gap:0.75rem}}";
+const edsCardCtaCss = ":host{display:flex;height:100%}.cta-container{height:auto;text-align:center;border-radius:16px;padding:1.5rem;position:relative;overflow:hidden;display:flex;flex-direction:column;flex-grow:1;justify-content:flex-start}.cta-container-default{background-color:var(--brand-black);border:1px solid rgba(0, 255, 157, 0.25)}.cta-container-default .cta-title{color:var(--white)}.cta-container-default .cta-description{color:var(--grey-light)}.cta-container-default .cta-link{color:var(--grey-dark)}.cta-container-inverse{background-color:var(--white);border:1px solid rgba(0, 255, 157, 0.15)}.cta-container-inverse .cta-title{color:var(--brand-black)}.cta-container-inverse .cta-description{color:var(--grey-dark)}.cta-container-inverse .cta-link{color:var(--grey-dark)}.cta-container::before{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle at center, rgba(0, 255, 157, 0.1) 0%, transparent 50%);animation:rotate 20s linear infinite;pointer-events:none}@keyframes rotate{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.cta-content{position:relative;z-index:1;width:100%;flex-grow:1;display:flex;flex-direction:column}.cta-title{font-family:'Inter', var(--f-heading-fontFamily);font-weight:300;font-size:clamp(1.5rem, 4vw, 2rem);letter-spacing:-0.02em;margin-bottom:1rem;line-height:1.2}.cta-description{font-family:'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;font-size:1rem;margin:0 0 1.5rem;line-height:1.6}.cta-actions{display:flex;gap:1rem;justify-content:center;margin-bottom:1.5rem;flex-wrap:wrap;margin-top:auto}.cta-links{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}@media (max-width: 768px){.cta-container{padding:1.5rem}.cta-title{font-size:1.25rem}.cta-description{font-size:0.875rem;margin-bottom:1rem}.cta-actions{gap:0.75rem;margin-bottom:1rem}.cta-links{gap:0.75rem}}";
 var EdsCardCtaStyle0 = edsCardCtaCss;
 
 /**
@@ -3782,7 +3789,7 @@ class EdsCardCta {
         const primaryButtonIntent = this.variant === 'default' ? 'brandInverse' : 'brand';
         const secondaryButtonIntent = this.variant === 'default' ? 'secondaryInverse' : 'secondary';
         const linkIntent = this.variant === 'default' ? 'cta' : 'underline';
-        return (hAsync("div", { key: 'ee2163e6096ad05dc55ac40c6626236723a23b72', class: containerClasses }, hAsync("div", { key: 'f51481133015ef5eafce48bab525cf166c000e3a', class: "cta-content" }, hAsync("h2", { key: '577441d8bc7cb4c906408faf995e106ef2779e8b', class: "cta-title", innerHTML: this.title }), hAsync("p", { key: 'b8cbcf891b95f82c3dd57f1db9335f55c1d7162c', class: "cta-description" }, this.description), hAsync("div", { key: 'f167262a521b9e15176a4fc65e3e45a8cf24feb1', class: "cta-actions" }, hAsync("eds-button", { key: 'f2c092d340996c87864677f94d979fe6317ef6d7', label: this.primaryButtonText, intent: primaryButtonIntent, icon: "arrow-right", "icon-pos": "right", size: "large", triggerClick: this.handlePrimaryClick }), this.secondaryButtonText && (hAsync("eds-button", { key: 'de0fe98dab48b2ab4b78a637915df48c930c4b54', label: this.secondaryButtonText, intent: secondaryButtonIntent, size: "large", triggerClick: this.handleSecondaryClick }))), this.parsedLinks && this.parsedLinks.length > 0 && (hAsync("div", { key: '842a6e794364fb50829ad422fc7699527b17e918', class: "cta-links" }, this.parsedLinks.map((link, index) => (hAsync("eds-link", { key: index, label: link.label, url: link.url, intent: linkIntent }))))))));
+        return (hAsync("div", { key: 'ee2163e6096ad05dc55ac40c6626236723a23b72', class: containerClasses }, hAsync("div", { key: 'f51481133015ef5eafce48bab525cf166c000e3a', class: "cta-content" }, hAsync("h2", { key: '577441d8bc7cb4c906408faf995e106ef2779e8b', class: "cta-title", innerHTML: this.title }), hAsync("p", { key: 'b8cbcf891b95f82c3dd57f1db9335f55c1d7162c', class: "cta-description" }, this.description), hAsync("div", { key: 'f167262a521b9e15176a4fc65e3e45a8cf24feb1', class: "cta-actions" }, hAsync("slot", { key: 'c114de9b72bf56a2bda67d21aab0a1a24efba2e4', name: "actions" }, hAsync("eds-button", { key: '75c4508fad3377ae1788bca7cda5f8315c8301a3', label: this.primaryButtonText, intent: primaryButtonIntent, icon: "arrow-right", "icon-pos": "right", size: "large", triggerClick: this.handlePrimaryClick }), this.secondaryButtonText && (hAsync("eds-button", { key: '2c6de6b1032c62619b7225d3f7cbc04617fca465', label: this.secondaryButtonText, intent: secondaryButtonIntent, size: "large", triggerClick: this.handleSecondaryClick })))), this.parsedLinks && this.parsedLinks.length > 0 && (hAsync("div", { key: 'a78f81632c85cb729d738b0bb533d260bc7e3727', class: "cta-links" }, this.parsedLinks.map((link, index) => (hAsync("eds-link", { key: index, label: link.label, url: link.url, intent: linkIntent }))))))));
     }
     get el() { return getElement(this); }
     static get style() { return EdsCardCtaStyle0; }
@@ -3831,7 +3838,7 @@ class EdsCardDesc {
         return this.truncate && this.truncateLines ? `line-clamp-${this.truncateLines}` : '';
     }
     render() {
-        return (hAsync("p", { key: 'c018c6b42e709c9e5df23ba9a999955ee4da1fdd', class: `f-body-02 ${this.intent === 'secondary' ? 'text-inverse' : 'text-default'}` }, hAsync("span", { key: 'bcfb43e3940a31dc4c0ec18904e4448eb27d0580', class: this.getTruncateClass() }, this.description)));
+        return (hAsync("p", { key: 'd7d9f5d40d82700388753a165a998574bd69e674', class: `f-body-02 ${this.intent === 'secondary' ? 'text-inverse' : 'text-default'}` }, hAsync("span", { key: 'bff2551896e726ce02a78b448a0e3f2a3df0c697', class: this.getTruncateClass() }, this.description)));
     }
     static get style() { return EdsCardDescStyle0; }
     static get cmpMeta() { return {
@@ -3878,7 +3885,7 @@ class EdsCardFeature {
             'feature-card',
             `feature-card-${this.variant}`
         ].join(' ');
-        return (hAsync("div", { key: '315904b024e86403b00c9f0e3ebb93dafba08fa8', class: cardClasses }, this.icon && (hAsync("div", { key: 'e0891b38e8321130471ae1422c96fbfe7662b01f', class: "feature-icon" }, hAsync("eds-icon-wrapper", { key: '768b355daebf53d69a54166525c193505dc44d67', name: this.icon, size: 24 }))), hAsync("h3", { key: 'e2486793198e51e518f24beab609a3d0186902d4', class: "feature-title" }, this.title), hAsync("p", { key: '4d66d673b5733c96312cde5e1c3fd64cced5d95a', class: "feature-description" }, this.description), this.url && (hAsync("eds-link", { key: 'e9123234265f259fb9b61172f2e79c7aba5f82b4', label: this.linkText, url: this.url, intent: "cta", icon: "arrow-right", "icon-pos": "right" }))));
+        return (hAsync("div", { key: 'f76c056bbca7b38892cdecf56291fe3882c9e3bb', class: cardClasses }, this.icon && (hAsync("div", { key: '9e22a5f6c5e30b55c4bac84f5f11f773b1b37ab9', class: "feature-icon" }, hAsync("eds-icon-wrapper", { key: '64154c38f3655cb55f14c2963a62ead699d8a533', name: this.icon, size: 24 }))), hAsync("h3", { key: '99ed95a90796dbb6baa3f73cb2830fcd0954328c', class: "feature-title" }, this.title), hAsync("p", { key: 'f91109a10f62a58d8b650987fbbf1a5a4f68beaa', class: "feature-description" }, this.description), this.url && (hAsync("eds-link", { key: 'b94b57e5385da9db54a3767d0413349000add755', label: this.linkText, url: this.url, intent: "cta", icon: "arrow-right", "icon-pos": "right" }))));
     }
     get el() { return getElement(this); }
     static get style() { return EdsCardFeatureStyle0; }
@@ -3989,7 +3996,7 @@ class EdsCardGeneric {
         this.isHovered = false;
     }
     render() {
-        return (hAsync("article", { key: 'eb4b42dccca0fb46bc8e51e1b6873e118796647b', class: this.articleClasses(), onClick: this.url ? () => this.handleClick() : undefined, onMouseEnter: this.url ? () => this.handleMouseEnter() : undefined, onMouseLeave: this.url ? () => this.handleMouseLeave() : undefined }, this.icon && (hAsync("div", { key: '229f7daab8d8560092eb94e664c73c306b2fec19', class: "card-icon-wrapper" }, hAsync("eds-icon-wrapper", { key: 'c4b76bdff72dcbe7d98a7dfea71ca8693c00094e', name: this.icon, size: 32 }))), hAsync("div", { key: '45d3a9d83cf92137485bae5248c55edb56c58671', class: "p-12 flex flex-col grow" }, this.parsedTags && this.parsedTags.length > 0 && (hAsync("div", { key: '101676ed06f29e985c6bf11620a56660360ace57', class: "flex mb-12 gap-x-4" }, this.parsedTags.map((tag, index) => (hAsync("eds-tag", { key: index, intent: tag.intent, label: tag.label, size: tag.size }))))), hAsync("eds-card-title", { key: 'c901580eca3a3b8ce4c26e1c9ce5d0f9b7a11ed6', title: this.title, url: this.url, intent: this.intent, size: this.titleSize }), this.description && (hAsync("div", { key: '618be209087536eee2fdfd3eaa1595c6fe6d0176', class: "mt-8" }, this.description && (hAsync("eds-card-desc", { key: '1aa3ea97c4371ea7510ad47e364cea27e1de0482', "truncate-lines": "3", description: this.description, intent: this.intent })))), hAsync("slot", { key: '3086eeeeb29bb82d927ab82e6ce98664118b0193', name: "card" }), this.url && (hAsync("div", { key: 'f1f73a07002f7d82daa0b68b15d7c5cddba9c730', class: `flex items-center justify-between mt-auto pt-16 ${this.getLearnMoreColor()}` }, hAsync("span", { key: '86fd1e428f6553b74aa634359fad7ba3ce590844', class: "f-ui-01" }, "Learn more"), hAsync("eds-icon-wrapper", { key: 'f955e10355e2726052cd2d34d888ea0effd2b362', name: this.isHovered ? 'arrow-right' : 'arrow-up-right', size: 32 }))))));
+        return (hAsync("article", { key: '6efb0c2c0c3d196b9759307bb98f4bf1e12504d5', class: this.articleClasses(), onClick: this.url ? () => this.handleClick() : undefined, onMouseEnter: this.url ? () => this.handleMouseEnter() : undefined, onMouseLeave: this.url ? () => this.handleMouseLeave() : undefined }, this.icon && (hAsync("div", { key: '9c29cae822923b524668da65f3e341f9626d7e95', class: "card-icon-wrapper" }, hAsync("eds-icon-wrapper", { key: '104a3551d3d8b910528dd43e8a12494faf4764a0', name: this.icon, size: 32 }))), hAsync("div", { key: 'cc9d326aa6e55d1ed26b73f46d5fbb8087d55bf0', class: "p-12 flex flex-col grow" }, this.parsedTags && this.parsedTags.length > 0 && (hAsync("div", { key: 'f740e184ec400d6083d04e4fa99259aa061c5dbf', class: "flex mb-12 gap-x-4" }, this.parsedTags.map((tag, index) => (hAsync("eds-tag", { key: index, intent: tag.intent, label: tag.label, size: tag.size }))))), hAsync("eds-card-title", { key: 'e263ce9bd116857648439bf9f356fc110e048547', title: this.title, url: this.url, intent: this.intent, size: this.titleSize }), this.description && (hAsync("div", { key: 'aa6687dc61c548dd52e2d2f3eb9598f85c2af0a5', class: "mt-8" }, this.description && (hAsync("eds-card-desc", { key: '8b82f70b5dc513396d08affc4958d9c1040583d6', "truncate-lines": "3", description: this.description, intent: this.intent })))), hAsync("slot", { key: 'ff4d0ba6184b01b80e44c78a7cccec124f2b1706', name: "card" }), this.url && (hAsync("div", { key: '889b5fbaf026df0e826626020ff201d06f047cc8', class: `flex items-center justify-between mt-auto pt-16 ${this.getLearnMoreColor()}` }, hAsync("span", { key: '3a5b5d603a7f3d852b5e92ba57f7214f7b9754ec', class: "f-ui-01" }, "Learn more"), hAsync("eds-icon-wrapper", { key: 'de15571bd4892f72646c205b14105f328d5a596d', name: this.isHovered ? 'arrow-right' : 'arrow-up-right', size: 32 }))))));
     }
     get el() { return getElement(this); }
     static get style() { return EdsCardGenericStyle0; }
@@ -4064,7 +4071,7 @@ class EdsCardHero {
             `hero-card-${this.variant}`,
             this.url ? 'hero-card-clickable' : ''
         ].filter(Boolean).join(' ');
-        return (hAsync("div", { key: '8f7c9c98becb22586f308b0065c3f9cd515a7860', class: cardClasses, onClick: () => this.handleClick() }, hAsync("div", { key: '6d99fd528b9611573a5ad3548e04914f532cfa21', class: "card-category" }, this.category), hAsync("div", { key: 'f117842619c7fa91b088a72d3e5405843f9b0b3f', class: "card-title" }, this.title), this.description && (hAsync("div", { key: '25a110fe2f58cb77051a8a5b37ee43e616e516fd', class: "card-description" }, this.description)), this.parsedTags && this.parsedTags.length > 0 && (hAsync("div", { key: 'd0ef732bf246460affb697d71496ae5ee284ff48', class: "card-tags" }, this.parsedTags.map((tag, index) => (hAsync("span", { key: index, class: "card-tag" }, tag.label)))))));
+        return (hAsync("div", { key: 'c92f2acc8065b4142b28ca213abbb646e61f44fc', class: cardClasses, onClick: () => this.handleClick() }, hAsync("div", { key: '38b8ec832d05a4891646ac31f24d32f62c5ac2e1', class: "card-category" }, this.category), hAsync("div", { key: 'd356e4651ed9d136c72c519ecb9b484570c9b3be', class: "card-title" }, this.title), this.description && (hAsync("div", { key: '52afdf7988667f73d8725e6a5f5b7816d4b38b30', class: "card-description" }, this.description)), this.parsedTags && this.parsedTags.length > 0 && (hAsync("div", { key: 'a50fb41278d3b98da7054e0bee52d2a98ab5d8f3', class: "card-tags" }, this.parsedTags.map((tag, index) => (hAsync("span", { key: index, class: "card-tag" }, tag.label)))))));
     }
     get el() { return getElement(this); }
     static get style() { return EdsCardHeroStyle0; }
@@ -4129,7 +4136,7 @@ class EdsCardStat {
             `stat-card-${this.variant}`,
             this.url ? 'stat-card-clickable' : ''
         ].filter(Boolean).join(' ');
-        const content = (hAsync("div", { key: '9934fb7c9f9014293fc4190e83b658151c8ce5a1', class: cardClasses, onClick: () => this.handleClick() }, hAsync("div", { key: '22b26775310db09da96fe0d793362ff8691da554', class: "stat-number" }, this.number), hAsync("div", { key: '59e5a6f0851ac2d133cdfa7fdbb160401c60ba92', class: "stat-label" }, this.label), this.description && (hAsync("div", { key: '916007f86e7de06b8e7cec79fc92b422a2c66db0', class: "stat-description" }, this.description))));
+        const content = (hAsync("div", { key: 'f1dadeadd1d893b7a33aa92772baf7245954f6e7', class: cardClasses, onClick: () => this.handleClick() }, hAsync("div", { key: '6adb8cc68740cd2dabf0bacf0af446e1499171a8', class: "stat-number" }, this.number), hAsync("div", { key: 'adc7a8ffd44bceda51fcb98f68cfc8d7e454db5f', class: "stat-label" }, this.label), this.description && (hAsync("div", { key: 'f70549244277e2c08c7bd94a1d297c00655faff5', class: "stat-description" }, this.description))));
         return content;
     }
     get el() { return getElement(this); }
@@ -6691,7 +6698,7 @@ class EdsCodeBlock {
         return this.code; // Fallback if language is not provided or unsupported
     }
     render() {
-        return (hAsync("div", { key: '16c785c0fbac538fb0e20c42ed613f5211bea089', class: "relative bg-strongest rounded-sm" }, hAsync("div", { key: '24967e8c714dc62c2366cae6bf6a19566fdeedbf', class: "text-inverse flex justify-between items-center p-8" }, this.language ? (hAsync("span", { class: "f-ui-03" }, this.language.toUpperCase())) : (hAsync("pre", { class: "bg-stronger pl-8", role: "region", "aria-label": "Code block without language" }, hAsync("code", { innerHTML: this.getHighlightedCode() }))), hAsync("span", { key: 'd84c547a7fda762a51279462e6c33642d3ed93b1', "aria-hidden": "true", class: "w-20 h-20 mt-8" }, hAsync("eds-icon-wrapper", { key: 'e784206acb815fdb2df3f7013b32e18b42f47e0d', name: this.copied ? 'checkmark-filled' : 'copy', onClick: () => this.copyToClipboard() })), hAsync("span", { key: '8f68b5adda295c370cfff19602cb8cc140d9a10d', class: "sr-only" }, "Copy Code")), this.language && (hAsync("pre", { key: 'a3c42360f4a5026d8e6f5328f5ed5d8ca724c3ca', class: `language-${this.language} bg-stronger pl-8 pb-8`, role: "region", "aria-label": `Code block in ${this.language}` }, hAsync("code", { key: '96ce7f1cf1cee401bd1a90368c56934116d97d29', innerHTML: this.getHighlightedCode() })))));
+        return (hAsync("div", { key: '4d73fa52c489b6995dd8a6d83c05e323bb1f5431', class: "relative bg-strongest rounded-sm" }, hAsync("div", { key: 'c0df3237009310833b417f5ede5b7c204f2752bc', class: "text-inverse flex justify-between items-center p-8" }, this.language ? (hAsync("span", { class: "f-ui-03" }, this.language.toUpperCase())) : (hAsync("pre", { class: "bg-stronger pl-8", role: "region", "aria-label": "Code block without language" }, hAsync("code", { innerHTML: this.getHighlightedCode() }))), hAsync("span", { key: '016505a0749baaa52c6e4aa77f00b4da31e7ec45', "aria-hidden": "true", class: "w-20 h-20 mt-8" }, hAsync("eds-icon-wrapper", { key: '21474f1b28af95251aca639c349aaac489d8519b', name: this.copied ? 'checkmark-filled' : 'copy', onClick: () => this.copyToClipboard() })), hAsync("span", { key: '64450529ad3cf3dab7e74f8455307cdb3298bbc4', class: "sr-only" }, "Copy Code")), this.language && (hAsync("pre", { key: 'affcb4719ef29d7ed9ed676eab975c98ceca31fa', class: `language-${this.language} bg-stronger pl-8 pb-8`, role: "region", "aria-label": `Code block in ${this.language}` }, hAsync("code", { key: '43fa1b80c2e02233076c4da15a5aa04f0b49bfc3', innerHTML: this.getHighlightedCode() })))));
     }
     get el() { return getElement(this); }
     static get style() { return EdsCodeBlockStyle0; }
@@ -6739,7 +6746,7 @@ class EdsCookiesPreference {
         }
     }
     render() {
-        return (hAsync("div", { key: '3926e6e4972c901880f57859280330ad315dc263' }, hAsync("eds-link", { key: '8c513565cb94589c1d441aa4b0badf79ab464169', size: "small", intent: this.intent, label: this.buttonText, onClick: () => this.toggleCookiesPopup() }), this.showMatomoNotice && hAsync("eds-matomo-notice", { "force-show": true, key: this.noticeKey })));
+        return (hAsync("div", { key: '0a1f75fe95820dd8f994193f86b52b684f5fd240' }, hAsync("eds-link", { key: 'd3b5740fa53b30a39296b23cd95da1ad2d8d730d', size: "small", intent: this.intent, label: this.buttonText, onClick: () => this.toggleCookiesPopup() }), this.showMatomoNotice && hAsync("eds-matomo-notice", { "force-show": true, key: this.noticeKey })));
     }
     static get style() { return EdsCookiesPreferenceStyle0; }
     static get cmpMeta() { return {
@@ -6797,6 +6804,13 @@ class EdsDropdown {
             if (this.isOpen) {
                 // refresh focusables each open in case slot changed
                 this.focusableItems = Array.from(((_a = this.panelEl) === null || _a === void 0 ? void 0 : _a.querySelectorAll('a, button, [role="menuitem"]')) || []);
+                // The panel declares role="menu"; slotted links/buttons need
+                // role="menuitem" or screen readers announce an empty menu.
+                this.focusableItems.forEach((item) => {
+                    if (!item.hasAttribute('role')) {
+                        item.setAttribute('role', 'menuitem');
+                    }
+                });
                 this.focusIndex = this.focusableItems.length ? 0 : -1;
                 this.focusItem();
             }
@@ -6835,7 +6849,6 @@ class EdsDropdown {
         const path = (e.composedPath && e.composedPath()) || [];
         if (!path.includes(this.host)) {
             this.closeDropdown();
-            this.dropdown.emit({ expanded: false });
         }
     }
     /**
@@ -6843,12 +6856,22 @@ class EdsDropdown {
      * @param {KeyboardEvent} event - The keyboard event.
      */
     handleKeyDown(event) {
+        var _a;
         if (this.isOpen) {
             const key = event.key;
             switch (key) {
                 case 'Tab':
+                    // ARIA menu pattern: Tab does not walk the items — it closes
+                    // the menu and lets focus continue to the next element on the
+                    // page (no preventDefault on purpose).
+                    this.closeDropdown();
+                    break;
+                case 'Escape':
+                    // Close and hand focus back to the trigger so keyboard users
+                    // can back out without committing to a Tab.
+                    event.preventDefault();
                     this.closeDropdown();
-                    this.dropdown.emit({ expanded: false });
+                    (_a = this.buttonEl) === null || _a === void 0 ? void 0 : _a.focus();
                     break;
                 case 'ArrowUp':
                     event.preventDefault();
@@ -6860,6 +6883,16 @@ class EdsDropdown {
                     this.focusIndex = (this.focusIndex + 1) % this.focusableItems.length;
                     this.focusItem();
                     break;
+                case 'Home':
+                    event.preventDefault();
+                    this.focusIndex = this.focusableItems.length ? 0 : -1;
+                    this.focusItem();
+                    break;
+                case 'End':
+                    event.preventDefault();
+                    this.focusIndex = this.focusableItems.length - 1;
+                    this.focusItem();
+                    break;
             }
         }
     }
@@ -6927,13 +6960,13 @@ class EdsDropdown {
      * @returns {JSX.Element} The rendered dropdown component.
      */
     render() {
-        return (hAsync("div", { key: '52f349afae529afc12461642abf17fcf4870ca6f', class: "z-focus relative", ref: (el) => (this.dropdownContent = el) }, hAsync("eds-button", { key: 'ed1f3366306f7e3d708473e14fc8de5723dba03f', label: this.label, "aria-label": this.ariaLabel, icon: this.icon, iconSmall: false, intent: this.intent, onClick: this.handleClick, "aria-expanded": this.isOpen.toString(), "aria-haspopup": "menu", size: "small", pill: true }), hAsync("nav", { key: 'fb9a559a97ad866b62d4cb2a0f7f828548e24c75', ref: (el) => (this.panelEl = el), role: "menu", class: {
+        return (hAsync("div", { key: '1ce4926a15ac67d653ef03de877e64be83f61b4e', class: "z-focus relative", ref: (el) => (this.dropdownContent = el) }, hAsync("eds-button", { key: '8b45fc57c018dd620701b2b9db5403c30f88a6ed', ref: (el) => (this.buttonEl = el), label: this.label, "aria-label": this.ariaLabel, icon: this.icon, iconSmall: false, intent: this.intent, onClick: this.handleClick, "aria-expanded": this.isOpen.toString(), "aria-haspopup": "menu", size: "small", pill: true }), hAsync("nav", { key: '35854d55ea595e35513348bf36145794b2c57007', ref: (el) => (this.panelEl = el), role: "menu", class: {
                 'shadow-small bg-inverse border-softest z-10 z-on-top absolute top-full mt-4 flex flex-col gap-y-4 border-2 p-8': true,
                 'left-4': this.dropdownPos === 'left' && this.dropdownOffset,
                 'left-0': this.dropdownPos === 'left' && !this.dropdownOffset,
                 'right-4': this.dropdownPos === 'right' && this.dropdownOffset,
                 'right-0': this.dropdownPos === 'right' && !this.dropdownOffset
-            }, style: { display: this.isOpen ? 'block' : 'none' }, "aria-label": "Dropdown", "aria-hidden": !this.isOpen }, hAsync("slot", { key: '6205de74b039cb784bf9b104edfd6f7a03cc5ed1' }))));
+            }, style: { display: this.isOpen ? 'block' : 'none' }, "aria-label": "Dropdown", "aria-hidden": !this.isOpen }, hAsync("slot", { key: 'd6b153bb5968fa958be4d96d60cce774a9a0713c' }))));
     }
     get host() { return getElement(this); }
     static get style() { return EdsDropdownStyle0; }
@@ -7017,7 +7050,7 @@ class EdsFeedback {
         const HeadingTag = this.headingLevel;
         const levelNum = this.headingLevel.replace('h', '');
         const headingClass = `f-heading-${levelNum.padStart(2, '0')} my-4`;
-        return (hAsync("div", { key: '7d01b8aef2854cfdb739553e7f43ed9516199e1e', class: "grid inline" }, hAsync(HeadingTag, { key: 'a0c4a4f93598b955e90416d50260aaa3f644615a', class: headingClass }, this.label), hAsync("p", { key: 'acb2db8fc209faf2d39622e2e858fa1e7403e1b4', class: "f-body-01 text-light" }, this.description), hAsync("eds-rating", { key: 'b0db57c9e3539a5edfecf67cc3a12dd87d74fad9', "rating-type": this.type, "rating-count": this.count }), this.selectedRating > 0 && this.parsedMappings[this.selectedRating - 1] && (hAsync("span", { key: '8d6bf62a18fdb12dddba932be9a5115396fdfd6f', class: "f-ui-04 text-lighter" }, this.parsedMappings[this.selectedRating - 1]))));
+        return (hAsync("div", { key: '5eddbd664389530e209698e5e435c853c8f50b9f', class: "grid inline" }, hAsync(HeadingTag, { key: '22d1d4a44a116f78bbfa66946d8b7a9f95779524', class: headingClass }, this.label), hAsync("p", { key: 'd3e5abefa5d0e1e32281b5088251fb9c304b8d2a', class: "f-body-01 text-light" }, this.description), hAsync("eds-rating", { key: '65f1e772ac885d20f46e147aedeb55ab2ec871fe', "rating-type": this.type, "rating-count": this.count }), this.selectedRating > 0 && this.parsedMappings[this.selectedRating - 1] && (hAsync("span", { key: 'f660ceb9889d560ec1687c6f17bdbbe6a89f90ee', class: "f-ui-04 text-lighter" }, this.parsedMappings[this.selectedRating - 1]))));
     }
     get el() { return getElement(this); }
     static get style() { return EdsFeedbackStyle0; }
@@ -7039,53 +7072,134 @@ class EdsFeedback {
     }; }
 }
 
-const edsFooterCss = "p{margin:0}footer{position:relative}.cursor-pointer{cursor:pointer}.ml-4{margin-left:0.25rem}.container{width:calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0)))));margin-right:auto;margin-left:auto}.container>*{--container-outer-gutter:0;--breakout-container-outer-gutter:0}.bg-darker{background-color:var(--grey-light)}.bg-strongest{background-color:var(--brand-black)}.border-softest{border-color:rgba(0, 0, 0, .05)}.border-inverse-softer{border-color:rgba(255, 255, 255, .15)}.border-t-2{border-top-width:2px}.pt-20{padding-top:1.25rem}.pb-28{padding-bottom:1.75rem}.grid-layout{display:grid;grid-template-columns:repeat(var(--container-grid-columns, var(--grid-columns)), 1fr);grid-gap:var(--inner-gutter)}.grid-col-span-12{--container-grid-columns:12;grid-column:span 12 / span 12}.mt-28{margin-top:1.75rem}.gap-y-12{row-gap:0.75rem}.gap-x-12{-moz-column-gap:0.75rem;column-gap:0.75rem}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-20{gap:1.25rem}.effect-focus{outline-width:3px;outline-offset:2px;outline-color:var(--brand-green)}.effect-focus:focus-visible{outline-style:solid}.focus-visible\\:rounded-xs:focus-visible{border-radius:4px}.flex{display:flex}.w-\\[54px\\]{width:54px}.ml-0{margin-left:0rem}.order-last{order:9999}.w-full{width:100%}.h-auto{height:auto}.f-ui-02{font-family:var(--f-ui-02-fontFamily);font-weight:var(--f-ui-02-fontWeight);font-size:var(--f-ui-02-fontSize);line-height:var(--f-ui-02-lineHeight);letter-spacing:var(--f-ui-02-letterSpacing)}.f-ui-04{font-family:var(--f-ui-04-fontFamily);font-weight:var(--f-ui-04-fontWeight);font-size:var(--f-ui-04-fontSize);line-height:var(--f-ui-04-lineHeight);letter-spacing:var(--f-ui-04-letterSpacing)}.text-light{color:var(--grey-light)}.text-default{color:var(--brand-black)}.text-inverse{color:var(--white)}.mt-4{margin-top:0.25rem}.mr-4{margin-right:0.25rem}.gap-12{gap:0.75rem}.inline-block{display:inline-block}.\\!no-underline{text-decoration-line:none !important}.decoration-2{text-decoration-thickness:2px}.underline-offset-4{text-underline-offset:4px}.hover\\:\\!underline:hover{text-decoration-line:underline !important}.ml-auto{margin-left:auto}.pl-12{padding-left:0.75rem}.opacity-0{opacity:0}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.transition{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.duration-75{transition-duration:75ms}@media (min-width: 750px){.md\\:pt-28{padding-top:1.75rem}}@media (min-width: 900px){.lg\\:grid-col-span-5{--container-grid-columns:5;grid-column:span 5 / span 5}.lg\\:grid-col-span-6{--container-grid-columns:6;grid-column:span 6 / span 6}.lg\\:grid-col-start-7{grid-column-start:7}.lg\\:mt-0{margin-top:0rem}.lg\\:flex-nowrap{flex-wrap:nowrap}.lg\\:order-none{order:0}.lg\\:w-auto{width:auto}}@media (min-width: 1024px){.xl\\:pb-40{padding-bottom:2.5rem}}";
+const edsFooterCss = ":host{display:block}p{margin:0}ul{list-style:none;padding:0;margin:0}.eds-footer-root{position:relative;padding:4rem 4rem 2rem;border-top:1px solid rgba(0, 0, 0, 0.06);font-family:var(--f-ui-02-fontFamily)}.eds-footer-root.theme-inverse{background-color:var(--brand-black, #000000);color:var(--grey-light, rgba(255, 255, 255, 0.7));border-top-color:rgba(255, 255, 255, 0.06)}.eds-footer-root.theme-default{background-color:var(--white, #ffffff);color:var(--grey-dark, #4b5563);border-top-color:rgba(0, 0, 0, 0.06)}.footer-container{max-width:1400px;margin:0 auto}.footer-grid{display:grid;grid-template-columns:2fr repeat(3, 1fr);gap:4rem;margin-bottom:4rem}.footer-brand-row{display:flex;align-items:center;gap:1rem}.footer-flag-link{display:inline-block;width:54px;flex-shrink:0;border-radius:4px}.footer-flag-link:focus-visible{outline:3px solid var(--brand-green);outline-offset:2px}.footer-flag-svg{height:auto;width:100%;display:block}.footer-funded{font-size:0.875rem;line-height:1.6;max-width:300px}.theme-inverse .footer-funded{color:var(--grey-dark, rgba(255, 255, 255, 0.55))}.theme-default .footer-funded{color:var(--grey-dark, #4b5563)}.footer-copyright{font-size:0.875rem;margin-top:0.75rem}.theme-inverse .footer-copyright{color:var(--grey-dark, rgba(255, 255, 255, 0.55))}.theme-default .footer-copyright{color:var(--grey-dark, #4b5563)}.footer-column-heading{font-size:0.8125rem;font-weight:500;margin:0 0 1.5rem 0}.theme-inverse .footer-column-heading{color:var(--white, #ffffff)}.theme-default .footer-column-heading{color:var(--brand-black, #111827)}.footer-column-list li{margin-bottom:0.75rem}.footer-column-list li:last-child{margin-bottom:0}.footer-link,.footer-text-item{font-size:0.875rem;text-decoration:none;transition:color 0.3s ease}.footer-link{cursor:pointer}.theme-inverse .footer-link,.theme-inverse .footer-text-item{color:var(--grey-dark, rgba(255, 255, 255, 0.55))}.theme-default .footer-link,.theme-default .footer-text-item{color:var(--grey-dark, #4b5563)}.footer-link:hover{color:var(--brand-green)}.footer-link:focus-visible{outline:2px solid var(--brand-green);outline-offset:2px;border-radius:2px}.footer-social{padding-bottom:2rem;margin-bottom:2rem}.theme-inverse .footer-social{border-bottom:1px solid rgba(255, 255, 255, 0.06)}.theme-default .footer-social{border-bottom:1px solid rgba(0, 0, 0, 0.06)}.footer-back-to-top{position:absolute;top:1.5rem;right:2rem;opacity:0;transition:opacity 75ms cubic-bezier(0.4, 0, 0.2, 1)}@media (max-width: 1200px){.footer-grid{grid-template-columns:repeat(2, 1fr);gap:3rem}}@media (max-width: 768px){.eds-footer-root{padding:3rem 2rem 2rem}.footer-grid{grid-template-columns:1fr;gap:2rem;margin-bottom:2rem}.footer-funded{max-width:none}}";
 var EdsFooterStyle0 = edsFooterCss;
 
 /**
- * `EdsFooter` is a footer component designed for the EBRAINS platform, featuring social links,
- * legal information, and an optional cookie preferences button. It includes a "Back to top"
- * button and displays an acknowledgment for Horizon Europe funding.
+ * EBRAINS-wide default link columns. Used when a consumer doesn't pass
+ * the `columns` prop. URLs are absolute so the same footer renders
+ * correctly from any app's domain (handbook.ebrains.eu, forms.ebrains.eu,
+ * design.ebrains.eu, …) — the previous eds-docs design used relative
+ * paths which only worked from design.ebrains.eu itself.
  *
- * Key Features:
- * - Social Network Links: Optionally display a section for social media links.
- * - Legal and Funding Information: Includes text for legal disclaimers and funding acknowledgments.
- * - Cookie Preferences: Optionally display a "Cookies Preferences" button.
- * - Back to Top Button: Smoothly scrolls the page back to the top when clicked.
+ * If EBRAINS adds / renames a canonical resource, change it here once
+ * and every consumer's footer updates on the next component release.
+ */
+const DEFAULT_COLUMNS = [
+    {
+        heading: 'Resources',
+        links: [
+            { label: 'Documentation', href: 'https://design.ebrains.eu/get-started/', external: true },
+            { label: 'Components', href: 'https://design.ebrains.eu/ui-components/', external: true },
+            { label: 'Foundations', href: 'https://design.ebrains.eu/foundations/', external: true },
+            { label: 'Analytics', href: 'https://design.ebrains.eu/analytics/', external: true },
+        ],
+    },
+    {
+        heading: 'Community',
+        links: [
+            { label: 'GitLab', href: 'https://gitlab.ebrains.eu/ri/tech-hub/ebrains-ui-ecosystem/', external: true },
+            { label: 'Storybook', href: 'https://storybook.design.ebrains.eu', external: true },
+            { label: 'Report Issues', href: 'https://gitlab.ebrains.eu/ri/tech-hub/ebrains-ui-ecosystem/-/issues', external: true },
+            { label: 'Contribute', href: 'https://design.ebrains.eu/get-started/contributing/', external: true },
+        ],
+    },
+    {
+        heading: 'Legal',
+        links: [
+            { label: 'MIT License' },
+            { label: 'Cookie Preferences', action: 'cookies' },
+        ],
+    },
+];
+/**
+ * `EdsFooter` is the EBRAINS-wide footer component.
+ *
+ * Renders a 4-column layout matching the eds-docs landing footer:
+ *   [ Brand (EU flag + funding text + copyright)  |  Resources  |  Community  |  Legal ]
  *
- * This component is ideal for maintaining consistent branding, legal disclaimers, and navigational elements
- * across the EBRAINS platform, with options for social links and a "Back to top" button.
+ * Defaults are designed so a consumer that writes `<eds-footer></eds-footer>`
+ * with no props gets the full canonical EBRAINS footer rendered — same
+ * brand block, same link columns, same dark theme as the eds-docs
+ * landing page. The previous minimal-strip footer is replaced; consumers
+ * that need different link content pass the `columns` prop (array or
+ * JSON-stringified array for HTML attribute use).
+ *
+ * Configurability without breakage:
+ * - All previous props remain (`social`, `variant`, `fundedBy`,
+ *   `rightsReserved`, `enableScrollTop`, `enableCookiesSettings`,
+ *   `cookiesPreferences`, `backToTopAriaLabel`). Their meanings are
+ *   preserved.
+ * - New `columns` prop is optional — omit it for the defaults.
+ * - The `enableCookiesSettings` toggle now decides whether any column
+ *   link with `action: 'cookies'` is rendered (default false; pass
+ *   true to surface the Cookie Preferences entry in the Legal column).
  */
 class EdsFooter {
     constructor(hostRef) {
         registerInstance(this, hostRef);
         this.cookies = createEvent(this, "cookies", 7);
-        /**
-         * Scrolls the page smoothly back to the top.
-         * Called when the "Back to top" button is clicked.
-         * @private
-         */
         this.backToTop = () => {
             window.scrollTo({ top: 0, behavior: 'smooth' });
         };
+        this.emitCookies = () => {
+            this.cookies.emit('toggle');
+        };
         this.social = false;
-        this.variant = 'default';
+        this.variant = 'inverse';
         this.enableScrollTop = false;
         this.fundedBy = 'EBRAINS is funded by the Horizon Europe Framework Programme.';
         this.rightsReserved = `${new Date().getFullYear()} EBRAINS. All rights reserved.`;
-        this.cookiesPreferences = 'Cookies preferences';
+        this.cookiesPreferences = 'Cookie Preferences';
         this.enableCookiesSettings = false;
         this.backToTopAriaLabel = 'Back to Top';
-        this.showMatomoNotice = false;
+        this.columns = undefined;
+        this.resolvedColumns = DEFAULT_COLUMNS;
+    }
+    componentWillLoad() {
+        this.resolvedColumns = this.parseColumns(this.columns);
+    }
+    onColumnsChange(value) {
+        this.resolvedColumns = this.parseColumns(value);
+    }
+    /**
+     * Resolve the `columns` prop to a usable array.
+     *   - undefined / null   → defaults
+     *   - JSON-parseable str → parsed array
+     *   - already an array   → used as-is
+     *   - anything else (malformed JSON, wrong shape) → defaults + console warning
+     *
+     * Defensive parsing so a typo in a Hugo template's attribute doesn't
+     * render an empty footer in production. Failure logs a warning but
+     * keeps the footer working with sensible defaults.
+     */
+    parseColumns(value) {
+        if (value === undefined || value === null || value === '')
+            return DEFAULT_COLUMNS;
+        if (Array.isArray(value))
+            return value;
+        if (typeof value === 'string') {
+            try {
+                const parsed = JSON.parse(value);
+                if (Array.isArray(parsed))
+                    return parsed;
+                console.warn('eds-footer: `columns` JSON parsed but is not an array; using defaults');
+                return DEFAULT_COLUMNS;
+            }
+            catch (e) {
+                console.warn('eds-footer: failed to parse `columns` JSON, using defaults', e);
+                return DEFAULT_COLUMNS;
+            }
+        }
+        return DEFAULT_COLUMNS;
     }
     componentDidLoad() {
         var _a;
         this.backBtn = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#toTop');
     }
     handleScroll() {
-        if (!this.backBtn) {
+        if (!this.backBtn)
             return;
-        }
         const shouldShow = window.scrollY > 100 && document.body.scrollHeight > window.innerHeight;
         this.backBtn.style.opacity = shouldShow ? '1' : '0';
         this.backBtn.style.pointerEvents = shouldShow ? 'auto' : 'none';
@@ -7095,44 +7209,59 @@ class EdsFooter {
             btn.setAttribute('tabindex', shouldShow ? '0' : '-1');
         }
     }
-    toggleCookiesConsent() {
-        this.cookies.emit('toggle');
-    }
     /**
-     * Renders the footer component with optional sections and elements,
-     * including social network links, a Horizon Europe funding acknowledgment, and
-     * legal links such as "Cookies Preferences" and copyright information.
+     * Render one link inside a column.
+     *   - `action: 'cookies'` → button-like anchor that fires the cookies event
+     *   - `href` present      → real anchor (target=_blank when `external`)
+     *   - neither             → plain text span (e.g. "MIT License")
      */
+    renderLink(link, index) {
+        if (link.action === 'cookies') {
+            if (!this.enableCookiesSettings)
+                return null;
+            return (hAsync("li", { key: `cookies-${index}` }, hAsync("a", { href: "javascript:void(0)", class: "footer-link", onClick: this.emitCookies, role: "button" }, this.cookiesPreferences || link.label)));
+        }
+        if (link.href) {
+            const external = link.external === true;
+            return (hAsync("li", { key: `${link.label}-${index}` }, hAsync("a", Object.assign({ class: "footer-link", href: link.href }, (external ? { target: '_blank', rel: 'noopener noreferrer' } : {})), link.label)));
+        }
+        return (hAsync("li", { key: `text-${index}` }, hAsync("span", { class: "footer-text-item" }, link.label)));
+    }
     render() {
         const year = new Date().getFullYear();
         const rights = this.rightsReserved || `${year} EBRAINS. All rights reserved.`;
         const isInverse = this.variant === 'inverse';
-        const footerClasses = isInverse ? 'bg-strongest text-inverse' : '';
-        const borderClasses = isInverse ? 'border-inverse-softer' : 'border-softest';
-        const textClasses = isInverse ? 'text-inverse' : 'text-default';
-        return (hAsync("footer", { key: 'ffe47afda9981e367f24d2525a5b21e96f4f3d10', class: footerClasses }, this.social ? (hAsync("div", { class: `${borderClasses} border-t-2 pt-20 md:pt-28` }, hAsync("div", { class: "container pb-20" }, hAsync("div", { class: "grid-layout" }, hAsync("div", { class: "grid-col-span-12 lg:grid-col-span-5" }, hAsync("eds-social-networks", { class: "mt-28", variant: this.variant })))))) : null, hAsync("div", { key: '2e884f06ca55ea5837aabfd7d726a79b72365ab3', class: `${borderClasses} ${this.social ? 'border-t-2' : ''} pb-28 pt-20 md:pt-28` }, hAsync("div", { key: 'f601602dd39c564ce77d978325cbacaa752bd5f0', class: "container flex items-center gap-20 lg:flex-nowrap" }, hAsync("div", { key: '94d6bf12bca8a37560124de2a9114a4566494883', class: "flex items-center gap-x-12" }, hAsync("a", { key: '8c9bf0a41cce7e043311b39c6418d2dc3541694f', target: "_blank", rel: "noopener noreferrer", class: "effect-focus focus-visible:rounded-xs flex w-[54px] ml-0", href: "https://research-and-innovation.ec.europa.eu/funding/funding-opportunities/funding-programmes-and-open-calls/horizon-europe_en", "aria-label": "Learn about Horizon Europe funding" }, hAsync("svg", { key: '5d0c96911aa0069dd7c0ef6a5690d5ac59dbc737', class: "h-auto w-full", width: "63", height: "50", viewBox: "0 0 640 480", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: 'bab3fd3f37857e99c2a525b7a9553d4c706d247c', d: "M0 0h640v480H0V0z", fill: "#039" }), hAsync("path", { key: 'e77d6f1fc21f36083196adcb4f6b7a3e70105b0f', d: "M325.032 93.15l17.513-.398-14.401 9.972 5.789 16.53L320 108.639l-13.933 10.615 5.789-16.531-14.399-9.97 17.51.396L320 76.374l5.032 16.775zm0 284.444l17.513-.398-14.401 9.972 5.789 16.53L320 393.083l-13.933 10.615 5.789-16.531-14.399-9.97 17.51.397L320 360.818l5.032 16.776zm-147.25-158.983l5.029 16.761 17.511-.397-14.4 9.969 5.79 16.533-13.933-10.616-13.932 10.616 5.788-16.531-14.401-9.971 17.511.397 5.028-16.761.004-.015.001.003.001-.003.003.015zm77.885-105.334l17.511-.397-14.401 9.971 5.79 16.531-13.932-10.614-13.933 10.615 5.788-16.531-14.4-9.971h.005l-.003-.001 17.51.397 5.033-16.775 5.032 16.775zm-52.729 52.729l17.511-.398h.002l-14.402 9.971 5.79 16.531-13.933-10.615-13.932 10.615 5.789-16.532-14.4-9.97 17.51.397 5.033-16.776 5.032 16.777zm-5.001 125.803l5.027 16.759 17.513-.397-14.401 9.971 5.79 16.531-.005-.005.003.006-13.932-10.615-13.933 10.615 5.788-16.532-14.398-9.97 17.51.396 5.029-16.759.004-.016v.003l.002-.003.003.016zm51.445 47.71l5.027 16.76 17.513-.397-14.401 9.97 5.791 16.532-.004-.004.002.004-13.933-10.615-13.933 10.615 5.788-16.532-14.398-9.97 17.51.397 5.029-16.76.004-.016v.003l.002-.003.003.016zm217.873-104.147l17.511-.397-14.401 9.969 5.79 16.533-13.934-10.616-13.931 10.616 5.789-16.533-14.399-9.969 17.509.397 5.034-16.776 5.032 16.776zm-63.958-95.997l-5.786-16.522 14.401-9.972-17.511.398-5.033-16.778-5.034 16.777-17.51-.398 14.4 9.972-5.789 16.53 13.932-10.614 13.934 10.614-.004-.007zm38.797 42.122l13.934 10.614-.004-.007-5.787-16.524 14.401-9.971-17.51.399-5.033-16.778-5.033 16.777-17.51-.398h-.001l14.399 9.972-5.787 16.529 13.931-10.613zm5.007 127.071l17.51-.397-14.4 9.971 5.79 16.531-13.933-10.614-13.932 10.615 5.788-16.531-14.401-9.971h.005l-.003-.001 17.51.397 5.033-16.775 5.033 16.775zm-51.446 47.711l17.511-.397-14.4 9.97 5.79 16.532-13.933-10.615-13.933 10.615 5.789-16.531-14.401-9.971h.002l17.51.397 5.033-16.776 5.032 16.776z", fill: "#FC0" })))), hAsync("div", { key: '3057a627d8cc6e524f6381f21bb34b549d45021f' }, hAsync("div", { key: 'd6397eaa434f15d415bff0c5171b4f71295dabc3', class: `f-ui-02 ${textClasses}` }, hAsync("p", { key: 'cc9e370cd5b4238fcd76bc8f1f84c54af2873bab' }, this.fundedBy), hAsync("div", { key: '9af9a16cf3cc6fc4223c1b5eac13f96894b92962', class: "mt-4 flex flex-wrap gap-12 lg:flex-nowrap inline-block" }, hAsync("span", { key: 'e86c83c7504f60831dc9d4239b3e2b551b2765b6', class: "effect-focus !no-underline decoration-2 underline-offset-4 hover:!underline mr-4" }, "\u00A9 ", rights), this.enableCookiesSettings ? (hAsync("eds-link", { label: this.cookiesPreferences, intent: "underline", size: "small", onClick: () => {
-                this.toggleCookiesConsent();
-            } })) : null))), hAsync("div", { key: 'd2dcb8a3a99c5aa368d6d710e125e3a9f8fefd25', class: "ml-auto pl-12" }, this.enableScrollTop ? (hAsync("div", { id: "toTop", class: "transition-all transition duration-75 opacity-0" }, hAsync("eds-button", { id: "backToTop", "aria-label": this.backToTopAriaLabel, intent: isInverse ? 'ghostInverse' : 'ghost', size: "large", icon: "chevron-up", onClick: this.backToTop, tabindex: "-1" }))) : null)))));
+        // Class hooks driven by variant — the CSS file styles each
+        // selector independently rather than relying on prop-based
+        // inline styles, so theme tokens stay overridable from outside
+        // via the host's CSS custom properties.
+        const rootClasses = ['eds-footer-root', isInverse ? 'theme-inverse' : 'theme-default']
+            .join(' ');
+        return (hAsync("footer", { key: 'b09063376e3bd78845302473a96884bd473cea09', class: rootClasses }, this.social ? (hAsync("div", { class: "footer-social" }, hAsync("div", { class: "footer-container" }, hAsync("eds-social-networks", { variant: this.variant })))) : null, hAsync("div", { key: '3aeb8f496bb4c3c73da907ba9b9fbb72841be213', class: "footer-container" }, hAsync("div", { key: 'e7e33ce7dee8079a9aff17d45963dfaff9576121', class: "footer-grid" }, hAsync("div", { key: 'e6fc738e086774e114c5ceef1b82fea2e2840990', class: "footer-brand" }, hAsync("div", { key: '96f7030269174c122ffe0117897a79b00020dd29', class: "footer-brand-row" }, hAsync("a", { key: '5967c33efff435ceee2a45c21cae67749b91b9ba', target: "_blank", rel: "noopener noreferrer", class: "footer-flag-link", href: "https://research-and-innovation.ec.europa.eu/funding/funding-opportunities/funding-programmes-and-open-calls/horizon-europe_en", "aria-label": "Learn about Horizon Europe funding" }, hAsync("svg", { key: '3de7debe64d431152e47a4daefb7c9facf7bf951', class: "footer-flag-svg", width: "63", height: "50", viewBox: "0 0 640 480", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: '50e3f0c5ae41e3e7cc5689ddf01a8944a6c5d2eb', d: "M0 0h640v480H0V0z", fill: "#039" }), hAsync("path", { key: '2c0f61e6de734d7214accd10cefd3a39e31f36a1', d: "M325.032 93.15l17.513-.398-14.401 9.972 5.789 16.53L320 108.639l-13.933 10.615 5.789-16.531-14.399-9.97 17.51.396L320 76.374l5.032 16.775zm0 284.444l17.513-.398-14.401 9.972 5.789 16.53L320 393.083l-13.933 10.615 5.789-16.531-14.399-9.97 17.51.397L320 360.818l5.032 16.776zm-147.25-158.983l5.029 16.761 17.511-.397-14.4 9.969 5.79 16.533-13.933-10.616-13.932 10.616 5.788-16.531-14.401-9.971 17.511.397 5.028-16.761.004-.015.001.003.001-.003.003.015zm77.885-105.334l17.511-.397-14.401 9.971 5.79 16.531-13.932-10.614-13.933 10.615 5.788-16.531-14.4-9.971h.005l-.003-.001 17.51.397 5.033-16.775 5.032 16.775zm-52.729 52.729l17.511-.398h.002l-14.402 9.971 5.79 16.531-13.933-10.615-13.932 10.615 5.789-16.532-14.4-9.97 17.51.397 5.033-16.776 5.032 16.777zm-5.001 125.803l5.027 16.759 17.513-.397-14.401 9.971 5.79 16.531-.005-.005.003.006-13.932-10.615-13.933 10.615 5.788-16.532-14.398-9.97 17.51.396 5.029-16.759.004-.016v.003l.002-.003.003.016zm51.445 47.71l5.027 16.76 17.513-.397-14.401 9.97 5.791 16.532-.004-.004.002.004-13.933-10.615-13.933 10.615 5.788-16.532-14.398-9.97 17.51.397 5.029-16.76.004-.016v.003l.002-.003.003.016zm217.873-104.147l17.511-.397-14.401 9.969 5.79 16.533-13.934-10.616-13.931 10.616 5.789-16.533-14.399-9.969 17.509.397 5.034-16.776 5.032 16.776zm-63.958-95.997l-5.786-16.522 14.401-9.972-17.511.398-5.033-16.778-5.034 16.777-17.51-.398 14.4 9.972-5.789 16.53 13.932-10.614 13.934 10.614-.004-.007zm38.797 42.122l13.934 10.614-.004-.007-5.787-16.524 14.401-9.971-17.51.399-5.033-16.778-5.033 16.777-17.51-.398h-.001l14.399 9.972-5.787 16.529 13.931-10.613zm5.007 127.071l17.51-.397-14.4 9.971 5.79 16.531-13.933-10.614-13.932 10.615 5.788-16.531-14.401-9.971h.005l-.003-.001 17.51.397 5.033-16.775 5.033 16.775zm-51.446 47.711l17.511-.397-14.4 9.97 5.79 16.532-13.933-10.615-13.933 10.615 5.789-16.531-14.401-9.971h.002l17.51.397 5.033-16.776 5.032 16.776z", fill: "#FC0" }))), hAsync("p", { key: '9ff8e10db0e213754bfc73bcce1b3dd36bc62e30', class: "footer-funded" }, this.fundedBy)), hAsync("p", { key: 'a24c4fbfe48c4c3c8d076f24da9c84b739a982d8', class: "footer-copyright" }, "\u00A9 ", rights)), this.resolvedColumns.map((col, ci) => (hAsync("div", { class: "footer-column", key: `col-${ci}` }, hAsync("h4", { class: "footer-column-heading" }, col.heading), hAsync("ul", { class: "footer-column-list" }, (col.links || []).map((link, li) => this.renderLink(link, li)))))))), this.enableScrollTop ? (hAsync("div", { id: "toTop", class: "footer-back-to-top" }, hAsync("eds-button", { id: "backToTop", "aria-label": this.backToTopAriaLabel, intent: isInverse ? 'ghostInverse' : 'ghost', size: "large", icon: "chevron-up", onClick: this.backToTop, tabindex: "-1" }))) : null));
     }
     get el() { return getElement(this); }
+    static get watchers() { return {
+        "columns": ["onColumnsChange"]
+    }; }
     static get style() { return EdsFooterStyle0; }
     static get cmpMeta() { return {
         "$flags$": 9,
         "$tagName$": "eds-footer",
         "$members$": {
             "social": [4],
-            "variant": [1],
+            "variant": [513],
             "enableScrollTop": [4, "enable-scroll-top"],
             "fundedBy": [1, "funded-by"],
             "rightsReserved": [1, "rights-reserved"],
             "cookiesPreferences": [1, "cookies-preferences"],
             "enableCookiesSettings": [4, "enable-cookies-settings"],
             "backToTopAriaLabel": [1, "back-to-top-aria-label"],
-            "showMatomoNotice": [32]
+            "columns": [1],
+            "resolvedColumns": [32]
         },
         "$listeners$": [[9, "scroll", "handleScroll"]],
         "$lazyBundleId$": "-",
-        "$attrsToReflect$": []
+        "$attrsToReflect$": [["variant", "variant"]]
     }; }
 }
 
@@ -7265,7 +7394,8 @@ isFieldVisible) {
             delete errors[field.name];
             return;
         }
-        if (field.type !== 'hidden') {
+        // 'content' is a presentational text block — no input, never validated.
+        if (field.type !== 'hidden' && field.type !== 'content') {
             if ((field.type === 'checkbox' || field.type === 'radio') && !field.options) {
                 // Single checkbox or radio without multiple options
                 const fieldErrors = validateSingleBox(field.name, field.required, formEl);
@@ -7332,6 +7462,46 @@ isFieldVisible) {
     return { errors, hasError };
 }
 
+/**
+ * safeInlineFormat — the single, audited text→HTML formatter used everywhere a
+ * form renders author-supplied text via innerHTML (form/step description, Text
+ * Blocks, and field messages).
+ *
+ * SECURITY: escape-first, then a tiny whitelisted inline subset. Because all of
+ * &, <, >, " are turned into entities BEFORE any markup is generated, author
+ * text can never inject a tag or attribute — the only HTML produced is the
+ * <strong>, <a> and <br> emitted here. Links are restricted to http/https/mailto
+ * (others fall back to plain text), URLs cannot contain whitespace or a quote,
+ * and external links get rel="noopener noreferrer".
+ *
+ * DO NOT reorder: escaping MUST happen before tag generation, or the guarantee
+ * breaks. Keep this in sync with the JS mirror in
+ * apps/live/forms-app/src/utils/descriptionFormat.ts.
+ *
+ *   **bold**       → <strong>bold</strong>
+ *   [label](url)   → <a href="url" …>label</a>   (http/https/mailto only)
+ *   newline        → <br>
+ */
+function safeInlineFormat(text) {
+    if (!text) {
+        return '';
+    }
+    let s = String(text)
+        .replace(/&/g, '&amp;')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;')
+        .replace(/"/g, '&quot;');
+    // bold
+    s = s.replace(/\*\*([^*]+)\*\*/g, '<strong>$1</strong>');
+    // links — safe schemes only; otherwise drop to the plain label
+    s = s.replace(/\[([^\]]+)\]\(([^)\s]+)\)/g, (_m, label, url) => /^(https?:|mailto:)/i.test(url)
+        ? `<a href="${url}" target="_blank" rel="noopener noreferrer" class="eds-desc-link">${label}</a>`
+        : label);
+    // newlines → line breaks
+    s = s.replace(/\n/g, '<br>');
+    return s;
+}
+
 /**
  * Validates a field based on its type and returns an array of error messages.
  * @param field - The field configuration object.
@@ -7366,7 +7536,7 @@ function getFormInitData({ initData, parsedFields, currentValues
     return { updatedValues };
 }
 
-const edsFormCss = ".container{width:calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0)))));margin-right:auto;margin-left:auto}.container>*{--container-outer-gutter:0;--breakout-container-outer-gutter:0}.flex{display:flex}.flex-col{flex-direction:column}.f-body-01{font-family:var(--f-body-01-fontFamily);font-weight:var(--f-body-01-fontWeight);font-size:var(--f-body-01-fontSize);line-height:var(--f-body-01-lineHeight);letter-spacing:var(--f-body-01-letterSpacing)}.f-body-02{font-family:var(--f-body-02-fontFamily);font-weight:var(--f-body-02-fontWeight);font-size:var(--f-body-02-fontSize);line-height:var(--f-body-02-lineHeight);letter-spacing:var(--f-body-02-letterSpacing)}.f-body-01 b,.f-body-01 strong{font-weight:var(--f-body-01---bold-weight, bold)}.f-body-02 b,.f-body-02 strong{font-weight:var(--f-body-02---bold-weight, bold)}.f-heading-04{font-family:var(--f-heading-04-fontFamily);font-weight:600;font-size:var(--f-heading-04-fontSize);line-height:var(--f-heading-04-lineHeight);letter-spacing:var(--f-heading-04-letterSpacing)}.f-heading-05{font-family:var(--f-heading-05-fontFamily);font-weight:600;font-size:var(--f-heading-05-fontSize);line-height:var(--f-heading-05-lineHeight);letter-spacing:var(--f-heading-05-letterSpacing);overflow:visible}.text-light{color:var(--grey-dark)}.rounded-xs{border-radius:4px}.rounded-sm{border-radius:8px}.border-softer{border-color:rgba(0, 0, 0, .1)}.border-2{border-width:2px}.border-t-2{border-top-width:2px}.mt-20{margin-top:1.25rem}.mt-32{margin-top:2rem}.mt-64{margin-top:4rem}.mb-32{margin-bottom:2rem}.pt-28{padding-top:1.75rem}.pt-32{padding-top:2rem}.pt-64{padding-top:4rem}.pl-8{padding-left:0.5rem}.pl-16{padding-left:1rem}.border-l-2{border-left-width:2px}.gap-y-8{row-gap:0.5rem}.gap-y-16{row-gap:1rem}.gap-y-20{row-gap:1.25rem}.gap-y-24{row-gap:1.5rem}.border-group{border-left:1px solid var(--soft-color, #ddd);padding-left:1rem}.bg-inverse{background-color:var(--white)}.form-brand{box-shadow:0 2px 12px rgba(0, 0, 0, 0.08);border-left:4px solid var(--brand-green);animation:fadeInUp 0.6s ease}@keyframes fadeInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.effect-shadow{transition-property:box-shadow;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.shadow-hover{--tw-shadow:0px 0px 16px rgba(0, 0, 0, 0.2);--tw-shadow-colored:0px 0px 16px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.cursor-pointer{cursor:pointer}.effect-focus-within{outline-width:3px;outline-offset:2px;outline-color:var(--brand-green)}.effect-focus-within:focus-within{outline-style:solid}.relative{position:relative}.rounded-sm{border-radius:8px}.rounded-lg{border-radius:16px}.px-16{padding-left:1rem;padding-right:1rem}.pb-4{padding-bottom:0.25rem}.pb-16{padding-bottom:1rem}.p-32{padding:2rem}.mr-auto{margin-right:auto}.ml-auto{margin-left:auto}.w-full{width:100%}.justify-between{justify-content:space-between}.items-center{align-items:center}@media (min-width: 750px){.md\\:flex-row-reverse{flex-direction:row-reverse}.md\\:justify-between{justify-content:space-between}.md\\:gap-y-0{row-gap:0}.md\\:w-auto{width:auto}.md\\:mt-64{margin-top:4rem}.md\\:pt-64{padding-top:4rem}}";
+const edsFormCss = ".container{width:calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0)))));margin-right:auto;margin-left:auto}.container>*{--container-outer-gutter:0;--breakout-container-outer-gutter:0}.flex{display:flex}.flex-col{flex-direction:column}.f-body-01{font-family:var(--f-body-01-fontFamily);font-weight:var(--f-body-01-fontWeight);font-size:var(--f-body-01-fontSize);line-height:var(--f-body-01-lineHeight);letter-spacing:var(--f-body-01-letterSpacing)}.f-body-02{font-family:var(--f-body-02-fontFamily);font-weight:var(--f-body-02-fontWeight);font-size:var(--f-body-02-fontSize);line-height:var(--f-body-02-lineHeight);letter-spacing:var(--f-body-02-letterSpacing)}.f-body-01 b,.f-body-01 strong{font-weight:var(--f-body-01---bold-weight, bold)}.f-body-02 b,.f-body-02 strong{font-weight:var(--f-body-02---bold-weight, bold)}.f-heading-04{font-family:var(--f-heading-04-fontFamily);font-weight:600;font-size:var(--f-heading-04-fontSize);line-height:var(--f-heading-04-lineHeight);letter-spacing:var(--f-heading-04-letterSpacing)}.f-heading-05{font-family:var(--f-heading-05-fontFamily);font-weight:600;font-size:var(--f-heading-05-fontSize);line-height:var(--f-heading-05-lineHeight);letter-spacing:var(--f-heading-05-letterSpacing);overflow:visible}.text-light{color:var(--grey-dark)}.rounded-xs{border-radius:4px}.rounded-sm{border-radius:8px}.border-softer{border-color:rgba(0, 0, 0, .1)}.border-2{border-width:2px}.border-t-2{border-top-width:2px}.mt-20{margin-top:1.25rem}.mt-32{margin-top:2rem}.mt-64{margin-top:4rem}.mb-32{margin-bottom:2rem}.pt-28{padding-top:1.75rem}.pt-32{padding-top:2rem}.pt-64{padding-top:4rem}.pl-8{padding-left:0.5rem}.pl-16{padding-left:1rem}.border-l-2{border-left-width:2px}.gap-y-8{row-gap:0.5rem}.gap-y-16{row-gap:1rem}.gap-y-20{row-gap:1.25rem}.gap-y-24{row-gap:1.5rem}.border-group{border-left:1px solid var(--soft-color, #ddd);padding-left:1rem}.bg-inverse{background-color:var(--white)}.form-brand{box-shadow:0 2px 12px rgba(0, 0, 0, 0.08);border-left:4px solid var(--brand-green);animation:fadeInUp 0.6s ease}@keyframes fadeInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.effect-shadow{transition-property:box-shadow;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.shadow-hover{--tw-shadow:0px 0px 16px rgba(0, 0, 0, 0.2);--tw-shadow-colored:0px 0px 16px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.cursor-pointer{cursor:pointer}.effect-focus-within{outline-width:3px;outline-offset:2px;outline-color:var(--brand-green)}.effect-focus-within:focus-within{outline-style:solid}.relative{position:relative}.rounded-sm{border-radius:8px}.rounded-lg{border-radius:16px}.px-16{padding-left:1rem;padding-right:1rem}.pb-4{padding-bottom:0.25rem}.pb-16{padding-bottom:1rem}.p-32{padding:2rem}.mr-auto{margin-right:auto}.ml-auto{margin-left:auto}.w-full{width:100%}.justify-between{justify-content:space-between}.items-center{align-items:center}@media (min-width: 750px){.md\\:flex-row-reverse{flex-direction:row-reverse}.md\\:justify-between{justify-content:space-between}.md\\:gap-y-0{row-gap:0}.md\\:w-auto{width:auto}.md\\:mt-64{margin-top:4rem}.md\\:pt-64{padding-top:4rem}}.eds-desc-link{position:relative;display:inline-block;color:var(--brand-black);text-decoration:none}.eds-desc-link::after{content:'';position:absolute;bottom:-2px;left:0;width:0;height:2px;background-color:var(--brand-green);transition:width 0.3s ease}.eds-desc-link:hover::after{width:100%}.eds-desc-link:focus-visible::after{width:0}.eds-content-block{line-height:1.5;color:var(--brand-black, #07140d)}.eds-content-block strong{font-weight:600}.eds-content-block .eds-desc-link{font-weight:600}";
 var EdsFormStyle0 = edsFormCss;
 
 /**
@@ -7566,7 +7736,20 @@ class EdsForm {
         if (this.setFormUrl && typeof window !== 'undefined') {
             formData.set('form_url', window.location.href);
         }
+        // Group fields by name so we can drop values for fields hidden by a condition.
+        // A name may be reused across mutually-exclusive conditional variants (e.g. a
+        // `web_app_url` shown for service_type=web_app AND another for =platform), so a
+        // value is dropped ONLY when EVERY field with that name is hidden — if any
+        // variant is visible, its value is kept.
+        const fieldsByName = {};
+        this.parsedFields.forEach((f) => {
+            (fieldsByName[f.name] = fieldsByName[f.name] || []).push(f);
+        });
         Object.keys(this.values).forEach((key) => {
+            const fields = fieldsByName[key];
+            if (fields && fields.length && !fields.some((f) => this.isFieldVisible(f))) {
+                return; // all fields with this name are conditionally hidden — skip
+            }
             const value = this.values[key];
             // Handle File arrays (from file inputs)
             if (Array.isArray(value)) {
@@ -7861,29 +8044,53 @@ class EdsForm {
         return map;
     }
     renderField(field) {
-        var _a, _b, _c, _d;
+        var _a, _b, _c, _d, _e, _f, _g;
         if (!this.isFieldVisible(field)) {
             return null;
         }
+        // 0) Presentational "Text Block" — static formatted text, NOT an input.
+        // It has no value, is never added to the submission (makeFormData only
+        // iterates this.values) and is never validated (see formValidators). The
+        // text runs through formatDescription, which escapes HTML first, so author
+        // content can never inject markup — only the **bold**/[link]/newline subset.
+        if (field.type === 'content') {
+            const raw = ((_b = (_a = field.content) !== null && _a !== void 0 ? _a : field.label) !== null && _b !== void 0 ? _b : '');
+            return (hAsync("div", { class: "eds-content-block f-body-02 text-default", key: field.name, innerHTML: this.formatDescription(raw) }));
+        }
         // 1) Handle rating
         if (field.type === 'rating') {
             // pull the current value (or zero)
             const val = this.values[field.name] || 0;
-            return (hAsync("div", { class: "form-group rating-field", key: field.name }, hAsync("div", { class: "flex justify-between" }, field && (hAsync("eds-input-label", { name: `rating-${field.name}`, label: field.label, disabled: field.disabled, required: field.required }))), hAsync("eds-rating", { id: `rating-${field.name}`, "rating-type": field.ratingType, "rating-count": field.ratingCount, "selected-rating": val, onRating: (e) => this.handleRating(e, field) }), hAsync("div", { class: "mt-6" }, hAsync("eds-input-footer", { id: `${field.name}-footer`, name: field.name, message: field.message, "error-message": (_a = this.errors[field.name]) === null || _a === void 0 ? void 0 : _a.join('<br/>'), error: !!this.errors[field.name], link: field.link }))));
+            return (hAsync("div", { class: "form-group rating-field", key: field.name }, hAsync("div", { class: "flex justify-between" }, field && (hAsync("eds-input-label", { name: `rating-${field.name}`, label: field.label, disabled: field.disabled, required: field.required }))), hAsync("eds-rating", { id: `rating-${field.name}`, "rating-type": field.ratingType, "rating-count": field.ratingCount, "selected-rating": val, onRating: (e) => this.handleRating(e, field) }), hAsync("div", { class: "mt-6" }, hAsync("eds-input-footer", { id: `${field.name}-footer`, name: field.name, message: field.message, "error-message": (_c = this.errors[field.name]) === null || _c === void 0 ? void 0 : _c.join('<br/>'), error: !!this.errors[field.name], link: field.link }))));
         }
         else if (field.type === 'nps') {
             // pull the current value (or null)
             const val = this.values[field.name] !== undefined ? this.values[field.name] : null;
-            return (hAsync("div", { class: "form-group nps-field", key: field.name }, hAsync("div", { class: "flex justify-between" }, field && (hAsync("eds-input-label", { name: `nps-${field.name}`, label: field.question, disabled: field.disabled, required: field.required }))), hAsync("eds-nps", { id: `nps-${field.name}`, "right-label": field.rightLabel, "left-label": field.leftLabel, "selected-value": val, onNps: (e) => this.handleNPS(e, field) }), hAsync("div", { class: "mt-6" }, hAsync("eds-input-footer", { id: `${field.name}-footer`, name: field.name, "error-message": (_b = this.errors[field.name]) === null || _b === void 0 ? void 0 : _b.join('<br/>'), error: !!this.errors[field.name] }))));
+            return (hAsync("div", { class: "form-group nps-field", key: field.name }, hAsync("div", { class: "flex justify-between" }, field && (hAsync("eds-input-label", { name: `nps-${field.name}`, label: field.question, disabled: field.disabled, required: field.required }))), hAsync("eds-nps", { id: `nps-${field.name}`, "right-label": field.rightLabel, "left-label": field.leftLabel, "selected-value": val, onNps: (e) => this.handleNPS(e, field) }), hAsync("div", { class: "mt-6" }, hAsync("eds-input-footer", { id: `${field.name}-footer`, name: field.name, "error-message": (_d = this.errors[field.name]) === null || _d === void 0 ? void 0 : _d.join('<br/>'), error: !!this.errors[field.name] }))));
+        }
+        else if (field.type === 'search-select') {
+            return (hAsync("eds-search-select", { key: field.name, name: field.name, label: field.label, source: field.source, options: field.options, multiple: !!field.multiple, "api-base": field.apiBase || '/api/v1', placeholder: field.placeholder, required: field.required, disabled: field.disabled, hint: field.hint, message: field.message, error: !!this.errors[field.name], "error-message": (_e = this.errors[field.name]) === null || _e === void 0 ? void 0 : _e.join('<br/>'), value: this.values[field.name], onEdsinput: (e) => this.handleInput(e, field), onEdschange: (e) => this.handleChange(e, field) }));
         }
         else if (field.type === 'kg-web-service') {
-            return (hAsync("eds-kg-web-services-select", { key: field.name, name: field.name, label: field.label, "api-endpoint": field.apiEndpoint || '/api/v1/kg/web-services/cached', placeholder: field.placeholder, required: field.required, disabled: field.disabled, hint: field.hint, message: field.message, error: !!this.errors[field.name], "error-message": (_c = this.errors[field.name]) === null || _c === void 0 ? void 0 : _c.join('<br/>'), value: this.values[field.name], size: field.size || 500, onEdsinput: (e) => this.handleInput(e, field), onEdschange: (e) => this.handleChange(e, field) }));
+            return (hAsync("eds-kg-web-services-select", { key: field.name, name: field.name, label: field.label, "api-endpoint": field.apiEndpoint || '/api/v1/kg/web-services/cached', placeholder: field.placeholder, required: field.required, disabled: field.disabled, hint: field.hint, message: field.message, error: !!this.errors[field.name], "error-message": (_f = this.errors[field.name]) === null || _f === void 0 ? void 0 : _f.join('<br/>'), value: this.values[field.name], size: field.size || 500, onEdsinput: (e) => this.handleInput(e, field), onEdschange: (e) => this.handleChange(e, field) }));
         }
-        return (hAsync("eds-input-field", { key: field.name, name: field.name, label: field.label, placeholder: field.placeholder, type: field.type, value: this.values[field.name], required: field.required, hint: field.hint, message: field.message, link: field.link, error: !!this.errors[field.name], errorMessage: (_d = this.errors[field.name]) === null || _d === void 0 ? void 0 : _d.join('<br/>'), options: field.options, onInput: (e) => this.handleInput(e, field), onChangeNative: (e) => this.handleChange(e, field) }));
+        return (hAsync("eds-input-field", { key: field.name, name: field.name, label: field.label, placeholder: field.placeholder, type: field.type, value: this.values[field.name], required: field.required, hint: field.hint, message: field.message, link: field.link, error: !!this.errors[field.name], errorMessage: (_g = this.errors[field.name]) === null || _g === void 0 ? void 0 : _g.join('<br/>'), options: field.options, onInput: (e) => this.handleInput(e, field), onChangeNative: (e) => this.handleChange(e, field) }));
     }
     async getData() {
         return this.makeFormData();
     }
+    /**
+     * Render the form/step description with a small, safe subset of inline
+     * formatting so authors can add links and emphasis:
+     *   **bold**            → <strong>
+     *   [label](url)        → <a> (only http/https/mailto; others render as text)
+     *   blank line / \n     → paragraph / line break
+     * HTML is escaped FIRST, so author text can never inject markup — only the
+     * whitelisted patterns above produce tags.
+     */
+    formatDescription(text) {
+        return safeInlineFormat(text);
+    }
     render() {
         const hiddenFields = this.parsedFields.filter((field) => field.type === 'hidden');
         //const otherFields = this.parsedFields.filter((field) => field.type !== 'hidden');
@@ -7899,9 +8106,9 @@ class EdsForm {
         else if (this.formStyle === 'brand') {
             styleClasses = 'bg-inverse form-brand relative rounded-xs p-32';
         }
-        return (hAsync("form", { key: '5e58460e52950974cdf11001123f9ffb23dc659e', class: styleClasses, ref: (el) => (this.formEl = el), autocomplete: "on", onSubmit: this.handleSubmit }, hAsync("div", { key: 'ff3a33e3a8d311c86712daa68c80aac767d82a9b', class: "flex flex-col gap-y-20 overflow-visible" }, this.title && (hAsync("span", { key: 'b1f363c03074f944a8f60387a40cef6fa791b188', role: "heading", class: "f-heading-05 pb-4 block" }, this.title)), this.description && hAsync("span", { key: '7a9b5ea5451cf59ac47ec81dd1a44c7c9e6326a3', class: "f-body-02 text-light" }, this.description), hAsync("slot", { key: '1e50a245fa37b73149a22308fda4039051d4639c' })), hiddenFields.map((field, index) => (hAsync("eds-input", { key: index, type: "hidden", name: field.name, value: field.value }))), this.parsedGroups
+        return (hAsync("form", { key: '5717a276eb4bcb1b40bb6c3a3d68e2372ccf0b37', class: styleClasses, ref: (el) => (this.formEl = el), autocomplete: "on", onSubmit: this.handleSubmit }, hAsync("div", { key: '8e9fec59b6cafccabbb67381a12541f12201cc48', class: "flex flex-col gap-y-20 overflow-visible" }, this.title && (hAsync("span", { key: 'f47c68db954de63773257f9c898141be27278a00', role: "heading", class: "f-heading-05 pb-4 block" }, this.title)), this.description && hAsync("span", { key: '4287bb5f9c31cf5d3953a032de4a8c269e1feb7e', class: "f-body-02 text-light", innerHTML: this.formatDescription(this.description) }), hAsync("slot", { key: 'e9e52696eab6477354ac5ee6cbe08399483b1b37' })), hiddenFields.map((field, index) => (hAsync("eds-input", { key: index, type: "hidden", name: field.name, value: field.value }))), this.parsedGroups
             .filter((g) => Array.isArray(buckets[g.id]) && buckets[g.id].length > 0)
-            .map((g) => (hAsync("div", { class: "mt-32", key: g.id }, hAsync("span", { class: "f-body-02" }, hAsync("b", null, g.title)), hAsync("div", { class: "border-group mt-32 mb-32 flex flex-col gap-y-24" }, buckets[g.id].map((f) => this.renderField(f)))))), hAsync("div", { key: '6cd08f342c0f9004d10628827720cb641339fcd5', class: "flex flex-col mt-32 gap-y-24" }, buckets['__ungrouped'].map((f) => this.renderField(f))), (this.formBtn || this.clearBtn) && (hAsync("div", { key: 'e8d37bedbd49c9fc94cbd2e2a887448f3764b8f9', class: "mt-32 md:mt-64 flex flex-col items-center md:flex-row-reverse md:justify-between gap-y-16 md:gap-y-0" }, this.formBtn && (hAsync("eds-button", { key: 'ec878c5edaa87cf9bff0424b92e5c82605856e67', intent: this.buttonIntent, pill: true, label: this.formBtnLabel, disabled: this.isSubmitting, loading: this.isSubmitting, icon: 'arrow-right', size: "large", onClick: () => this.handleSubmit() })), this.clearBtn && (hAsync("eds-button", { key: '1158dc2af47f9f523ccd2ee1435a4147fc0a646c', intent: "neutral", pill: true, size: "large", label: this.clearBtnLabel, disabled: this.isSubmitting || !this.values || Object.keys(this.values).length === 0, onClick: (e) => this.handleClear(e) }))))));
+            .map((g) => (hAsync("div", { class: "mt-32", key: g.id }, hAsync("span", { class: "f-body-02" }, hAsync("b", null, g.title)), hAsync("div", { class: "border-group mt-32 mb-32 flex flex-col gap-y-24" }, buckets[g.id].map((f) => this.renderField(f)))))), hAsync("div", { key: '22d248217ea85d68e2be652ddcbfd13ed4775934', class: "flex flex-col mt-32 gap-y-24" }, buckets['__ungrouped'].map((f) => this.renderField(f))), (this.formBtn || this.clearBtn) && (hAsync("div", { key: '101f9e275d68f59b762938ff3f7d7102660b80f0', class: "mt-32 md:mt-64 flex flex-col items-center md:flex-row-reverse md:justify-between gap-y-16 md:gap-y-0" }, this.formBtn && (hAsync("eds-button", { key: '02d427d951c715634605b6977f61cee67abaa8b0', intent: this.buttonIntent, pill: true, label: this.formBtnLabel, disabled: this.isSubmitting, loading: this.isSubmitting, icon: 'arrow-right', size: "large", onClick: () => this.handleSubmit() })), this.clearBtn && (hAsync("eds-button", { key: 'abf330715df3acf2a4bdc8d4f322fc13c70c267f', intent: "neutral", pill: true, size: "large", label: this.clearBtnLabel, disabled: this.isSubmitting || !this.values || Object.keys(this.values).length === 0, onClick: (e) => this.handleClear(e) }))))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -8031,7 +8238,7 @@ class EdsFrame {
         }
     }
     render() {
-        return (hAsync("div", { key: '0fa74cf426f9d934a035b5e3f6c9e5722c40beab', class: this.articleClasses() }, hAsync("div", { key: '65ab4084241ce1b5337e9bfaaffb5c2aaceec28e', class: "effect-height flex items-center justify-between py-8 px-12" }, hAsync("span", { key: 'f1cda1a4d61b47550d9d8cd08986f2253710c4ea', class: "f-ui-02" }, this.frameLabel), !this.iframeError && this.url && this.urlLabel ? (hAsync("eds-link", { label: this.urlLabel, url: this.url, intent: this.intent, class: "ml-auto", external: true, disabled: false, icon: "arrow-up-right" })) : null), hAsync("div", { key: 'e02ffe4f38f1375a0694f2acec72406824745437', class: "border-softer" }, this.iframeError ? (hAsync("div", { class: "container ml-8 mr-8 mt-16" }, this.errorMessage)) : (hAsync("iframe", { src: this.frameSrc, width: "100%", height: this.getFrameHeight(), title: this.frameLabel, frameBorder: "0", allowFullScreen: true })))));
+        return (hAsync("div", { key: 'ddbc978054f645eb990cde6bdd26647bd01eeb1a', class: this.articleClasses() }, hAsync("div", { key: '0a16fbd950742b8a75428b3705deaa03ef785a5b', class: "effect-height flex items-center justify-between py-8 px-12" }, hAsync("span", { key: '0c2a84cae101ec1e5352ed7be7b874b6ec45f37d', class: "f-ui-02" }, this.frameLabel), !this.iframeError && this.url && this.urlLabel ? (hAsync("eds-link", { label: this.urlLabel, url: this.url, intent: this.intent, class: "ml-auto", external: true, disabled: false, icon: "arrow-up-right" })) : null), hAsync("div", { key: 'c001f1b33c5136820155b0299e83b6dc49fbbd43', class: "border-softer" }, this.iframeError ? (hAsync("div", { class: "container ml-8 mr-8 mt-16" }, this.errorMessage)) : (hAsync("iframe", { src: this.frameSrc, width: "100%", height: this.getFrameHeight(), title: this.frameLabel, frameBorder: "0", allowFullScreen: true })))));
     }
     get el() { return getElement(this); }
     static get style() { return EdsFrameStyle0; }
@@ -8215,7 +8422,7 @@ class EdsGauge {
         const textStyle = {
             fontSize: `${fontSize}px`
         };
-        return (hAsync("div", { key: 'f5801b63984f42bad206445de4e865c0e161b88e', role: "progressbar", "aria-valuemin": this.valueMin, "aria-valuemax": this.valueMax, "aria-valuenow": clamped, "aria-label": `Gauge value: ${clamped} of ${this.valueMax}`, class: "relative inline-block rounded-full overflow-hidden", style: containerStyle }, hAsync("div", { key: '1a982401ba1853e937dfbb9aeb4736d4665abab1', class: "absolute bg-inverse rounded-full", style: maskStyle }), hAsync("div", { key: '0db002b1a3a3f49fe3fd0f3aa4d3fd0e2ee6a45d', class: "absolute inset-0 flex items-center justify-center" }, hAsync("span", { key: 'a011eaaab9e6f3d15d706bf9309ae7bafa689387', class: "f-body-01 text-default", style: textStyle }, clamped))));
+        return (hAsync("div", { key: '5629f8adbc6f144aad49062883cb85ecf24fc16c', role: "progressbar", "aria-valuemin": this.valueMin, "aria-valuemax": this.valueMax, "aria-valuenow": clamped, "aria-label": `Gauge value: ${clamped} of ${this.valueMax}`, class: "relative inline-block rounded-full overflow-hidden", style: containerStyle }, hAsync("div", { key: 'd668b54b0a5f4bf260a2f1153781c59741bd8694', class: "absolute bg-inverse rounded-full", style: maskStyle }), hAsync("div", { key: 'f08feba97d30ed893a72a7e07e412aa82ea8cd3d', class: "absolute inset-0 flex items-center justify-center" }, hAsync("span", { key: '2a8dccde44677d4a4b742cd992144d6cf399ee9b', class: "f-body-01 text-default", style: textStyle }, clamped))));
     }
     static get style() { return EdsGaugeStyle0; }
     static get cmpMeta() { return {
@@ -8235,7 +8442,7 @@ class EdsGauge {
     }; }
 }
 
-const edsGitlabContributorsCss = ".container{width:calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0)))));margin-right:auto;margin-left:auto}.container>*{--container-outer-gutter:0;--breakout-container-outer-gutter:0}.flex{display:flex}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.grid{display:grid}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.flex-1{flex:1 1 0%}.flex-shrink-0{flex-shrink:0}.gap-2{gap:0.5rem;}.gap-4{gap:1rem;}.gap-6{gap:1.5rem;}.p-5{padding:1.25rem;}.p-12{padding:3rem;}.pb-2{padding-bottom:0.25rem;}.pb-4{padding-bottom:1rem;}.mb-6{margin-bottom:1.5rem;}.m-0{margin:0}.mt-auto{margin-top:auto}.w-full{width:100%}.min-w-0{min-width:0}.text-xs{font-size:0.75rem;line-height:1rem}.text-sm{font-size:0.875rem;line-height:1.25rem}.text-base{font-size:1rem;line-height:1.5rem}.text-2xl{font-size:1.5rem;line-height:2rem}.font-semibold{font-weight:600}.whitespace-nowrap{white-space:nowrap}.overflow-hidden{overflow:hidden}.text-ellipsis{text-overflow:ellipsis}.no-underline{text-decoration:none}.text-gray-600{color:var(--eds-color-gray-600, #4b5563)}.text-gray-900{color:var(--eds-color-gray-900, #111827)}.border-gray-200{border-color:var(--eds-color-gray-200, #e5e7eb)}.bg-white{background-color:var(--eds-color-white, #ffffff)}.text-primary-600{color:var(--eds-color-primary-600, #2563eb)}.hover\\:text-primary-600:hover{color:var(--eds-color-primary-600, #2563eb)}.border-primary-300{border-color:var(--eds-color-primary-300, #93c5fd)}.hover\\:border-primary-300:hover{border-color:var(--eds-color-primary-300, #93c5fd)}.text-success-600{color:var(--eds-color-success-600, #16a34a)}.text-error-600{color:var(--eds-color-error-600, #dc2626)}.border{border-width:1px}.border-b{border-bottom-width:1px}.rounded-lg{border-radius:var(--eds-radius-lg, 0.5rem);}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.transition-colors{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.duration-200{transition-duration:200ms}.shadow-md{box-shadow:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)}.hover\\:shadow-md:hover{box-shadow:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)}.-translate-y-0\\.5{transform:translateY(-0.125rem);}.hover\\:-translate-y-0\\.5:hover{transform:translateY(-0.125rem)}.grid-cols-1{grid-template-columns:repeat(1, minmax(0, 1fr))}@media (min-width: 640px){.sm\\:grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))}}@media (min-width: 768px){.md\\:grid-cols-3{grid-template-columns:repeat(3, minmax(0, 1fr))}}@media (min-width: 1024px){.lg\\:grid-cols-4{grid-template-columns:repeat(4, minmax(0, 1fr))}.lg\\:grid-cols-5{grid-template-columns:repeat(5, minmax(0, 1fr))}}.contributor-card{will-change:transform, box-shadow, border-color}.f-ui-01{font-family:var(--f-ui-01-fontFamily);font-weight:var(--f-ui-01-fontWeight);font-size:var(--f-ui-01-fontSize);line-height:var(--f-ui-01-lineHeight);letter-spacing:var(--f-ui-01-letterSpacing)}.text-default{color:var(--black)}.text-light{color:var(--grey-700)}.text-lighter{color:var(--grey-600)}";
+const edsGitlabContributorsCss = ".container{width:calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0)))));margin-right:auto;margin-left:auto}.container>*{--container-outer-gutter:0;--breakout-container-outer-gutter:0}.flex{display:flex}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.grid{display:grid}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.flex-1{flex:1 1 0%}.flex-shrink-0{flex-shrink:0}.gap-2{gap:0.5rem;}.gap-4{gap:1rem;}.gap-6{gap:1.5rem;}.p-5{padding:1.25rem;}.p-12{padding:3rem;}.pb-2{padding-bottom:0.25rem;}.pb-4{padding-bottom:1rem;}.mb-6{margin-bottom:1.5rem;}.m-0{margin:0}.mt-auto{margin-top:auto}.w-full{width:100%}.min-w-0{min-width:0}.text-xs{font-size:0.75rem;line-height:1rem}.text-sm{font-size:0.875rem;line-height:1.25rem}.text-base{font-size:1rem;line-height:1.5rem}.text-2xl{font-size:1.5rem;line-height:2rem}.font-semibold{font-weight:600}.whitespace-nowrap{white-space:nowrap}.overflow-hidden{overflow:hidden}.text-ellipsis{text-overflow:ellipsis}.no-underline{text-decoration:none}.text-gray-600{color:var(--eds-color-gray-600, #4b5563)}.text-gray-900{color:var(--eds-color-gray-900, #111827)}.border-gray-200{border-color:var(--eds-color-gray-200, #e5e7eb)}.bg-white{background-color:var(--eds-color-white, #ffffff)}.text-primary-600{color:var(--eds-color-primary-600, #2563eb)}.hover\\:text-primary-600:hover{color:var(--eds-color-primary-600, #2563eb)}.border-primary-300{border-color:var(--eds-color-primary-300, #93c5fd)}.hover\\:border-primary-300:hover{border-color:var(--eds-color-primary-300, #93c5fd)}.text-success-600{color:var(--eds-color-success-600, #16a34a)}.text-error-600{color:var(--eds-color-error-600, #dc2626)}.border{border-width:1px}.border-b{border-bottom-width:1px}.rounded-lg{border-radius:var(--eds-radius-lg, 0.5rem);}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.transition-colors{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.duration-200{transition-duration:200ms}.shadow-md{box-shadow:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)}.hover\\:shadow-md:hover{box-shadow:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)}.-translate-y-0\\.5{transform:translateY(-0.125rem);}.hover\\:-translate-y-0\\.5:hover{transform:translateY(-0.125rem)}.grid-cols-1{grid-template-columns:repeat(1, minmax(0, 1fr))}@media (min-width: 640px){.sm\\:grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))}}@media (min-width: 768px){.md\\:grid-cols-3{grid-template-columns:repeat(3, minmax(0, 1fr))}}@media (min-width: 1024px){.lg\\:grid-cols-4{grid-template-columns:repeat(4, minmax(0, 1fr))}.lg\\:grid-cols-5{grid-template-columns:repeat(5, minmax(0, 1fr))}}.contributor-card{will-change:transform, box-shadow, border-color}.loading{position:relative;min-height:8rem;padding:1rem 1.25rem;color:var(--grey-dark, #7A7B7A);font-size:0.9375rem;border:1px solid rgba(0, 0, 0, 0.08);border-radius:0.25rem;background-color:rgba(0, 0, 0, 0.02)}.f-ui-01{font-family:var(--f-ui-01-fontFamily);font-weight:var(--f-ui-01-fontWeight);font-size:var(--f-ui-01-fontSize);line-height:var(--f-ui-01-lineHeight);letter-spacing:var(--f-ui-01-letterSpacing)}.text-default{color:var(--black)}.text-light{color:var(--grey-700)}.text-lighter{color:var(--grey-600)}";
 var EdsGitlabContributorsStyle0 = edsGitlabContributorsCss;
 
 /**
@@ -8477,7 +8684,14 @@ class EdsGitlabContributors {
     }
     render() {
         if (this.loading) {
-            return (hAsync("div", { class: "flex flex-col items-center justify-center p-12 gap-4" }, hAsync("eds-spinner", { size: "md" }), hAsync("p", { class: "text-base text-gray-600 m-0" }, "Loading contributors...")));
+            // Spinner placeholder mirrors eds-kg-learning-resources exactly —
+            // same `.loading` wrapper (position: relative + min-height so the
+            // absolutely-positioned spinner anchors inside the box instead of
+            // escaping to the page), same eds-spinner props (sm/primary/
+            // transparent + message-as-prop), and the same role+aria-live for
+            // screen-reader announcement. Keep these two components in sync if
+            // the loading affordance ever changes.
+            return (hAsync("div", { class: "loading", role: "status", "aria-live": "polite" }, hAsync("eds-spinner", { size: "sm", variant: "primary", background: "transparent", message: "Loading contributors..." })));
         }
         if (this.error) {
             return (hAsync("eds-alert", { message: "Error loading contributors", intent: "error" }));
@@ -8518,7 +8732,7 @@ class EdsGitlabContributors {
     }; }
 }
 
-const edsGlobalSearchCss = ":host{display:block;width:100%}p{margin:0}ol,ul,menu{list-style:none;margin:0;padding:0}.search-wrapper{position:relative;width:100%}.search-dropdown{position:absolute;top:calc(100% + 8px);left:0;right:0;background:white;border:1px solid #e0e0e0;border-radius:12px;box-shadow:0 8px 24px rgba(0, 0, 0, 0.12),\n    0 2px 8px rgba(0, 0, 0, 0.08),\n    0 0 0 1px rgba(0, 255, 157, 0.08);max-height:500px;overflow:hidden;z-index:9999;display:flex;flex-direction:column;animation:dropdownFadeIn 0.25s cubic-bezier(0.4, 0, 0.2, 1)}.dropdown-state{display:flex;align-items:center;justify-content:center;gap:8px;padding:24px;color:#616161;font-size:14px}.dropdown-results{list-style:none;margin:0;overflow-y:auto;overflow-x:hidden;max-height:440px}.result-item{padding:7px 7px;cursor:pointer;border-left:4px solid transparent;margin-bottom:2px;transition:all 0.25s cubic-bezier(0.4, 0, 0.2, 1);overflow:hidden;word-wrap:break-word;word-break:break-word}.result-item:hover,.result-item--selected{background:linear-gradient(\n    90deg,\n    rgba(0, 255, 157, 0.08) 0%,\n    rgba(0, 255, 157, 0.03) 100%\n  );border-left-color:var(--green-600);box-shadow:0 2px 8px rgba(0, 255, 157, 0.15)}.result-item:hover .result-title,.result-item--selected .result-title{color:var(--green-700)}.result-title{color:var(--black);transition:color 0.2s ease}.result-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.result-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}.result-badge{display:inline-block;padding:3px 8px;background:rgba(0, 255, 157, 0.12);color:var(--green-800);border-radius:4px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:0.05em;transition:all 0.2s ease}.result-item:hover .result-badge,.result-item--selected .result-badge{background:rgba(0, 255, 157, 0.2);color:var(--green-900)}.result-url{font-size:12px;color:var(--grey-600)}.external-icon{display:inline-block;width:14px;height:14px;margin-left:4px;color:var(--green-600)}.result-snippet{font-size:13px;color:#616161;line-height:1.5;margin:0;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;transition:color 0.2s ease}.result-item:hover .result-snippet,.result-item--selected .result-snippet{color:#424242}.dropdown-footer{border-top:1px solid rgba(0, 255, 157, 0.15);padding:10px 16px;background:linear-gradient(\n    180deg,\n    rgba(0, 255, 157, 0.02) 0%,\n    rgba(0, 255, 157, 0.05) 100%\n  );flex-shrink:0}.footer-hint{font-size:11px;color:#616161;display:flex;align-items:center;gap:6px;flex-wrap:wrap}kbd{display:inline-block;padding:3px 7px;font-size:11px;font-family:monospace;line-height:1.2;font-weight:500;color:var(--green-700);background:rgba(0, 255, 157, 0.1);border:1px solid rgba(0, 200, 123, 0.3);border-radius:4px;box-shadow:0 2px 0 rgba(0, 255, 157, 0.15),\n    inset 0 1px 0 rgba(255, 255, 255, 0.5)}.dropdown-results::-webkit-scrollbar{width:8px}.dropdown-results::-webkit-scrollbar-track{background:rgba(0, 255, 157, 0.05);border-radius:4px}.dropdown-results::-webkit-scrollbar-thumb{background:#33FFB8;border-radius:4px}.dropdown-results::-webkit-scrollbar-thumb:hover{background:#00FF9D}.flex{display:flex}.inline-flex{display:inline-flex}.text-center{text-align:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.text-error{color:var(--red-700)}.text-lighter{color:var(--grey-600)}.text-lightest{color:var(--grey-500)}.ml-4{margin-left:0.25rem}.ml-8{margin-left:0.5rem}.ml-16{margin-left:1rem}.p-16{padding:1rem}.p-64{padding:4rem}.f-body-02{font-family:var(--f-body-02-fontFamily);font-weight:var(--f-body-02-fontWeight);font-size:var(--f-body-02-fontSize);line-height:var(--f-body-02-lineHeight);letter-spacing:var(--f-body-02-letterSpacing)}.f-ui-03{font-family:var(--f-ui-03-fontFamily);font-weight:var(--f-ui-03-fontWeight);font-size:var(--f-ui-03-fontSize);line-height:var(--f-ui-03-lineHeight);letter-spacing:var(--f-ui-03-letterSpacing)}.f-ui-03-light{font-family:var(--f-ui-03-light-fontFamily);font-weight:var(--f-ui-03-light-fontWeight);font-size:var(--f-ui-03-light-fontSize);line-height:var(--f-ui-03-light-lineHeight);letter-spacing:var(--f-ui-03-light-letterSpacing)}.f-ui-04{font-family:var(--f-ui-04-fontFamily);font-weight:var(--f-ui-04-fontWeight);font-size:var(--f-ui-04-fontSize);line-height:var(--f-ui-04-lineHeight);letter-spacing:var(--f-ui-04-letterSpacing)}";
+const edsGlobalSearchCss = ":host{display:block;width:100%}p{margin:0}ol,ul,menu{list-style:none;margin:0;padding:0}.search-wrapper{position:relative;width:100%}.search-pill{display:flex;align-items:center;gap:12px;height:48px;padding:0 18px;border-radius:999px;font-family:var(--plex-sans, 'IBM Plex Sans', system-ui, sans-serif);font-size:15px;cursor:text;transition:background 120ms ease, box-shadow 120ms ease, color 120ms ease}.search-pill .search-icon{flex-shrink:0}.search-pill .search-input{flex:1;min-width:0;border:0;background:transparent;outline:none;font:inherit;color:inherit;-webkit-appearance:none;appearance:none}.search-pill .search-input::-webkit-search-cancel-button{-webkit-appearance:none}.search-pill .search-kbd{flex-shrink:0;font-family:'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;font-size:11px;font-weight:500;line-height:1;padding:3px 6px;border-radius:4px;box-shadow:inset 0 -1px 0 rgba(0, 0, 0, 0.05);letter-spacing:0.02em}.search-pill:focus-within .search-kbd{display:none}.search-pill .search-clear{flex-shrink:0;width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;padding:0;margin:0;border:0;border-radius:999px;background:transparent;color:inherit;cursor:pointer;opacity:0.7;transition:opacity 120ms ease, background 120ms ease}.search-pill .search-clear:hover{opacity:1;background:rgba(0, 0, 0, 0.06)}.search-pill .search-clear:focus-visible{outline:none;box-shadow:0 0 0 2px var(--brand-green, #00C87B);opacity:1}.search-pill--black .search-clear:hover{background:rgba(255, 255, 255, 0.10)}.search-pill--gray{background:var(--grey-light, #ECECEC);color:var(--grey-dark, #7A7B7A);border:0}.search-pill--gray:hover{background:#E0E0E0}.search-pill--gray .search-input{color:var(--brand-black, #07140D)}.search-pill--gray .search-input::placeholder{color:var(--grey-dark, #7A7B7A)}.search-pill--gray .search-kbd{color:var(--grey-dark, #7A7B7A);background:var(--white, #FFFFFF);border:1px solid #DCDCDC}.search-pill--gray:focus-within{background:var(--white, #FFFFFF);box-shadow:0 0 0 2px var(--brand-green, #00C87B)}.search-pill--white{background:var(--white, #FFFFFF);color:var(--grey-dark, #7A7B7A);border:1px solid var(--grey-light, #ECECEC)}.search-pill--white:hover{background:#FAFAFA}.search-pill--white .search-input{color:var(--brand-black, #07140D)}.search-pill--white .search-input::placeholder{color:var(--grey-dark, #7A7B7A)}.search-pill--white .search-kbd{color:var(--grey-dark, #7A7B7A);background:var(--grey-light, #ECECEC);border:1px solid #DCDCDC}.search-pill--white:focus-within{background:var(--white, #FFFFFF);box-shadow:0 0 0 2px var(--brand-green, #00C87B)}.search-pill--black{background:var(--brand-black, #07140D);color:rgba(255, 255, 255, 0.7);border:1px solid rgba(255, 255, 255, 0.12)}.search-pill--black:hover{background:#11221A}.search-pill--black .search-input{color:var(--white, #FFFFFF)}.search-pill--black .search-input::placeholder{color:rgba(255, 255, 255, 0.55)}.search-pill--black .search-kbd{color:rgba(255, 255, 255, 0.75);background:rgba(255, 255, 255, 0.08);border:1px solid rgba(255, 255, 255, 0.15)}.search-pill--black:focus-within{background:var(--brand-black, #07140D);box-shadow:0 0 0 2px var(--brand-green, #00C87B)}.search-dropdown{position:absolute;top:calc(100% + 8px);left:0;right:0;background:white;border:1px solid #e0e0e0;border-radius:12px;box-shadow:0 8px 24px rgba(0, 0, 0, 0.12),\n    0 2px 8px rgba(0, 0, 0, 0.08),\n    0 0 0 1px rgba(0, 255, 157, 0.08);max-height:500px;overflow:hidden;z-index:9999;display:flex;flex-direction:column;animation:dropdownFadeIn 0.25s cubic-bezier(0.4, 0, 0.2, 1)}.dropdown-state{display:flex;align-items:center;justify-content:center;gap:8px;padding:24px;color:#616161;font-size:14px}.dropdown-results{list-style:none;margin:0;overflow-y:auto;overflow-x:hidden;max-height:440px}.result-item{padding:7px 7px;cursor:pointer;border-left:4px solid transparent;margin-bottom:2px;transition:all 0.25s cubic-bezier(0.4, 0, 0.2, 1);overflow:hidden;word-wrap:break-word;word-break:break-word}.result-item:hover,.result-item--selected{background:linear-gradient(\n    90deg,\n    rgba(0, 255, 157, 0.08) 0%,\n    rgba(0, 255, 157, 0.03) 100%\n  );border-left-color:var(--green-600);box-shadow:0 2px 8px rgba(0, 255, 157, 0.15)}.result-item:hover .result-title,.result-item--selected .result-title{color:var(--green-700)}.result-title{color:var(--black);transition:color 0.2s ease}.result-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.result-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}.result-badge{display:inline-block;padding:3px 8px;background:rgba(0, 255, 157, 0.12);color:var(--green-800);border-radius:4px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:0.05em;transition:all 0.2s ease}.result-badge--parent{background:rgba(120, 0, 255, 0.08);color:var(--purple-800, #6b21a8)}.result-badge--lr{background:rgba(0, 120, 255, 0.1);color:var(--blue-800, #1565c0)}.result-item:hover .result-badge,.result-item--selected .result-badge{background:rgba(0, 255, 157, 0.2);color:var(--green-900)}.result-item:hover .result-badge--parent,.result-item--selected .result-badge--parent{background:rgba(120, 0, 255, 0.15);color:var(--purple-900, #581c87)}.result-item:hover .result-badge--lr,.result-item--selected .result-badge--lr{background:rgba(0, 120, 255, 0.18);color:var(--blue-900, #0d47a1)}.result-url{font-size:12px;color:var(--grey-600)}.external-icon{display:inline-block;width:14px;height:14px;margin-left:4px;color:var(--green-600)}.result-snippet{font-size:13px;color:#616161;line-height:1.5;margin:0;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;transition:color 0.2s ease}.result-item:hover .result-snippet,.result-item--selected .result-snippet{color:#424242}.dropdown-footer{border-top:1px solid rgba(0, 255, 157, 0.15);padding:10px 16px;background:linear-gradient(\n    180deg,\n    rgba(0, 255, 157, 0.02) 0%,\n    rgba(0, 255, 157, 0.05) 100%\n  );flex-shrink:0}.footer-hint{font-size:11px;color:#616161;display:flex;align-items:center;gap:6px;flex-wrap:wrap}kbd{display:inline-block;padding:3px 7px;font-size:11px;font-family:monospace;line-height:1.2;font-weight:500;color:var(--green-700);background:rgba(0, 255, 157, 0.1);border:1px solid rgba(0, 200, 123, 0.3);border-radius:4px;box-shadow:0 2px 0 rgba(0, 255, 157, 0.15),\n    inset 0 1px 0 rgba(255, 255, 255, 0.5)}.dropdown-results::-webkit-scrollbar{width:8px}.dropdown-results::-webkit-scrollbar-track{background:rgba(0, 255, 157, 0.05);border-radius:4px}.dropdown-results::-webkit-scrollbar-thumb{background:#33FFB8;border-radius:4px}.dropdown-results::-webkit-scrollbar-thumb:hover{background:#00FF9D}.flex{display:flex}.inline-flex{display:inline-flex}.text-center{text-align:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.text-error{color:var(--red-700)}.text-lighter{color:var(--grey-600)}.text-lightest{color:var(--grey-500)}.ml-4{margin-left:0.25rem}.ml-8{margin-left:0.5rem}.ml-16{margin-left:1rem}.p-16{padding:1rem}.p-64{padding:4rem}.f-body-02{font-family:var(--f-body-02-fontFamily);font-weight:var(--f-body-02-fontWeight);font-size:var(--f-body-02-fontSize);line-height:var(--f-body-02-lineHeight);letter-spacing:var(--f-body-02-letterSpacing)}.f-ui-03{font-family:var(--f-ui-03-fontFamily);font-weight:var(--f-ui-03-fontWeight);font-size:var(--f-ui-03-fontSize);line-height:var(--f-ui-03-lineHeight);letter-spacing:var(--f-ui-03-letterSpacing)}.f-ui-03-light{font-family:var(--f-ui-03-light-fontFamily);font-weight:var(--f-ui-03-light-fontWeight);font-size:var(--f-ui-03-light-fontSize);line-height:var(--f-ui-03-light-lineHeight);letter-spacing:var(--f-ui-03-light-letterSpacing)}.f-ui-04{font-family:var(--f-ui-04-fontFamily);font-weight:var(--f-ui-04-fontWeight);font-size:var(--f-ui-04-fontSize);line-height:var(--f-ui-04-lineHeight);letter-spacing:var(--f-ui-04-letterSpacing)}";
 var EdsGlobalSearchStyle0 = edsGlobalSearchCss;
 
 class EdsGlobalSearch {
@@ -8526,6 +8740,23 @@ class EdsGlobalSearch {
         registerInstance(this, hostRef);
         this.resultSelected = createEvent(this, "resultSelected", 7);
         this.searchClosed = createEvent(this, "searchClosed", 7);
+        /** Clear the current query and results; keep focus in the input so the
+         *  user can start typing again without an extra click. */
+        this.handleClear = () => {
+            if (this.debounceTimer) {
+                clearTimeout(this.debounceTimer);
+            }
+            this.query = '';
+            this.results = [];
+            this.hasSearched = false;
+            this.showDropdown = false;
+            this.selectedIndex = -1;
+            // Re-focus and reflect the empty value on the underlying DOM input.
+            if (this.inputRef) {
+                this.inputRef.value = '';
+                this.inputRef.focus();
+            }
+        };
         this.handleInput = (event) => {
             var _a;
             const target = event.target;
@@ -8558,6 +8789,7 @@ class EdsGlobalSearch {
         this.currentOrigin = '';
         this.currentSource = '';
         this.authToken = '';
+        this.variant = 'gray';
         this.query = '';
         this.results = [];
         this.loading = false;
@@ -8567,15 +8799,26 @@ class EdsGlobalSearch {
         this.selectedIndex = -1;
     }
     componentDidLoad() {
-        // Focus input if needed
-        if (this.inputRef) {
-            this.inputRef.focus();
-        }
+        // ⌘K / Ctrl+K focuses the search pill from anywhere on the page.
+        // Bound here (not via @Listen) so it works across shadow boundaries.
+        this.cmdKListener = (event) => {
+            var _a;
+            const isMac = navigator.platform.toUpperCase().includes('MAC');
+            const modifier = isMac ? event.metaKey : event.ctrlKey;
+            if (modifier && event.key.toLowerCase() === 'k') {
+                event.preventDefault();
+                (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus();
+            }
+        };
+        document.addEventListener('keydown', this.cmdKListener);
     }
     disconnectedCallback() {
         if (this.debounceTimer) {
             clearTimeout(this.debounceTimer);
         }
+        if (this.cmdKListener) {
+            document.removeEventListener('keydown', this.cmdKListener);
+        }
     }
     handleDocumentClick(event) {
         const path = event.composedPath();
@@ -8722,10 +8965,19 @@ class EdsGlobalSearch {
         return this.hasSearched && !this.loading && !this.hasResults && this.query.trim();
     }
     render() {
-        return (hAsync("div", { key: '1852fc796b6240987bcad1e278f4b1df136cc449', class: "search-wrapper" }, hAsync("eds-input-field", { key: 'b52b3f0910af3b75c52dc5fd9a514c592b257939', icon: "search", "input-id": "search-global", type: "text", name: "search-box-global", placeholder: this.placeholder, value: this.query, onInput: this.handleInput }), this.showDropdown && (hAsync("div", { key: '9f3201f757082d175f74cd6cf289235876a7adbd', class: "search-dropdown", ref: (el) => (this.dropdownRef = el) }, this.loading && (hAsync("div", { key: '3eb28e3703204b69356012f69088e6eb756be901', class: "flex text-center justify-center p-64" }, hAsync("eds-spinner", { key: '08034f1d9fd9125bc9581c89e9b2f96efc1a964b', variant: "primary", size: "sm" }))), this.error && !this.loading && (hAsync("div", { key: '8b54ae6c27499978b37a34b0b8e596216141a967', class: "flex text-center justify-center p-16" }, hAsync("span", { key: 'b4229325ea0650af096984c50882558508c3e97d', class: "text-error f-body-02" }, this.error))), this.showEmpty && (hAsync("div", { key: 'e2c4afb90f05171d30c42d7f5780388b18b19e50', class: "dropdown-state" }, hAsync("eds-icon-wrapper", { key: 'ad17ced3b7cd285c654cb88e21f295c1aaa1059f', name: "search" }), hAsync("div", { key: '66f22b148372de474fa3593deedbaa138b6f534e' }, hAsync("p", { key: 'eeb0532fbe406b0415f45685ea0f00e09950db84', class: "f-body-02" }, "No results found"), hAsync("p", { key: 'e13d6267eaa8cfc11930b2f61ea29b2f3a82cb71', class: "f-ui-04 text-lightest" }, "Try different keywords")))), this.hasResults && !this.loading && (hAsync("ul", { key: '23a0e1e6e1634d0e9212d2b9711a9d9f8d1ace42', class: "dropdown-results" }, this.results.map((result, index) => (hAsync("li", { key: result.id, "data-index": index, class: {
+        return (hAsync("div", { key: '841c9a013a1c4cee9697f3465759bf638b28475e', class: "search-wrapper" }, hAsync("label", { key: 'ff1b37fff6e94019d2da63060aba77d82ee1bafb', class: `search-pill search-pill--${this.variant}`, htmlFor: "search-global" }, hAsync("svg", { key: '150aff8a31a68195e7b333b9bcfccbc3affb3901', class: "search-icon", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, hAsync("circle", { key: 'cb424f39cd5f6316056dbcc6b80d11ce8ade1410', cx: "11", cy: "11", r: "7" }), hAsync("line", { key: '004bce39d3a9ee7a53ef0e942cf986e38b76b921', x1: "20", y1: "20", x2: "16.5", y2: "16.5" })), hAsync("input", { key: '97f4c012d7152f29fac9723ced4f06207b8a2453', id: "search-global", class: "search-input", type: "search", name: "search-box-global", placeholder: this.placeholder, value: this.query, autoComplete: "off", onInput: this.handleInput, ref: (el) => (this.inputRef = el) }), this.query && this.query.length > 0 ? (hAsync("button", { type: "button", class: "search-clear", "aria-label": "Clear search", onMouseDown: (e) => e.preventDefault() /* keep focus in input */, onClick: () => this.handleClear() }, hAsync("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2.2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, hAsync("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), hAsync("line", { x1: "6", y1: "6", x2: "18", y2: "18" })))) : (hAsync("kbd", { class: "search-kbd", "aria-hidden": "true" }, "\u2318K"))), this.showDropdown && (hAsync("div", { key: '3354848b17ba065a64919defd74de0616a29c25c', class: "search-dropdown", ref: (el) => (this.dropdownRef = el) }, this.loading && (hAsync("div", { key: '5c5f731e969f60c8c3d2ce21683fec35302a2954', class: "flex text-center justify-center p-64" }, hAsync("eds-spinner", { key: '6d0b5223f03bb0ed2f83f2ab3c77cf4e116d87e7', variant: "primary", size: "sm" }))), this.error && !this.loading && (hAsync("div", { key: '9cbca9b3f62c2969478e34a654a973196a5e9187', class: "flex text-center justify-center p-16" }, hAsync("span", { key: 'ce2bd2f6c6b05fb5fdfec4da67460b72445970bc', class: "text-error f-body-02" }, this.error))), this.showEmpty && (hAsync("div", { key: 'b7d446aa72732c9932c90bb5ef08a2f27c357ae4', class: "dropdown-state" }, hAsync("eds-icon-wrapper", { key: 'ac5377b3efa4f26e10781f369843a69c3409ec83', name: "search" }), hAsync("div", { key: '774784c1dbe4c6e6eda9e8d70833d0a2a6821b4f' }, hAsync("p", { key: 'bbce9a267889eee40b54fd471f203b530de42a86', class: "f-body-02" }, "No results found"), hAsync("p", { key: 'd440e4e0ff4f59ea14eef7aa5db0692c4a2352fa', class: "f-ui-04 text-lightest" }, "Try different keywords")))), this.hasResults && !this.loading && (hAsync("ul", { key: 'b89e31f5931705e750f0f19fb159f93a05324e6d', class: "dropdown-results" }, this.results.map((result, index) => (hAsync("li", { key: result.id, "data-index": index, class: {
                 'result-item': true,
                 'result-item--selected': index === this.selectedIndex
-            }, onClick: () => this.selectResult(result), onMouseEnter: () => (this.selectedIndex = index) }, hAsync("div", { class: "result-header" }, hAsync("span", { class: "result-title f-body-02" }, result.title)), hAsync("div", { class: "result-meta" }, hAsync("span", { class: "result-badge" }, result.source), result.section && hAsync("span", { class: "result-badge" }, result.section), hAsync("span", { class: "result-url" }, result.url)), result.snippet && hAsync("p", { class: "result-snippet" }, this.stripHtml(result.snippet))))))), this.hasResults && !this.loading && (hAsync("div", { key: '4d901487a14818ea05d3433c7cc5b881a87764e2', class: "dropdown-footer" }, hAsync("span", { key: '8411362dd3b694220e6d10268a63ef4fc3b30eeb', class: "footer-hint" }, hAsync("kbd", { key: '5b1c50f275a4d1daa35f0b1276c26bf110189785' }, "\u2191"), " ", hAsync("kbd", { key: '711430aba48663a8f58b5f3dae15c1357e75761b' }, "\u2193"), " navigate \u2022 ", hAsync("kbd", { key: 'b4e4362f19d7b82cbce9dcdea0b9c863a6e36fef' }, "\u21B5"), " select \u2022 ", hAsync("kbd", { key: '9cc79708fece76043eb8f050b1715ff610f937ec' }, "esc"), " close")))))));
+            }, onClick: () => this.selectResult(result), onMouseEnter: () => (this.selectedIndex = index) }, hAsync("div", { class: "result-header" }, hAsync("span", { class: "result-title f-body-02" }, result.title)), hAsync("div", { class: "result-meta" }, result.parent_software ? ([
+            hAsync("span", { class: "result-badge result-badge--parent" }, result.parent_software),
+            result.section && hAsync("span", { class: "result-badge result-badge--lr" }, result.section)
+        ]) : result.source === 'kg-services' ? ([
+            hAsync("span", { class: "result-badge" }, "EBRAINS KG"),
+            result.section && hAsync("span", { class: "result-badge" }, result.section)
+        ]) : ([
+            hAsync("span", { class: "result-badge" }, result.source),
+            result.section && hAsync("span", { class: "result-badge" }, result.section)
+        ]), hAsync("span", { class: "result-url" }, result.url)), result.snippet && hAsync("p", { class: "result-snippet" }, this.stripHtml(result.snippet))))))), this.hasResults && !this.loading && (hAsync("div", { key: 'fd07f17d78ba2d95c30d95b35d89151b27e3a957', class: "dropdown-footer" }, hAsync("span", { key: '20a6bc436e135e29b89a94b150c505bab6281d6f', class: "footer-hint" }, hAsync("kbd", { key: '08e43dd318b0dde7d67f74731055e2bbc00bdc78' }, "\u2191"), " ", hAsync("kbd", { key: '676535d717d5fb4b98cbf09050883630dbecaf6e' }, "\u2193"), " navigate \u2022 ", hAsync("kbd", { key: 'cd9ac17223ae195b0508c7ea37ad2a9459341b8b' }, "\u21B5"), " select \u2022 ", hAsync("kbd", { key: 'dbaa3eacc337eee81404518e9bd4c9b9fbc44205' }, "esc"), " close")))))));
     }
     get el() { return getElement(this); }
     static get style() { return EdsGlobalSearchStyle0; }
@@ -8741,6 +8993,7 @@ class EdsGlobalSearch {
             "currentOrigin": [1, "current-origin"],
             "currentSource": [1, "current-source"],
             "authToken": [1, "auth-token"],
+            "variant": [513],
             "query": [32],
             "results": [32],
             "loading": [32],
@@ -8751,7 +9004,7 @@ class EdsGlobalSearch {
         },
         "$listeners$": [[4, "click", "handleDocumentClick"], [0, "keydown", "handleKeydown"]],
         "$lazyBundleId$": "-",
-        "$attrsToReflect$": []
+        "$attrsToReflect$": [["variant", "variant"]]
     }; }
 }
 
@@ -8814,7 +9067,7 @@ class EdsHeader {
         const logoType = this.variant === 'strong' ? 'negative' : 'positive';
         // Link intent based on header variant
         const linkIntent = this.variant === 'strong' ? 'underlineInverse' : 'underline';
-        return (hAsync("header", { key: '2c1cfca934f70c0d72fa50c163eb14524ca4e5a5', role: "banner", class: `flex items-center justify-between relative z-10 ${classes}` }, hAsync("div", { key: 'b7914ad1431d19a167e39814aa5ab7e6c87ce8e4', class: "w-[250px]" }, hAsync("div", { key: 'efb6efcb51f960e48bf236dd94d308ae12480808', class: "p-[24px]" }, hAsync("eds-logo", { key: 'a8b20eee1ed9577fc06da51e6325875f56025694', variant: logoType, href: this.url }))), this.parsedLinks && (hAsync("nav", { key: '3b322f02b8249091158876559339baf4ba763242', role: "navigation", "aria-label": "Primary", class: "flex-1 flex justify-center items-center hidden md:flex" }, hAsync("ul", { key: '8c74e64f51bddefcc578c09e5d6570f208ecbcf6', class: "flex gap-x-16" }, this.parsedLinks.map((link) => (hAsync("eds-link", { label: link.label, "aria-label": link.label, url: link.url, intent: linkIntent, size: "large", icon: link.icon, external: link.external })))))), hAsync("div", { key: 'c75b261b7bc734a121ac195400d2c1200b58d7ec', class: "w-[250px] flex justify-end items-center" }, hAsync("slot", { key: '1b447037e7158d3e06f68add6084da957ff8c8b0', name: "actions" })), this.menu && (hAsync("div", { key: '8e92ee65ed8a235ad0af4d61588ce6118a92b07f', class: "md:hidden flex overflow-hidden px-16" }, hAsync("eds-button", { key: '8b79d619d4b51dac26f0ff5347909611383cb635', "aria-label": "Menu", intent: this.variant === 'strong' ? 'ghostInverse' : 'ghost', icon: "menu", size: "small", onClick: () => this.handleToggleMenu() })))));
+        return (hAsync("header", { key: 'fd95f6b0126d620ab1d4f58240d471301d607fa5', role: "banner", class: `flex items-center justify-between relative z-10 ${classes}` }, hAsync("div", { key: 'e7b1bd9a146543107d87ff6f4c8575ad63fc3889', class: "w-[250px]" }, hAsync("div", { key: '257a8bf3d0efea39bd0e7f5c92d2a6bcbaa66d48', class: "p-[24px]" }, hAsync("eds-logo", { key: '71365268524d0db6999dc6ff4a9227e388d53cdf', variant: logoType, href: this.url }))), this.parsedLinks && (hAsync("nav", { key: '085b2bd5f667ea7e0be4de77cb4bd3d1a2bb6e3c', role: "navigation", "aria-label": "Primary", class: "flex-1 flex justify-center items-center hidden md:flex" }, hAsync("ul", { key: 'b5c015e6e1fb376f6b48805cc5d0db436234a5fc', class: "flex gap-x-16" }, this.parsedLinks.map((link) => (hAsync("eds-link", { label: link.label, "aria-label": link.label, url: link.url, intent: linkIntent, size: "large", icon: link.icon, external: link.external })))))), hAsync("div", { key: '9bca10c081cd1b8157579fa587615538dc624817', class: "w-[250px] flex justify-end items-center" }, hAsync("slot", { key: '360fb5fe76b41b2513cba2f8705ea5ea91cae9a9', name: "actions" })), this.menu && (hAsync("div", { key: '7feaa2b97062e7ceb94bacc35e61a12edc0b2e54', class: "md:hidden flex overflow-hidden px-16" }, hAsync("eds-button", { key: '706c1668e3b04517cfe0cb92da5b459980986df0', "aria-label": "Menu", intent: this.variant === 'strong' ? 'ghostInverse' : 'ghost', icon: "menu", size: "small", onClick: () => this.handleToggleMenu() })))));
     }
     get hostEl() { return getElement(this); }
     static get style() { return EdsHeaderStyle0; }
@@ -9144,7 +9397,7 @@ class EdsIconBluesky {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: 'c2d0ffef1833f4a53a4447d517c6505ce9be70a4', class: this.class, innerHTML: bluesky });
+        return hAsync("span", { key: 'f2c2ad35173c7bfeae50e5b4de8f59e362d9656f', class: this.class, innerHTML: bluesky });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -9167,7 +9420,7 @@ class EdsIconEu {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: 'c4a043469698de97b7433749599ee04746df7f8e', class: this.class, innerHTML: euSvg });
+        return hAsync("span", { key: '56f0efdfb37b2dd4474dc2e69ef649915a9f4bbc', class: this.class, innerHTML: euSvg });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -9190,7 +9443,7 @@ class EdsIconFacebook {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '8498500cd0da2784b889a7b2b2ca9ff4e8414ab6', class: this.class, innerHTML: facebook });
+        return hAsync("span", { key: '798a3ad6a040dfce879fe62c0a32c83cbd529ad0', class: this.class, innerHTML: facebook });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -9213,7 +9466,7 @@ class EdsIconGitlab {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '41c0a44af7394753c8c656f5a1de86b1446f05e3', class: this.class, innerHTML: gitlabBlack });
+        return hAsync("span", { key: 'd1c7c0c1e3cae3b45377e305792192df46ef064a', class: this.class, innerHTML: gitlabBlack });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -9236,7 +9489,7 @@ class EdsIconLinkedin {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '02a55590ddf6ee6b873370913e9e7cbfe5390c79', class: this.class, innerHTML: linkedin });
+        return hAsync("span", { key: 'd8c97d9140baa6609917021bbc67fc7cca47ee32', class: this.class, innerHTML: linkedin });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -9259,7 +9512,7 @@ class EdsIconMastodon {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '633a54b9f7bdeec8d704d7994de959a8e12ebe4f', class: this.class, innerHTML: mastodon });
+        return hAsync("span", { key: '8498500cd0da2784b889a7b2b2ca9ff4e8414ab6', class: this.class, innerHTML: mastodon });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -9282,7 +9535,7 @@ class EdsIconTwitter {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '6f20d0106096d427556e05b663e3fa133852470e', class: this.class, innerHTML: twitter });
+        return hAsync("span", { key: '1d2f811831f0c876e8b1133c0df03b6f15acaccb', class: this.class, innerHTML: twitter });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -11722,6 +11975,7 @@ class EdsIconWrapper {
         registerInstance(this, hostRef);
         this.name = undefined;
         this.size = 20;
+        this.label = undefined;
     }
     render() {
         const iconSvg = ICONS[this.name];
@@ -11729,7 +11983,8 @@ class EdsIconWrapper {
             console.warn(`Icon "${this.name}" not found in ICONS`);
             return null;
         }
-        return (hAsync(Host, { role: "img" }, hAsync("span", { class: `icon icon--${this.size}`, innerHTML: iconSvg })));
+        const decorative = !this.label;
+        return (hAsync(Host, { role: decorative ? null : 'img', "aria-label": decorative ? null : this.label, "aria-hidden": decorative ? 'true' : null }, hAsync("span", { class: `icon icon--${this.size}`, innerHTML: iconSvg })));
     }
     static get style() { return EdsIconWrapperStyle0; }
     static get cmpMeta() { return {
@@ -11737,7 +11992,8 @@ class EdsIconWrapper {
         "$tagName$": "eds-icon-wrapper",
         "$members$": {
             "name": [1],
-            "size": [2]
+            "size": [2],
+            "label": [1]
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
@@ -11754,7 +12010,7 @@ class EdsIconYoutube {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: 'e07946107d2e0e5a0705bc52d27a436e0f4d5956', class: this.class, innerHTML: youtube });
+        return hAsync("span", { key: '7ebb80fd84ed9ed7c227b1f1ddf213d0502160f9', class: this.class, innerHTML: youtube });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -11830,10 +12086,10 @@ class EdsImg {
             imgOpts['loading'] = 'lazy';
             imgOpts['decoding'] = 'async';
         }
-        return (hAsync("div", { key: '401f46b1ba986cbab6ef1617039f2315fb9d5e6b', class: {
+        return (hAsync("div", { key: '122ae0673a7a2c9afd88cdcf8a83b52c11f0643e', class: {
                 'items-center justify-center': true,
                 'effect-bg-pattern': this.lazyload && this.showBg
-            } }, hAsync("picture", { key: 'cf2b2803efd4f8f0abb40cd427b1b29eff591b15' }, this.formats.map((format) => (hAsync("source", { type: format.type, srcSet: format.srcset, media: format.media, sizes: this.sizes }))), hAsync("img", Object.assign({ key: 'a256bcf9c87284391fdeebcf6dcdb1e95b7fc1f8', ref: (el) => (this.img = el), class: {
+            } }, hAsync("picture", { key: 'b0bb1af0c95375db18bd45453016ee2fd78a6e2a' }, this.formats.map((format) => (hAsync("source", { type: format.type, srcSet: format.srcset, media: format.media, sizes: this.sizes }))), hAsync("img", Object.assign({ key: '2a8500ea92db1a846f0f6dbb41fa664c3d514f19', ref: (el) => (this.img = el), class: {
                 'effect-opacity object-cover object-center': true,
                 'opacity-100': this.loaded,
                 'opacity-0': !this.loaded
@@ -11893,6 +12149,7 @@ class EdsInput {
         this.min = undefined;
         this.max = undefined;
         this.step = undefined;
+        this.inputTabIndex = undefined;
         this.innerVal = '';
         this.maxLengthReached = false;
     }
@@ -11915,7 +12172,7 @@ class EdsInput {
     render() {
         const withIcon = !!this.icon;
         const describedBy = this.hasMessage || this.error ? `${this.name}-error` : '';
-        return (hAsync("div", { key: '5e5aabb89e931e0129ad606f9ed6070e336f9d98', class: "relative flex items-center" }, this.type === 'textarea' ? (hAsync("textarea", { id: this.inputId || this.name, name: this.name, placeholder: this.placeholder, value: this.innerVal.toString(), required: this.required, disabled: this.disabled, class: `min-h-80 input input-textarea ${withIcon ? 'input-with-icon' : ''} ${this.error ? 'input-error' : ''} ${this.extraClass}`, "aria-invalid": this.error ? 'true' : 'false', "aria-describedby": describedBy, maxlength: this.maxLength, onInput: this.handleInput, onChange: this.handleInput })) : this.type === 'select' ? (hAsync("select", { id: this.inputId || this.name, name: this.name, required: this.required, disabled: this.disabled, class: `input input-select ${this.error ? 'input-error' : ''} ${this.extraClass}`, "aria-invalid": this.error ? 'true' : 'false', "aria-describedby": describedBy, onInput: this.handleInput, onChange: this.handleInput }, this.options.map((option) => (hAsync("option", { value: option.value, selected: option.value === this.innerVal, key: option.value }, option.label))))) : (hAsync("input", Object.assign({ id: this.inputId || this.name, name: this.name, placeholder: this.placeholder, value: this.innerVal.toString(), required: this.required, disabled: this.disabled, type: this.type, checked: ['radio', 'checkbox'].includes(this.type) ? this.checked : undefined }, (this.type === 'number'
+        return (hAsync("div", { key: '0261b14034860a2f59dde8de72d6729ec411d2cf', class: "relative flex items-center" }, this.type === 'textarea' ? (hAsync("textarea", { id: this.inputId || this.name, name: this.name, placeholder: this.placeholder, value: this.innerVal.toString(), required: this.required, disabled: this.disabled, class: `min-h-80 input input-textarea ${withIcon ? 'input-with-icon' : ''} ${this.error ? 'input-error' : ''} ${this.extraClass}`, "aria-invalid": this.error ? 'true' : 'false', "aria-describedby": describedBy, maxlength: this.maxLength, onInput: this.handleInput, onChange: this.handleInput })) : this.type === 'select' ? (hAsync("select", { id: this.inputId || this.name, name: this.name, required: this.required, disabled: this.disabled, class: `input input-select ${this.error ? 'input-error' : ''} ${this.extraClass}`, "aria-invalid": this.error ? 'true' : 'false', "aria-describedby": describedBy, onInput: this.handleInput, onChange: this.handleInput }, this.options.map((option) => (hAsync("option", { value: option.value, selected: option.value === this.innerVal, key: option.value }, option.label))))) : (hAsync("input", Object.assign({ id: this.inputId || this.name, name: this.name, placeholder: this.placeholder, value: this.innerVal.toString(), required: this.required, disabled: this.disabled, type: this.type, tabindex: this.inputTabIndex, checked: ['radio', 'checkbox'].includes(this.type) ? this.checked : undefined }, (this.type === 'number'
             ? {
                 min: this.min,
                 max: this.max,
@@ -11926,7 +12183,7 @@ class EdsInput {
               input ${this.type === 'radio' ? 'input-radio' : this.type === 'checkbox' ? 'input-checkbox' : ''}
               ${withIcon && this.type !== 'radio' && this.type !== 'checkbox' ? 'input-icon pl-36' : ''} 
               ${this.error ? 'input-error' : ''}
-              `, "aria-invalid": this.error ? 'true' : 'false', "aria-describedby": describedBy, maxlength: this.maxLength, onInput: this.handleInput, onChange: this.handleInput }))), this.maxLength && this.type === 'textarea' && (hAsync("span", { key: 'b3f75c5b363dc5320d4552ca9d9544975fdd89e0', class: `input-counter f-ui-05 absolute bottom-8 right-8 ${this.maxLengthReached ? 'input-counter-error' : ''}` }, this.maxLength)), this.icon && (hAsync("eds-icon-wrapper", { key: 'e3d18b7c5089e635ee3c4341f039482fdf37f5f1', class: `absolute top-1/2 left-[12px] -translate-y-1/2 ${this.disabled ? 'text-lightest' : 'text-lightest'}`, name: this.icon }))));
+              `, "aria-invalid": this.error ? 'true' : 'false', "aria-describedby": describedBy, maxlength: this.maxLength, onInput: this.handleInput, onChange: this.handleInput }))), this.maxLength && this.type === 'textarea' && (hAsync("span", { key: 'f2a7b410ee586d3266d05d422f3376488392fc6b', class: `input-counter f-ui-05 absolute bottom-8 right-8 ${this.maxLengthReached ? 'input-counter-error' : ''}` }, this.maxLength)), this.icon && (hAsync("eds-icon-wrapper", { key: '37581bbd64652b25a00a401ab359736169814b1f', class: `absolute top-1/2 left-[12px] -translate-y-1/2 ${this.disabled ? 'text-lightest' : 'text-lightest'}`, name: this.icon }))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -11953,6 +12210,7 @@ class EdsInput {
             "min": [2],
             "max": [2],
             "step": [2],
+            "inputTabIndex": [2, "input-tab-index"],
             "innerVal": [32],
             "maxLengthReached": [32]
         },
@@ -12059,7 +12317,7 @@ class EdsInputDropzone {
     }
     render() {
         const dropzoneClass = `eds-input-dropzone ${this.isDragging ? 'dragging' : ''} ${this.disabled ? 'disabled' : ''}`;
-        return (hAsync("div", { key: 'a5f1b90a46927fc9b6396c7aa46b6871233f543a', class: "eds-input-dropzone-container" }, hAsync("input", { key: '3eefd790de82dc7686f1eaeb70f974155830d0e1', ref: (el) => (this.fileInputRef = el), type: "file", id: this.inputId || this.name, name: this.name, class: "eds-input-dropzone-hidden", disabled: this.disabled, required: this.required, multiple: this.multiple, accept: this.accept, onChange: this.handleFileSelect }), hAsync("div", { key: 'e9f2a824fd9df33e943b6b4ab80dff9b6b0c031d', class: dropzoneClass, onClick: this.handleDropzoneClick, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, hAsync("svg", { key: 'f7535c3bb5e80e894520176de395da72732fa714', class: "dropzone-icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, hAsync("path", { key: 'c16c8692d38cf348ec967b2a3617422afff7909a', d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }), hAsync("polyline", { key: '13d7a4c1ae764156957c86c03dbeb4e18f4df227', points: "17 8 12 3 7 8" }), hAsync("line", { key: 'ddd716e98d7defa01360ecaa726696141116c860', x1: "12", y1: "3", x2: "12", y2: "15" })), hAsync("div", { key: '2ab160b911248c5db33b00100b2dbacfeebd6145', class: "dropzone-text" }, hAsync("p", { key: '4dc47aaa591673211e7b6b2fbd84565a3986bf8e', class: "dropzone-primary" }, this.primaryText), hAsync("p", { key: '92d44b3198860ad6509743a7c55a7c1f949fab70', class: "dropzone-secondary" }, this.secondaryText))), this.selectedFiles.length > 0 && (hAsync("div", { key: '84b2403ba93872292c4d15206d9fcbe1a71a21a5', class: "eds-input-dropzone-chips" }, this.selectedFiles.map((item) => (hAsync("div", { key: item.id, class: "eds-input-dropzone-chip" }, this.getFileIcon(item.file.name), hAsync("span", { class: "eds-input-dropzone-chip-name" }, item.file.name), hAsync("span", { class: "eds-input-dropzone-chip-size" }, this.formatFileSize(item.file.size)), hAsync("button", { type: "button", class: "eds-input-dropzone-chip-remove", onClick: () => this.handleRemoveFile(item.id), disabled: this.disabled, "aria-label": `Remove ${item.file.name}` }, hAsync("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }, hAsync("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), hAsync("line", { x1: "6", y1: "6", x2: "18", y2: "18" }))))))))));
+        return (hAsync("div", { key: '8c6d9cdd919e72f5e85a7b01a2db3cb6fadface0', class: "eds-input-dropzone-container" }, hAsync("input", { key: 'fb643c39fa588971f825a01b20e8da6ac2da7d36', ref: (el) => (this.fileInputRef = el), type: "file", id: this.inputId || this.name, name: this.name, class: "eds-input-dropzone-hidden", disabled: this.disabled, required: this.required, multiple: this.multiple, accept: this.accept, onChange: this.handleFileSelect }), hAsync("div", { key: 'fd000cfb95b10eb54798ea5575810692c8cce65d', class: dropzoneClass, onClick: this.handleDropzoneClick, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, hAsync("svg", { key: 'ed7588f87e4182351f5301992ae582df1f21be5e', class: "dropzone-icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, hAsync("path", { key: '9977271ac6bb26c6d642708eb6a7d2f2ca242dcc', d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }), hAsync("polyline", { key: 'f32b1ff2bea2718e075d78985837ba71acf23ce9', points: "17 8 12 3 7 8" }), hAsync("line", { key: '326bc6f0e24c191a26859567653f807c81745a77', x1: "12", y1: "3", x2: "12", y2: "15" })), hAsync("div", { key: 'f880855ecf537d527663101a5348591f975e7074', class: "dropzone-text" }, hAsync("p", { key: '4747da3e157c6b1c3e56774867fc0258e2e77059', class: "dropzone-primary" }, this.primaryText), hAsync("p", { key: '7852be7ecdcdfabf5fed632065b14128941461ee', class: "dropzone-secondary" }, this.secondaryText))), this.selectedFiles.length > 0 && (hAsync("div", { key: '36347980293d2ea800a845a4ab5bb9c28fedc485', class: "eds-input-dropzone-chips" }, this.selectedFiles.map((item) => (hAsync("div", { key: item.id, class: "eds-input-dropzone-chip" }, this.getFileIcon(item.file.name), hAsync("span", { class: "eds-input-dropzone-chip-name" }, item.file.name), hAsync("span", { class: "eds-input-dropzone-chip-size" }, this.formatFileSize(item.file.size)), hAsync("button", { type: "button", class: "eds-input-dropzone-chip-remove", onClick: () => this.handleRemoveFile(item.id), disabled: this.disabled, "aria-label": `Remove ${item.file.name}` }, hAsync("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }, hAsync("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), hAsync("line", { x1: "6", y1: "6", x2: "18", y2: "18" }))))))))));
     }
     get hostEl() { return getElement(this); }
     static get style() { return EdsInputDropzoneStyle0; }
@@ -12206,9 +12464,12 @@ class EdsInputField {
         return [];
     }
     render() {
-        const inputOpts = Object.assign({ name: this.name, id: this.inputId, placeholder: this.placeholder, disabled: this.disabled, onInput: this.handleNativeInput, onChange: this.handleNativeChange, type: this.type, required: this.required, value: this.value, error: this.error, icon: this.icon, checked: this.checked }, (this.type === 'number' ? { min: this.min, max: this.max, step: this.step } : {}));
-        return (hAsync("div", { key: '1568054341b82bcaa01ffe4a48092d5f25a639ed' }, this.type === 'checkbox' || this.type === 'radio' ? (this.parsedOptions.length > 0 ? (hAsync("fieldset", { class: "space-y-4" }, (this.label || this.hint) && (hAsync("div", { class: "flex justify-between mb-4" }, this.label && (hAsync("eds-input-label", { name: this.inputId || this.name, label: this.label, required: this.required })), this.hint && (hAsync("p", { id: `${this.name}-hint`, class: "f-ui-05 text-lighter mt-8 ml-8" }, this.hint)))), this.parsedOptions.map((option) => (hAsync("div", { class: "flex items-center gap-x-4 gap-y-4", key: option.value }, hAsync("eds-input", Object.assign({}, inputOpts, { value: option.value, checked: typeof this.value === 'string' && this.value.split(',').includes(String(option.value)) })), hAsync("label", { htmlFor: this.name, class: `input-label-options ${this.disabled ? 'text-lighter' : ''}` }, option.label)))))) : (hAsync("div", { class: "flex items-center gap-x-8" }, hAsync("eds-input", Object.assign({}, inputOpts, { value: this.value, checked: this.value === 'on' || this.checked })), this.label && (hAsync("eds-input-label", { name: this.inputId || this.name, label: this.label, disabled: this.disabled, required: this.required }))))) : (hAsync("div", null, (this.label || this.hint) && (hAsync("div", { class: "flex justify-between mb-4" }, this.label && (hAsync("eds-input-label", { name: this.inputId || this.name, label: this.label, disabled: this.disabled, required: this.required })), this.hint && (hAsync("p", { id: `${this.name}-hint`, class: "f-ui-05 text-lighter mt-8 ml-8" }, this.hint)))), this.type === 'select' ? (hAsync("eds-input-select", Object.assign({}, inputOpts, { options: this.parsedOptions }))) : this.type === 'file' ? (hAsync("eds-input-file", { name: this.name, inputId: this.inputId, disabled: this.disabled, required: this.required, multiple: true, onEdsfile: this.handleFileChange })) : this.type === 'dropzone' ? (hAsync("eds-input-dropzone", { name: this.name, inputId: this.inputId, disabled: this.disabled, required: this.required, multiple: true, onEdsfile: this.handleFileChange })) : this.type === 'search' ? (hAsync("eds-input-search", { name: "search-box" })) : this.type === 'range' ? ((() => {
-            var _a, _b, _c;
+        const inputOpts = Object.assign({ name: this.name, id: this.inputId, placeholder: this.placeholder, disabled: this.disabled, onInput: this.handleNativeInput, onChange: this.handleNativeChange, type: this.type, required: this.required, value: this.value, error: this.error,
+            // Icons are only supported on text inputs for now — ignore the prop for
+            // every other type so e.g. number/select/checkbox never render one.
+            icon: this.type === 'text' ? this.icon : undefined, checked: this.checked }, (this.type === 'number' ? { min: this.min, max: this.max, step: this.step } : {}));
+        return (hAsync("div", { key: '2072cce16b572431b41363beff779d8631de7abc' }, this.type === 'checkbox' || this.type === 'radio' ? (this.parsedOptions.length > 0 ? (hAsync("fieldset", { class: "space-y-4" }, (this.label || this.hint) && (hAsync("div", { class: "flex justify-between mb-4" }, this.label && (hAsync("eds-input-label", { name: this.inputId || this.name, label: this.label, required: this.required })), this.hint && (hAsync("p", { id: `${this.name}-hint`, class: "f-ui-05 text-lighter mt-8 ml-8" }, this.hint)))), this.parsedOptions.map((option) => (hAsync("div", { class: "flex items-center gap-x-4 gap-y-4", key: option.value }, hAsync("eds-input", Object.assign({}, inputOpts, { inputId: `${this.inputId || this.name}-${option.value}`, inputTabIndex: 0, value: option.value, checked: typeof this.value === 'string' && this.value.split(',').includes(String(option.value)) })), hAsync("label", { htmlFor: `${this.inputId || this.name}-${option.value}`, class: `input-label-options ${this.disabled ? 'text-lighter' : ''}` }, option.label)))))) : (hAsync("div", { class: "flex items-center gap-x-8" }, hAsync("eds-input", Object.assign({}, inputOpts, { inputTabIndex: 0, value: this.value, checked: this.value === 'on' || this.checked })), this.label && (hAsync("eds-input-label", { name: this.inputId || this.name, label: this.label, disabled: this.disabled, required: this.required }))))) : (hAsync("div", null, (this.label || this.hint) && (hAsync("div", { class: "flex justify-between mb-4" }, this.label && (hAsync("eds-input-label", { name: this.inputId || this.name, label: this.label, disabled: this.disabled, required: this.required })), this.hint && (hAsync("p", { id: `${this.name}-hint`, class: "f-ui-05 text-lighter mt-8 ml-8" }, this.hint)))), this.type === 'select' ? (hAsync("eds-input-select", Object.assign({}, inputOpts, { options: this.parsedOptions }))) : this.type === 'file' ? (hAsync("eds-input-file", { name: this.name, inputId: this.inputId, disabled: this.disabled, required: this.required, multiple: true, onEdsfile: this.handleFileChange })) : this.type === 'dropzone' ? (hAsync("eds-input-dropzone", { name: this.name, inputId: this.inputId, disabled: this.disabled, required: this.required, multiple: true, onEdsfile: this.handleFileChange })) : this.type === 'range' ? ((() => {
+            var _a, _b, _c, _d, _e, _f;
             const rangeProps = {
                 name: inputOpts.name,
                 inputId: inputOpts.id || inputOpts.name,
@@ -12219,8 +12480,11 @@ class EdsInputField {
             };
             const opt = this.parsedOptions;
             const numberValue = typeof this.value === 'string' ? parseFloat(this.value) : this.value;
-            return (hAsync("eds-input-range", Object.assign({}, rangeProps, { min: (_a = opt[0]) === null || _a === void 0 ? void 0 : _a.value, max: (_b = opt[1]) === null || _b === void 0 ? void 0 : _b.value, step: (_c = opt[2]) === null || _c === void 0 ? void 0 : _c.value, value: numberValue })));
-        })()) : (hAsync("eds-input", Object.assign({}, inputOpts))))), hAsync("div", { key: '5df838f8bf73bc9e0dfa0792f76ad1b958f3d1fc', class: "mt-6" }, hAsync("eds-input-footer", { key: 'daf5d0fd8d9cca3241e760b740a47e2663c3e665', id: `${this.name}-footer`, name: this.name, message: this.message, "error-message": this.errorMessage, error: this.error, link: this.link }))));
+            // Prefer the explicit min/max/step props (consistent with
+            // type="number"); fall back to options[0..2].value for
+            // backward compatibility with existing range fields.
+            return (hAsync("eds-input-range", Object.assign({}, rangeProps, { min: (_a = this.min) !== null && _a !== void 0 ? _a : (_b = opt[0]) === null || _b === void 0 ? void 0 : _b.value, max: (_c = this.max) !== null && _c !== void 0 ? _c : (_d = opt[1]) === null || _d === void 0 ? void 0 : _d.value, step: (_e = this.step) !== null && _e !== void 0 ? _e : (_f = opt[2]) === null || _f === void 0 ? void 0 : _f.value, value: numberValue })));
+        })()) : (hAsync("eds-input", Object.assign({}, inputOpts))))), hAsync("div", { key: 'f3ab7ef07c5c35f6d5e5d7a3ec35f98fe133ab5b', class: "mt-6" }, hAsync("eds-input-footer", { key: 'a72af69114cd3916e9ffa6ca8a65dced572dadf7', id: `${this.name}-footer`, name: this.name, message: this.message, "error-message": this.errorMessage, error: this.error, link: this.link }))));
     }
     static get delegatesFocus() { return true; }
     get hostEl() { return getElement(this); }
@@ -12325,7 +12589,7 @@ class EdsInputFile {
     }
     render() {
         const effectiveLabel = this.buttonLabel || (this.multiple ? 'Choose Files' : 'Choose File');
-        return (hAsync("div", { key: 'c4c8f06b7d911cc7b9aa44a54bc1ec1144fc7901', class: "eds-input-file-container" }, hAsync("input", { key: 'bf4d4f3b3a49a2b386780fd6d65056e2bfee327d', ref: (el) => (this.fileInputRef = el), type: "file", id: this.inputId || this.name, name: this.name, class: "eds-input-file-hidden", disabled: this.disabled, required: this.required, multiple: this.multiple, accept: this.accept, onChange: this.handleFileSelect }), hAsync("button", { key: 'cb4447bab24a31ba0ab7ab852041a9117a4c8d16', type: "button", class: "eds-input-file-btn", onClick: this.handleButtonClick, disabled: this.disabled }, hAsync("svg", { key: 'b5a98574c8b044b63bf4d6b5384f691d78179b25', viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, hAsync("path", { key: '9dcd73b3ea6b947052417dedbdedfbe9c1683d11', d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }), hAsync("polyline", { key: '17442a8caa70a37f77839b4a313a36aa8324d54a', points: "17 8 12 3 7 8" }), hAsync("line", { key: 'de51aa410bd793d708280bc398766859afa59ff5', x1: "12", y1: "3", x2: "12", y2: "15" })), effectiveLabel), this.selectedFiles.length > 0 && (hAsync("div", { key: '179a1541b71508f3bf78760079d04b2d98a8c7ec', class: "eds-input-file-chips" }, this.selectedFiles.map((item) => (hAsync("div", { key: item.id, class: "eds-input-file-chip" }, this.getFileIcon(item.file.name), hAsync("span", { class: "eds-input-file-chip-name" }, item.file.name), hAsync("span", { class: "eds-input-file-chip-size" }, this.formatFileSize(item.file.size)), hAsync("button", { type: "button", class: "eds-input-file-chip-remove", onClick: () => this.handleRemoveFile(item.id), disabled: this.disabled, "aria-label": `Remove ${item.file.name}` }, hAsync("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }, hAsync("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), hAsync("line", { x1: "6", y1: "6", x2: "18", y2: "18" }))))))))));
+        return (hAsync("div", { key: 'e02d98fbc01dbe7a89eeb3010f966ed4a373ede6', class: "eds-input-file-container" }, hAsync("input", { key: '2013826fda9453aade4528c9f051aac98780662f', ref: (el) => (this.fileInputRef = el), type: "file", id: this.inputId || this.name, name: this.name, class: "eds-input-file-hidden", disabled: this.disabled, required: this.required, multiple: this.multiple, accept: this.accept, onChange: this.handleFileSelect }), hAsync("button", { key: 'f5e5cf91376ccb69b39ef3c9b11095aca8bfb728', type: "button", class: "eds-input-file-btn", onClick: this.handleButtonClick, disabled: this.disabled }, hAsync("svg", { key: '563066375b42d0a8c14f14ac9fdfb587539f4e76', viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, hAsync("path", { key: 'ebe5549fffa0c2453ab98891da75a464c09e9fa2', d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }), hAsync("polyline", { key: '69036b82e15103e481770d0ef2c500b0dcad0399', points: "17 8 12 3 7 8" }), hAsync("line", { key: 'e0531be95796ec6dc7f9fe359e4736a15a0e3640', x1: "12", y1: "3", x2: "12", y2: "15" })), effectiveLabel), this.selectedFiles.length > 0 && (hAsync("div", { key: '62590fb46cee89d2524f1ede71c7af341c3e426a', class: "eds-input-file-chips" }, this.selectedFiles.map((item) => (hAsync("div", { key: item.id, class: "eds-input-file-chip" }, this.getFileIcon(item.file.name), hAsync("span", { class: "eds-input-file-chip-name" }, item.file.name), hAsync("span", { class: "eds-input-file-chip-size" }, this.formatFileSize(item.file.size)), hAsync("button", { type: "button", class: "eds-input-file-chip-remove", onClick: () => this.handleRemoveFile(item.id), disabled: this.disabled, "aria-label": `Remove ${item.file.name}` }, hAsync("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }, hAsync("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), hAsync("line", { x1: "6", y1: "6", x2: "18", y2: "18" }))))))))));
     }
     get hostEl() { return getElement(this); }
     static get style() { return EdsInputFileStyle0; }
@@ -12349,7 +12613,7 @@ class EdsInputFile {
     }; }
 }
 
-const edsInputFooterCss = "p{margin:0}.text-error{color:var(--red-700)}.flex{display:flex}.items-center{align-items:center}.f-ui-04{font-family:var(--f-ui-04-fontFamily);font-weight:var(--f-ui-04-fontWeight);font-size:var(--f-ui-04-fontSize);line-height:var(--f-ui-04-lineHeight);letter-spacing:var(--f-ui-04-letterSpacing)}.ml-4{margin-left:0.25rem}.pt-4{padding-top:0.25rem}.mb-4{margin-bottom:0.25rem}.f-ui-05{font-family:var(--f-ui-05-fontFamily);font-weight:var(--f-ui-05-fontWeight);font-size:var(--f-ui-05-fontSize);line-height:var(--f-ui-05-lineHeight);letter-spacing:var(--f-ui-05-letterSpacing)}.text-lighter{color:var(--grey-600)}.effect-color{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.hover\\:text-lighter:hover{color:var(--grey-600)}.underline{text-decoration-line:underline}.underline-offset-4{text-underline-offset:4px}";
+const edsInputFooterCss = "p{margin:0}.eds-desc-link{position:relative;display:inline-block;color:var(--brand-black);text-decoration:none}.eds-desc-link::after{content:'';position:absolute;bottom:-2px;left:0;width:0;height:2px;background-color:var(--brand-green);transition:width 0.3s ease}.eds-desc-link:hover::after{width:100%}.eds-desc-link:focus-visible::after{width:0}eds-link{--f-ui-02-fontSize:var(--f-ui-04-fontSize)}.text-error{color:var(--red-700)}.flex{display:flex}.items-center{align-items:center}.f-ui-04{font-family:var(--f-ui-04-fontFamily);font-weight:var(--f-ui-04-fontWeight);font-size:var(--f-ui-04-fontSize);line-height:var(--f-ui-04-lineHeight);letter-spacing:var(--f-ui-04-letterSpacing)}.ml-4{margin-left:0.25rem}.pt-4{padding-top:0.25rem}.mb-4{margin-bottom:0.25rem}.f-ui-05{font-family:var(--f-ui-05-fontFamily);font-weight:var(--f-ui-05-fontWeight);font-size:var(--f-ui-05-fontSize);line-height:var(--f-ui-05-lineHeight);letter-spacing:var(--f-ui-05-letterSpacing)}.text-lighter{color:var(--grey-600)}.effect-color{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.hover\\:text-lighter:hover{color:var(--grey-600)}.underline{text-decoration-line:underline}.underline-offset-4{text-underline-offset:4px}";
 var EdsInputFooterStyle0 = edsInputFooterCss;
 
 class EdsInputFooter {
@@ -12362,7 +12626,7 @@ class EdsInputFooter {
         this.link = undefined;
     }
     render() {
-        return (hAsync("div", { key: 'b6e571eae554f1292e897d99443ea03b6dfa4fe3' }, this.error && this.errorMessage && (hAsync("div", { key: '9240b3db2aee19b5cbc1c54aa7a90994c23580d0', id: `error_${this.name}`, class: "text-error flex items-center" }, hAsync("eds-icon-wrapper", { key: '68b17235d0396119275c9b2a883bb47ee365c266', name: "warning", size: 20 }), hAsync("p", { key: 'bfb1721ddcc7ad63583e56911b8c4a31f1147c51', class: "f-ui-04 ml-4 mb-4 pt-4", innerHTML: this.errorMessage }))), this.message && hAsync("p", { key: '390c9ea7b3b2754a1a090c9f3f3ec6996a8f0945', id: `desc_${this.name}`, class: "f-ui-05 text-lighter", innerHTML: this.message }), this.link && (hAsync("eds-link", { key: '0777fb8b099d5cc7fa2902bf1b741f28592515a1', label: this.link.label, url: this.link.url, intent: "underline", size: "small", external: true }))));
+        return (hAsync("div", { key: '866e375b5dd1d9c958f2255537e919a8c1f25dc7' }, this.error && this.errorMessage && (hAsync("div", { key: '95d11c9cbb7746cc727ad9e037d00a28d9475bfc', id: `error_${this.name}`, class: "text-error flex items-center" }, hAsync("eds-icon-wrapper", { key: 'face7f905ffa7c5f4dc7a7e6825d185e0d6b7901', name: "warning", size: 20 }), hAsync("p", { key: '2011af93e06df1d91972843a510e843763f53b0b', class: "f-ui-04 ml-4 mb-4 pt-4", innerHTML: this.errorMessage }))), this.message && hAsync("p", { key: '39d6833a30e7b93f75154a14bee1e6b4500575cb', id: `desc_${this.name}`, class: "f-ui-04 text-lighter", innerHTML: safeInlineFormat(this.message) }), this.link && (hAsync("eds-link", { key: 'bfbf95e704574ada6f857ca08a90409ab38c1a5e', label: this.link.label, url: this.link.url, intent: "underline", size: "small", external: true }))));
     }
     static get style() { return EdsInputFooterStyle0; }
     static get cmpMeta() { return {
@@ -12393,7 +12657,7 @@ class EdsInputLabel {
         this.disabled = false;
     }
     render() {
-        return (hAsync("label", { key: '7790bae024ee253c12b47ee43dd7697329ff5602', htmlFor: this.name, class: `input-label ${this.disabled ? 'text-lighter' : ''}` }, this.label, this.required && (hAsync("span", { key: '1f8e72cee3848171c0f70ce7564524c9f2646eeb' }, hAsync("span", { key: '5ac8ccbe9b984c54ae3a556ea0dc09d6fa625f24', "aria-hidden": "true" }, "*"), hAsync("span", { key: 'a562b41bce8a4e671596266c7705a98f5b2252d0', class: "sr-only" }, "required")))));
+        return (hAsync("label", { key: '40867ae01e94ab7a69b6f82658e4ee1b1e5b87cf', htmlFor: this.name, class: `input-label ${this.disabled ? 'text-lighter' : ''}` }, this.label, this.required && (hAsync("span", { key: 'e3cfc44ea2a7f53f51c544648b3c635557cb8248' }, hAsync("span", { key: 'ff7559b58cb22ce2a3066ed15e77f6088f299aaa', "aria-hidden": "true" }, "*"), hAsync("span", { key: '2c831682aae410ac71589171e2b04981c60052bb', class: "sr-only" }, "required")))));
     }
     static get style() { return EdsInputLabelStyle0; }
     static get cmpMeta() { return {
@@ -12461,7 +12725,7 @@ class EdsInputRange {
     render() {
         var _a;
         const currentValue = (_a = this.sliderVal) !== null && _a !== void 0 ? _a : Math.round(this.min + (this.max - this.min) / 2);
-        return (hAsync("div", { key: '9be1a9d4241844c03d7e2b851ebc5ce181bfadf6', class: "relative flex flex-col items-start" }, hAsync("input", { key: '746c10f7a466a6b498f57812dcb6d9b9ff1e685d', id: this.inputId || this.name, name: this.name, min: this.min, max: this.max, step: this.step, value: currentValue, required: this.required, disabled: this.disabled, type: "range", class: "w-full py-6 input", tabindex: "0", role: "slider", "aria-describedby": `desc_${this.name}`, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": currentValue, onInput: this.onInput, onChange: this.onChange }), hAsync("p", { key: '97b516ab9c20d9b5c7a783b369081b29eb3a83f0', id: `desc_${this.name}`, class: "block f-ui-05 mt-4 text-light" }, "Current value: ", currentValue)));
+        return (hAsync("div", { key: '231ae0f34900dfa3b8edeb9745ce07220735c613', class: "relative flex flex-col items-start" }, hAsync("input", { key: '2cbfbbb410694a4764f44c26a74f4cbca9b98f3c', id: this.inputId || this.name, name: this.name, min: this.min, max: this.max, step: this.step, value: currentValue, required: this.required, disabled: this.disabled, type: "range", class: "w-full py-6 input", tabindex: "0", role: "slider", "aria-describedby": `desc_${this.name}`, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": currentValue, onInput: this.onInput, onChange: this.onChange }), hAsync("p", { key: '8e7036cbaeebb62c6cd4b7f2105d3fa487ad463e', id: `desc_${this.name}`, class: "block f-ui-05 mt-4 text-light" }, "Current value: ", currentValue)));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -12556,7 +12820,7 @@ class EdsInputSearch {
         return this.inputElement;
     }
     render() {
-        return (hAsync("div", { key: '849afaf3483b07fd2579d1138fbc1c1eee3930be', class: "relative flex items-center" }, hAsync("eds-icon-wrapper", { key: '1b9a30ee46d4575116b585efe8a2d0c6d6b83b39', name: "search", class: "absolute top-1/2 left-[14px] -translate-y-1/2 text-lightest", "aria-hidden": "true" }), hAsync("input", { key: '174fc93f10851aec47cb440895105c34600de601', id: this.inputId || this.name, name: this.name, placeholder: this.placeholder, value: this.value || '', required: this.required, disabled: this.disabled, type: "search", "aria-label": this.placeholder, class: `input pl-36 ${this.decorate}`,
+        return (hAsync("div", { key: '52676b3559e14b5153f7d8f0fa6cd12e49354d87', class: "relative flex items-center" }, hAsync("eds-icon-wrapper", { key: '754e8753607c01dab63d156d306f3325547049aa', name: "search", class: "absolute top-1/2 left-[14px] -translate-y-1/2 text-lightest", "aria-hidden": "true" }), hAsync("input", { key: 'b49d523195711316c0817de67776d379a6c7248b', id: this.inputId || this.name, name: this.name, placeholder: this.placeholder, value: this.value || '', required: this.required, disabled: this.disabled, type: "search", "aria-label": this.placeholder, class: `input pl-36 ${this.decorate}`,
             //onInput={this.onInput}
             onChange: this.onChange })));
     }
@@ -12610,12 +12874,12 @@ class EdsInputSelect {
         const selectId = this.inputId || this.name;
         const placeholderText = this.placeholder || `Pick from the list`;
         const describedBy = this.hasMessage || this.error ? `${this.name}-error` : undefined;
-        return (hAsync("div", { key: 'c2f809a88f8b9eab6a36b86bb49daaa39ac1a832', class: "relative" }, hAsync("select", { key: '0847d6526bd118db744627279d96a979dafd19d1', id: selectId, name: this.name, class: {
+        return (hAsync("div", { key: '8365ffbc8f6f6386edfc1626d16c9152fd3cce9f', class: "relative" }, hAsync("select", { key: '52e712898a3251cea5447a379886449175e7c8b8', id: selectId, name: this.name, class: {
                 input: true,
                 'input-error': this.error,
                 'px-4': true,
                 'py-2': true
-            }, "aria-invalid": this.error ? 'true' : 'false', "aria-describedby": describedBy, disabled: this.disabled, required: this.required, onChange: this.handleChange }, hAsync("option", { key: '1d66602cc92028fddfd047bb2fc79c8f3602ba8e', value: "", disabled: true, selected: !this.value || this.value === '' }, placeholderText), this.options.map((opt, index) => (hAsync("option", { key: index, value: opt.value, selected: opt.value === this.value }, opt.label)))), hAsync("span", { key: '40f750ff55b0ac5707c4010868835c6d82537d17', class: "bg-dark rounded-xs absolute top-1/2 right-[6px] flex h-28 w-28 -translate-y-1/2 items-center justify-center" }, hAsync("eds-icon-wrapper", { key: 'ef8c068e287819be7228940bfbe0b8b923e22087', class: "w-20 h-20", name: "chevron-right" }))));
+            }, "aria-invalid": this.error ? 'true' : 'false', "aria-describedby": describedBy, disabled: this.disabled, required: this.required, onChange: this.handleChange }, hAsync("option", { key: 'd52c376ffb683abc0dec72177dba445273d148f7', value: "", disabled: true, selected: !this.value || this.value === '' }, placeholderText), this.options.map((opt, index) => (hAsync("option", { key: index, value: opt.value, selected: opt.value === this.value }, opt.label)))), hAsync("span", { key: 'fecbcb47793f8a57de44711b33d3650be5297aa7', class: "bg-dark rounded-xs absolute top-1/2 right-[6px] flex h-28 w-28 -translate-y-1/2 items-center justify-center" }, hAsync("eds-icon-wrapper", { key: '4fda1345a62eeb212093057382d877f31bb6112d', class: "w-20 h-20", name: "chevron-right" }))));
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -12637,6 +12901,172 @@ class EdsInputSelect {
     }; }
 }
 
+const edsKgLearningResourcesCss = ":host{display:block;font-family:var(--plex-sans, 'IBM Plex Sans', system-ui, sans-serif);color:var(--brand-black, #07140D)}.lr-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:0.75rem;margin-bottom:1.5rem}.lr-heading{font-family:var(--inter, 'Inter', sans-serif);font-weight:300;font-size:1.75rem;line-height:110%;margin:0;color:var(--brand-black, #07140D)}.summary{display:flex;gap:0.5rem}.filters{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:0.75rem;margin-bottom:1.5rem;align-items:flex-end}.filter-search{grid-column:span 2}.filter-select{grid-column:span 1}.accordion-list{display:flex;flex-direction:column;gap:0.5rem}.resources-content{padding-top:0.5rem}.kg-link{margin-bottom:1rem}.resources-table{width:100%;border-collapse:collapse;font-size:0.875rem}.resources-table thead th{text-align:left;font-family:var(--plex-sans, 'IBM Plex Sans', system-ui, sans-serif);font-weight:500;font-size:0.75rem;text-transform:uppercase;letter-spacing:0.04em;color:var(--grey-dark, #7A7B7A);padding:0.5rem 0.75rem;border-bottom:1px solid rgba(0, 0, 0, 0.1)}.resource-row{transition:background-color 0.2s ease}.resource-row--clickable{cursor:pointer}.resource-row--clickable:hover{background-color:rgba(0, 255, 157, 0.04)}.resource-row td{padding:0.625rem 0.75rem;border-bottom:1px solid rgba(0, 0, 0, 0.04);vertical-align:top}.resource-row:last-child td{border-bottom:none}.resource-name{font-weight:500;font-size:1.0625rem;color:var(--brand-black, #07140D);transition:color 0.2s ease}.resource-row--clickable:hover .resource-name{color:var(--brand-green-dark, #00C87B)}.resource-desc{margin:0.25rem 0 0;font-size:0.9375rem;color:var(--grey-dark, #7A7B7A);line-height:145%;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.col-name{width:auto}.col-type{width:160px;white-space:nowrap}.col-level{width:110px;white-space:nowrap}.loading{position:relative;min-height:8rem;padding:1rem 1.25rem;color:var(--grey-dark, #7A7B7A);font-size:0.9375rem;border:1px solid rgba(0, 0, 0, 0.08);border-radius:0.25rem;background-color:rgba(0, 0, 0, 0.02)}.no-results{padding:2rem;text-align:center;color:var(--grey-dark, #7A7B7A);font-size:0.875rem}@media (max-width: 750px){.lr-header{flex-direction:column;align-items:flex-start}.filters{grid-template-columns:1fr}.filter-search,.filter-select{grid-column:span 1}.col-type,.col-level{width:auto}.resources-table thead{display:none}.resource-row{display:flex;flex-wrap:wrap;gap:0.375rem;padding:0.625rem 0;border-bottom:1px solid rgba(0, 0, 0, 0.04)}.resource-row td{border:none;padding:0}.col-name{width:100%}}";
+var EdsKgLearningResourcesStyle0 = edsKgLearningResourcesCss;
+
+let cachedData = null;
+let cacheTimestamp = 0;
+const CACHE_TTL = 10 * 60 * 1000;
+class EdsKgLearningResources {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.apiEndpoint = '/api/v1/kg/learning-resources/cached';
+        this.resolveNames = true;
+        this.size = 500;
+        this.heading = '';
+        this.variant = 'inverse';
+        this.loading = false;
+        this.error = '';
+        this.software = [];
+        this.meta = null;
+        this.filterType = '';
+        this.filterLevel = '';
+        this.searchQuery = '';
+    }
+    componentWillLoad() {
+        this.fetchData();
+    }
+    async fetchData() {
+        const now = Date.now();
+        if (cachedData && (now - cacheTimestamp) < CACHE_TTL) {
+            this.software = cachedData;
+            return;
+        }
+        this.loading = true;
+        this.error = '';
+        try {
+            const params = new URLSearchParams({
+                size: this.size.toString(),
+                resolve_names: this.resolveNames.toString(),
+            });
+            const response = await fetch(`${this.apiEndpoint}?${params}`);
+            if (!response.ok) {
+                throw new Error(`Failed to fetch: ${response.statusText}`);
+            }
+            const data = await response.json();
+            this.software = data.data || [];
+            this.meta = data.meta || null;
+            cachedData = this.software;
+            cacheTimestamp = now;
+        }
+        catch (err) {
+            this.error = err instanceof Error ? err.message : 'Failed to load learning resources';
+        }
+        finally {
+            this.loading = false;
+        }
+    }
+    getFilteredSoftware() {
+        let filtered = this.software;
+        if (this.filterType) {
+            filtered = filtered.filter(sw => sw.learning_resources_types.includes(this.filterType));
+        }
+        if (this.filterLevel) {
+            filtered = filtered.filter(sw => sw.learning_resources_levels.includes(this.filterLevel));
+        }
+        if (this.searchQuery) {
+            const q = this.searchQuery.toLowerCase();
+            filtered = filtered.filter(sw => sw.name.toLowerCase().includes(q) ||
+                sw.learning_resources.some(lr => {
+                    var _a, _b;
+                    return ((_a = lr.name) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes(q)) ||
+                        ((_b = lr.abstract) === null || _b === void 0 ? void 0 : _b.toLowerCase().includes(q));
+                }));
+        }
+        return filtered;
+    }
+    getFilteredResources(resources) {
+        let filtered = resources;
+        if (this.filterType) {
+            filtered = filtered.filter(lr => lr.type === this.filterType);
+        }
+        if (this.filterLevel) {
+            filtered = filtered.filter(lr => lr.educational_level === this.filterLevel);
+        }
+        return filtered;
+    }
+    /* TODO: Uncomment when filters are enabled
+    private getAllTypes(): string[] {
+      const types = new Set<string>();
+      this.software.forEach(sw =>
+        sw.learning_resources_types.forEach(t => types.add(t))
+      );
+      return Array.from(types).sort();
+    }
+  
+    private getAllLevels(): string[] {
+      const levels = new Set<string>();
+      this.software.forEach(sw =>
+        sw.learning_resources_levels.forEach(l => levels.add(l))
+      );
+      return Array.from(levels).sort();
+    }
+    */
+    getTagIntent(type) {
+        const map = {
+            'interactive tutorial': 'brand',
+            'video tutorial': 'primary',
+            'user documentation': 'dark',
+            'video presentation': 'inverse',
+            'slide deck': 'strong',
+        };
+        return map[type] || 'brand-dark';
+    }
+    getLevelTagIntent(level) {
+        const map = {
+            'beginner': 'brand',
+            'intermediate': 'dark',
+            'advanced': 'strong',
+        };
+        return map[level] || 'brand-dark';
+    }
+    renderAccordionDescription(sw) {
+        const count = sw.learning_resources_count;
+        const types = sw.learning_resources_types.join(', ');
+        return `${count} resource${count !== 1 ? 's' : ''} — ${types}`;
+    }
+    renderResources(sw) {
+        const filtered = this.getFilteredResources(sw.learning_resources);
+        return (hAsync("div", { class: "resources-content" }, sw.kg_search_url && (hAsync("div", { class: "kg-link" }, hAsync("eds-link", { url: sw.kg_search_url, label: "View in EBRAINS Knowledge Graph", intent: "cta", external: true }))), hAsync("table", { class: "resources-table" }, hAsync("thead", null, hAsync("tr", null, hAsync("th", { class: "col-name" }, "Name"), hAsync("th", { class: "col-type" }, "Type"), hAsync("th", { class: "col-level" }, "Level"))), hAsync("tbody", null, filtered.map(lr => (hAsync("tr", { class: `resource-row ${lr.iri ? 'resource-row--clickable' : ''}`, onClick: () => {
+                if (lr.iri) {
+                    window.open(lr.iri, '_blank', 'noopener,noreferrer');
+                }
+            } }, hAsync("td", { class: "col-name" }, hAsync("span", { class: "resource-name" }, lr.name || 'Untitled'), lr.abstract && (hAsync("p", { class: "resource-desc" }, lr.abstract))), hAsync("td", { class: "col-type" }, lr.type && (hAsync("eds-tag", { label: lr.type, intent: this.getTagIntent(lr.type), size: "medium" }))), hAsync("td", { class: "col-level" }, lr.educational_level && (hAsync("eds-tag", { label: lr.educational_level, intent: this.getLevelTagIntent(lr.educational_level), size: "medium" })))))))), filtered.length === 0 && (hAsync("p", { class: "no-results" }, "No resources match the current filters."))));
+    }
+    render() {
+        // Always render the same outer scaffold (header + content area) so the
+        // heading sits in identical position across loading / error / loaded
+        // states and the spinner appears where the accordion list will render.
+        const filtered = !this.loading && !this.error ? this.getFilteredSoftware() : [];
+        // const allTypes = this.getAllTypes();
+        // const allLevels = this.getAllLevels();
+        return (hAsync("div", { key: '154b59a74cb32996f1bee10ee7758d916bebdd43', class: "lr-container" }, hAsync("div", { key: '0c5c04b65f0c4e4c032b1b1a7d96e98fd6775563', class: "lr-header" }, hAsync("h2", { key: '01ef66537b31a63521f0406cd2ec9976b532d18f', class: "lr-heading" }, this.heading)), this.loading && (hAsync("div", { key: '134ca8e5f7349127b40aa1ae0967cd12dc12cc0b', class: "loading", role: "status", "aria-live": "polite" }, hAsync("eds-spinner", { key: 'a3a0621b6ea041f8da4ef6f36c1688974f3c5591', size: "sm", variant: "primary", background: "transparent", message: "Loading learning resources..." }))), this.error && !this.loading && (hAsync("eds-alert", { key: 'a0334442c175374daf8ce2be4da60ac004e4d0e2', intent: "error", message: this.error })), !this.loading && !this.error && (hAsync("div", { key: 'f2b8244f1ee5c052cabd5eec8cbfc36d06f4d08d', class: "accordion-list" }, filtered.map(sw => (hAsync("eds-accordion", { heading: sw.name, description: this.renderAccordionDescription(sw), variant: this.variant, icon: "book", switchBg: true, clampText: false }, this.renderResources(sw)))), filtered.length === 0 && (hAsync("p", { key: 'd572c9eb76279c93ba2bd5f0fae20b4e1d9fc816', class: "no-results" }, "No software matches the current filters."))))));
+    }
+    get el() { return getElement(this); }
+    static get style() { return EdsKgLearningResourcesStyle0; }
+    static get cmpMeta() { return {
+        "$flags$": 9,
+        "$tagName$": "eds-kg-learning-resources",
+        "$members$": {
+            "apiEndpoint": [1, "api-endpoint"],
+            "resolveNames": [4, "resolve-names"],
+            "size": [2],
+            "heading": [1],
+            "variant": [1],
+            "loading": [32],
+            "error": [32],
+            "software": [32],
+            "meta": [32],
+            "filterType": [32],
+            "filterLevel": [32],
+            "searchQuery": [32]
+        },
+        "$listeners$": undefined,
+        "$lazyBundleId$": "-",
+        "$attrsToReflect$": []
+    }; }
+}
+
 const edsKgWebServicesSelectCss = ".kg-web-services-select-container{width:100%}.loading-container,.error-container{width:100%}";
 var EdsKgWebServicesSelectStyle0 = edsKgWebServicesSelectCss;
 
@@ -13047,7 +13477,7 @@ class EdsLink {
         const labelClasses = this.hideLabelOnSmallScreen
             ? 'hidden lg:flex' // Tailwind example: hidden on small screens, visible on larger
             : '';
-        return (hAsync("a", { key: 'b604585e484db17a87cba4fb492ef17014c0c88a', class: `${classes || ''}`, href: isInteractive ? safeUrl : undefined, target: this.external && isInteractive ? '_blank' : undefined, rel: this.external && isInteractive ? 'noopener noreferrer' : undefined, tabIndex: isInteractive ? 0 : -1, "aria-label": isIconOnly ? this.ariaLabel || 'Link' : undefined, "aria-disabled": this.disabled ? 'true' : undefined, "aria-current": this.current ? 'page' : undefined, role: this.disabled ? 'link' : undefined, download: this.download ? '' : undefined, onClick: (event) => this.handleClick(event), onKeyDown: (event) => this.handleKeyDown(event) }, hAsync("span", { key: 'c3d5d62b4740ecb9f4fa6330147bb1f23afe22e0', class: "z-1 relative inline-flex items-center justify-center" }, this.renderLeftIcon(), this.label && (hAsync("span", { key: 'c4340d032516895b8ad9a01170998605875a5774', class: `${labelClasses} ${this.icon ? (this.iconPos === 'right' ? (this.size === 'large' ? 'pr-4' : 'pr-2') : (this.size === 'large' ? 'pl-4' : 'pl-2')) : ''}` }, this.label)), this.renderRightIcon())));
+        return (hAsync("a", { key: 'd167c16280b7f0b4c1fcf14f0f0d3468111e715b', class: `${classes || ''}`, href: isInteractive ? safeUrl : undefined, target: this.external && isInteractive ? '_blank' : undefined, rel: this.external && isInteractive ? 'noopener noreferrer' : undefined, tabIndex: isInteractive ? 0 : -1, "aria-label": isIconOnly ? this.ariaLabel || 'Link' : undefined, "aria-disabled": this.disabled ? 'true' : undefined, "aria-current": this.current ? 'page' : undefined, role: this.disabled ? 'link' : undefined, download: this.download ? '' : undefined, onClick: (event) => this.handleClick(event), onKeyDown: (event) => this.handleKeyDown(event) }, hAsync("span", { key: '000476a609888f5f848722015ce5e6137f26e371', class: "z-1 relative inline-flex items-center justify-center" }, this.renderLeftIcon(), this.label && (hAsync("span", { key: '15232cde31d23c5a466189c69fbdb9db48f08274', class: `${labelClasses} ${this.icon ? (this.iconPos === 'right' ? (this.size === 'large' ? 'pr-4' : 'pr-2') : (this.size === 'large' ? 'pl-4' : 'pl-2')) : ''}` }, this.label)), this.renderRightIcon())));
     }
     get el() { return getElement(this); }
     static get style() { return EdsLinkStyle0; }
@@ -13131,7 +13561,7 @@ class EdsLogo {
     }
     render() {
         const logoContent = this.getLogo();
-        return (hAsync("a", { key: '06321ecfcf456f1870cd080043203258306a2451', href: this.href, onClick: () => this.handleClick(), class: "eds-logo-wrapper", "aria-label": this.label }, hAsync("div", { key: '0e9da2f98700553f4898d0f60935f1c5cbd97cbc', innerHTML: logoContent })));
+        return (hAsync("a", { key: '3f8257c9481079f011278b114e13effe9057d823', href: this.href, onClick: () => this.handleClick(), class: "eds-logo-wrapper", "aria-label": this.label }, hAsync("div", { key: '4dac45a1a0c38c6e1613995aad2005b41acac775', innerHTML: logoContent })));
     }
     get el() { return getElement(this); }
     static get style() { return EdsLogoStyle0; }
@@ -13150,7 +13580,7 @@ class EdsLogo {
     }; }
 }
 
-const edsMatomoNoticeCss = ".fixed{position:fixed}.absolute{position:absolute}.w-full{width:100%}.bottom-0{bottom:0rem}.bottom-4{bottom:0.25rem}.p-4{padding:0.25rem}.p-6{padding:0.375rem}.p-8{padding:0.5rem}.z-10{z-index:10}.z-\\[999999\\]{z-index:999999}.left-0{left:0rem}.left-1\\/2{left:50%}.grow{flex-grow:1}.-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.flex{display:flex}.gap-12{gap:0.75rem}.gap-20{gap:1.25rem}.gap-4{gap:0.25rem}.gap-8{gap:0.5rem}@media (min-width: 750px){.md\\:left-1\\/2{left:50%}.md\\:flex{display:flex}.md\\:hidden{display:none}.md\\:-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.md\\:-translate-y-1\\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}}";
+const edsMatomoNoticeCss = ":host{display:block;background-color:var(--white, #FFFFFF);border-radius:16px;box-shadow:0 8px 24px rgba(0, 0, 0, 0.12);overflow:hidden}.flex{display:flex}.items-center{align-items:center}.gap-8{gap:0.5rem}";
 var EdsMatomoNoticeStyle0 = edsMatomoNoticeCss;
 
 class EdsMatomoNotice {
@@ -13261,7 +13691,13 @@ class EdsMatomoNotice {
         if (!this.showNotice) {
             return null;
         }
-        return (hAsync("div", { class: "p-8" }, hAsync("eds-accordion", { title: this.heading, description: this.hasCookieConsent() ? this.optOutMessage : this.description, switchBg: true, expanded: true }, this.hasCookieConsent() ? (hAsync("div", { class: "flex items-center gap-8" }, this.optedOut() ? (hAsync("eds-button", { intent: "brand", label: "Opt me in again", pill: true, "aria-label": "Opt me in again", onClick: () => this.optInAnalytics() })) : (hAsync("eds-button", { intent: "brand", label: "Keep Me In", pill: true, "aria-label": "Keep Me In", onClick: () => this.keepMeIn() })), hAsync("eds-button", { intent: "ghost", label: "Opt-out", pill: true, "aria-label": "Opt-out from analytics", onClick: () => this.optOutAnalytics() }))) : (hAsync("div", { class: "flex items-center gap-8" }, hAsync("eds-button", { intent: "brand", pill: true, label: "I agree", "aria-label": "Opt-in for analytics", onClick: () => this.optInAnalytics() }), hAsync("eds-button", { intent: "ghost", pill: true, label: "No, thanks", "aria-label": "Opt-out from analytics", onClick: () => this.noThanks() }))))));
+        return (
+        // Content-only render — no positioning, no overlay, no sizing.
+        // The host application wraps this component in whatever positioned
+        // container makes sense (fixed bottom banner, modal, sidebar slot,
+        // etc.). See packages/shared-hugo/layouts/_default/baseof.html for
+        // the bottom-centered card wrapper used by handbook/eds-docs.
+        hAsync("div", null, hAsync("eds-accordion", { title: this.heading, description: this.hasCookieConsent() ? this.optOutMessage : this.description, switchBg: true, expanded: true }, this.hasCookieConsent() ? (hAsync("div", { class: "flex items-center gap-8" }, this.optedOut() ? (hAsync("eds-button", { intent: "brand", label: "Opt me in again", pill: true, "aria-label": "Opt me in again", onClick: () => this.optInAnalytics() })) : (hAsync("eds-button", { intent: "brand", label: "Keep Me In", pill: true, "aria-label": "Keep Me In", onClick: () => this.keepMeIn() })), hAsync("eds-button", { intent: "ghost", label: "Opt-out", pill: true, "aria-label": "Opt-out from analytics", onClick: () => this.optOutAnalytics() }))) : (hAsync("div", { class: "flex items-center gap-8" }, hAsync("eds-button", { intent: "brand", pill: true, label: "I agree", "aria-label": "Opt-in for analytics", onClick: () => this.optInAnalytics() }), hAsync("eds-button", { intent: "ghost", pill: true, label: "No, thanks", "aria-label": "Opt-out from analytics", onClick: () => this.noThanks() }))))));
     }
     get el() { return getElement(this); }
     static get style() { return EdsMatomoNoticeStyle0; }
@@ -13503,7 +13939,7 @@ class EdsModal {
     }; }
 }
 
-const edsNpsCss = ".flex{display:flex}.justify-between{justify-content:space-between}.mt-4{margin-top:0.25rem}.mt-8{margin-top:0.5rem}.ml-4{margin-left:0.25rem}.mr-4{margin-right:0.25rem}.gap-2{gap:0.125rem}.gap-4{gap:0.25rem}.grid{display:grid}.grid-col-span-1{--container-grid-columns:1;grid-column:span 1 / span 1}.grid-cols-11{grid-template-columns:repeat(11, minmax(0, 1fr))}.grid-cols-11[class*=\"grid-line-x\"][class*=\"grid-line-x\"]>*:nth-child(n)::before{border-bottom-width:1px}.grid-cols-11[class*=\"grid-line-xfull\"]>*:nth-child(n)::before{inset-inline-start:calc(var(--inner-gutter) / -2);inset-inline-end:calc(var(--inner-gutter) / -2)}.grid-cols-11[class*=\"grid-line-x\"]>*:nth-child(11n+1)::before{inset-inline-start:0}.grid-cols-11[class*=\"grid-line-x\"]>*:nth-child(11n+11)::before{inset-inline-end:0}.grid-cols-11[class*=\"grid-line-x\"]>*:nth-child(11n+1):nth-last-child(-n+11)::before{border-bottom-width:0}.grid-cols-11[class*=\"grid-line-x\"]>*:nth-child(11n+1):nth-last-child(-n+11)~*::before{border-bottom-width:0}.grid-cols-11[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(n)::after{border-inline-end-width:1px}.grid-cols-11[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(11n+11)::after{border-inline-end-width:0}.grid-cols-11[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(-n+11)::after{top:0}.grid-cols-11[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(11n+1):nth-last-child(-n+11)::after{bottom:0}.grid-cols-11[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(11n+1):nth-last-child(-n+11)~li::after{bottom:0}.f-ui-04{font-family:var(--f-ui-04-fontFamily);font-weight:var(--f-ui-04-fontWeight);font-size:var(--f-ui-04-fontSize);line-height:var(--f-ui-04-lineHeight);letter-spacing:var(--f-ui-04-letterSpacing)}.text-light{color:var(--grey-dark)}.flex-wrap{flex-wrap:wrap}";
+const edsNpsCss = ".eds-nps__labels{padding-top:0.75rem;padding-bottom:0.5rem}.eds-nps__scale{display:block;width:fit-content;max-width:100%;padding-top:0.5rem;}#nps-buttons{gap:0.6rem}.eds-nps__btn{border-radius:9999px;transition:transform 0.15s ease-in-out}.eds-nps__btn.is-selected{transform:scale(1.12)}.flex{display:flex}.justify-between{justify-content:space-between}.mt-4{margin-top:0.25rem}.mt-8{margin-top:0.5rem}.ml-4{margin-left:0.25rem}.mr-4{margin-right:0.25rem}.gap-2{gap:0.125rem}.gap-4{gap:0.25rem}.grid{display:grid}.grid-col-span-1{--container-grid-columns:1;grid-column:span 1 / span 1}.grid-cols-11{grid-template-columns:repeat(11, minmax(0, 1fr))}.grid-cols-11[class*=\"grid-line-x\"][class*=\"grid-line-x\"]>*:nth-child(n)::before{border-bottom-width:1px}.grid-cols-11[class*=\"grid-line-xfull\"]>*:nth-child(n)::before{inset-inline-start:calc(var(--inner-gutter) / -2);inset-inline-end:calc(var(--inner-gutter) / -2)}.grid-cols-11[class*=\"grid-line-x\"]>*:nth-child(11n+1)::before{inset-inline-start:0}.grid-cols-11[class*=\"grid-line-x\"]>*:nth-child(11n+11)::before{inset-inline-end:0}.grid-cols-11[class*=\"grid-line-x\"]>*:nth-child(11n+1):nth-last-child(-n+11)::before{border-bottom-width:0}.grid-cols-11[class*=\"grid-line-x\"]>*:nth-child(11n+1):nth-last-child(-n+11)~*::before{border-bottom-width:0}.grid-cols-11[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(n)::after{border-inline-end-width:1px}.grid-cols-11[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(11n+11)::after{border-inline-end-width:0}.grid-cols-11[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(-n+11)::after{top:0}.grid-cols-11[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(11n+1):nth-last-child(-n+11)::after{bottom:0}.grid-cols-11[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(11n+1):nth-last-child(-n+11)~li::after{bottom:0}.f-ui-04{font-family:var(--f-ui-04-fontFamily);font-weight:var(--f-ui-04-fontWeight);font-size:var(--f-ui-04-fontSize);line-height:var(--f-ui-04-lineHeight);letter-spacing:var(--f-ui-04-letterSpacing)}.text-light{color:var(--grey-dark)}.flex-wrap{flex-wrap:wrap}";
 var EdsNpsStyle0 = edsNpsCss;
 
 class EdsNps {
@@ -13584,14 +14020,14 @@ class EdsNps {
     }
     render() {
         const count = this.max - this.min + 1;
-        return (hAsync("div", { key: '932d0a62e52376c1ddaf71e8d21bf5437c2d0b9f', class: "eds-nps" }, hAsync("eds-input-label", { key: '60f5b6849dcc53f2a0d46fa5e44499076bd46174', id: "nps-question", name: "nps-question", label: this.question }), hAsync("div", { key: '14d032aa6dc6b2cc67189f6e11a0fc59ca420cbb', id: "nps-buttons", role: "radiogroup", "aria-labelledby": "nps-question", onKeyDown: this.handleKeyNav, class: "flex flex-wrap gap-2 my-8" }, Array.from({ length: count }, (_, i) => {
+        return (hAsync("div", { key: '412ddeabf0cc97829202063af25f17e3309b0754', class: "eds-nps" }, hAsync("eds-input-label", { key: '100a47e710fa75d6a5761a87ca68e8bc8910e248', id: "nps-question", name: "nps-question", label: this.question }), hAsync("div", { key: '9a7a63112e17f4c725005e1ae8e42c98107db7c4', class: "eds-nps__scale" }, hAsync("div", { key: '501029dad573cd31d956ae3cae67f2db9f2649f1', id: "nps-buttons", role: "radiogroup", "aria-labelledby": "nps-question", onKeyDown: this.handleKeyNav, class: "flex flex-wrap gap-2 my-8" }, Array.from({ length: count }, (_, i) => {
             const val = this.min + i;
             const isSelected = val === this.internalValue;
             const tabIndex = isSelected || (this.internalValue == null && i === 0) ? 0 : -1;
-            return (hAsync("div", { class: "flex", key: val }, hAsync("eds-button", { ref: (el) => (this.btnRefs[i] = el), size: "large", role: "radio", "aria-checked": isSelected ? 'true' : 'false', "aria-label": `${val}`, onClick: () => this.onSelect(val), tabIndex: tabIndex, intent: isSelected ? 'brand' : 'neutral', "extra-class": "!block !px-0 w-full", label: `${val}`, pill: true, onFocus: () => {
+            return (hAsync("div", { class: "flex", key: val }, hAsync("eds-button", { ref: (el) => (this.btnRefs[i] = el), size: "large", role: "radio", "aria-checked": isSelected ? 'true' : 'false', "aria-label": `${val}`, onClick: () => this.onSelect(val), tabIndex: tabIndex, intent: isSelected ? 'brand' : 'brandLight', class: isSelected ? 'eds-nps__btn is-selected' : 'eds-nps__btn', "extra-class": "!block !px-0 w-full", label: `${val}`, pill: true, onFocus: () => {
                     this.internalValue = val;
                 } })));
-        })), hAsync("div", { key: 'f1fd58c7c1003f144b816c9a1d169a2edec4a768', class: "flex justify-between mt-8" }, hAsync("span", { key: '476a3c3b3ef1c43744b8a69e577e597fff887beb', class: "f-ui-04 text-light ml-4" }, this.leftLabel), hAsync("span", { key: '275ec0c204781365c2e57283c1096fadb853dbe5', class: "f-ui-04 text-light mr-4" }, this.rightLabel))));
+        })), hAsync("div", { key: 'aa15457591f1edf6e59eed384bcfbb25d49c9fd5', class: "flex justify-between eds-nps__labels" }, hAsync("span", { key: 'a468b290491e368e3084f17ce40c6aa39e00ad3a', class: "f-ui-04 text-light ml-4" }, this.leftLabel), hAsync("span", { key: '146b9eea4bbc360f7765e69e319738c77beae69d', class: "f-ui-04 text-light mr-4" }, this.rightLabel)))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -13867,7 +14303,7 @@ class EdsPagination {
     }
     render() {
         const navigableIndex = -1; // Track index for keyboard navigation
-        return (hAsync("div", { key: '6d7dea7a6d544bf79e944dfeb80cffb2f5a0b0cb' }, this.total > 0 && this.mode === 'default' && (hAsync("p", { key: '77da5262419978bf0806155727f64c2c957e3bb1', class: "f-ui-03 text-light mb-28 w-full text-center", "aria-live": "polite", id: "pagination-info" }, hAsync("span", { key: '537551dfe8de1af55d3350cef4fa62f503aba3c1', class: "text-light sr-only" }, "Results:"), this.pageResults())), this.mode === 'navigator' || (this.lastPage && this.lastPage > 1) ? (hAsync("nav", { "aria-label": "Pagination Navigation", "aria-describedby": this.mode === 'default' ? 'pagination-info' : undefined, onKeyDown: this.handleKeyDown }, hAsync("ul", { class: "flex items-center justify-center gap-x-8", role: "list" }, hAsync("li", { class: "mr-auto" }, this.useButtons ? (hAsync("div", { class: "pagination-button-wrapper", onFocus: () => this.handleItemFocus(navigableIndex) }, hAsync("eds-button", { label: this.prevLabel, disabled: this.mode === 'navigator' ? !this.prevUrl : this.isFirstPage(), "aria-label": "Go to previous page", icon: "chevron-left", "icon-pos": "left", size: "small", "icon-small": "true", intent: "secondary", "extra-class": "!p-8 lg:!pr-12 pagination-button", onClick: (event) => {
+        return (hAsync("div", { key: '5c11fd306f0ebf47a452e44d633e18b2e3860d78' }, this.total > 0 && this.mode === 'default' && (hAsync("p", { key: 'fe8b7f7b6c7785152f1edd90a750f4a9a7e2768b', class: "f-ui-03 text-light mb-28 w-full text-center", "aria-live": "polite", id: "pagination-info" }, hAsync("span", { key: '5e2c67535dbf765dc662770164404f0de69315a1', class: "text-light sr-only" }, "Results:"), this.pageResults())), this.mode === 'navigator' || (this.lastPage && this.lastPage > 1) ? (hAsync("nav", { "aria-label": "Pagination Navigation", "aria-describedby": this.mode === 'default' ? 'pagination-info' : undefined, onKeyDown: this.handleKeyDown }, hAsync("ul", { class: "flex items-center justify-center gap-x-8", role: "list" }, hAsync("li", { class: "mr-auto" }, this.useButtons ? (hAsync("div", { class: "pagination-button-wrapper", onFocus: () => this.handleItemFocus(navigableIndex) }, hAsync("eds-button", { label: this.prevLabel, disabled: this.mode === 'navigator' ? !this.prevUrl : this.isFirstPage(), "aria-label": "Go to previous page", icon: "chevron-left", "icon-pos": "left", size: "small", "icon-small": "true", intent: "ghost", "extra-class": "!p-8 lg:!pr-12 pagination-button", onClick: (event) => {
                 if (this.mode === 'default' && !this.isFirstPage()) {
                     this.handlePageClick(event, (this.currentPage || 1) - 1);
                 }
@@ -13876,7 +14312,7 @@ class EdsPagination {
                 : this.isFirstPage()
                     ? '#'
                     : this.generateLink(this.currentPage - 1).url, disabled: this.mode === 'navigator' ? !this.prevUrl : this.isFirstPage(), "aria-label": "Go to previous page", icon: "chevron-left", "icon-pos": "left", size: "small", "icon-small": "true", intent: "strong", "hide-label-on-small-screen": true, class: "!p-8 lg:!pr-12" }))), this.mode === 'default' &&
-            this.links.map((link, index) => (hAsync("li", { key: index, class: "f-ui-02 flex h-36 items-center justify-center" }, typeof link === 'string' ? (hAsync("span", { class: "flex items-center justify-center", "aria-hidden": "true" }, link)) : this.useButtons ? (hAsync("div", { class: "pagination-button-wrapper", onFocus: () => this.handleItemFocus(navigableIndex) }, hAsync("eds-button", { label: link.label, "aria-label": link.current ? `Current page, page ${link.label}` : `Go to page ${link.label}`, "aria-current": link.current ? 'page' : undefined, size: "small", "extra-class": "!p-8 pagination-button", intent: link.current ? 'primary' : 'secondary', onClick: (event) => this.handlePageClick(event, parseInt(link.label)) }))) : (hAsync("eds-link", { url: link.url, "aria-label": link.ariaLabel, label: link.label, current: link.current, "aria-current": link.current ? 'page' : undefined, size: "small", class: "!p-8", intent: link.current ? 'primary' : 'secondary', onClick: (event) => this.handlePageClick(event, parseInt(link.label)) }))))), hAsync("li", { class: "ml-auto" }, this.useButtons ? (hAsync("div", { class: "pagination-button-wrapper", onFocus: () => this.handleItemFocus(navigableIndex) }, hAsync("eds-button", { label: this.nextLabel, disabled: this.mode === 'navigator' ? !this.nextUrl : this.isLastPage(), "aria-label": "Go to next page", size: "small", "icon-small": "true", icon: "chevron-right", intent: "secondary", "extra-class": "!p-8 lg:!pl-12 pagination-button", onClick: (event) => {
+            this.links.map((link, index) => (hAsync("li", { key: index, class: "f-ui-02 flex h-36 items-center justify-center" }, typeof link === 'string' ? (hAsync("span", { class: "flex items-center justify-center", "aria-hidden": "true" }, link)) : this.useButtons ? (hAsync("div", { class: "pagination-button-wrapper", onFocus: () => this.handleItemFocus(navigableIndex) }, hAsync("eds-button", { label: link.label, "aria-label": link.current ? `Current page, page ${link.label}` : `Go to page ${link.label}`, "aria-current": link.current ? 'page' : undefined, size: "small", "extra-class": "!p-8 pagination-button", intent: link.current ? 'brand' : 'ghost', onClick: (event) => this.handlePageClick(event, parseInt(link.label)) }))) : (hAsync("eds-link", { url: link.url, "aria-label": link.ariaLabel, label: link.label, current: link.current, "aria-current": link.current ? 'page' : undefined, size: "small", class: "!p-8", intent: link.current ? 'primary' : 'secondary', onClick: (event) => this.handlePageClick(event, parseInt(link.label)) }))))), hAsync("li", { class: "ml-auto" }, this.useButtons ? (hAsync("div", { class: "pagination-button-wrapper", onFocus: () => this.handleItemFocus(navigableIndex) }, hAsync("eds-button", { label: this.nextLabel, disabled: this.mode === 'navigator' ? !this.nextUrl : this.isLastPage(), "aria-label": "Go to next page", size: "small", "icon-small": "true", icon: "chevron-right", intent: "ghost", "extra-class": "!p-8 lg:!pl-12 pagination-button", onClick: (event) => {
                 if (this.mode === 'default' && !this.isLastPage()) {
                     this.handlePageClick(event, (this.currentPage || 1) + 1);
                 }
@@ -14102,7 +14538,7 @@ class EdsProgressBar {
     }; }
 }
 
-const edsRatingCss = ":host{display:inline-block}.block{display:block}.stars{display:flex;gap:0.25rem;cursor:pointer}.star{color:var(--star-empty-color, #ccc);transition:color 0.2s ease-in-out}.star.filled{color:var(--brand-green);}.star:hover,.star.filled:hover{transform:scale(1.2)}.flex{display:flex}.inline-flex{display:inline-flex}.flex-col{flex-direction:column}.mt-4{margin-top:0.25rem}.mt-6{margin-top:0.375rem}.mt-8{margin-top:0.5rem}.my-4{margin-top:0.25rem;margin-bottom:0.25rem}.my-8{margin-top:0.5rem;margin-bottom:0.5rem}.my-16{margin-top:1rem;margin-bottom:1rem}.my-20{margin-top:1.25rem;margin-bottom:1.25rem}.space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0.0625rem * var(--tw-space-x-reverse));margin-left:calc(0.0625rem * calc(1 - var(--tw-space-x-reverse)))}";
+const edsRatingCss = ":host{display:inline-block}.block{display:block}.stars{display:flex;gap:0.25rem;cursor:pointer}.star{color:var(--star-empty-color, #ccc);transition:color 0.2s ease-in-out}.star.filled{color:var(--brand-green);}.star:hover,.star.filled:hover{transform:scale(1.2)}.eds-rating__btn{transition:transform 0.15s ease-in-out}.eds-rating__btn.is-selected{transform:scale(1.05)}.flex{display:flex}.inline-flex{display:inline-flex}.flex-col{flex-direction:column}.mt-4{margin-top:0.25rem}.mt-6{margin-top:0.375rem}.mt-8{margin-top:0.5rem}.my-4{margin-top:0.25rem;margin-bottom:0.25rem}.my-8{margin-top:0.5rem;margin-bottom:0.5rem}.my-16{margin-top:1rem;margin-bottom:1rem}.my-20{margin-top:1.25rem;margin-bottom:1.25rem}.space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0.0625rem * var(--tw-space-x-reverse));margin-left:calc(0.0625rem * calc(1 - var(--tw-space-x-reverse)))}";
 var EdsRatingStyle0 = edsRatingCss;
 
 class EdsRating {
@@ -14181,12 +14617,12 @@ class EdsRating {
         this.onSelect(next);
     }
     render() {
-        return (hAsync("div", { key: '89671afe2d02d527001009ee83fb0d4e48550479', id: "rating-buttons", role: "group", "aria-labelledby": "rating", class: "stars flex space-x-1 my-8", onKeyDown: (e) => this.handleKeyNav(e) }, Array.from({ length: this.ratingCount }, (_, index) => {
+        return (hAsync("div", { key: '01857f12c63fbe53b95152902ddba594aa736f6f', id: "rating-buttons", role: "group", "aria-labelledby": "rating", class: "stars flex space-x-1 my-8", onKeyDown: (e) => this.handleKeyNav(e) }, Array.from({ length: this.ratingCount }, (_, index) => {
             const starRating = index + 1;
             const isSelected = starRating <= this.internalRating;
             // Use the mapping text if available; otherwise, fall back to a generic label.
             const checked = this.internalRating === starRating;
-            return (hAsync("eds-button", { ref: (el) => (this.buttonRefs[index] = el), icon: this.ratingType, "aria-label": `${starRating} ${this.ratingType}${starRating > 1 ? 's' : ''}`, onClick: () => this.onSelect(starRating), tabIndex: checked || (this.internalRating === 0 && index === 0) ? 0 : -1, intent: isSelected ? 'brand' : 'neutral', size: "large" }));
+            return (hAsync("eds-button", { ref: (el) => (this.buttonRefs[index] = el), icon: this.ratingType, "aria-label": `${starRating} ${this.ratingType}${starRating > 1 ? 's' : ''}`, onClick: () => this.onSelect(starRating), tabIndex: checked || (this.internalRating === 0 && index === 0) ? 0 : -1, intent: isSelected ? 'brand' : 'brandLight', class: isSelected ? 'eds-rating__btn is-selected' : 'eds-rating__btn', size: "large" }));
         })));
     }
     get el() { return getElement(this); }
@@ -14209,6 +14645,346 @@ class EdsRating {
     }; }
 }
 
+const edsSearchSelectCss = ":host{display:block;width:100%;font-family:var(--f-ui-02-fontFamily, 'IBM Plex Sans', system-ui, sans-serif)}.eds-ss{position:relative;display:block;width:100%}.eds-ss__labelrow{display:flex;justify-content:space-between;margin-bottom:0.25rem}.eds-ss__hint{margin-top:0.5rem;margin-left:0.5rem;font-family:var(--f-ui-05-fontFamily);font-weight:var(--f-ui-05-fontWeight);font-size:var(--f-ui-05-fontSize);line-height:var(--f-ui-05-lineHeight);letter-spacing:var(--f-ui-05-letterSpacing);color:var(--grey-600)}.eds-ss__control{position:relative}.eds-ss__box{display:flex;flex-wrap:wrap;align-items:center;gap:0.35rem;width:100%;box-sizing:border-box;min-height:2.5rem;padding:6px 0.75rem;padding-right:3.75rem;border-width:2px;border-style:solid;border-color:rgba(0, 0, 0, 0.1);border-radius:8px;background:var(--white, #fff);transition-property:color, background-color, border-color;transition-timing-function:cubic-bezier(0, 0, 0.2, 1);transition-duration:300ms}.eds-ss__box:hover{border-color:var(--brand-black)}.eds-ss__box:focus-within{border-color:var(--brand-black);outline:3px solid var(--brand-green);outline-offset:2px}.eds-ss__box.is-error{border-color:var(--red-700)}.eds-ss__box.is-disabled{cursor:not-allowed;background-color:var(--grey-300)}.eds-ss__input{flex:1;min-width:6rem;border:none;outline:none;background:transparent;padding:4px 0;color:var(--brand-black);font-family:var(--f-ui-02-light-fontFamily);font-weight:var(--f-ui-02-light-fontWeight);font-size:var(--f-ui-02-light-fontSize);line-height:var(--f-ui-02-light-lineHeight);letter-spacing:var(--f-ui-02-light-letterSpacing)}.eds-ss__input::placeholder{color:var(--grey-500)}.eds-ss__input:disabled{cursor:not-allowed;color:var(--grey-500)}.eds-ss__chip{display:inline-flex;align-items:center;gap:0.35rem;padding:4px 0.4rem 4px 0.7rem;background:rgba(0, 200, 123, 0.12);color:var(--brand-green-dark, #00A867);border-radius:6px;font-family:var(--f-ui-02-fontFamily);font-size:var(--f-ui-02-fontSize);font-weight:600;line-height:1.4;max-width:100%}.eds-ss__chip-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eds-ss__chip-x{flex-shrink:0;border:none;background:none;cursor:pointer;color:var(--brand-green-dark, #00A867);font-size:1.2rem;line-height:1;padding:0 2px}.eds-ss__chip-x:hover{color:var(--brand-black, #07140D)}.eds-ss__clear,.eds-ss__chevron{position:absolute;top:50%;transform:translateY(-50%)}.eds-ss__chevron{right:6px;width:1.75rem;height:1.75rem;display:flex;align-items:center;justify-content:center;background-color:var(--grey-300);border-radius:4px;color:var(--brand-black);pointer-events:none}.eds-ss__clear{right:2.6rem;color:var(--grey-600, #6e6e6e);background:none;border:none;cursor:pointer;font-size:1.05rem;line-height:1}.eds-ss__clear:hover{color:var(--brand-black, #07140D)}.eds-ss__list{position:absolute;z-index:50;left:0;right:0;margin:0.25rem 0 0;padding:0.25rem;list-style:none;max-height:18rem;overflow-y:auto;background:var(--white, #fff);border:2px solid rgba(0, 0, 0, 0.1);border-radius:8px;box-shadow:0 8px 24px rgba(0, 0, 0, 0.12)}.eds-ss__option{padding:0.5rem 0.6rem;border-radius:6px;cursor:pointer;color:var(--brand-black, #07140D);font-family:var(--f-ui-02-fontFamily);font-size:var(--f-ui-02-fontSize);line-height:var(--f-ui-02-lineHeight);letter-spacing:var(--f-ui-02-letterSpacing)}.eds-ss__option.is-active{background:rgba(0, 200, 123, 0.1)}.eds-ss__option.is-selected{font-weight:600;color:var(--brand-green-dark, #00A867)}.eds-ss__status,.eds-ss__more{padding:0.5rem 0.6rem;font-family:var(--f-ui-05-fontFamily);font-size:var(--f-ui-05-fontSize);line-height:var(--f-ui-05-lineHeight);color:var(--grey-600, #6e6e6e)}.eds-ss__status.is-error{color:var(--red-700, #d64545)}.eds-ss__more{border-top:1px solid rgba(0, 0, 0, 0.1);margin-top:0.25rem;font-style:italic}";
+var EdsSearchSelectStyle0 = edsSearchSelectCss;
+
+/**
+ * Searchable, source-agnostic select for HUGE option lists (countries,
+ * currencies, nationalities, …) — the generalised sibling of
+ * eds-kg-web-services-select.
+ *
+ * It never talks to an external API directly. It either filters an inline
+ * `options` array client-side, or queries a VETTED, NAMED `source` through our
+ * own datasets registry (`/api/v1/datasets/<source>/search`), which returns the
+ * one normalised shape `{ items: [{label, value}], total, nextOffset }`. Any
+ * messy upstream schema is flattened server-side by an adapter — the component
+ * stays dumb.
+ *
+ * Rendering is result-capped (we render at most `maxVisible` rows and tell the
+ * user to keep typing) so a 5,000-item source never blows up the DOM. Remote
+ * sources are additionally bounded by the server's page `limit`.
+ */
+class EdsSearchSelect {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.edsinput = createEvent(this, "edsinput", 7);
+        this.edschange = createEvent(this, "edschange", 7);
+        this.debounceTimer = null;
+        this.inlineOptions = [];
+        this.listboxId = `eds-ss-list-${Math.round(performance.now())}`;
+        // value -> label, so selected tags render readable labels even for remote
+        // values whose label hasn't been fetched in the current page.
+        this.labelCache = {};
+        this.onInput = (e) => {
+            this.query = e.target.value;
+            this.open = true;
+            this.activeIndex = -1;
+            this.runSearch(this.query);
+        };
+        this.clear = () => {
+            if (this.multiple) {
+                this.value = [];
+                this.emitValue([]);
+            }
+            else {
+                this.value = undefined;
+                this.selectedLabel = '';
+                this.emitValue('');
+            }
+            this.query = '';
+        };
+        this.onKeyDown = (e) => {
+            if (e.key === 'ArrowDown') {
+                e.preventDefault();
+                if (!this.open)
+                    return this.openMenu();
+                this.activeIndex = Math.min(this.activeIndex + 1, this.visibleItems.length - 1);
+            }
+            else if (e.key === 'ArrowUp') {
+                e.preventDefault();
+                this.activeIndex = Math.max(this.activeIndex - 1, 0);
+            }
+            else if (e.key === 'Enter') {
+                if (this.open && this.activeIndex >= 0) {
+                    e.preventDefault();
+                    this.select(this.visibleItems[this.activeIndex]);
+                }
+            }
+            else if (e.key === 'Escape') {
+                this.closeMenu();
+            }
+            else if (e.key === 'Backspace' && this.multiple && !this.query && this.selectedValues.length) {
+                // Backspace on an empty query removes the last selected tag.
+                this.removeValue(this.selectedValues[this.selectedValues.length - 1]);
+            }
+        };
+        // Close when a click lands outside the component. Must be shadow-aware:
+        // this component is nested inside eds-form's shadow root, so a document-level
+        // listener sees the event retargeted to the OUTER host — `host.contains(target)`
+        // would be false even for our own clicks and wrongly close on open. composedPath()
+        // walks through every shadow boundary and contains our host iff the click was ours.
+        this.onDocumentClick = (e) => {
+            if (this.open && !e.composedPath().includes(this.host))
+                this.closeMenu();
+        };
+        this.name = undefined;
+        this.label = undefined;
+        this.placeholder = 'Search…';
+        this.required = false;
+        this.disabled = false;
+        this.hint = undefined;
+        this.message = undefined;
+        this.error = false;
+        this.errorMessage = undefined;
+        this.value = undefined;
+        this.multiple = false;
+        this.options = undefined;
+        this.source = undefined;
+        this.apiBase = '/api/v1';
+        this.searchParam = 'q';
+        this.limit = 50;
+        this.debounceMs = 250;
+        this.maxVisible = 100;
+        this.open = false;
+        this.query = '';
+        this.loading = false;
+        this.fetchError = '';
+        this.items = [];
+        this.total = 0;
+        this.activeIndex = -1;
+        this.selectedLabel = '';
+    }
+    componentWillLoad() {
+        this.parseInlineOptions();
+        this.resolveSelectedLabel();
+    }
+    onOptionsChange() {
+        this.parseInlineOptions();
+        this.resolveSelectedLabel();
+    }
+    onValueChange() {
+        this.resolveSelectedLabel();
+    }
+    parseInlineOptions() {
+        if (!this.options) {
+            this.inlineOptions = [];
+            return;
+        }
+        if (typeof this.options === 'string') {
+            try {
+                this.inlineOptions = JSON.parse(this.options) || [];
+            }
+            catch (_a) {
+                this.inlineOptions = [];
+            }
+        }
+        else {
+            this.inlineOptions = this.options;
+        }
+        this.cacheLabels(this.inlineOptions);
+    }
+    cacheLabels(opts) {
+        (opts || []).forEach((o) => {
+            if (o && o.value != null)
+                this.labelCache[String(o.value)] = o.label;
+        });
+    }
+    /** The current selection as a value array (works for single + multi). */
+    get selectedValues() {
+        const v = this.value;
+        if (Array.isArray(v))
+            return v.map(String).filter((s) => s !== '');
+        if (typeof v === 'string' && v !== '') {
+            return this.multiple ? v.split(',').filter(Boolean) : [v];
+        }
+        return [];
+    }
+    labelFor(val) {
+        var _a, _b;
+        return (this.labelCache[String(val)] ||
+            ((_a = this.inlineOptions.find((o) => String(o.value) === String(val))) === null || _a === void 0 ? void 0 : _a.label) ||
+            ((_b = this.items.find((o) => String(o.value) === String(val))) === null || _b === void 0 ? void 0 : _b.label) ||
+            String(val));
+    }
+    emitValue(v) {
+        this.edsinput.emit({ value: v });
+        this.edschange.emit({ value: v });
+    }
+    get isRemote() {
+        return !!this.source && this.inlineOptions.length === 0;
+    }
+    resolveSelectedLabel() {
+        if (!this.value) {
+            this.selectedLabel = '';
+            return;
+        }
+        // Inline: resolve label from the known list. Remote: best-effort — show the
+        // value until/unless it appears in a fetched page.
+        const pool = this.inlineOptions.length ? this.inlineOptions : this.items;
+        const found = pool.find((o) => String(o.value) === String(this.value));
+        this.selectedLabel = found ? found.label : String(this.value);
+    }
+    // --- Data --------------------------------------------------------------
+    filterInline(q) {
+        const needle = q.trim().toLowerCase();
+        if (!needle)
+            return this.inlineOptions;
+        return this.inlineOptions.filter((o) => o.label.toLowerCase().includes(needle) ||
+            String(o.value).toLowerCase().includes(needle));
+    }
+    async fetchRemote(q) {
+        this.loading = true;
+        this.fetchError = '';
+        try {
+            const params = new URLSearchParams({ [this.searchParam]: q, limit: String(this.limit) });
+            const url = `${this.apiBase}/datasets/${encodeURIComponent(this.source)}/search?${params}`;
+            const resp = await fetch(url);
+            if (!resp.ok)
+                throw new Error(`Search failed: ${resp.statusText}`);
+            const data = await resp.json();
+            this.items = data.items || [];
+            this.cacheLabels(this.items);
+            this.total = typeof data.total === 'number' ? data.total : this.items.length;
+            this.resolveSelectedLabel();
+        }
+        catch (e) {
+            this.fetchError = e instanceof Error ? e.message : 'Search failed';
+            this.items = [];
+            this.total = 0;
+        }
+        finally {
+            this.loading = false;
+        }
+    }
+    runSearch(q, immediate = false) {
+        if (this.isRemote) {
+            // Show the loading state synchronously so the debounce window renders
+            // "Searching…" rather than a misleading "No matches" before the fetch.
+            this.loading = true;
+            clearTimeout(this.debounceTimer);
+            if (immediate) {
+                this.fetchRemote(q);
+            }
+            else {
+                this.debounceTimer = setTimeout(() => this.fetchRemote(q), this.debounceMs);
+            }
+        }
+        else {
+            this.items = this.filterInline(q);
+            this.total = this.items.length;
+        }
+    }
+    // --- The capped, render-ready slice ------------------------------------
+    get visibleItems() {
+        return this.items.slice(0, this.maxVisible);
+    }
+    get hiddenCount() {
+        return Math.max(0, this.total - this.visibleItems.length);
+    }
+    // --- Interaction -------------------------------------------------------
+    openMenu() {
+        if (this.disabled)
+            return;
+        this.open = true;
+        this.activeIndex = -1;
+        // Populate on first open (initial page for remote, full list for inline).
+        // Immediate fetch on open — debounce only applies to typing.
+        if (!this.items.length || this.isRemote)
+            this.runSearch(this.query, true);
+    }
+    closeMenu() {
+        this.open = false;
+        this.activeIndex = -1;
+    }
+    select(opt) {
+        this.labelCache[String(opt.value)] = opt.label;
+        if (this.multiple) {
+            const current = this.selectedValues;
+            const key = String(opt.value);
+            const next = current.includes(key)
+                ? current.filter((v) => v !== key) // toggle off if already chosen
+                : [...current, key];
+            this.value = next;
+            this.query = '';
+            this.emitValue(next);
+            // Keep the menu open so more can be picked; reset the list to all results.
+            this.runSearch('', true);
+            return;
+        }
+        this.value = opt.value;
+        this.selectedLabel = opt.label;
+        this.query = '';
+        this.closeMenu();
+        this.emitValue(opt.value);
+    }
+    removeValue(val, e) {
+        e === null || e === void 0 ? void 0 : e.stopPropagation();
+        const next = this.selectedValues.filter((v) => v !== String(val));
+        this.value = next;
+        this.emitValue(next);
+    }
+    connectedCallback() {
+        document.addEventListener('click', this.onDocumentClick, true);
+    }
+    disconnectedCallback() {
+        document.removeEventListener('click', this.onDocumentClick, true);
+        clearTimeout(this.debounceTimer);
+    }
+    render() {
+        const selected = this.selectedValues;
+        const hasSelection = selected.length > 0;
+        const inputValue = this.multiple ? this.query : (this.open ? this.query : this.selectedLabel);
+        const placeholder = this.multiple
+            ? (hasSelection ? '' : this.placeholder)
+            : (hasSelection && !this.open ? this.selectedLabel : this.placeholder);
+        return (hAsync("div", { key: 'f5224332aa395be2a9dd8a1312dcd1b631ad2129', class: "eds-ss" }, (this.label || this.hint) && (hAsync("div", { key: 'e28da19abdedb4107a7b7be2a59e6444780f8251', class: "eds-ss__labelrow" }, this.label && (hAsync("eds-input-label", { key: '81933dbc2d370b8ddbbf8f4286c3420e4f140ca7', name: `${this.name}-input`, label: this.label, required: this.required, disabled: this.disabled })), this.hint && (hAsync("p", { key: '1ff5b7a62cc20bb2ce710ca2e06c728d94aef895', id: `${this.name}-hint`, class: "eds-ss__hint" }, this.hint)))), hAsync("div", { key: '84fbdccc6326707ac854e06d7209dd149d9c26a7', class: "eds-ss__control relative" }, hAsync("div", { key: 'ae99c3d9c706fa6619459d8d6c9baa3df610169e', class: { 'eds-ss__box': true, 'is-error': this.error || !!this.fetchError, 'is-disabled': this.disabled } }, this.multiple &&
+            selected.map((v) => (hAsync("span", { class: "eds-ss__chip", key: v }, hAsync("span", { class: "eds-ss__chip-label" }, this.labelFor(v)), !this.disabled && (hAsync("button", { type: "button", class: "eds-ss__chip-x", "aria-label": `Remove ${this.labelFor(v)}`, onMouseDown: (e) => { e.preventDefault(); this.removeValue(v, e); } }, "\u00D7"))))), hAsync("input", { key: '18dcd5787c7636c09be7285fb85b77f5cae334c8', id: `${this.name}-input`, class: "eds-ss__input", type: "text", role: "combobox", autocomplete: "off", "aria-expanded": this.open ? 'true' : 'false', "aria-controls": this.listboxId, "aria-autocomplete": "list", placeholder: placeholder, value: inputValue, disabled: this.disabled, required: this.required && !hasSelection, onFocus: () => this.openMenu(), onInput: this.onInput, onKeyDown: this.onKeyDown })), !this.multiple && hasSelection && !this.disabled && (hAsync("button", { key: 'c927fa49fb58b7abec13f6d436f1d1452f9644c5', type: "button", class: "eds-ss__clear", "aria-label": "Clear selection", onClick: this.clear }, "\u00D7")), hAsync("span", { key: 'bff4bf41fb388f849ef9c0928f4aa88e065d718d', class: "eds-ss__chevron", "aria-hidden": "true" }, hAsync("eds-icon-wrapper", { key: '7871955d6fc5626914995d51c1b4b3511b60febe', name: "chevron-right", size: 20 }))), this.open && (hAsync("ul", { key: 'e529fe82576be45a0e99d4a020aa4f721b71686b', class: "eds-ss__list", id: this.listboxId, role: "listbox" }, this.loading && hAsync("li", { key: 'fe8d73dfa0d6a5cf7e9bea4220511a22489884f8', class: "eds-ss__status" }, "Searching\u2026"), !this.loading && this.fetchError && hAsync("li", { key: 'b708b1de4eee8e45287fd23f0bf63327032616d6', class: "eds-ss__status is-error" }, this.fetchError), !this.loading && !this.fetchError && this.visibleItems.length === 0 && (hAsync("li", { key: '9400ac7a022f38935f05df3705e2a65acb9d4a04', class: "eds-ss__status" }, "No matches")), !this.loading &&
+            !this.fetchError &&
+            this.visibleItems.map((opt, i) => (hAsync("li", { key: opt.value, class: { 'eds-ss__option': true, 'is-active': i === this.activeIndex, 'is-selected': selected.includes(String(opt.value)) }, role: "option", "aria-selected": selected.includes(String(opt.value)) ? 'true' : 'false', onMouseEnter: () => (this.activeIndex = i), onMouseDown: (e) => { e.preventDefault(); this.select(opt); } }, opt.label))), !this.loading && !this.fetchError && this.hiddenCount > 0 && (hAsync("li", { key: '8e82d65e9da3755ad10ffaf0fc4a45f5bc365a48', class: "eds-ss__more" }, "+", this.hiddenCount, " more \u2014 keep typing to narrow")))), hAsync("eds-input-footer", { key: '0564f006a874a3556118ce99441cbfabc230ac57', name: this.name, message: this.message, error: this.error, "error-message": this.errorMessage })));
+    }
+    get host() { return getElement(this); }
+    static get watchers() { return {
+        "options": ["onOptionsChange"],
+        "value": ["onValueChange"]
+    }; }
+    static get style() { return EdsSearchSelectStyle0; }
+    static get cmpMeta() { return {
+        "$flags$": 9,
+        "$tagName$": "eds-search-select",
+        "$members$": {
+            "name": [1],
+            "label": [1],
+            "placeholder": [1],
+            "required": [4],
+            "disabled": [4],
+            "hint": [1],
+            "message": [1],
+            "error": [4],
+            "errorMessage": [1, "error-message"],
+            "value": [1025],
+            "multiple": [4],
+            "options": [1],
+            "source": [1],
+            "apiBase": [1, "api-base"],
+            "searchParam": [1, "search-param"],
+            "limit": [2],
+            "debounceMs": [2, "debounce-ms"],
+            "maxVisible": [2, "max-visible"],
+            "open": [32],
+            "query": [32],
+            "loading": [32],
+            "fetchError": [32],
+            "items": [32],
+            "total": [32],
+            "activeIndex": [32],
+            "selectedLabel": [32]
+        },
+        "$listeners$": undefined,
+        "$lazyBundleId$": "-",
+        "$attrsToReflect$": []
+    }; }
+}
+
 const edsSectionCoreCss = "";
 var EdsSectionCoreStyle0 = edsSectionCoreCss;
 
@@ -14234,7 +15010,7 @@ class EdsSectionCore {
     }
     render() {
         const TagType = this.tag; // Set dynamic tag type (div or section)
-        return (hAsync(TagType, { key: '65cb765fe9b997b5e573f5befd4ca1ea6611f1c5' }, hAsync("eds-section-heading", { key: 'a48c9fef0a45fbed08749e8b4f17d762d38bbb5b', headingLevel: this.headingLevel, sectionTitle: this.sectionTitle }), hAsync("slot", { key: '7e26bc40132c32670db60f5765b412d00d64c129' })));
+        return (hAsync(TagType, { key: '635230d1ec9a0dcc945990a6a58dc3508345d984' }, hAsync("eds-section-heading", { key: '0b6b94df22af707cbd6964132f3a5190b4b7e83c', headingLevel: this.headingLevel, sectionTitle: this.sectionTitle }), hAsync("slot", { key: '8834c29c25249fb5c384fb5d51866eadb93a97d6' })));
     }
     static get style() { return EdsSectionCoreStyle0; }
     static get cmpMeta() { return {
@@ -14289,12 +15065,12 @@ class EdsSectionHeading {
     render() {
         const TagType = this.tag; // Dynamically set tag type for the container
         const HeadingTag = this.headingLevel; // Dynamically set heading level
-        return (hAsync(TagType, { key: '032f8629ef5ea1c45f40a135a54c32337f7181e9', class: {
+        return (hAsync(TagType, { key: '7275284a1158ab982f1e53117b72738d0a001c97', class: {
                 'ui-section-header flex flex-wrap items-center justify-between gap-x-12 gap-y-8': true,
                 container: this.withContainer,
                 'pt-48': this.spacingLarge,
                 'pt-28': !this.spacingLarge
-            } }, hAsync(HeadingTag, { key: '37f821426fe05dba66445745da3d23c9ff75345e', class: this.getHeadingClass() }, this.sectionTitle)));
+            } }, hAsync(HeadingTag, { key: 'a3c68baa56a0337348405c88544225ed7c7ff0ed', class: this.getHeadingClass() }, this.sectionTitle)));
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -14463,10 +15239,10 @@ class EdsSidebar {
             } }, hasChildren && (hAsync("span", { class: "sidebar-toggle -ml-4", "aria-hidden": "true" }, hAsync("eds-icon-wrapper", { name: isOpen ? 'chevron-down' : 'chevron-right' }))), hAsync("span", { class: "sidebar-link-wrapper" }, hAsync("eds-link", { label: item.title, url: item.url || '#', intent: isActive ? 'strong' : 'weak', size: "small", "aria-label": item.title, "extra-class": "sidebar-link", tabindex: "-1" }))), hasChildren && isOpen && (hAsync("ul", { id: childrenId, class: "sidebar-children" }, item.children.map((child) => this.renderItem(child, level + 1))))));
     }
     render() {
-        return (hAsync(Host, { key: 'a56e293e9b53b0dbffd6268c117f77828ba5f41a', class: {
+        return (hAsync(Host, { key: 'f5221c19e8148ca62a76fb470a4aa6786c3e41b5', class: {
                 'eds-sidebar': true,
                 [`theme-${this.theme}`]: true
-            } }, hAsync("nav", { key: '07ca17add683f976b30e736389eddc473e1e5669', class: "sidebar-nav", "aria-label": "Sidebar" }, hAsync("ul", { key: 'a102418d399f14715eddf34e1c3373cf1be9d4aa', class: "sidebar-list" }, this.parsedItems.map((item) => this.renderItem(item, 0))))));
+            } }, hAsync("nav", { key: '0a975a10a3892f6eabaf2a1c2be21963f0e76549', class: "sidebar-nav", "aria-label": "Sidebar" }, hAsync("ul", { key: '498436fa1f4ec7ff2f3feea843fe58b415d20a3f', class: "sidebar-list" }, this.parsedItems.map((item) => this.renderItem(item, 0))))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -14552,7 +15328,7 @@ class EdsSocialNetworks {
         const isInverse = this.variant === 'inverse';
         const textClass = isInverse ? 'text-inverse' : '';
         const linkIntent = isInverse ? 'inverse' : 'strong';
-        return (hAsync("nav", { key: '11b876483142bb98c686a4cb722d28022ca9f40c', "aria-label": "Social media" }, hAsync("p", { key: 'daf2865247ed69ab3e4233d191d8abb8d5be584f', class: `f-ui-02 ${textClass}` }, this.heading), hAsync("ul", { key: '47918284e8a158d523d3329eb28f4881ac27233e', class: "mt-12 flex gap-4" }, this.socialNetworks.map((network, index) => (hAsync("li", { key: index }, hAsync("eds-link", { external: true, "aria-label": `EBRAINS on ${network.label}`, url: network.url, icon: network.icon, intent: linkIntent })))))));
+        return (hAsync("nav", { key: '924bdf5a32b65cd0968ad92461cb8203f3305fce', "aria-label": "Social media" }, hAsync("p", { key: 'f406d71ed2d7ff9048e5db05f5ad62566081aa45', class: `f-ui-02 ${textClass}` }, this.heading), hAsync("ul", { key: '40d000bc78780d7ec3c0c9bf2e10ec0a26f3b72e', class: "mt-12 flex gap-4" }, this.socialNetworks.map((network, index) => (hAsync("li", { key: index }, hAsync("eds-link", { external: true, "aria-label": `EBRAINS on ${network.label}`, url: network.url, icon: network.icon, intent: linkIntent })))))));
     }
     static get style() { return EdsSocialNetworksStyle0; }
     static get cmpMeta() { return {
@@ -14644,7 +15420,7 @@ class EdsSpinner {
                 alignItems: 'center',
                 justifyContent: 'center'
             };
-        return (hAsync(Host, { key: '16d20431aaa90a29b6e3d32cbd3403ece1f45345' }, hAsync("div", { key: '0e29dafa5eb3a84f31305614ae083356604a81bf', class: "spinner-overlay", style: overlayStyle }, hAsync("span", { key: 'cf63a83095e35a1ca4328fd14293e6895d8d9811', class: "spinner", style: spinnerStyle }), this.message && hAsync("p", { key: '7bb83c40db5dc985c429ca6ac171145db80c011d', class: "f-ui-01" }, this.message))));
+        return (hAsync(Host, { key: 'c09fa07856848a03aab44bbb56ecdd66a986bb40' }, hAsync("div", { key: '544c653e9e0457d2063eaefc5ff1fe88de89f14e', class: "spinner-overlay", style: overlayStyle }, hAsync("span", { key: 'e389aa572863a265c9aa68d587ad744f1c8db0a7', class: "spinner", style: spinnerStyle }), this.message && hAsync("p", { key: '5e554fe1b870e673c5b3da3ec2a227e92dd9863d', class: "f-ui-01" }, this.message))));
     }
     static get style() { return EdsSpinnerStyle0; }
     static get cmpMeta() { return {
@@ -15193,7 +15969,7 @@ class EdsStepsV2 {
         const steps = this.parsedSteps;
         const marginClass = this.orientation === 'horizontal' ? 'mt-64' : 'mt-32';
         const themeClass = this.theme === 'brand' ? 'theme-brand' : 'theme-default';
-        return (hAsync("div", { key: '0f95d17cc699c020419593bec5ed76c4515501c9', class: this.articleClasses() }, this.imageSrc ? (hAsync("div", { class: "w-full mb-12 rounded-t-lg overflow-hidden border-2" }, hAsync("eds-img", { src: this.imageSrc, width: this.imageWidth, "with-bg": "true", "lazy-load": "true", alt: "Step illustration" }))) : (this.message && (hAsync("div", { class: `w-full ${this.theme === 'brand' ? 'bg-strongest' : 'bg-darker'} rounded-t-lg border-2` }, hAsync("div", { class: "p-24" }, hAsync("span", { class: `${this.theme === 'brand' ? 'text-accent' : 'text-inverse'} f-heading-04` }, this.message))))), hAsync("div", { key: 'ed26ac9fc5cc4d7c409d29c3cd623e37a5abc944', class: "mt-16 pb-20 px-8" }, this.type === 'linear' && this.orientation === 'horizontal' ? (hAsync("div", { class: `steps--horizontal ${themeClass}`, style: { '--step-count': steps.length.toString() } }, hAsync("div", { class: "horizontal-indicators" }, steps.map((step, index) => this.renderHorizontalIndicator(step, index))), steps.map((step, index) => {
+        return (hAsync("div", { key: 'e1d78d18506adb662bbcc100f6f886e33c21a996', class: this.articleClasses() }, this.imageSrc ? (hAsync("div", { class: "w-full mb-12 rounded-t-lg overflow-hidden border-2" }, hAsync("eds-img", { src: this.imageSrc, width: this.imageWidth, "with-bg": "true", "lazy-load": "true", alt: "Step illustration" }))) : (this.message && (hAsync("div", { class: `w-full ${this.theme === 'brand' ? 'bg-strongest' : 'bg-darker'} rounded-t-lg border-2` }, hAsync("div", { class: "p-24" }, hAsync("span", { class: `${this.theme === 'brand' ? 'text-accent' : 'text-inverse'} f-heading-04` }, this.message))))), hAsync("div", { key: '5b69e2c641d96025b34377fc647679f94d0e4e44', class: "mt-16 pb-20 px-8" }, this.type === 'linear' && this.orientation === 'horizontal' ? (hAsync("div", { class: `steps--horizontal ${themeClass}`, style: { '--step-count': steps.length.toString() } }, hAsync("div", { class: "horizontal-indicators" }, steps.map((step, index) => this.renderHorizontalIndicator(step, index))), steps.map((step, index) => {
             const isLast = index === steps.length - 1;
             if (this.activeStep !== index) {
                 return null;
@@ -15335,7 +16111,7 @@ class EdsSwitch {
     }; }
 }
 
-const edsTableCss = "table{text-indent:0;border-color:inherit;border-collapse:collapse;}tr.table-row-default{background-color:transparent}tr.table-row-color:nth-child(even){background-color:var(--grey-light)}tr.table-row-color:nth-child(odd){background-color:transparent}.brand-table-wrapper{margin-top:2rem;width:100%}.brand-table{width:100% !important;border-collapse:separate !important;border-spacing:0 !important;display:table !important;table-layout:fixed !important}.brand-thead{background:var(--grey-light)}.brand-header-row{border:none !important}.brand-header-row th{padding:1rem 1.5rem !important;text-align:center !important;font-weight:600 !important;font-size:0.9rem !important;text-transform:uppercase;letter-spacing:0.05em;color:var(--grey-dark) !important;border:none !important;overflow-wrap:break-word !important;word-wrap:break-word !important}.brand-header-row th:first-child{border-radius:0.5rem 0 0 0;padding-left:2rem !important}.brand-header-row th:last-child{border-radius:0 0.5rem 0 0;padding-right:2rem !important}.brand-row{border-bottom:1px solid var(--grey-light) !important;transition:all 0.3s ease;cursor:pointer;position:relative;background:transparent !important}.brand-row:hover{background:rgba(0, 255, 157, 0.05) !important}.brand-row td{padding:1.5rem 1.5rem !important;border:none !important;vertical-align:middle;position:relative;z-index:1;overflow-wrap:break-word !important;word-wrap:break-word !important}.brand-row td:first-child{padding-left:2rem !important}.brand-row td:last-child{padding-right:2rem !important}.brand-row .actions-cell{text-align:right !important}.brand-table tr.brand-row{border-left:none;border-right:none;border-top:none}.container{width:calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0)))));margin-right:auto;margin-left:auto}.container>*{--container-outer-gutter:0;--breakout-container-outer-gutter:0}.pt-32{padding-top:2rem}.pt-40{padding-top:2.5rem}.pt-48{padding-top:3rem}.pb-28{padding-bottom:1.75rem}.pb-60{padding-bottom:3.75rem}.mt-20{margin-top:1.25rem}.mt-28{margin-top:1.75rem}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.overflow-x-auto{overflow-x:auto}.mt-6{margin-top:0.375rem}.p-0{padding:0rem}.p-4{padding:0.25rem}.m-0{margin:0rem}.border{border-width:1px}.border-softer{border:1px solid rgba(0, 0, 0, .1)}.even\\:bg-inverse-softer:nth-child(even){background-color:rgba(255, 255, 255, .15)}.px-8{padding-left:0.5rem;padding-right:0.5rem}.px-20{padding-left:1.25rem;padding-right:1.25rem}.py-8{padding-top:0.5rem;padding-bottom:0.5rem}.f-ui-01{font-family:var(--f-ui-01-fontFamily);font-size:var(--f-ui-01-fontSize);line-height:var(--f-ui-01-lineHeight);letter-spacing:var(--f-ui-01-letterSpacing)}.f-ui-02{font-family:var(--f-ui-02-fontFamily);font-size:var(--f-ui-02-fontSize);line-height:var(--f-ui-02-lineHeight);letter-spacing:var(--f-ui-02-letterSpacing)}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.text-center{text-align:center}.break-words{overflow-wrap:anywhere}.controls-container{display:flex;width:100%}.view-toggle-wrapper{flex-shrink:0}.search-wrapper{min-width:0}.card-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(300px, 1fr));gap:1.5rem;margin-top:1.5rem}.data-card{background:var(--white);border:1px solid var(--grey-light);border-radius:0.75rem;padding:1.5rem;transition:all 0.3s ease;display:flex;flex-direction:column;gap:1rem}.data-card:hover{border-color:var(--brand-green);box-shadow:0 4px 12px rgba(0, 255, 157, 0.1);transform:translateY(-2px)}.card-content{display:flex;flex-direction:column;gap:0.75rem;flex:1}.card-field{display:flex;flex-direction:column;gap:0.25rem}.card-label{font-family:var(--f-ui-03-fontFamily);font-size:var(--f-ui-03-fontSize);font-weight:var(--f-ui-03-fontWeight);line-height:var(--f-ui-03-lineHeight);text-transform:uppercase;letter-spacing:0.05em;color:var(--grey-dark)}.card-value{font-family:var(--f-ui-02-fontFamily);font-size:var(--f-ui-02-fontSize);line-height:var(--f-ui-02-lineHeight);color:var(--brand-black);word-wrap:break-word}.card-actions{display:flex;gap:0.5rem;justify-content:flex-end;padding-top:0.75rem;border-top:1px solid var(--grey-light)}@media (min-width: 640px){.card-grid{grid-template-columns:repeat(auto-fill, minmax(320px, 1fr))}}@media (min-width: 1024px){.card-grid{grid-template-columns:repeat(auto-fill, minmax(350px, 1fr));gap:2rem}}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.items-start{align-items:flex-start}.items-center{align-items:center}.gap-16{gap:1rem}.mb-16{margin-bottom:1rem}.w-full{width:100%}.w-auto{width:auto}@media (min-width: 750px){.flex-md-row{flex-direction:row}.items-md-center{align-items:center}.w-md-auto{width:auto}.w-md-400{width:400px}}";
+const edsTableCss = "table{text-indent:0;border-color:inherit;border-collapse:collapse;}.brand-table-wrapper{margin-top:2rem;width:100%}.brand-table{width:100% !important;border-collapse:separate !important;border-spacing:0 !important;display:table !important;table-layout:fixed !important}.brand-thead{background:var(--grey-light)}.brand-header-row{border:none !important}.brand-header-row th{padding:1rem 1.5rem !important;text-align:center !important;font-weight:600 !important;font-size:0.9rem !important;text-transform:uppercase;letter-spacing:0.05em;color:var(--grey-dark) !important;border:none !important;overflow-wrap:break-word !important;word-wrap:break-word !important}.brand-header-row th:first-child{border-radius:0.5rem 0 0 0;padding-left:2rem !important}.brand-header-row th:last-child{border-radius:0 0.5rem 0 0;padding-right:2rem !important}.brand-row{border-bottom:1px solid var(--grey-light) !important;transition:all 0.3s ease;position:relative;background:transparent !important}.brand-row.has-actions{cursor:pointer}.brand-row:hover{background:rgba(0, 255, 157, 0.05) !important}.brand-row td{padding:1.5rem 1.5rem !important;border:none !important;vertical-align:middle;position:relative;z-index:1;overflow-wrap:break-word !important;word-wrap:break-word !important}.brand-row td:first-child{padding-left:2rem !important}.brand-row td:last-child{padding-right:2rem !important}.brand-row .actions-cell{text-align:right !important}.brand-table tr.brand-row{border-left:none;border-right:none;border-top:none}.container{width:calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0)))));margin-right:auto;margin-left:auto}.container>*{--container-outer-gutter:0;--breakout-container-outer-gutter:0}.pt-32{padding-top:2rem}.pt-40{padding-top:2.5rem}.pt-48{padding-top:3rem}.pb-28{padding-bottom:1.75rem}.pb-60{padding-bottom:3.75rem}.mt-20{margin-top:1.25rem}.mt-28{margin-top:1.75rem}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.overflow-x-auto{overflow-x:auto}.mt-6{margin-top:0.375rem}.p-0{padding:0rem}.p-4{padding:0.25rem}.m-0{margin:0rem}.border{border-width:1px}.border-softer{border:1px solid rgba(0, 0, 0, .1)}.even\\:bg-inverse-softer:nth-child(even){background-color:rgba(255, 255, 255, .15)}.px-8{padding-left:0.5rem;padding-right:0.5rem}.px-20{padding-left:1.25rem;padding-right:1.25rem}.py-8{padding-top:0.5rem;padding-bottom:0.5rem}.f-ui-01{font-family:var(--f-ui-01-fontFamily);font-size:var(--f-ui-01-fontSize);line-height:var(--f-ui-01-lineHeight);letter-spacing:var(--f-ui-01-letterSpacing)}.f-ui-02{font-family:var(--f-ui-02-fontFamily);font-size:var(--f-ui-02-fontSize);line-height:var(--f-ui-02-lineHeight);letter-spacing:var(--f-ui-02-letterSpacing)}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.text-center{text-align:center}.break-words{overflow-wrap:anywhere}.controls-container{display:flex;width:100%}.view-toggle-wrapper{flex-shrink:0}.search-wrapper{min-width:0}.card-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(300px, 1fr));gap:1.5rem;margin-top:1.5rem}.data-card{background:var(--white);border:1px solid var(--grey-light);border-radius:0.75rem;padding:1.5rem;transition:all 0.3s ease;display:flex;flex-direction:column;gap:1rem}.data-card:hover{border-color:var(--brand-green);box-shadow:0 4px 12px rgba(0, 255, 157, 0.1);transform:translateY(-2px)}.card-content{display:flex;flex-direction:column;gap:0.75rem;flex:1}.card-field{display:flex;flex-direction:column;gap:0.25rem}.card-label{font-family:var(--f-ui-03-fontFamily);font-size:var(--f-ui-03-fontSize);font-weight:var(--f-ui-03-fontWeight);line-height:var(--f-ui-03-lineHeight);text-transform:uppercase;letter-spacing:0.05em;color:var(--grey-dark)}.card-value{font-family:var(--f-ui-02-fontFamily);font-size:var(--f-ui-02-fontSize);line-height:var(--f-ui-02-lineHeight);color:var(--brand-black);word-wrap:break-word}.card-field:first-child .card-value{font-size:var(--f-ui-01-fontSize);line-height:var(--f-ui-01-lineHeight)}.card-actions{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:0.5rem;padding-top:0.75rem;border-top:1px solid var(--grey-light)}@media (min-width: 640px){.card-grid{grid-template-columns:repeat(auto-fill, minmax(320px, 1fr))}}@media (min-width: 1024px){.card-grid{grid-template-columns:repeat(auto-fill, minmax(350px, 1fr));gap:2rem}}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.items-start{align-items:flex-start}.items-center{align-items:center}.gap-16{gap:1rem}.mb-16{margin-bottom:1rem}.w-full{width:100%}.w-auto{width:auto}@media (min-width: 750px){.flex-md-row{flex-direction:row}.items-md-center{align-items:center}.w-md-auto{width:auto}.w-md-400{width:400px}}";
 var EdsTableStyle0 = edsTableCss;
 
 /**
@@ -15424,11 +16200,10 @@ class EdsTable {
         this.paginationEnabled = true;
         this.searchEnabled = false;
         this.hostWidth = undefined;
-        this.columnSize = 'default';
         this.actions = [];
         this.actionTemplate = undefined;
         this.sortingEnabled = false;
-        this.theme = 'color';
+        this.theme = 'brand';
         this.view = 'table';
         this.showViewToggle = false;
         this.parsedActions = [];
@@ -15460,6 +16235,8 @@ class EdsTable {
         }
     }
     componentWillLoad() {
+        // 'default' / 'color' themes are disabled — always render the brand theme.
+        this.theme = 'brand';
         this.parseConfig();
         this.handleActionsChange();
         this.parseData();
@@ -15595,19 +16372,6 @@ class EdsTable {
             this.columns.push('actions');
         }
     }
-    getVisibleColumnsCount() {
-        return this.columns.filter((column) => { var _a; return !((_a = this.parsedConfig[column]) === null || _a === void 0 ? void 0 : _a.hidden); }).length;
-    }
-    divisionFactor() {
-        let divisionFactor = 1;
-        if (this.columnSize === 'medium') {
-            divisionFactor = 2;
-        }
-        else if (this.columnSize === 'large') {
-            divisionFactor = 4;
-        }
-        return divisionFactor;
-    }
     capitalize(str) {
         return str.charAt(0).toUpperCase() + str.slice(1).toLowerCase();
     }
@@ -15642,24 +16406,23 @@ class EdsTable {
         const dataColumns = this.columns.filter((col) => { var _a; return col !== 'actions' && !((_a = this.parsedConfig[col]) === null || _a === void 0 ? void 0 : _a.hidden); });
         return (hAsync("div", { class: "card-grid" }, rows.map((row) => (hAsync("div", { class: "data-card" }, hAsync("div", { class: "card-content" }, dataColumns.map((col) => (hAsync("div", { class: "card-field" }, hAsync("span", { class: "card-label" }, this.capitalize(col)), hAsync("span", { class: "card-value" }, this.renderCell(row[col], col)))))), this.parsedActions.length > 0 && (hAsync("div", { class: "card-actions" }, this.parsedActions.map((act) => (hAsync("span", null, this.renderSingleActionCell(act.name, row)))))))))));
     }
-    renderTableView(paginatedRows, currentContainerWidth, visibleColumnsCount) {
-        const columnWidth = visibleColumnsCount > 0 ? Math.floor((currentContainerWidth / visibleColumnsCount) * this.divisionFactor()) : 100;
+    renderTableView(paginatedRows) {
         return (hAsync("div", { class: `mt-20 ${this.theme === 'brand' ? 'brand-table-wrapper' : ''}` }, hAsync("table", { class: `${this.theme === 'brand' ? '' : 'block overflow-x-auto'} mt-6 p-0 ${this.theme === 'brand' ? 'brand-table' : ''}` }, hAsync("thead", { class: this.theme === 'brand' ? 'brand-thead' : '' }, hAsync("tr", { class: `m-0 p-0 border border-softer table-row-${this.theme} ${this.theme === 'brand' ? 'brand-header-row' : ''}` }, this.columns
             .filter((col) => { var _a; return col === 'actions' || !((_a = this.parsedConfig[col]) === null || _a === void 0 ? void 0 : _a.hidden); })
             .map((col) => {
             if (col === 'actions') {
-                return (hAsync("th", { class: "m-0 py-8 border border-softer f-ui-02 break-words", style: this.theme === 'brand' ? {} : { minWidth: `${columnWidth - 4}px` } }));
+                return (hAsync("th", { class: "m-0 py-8 border border-softer f-ui-02 break-words" }));
             }
-            return (hAsync("th", { class: "m-0 py-8 border border-softer f-ui-02 break-words", style: this.theme === 'brand' ? {} : { minWidth: `${columnWidth - 4}px` } }, hAsync("div", { style: { display: 'flex', alignItems: 'center', justifyContent: 'center', gap: '0.25rem' } }, hAsync("span", null, this.capitalize(col)), this.sortingEnabled && (hAsync("eds-icon-wrapper", { name: this.sortColumn === col
+            return (hAsync("th", { class: "m-0 py-8 border border-softer f-ui-02 break-words" }, hAsync("div", { style: { display: 'flex', alignItems: 'center', justifyContent: 'center', gap: '0.25rem' } }, hAsync("span", null, this.capitalize(col)), this.sortingEnabled && (hAsync("eds-icon-wrapper", { name: this.sortColumn === col
                     ? this.sortDirection === 'asc'
                         ? 'chevron-up'
                         : 'chevron-down'
                     : 'chevron-down', "aria-label": `Sort by ${col}`, onClick: () => this.handleSort(col), style: { cursor: 'pointer' } })))));
-        }))), hAsync("tbody", null, paginatedRows.map((row) => (hAsync("tr", { class: `m-0 p-0 border border-softer table-row-${this.theme} ${this.theme === 'brand' ? 'brand-row' : ''}` }, this.columns
+        }))), hAsync("tbody", null, paginatedRows.map((row) => (hAsync("tr", { class: `m-0 p-0 border border-softer table-row-${this.theme} ${this.theme === 'brand' ? 'brand-row' : ''} ${this.parsedActions.length > 0 ? 'has-actions' : ''}` }, this.columns
             .filter((col) => { var _a; return col === 'actions' || !((_a = this.parsedConfig[col]) === null || _a === void 0 ? void 0 : _a.hidden); })
             .map((col) => {
             if (col === 'actions') {
-                return (hAsync("td", { class: "text-center border border-softer m-0 f-ui-01 break-words actions-cell", style: this.theme === 'brand' ? {} : { minWidth: `${columnWidth - 4}px` } }, hAsync("div", { role: "toolbar", "aria-label": "Row actions", onKeyDown: this.onActionKeyDown, style: {
+                return (hAsync("td", { class: "text-center border border-softer m-0 f-ui-01 break-words actions-cell" }, hAsync("div", { role: "toolbar", "aria-label": "Row actions", onKeyDown: this.onActionKeyDown, style: {
                         display: 'flex',
                         gap: '0.5rem',
                         justifyContent: 'center',
@@ -15667,18 +16430,16 @@ class EdsTable {
                     } }, this.parsedActions.map((act) => (hAsync("span", { style: { whiteSpace: 'nowrap' } }, this.renderSingleActionCell(act.name, row)))))));
             }
             // Regular data cell
-            return (hAsync("td", { class: "text-center border border-softer m-0 py-8 f-ui-02 break-words", style: this.theme === 'brand' ? {} : { minWidth: `${columnWidth - 4}px` } }, this.renderCell(row[col], col)));
+            return (hAsync("td", { class: "text-center border border-softer m-0 py-8 f-ui-02 break-words" }, this.renderCell(row[col], col)));
         }))))))));
     }
     render() {
-        const currentContainerWidth = this.hostWidth && this.hostWidth.trim() !== '' ? Number(this.hostWidth) : this.containerWidth || 400;
-        const visibleColumnsCount = this.getVisibleColumnsCount();
         const paginatedRows = this.getPaginatedRows();
         const lastPage = Math.ceil(this.totalRows / this.rowsPerPage);
         const showControls = this.showViewToggle || this.searchEnabled;
-        return (hAsync("div", { key: 'ca547566767c7bccd7b894dad5819ed74e9e281d' }, showControls && (hAsync("div", { key: '47c6fa14c2dbe499617dc31df1fd578bde473c6f', class: "controls-container flex-col flex-md-row items-start items-md-center justify-between gap-16 mb-16" }, this.showViewToggle && (hAsync("div", { key: '7f63fd07e67eaca9abc9d0700d7824e0f474dc23', class: "view-toggle-wrapper" }, hAsync("eds-switch", { key: 'f52b744b0e83295c1641f338212bae5843970ab9', variant: "segmented", labelOff: "Table View", labelOn: "Card View", checked: this.view === 'card', onUiswitch: this.handleViewChange }))), this.searchEnabled && (hAsync("div", { key: '5ebb3620be6161a1d7e1881cb5d33f5aac2e12a4', class: `search-wrapper w-full ${this.showViewToggle ? 'w-md-400' : ''}` }, hAsync("eds-input-field", { key: 1, icon: "search", name: "search", "aria-label": "Search", type: "text", placeholder: "Search...", onInput: (event) => this.handleSearch(event) }))))), this.view === 'card'
+        return (hAsync("div", { key: '1e8a2f5f19df240ee3a57951641b60b947342fad' }, showControls && (hAsync("div", { key: '778fe091226330448bba089189e9dd6a6aa977a9', class: "controls-container flex-col flex-md-row items-start items-md-center justify-between gap-16 mb-16" }, this.showViewToggle && (hAsync("div", { key: '7ef287464bb2fba846be5341f4bb0e71d982be0e', class: "view-toggle-wrapper" }, hAsync("eds-switch", { key: '2d3a494a5b354a14c8e882a153633bd5e85a40ab', variant: "segmented", labelOff: "Table View", labelOn: "Card View", checked: this.view === 'card', onUiswitch: this.handleViewChange }))), this.searchEnabled && (hAsync("div", { key: 'dfcf6d0bdc23cb10481121881a7656b02a0599c1', class: `search-wrapper w-full ${this.showViewToggle ? 'w-md-400' : ''}` }, hAsync("eds-input-field", { key: 1, icon: "search", name: "search", "aria-label": "Search", type: "text", placeholder: "Search...", onInput: (event) => this.handleSearch(event) }))))), this.view === 'card'
             ? this.renderCardView(paginatedRows)
-            : this.renderTableView(paginatedRows, currentContainerWidth, visibleColumnsCount), this.shouldEnablePagination() && (hAsync("div", { key: 'bed5232d5ff9d7cac22ac2537876a388f35c85a6', class: "mt-20" }, hAsync("eds-pagination", { key: 'ec91525689028f6cfe2721e290f5c5c7097ab67a', currentPage: this.currentPage, lastPage: lastPage, perPage: this.rowsPerPage, total: this.totalRows, mode: "default" })))));
+            : this.renderTableView(paginatedRows), this.shouldEnablePagination() && (hAsync("div", { key: '3f7faafdd6147855cb8812ff6303c335c7fd1f35', class: "mt-20" }, hAsync("eds-pagination", { key: '17705ba01a8ca8cc79bacfce34e55f11ce53d70c', currentPage: this.currentPage, lastPage: lastPage, perPage: this.rowsPerPage, total: this.totalRows, mode: "default" })))));
     }
     get hostEl() { return getElement(this); }
     static get watchers() { return {
@@ -15697,11 +16458,10 @@ class EdsTable {
             "paginationEnabled": [4, "pagination-enabled"],
             "searchEnabled": [4, "search-enabled"],
             "hostWidth": [1, "host-width"],
-            "columnSize": [1, "column-size"],
             "actions": [1],
             "actionTemplate": [16],
             "sortingEnabled": [4, "sorting-enabled"],
-            "theme": [1],
+            "theme": [1025],
             "view": [1025],
             "showViewToggle": [4, "show-view-toggle"],
             "parsedActions": [32],
@@ -15722,7 +16482,7 @@ class EdsTable {
     }; }
 }
 
-const edsTabsCss = ":host{display:block}.tabs-container{display:flex;gap:0.25rem;padding:0.25rem;border-radius:10px;width:fit-content;margin-bottom:3rem}.tabs-container-default{background-color:var(--brand-black, #07140D);border:1px solid rgba(255, 255, 255, 0.06)}.tabs-container-inverse{background:rgba(0, 0, 0, 0.02);border:1px solid rgba(0, 0, 0, 0.06)}.tabs-nav{display:flex;gap:0.25rem}.tab{padding:0.625rem 1.25rem;border-radius:8px;font-size:1.125rem;cursor:pointer;transition:all 0.2s ease;border:none;background:transparent;font-family:'IBM Plex Sans', sans-serif;white-space:nowrap;outline:none}.tab:focus-visible{outline:3px solid var(--brand-green);outline-offset:2px}.tab-default{color:var(--grey-700)}.tab-default:hover{color:var(--white)}.tab-default.tab-active{background:rgba(0, 255, 157, 0.1);color:var(--brand-green)}.tab-inverse{color:var(--grey-700)}.tab-inverse:hover{color:var(--brand-black)}.tab-inverse.tab-active{background:rgba(0, 200, 123, 0.1);color:var(--brand-green-dark)}.tab-panels{margin-top:2rem}.tab-panels>div{outline:none}.tab-panels>div:focus-visible{outline:3px solid var(--brand-green);outline-offset:2px;border-radius:4px}@media (max-width: 768px){.tabs-container{width:100%;overflow-x:auto}.tabs-nav{width:100%;min-width:fit-content}}";
+const edsTabsCss = ":host{display:block}.tabs-container{display:flex;gap:0.25rem;padding:0.25rem;border-radius:10px;width:fit-content;margin-bottom:3rem}.tabs-container-default{background-color:var(--brand-black, #07140D);border:1px solid rgba(255, 255, 255, 0.06)}.tabs-container-inverse{background:rgba(0, 0, 0, 0.02);border:1px solid rgba(0, 0, 0, 0.06)}.tabs-nav{display:flex;gap:0.25rem}.tab{padding:0.625rem 1.25rem;border-radius:8px;font-size:1.125rem;cursor:pointer;transition:color 0.15s ease;border:none;background:transparent;font-family:'IBM Plex Sans', sans-serif;white-space:nowrap;outline:none}.tab:focus-visible{outline:3px solid var(--brand-green);outline-offset:2px}.tab-default{color:var(--grey-700)}.tab-default:hover{color:var(--white)}.tab-default.tab-active{background:rgba(0, 255, 157, 0.1);color:var(--brand-green)}.tab-inverse{color:var(--grey-700)}.tab-inverse:hover{color:var(--brand-black)}.tab-inverse.tab-active{background:rgba(0, 200, 123, 0.1);color:var(--brand-green-dark)}.tab-panels{margin-top:2rem}.tab-panels>div{outline:none}.tab-panels>div:focus-visible{outline:3px solid var(--brand-green);outline-offset:2px;border-radius:4px}@media (max-width: 768px){.tabs-container{width:100%;overflow-x:auto}.tabs-nav{width:100%;min-width:fit-content}}";
 var EdsTabsStyle0 = edsTabsCss;
 
 /**
@@ -15761,14 +16521,28 @@ class EdsTabs {
     }
     /**
      * Parses the `tabs` prop into an array of tab objects.
+     *
+     * Note: we deliberately do NOT clear `tabRefs` here. Consumers
+     * often re-pass `tabs` with an updated `active` flag every time
+     * the user switches tabs (Vue/React re-render on event). Wiping
+     * the refs leaves a window in which a queued focus() call sees
+     * `tabRefs[index] === undefined` and silently no-ops — focus
+     * gets stuck on the previous tab even though `aria-selected` and
+     * the background already moved. Stencil re-binds refs on render,
+     * so the array stays in sync without us emptying it; we only
+     * truncate when the new list is shorter to drop stale entries.
      */
     parseTabs() {
         this.parsedTabs = parseData(this.tabs);
-        this.tabRefs = [];
+        if (this.tabRefs.length > this.parsedTabs.length) {
+            this.tabRefs.length = this.parsedTabs.length;
+        }
     }
     componentDidUpdate() {
-        if (this.tabRefs.length !== this.parsedTabs.length) {
-            this.tabRefs = new Array(this.parsedTabs.length).fill(null);
+        // Same reasoning as parseTabs: only shrink, never re-allocate
+        // to nulls — that would re-introduce the silent-no-op window.
+        if (this.tabRefs.length > this.parsedTabs.length) {
+            this.tabRefs.length = this.parsedTabs.length;
         }
     }
     setActiveIndex() {
@@ -15779,6 +16553,7 @@ class EdsTabs {
         }
     }
     handleTabClick(index, tabLabel, shouldFocus = true) {
+        var _a;
         if (index < 0 || index >= this.parsedTabs.length) {
             return;
         }
@@ -15793,11 +16568,34 @@ class EdsTabs {
                 action: 'click'
             });
         }
-        if (shouldFocus && this.tabRefs[index]) {
-            setTimeout(() => {
+        if (shouldFocus) {
+            // Focus must move SYNCHRONOUSLY, while the keydown event
+            // that triggered this call is still on the stack. Otherwise
+            // the browser's `:focus-visible` heuristic doesn't flag the
+            // focus move as keyboard-driven and the outline never paints
+            // — accessibility regression (WCAG 2.4.7).
+            //
+            // We query by static id (`#tab-${index}`) instead of using
+            // `tabRefs[index]` because consumer-driven prop changes can
+            // briefly drop the cached ref. The button id is set in
+            // `render()` and doesn't depend on active state, so it is
+            // always findable.
+            const findBtn = () => { var _a; return ((_a = this.el.shadowRoot) !== null && _a !== void 0 ? _a : this.el).querySelector(`#tab-${index}`); };
+            (_a = findBtn()) === null || _a === void 0 ? void 0 : _a.focus();
+            // Belt-and-suspenders: if a consumer reacts to the `tab`
+            // event by re-rendering our buttons (rare, but possible
+            // when the `tabs` prop is recomputed), the sync focus above
+            // landed on a button that is now detached. Re-focus once
+            // the next frame's DOM is in place. We only act if focus
+            // genuinely isn't on the right element, to avoid a redundant
+            // focus call that would reset selection/IME state.
+            requestAnimationFrame(() => {
                 var _a;
-                (_a = this.tabRefs[index]) === null || _a === void 0 ? void 0 : _a.focus();
-            }, 0);
+                const after = findBtn();
+                if (after && ((_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.activeElement) !== after) {
+                    after.focus();
+                }
+            });
         }
     }
     onKeyDown(ev, idx) {
@@ -15831,7 +16629,7 @@ class EdsTabs {
             'tabs-container',
             `tabs-container-${this.variant}`
         ].join(' ');
-        return (hAsync("div", { key: '66e0871d6cd917c15598b6e3ea80e5ff82970029', id: `${this.identifier}` }, hAsync("div", { key: 'c65163e33fcf4960bbcc367a2abf62c0aec99446', class: containerClasses }, hAsync("nav", { key: 'fae5e0f23904318299d60e1d3212f84b8c5a0bed', role: "tablist", class: "tabs-nav", "aria-label": this.navAriaLabel }, this.parsedTabs.map((tab, index) => {
+        return (hAsync("div", { key: '646f43031cde2e0ab84d2830fd9477841b3c757b', id: `${this.identifier}` }, hAsync("div", { key: '2eb01c96640c6fc602777f227525066e5970489e', class: containerClasses }, hAsync("nav", { key: 'b419fc7414574ea70b19433a3c5daa63b5ad6652', role: "tablist", class: "tabs-nav", "aria-label": this.navAriaLabel }, this.parsedTabs.map((tab, index) => {
             const isActive = index === this.activeIndex;
             const tabClasses = [
                 'tab',
@@ -15839,7 +16637,7 @@ class EdsTabs {
                 isActive ? 'tab-active' : ''
             ].filter(Boolean).join(' ');
             return (hAsync("button", { class: tabClasses, type: "button", role: "tab", "aria-selected": isActive ? 'true' : 'false', tabIndex: isActive ? 0 : -1, "aria-label": tab.ariaLabel || tab.label, "aria-controls": `panel-${index}`, id: `tab-${index}`, ref: (el) => this.setTabRef(el, index), onClick: () => this.handleTabClick(index, tab.label, true), onKeyDown: (e) => this.onKeyDown(e, index) }, tab.label || tab.ariaLabel));
-        }))), hAsync("div", { key: 'a259d3e45fbcc5f75303cf8eb256374c67c62db1', class: "tab-panels" }, this.parsedTabs.map((_, index) => (hAsync("div", { role: "tabpanel", id: `panel-${index}`, "aria-labelledby": `tab-${index}`, hidden: index !== this.activeIndex, tabIndex: index === this.activeIndex ? 0 : -1 }, hAsync("slot", { name: `panel-${index}` })))))));
+        }))), hAsync("div", { key: '0ce244b3d2b2120d1bdf127144e9b42e2ad34e52', class: "tab-panels" }, this.parsedTabs.map((_, index) => (hAsync("div", { role: "tabpanel", id: `panel-${index}`, "aria-labelledby": `tab-${index}`, hidden: index !== this.activeIndex, tabIndex: index === this.activeIndex ? 0 : -1 }, hAsync("slot", { name: `panel-${index}` })))))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -15902,7 +16700,7 @@ class EdsTag {
     }
     render() {
         const classes = tagStyles({ intent: this.intent, size: this.size });
-        return (hAsync("span", { key: 'ca20e54df5fc895110b39ce7875c3c0026e94fc3', class: classes }, hAsync("span", { key: '5ad7ada1ae051ff2840bb033ec683b44477f6684', style: { position: 'relative', zIndex: '1' } }, this.label)));
+        return (hAsync("span", { key: '20e1625ac01b0dc1f40356d02622e0649faa7fa7', class: classes }, hAsync("span", { key: '313c3f18c0a5df285afe6a40ded9e68035d9648f', style: { position: 'relative', zIndex: '1' } }, this.label)));
     }
     static get style() { return EdsTagStyle0; }
     static get cmpMeta() { return {
@@ -15964,7 +16762,7 @@ class EdsTimeline {
         }
     }
     render() {
-        return (hAsync("div", { key: '9670bbe26e6f092d88c73268838d9349dca0c323', class: "max-w-sidebar mx-auto px-4 py-8" }, hAsync("div", { key: '202722dc0cb384ce68b2239915f44bf90d87a77e', class: "relative" }, hAsync("div", { key: '59760e5a62518dc6c3cc7fcfa711e060837f4c49', class: "absolute w-4 left-1/2 transform -translate-x-1/2 bg-strong h-full z-0" }), hAsync("div", { key: '2f1f6c5f5e7f2a770fc762b1b886dd199f0cf953', class: "space-y-16" }, this.parsedEvents.map((event, index) => (hAsync("div", { class: "relative flex" }, hAsync("div", { class: `w-1/2 ${index % 2 === 0 ? 'pr-4' : ''}` }, index % 2 === 0 && (hAsync("eds-card-generic", { title: event.title, url: "#", description: event.description, intent: "secondary", tags: JSON.stringify(event.completed
+        return (hAsync("div", { key: '78b199b18d361ae3223e4f1fe9a2043d61f4271b', class: "max-w-sidebar mx-auto px-4 py-8" }, hAsync("div", { key: 'afdfdf7dc573a7f273703a02e38e755a9815bdf7', class: "relative" }, hAsync("div", { key: '7affc96f356ee901ca263c7347ae60b84869f28b', class: "absolute w-4 left-1/2 transform -translate-x-1/2 bg-strong h-full z-0" }), hAsync("div", { key: '7ba006234bd1365890e75b7f59aa118265ba727c', class: "space-y-16" }, this.parsedEvents.map((event, index) => (hAsync("div", { class: "relative flex" }, hAsync("div", { class: `w-1/2 ${index % 2 === 0 ? 'pr-4' : ''}` }, index % 2 === 0 && (hAsync("eds-card-generic", { title: event.title, url: "#", description: event.description, intent: "secondary", tags: JSON.stringify(event.completed
                 ? [{ label: 'completed', style: 'accent' }]
                 : [{ label: 'pending', style: 'default' }]), onClick: () => this.handleEventClick(event) }))), hAsync("div", { class: "flex items-center justify-center relative" }, event.completed ? (hAsync("div", { class: "w-32 h-32 bg-accent rounded-full shadow flex items-center justify-center" })) : (hAsync("div", { class: "w-32 h-32 bg-strong rounded-full shadow flex items-center justify-center" }))), hAsync("div", { class: `w-1/2 ${index % 2 !== 0 ? 'pl-4' : ''}` }, index % 2 !== 0 && (hAsync("eds-card-generic", { title: event.title, url: "#", description: event.description, intent: "secondary", tags: JSON.stringify(event.completed
                 ? [{ label: 'completed', style: 'accent' }]
@@ -16140,7 +16938,7 @@ class EdsToastManager {
         this.toasts = this.toasts.filter((t) => t.id !== id);
     }
     render() {
-        return (hAsync("div", { key: 'd707822f33892171428aa926822dff5ffefac219', class: "toast-container" }, this.toasts.map((t) => (hAsync("div", { key: t.id }, hAsync("eds-toast", { message: t.message, intent: t.intent, onClick: () => this.removeToast(t.id) }))))));
+        return (hAsync("div", { key: '989e469e815c6af6b46a14fddee85e4707f86704', class: "toast-container" }, this.toasts.map((t) => (hAsync("div", { key: t.id }, hAsync("eds-toast", { message: t.message, intent: t.intent, onClick: () => this.removeToast(t.id) }))))));
     }
     get hostElement() { return getElement(this); }
     static get style() { return EdsToastManagerStyle0; }
@@ -16179,7 +16977,7 @@ class EdsTooltip {
     }
     render() {
         const positionClass = this.position === 'bottom' ? 'top-full mt-2' : 'bottom-full mb-2';
-        return (hAsync("div", { key: '240956acf8218cb0b36254aecd629058ad39f4eb', class: "relative w-full inline-block group" }, hAsync("slot", { key: '4424c8de31fd4e2aa702369314cf0819447ca364' }), hAsync("div", { key: 'f260ef6ee9700231dc77ddc9debc7f5b92f546c6', class: `absolute ${positionClass}
+        return (hAsync("div", { key: '8b4396894b1ec7cc1c2d928ffa5b3d7628f8c4ee', class: "relative w-full inline-block group" }, hAsync("slot", { key: 'c2547098aacc584960f217edcafeb060ce742adc' }), hAsync("div", { key: '1e6beac7e4294456f7a6130c4b0573cce3e4b548', class: `absolute ${positionClass}
             rounded-xs bg-strongest text-inverse 
             f-ui-03-light pointer-events-none 
             z-10 px-4 opacity-0 transition-opacity duration-150 ease-in-out
@@ -16200,6 +16998,220 @@ class EdsTooltip {
     }; }
 }
 
+/* eslint-disable */
+/**
+ * Official EBRAINS sphere mark, extracted from
+ * packages/assets/EBRAINS_logo_25/new_ebrains_logo_rgb/250901_new_ebrains_logo_rgb_positive.svg
+ * (the gradient-filled wave segments only — wordmark dropped).
+ *
+ * Gradient ids carry a `__UID__` placeholder so each badge instance can
+ * namespace them (no <defs> collisions when several badges share a page).
+ * Gradient template inheritance uses SVG2 `href` (no xlink namespace needed).
+ * Use markDefs() inside the badge <defs> and markGroup() in the body.
+ */
+const MARK_DEFS = `<linearGradient id="__UID__Unbenannter_Verlauf_29" x1="-26.7" y1="64.8" x2="155" y2="-19.9" gradientUnits="userSpaceOnUse"> <stop offset="0" stop-color="#03a98f"/> <stop offset=".1" stop-color="#10a97b"/> <stop offset=".3" stop-color="#23aa5f"/> <stop offset="1" stop-color="#00ff9d"/> </linearGradient><linearGradient id="__UID__Unbenannter_Verlauf_291" x1="38.6" y1="205" x2="220.3" y2="120.2" href="#__UID__Unbenannter_Verlauf_29"/><linearGradient id="__UID__Unbenannter_Verlauf_292" x1="33" y1="193" x2="214.8" y2="108.3" href="#__UID__Unbenannter_Verlauf_29"/><linearGradient id="__UID__Unbenannter_Verlauf_293" x1="-3.5" y1="114.7" x2="178.3" y2="30" href="#__UID__Unbenannter_Verlauf_29"/><linearGradient id="__UID__Unbenannter_Verlauf_294" x1="4.5" y1="131.8" x2="186.2" y2="47.1" href="#__UID__Unbenannter_Verlauf_29"/><linearGradient id="__UID__Unbenannter_Verlauf_295" x1="28.6" y1="183.6" x2="210.4" y2="98.9" href="#__UID__Unbenannter_Verlauf_29"/><linearGradient id="__UID__Unbenannter_Verlauf_296" x1="3.8" y1="130.3" x2="185.5" y2="45.5" href="#__UID__Unbenannter_Verlauf_29"/><linearGradient id="__UID__Unbenannter_Verlauf_297" x1="18" y1="160.6" x2="199.7" y2="75.9" href="#__UID__Unbenannter_Verlauf_29"/>`;
+const MARK_PATHS = `<path fill="url(#__UID__Unbenannter_Verlauf_29)" d="M67.3,19.9c11.2-2.3,22.5-1,32.1,1.5.8.2,1.2-.8.5-1.3-11.6-7.3-20.9-11.4-26.6-13.5l-18.3,4.9c-3.4.9-6.4,2.7-8.9,5.1l-29.6,29.6c-2.5,2.5-4.2,5.5-5.1,8.9l-.7,2.6c1.7-1.5,3.4-3.2,5.2-4.9,12.6-12,29.9-28.4,51.3-32.9Z"/><path fill="url(#__UID__Unbenannter_Verlauf_291)" d="M33.8,172.2l12.3,12.3c2.5,2.5,5.5,4.2,8.9,5.1l40.4,10.8c3.4.9,6.9.9,10.2,0l40.4-10.8c3.4-.9,6.4-2.7,8.9-5.1l2.8-2.8c-80-32.2-119-12.3-123.9-9.5Z"/><path fill="url(#__UID__Unbenannter_Verlauf_292)" d="M97.7,137.4c-25.1.2-51.1.4-78.8,19.8l10.5,10.5h.1c2-1.5,42.4-27.9,132.8,9.1h.2c0,.1,18.6-18.4,18.6-18.4-7.8-2.8-58.6-21-83.1-21h-.3Z"/><path fill="url(#__UID__Unbenannter_Verlauf_293)" d="M137.2,41h0c2.6,2.4,5.3,5,8,7.7,26.3,26.3,43.8,37.2,53.9,41.8l-9.5-35.5c-.9-3.4-2.7-6.4-5.1-8.9l-29.6-29.6c-2.5-2.5-5.5-4.2-8.9-5.1L105.7.7c-3.4-.9-6.9-.9-10.2,0l-12.1,3.2c12.4,5.6,31.5,16.5,53.7,37,0,0,.1.1.2.2Z"/><path fill="url(#__UID__Unbenannter_Verlauf_294)" d="M132.7,86.1c4.9,1.6,26.3,12,26.3,12,1.7.7,7.3,3.3,8.9,4.1.7.3,1.3-.6.8-1.1-1.5-1.4-5.8-5-10.9-8.6,0,0-21.8-15.4-27.2-18.5-7.8-4.3-47.4-26.7-81.3-10C25.8,75.6,8,89.7.6,96c-.8,3.2-.7,6.5.1,9.7l3.4,12.8c7.2-6.7,20.2-17.2,40.4-28.2,35.4-19.2,61.9-12.8,88.2-4.2Z"/><path fill="url(#__UID__Unbenannter_Verlauf_295)" d="M55.9,128c-3.1,1.7-17.5,10.3-17.5,10.3,0,0-4.9,3-.2,1.9,2-.5,7.8-3.1,9.7-3.6,0,0,19.1-7,49.8-5.4.1,0,.2,0,.4,0,27.6,0,84.2,21,86.6,21.9l1.1.5c1.8-2.2,3.2-4.7,3.9-7.5l2.7-10.2c-14.1-5.9-55.1-22.3-81-22.3s-55.3,14.3-55.5,14.4Z"/><path fill="url(#__UID__Unbenannter_Verlauf_296)" d="M131.7,44.5c-2-1.7-4.9-3.9-8.5-6.3-1.8-1.3-3.6-2.3-5.4-3.2-8.1-4.1-29.1-13.1-49.2-9-19.7,4.1-35.5,19.2-48.2,31.3-4.7,4.5-8.7,8.3-12.4,11.1l-4.6,17.2c9.4-7.4,24.4-18,43.2-27.2,36.9-18.1,79.2,5.4,87.3,10.3,12.1,7.3,47.9,34.4,64,46.8l2.6-9.8c.7-2.5.8-5,.5-7.5-10.4-3.8-29.7-14.5-60.2-45-3.1-3.1-6.1-5.9-9.1-8.6Z"/><path fill="url(#__UID__Unbenannter_Verlauf_297)" d="M47.5,95.8c-22.1,12-35.5,23.6-41.5,29.6l5.5,20.7c.3,1.2.8,2.4,1.4,3.5,9.5-9.3,38.6-26.3,39.8-27,1-.6,25.6-15.3,58.7-15.3s67.5,16,82.6,22.4l1.1-4.2c-9.9-6.7-37.4-24.5-64.4-33.5-24.9-8.3-50-14.3-83.2,3.8Z"/>`;
+/** Gradient <defs> for the mark, namespaced with `uid`. */
+function markDefs(uid) {
+    return MARK_DEFS.replace(/__UID__/g, uid);
+}
+/**
+ * The mark paths wrapped in a positioned, scaled group.
+ * The source artwork lives in a ~201×201 canvas; `size` is the rendered px.
+ */
+function markGroup(uid, x, y, size = 16) {
+    const s = (size / 201.1).toFixed(4);
+    const paths = MARK_PATHS.replace(/__UID__/g, uid);
+    return `<g transform="translate(${x},${y}) scale(${s})">${paths}</g>`;
+}
+
+const edsTrlBadgeCss = ":host{display:inline-block;line-height:0;}.link{display:inline-block;line-height:0;text-decoration:none;color:inherit}.link svg{display:block}";
+var EdsTrlBadgeStyle0 = edsTrlBadgeCss;
+
+let _uid = 0;
+/**
+ * `EdsTrlBadge` — public EBRAINS TRL badge, aligned with the EBRAINS visual
+ * system (Black `#07140D`, Green `#00FF9D`, Dark Green `#00C87B`, Grey
+ * `#7A7B7A`, IBM Plex Mono) and using the **official EBRAINS sphere mark**.
+ *
+ * Renders a self-contained inline `<svg>` (same markup the server-side
+ * `badge.svg` endpoint emits), so it embeds anywhere and stays crisp.
+ *
+ * Variants:
+ * - `tone`     — CI-style label + value pill (dark or light `theme`).
+ * - `full`     — single bar with the full string.
+ * - `pill`     — compact rounded "TRL 7".
+ * - `outline`  — thin border, transparent fill, mono caps (dark or light).
+ * - `scale`    — nine readiness pips showing position on the 1–9 scale.
+ *
+ * The value/pip colour encodes maturity within the brand palette:
+ * TRL 7–9 → green, 4–6 → dark green, 1–3 → grey.
+ *
+ * @example
+ * <eds-trl-badge level={7} assessed="2026-06" methodology="v8.2"></eds-trl-badge>
+ * <eds-trl-badge level={7} variant="outline" theme="light"></eds-trl-badge>
+ * <eds-trl-badge level={7} variant="scale" size={32}></eds-trl-badge>
+ */
+class EdsTrlBadge {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /** Per-instance suffix so the mark's gradient ids never collide. */
+        this.uid = `trl${++_uid}-`;
+        this.level = undefined;
+        this.assessed = undefined;
+        this.methodology = undefined;
+        this.theme = 'dark';
+        this.variant = 'tone';
+        this.size = undefined;
+        this.label = 'EBRAINS TRL';
+        this.href = undefined;
+    }
+    esc(s) {
+        return String(s).replace(/&/g, '&amp;').replace(/</g, '&lt;')
+            .replace(/>/g, '&gt;').replace(/"/g, '&quot;');
+    }
+    /** Maturity tier → value/pip colour (brand palette). */
+    levelColor() {
+        const n = Number(this.level);
+        if (n >= 7)
+            return '#00FF9D';
+        if (n >= 4)
+            return '#00C87B';
+        return '#7A7B7A';
+    }
+    /** Readable value text on a coloured segment (black on green, light on grey). */
+    valueText() {
+        return Number(this.level) >= 4 ? '#07140D' : '#ECECEC';
+    }
+    fullText() {
+        const parts = [`${this.label} ${this.level}`];
+        if (this.assessed)
+            parts.push(`assessed ${this.assessed}`);
+        if (this.methodology)
+            parts.push(`methodology ${this.methodology}`);
+        return parts.join(' · ');
+    }
+    /** Build the inner markup + intrinsic dimensions for the chosen variant. */
+    build() {
+        const CW = EdsTrlBadge.CW;
+        const uid = this.uid;
+        const clip = `${uid}clip`;
+        const valColor = this.levelColor();
+        const logoSpace = 28; // 8 margin + ~16 mark + 4 gap
+        const mono = `font-family="'IBM Plex Mono',monospace"`;
+        const lvl = this.esc(String(this.level));
+        if (this.variant === 'full') {
+            const tail = (this.assessed ? ` · assessed ${this.esc(this.assessed)}` : '') +
+                (this.methodology ? ` · methodology ${this.esc(this.methodology)}` : '');
+            const w = Math.ceil(logoSpace + this.fullText().length * CW + 10);
+            const inner = `<defs><clipPath id="${clip}"><rect width="${w}" height="24" rx="6"/></clipPath>${markDefs(uid)}</defs>` +
+                `<g clip-path="url(#${clip})"><rect width="${w}" height="24" fill="#07140D"/></g>${markGroup(uid, 8, 4, 16)}` +
+                `<text x="30" y="15.5" ${mono} font-size="11" letter-spacing=".2">` +
+                `<tspan fill="#ECECEC">${this.esc(this.label)} </tspan>` +
+                `<tspan fill="${valColor}" font-weight="600">${lvl}</tspan>` +
+                `<tspan fill="#7A7B7A">${this.esc(tail)}</tspan></text>`;
+            return { w, h: 24, inner };
+        }
+        if (this.variant === 'pill') {
+            const txt = `TRL ${this.level}`;
+            const w = Math.ceil(logoSpace + txt.length * CW + 14);
+            const tx = logoSpace + (w - logoSpace) / 2 - 4;
+            const inner = `<defs>${markDefs(uid)}</defs>` +
+                `<rect width="${w}" height="24" rx="12" fill="#07140D"/>${markGroup(uid, 7, 4, 16)}` +
+                `<text x="${tx}" y="16" ${mono} font-size="11" font-weight="500" letter-spacing=".5" text-anchor="middle">` +
+                `<tspan fill="#ECECEC">TRL </tspan><tspan fill="${valColor}" font-weight="600">${lvl}</tspan></text>`;
+            return { w, h: 24, inner };
+        }
+        if (this.variant === 'outline') {
+            const dark = this.theme !== 'light';
+            const bg = dark ? '#0c1c14' : '#ffffff';
+            const stroke = dark ? '#34473d' : '#07140D';
+            const labelColor = dark ? '#ECECEC' : '#07140D';
+            const sep = dark ? '#5a6b62' : '#9aa39d';
+            const value = dark ? valColor : (Number(this.level) >= 4 ? '#00966a' : '#7A7B7A');
+            const w = Math.ceil(logoSpace + (this.label + ' · ' + this.level).length * CW + 12);
+            const inner = `<defs>${markDefs(uid)}</defs>` +
+                `<rect x=".5" y=".5" width="${w - 1}" height="23" rx="6" fill="${bg}" stroke="${stroke}"/>${markGroup(uid, 8, 4, 16)}` +
+                `<text x="30" y="16" ${mono} font-size="11" letter-spacing=".3">` +
+                `<tspan fill="${labelColor}">${this.esc(this.label)} </tspan>` +
+                `<tspan fill="${sep}">· </tspan>` +
+                `<tspan fill="${value}" font-weight="600">${lvl}</tspan></text>`;
+            return { w, h: 24, inner };
+        }
+        if (this.variant === 'scale') {
+            const dark = this.theme !== 'light';
+            const bg = dark ? '#07140D' : '#ECECEC';
+            const labelColor = dark ? '#ECECEC' : '#07140D';
+            const emptyPip = dark ? '#2f4339' : '#c4ccc7';
+            const sep = dark ? '#5a6b62' : '#9aa39d';
+            const n = Math.max(0, Math.min(9, Number(this.level) || 0));
+            const pipStart = Math.ceil(30 + this.label.length * CW + 12);
+            const pipStep = 9, pipW = 6, pipH = 8, pipY = 9;
+            let pips = '';
+            for (let i = 0; i < 9; i++) {
+                const x = pipStart + i * pipStep;
+                pips += `<rect x="${x}" y="${pipY}" width="${pipW}" height="${pipH}" rx="1" fill="${i < n ? valColor : emptyPip}"/>`;
+            }
+            const valueX = pipStart + 9 * pipStep + 5;
+            const w = Math.ceil(valueX + `${this.level}/9`.length * CW + 8);
+            const inner = `<defs>${markDefs(uid)}</defs>` +
+                `<rect width="${w}" height="26" rx="6" fill="${bg}"/>${markGroup(uid, 8, 5, 16)}` +
+                `<text x="30" y="17" ${mono} font-size="11" letter-spacing=".3" fill="${labelColor}">${this.esc(this.label)}</text>` +
+                `<g>${pips}</g>` +
+                `<text x="${valueX}" y="17" ${mono} font-size="11" font-weight="500">` +
+                `<tspan fill="${valColor}">${lvl}</tspan><tspan fill="${sep}">/9</tspan></text>`;
+            return { w, h: 26, inner };
+        }
+        // tone (default) — dark or light theme
+        const dark = this.theme !== 'light';
+        const labelBg = dark ? '#07140D' : '#ECECEC';
+        const labelTextColor = dark ? '#ECECEC' : '#07140D';
+        const valTextColor = dark ? this.valueText() : '#07140D';
+        const labelSegW = Math.ceil(logoSpace + this.label.length * CW + 12);
+        const valSegW = Math.ceil(12 + String(this.level).length * CW + 12);
+        const w = labelSegW + valSegW;
+        const inner = `<defs><clipPath id="${clip}"><rect width="${w}" height="24" rx="6"/></clipPath>${markDefs(uid)}</defs>` +
+            `<g clip-path="url(#${clip})"><rect width="${labelSegW}" height="24" fill="${labelBg}"/>` +
+            `<rect x="${labelSegW}" width="${valSegW}" height="24" fill="${valColor}"/></g>${markGroup(uid, 8, 4, 16)}` +
+            `<text x="${logoSpace + (labelSegW - logoSpace) / 2}" y="16" ${mono} font-size="11" letter-spacing=".4" fill="${labelTextColor}" text-anchor="middle">${this.esc(this.label)}</text>` +
+            `<text x="${labelSegW + valSegW / 2}" y="16" ${mono} font-size="11" font-weight="600" fill="${valTextColor}" text-anchor="middle">${lvl}</text>`;
+        return { w, h: 24, inner };
+    }
+    buildSvg() {
+        const { w, h, inner } = this.build();
+        const aria = this.esc(this.fullText());
+        const k = this.size ? this.size / h : 1;
+        const outW = Math.round(w * k);
+        const outH = Math.round(h * k);
+        return `<svg xmlns="http://www.w3.org/2000/svg" width="${outW}" height="${outH}" ` +
+            `viewBox="0 0 ${w} ${h}" role="img" aria-label="${aria}"><title>${aria}</title>${inner}</svg>`;
+    }
+    render() {
+        const svg = this.buildSvg();
+        return (hAsync(Host, { key: 'eddfb49f35ff9771d76eef13a024b840b3a24cca' }, this.href ? (hAsync("a", { class: "link", href: this.href, "aria-label": this.fullText(), innerHTML: svg })) : (hAsync("span", { class: "link", innerHTML: svg }))));
+    }
+    static get style() { return EdsTrlBadgeStyle0; }
+    static get cmpMeta() { return {
+        "$flags$": 9,
+        "$tagName$": "eds-trl-badge",
+        "$members$": {
+            "level": [2],
+            "assessed": [1],
+            "methodology": [1],
+            "theme": [1],
+            "variant": [1],
+            "size": [2],
+            "label": [1],
+            "href": [1]
+        },
+        "$listeners$": undefined,
+        "$lazyBundleId$": "-",
+        "$attrsToReflect$": []
+    }; }
+}
+// IBM Plex Mono advance width at 11px (used to size segments to the text).
+EdsTrlBadge.CW = 6.8;
+
 const edsUserCss = "hr,p{margin:0}.block{display:block}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.text-default{color:var(--black)}.min-w-\\[280px\\]{min-width:280px}.p-8{padding:0.5rem}.gap-x-16{-moz-column-gap:1rem;column-gap:1rem}.gap-y-8{row-gap:0.5rem}.pb-16{padding-bottom:1rem}.border-b-2{border-bottom-width:2px}.border-softer{border-color:rgba(0, 0, 0, .1 )}.max-w-full{max-width:100%}.w-full{width:100%}.f-ui-01{font-family:var(--f-ui-01-fontFamily);font-weight:var(--f-ui-01-fontWeight);font-size:var(--f-ui-01-fontSize);line-height:var(--f-ui-01-lineHeight);letter-spacing:var(--f-ui-01-letterSpacing)}.f-ui-03-light{font-family:var(--f-ui-03-light-fontFamily);font-weight:var(--f-ui-03-light-fontWeight);font-size:var(--f-ui-03-light-fontSize);line-height:var(--f-ui-03-light-lineHeight);letter-spacing:var(--f-ui-03-light-letterSpacing)}.text-light{color:var(--grey-700)}.mt-4{margin-top:0.25rem}.mt-16{margin-top:1rem}";
 var EdsUserStyle0 = edsUserCss;
 
@@ -16251,7 +17263,7 @@ class EdsUser {
     render() {
         const user = this.parsedUser;
         //const iconName = this.expanded ? 'chevron-down' : 'chevron-right';
-        return (hAsync("div", { key: 'd23f741600ca86103642bfe17058e8e966ed00e0', class: "block" }, hAsync("div", { key: 'cf73f261fdd219f236a93b4162656ef3178ca419', class: "flex items-center" }, hAsync("eds-dropdown", { key: 'c69a3c95348c765d893aa01d5631d122de428970', ref: (el) => (this.dropdownEl = el), intent: this.intent, "aria-label": "User Menu", "dropdown-pos": "right", "dropdown-offset": "false", icon: "user", label: this.dropdownLabel, class: "text-default", onDropdown: this.handleDropdown }, hAsync("div", { key: 'f142afdf77953f791ca0478af862934d0904dabb', class: "min-w-[280px] p-8" }, hAsync("div", { key: '7ee37a9f2175e626c278071a409a5c26f4331c8a', class: "flex gap-x-16", "data-dropdown-no-close": true }, hAsync("eds-avatar", { key: '7248877a0579d8d15dec94b994af5150c9dbf2c2', "first-name": user.given_name, "last-name": user.family_name, initials: this.initials, color: "black" }), hAsync("div", { key: '1766fb5e2613b434c8de825c90141b4f95be00e1', class: "max-w-full" }, user.name && hAsync("p", { key: 'd36907607f575eeb5425c1f2e32e91034fad6dde', class: "f-ui-01 text-default w-full text-ellipsis" }, user.name), user.preferred_username && hAsync("p", { key: '73e02010d3d54151252903071bbe30168ea7d64a', class: "f-ui-03-light text-light mt-4" }, user.preferred_username), user.email && hAsync("p", { key: 'eb522e6c95f15ef0584c7a90c20bb815ccc5d1a1', class: "f-ui-03-light text-light mt-4" }, user.email))), hAsync("div", { key: 'c4284f4dba1964a949380aa0154419e3215daac4', class: "text-default flex w-full flex-col gap-y-8" }, hAsync("slot", { key: '6476e03cf61ad7517e9742e67b44b9c917d9f329' })))))));
+        return (hAsync("div", { key: '1a9c56a4868b68ea95fdbb19a61435f5fa23b1b5', class: "block" }, hAsync("div", { key: '242beb1cf3dc3e545be84003615eaed119be3e20', class: "flex items-center" }, hAsync("eds-dropdown", { key: 'e75e0305a60936df4deb5b012fa139ca9a6b024f', ref: (el) => (this.dropdownEl = el), intent: this.intent, "aria-label": "User Menu", "dropdown-pos": "right", "dropdown-offset": "false", icon: "user", label: this.dropdownLabel, class: "text-default", onDropdown: this.handleDropdown }, hAsync("div", { key: '09c74d1320e9637e50f7e0f8482e435db7a3319a', class: "min-w-[280px] p-8" }, hAsync("div", { key: 'fa70ecc13e477cf2d2ead8e8dbab4fa3c3587149', class: "flex gap-x-16", "data-dropdown-no-close": true }, hAsync("eds-avatar", { key: '69f059e2002237dd874ba62952c2b014ad94cb8a', "first-name": user.given_name, "last-name": user.family_name, initials: this.initials, color: "black" }), hAsync("div", { key: 'c300f3bbe7f57d82913cef614637188babb82818', class: "max-w-full" }, user.name && hAsync("p", { key: 'dc1a4a26f6c1da6c6e88e5aae484ca2ada2864e6', class: "f-ui-01 text-default w-full text-ellipsis" }, user.name), user.preferred_username && hAsync("p", { key: '76f94c7b0394125d9a6b547722df5545c6b479fd', class: "f-ui-03-light text-light mt-4" }, user.preferred_username), user.email && hAsync("p", { key: '8be3fe5ba1c302d5ef9bfb6d563070c07ed722ca', class: "f-ui-03-light text-light mt-4" }, user.email))), hAsync("div", { key: '191e365fa893122e09c07aa36d1fde5d28b9b3de', class: "text-default flex w-full flex-col gap-y-8" }, hAsync("slot", { key: '8d3fbd032340d5c32fd93ab89b034e7de25ef2e3' })))))));
     }
     get hostEl() { return getElement(this); }
     static get style() { return EdsUserStyle0; }
@@ -16307,7 +17319,7 @@ class GradientPrimaryPalette {
         ];
     }
     render() {
-        return (hAsync("ul", { key: '258789470870c2782879bbf43ee7320b7c20278c', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16", style: {
+        return (hAsync("ul", { key: 'a8696a25aafbfb13acf0966545e33caf6f65545d', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16", style: {
                 background: 'linear-gradient(to bottom, #9CE142 0%, #00C959 50%, #00A595 100%)'
             } }, this.colors.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "effect-height flex items-center justify-between p-16" }, hAsync("div", { class: "grid" }, hAsync("span", { class: "f-body-02" }, color.rgb), hAsync("span", { class: "f-body-02 w-full" }, color.cmyk), hAsync("eds-code-block", { code: color.hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { class: "grid" }, hAsync("span", { class: "f-body-02" }, color.pantoneC), hAsync("span", { class: "f-body-02" }, color.pantoneU))))))));
     }
@@ -16380,19 +17392,19 @@ class GradientSecondaryPalette {
         ];
     }
     render() {
-        return (hAsync("div", { key: '69225b7fdfb7caca0f969c9f8443e5feae1e5049' }, hAsync("ul", { key: '191050a4e4062a36abbe3dcbd341e42cf1bbc729', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, hAsync("li", { key: '1983fa3f61c360c114d0219701e31cb986864b75', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { key: '9f578c04f4bdb27ad92300ee3607f07332798798', class: "effect-height flex items-center justify-between p-16", style: {
+        return (hAsync("div", { key: '0ddb6899f2537c472edbdd0de348c4155a861fff' }, hAsync("ul", { key: 'f5dc4b1ec2fac8da8266e89b3ee51b13bbf2ab6c', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, hAsync("li", { key: 'f0c8c818f3fcf25c565890fc330f0381c5c0dbc6', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { key: 'b6df1db077f85646585b918b155e49ea139bcc82', class: "effect-height flex items-center justify-between p-16", style: {
                 background: this.colors[0].background
-            } }, hAsync("div", { key: '46d3cab1cb3dd781fb0b10a7e2a475a335d3a14b', class: "grid" }, hAsync("span", { key: '20c96e39bb215773e97152fc6232b40c35369492', class: "f-body-02" }, this.colors[0].rgb), hAsync("span", { key: 'bf5eefcd1e597bd459367dde6435337fca6790bb', class: "f-body-02 w-full" }, this.colors[0].cmyk), hAsync("eds-code-block", { key: '439f646e2f45512485a0e871340fe1c0d99af31d', code: this.colors[0].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: 'ff06a5814e4d7a677ea695640235df7f1b09c685', class: "grid" }, hAsync("span", { key: '1f2329355cde34ce8de0db364588a9210414a63f', class: "f-body-02" }, this.colors[0].pantoneC), hAsync("span", { key: 'ce99a877251340fa0fe40cf1a9449c180f3d4f4a', class: "f-body-02" }, this.colors[0].pantoneU))), hAsync("div", { key: 'aeff17cba43d8048125b7934c9359183b98c94e5', class: "effect-height flex items-center justify-between p-16", style: {
+            } }, hAsync("div", { key: '77d1cb3761d5d5d1f415e9b47a31fee3f246dd7c', class: "grid" }, hAsync("span", { key: 'b1d79586fdd0126a44329a6478702803df065afc', class: "f-body-02" }, this.colors[0].rgb), hAsync("span", { key: '463fef5cd7531513f644605f4caba6218ddf08ad', class: "f-body-02 w-full" }, this.colors[0].cmyk), hAsync("eds-code-block", { key: 'e0ecb4d4ec8c30f2de553d8763d50b7346c1148a', code: this.colors[0].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: '1e8f1a7be1aa0418232458729a5bb85d2cb98e4f', class: "grid" }, hAsync("span", { key: 'a82f7eed64466929d0c366ad0cac1dd8d07095b3', class: "f-body-02" }, this.colors[0].pantoneC), hAsync("span", { key: '78c94eaf3d621a16ebc17d210fd3f6baef0e70fe', class: "f-body-02" }, this.colors[0].pantoneU))), hAsync("div", { key: '4b21c9633426e2d49421e9e93adb920306aced13', class: "effect-height flex items-center justify-between p-16", style: {
                 background: this.colors[1].background
-            } }, hAsync("div", { key: '4dbe74c2a516f22ef522d95fa3fb0c5815207a3c', class: "grid" }, hAsync("span", { key: '22867c70b47939d9f9b30078c6873486eef8a03d', class: "f-body-02" }, this.colors[1].rgb), hAsync("span", { key: '0510a917d4b4bc373d6a259cef421c20e6fef0cc', class: "f-body-02 w-full" }, this.colors[1].cmyk), hAsync("eds-code-block", { key: '649226a0e9dc4825c3f009ac1b2044b68b55a80b', code: this.colors[1].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: '70d71385d6f5fa63e64831f31b3ca5c5b15a059f', class: "grid" }, hAsync("span", { key: 'e31cb3e8d926d12dfb59c60e236458311867bd83', class: "f-body-02" }, this.colors[1].pantoneC), hAsync("span", { key: 'f36f4f08dc044852213b42dfde6e106a1b85c982', class: "f-body-02" }, this.colors[1].pantoneU))))), hAsync("eds-block-break", { key: '40c2cdbce85fe5233a167f2133082877ed46fe8a' }), hAsync("ul", { key: '6c0ef5e7552351757cf0f419bf1b254cca6f9121', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, hAsync("li", { key: 'd7b26c790d754d5ba55b3c02f601718c07b2c54a', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { key: '24c753409e5b67d70212ea6a39850b4355ced584', class: "effect-height flex items-center justify-between p-16", style: {
+            } }, hAsync("div", { key: '118a50630946847b09f2792fda6fc86f9c4b458e', class: "grid" }, hAsync("span", { key: '4143c24062fcd7b3313867eb4c13a8a83fbbd644', class: "f-body-02" }, this.colors[1].rgb), hAsync("span", { key: '5ef264bd694c497e2ba0348a36ef1789bcada833', class: "f-body-02 w-full" }, this.colors[1].cmyk), hAsync("eds-code-block", { key: 'a1456423e9173eb95da41584ecded25d5c61766a', code: this.colors[1].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: 'e345d8cc8c51f2d9d1fea9b2c67051ce5ca8f358', class: "grid" }, hAsync("span", { key: '29b7d5bcfb5ac5f95474f053239a49e7fc91799f', class: "f-body-02" }, this.colors[1].pantoneC), hAsync("span", { key: 'b446728afaa56156a254499d335c2a1c8e1b0148', class: "f-body-02" }, this.colors[1].pantoneU))))), hAsync("eds-block-break", { key: 'b3d7bc7434cf9f707cd1827cb2dac72fe70d58e2' }), hAsync("ul", { key: 'c83274127086ebcb67f22d946480636059e313af', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, hAsync("li", { key: '27fbee38a641a525a3dd02f4ad7b6b03fa2f59b5', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { key: '34b924874118811fef752e975532fb6c56692b67', class: "effect-height flex items-center justify-between p-16", style: {
                 background: this.colors[2].background
-            } }, hAsync("div", { key: '058568211b7fe1f9318ca17df97b54e06ae0ea5d', class: "grid" }, hAsync("span", { key: '082e7edbbc979c8481e4c87471d5217fecd70325', class: "f-body-02" }, this.colors[2].rgb), hAsync("span", { key: '1d7f777eeeae24bba34af35a328cfca5be2d6ab8', class: "f-body-02 w-full" }, this.colors[2].cmyk), hAsync("eds-code-block", { key: '2226100dd044fe6cb53652f6384a6b1eff1cf20b', code: this.colors[2].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: '33f9d85cffdd0f83b9caf87805dd18eae875a76d', class: "grid" }, hAsync("span", { key: '6637f361a11e185af2953435c93a76799e6fda05', class: "f-body-02" }, this.colors[2].pantoneC), hAsync("span", { key: '749318eac8b7f37e1da1302bcbd17f93f0af344d', class: "f-body-02" }, this.colors[2].pantoneU))), hAsync("div", { key: '9d3b781a726649c0accc613cb697d01bb42c5e32', class: "effect-height flex items-center justify-between p-16", style: {
+            } }, hAsync("div", { key: '1e28e76e270583923233a207dcf14f155ec1a056', class: "grid" }, hAsync("span", { key: '25ddba2af4b76aff1d3c28711052e23e1f924f35', class: "f-body-02" }, this.colors[2].rgb), hAsync("span", { key: 'a2f75582478b7ac7cb5e5c954fbe6bc41c534714', class: "f-body-02 w-full" }, this.colors[2].cmyk), hAsync("eds-code-block", { key: '5ed9569671f7644be52a63735cd9f91dd0c38e45', code: this.colors[2].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: 'b6c65b860f91f5d1b0dea6320588807b54935260', class: "grid" }, hAsync("span", { key: '75fdc2677a0cf76e2fc458bf6ddafa8f25e47c25', class: "f-body-02" }, this.colors[2].pantoneC), hAsync("span", { key: '48a8182282ab4311ebe104ce812924261f350c52', class: "f-body-02" }, this.colors[2].pantoneU))), hAsync("div", { key: '40f5edd974eff3891f08fb4bb71e627a7fc6c3e3', class: "effect-height flex items-center justify-between p-16", style: {
                 background: this.colors[3].background
-            } }, hAsync("div", { key: 'a6b623c79282ce86a61e729057900ecbb5a68168', class: "grid" }, hAsync("span", { key: 'f6eb8b41c30a9acf4f71f23c4f5dc63475792874', class: "f-body-02" }, this.colors[3].rgb), hAsync("span", { key: 'f0606ad3c6c4676d2899052e33f6c4441953cf6d', class: "f-body-02 w-full" }, this.colors[3].cmyk), hAsync("eds-code-block", { key: 'c910b8bfbe955617edcdaeea4fa3e3398c134b18', code: this.colors[3].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: 'a33a31c3d55d5490eb48800f921408dc48e046d5', class: "grid" }, hAsync("span", { key: 'd74a10f52e474e9db505461bb53c44c9e12405ee', class: "f-body-02" }, this.colors[3].pantoneC), hAsync("span", { key: '01ca7c9b8cf3dd0d3b3f3159a426f6f4f0840c5f', class: "f-body-02" }, this.colors[3].pantoneU))))), hAsync("eds-block-break", { key: '8d19ffae79f0d6c800d1ab6f303d978b2d0c6ae3' }), hAsync("ul", { key: '508b78eda27c872d411df1b6c9f9bd8ece25b4ee', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, hAsync("li", { key: '69ec343591e60f178e5c9a8742495739f489c8f5', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { key: '8b142eaf31a4456fad672dbb8c60076e2c4ddfc5', class: "effect-height flex items-center justify-between p-16", style: {
+            } }, hAsync("div", { key: '30e2c52d5dc2f14b2d31db28725602fa5db2c7cc', class: "grid" }, hAsync("span", { key: 'f38624cf43d3afc08c6ddf7fda4c0d8c8302cabb', class: "f-body-02" }, this.colors[3].rgb), hAsync("span", { key: '7fa03e96c202c03376214cf874de48ad3059a819', class: "f-body-02 w-full" }, this.colors[3].cmyk), hAsync("eds-code-block", { key: '5668f67a60cf3c148b2f411b5e990409f1b2a63d', code: this.colors[3].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: '944dbcbe0b74d5de3b7a6cb6249292c4f6198ce4', class: "grid" }, hAsync("span", { key: 'f85d29f44844bad53e1a8272792909ee655c3d11', class: "f-body-02" }, this.colors[3].pantoneC), hAsync("span", { key: 'a8565dd2fcd60b9e8f685ca91be4b91fd9310243', class: "f-body-02" }, this.colors[3].pantoneU))))), hAsync("eds-block-break", { key: '1736517e3b869da97268b88ca1e862e52afb72e3' }), hAsync("ul", { key: '89c5251e7c56a1858f98f9877721aaf3818d3ce3', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, hAsync("li", { key: 'f1bf325f0f4c4ff13212dd40a957a0407a0e2a31', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { key: '8f324cbb1e6c24f786135607d511cc6040582902', class: "effect-height flex items-center justify-between p-16", style: {
                 background: this.colors[4].background
-            } }, hAsync("div", { key: 'bf5f0cf2b9ef7c9a4814fa6f423cb4b9434878c3', class: "grid" }, hAsync("span", { key: '074772116344b8e4e4283e448a67de07019fc807', class: "f-body-02" }, this.colors[4].rgb), hAsync("span", { key: 'f963109c62079dd8dd85fb82eae94ece0170d8fd', class: "f-body-02 w-full" }, this.colors[4].cmyk), hAsync("eds-code-block", { key: 'c2e79bf856562f0830ea6fe651ec774644d64f08', code: this.colors[4].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: 'd08a0628c64b87da7e8714b75e2c380228ea6144', class: "grid" }, hAsync("span", { key: '79bfd7870adbc66d77770dd59d63f1e368fc3d32', class: "f-body-02" }, this.colors[4].pantoneC), hAsync("span", { key: '88d5fce43c419d06b0d1a7c5196ca2cb7c2e4171', class: "f-body-02" }, this.colors[4].pantoneU))), hAsync("div", { key: '36b4521488bd73d13f2e666b899e50df1537eb81', class: "effect-height flex items-center justify-between p-16", style: {
+            } }, hAsync("div", { key: '1eb01383979ac6d4a0b61964a7bcd19887c8908f', class: "grid" }, hAsync("span", { key: '2aaf61cb79ca93c7303ea37b0e23f755bf933948', class: "f-body-02" }, this.colors[4].rgb), hAsync("span", { key: '5814e3e62806533329488aa61f3528d6add22db1', class: "f-body-02 w-full" }, this.colors[4].cmyk), hAsync("eds-code-block", { key: 'e5a78ab4f2ee993cbf6f084314534b645b782dfa', code: this.colors[4].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: 'db666031e9fee9f2029992f776e1c468f5fb1ce7', class: "grid" }, hAsync("span", { key: '9888a56c6d738e2a175d89e6fe16fe5b4761fc56', class: "f-body-02" }, this.colors[4].pantoneC), hAsync("span", { key: '4337a6bedba3e7dbc09225a031c34f3e193d22bb', class: "f-body-02" }, this.colors[4].pantoneU))), hAsync("div", { key: '6cf755699eb3ff7f43b8694bb85fb4559372a0a3', class: "effect-height flex items-center justify-between p-16", style: {
                 background: this.colors[5].background
-            } }, hAsync("div", { key: 'c94304a7f235b4ba472a07004773424d8a90c222', class: "grid" }, hAsync("span", { key: 'b1b47cc470037312522f3de03c8249870dda6703', class: "f-body-02" }, this.colors[5].rgb), hAsync("span", { key: '665d8aa39800f35bf04f04912ff18f6599f27735', class: "f-body-02 w-full" }, this.colors[5].cmyk), hAsync("eds-code-block", { key: '4c09ed9f92d05ee3918d8f67b429989ae512d561', code: this.colors[5].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: '3500216d692f134a3a02426adf62e32bbf49d776', class: "grid" }, hAsync("span", { key: 'eff3cd5a7e07a2a8d51db3471389ecdc0ffc4d83', class: "f-body-02" }, this.colors[5].pantoneC), hAsync("span", { key: 'e34aae1a29feadb849ae0e4ffa5037e716f67777', class: "f-body-02" }, this.colors[5].pantoneU)))))));
+            } }, hAsync("div", { key: 'c9864bbfb228691b623c2713e3655de3fb871caa', class: "grid" }, hAsync("span", { key: 'cc86cc9b24f429d7ebeca8ac8fff95346b8c149b', class: "f-body-02" }, this.colors[5].rgb), hAsync("span", { key: 'e46c02239ec074fe15cb2979b500a0b7e0a17a56', class: "f-body-02 w-full" }, this.colors[5].cmyk), hAsync("eds-code-block", { key: '5325d7f9e4a8c28884ba1bc0147d549b42be68c6', code: this.colors[5].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: '09af1ed381838dc60410fe2ba9116e4da0644307', class: "grid" }, hAsync("span", { key: 'bde38ea3998629f7ee7cf4cfafd96bfd3e11fb3a', class: "f-body-02" }, this.colors[5].pantoneC), hAsync("span", { key: 'f2da476b838b6124f8e1b77209fa1a524048e71a', class: "f-body-02" }, this.colors[5].pantoneU)))))));
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -16455,11 +17467,11 @@ class GradientSupportPalette {
         ];
     }
     render() {
-        return (hAsync("ul", { key: 'b2a9b236f4d09ceef5bda9568b2210ce5f244a35', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, hAsync("li", { key: '6527094bbfe9ae9b3d07107e06ad25639a5a9102', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { key: 'fd97b352fd25574a076855b168e9a86dd12450a5', class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: this.colors[0].background } }, hAsync("div", { key: '1ecf065df68a1038dfb3d98e4f3b6c1de65bc08e', class: "grid" }, hAsync("span", { key: '8768cb503ab0a21870428ed166f8e25f45072a3f', class: "f-body-02" }, this.colors[0].rgb), hAsync("span", { key: 'd2ca5585cb8e58941c1e24e3b92d24c113042f4b', class: "f-body-02 w-full" }, this.colors[0].cmyk), hAsync("eds-code-block", { key: '179d621b1f7355241aba0332d8cb261300cc313b', code: this.colors[0].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: '2857e7fe056cd77b613697fcd0a71b6904d7f522', class: "grid" }, hAsync("span", { key: '37fb181e166357e3a735a3b28cec42c04fa307d0', class: "f-body-02" }, this.colors[0].pantoneC || 'N/A'), hAsync("span", { key: '2df6d62a1f29d5815a910c3a1d69137a72d38837', class: "f-body-02" }, this.colors[0].pantoneU || 'N/A')))), hAsync("li", { key: 'b8f91e3c53126c2eaf8b4055754acbb40ff5641a', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { key: '37f55d6e6af310b057b6c76011f995377e8479b4', class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: this.colors[1].background } }, hAsync("div", { key: '2310de38c6deed34dde453039d22c3295c3515a0', class: "grid" }, hAsync("span", { key: '3cf79727b544d93d73e58b257f73864bf928d301', class: "f-body-02" }, this.colors[1].rgb), hAsync("span", { key: 'd1f2e667b2e49c39b5c58a63a995aeedd4e8b659', class: "f-body-02 w-full" }, this.colors[1].cmyk), hAsync("eds-code-block", { key: '6dfbad0e7a87977d9ad4eb3d6732c2582f66000d', code: this.colors[1].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: '9e5a372a3a1b72ad7ef8e7658fc5ee328ee4ebc6', class: "grid" }, hAsync("span", { key: '1b808be8fc77c51983ef4c43e8a3f0dc47b46006', class: "f-body-02" }, this.colors[1].pantoneC || 'N/A'), hAsync("span", { key: 'ccabc7f2ddc85de55fb3b099b0b95b2030baa818', class: "f-body-02" }, this.colors[1].pantoneU || 'N/A')))), hAsync("li", { key: '2831236d472040166824309e964608560f8935d8', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { key: '8471b5023d94083d8118f9c452b35d0c1c173662', class: "effect-height flex items-center justify-between p-16", style: {
+        return (hAsync("ul", { key: 'a74064ecc5a2d9646b76e50bd01fed9974cad718', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, hAsync("li", { key: '2a79cfc1423158ebe2479e5f4160874c5c57bba0', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { key: 'f732817f063656d0f5083fbde7f53d78f4ce319b', class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: this.colors[0].background } }, hAsync("div", { key: 'a780e52ac0812ba9f2d0933169a1ed408dcac017', class: "grid" }, hAsync("span", { key: '034c1c3f59ddb5d15b417eddd9049f61721c40e7', class: "f-body-02" }, this.colors[0].rgb), hAsync("span", { key: 'd85bde05df7d5e756d2c4e106ab364e7c3ec3d30', class: "f-body-02 w-full" }, this.colors[0].cmyk), hAsync("eds-code-block", { key: 'c4f3d8edad422dd905da51a2976b41df8833b2b2', code: this.colors[0].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: '6b6055393c1c086ef6c71fde0a06646d32c2cc49', class: "grid" }, hAsync("span", { key: '7678ac503bbfe96a8c7e4ba0833e5872afc4bda4', class: "f-body-02" }, this.colors[0].pantoneC || 'N/A'), hAsync("span", { key: 'e3861166afbbdcb1057d7aedf0363be1650ffef2', class: "f-body-02" }, this.colors[0].pantoneU || 'N/A')))), hAsync("li", { key: '51a63dafebd44287264876132b1a53c7ada24f59', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { key: '26c3f5cd749a0ce810ce71283ba75292884c1802', class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: this.colors[1].background } }, hAsync("div", { key: 'c2adcca45b3edb97cdc92f1bd177aee32c27d13b', class: "grid" }, hAsync("span", { key: '06ee04c8345bd3c7bee01f28ec79c839d3956812', class: "f-body-02" }, this.colors[1].rgb), hAsync("span", { key: '4118231fd5b280b10937136b05e420b3d4fa039d', class: "f-body-02 w-full" }, this.colors[1].cmyk), hAsync("eds-code-block", { key: '8053667bcbbe539b49a8fa490b28d7fed3c206fb', code: this.colors[1].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: 'ffbfe32727e433f64c2ca2fefb27348f46cdd123', class: "grid" }, hAsync("span", { key: '50199120a53270d4e9a2fdbfe7b0430fd810247e', class: "f-body-02" }, this.colors[1].pantoneC || 'N/A'), hAsync("span", { key: '9f1b49b9e3e9cc941e4047362a531ac39fa4acf2', class: "f-body-02" }, this.colors[1].pantoneU || 'N/A')))), hAsync("li", { key: '842be74ea7d2839282421c05c94de0ea08edc324', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { key: 'e36fa05852a0e97af9f6d30b4bc7ac0a03c5ca46', class: "effect-height flex items-center justify-between p-16", style: {
                 background: this.colors[2].background
-            } }, hAsync("div", { key: '7c1251b8075a6d67b82e88e038ed772e292e0742', class: "grid" }, hAsync("span", { key: '55793b301d204f7d5996f85ae5ad003d61930f5f', class: "f-body-02" }, this.colors[2].rgb), hAsync("span", { key: 'a5eab2850d8a5e41ec043cd3b506a2f536f20820', class: "f-body-02 w-full" }, this.colors[2].cmyk), hAsync("eds-code-block", { key: 'b7642a477a00c4f811b4cc36f36458179802211b', code: this.colors[2].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: '791c7d3c9d83c82848805efe96d6567dbcf2579a', class: "grid" }, hAsync("span", { key: '3d46cbb0ccce0f1554d19c33aa4fb0a92d24381f', class: "f-body-02" }, this.colors[2].pantoneC), hAsync("span", { key: '68ce16ea65d735d9025729b5cbffa173a2b9e07a', class: "f-body-02" }, this.colors[2].pantoneU))), hAsync("div", { key: 'ee9efa5eec6d06a960619eb84de06703df3a4358', class: "effect-height flex items-center justify-between p-16", style: {
+            } }, hAsync("div", { key: '7c20aa597afc6623e4f48c96a5dfe35fcc794417', class: "grid" }, hAsync("span", { key: '9de55f6cf867d5ca0f359c34df82ea9ea9944b41', class: "f-body-02" }, this.colors[2].rgb), hAsync("span", { key: '64ca513c8cb69fa0e8bf8decc3b9315f59e78adc', class: "f-body-02 w-full" }, this.colors[2].cmyk), hAsync("eds-code-block", { key: 'fe4421e78d7c9f6b9fae2aab43046e68fa61b33a', code: this.colors[2].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: '1913674915edca8c83213f405465670bd1dc53b1', class: "grid" }, hAsync("span", { key: 'a53396290e785e8c055e152d15256388a278606b', class: "f-body-02" }, this.colors[2].pantoneC), hAsync("span", { key: 'd175bc7681febbde0bfbcf9816c8077cef210de3', class: "f-body-02" }, this.colors[2].pantoneU))), hAsync("div", { key: 'bbb39daa24f9881296be8b89fc5dd7d980acace6', class: "effect-height flex items-center justify-between p-16", style: {
                 background: this.colors[3].background
-            } }, hAsync("div", { key: 'a1033cf5a07c5adae91f6968ef0d74ea910ff02e', class: "grid" }, hAsync("span", { key: 'e5d58be01a90c281fa701d022b24807a3b1a8404', class: "f-body-02" }, this.colors[3].rgb), hAsync("span", { key: '7bef9018db3e4997997124f6f3d697ecf614531e', class: "f-body-02 w-full" }, this.colors[3].cmyk), hAsync("eds-code-block", { key: 'c95ed9f2caf0a75b34e6cc1ca3d4afa12f163b35', code: this.colors[3].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: '1ab575c669e9fb41388df03fe029c4dc63c167b0', class: "grid" }, hAsync("span", { key: '58c31b1b22572eb897f7e5a2d82135b92505eae3', class: "f-body-02" }, this.colors[3].pantoneC), hAsync("span", { key: 'ca75da8134fd83a86150fd6dbcdde73a2561c453', class: "f-body-02" }, this.colors[3].pantoneU)))), hAsync("li", { key: '700df92ad4634107b94e19ae2dd21b04909393b6', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { key: '9038289a89c119a695fcd3a0eb6d174f13a33591', class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: this.colors[4].background } }, hAsync("div", { key: '73a8b1f9955f52c8e83aff7f85d269af13206cfa', class: "grid" }, hAsync("span", { key: 'd7cd4652abb1e85f1751149c4be6ba5fc13c6da5', class: "f-body-02" }, this.colors[4].rgb), hAsync("span", { key: 'b38ed95e45e80e3ce59edff465293a9d9f42ab37', class: "f-body-02 w-full" }, this.colors[4].cmyk), hAsync("eds-code-block", { key: '72ffcc7e26b91aaa5315738d902e3becbade6759', code: this.colors[4].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: '856966a786985018be9151aaef0442456056ca88', class: "grid" }, hAsync("span", { key: '6baa9c0a4a587055b85940d846369086bc688075', class: "f-body-02" }, this.colors[4].pantoneC || 'N/A'), hAsync("span", { key: '578fbcd62e8ca8d6cd6d43891540451724133f6e', class: "f-body-02" }, this.colors[4].pantoneU || 'N/A'))))));
+            } }, hAsync("div", { key: '8d2c43ece12d3b50970df5843d038c4866eeb18e', class: "grid" }, hAsync("span", { key: '2e2fc983f867ef09fffb61c6f82d796c68c73b17', class: "f-body-02" }, this.colors[3].rgb), hAsync("span", { key: '4d9f460a5f6f5b8166f41eee37e15809b2abf943', class: "f-body-02 w-full" }, this.colors[3].cmyk), hAsync("eds-code-block", { key: 'dfb80c0f00dc096561da4d5a85a98969e4568987', code: this.colors[3].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: '1d7d6041de03afec92b41519d8422a998ce25465', class: "grid" }, hAsync("span", { key: '5298461da58d328376cc3448da7b3994dabe0abd', class: "f-body-02" }, this.colors[3].pantoneC), hAsync("span", { key: 'a21f99e92de656addef78784d6c699ac17c82f36', class: "f-body-02" }, this.colors[3].pantoneU)))), hAsync("li", { key: '36b0e8aed142a859481083b733e2c72dbe88e2a7', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { key: 'd6620556f763fc9b59ef96846c1121a78945e6df', class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: this.colors[4].background } }, hAsync("div", { key: '3be07bea07803e9103ccaa26582502a746f9d832', class: "grid" }, hAsync("span", { key: '25ead831ce5dab6e3c145b8610f6654d85bb185a', class: "f-body-02" }, this.colors[4].rgb), hAsync("span", { key: 'f5993b7b320e904ee13f63152aa33dd82431c387', class: "f-body-02 w-full" }, this.colors[4].cmyk), hAsync("eds-code-block", { key: 'b01544b8316df980372cc834a39a9adbf7ec2e26', code: this.colors[4].hex, style: { minWidth: '150px', marginRight: '5px' } })), hAsync("div", { key: 'e7b4641f2fd27c0742439164bd1f10b08c593f4f', class: "grid" }, hAsync("span", { key: 'd4fe6aacd76c7aa6b0e5fa06ff553403b16d05b4', class: "f-body-02" }, this.colors[4].pantoneC || 'N/A'), hAsync("span", { key: 'a2eb07ff8a20e25ddf65e589285f016e1ecdc52e', class: "f-body-02" }, this.colors[4].pantoneU || 'N/A'))))));
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -16513,7 +17525,7 @@ class IncorrectUseOfColors {
         registerInstance(this, hostRef);
     }
     render() {
-        return (hAsync("div", { key: '424c9b01d69068fa058b25dd89df08154912dfe7', class: "container" }, hAsync("div", { key: '5a9dae817344c3c92b8bdb55b806b1f96e26496d', class: "mb-8" }, hAsync("eds-alert", { key: 'afeaa6e5320151800d31c3fecb85669000409a14', message: "Note that, each of the four colour tones cannot be mixed in the same composition.", intent: "error" })), hAsync("div", { key: '87241b25b9f9e326183ba4496983d93bef766380', class: "flex" }, hAsync("div", { key: 'c018e1fffc8198b3e48e1df6b1e8d560e1c7b84a', class: "w-full" }, hAsync("ul", { key: '97845ca2dfe71ac0feb27762c4b3c71c80ca626c', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, primary.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[150px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))), hAsync("div", { key: '05adf9099f1b043d08577cf1f233551d83fc4242', class: "w-full" }, hAsync("ul", { key: '55792bcf3ecb93df6884d7366aa8c7f2c3cf5ad5', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, incorrect.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[90px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))))));
+        return (hAsync("div", { key: '2688817c691de1f39d1c25845642e99af13e1b00', class: "container" }, hAsync("div", { key: '823b5f324f9b7fe4143dd982e71f535b9c576dd6', class: "mb-8" }, hAsync("eds-alert", { key: '95cf4b07317e116636979fb2d72b4fe925b09fa2', message: "Note that, each of the four colour tones cannot be mixed in the same composition.", intent: "error" })), hAsync("div", { key: 'd4bfceeb122dddf376808ae187379c07ed0e1a06', class: "flex" }, hAsync("div", { key: '82eac813cc9b29424640fb2517992e3384d19a6e', class: "w-full" }, hAsync("ul", { key: 'da2ca77bd91a25c6a451910a6b3bf939e5e8abc9', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, primary.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[150px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))), hAsync("div", { key: '538560ac8db9f9d023a5afbf4cd67dff80f6e7b6', class: "w-full" }, hAsync("ul", { key: '4b601f722730fbe1cbb78c1185d79b34654d3f76', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, incorrect.map((color) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, hAsync("div", { class: "w-full min-h-[90px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))))));
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -16536,7 +17548,7 @@ class LogoSpace {
         registerInstance(this, hostRef);
     }
     render() {
-        return (hAsync("div", { key: 'afaefa486624790c61ec7be56d25e8214e692f80', class: "container" }, hAsync("ul", { key: '20a3d543d1bb3027cf12ea20d64bfc263c1e911f', class: "not-prose grid-layout grid-cols-6 gap-y-8 md:gap-y-12 lg:gap-y-16" }, hAsync("li", { key: '02e87b7c3b1acf86fe4aba6eb3fcda5cf0737d73', class: "grid-col-span-6 xxl:grid-col-span-3 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("div", { key: 'cb6614645cfdac9e07fb08a843a1171a60d2cae9', class: "logo-clear-space mx-auto", style: { position: 'relative', padding: '2.5rem', background: '#f5f5f5', borderRadius: '8px' } }, hAsync("div", { key: 'bda137ca9589342b6483262df1429e64eb3785ee', style: { position: 'absolute', top: '0', left: '50%', transform: 'translateX(-50%)', display: 'flex', flexDirection: 'column', alignItems: 'center' } }, hAsync("span", { key: 'd6f5fe1d1b006baf25cfb4b20613d92bace337ce', style: { fontSize: '11px', fontWeight: '600', color: '#00C87B', fontFamily: 'IBM Plex Mono, monospace' } }, "E"), hAsync("div", { key: '97ff118cab9d1ebdb1abc7f4c253cab3c1bd9965', style: { width: '1px', height: '12px', borderLeft: '1px dashed #00C87B' } })), hAsync("div", { key: 'a538f0751fe79c94d90e33325ff1be2e5feebc5c', style: { position: 'absolute', bottom: '0', left: '50%', transform: 'translateX(-50%)', display: 'flex', flexDirection: 'column', alignItems: 'center' } }, hAsync("div", { key: '500d0e1d35fbfb8df0af72cd6019e3ef673ce8f5', style: { width: '1px', height: '12px', borderLeft: '1px dashed #00C87B' } }), hAsync("span", { key: 'a02e8d7742fed312d090f00213a07774fe1a196f', style: { fontSize: '11px', fontWeight: '600', color: '#00C87B', fontFamily: 'IBM Plex Mono, monospace' } }, "E")), hAsync("div", { key: '00ec1e2a973bb99fadb6d73a9af41862c09dd05d', style: { position: 'absolute', left: '4px', top: '50%', transform: 'translateY(-50%)', display: 'flex', alignItems: 'center' } }, hAsync("span", { key: 'd792490e3d3e52895eb19ea489153bd4d37556ed', style: { fontSize: '11px', fontWeight: '600', color: '#00C87B', fontFamily: 'IBM Plex Mono, monospace' } }, "E"), hAsync("div", { key: 'da0320e4a4c3e0b6cf5dae32507c488a1698885c', style: { height: '1px', width: '12px', borderTop: '1px dashed #00C87B' } })), hAsync("div", { key: '2c01f062de36831c794f1a9defe7b044d28ad9ad', style: { position: 'absolute', right: '4px', top: '50%', transform: 'translateY(-50%)', display: 'flex', alignItems: 'center' } }, hAsync("div", { key: '68e5e2bb4f52a4c6ac003aa1deccfe721a948a92', style: { height: '1px', width: '12px', borderTop: '1px dashed #00C87B' } }), hAsync("span", { key: '6e753f8d2513ef86efd3c4b7e4ebf187ec5bf122', style: { fontSize: '11px', fontWeight: '600', color: '#00C87B', fontFamily: 'IBM Plex Mono, monospace' } }, "E")), hAsync("div", { key: 'f4a83531bfbbce8e3e89565be7f1c8d0320ea504', style: { border: '1px dashed rgba(0, 200, 123, 0.5)', borderRadius: '4px', padding: '1rem', display: 'flex', alignItems: 'center', justifyContent: 'center' } }, hAsync("eds-logo", { key: '135977a942f8d9c8817bd866ea21a2597860e7b6', variant: "positive", href: "#", style: { display: 'block', width: '250px' } })))), hAsync("li", { key: '2d2d834f16263bb4d95cc0c945af2aa0a53c7dd8', class: "grid-col-span-6 xxl:grid-col-span-3 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("div", { key: 'b6b7f75960412d0232e417406158b56e3d1946e2', class: "text-center mt-16" }, hAsync("p", { key: '43f97699ab3f882863b9e181e3b31cc576b1e411', class: "f-body-01" }, "To ensure legibility, follow these minimum size guidelines:"), hAsync("eds-table", { key: '62c49c7c7675d876bd11feb480836fe344f0f3a1', data: '[\n                  { "Media": "Print", "Min Size": "0.75 cm" },\n                  { "Media": "Web", "Min Size": "29 px" }\n                ]', config: '{\n                  "Media": { "format": "bold" }\n                }' }))))));
+        return (hAsync("div", { key: '9f72a0aaadd8ae1aaa8998ca3539bd7d2640de80', class: "container" }, hAsync("ul", { key: 'c4eae5e0c5c6adebbcdfa9f5ff5e505e8fca5364', class: "not-prose grid-layout grid-cols-6 gap-y-8 md:gap-y-12 lg:gap-y-16" }, hAsync("li", { key: 'cc93430ed51397f9cc5f6885da73464eee4f50f0', class: "grid-col-span-6 xxl:grid-col-span-3 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("div", { key: '7a10d36af753e4cc085a898385a79f86cfda4386', class: "logo-clear-space mx-auto", style: { position: 'relative', padding: '2.5rem', background: '#f5f5f5', borderRadius: '8px' } }, hAsync("div", { key: 'ca39c5c1d7692ac3e3f4c5f86b37ac315da32238', style: { position: 'absolute', top: '0', left: '50%', transform: 'translateX(-50%)', display: 'flex', flexDirection: 'column', alignItems: 'center' } }, hAsync("span", { key: '29dc95b66b0cc09fc4b4d45b317858262fd5f74c', style: { fontSize: '11px', fontWeight: '600', color: '#00C87B', fontFamily: 'IBM Plex Mono, monospace' } }, "E"), hAsync("div", { key: '314d8208cb5349457c1586eacbda115e9fb16d11', style: { width: '1px', height: '12px', borderLeft: '1px dashed #00C87B' } })), hAsync("div", { key: '4d8a568924c6891cd4be3c19e04fc31c2ea1fc70', style: { position: 'absolute', bottom: '0', left: '50%', transform: 'translateX(-50%)', display: 'flex', flexDirection: 'column', alignItems: 'center' } }, hAsync("div", { key: 'b09af7bd89b9f553b812190356ca62aa92ed6991', style: { width: '1px', height: '12px', borderLeft: '1px dashed #00C87B' } }), hAsync("span", { key: 'f093c84334e23c4f4f057e7e4b32d9107a3f41fc', style: { fontSize: '11px', fontWeight: '600', color: '#00C87B', fontFamily: 'IBM Plex Mono, monospace' } }, "E")), hAsync("div", { key: '91db9099f9e9a1523e19785fb7114e3f4fce7275', style: { position: 'absolute', left: '4px', top: '50%', transform: 'translateY(-50%)', display: 'flex', alignItems: 'center' } }, hAsync("span", { key: '88dd6f5d7954d2a1609db58f16242302f8d4f018', style: { fontSize: '11px', fontWeight: '600', color: '#00C87B', fontFamily: 'IBM Plex Mono, monospace' } }, "E"), hAsync("div", { key: '1a6cad75530619b5f7cdbd9044c61ddd05bb4882', style: { height: '1px', width: '12px', borderTop: '1px dashed #00C87B' } })), hAsync("div", { key: '1cf721720500db93522e8563a44260f1ad5d12a3', style: { position: 'absolute', right: '4px', top: '50%', transform: 'translateY(-50%)', display: 'flex', alignItems: 'center' } }, hAsync("div", { key: 'cd05bc1ca38fd5698f894f036ea4530833636dec', style: { height: '1px', width: '12px', borderTop: '1px dashed #00C87B' } }), hAsync("span", { key: 'ab0476740b19beb7c7799334370bff344e01a4de', style: { fontSize: '11px', fontWeight: '600', color: '#00C87B', fontFamily: 'IBM Plex Mono, monospace' } }, "E")), hAsync("div", { key: 'ce5dcd6aaa22c90084ac3f285c28726ef1dc241e', style: { border: '1px dashed rgba(0, 200, 123, 0.5)', borderRadius: '4px', padding: '1rem', display: 'flex', alignItems: 'center', justifyContent: 'center' } }, hAsync("eds-logo", { key: '457548ba3f0835a632c86521fce2fc828f72b7a5', variant: "positive", href: "#", style: { display: 'block', width: '250px' } })))), hAsync("li", { key: '676ceccfa0081fa6b05a2c6cb3c0ba88da61cd6a', class: "grid-col-span-6 xxl:grid-col-span-3 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("div", { key: '5ca2e9f1c386afc3f70be756183b4fe93779022f', class: "text-center mt-16" }, hAsync("p", { key: '0c986326909c8de83e584f796c41198554741c3d', class: "f-body-01" }, "To ensure legibility, follow these minimum size guidelines:"), hAsync("eds-table", { key: 'c745fc8b37d5fe412b08c0f88283d5ba74492f30', data: '[\n                  { "Media": "Print", "Min Size": "0.75 cm" },\n                  { "Media": "Web", "Min Size": "29 px" }\n                ]', config: '{\n                  "Media": { "format": "bold" }\n                }' }))))));
     }
     static get style() { return LogoSpaceStyle0; }
     static get cmpMeta() { return {
@@ -16560,7 +17572,7 @@ class LogoVariationsHorizontal {
         registerInstance(this, hostRef);
     }
     render() {
-        return (hAsync("div", { key: 'a7b635b81f06347ecf026f5102fff854275cd0a1', class: "container" }, hAsync("ul", { key: '4d2289f7a8136374bf6cf876f1c7eba0ec2a9422', class: "not-prose grid-layout grid-cols-6 gap-y-8 md:gap-y-12 lg:gap-y-16" }, hAsync("li", { key: 'e8d3dc755e9923ef57d4cb32876874c84d406620', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("p", { key: 'd51a85c405e5c75f4184d72a81bd3b8e001293aa', class: "f-body-01 text-center my-4" }, "#1 Positive"), hAsync("div", { key: 'fd20af4231cf1e7ddf3878e1cd11aa2fcbdc36a3', class: "coloured" }, hAsync("eds-logo", { key: 'be23d497a621c1b133521a365df483d0a753b4d7', variant: "positive", href: "#" }))), hAsync("li", { key: '6a330cea74757c1e3f6db14ef1c3ee6e8f998e23', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("p", { key: '87016c5c2d861900ed0bd2f0302e5969ee23822b', class: "f-body-01 text-center my-4" }, "#2 Negative"), hAsync("div", { key: 'd592916a66379e9dcafbd39ae6f0393207893e3a', class: "bg-default" }, hAsync("eds-logo", { key: '78b0f667deb8e789166b7b9243d4ac246dd9b9ac', variant: "negative", href: "#" }))))));
+        return (hAsync("div", { key: 'bfd9df144e3cabfc1b2198909208d4d41b1d06b8', class: "container" }, hAsync("ul", { key: '318197fcbbf5ea30a3b7786c670dc6a3484063fe', class: "not-prose grid-layout grid-cols-6 gap-y-8 md:gap-y-12 lg:gap-y-16" }, hAsync("li", { key: '7014dddeec695952b9b4041bacc7b509abd4425c', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("p", { key: '8be13e6c9f214d23941aae09653e6bae85536805', class: "f-body-01 text-center my-4" }, "#1 Positive"), hAsync("div", { key: 'a3eb696587b0fe2eaea6e6f02c6512d75b2319f4', class: "coloured" }, hAsync("eds-logo", { key: '530e57935491b485a8f1ab983c5c74aa62699e33', variant: "positive", href: "#" }))), hAsync("li", { key: '1664f259390ded9c4084a8734b275a24e4add82e', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("p", { key: 'c24b35b76fe5cd95462c3f5c435a445b4eed731d', class: "f-body-01 text-center my-4" }, "#2 Negative"), hAsync("div", { key: '0ef846b5bc472e082151994428a681e8ef888919', class: "bg-default" }, hAsync("eds-logo", { key: '647cbedbffc487740dda470fada93c7c4bfe88b7', variant: "negative", href: "#" }))))));
     }
     static get style() { return LogoVariationsHorizontalStyle0; }
     static get cmpMeta() { return {
@@ -16592,7 +17604,7 @@ class LogoVariationsTabs {
         }
     }
     render() {
-        return hAsync("div", { key: '744c1ba1e806d2659fa2d409c2e2314d02c5d911', class: "container" }, this.renderContent());
+        return hAsync("div", { key: '25f8ec6fcb189c14d9e6d1564a5705ba34296fe1', class: "container" }, this.renderContent());
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -16619,7 +17631,7 @@ class LogoVariationsVertical {
         this.type = undefined;
     }
     render() {
-        return (hAsync("div", { key: '87d5bf852fe573878eabdd768aaf979de16c226e', class: "container" }, hAsync("ul", { key: 'd9e47765d5e27f53dc8ced19fa954cd573e76856', class: "not-prose grid-layout grid-cols-6 gap-y-8 md:gap-y-12 lg:gap-y-16" }, hAsync("li", { key: '6b7ac8948438ede5dc01365511244e9858b2848b', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("p", { key: 'e4fce7db514e0741507b6a37cb7bf47d89047929', class: "f-body-01 text-center my-4" }, "#1 Positive"), hAsync("div", { key: '787af1c40ebac015c1a57391ab3959e691bd8dd3', class: "mx-auto coloured w-[300px]" }, hAsync("eds-logo", { key: '0e0d4dcea468625e374959d5c2762d8f7ce19e70', orientation: "vertical", variant: "positive", href: "#" }))), hAsync("li", { key: '77860d576cac3f5e71d728dee804c812fe6e430d', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("p", { key: 'f598d729ae5436b5777df79135d585378e5e7725', class: "f-body-01 text-center my-4" }, "#2 Negative"), hAsync("div", { key: '860b8539372eebd327c56b5d127203b93a7ae3b8', class: "mx-auto bg-default w-[300px]" }, hAsync("eds-logo", { key: '6bc89e4a6fc56125b14dec7079108eef51c961a7', orientation: "vertical", variant: "negative", href: "#" }))))));
+        return (hAsync("div", { key: '7707346060f598bc4a33ed1b25591907bd1ed86f', class: "container" }, hAsync("ul", { key: '988427e4445b7238666a8865b40e39106574a020', class: "not-prose grid-layout grid-cols-6 gap-y-8 md:gap-y-12 lg:gap-y-16" }, hAsync("li", { key: '09ebe2c5e0c4a17451cff4fa7f8d14f8dadccfb2', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("p", { key: 'b761f45824056d8022b25851dc92ec477ba5dd90', class: "f-body-01 text-center my-4" }, "#1 Positive"), hAsync("div", { key: 'b1d0c459aa5fe60c07d23d216873e8792a9b0bdb', class: "mx-auto coloured w-[300px]" }, hAsync("eds-logo", { key: '579c9c3bfe2156153d0a695ed164b5c143435935', orientation: "vertical", variant: "positive", href: "#" }))), hAsync("li", { key: 'e9392a9b97c7fee407bc49dbf1baf5844c002f4a', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("p", { key: '5335419cfe66e2454eebe227dcbb844bd9c28d65', class: "f-body-01 text-center my-4" }, "#2 Negative"), hAsync("div", { key: '85f26cc36d343225c543f55ebff8435b7c3b8128', class: "mx-auto bg-default w-[300px]" }, hAsync("eds-logo", { key: 'e50ba165a491eda6dbdf386cb7c82cfdb69aa7a7', orientation: "vertical", variant: "negative", href: "#" }))))));
     }
     static get style() { return LogoVariationsVerticalStyle0; }
     static get cmpMeta() { return {
@@ -16646,7 +17658,7 @@ class LogoWrongUsage {
         registerInstance(this, hostRef);
     }
     render() {
-        return (hAsync("div", { key: '1998b8e5086ba4cd17fdc27727349b9d638664b1', class: "container" }, hAsync("ul", { key: '84771834b81ff0714a75e1e61b9a1162e3bc639d', class: "not-prose grid-layout grid-cols-6 gap-y-8 md:gap-y-12 lg:gap-y-16" }, hAsync("li", { key: '4deb145d27c43db40acbd03ef90e1a66fad22f09', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("div", { key: '801e579cd87168a51d00c78f6808a1413d689564', class: "mx-auto no-other-bg-color logo", innerHTML: logoPositive }), hAsync("p", { key: '591ecf90d303b7302f0431a3099f64f67ec96c1b', class: "f-ui-02 text-center" }, "Do not use with backgrounds that make legibility difficult")), hAsync("li", { key: 'bedfff759e45149bd7df138736b2cc9f172ee41c', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("div", { key: '643ea5b43c95f107f8fc8b0c8ea8234d4e09ba9d', class: "mx-auto no-other-color logo non-brand-color", innerHTML: logoPositive }), hAsync("p", { key: 'b9fd83f7586a7fa02d86651ba26acbda08e63394', class: "f-ui-02 text-center" }, "Do not apply other colors")), hAsync("li", { key: '986534ff326d2ef3dd80136d151c46c98ccc8921', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("div", { key: '146c299a032bf9907e2bbc8fe72eaeb738cf0458', class: "mx-auto distorted logo", innerHTML: logoPositive }), hAsync("p", { key: '6ddc987cca3e13ce381572d3aa51a94c7cdbc2be', class: "f-ui-02 text-center" }, "Do not deform the logo")), hAsync("li", { key: '23a471ac8dbda371bf4ba704563305c7c03680b3', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("div", { key: 'c6732fff82bc642cd0885e721a8686041809ffb7', class: "mx-auto effects logo", innerHTML: logoPositive }), hAsync("p", { key: '463d5c2c43d8c5ec1d4abce3419bc3c66bfa02b6', class: "f-ui-02 text-center" }, "Do not apply effects")), hAsync("li", { key: 'c67c213f34b69089e3cbc0df3e9188b44cc9d9cf', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("div", { key: '58170477b47eec084e009c953a7216c5ed94a3b9', class: "mx-auto rotated logo", innerHTML: logoPositive }), hAsync("p", { key: '18e2732bb758ae840dcd15e1ef678496afa2cc3b', class: "f-ui-02 text-center" }, "Do not rotate the logo")), hAsync("li", { key: '6c829569009467ee5092a6a426d87e1c3399ca29', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("div", { key: '1d66177dd3a30386ee64bafea9026bf16cf80225', class: "mx-auto outlined logo", innerHTML: logoPositive }), hAsync("p", { key: '4c8e35fa52ef575ab6535dc219710ea356a2e1a3', class: "f-ui-02 text-center" }, "Do not apply outlines")), hAsync("li", { key: '7dc465eaeb42991d4d3066ac0a35a0a5fee929f5', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("div", { key: '0f9de8fcd64ed34040f24bbfd38c640593a7a74b', class: "mx-auto" }, hAsync("div", { key: '9f77a72a22b0dcbbdd112816f4a02b991df5d3b1', class: "bg-accent p-16" }, hAsync("div", { key: '1356eccbf5510a3831e9cbd09b582c38fc68a479', class: "text-inverse", innerHTML: logoPositive })), hAsync("p", { key: 'ce32a58d2bccf82202da47d8cc0ac01642e8436a', class: "f-ui-02 text-center" }, "Do not use the green background for the logo version of the logo with backgrounds with the same tones"))))));
+        return (hAsync("div", { key: 'd2670fc81c458c6fa7830adc0bfe84a8d6edc808', class: "container" }, hAsync("ul", { key: '068ccd9ab65938f0d61f800410c0223e79b072a5', class: "not-prose grid-layout grid-cols-6 gap-y-8 md:gap-y-12 lg:gap-y-16" }, hAsync("li", { key: '4600e980ce2d169750f3a06ad11ecc5280ac6816', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("div", { key: 'db4d3fc8f5e35ae084c7f359fcc2553f913cc05a', class: "mx-auto no-other-bg-color logo", innerHTML: logoPositive }), hAsync("p", { key: 'b3f85315b376d5dae84a076fcefad660bb28f2b0', class: "f-ui-02 text-center" }, "Do not use with backgrounds that make legibility difficult")), hAsync("li", { key: '786ea943986e9948d465fc9bb07b3ea3ab9438f1', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("div", { key: 'c9ee298d8c36b732e7a1855f26e08f000c16aa91', class: "mx-auto no-other-color logo non-brand-color", innerHTML: logoPositive }), hAsync("p", { key: '6e16a1cf4f03f8a8929c31b2df080dd89b0951c3', class: "f-ui-02 text-center" }, "Do not apply other colors")), hAsync("li", { key: '82a57b134dd2a559a8c755579bdad818d316742a', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("div", { key: 'f32b83ca94652e22477a3ce0d2247eef0e47b7b8', class: "mx-auto distorted logo", innerHTML: logoPositive }), hAsync("p", { key: '3cf9e132199d325d430cfffa6bf4b4331e43a62e', class: "f-ui-02 text-center" }, "Do not deform the logo")), hAsync("li", { key: '89d4b3eed2c779ff71b3fd6c8315ce4a99cb871b', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("div", { key: 'b765e1c704944ecded0d88aca1db3efffd0caeed', class: "mx-auto effects logo", innerHTML: logoPositive }), hAsync("p", { key: '822ac23c64ba745b46d21303a9bbfabe9a26d6dc', class: "f-ui-02 text-center" }, "Do not apply effects")), hAsync("li", { key: 'a5f157b40464fa3178f94147ce9017ffaad0bb69', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("div", { key: 'c9b3e60f08ad15e0ca9eb11abe769510bf6f04c9', class: "mx-auto rotated logo", innerHTML: logoPositive }), hAsync("p", { key: 'c25fc7938948f5cb3fdf55719483e13ab4780bba', class: "f-ui-02 text-center" }, "Do not rotate the logo")), hAsync("li", { key: '8ed76fa89e0bf6b40f0b5478cebfe3a2b129cde6', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("div", { key: 'a18962c12781071348a8ec0c10e62d7d3ebec881', class: "mx-auto outlined logo", innerHTML: logoPositive }), hAsync("p", { key: 'a967a5ef26f9d935756db41e632d88765fdc50c7', class: "f-ui-02 text-center" }, "Do not apply outlines")), hAsync("li", { key: '9fc5979179dc4d1defe578a6c4aa7b1e7bf6e355', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, hAsync("div", { key: 'df9479358ca218d9b2f9ffa15dc9cb802cf71e04', class: "mx-auto" }, hAsync("div", { key: '2d06f90b92971701bbe6a76f8b8125846ac15d0c', class: "bg-accent p-16" }, hAsync("div", { key: 'a4178f35a86f8a5788f30137f75880f4c5f5c2a3', class: "text-inverse", innerHTML: logoPositive })), hAsync("p", { key: '567638cdb967150758210ddb0d52657834f65054', class: "f-ui-02 text-center" }, "Do not use the green background for the logo version of the logo with backgrounds with the same tones"))))));
     }
     static get style() { return LogoWrongUsageStyle0; }
     static get cmpMeta() { return {
@@ -16690,7 +17702,7 @@ class SvgRepository {
             icon: { format: 'svg' },
             name: { format: 'bold' }
         };
-        return (hAsync("div", { key: 'b531a1f93b32fbf4aba94d7a4aa68f7f4202a8e6', class: "full-width" }, hAsync("eds-table", { key: 'a66b06f5d08c39db1d63af2194455273b3ae172b', "table-data": JSON.stringify(svgData), config: JSON.stringify(tableConfig), "rows-per-page": 10, "search-enabled": true, "pagination-enabled": true })));
+        return (hAsync("div", { key: 'a7aebad6b026e51c822051cabd0826b6d9740d91', class: "full-width" }, hAsync("eds-table", { key: '5b5ce183d78d0a2259c99a949967dbbf4caf4ba4', "table-data": JSON.stringify(svgData), config: JSON.stringify(tableConfig), "rows-per-page": 10, "search-enabled": true, "pagination-enabled": true })));
     }
     get hostEl() { return getElement(this); }
     static get style() { return SvgRepositoryStyle0; }
@@ -16964,7 +17976,7 @@ class TokenList {
     render() {
         // Check if `show` prop is provided; if not, display all sections
         const sectionsToDisplay = this.show ? { [this.show]: colors[this.show] } : colors;
-        return (hAsync("section", { key: 'b95825988f64556481b66203bcd8fb281b88d2a9', class: "w-full mt-28" }, Object.entries(sectionsToDisplay).map(([sectionName, sectionContent]) => 
+        return (hAsync("section", { key: '19a7dd76a980e2815f8df3ee0cb083b2c77cafa4', class: "w-full mt-28" }, Object.entries(sectionsToDisplay).map(([sectionName, sectionContent]) => 
         // Only render sections that exist in `colors`
         sectionContent ? this.renderSection(sectionName, sectionContent) : null)));
     }
@@ -16997,7 +18009,7 @@ class TokenRadii {
         registerInstance(this, hostRef);
     }
     render() {
-        return (hAsync("section", { key: '8b1c08f1c32236156eea1d1d1f78a9bad3a202cb', class: "w-full mt-28" }, hAsync("ul", { key: 'b995ce086b3c9b7796f161c29bd206534a3e5316', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, Object.entries(radii).map(([key, value]) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16" }, hAsync("div", { class: `w-full p-16 block lg:flex items-center justify-center text-center border-3 border-soft rounded-${key}` }, hAsync("eds-code-block", { language: "Utility Class", code: `rounded-${key}`, class: "mx-auto min-w-[200px] sm:mb-4 sm:max-w-[200px] mr-auto" }), hAsync("eds-code-block", { code: `border-radius:${value}`, language: "css", class: "mx-auto min-w-[200px] sm:max-w-[200px] ml-auto" }))))))));
+        return (hAsync("section", { key: '80a475b807538a7c9c1186d0f167a793858ad439', class: "w-full mt-28" }, hAsync("ul", { key: 'e3fa97c0f627f2094c7eae87eb9f7079df2b35f2', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, Object.entries(radii).map(([key, value]) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16" }, hAsync("div", { class: `w-full p-16 block lg:flex items-center justify-center text-center border-3 border-soft rounded-${key}` }, hAsync("eds-code-block", { language: "Utility Class", code: `rounded-${key}`, class: "mx-auto min-w-[200px] sm:mb-4 sm:max-w-[200px] mr-auto" }), hAsync("eds-code-block", { code: `border-radius:${value}`, language: "css", class: "mx-auto min-w-[200px] sm:max-w-[200px] ml-auto" }))))))));
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -17026,7 +18038,7 @@ class TokenRatios {
         registerInstance(this, hostRef);
     }
     render() {
-        return (hAsync("section", { key: '9ab666342a801e51b3a75c979bceadccf4d9736e', class: "w-full" }, hAsync("eds-section-core", { key: '4eea7a8b3b8e3b0404108345756d11806ea2805d', tag: "div", "section-title": "Aspect Ratios", "heading-level": "h3" }, hAsync("ul", { key: 'faa065acac9bce28073f709d147c9b2725150da5', class: "gap-y-8 md:gap-y-12 lg:gap-y-16" }, Object.entries(ratios).map(([key, value]) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16" }, hAsync("div", { class: "container ratio-box flex items-center justify-center text-center border-2 border-soft", style: {
+        return (hAsync("section", { key: 'd95a7a36fc37fb829c74e336d16de79f57ec1b83', class: "w-full" }, hAsync("eds-section-core", { key: '1e2fbe9a818a162d6acd148804a61b87f919eda5', tag: "div", "section-title": "Aspect Ratios", "heading-level": "h3" }, hAsync("ul", { key: 'a2429b25e2aef59bde0185115dc2ff908b075db5', class: "gap-y-8 md:gap-y-12 lg:gap-y-16" }, Object.entries(ratios).map(([key, value]) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16" }, hAsync("div", { class: "container ratio-box flex items-center justify-center text-center border-2 border-soft", style: {
                 aspectRatio: value.replace('/', ':'), // Cast to string to resolve TypeScript error
                 width: '100%', // Full width to show the aspect ratio correctly
                 maxWidth: '300px'
@@ -17093,7 +18105,7 @@ class TokenShadows {
         registerInstance(this, hostRef);
     }
     render() {
-        return (hAsync("section", { key: '60745a5eb31e7ce043c3d69cd8246b752cd66520', class: "w-full mt-28" }, hAsync("ul", { key: '4c8ce259916cf36fc240c0ae3f22d32571a919f8', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, Object.entries(shadowTokens).map(([category, tokens]) => Object.entries(tokens).map(([key, value]) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col items-center mt-16" }, hAsync("div", { class: "w-full p-16 block lg:flex items-center justify-center text-center border-2 border-soft", style: { boxShadow: value } }, hAsync("eds-code-block", { code: `${category}-${key}`, language: "Utility Class", class: "mr-auto sm:mb-4 min-w-[200px]" }), hAsync("eds-code-block", { code: `${value}`, language: "css", class: "ml-auto min-w-[200px]" })))))))));
+        return (hAsync("section", { key: '0316f767a182da2f2e96c137034d84794947102a', class: "w-full mt-28" }, hAsync("ul", { key: '16586b6a4d565ee58f4ea2465d54d527390d41ca', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, Object.entries(shadowTokens).map(([category, tokens]) => Object.entries(tokens).map(([key, value]) => (hAsync("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col items-center mt-16" }, hAsync("div", { class: "w-full p-16 block lg:flex items-center justify-center text-center border-2 border-soft", style: { boxShadow: value } }, hAsync("eds-code-block", { code: `${category}-${key}`, language: "Utility Class", class: "mr-auto sm:mb-4 min-w-[200px]" }), hAsync("eds-code-block", { code: `${value}`, language: "css", class: "ml-auto min-w-[200px]" })))))))));
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -17113,7 +18125,7 @@ class TokenSpacing {
         registerInstance(this, hostRef);
     }
     render() {
-        return (hAsync("div", { key: '8ebe0d888150e5fefd1d3047cc82548f12f47f9f', class: "w-full" }, hAsync("ul", { key: 'c57af77dfb437bafaf060a6c6ebece84c4683409', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, hAsync("li", { key: '6ca948268bd07e50409334b84eeeb362287f131e', class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16" }, hAsync("div", { key: '0f33f8feec6657d21a4e4a1973d4c46cf4f6c526', class: "container p-8 item-center border-2 border-soft" }, hAsync("div", { key: '194c9d5367c75c35f021d0b5c64601a72d1141fd', class: "spacing-sample m-16 bg-strong" }, hAsync("span", { key: '252af2371d58a8364718210563b7aa9a76a551a6', class: "f-body-01 text-inverse" }, "Margin: 1rem / m-16")))), hAsync("li", { key: '833a8373bbe4db4514c84d4e299e2103b37bc75e', class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16" }, hAsync("div", { key: 'd364398230aca7af47273a654a8f138d70361c75', class: "container p-8 item-center border-2 border-soft" }, hAsync("div", { key: '707e0b62f500c16dc2d72da8e0bd85adabd7280b', class: "spacing-sample ml-64 bg-strong" }, hAsync("span", { key: '846c07af2613e90c3acd1fa66aa422db14a95526', class: "f-body-01 text-inverse" }, "Margin Left: 4rem / ml-64")))), hAsync("li", { key: '107899eab78bbb70f62b0aa2df8573f7a940024c', class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16" }, hAsync("div", { key: 'fb007ac46524cfda56c1033869b3fd7edeec96b8', class: "container p-8 item-center border-2 border-soft" }, hAsync("div", { key: '4312aaa901f7ad1075056517b2d8b0902e708aec', class: "spacing-sample mt-32 bg-strong" }, hAsync("span", { key: '62a87119afea530831e3bcbb45da16f3a3cfb1b8', class: "f-body-01 text-inverse" }, "Margin Top: 2rem / mt-32")))), hAsync("li", { key: '279e6f5af470cf3f969c37f715def542e4d13140', class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16" }, hAsync("div", { key: '057bcacd976a4d7f0a69ccba3b469e79f6e8c86a', class: "container p-8 item-center border-2 border-soft" }, hAsync("div", { key: '379423e5ef1b3f5be2a322493266305f2cf46b9d', class: "spacing-sample p-32 bg-strong" }, hAsync("span", { key: 'a3bd9db6ab5dd4f6204d5009c4328f617f44b78c', class: "f-body-01 text-inverse" }, "Padding: 2rem / p-32")))), hAsync("li", { key: '526411b8ab854f67873964446dee7191949f5d54', class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16" }, hAsync("div", { key: 'c30d0c423a4d3104ca8736fbd2c0de5159ac8f2d', class: "container p-8 item-center border-2 border-soft" }, hAsync("div", { key: '93e0422c2304a0d3a158ba086aa9235a05d621f0', class: "spacing-sample pt-32 bg-strong" }, hAsync("span", { key: 'dca707847134a421d60930307613a6528a009f9d', class: "f-body-01 text-inverse" }, "Padding Top: 2rem / pt-32")))), hAsync("li", { key: 'a132977bdf19ba79401ccc05f248711eb2793497', class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16" }, hAsync("div", { key: '2fad0e796528bce6c021cbb9d3036d4a23226b82', class: "container p-8 item-center border-2 border-soft" }, hAsync("div", { key: 'be02958fc44ca651c348078dfc84fabbe92afaa1', class: "spacing-sample pl-32 bg-strong" }, hAsync("span", { key: '6c94b77b470a1dd9de4dad7a6900d2e053236f52', class: "f-body-01 text-inverse" }, "Padding Left: 2rem / pl-32")))))));
+        return (hAsync("div", { key: '857d52883315b5be7edb90c89602b29f258cabda', class: "w-full" }, hAsync("ul", { key: 'e1dbf5d8e227c9014183c2465bf281e554f7e35b', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, hAsync("li", { key: '85795c6c4ad2c4fc05cda1183a06dadc78521b45', class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16" }, hAsync("div", { key: 'e0d6a8712ab4d47dca6ca275c09592b8af381b20', class: "container p-8 item-center border-2 border-soft" }, hAsync("div", { key: 'cbfc5e4dcb4040b375d195246626d833d5b33057', class: "spacing-sample m-16 bg-strong" }, hAsync("span", { key: '8aa060bb7da7ffdbcd343c849f5e62c6db648fd7', class: "f-body-01 text-inverse" }, "Margin: 1rem / m-16")))), hAsync("li", { key: 'f4e5e7a4eedac3a350f8c68adc5cdc8ba742166a', class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16" }, hAsync("div", { key: 'de4ce6ca17ba9c0a20a794e1ec55f2fcc1f0c440', class: "container p-8 item-center border-2 border-soft" }, hAsync("div", { key: '52766704ac7cb4b1336d4283991c5204c7dece18', class: "spacing-sample ml-64 bg-strong" }, hAsync("span", { key: '60c2b72b390ac0b204cf10cf2c01907915e0b3a1', class: "f-body-01 text-inverse" }, "Margin Left: 4rem / ml-64")))), hAsync("li", { key: '1b7922c2a246a1a95e2e26e455b55ea7b5a2a3e9', class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16" }, hAsync("div", { key: '7d43b9c4bc7ebd4883d9d7871b9fb02a2cece586', class: "container p-8 item-center border-2 border-soft" }, hAsync("div", { key: '7afeb3b0db7c70f11e09b5df2d396ebfc4454f00', class: "spacing-sample mt-32 bg-strong" }, hAsync("span", { key: '3bccca0e93ad8accb3da8ce64c86ee70d2a6f255', class: "f-body-01 text-inverse" }, "Margin Top: 2rem / mt-32")))), hAsync("li", { key: '7cbdb2d1b0cd2f91c1b7a05d6654e89a26f74340', class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16" }, hAsync("div", { key: 'a47cb7cce3d8947d07ceff06fea30e19df12c6ec', class: "container p-8 item-center border-2 border-soft" }, hAsync("div", { key: '2ee8dc2c52d8a689c12f0333cf7a4d0b36e572f7', class: "spacing-sample p-32 bg-strong" }, hAsync("span", { key: '2c19bbed58312c84d15ef45fc4bd5a699718b259', class: "f-body-01 text-inverse" }, "Padding: 2rem / p-32")))), hAsync("li", { key: '89283aab1c8e84f4d692e290e227d5b91e88cd56', class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16" }, hAsync("div", { key: 'e341336d74199f51d440ad01217816939b4877eb', class: "container p-8 item-center border-2 border-soft" }, hAsync("div", { key: '6d59ec419924101b4b2d4daf1fa385cd7d921c2e', class: "spacing-sample pt-32 bg-strong" }, hAsync("span", { key: '378293318a5aa7c0c9fecb575e533aa97c7b0ecf', class: "f-body-01 text-inverse" }, "Padding Top: 2rem / pt-32")))), hAsync("li", { key: 'a8e4328bb418b7b878aebfdfe4022e3054b5167e', class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16" }, hAsync("div", { key: '421adc7f90db876dca2304f0c0f794c2b93b4536', class: "container p-8 item-center border-2 border-soft" }, hAsync("div", { key: 'ebb689a6011c3da5282eb3bb1cc1a0581af86e90', class: "spacing-sample pl-32 bg-strong" }, hAsync("span", { key: '8924318c5edcb5d78c37dc1a768e1b3e0fa775ed', class: "f-body-01 text-inverse" }, "Padding Left: 2rem / pl-32")))))));
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -17361,7 +18373,7 @@ class TokenTypography {
         registerInstance(this, hostRef);
     }
     render() {
-        return (hAsync("section", { key: 'a3698b57da5e26052bf013daef956ff5f9e0bd1c', class: "w-full" }, hAsync("ul", { key: '924a82c721a636370a15e7a47ca73264c8e1d30e', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, Object.entries(typography.typesets)
+        return (hAsync("section", { key: 'ce7e291884a4b1bef85050a04c798a365287a131', class: "w-full" }, hAsync("ul", { key: '070567197ed557c07284ebe733c4f9f3246c60d7', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, Object.entries(typography.typesets)
             .filter(([typeKey]) => typeKey !== 'displays') // Exclude "displays"
             .flatMap(([typeKey, typeValues]) => Object.entries(typeValues).map(([size, style]) => (hAsync("li", { class: "grid-col-span-12 flex flex-col mt-16" }, hAsync("div", { class: "w-full p-16 border border-soft rounded", style: { display: 'grid', gridTemplateColumns: '1fr 1fr', gap: '1.5rem', alignItems: 'center' } }, hAsync("div", { style: {
                 fontFamily: style.fontFamily || typography.families['plex-sans'],
@@ -17444,6 +18456,7 @@ registerComponents([
   EdsInputRange,
   EdsInputSearch,
   EdsInputSelect,
+  EdsKgLearningResources,
   EdsKgWebServicesSelect,
   EdsLink,
   EdsLogo,
@@ -17454,6 +18467,7 @@ registerComponents([
   EdsPie,
   EdsProgressBar,
   EdsRating,
+  EdsSearchSelect,
   EdsSectionCore,
   EdsSectionHeading,
   EdsSidebar,
@@ -17470,6 +18484,7 @@ registerComponents([
   EdsToast,
   EdsToastManager,
   EdsTooltip,
+  EdsTrlBadge,
   EdsUser,
   GradientPrimaryPalette,
   GradientSecondaryPalette,