@solid-design-system/components 5.16.1 → 5.16.2-next.1

package/dist/chunks/{chunk.YJF7I33G.js → chunk.DJ3WYVWV.js}

@@ -7,7 +7,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.RY4KWEME.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -124,18 +124,18 @@ var SdNavigationItem = class extends SolidElement {
     };
     const horizontalPadding = this.vertical ? "py-3" : "py-2";
     const root = html`<${tag} part="base" class="${cx(
-      "flex items-center cursor-pointer relative focus-visible:focus-outline group hover:bg-neutral-200 transition-colors duration-fast ease-in-out min-h-[48px]",
-      { md: "text-base", lg: "text-lg", sm: "text-[14px]" }[this.size],
-      this.disabled ? "text-neutral-500 pointer-events-none" : "text-primary",
-      this.current && "font-bold",
+      "flex items-center cursor-pointer relative focus-visible:focus-outline group hover:bg-neutral-200 transition-colors duration-fast ease-in-out min-h-[48px] navigable-border-radius",
+      { md: "navigable-font-size", lg: "text-lg", sm: "text-[14px]" }[this.size],
+      this.disabled ? "text-neutral-500 pointer-events-none" : "sd-navigation-color-text",
+      this.current && "font-bold sd-navigation--current-color-text",
       !isAccordion && "w-full",
       this.divider && this.vertical && "mt-0.25",
       !this.vertical && "inline-flex items-center",
       !this.separated && "hover:bg-neutral-200 group transition-colors duration-fast ease-in-out min-h-[48px]",
       isIconOnly ? "justify-center aspect-square p-3" : "px-4"
     )}" aria-current="${ifDefined(this.current ? "page" : void 0)}" aria-disabled="${this.disabled}" aria-labelledby="content" aria-describedby="description" ?disabled="${ifDefined(isButton ? this.disabled : void 0)}" href="${ifDefined(isLink ? this.href : void 0)}" target="${ifDefined(isLink ? this.target : void 0)}" download="${ifDefined(isLink ? this.download : void 0)}" rel="${ifDefined(isLink && this.target ? "noreferrer noopener" : void 0)}" tabindex="${this.disabled ? "-1" : "0"}" @click="${this.separated ? void 0 : isAccordion ? this.handleClickSummary : isButton ? this.handleClickButton : void 0}"><div part="current-indicator" class="${cx(
-      "absolute bg-accent left-0 pointer-events-none",
-      this.vertical ? "w-1 h-[calc(100%-16px)] top-2 group-hover:h-full group-hover:top-0" : "h-1 w-[calc(100%-16px)] bottom-0 left-2 group-hover:w-full group-hover:left-0",
+      "absolute bg-accent left-0 pointer-events-none navigable__current-indicator-border-radius",
+      this.vertical ? "navigable__current-indicator-width h-[calc(100%-16px)] top-2 group-hover:h-full group-hover:top-0" : "navigable__current-indicator-height w-[calc(100%-16px)] bottom-0 left-2 group-hover:w-full group-hover:left-0 transition-all",
       this.disabled && "bg-neutral-500"
     )}"></div><div class="inline-flex flex-col justify-center gap-1 w-full h-full"><span part="content-area" class="${cx(
       "relative inline-flex justify-between items-center",
@@ -168,7 +168,8 @@ var SdNavigationItem = class extends SolidElement {
  */
 SdNavigationItem.styles = [
   ...SolidElement.styles,
-  css`:host{box-sizing:border-box;display:inline-block;position:relative}:host([vertical]){display:block}details summary::-webkit-details-marker{display:none}[part=current-indicator]{--tw-scale-x:0;--tw-scale-y:0;opacity:var(--sd-opacity-0,0);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));transition-duration:var(--sd-duration-fast,.15s);transition:width var(--sd-duration-fast) ease-in-out,height var(--sd-duration-fast) ease-in-out,left var(--sd-duration-fast) ease-in-out,top var(--sd-duration-fast) ease-in-out,opacity var(--sd-duration-fast) ease-in-out,transform var(--sd-duration-fast) ease-in-out var(--sd-duration-fast)}:host([current]) [part=current-indicator]{--tw-scale-x:1;--tw-scale-y:1;opacity:var(--sd-opacity-100,1);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));transition:width var(--sd-duration-fast) ease-in-out,height var(--sd-duration-fast) ease-in-out,left var(--sd-duration-fast) ease-in-out,top var(--sd-duration-fast) ease-in-out,transform var(--sd-duration-fast) ease-in-out}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
+:host{position:relative;box-sizing:border-box;display:inline-block}:host([vertical]){display:block}details summary::-webkit-details-marker{display:none}[part=current-indicator]{--tw-scale-x:0%;--tw-scale-y:0%;--tw-scale-z:0%;scale:var(--tw-scale-x) var(--tw-scale-y);opacity:var(--sd-opacity-0);--tw-duration:var(--sd-duration-fast, 150ms);transition-duration:var(--sd-duration-fast,150ms);transition:width var(--sd-duration-fast) ease-in-out,height var(--sd-duration-fast) ease-in-out,left var(--sd-duration-fast) ease-in-out,top var(--sd-duration-fast) ease-in-out,opacity var(--sd-duration-fast) ease-in-out,transform var(--sd-duration-fast) ease-in-out var(--sd-duration-fast)}:host([current]) [part=current-indicator]{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x) var(--tw-scale-y);opacity:var(--sd-opacity-100);transition:width var(--sd-duration-fast) ease-in-out,height var(--sd-duration-fast) ease-in-out,left var(--sd-duration-fast) ease-in-out,top var(--sd-duration-fast) ease-in-out,transform var(--sd-duration-fast) ease-in-out}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-duration{syntax:"*";inherits:false}`
 ];
 __decorateClass([
   query('[part="base"]')

package/dist/chunks/{chunk.PJPWXQY7.js → chunk.E7L2RBML.js}

@@ -1,7 +1,7 @@
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.RY4KWEME.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -64,20 +64,22 @@ var SdFlipcard = class extends SolidElement {
       "absolute h-full w-full -z-20",
       (this.frontVariant === "primary" || this.frontVariant === "primary-100") && "hidden"
     )}"><slot name="media-front"></slot></div><div part="front-slot-container" class="${cx(
-      "flex",
+      "flex relative",
       {
         primary: "text-white",
         "primary-100": "text-black",
         "gradient-light": "text-black",
         "gradient-dark": "text-white"
-      }[this.frontVariant],
+      }[this.frontVariant]
+    )}"><div class="${cx(
+      "absolute inset-0",
       {
         primary: "",
         "primary-100": "",
         "gradient-light": this.placement === "top" ? "bg-gradient-to-b from-white/75 to-white/60" : "bg-gradient-to-t  from-white/75 to-white/60",
         "gradient-dark": this.placement === "bottom" ? "bg-gradient-to-t from-primary-800/75 to-primary-800/60" : "bg-gradient-to-b  from-primary-800/75 to-primary-800/60"
       }[this.frontVariant]
-    )}"><slot name="front"></slot></div><div part="front-secondary-gradient" class="${cx(
+    )}"></div><slot name="front"></slot></div><div part="front-secondary-gradient" class="${cx(
       "flip-card__gradient",
       {
         primary: "mb-auto",
@@ -146,7 +148,11 @@ var SdFlipcard = class extends SolidElement {
  */
 SdFlipcard.styles = [
   ...SolidElement.styles,
-  css`:host{aspect-ratio:3/4;display:block;--name:"";--height:480px;height:var(--height)}.flip-card{perspective:100rem}.flip-card__side{backface-visibility:hidden}.flip-card__side--back{transform:rotateY(180deg)}.clicked--front{transform:rotateY(-180deg)}.clicked--back{transform:rotateY(0)}.flip-card__side--back.vertical{transform:rotateX(180deg)}.clicked--front.vertical{transform:rotateX(-180deg)}.clicked--back.vertical{transform:rotateX(0)}.flip-card__gradient{flex:.4 1 0}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
+:host{display:block;aspect-ratio:var(--sd-aspect-3\\/4);--name:'';--height:480px;height:var(--height)}.flip-card{perspective:100rem}.flip-card__side{backface-visibility:hidden}.flip-card__side--back{transform:rotateY(180deg)}.clicked--front{transform:rotateY(-180deg)}.clicked--back{transform:rotateY(0)}.flip-card__side--back.vertical{transform:rotateX(180deg)}.clicked--front.vertical{transform:rotateX(-180deg)}.clicked--back.vertical{transform:rotateX(0)}.flip-card__gradient{flex:.4 1 0}:host([front-variant=gradient-light]) [part=front-secondary-gradient],:host([front-variant=gradient-light]) [part=front-slot-container] .bg-gradient-to-b{--sd-color-background-white:var(--sd-informational-gradient--white-color-background, var(--sd-color-white))}:host([front-variant=gradient-dark]) [part=front-secondary-gradient],:host([front-variant=gradient-dark]) [part=front-slot-container] .bg-gradient-to-b{--sd-color-background-primary-800:var(
+          --sd-informational-gradient--primary-800-color-background,
+          var(--sd-color-primary-800)
+        )}`
 ];
 __decorateClass([
   query('[part="front"]')

package/dist/chunks/chunk.EORXKFFT.js

@@ -0,0 +1,61 @@
+import {
+  SolidElement,
+  customElement
+} from "./chunk.RY4KWEME.js";
+import {
+  __decorateClass
+} from "./chunk.S3NI7NKU.js";
+
+// src/components/theme-listener/theme-listener.ts
+import { css } from "lit";
+
+// src/internal/theme-observer.ts
+import StyleObserver from "style-observer";
+var ThemeObserver = class {
+  constructor(host, callback) {
+    this.host = host;
+    this.callback = callback;
+  }
+  connect() {
+    this.observer = new StyleObserver((records) => {
+      var _a, _b;
+      const theme = (_b = (_a = records == null ? void 0 : records[0]) == null ? void 0 : _a.value) == null ? void 0 : _b.replaceAll(`'`, "");
+      if (!theme) return;
+      this.callback(theme);
+    });
+    this.observer.observe(this.host, "--sd-theme");
+  }
+  disconnect() {
+    var _a;
+    (_a = this.observer) == null ? void 0 : _a.unobserve(this.host);
+  }
+};
+
+// src/components/theme-listener/theme-listener.ts
+var SdThemeListener = class extends SolidElement {
+  handleThemeChange(theme) {
+    this.emit("sd-theme-change", { detail: { theme }, bubbles: true });
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.themeObserver = new ThemeObserver(this, this.handleThemeChange.bind(this));
+    this.themeObserver.connect();
+  }
+  disconnectedCallback() {
+    var _a;
+    super.disconnectedCallback();
+    (_a = this.themeObserver) == null ? void 0 : _a.disconnect();
+  }
+};
+SdThemeListener.styles = [
+  ...SolidElement.styles,
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
+:host{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border-width:0}`
+];
+SdThemeListener = __decorateClass([
+  customElement("sd-theme-listener")
+], SdThemeListener);
+
+export {
+  SdThemeListener
+};

package/dist/chunks/{chunk.VZBVZB3D.js → chunk.F4A7G427.js}

@@ -4,7 +4,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.RY4KWEME.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -54,7 +54,7 @@ var SdTag = class extends SolidElement {
   async hide() {
     this.emit("sd-hide");
     this.style.opacity = "0";
-    await new Promise((resolve) => setTimeout(resolve, this.token("sd-duration-fast", 150)));
+    await new Promise((resolve) => setTimeout(resolve, this.token("--sd-duration-fast", 150)));
     this.hidden = true;
     this.emit("sd-after-hide");
   }
@@ -77,15 +77,16 @@ var SdTag = class extends SolidElement {
       /* colors */
       !this.selected ? cx(
         "border-primary text-primary disabled:border-neutral-500 disabled:text-neutral-500",
-        !this.removable ? "hover:border-primary-500 hover:bg-neutral-100 hover:text-primary-500" : "has-[button:hover]:border-primary-500 has-[button:hover]:bg-neutral-100 has-[button:hover]:text-primary-500"
-      ) : "bg-primary border-primary text-white hover:bg-primary-500 hover:border-primary-500 disabled:bg-neutral-500 disabled:border-neutral-500",
+        !this.removable ? "hover:border-primary-500 hover:text-primary-500" : "has-[button:hover]:border-primary-500 has-[button:hover]:text-primary-500"
+      ) : "sd-tag--selected--default-color-background border-primary sd-tag--selected--default-color-text hover:bg-primary-500 hover:border-primary-500 disabled:bg-neutral-500 disabled:border-neutral-500",
       this.disabled && !isLink && "cursor-not-allowed"
     )}"><slot id="content" part="content"></slot>${this.removable && !isLink ? html`<button class="sd-interactive flex items-center" type="button" @click="${this.handleRemove}"><slot part="removable-indicator" name="removable-indicator"><sd-icon library="_internal" name="close" label="${this.localize.term("remove")}"></sd-icon></slot></button>` : ""}</${tag}>`;
   }
 };
 SdTag.styles = [
   ...SolidElement.styles,
-  css`:host{display:inline-block;transition-duration:.15s;transition-duration:var(--sd-duration-fast,.15s);transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1)}:host([size=lg])::part(removable-indicator){font-size:var(--sd-font-size-base,1rem)}:host([size=sm])::part(removable-indicator){font-size:.75rem}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
+:host{display:inline-block;transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function,cubic-bezier(.4,0,.2,1)));transition-duration:var(--tw-duration,var(--default-transition-duration,150ms));--tw-duration:var(--sd-duration-fast, 150ms);transition-duration:var(--sd-duration-fast,150ms);--tw-ease:var(--ease-in-out, cubic-bezier(0.4, 0, 0.2, 1));transition-timing-function:var(--ease-in-out,cubic-bezier(.4,0,.2,1))}:host([size=lg])::part(removable-indicator){font-size:var(--sd-text-base);line-height:var(--tw-leading,var(--text-base--line-height,calc(1.5 / 1)))}:host([size=sm])::part(removable-indicator){font-size:.75rem}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}`
 ];
 __decorateClass([
   query("a, button, div")

package/dist/chunks/{chunk.ERJOEJ54.js → chunk.FMSAUZWF.js}

@@ -7,7 +7,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.RY4KWEME.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -43,7 +43,8 @@ var SdOptgroup = class extends SolidElement {
 };
 SdOptgroup.styles = [
   ...SolidElement.styles,
-  css`:host{--display-divider:block}#divider{display:var(--display-divider)}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
+:host{--display-divider:block}#divider{display:var(--display-divider)}`
 ];
 __decorateClass([
   query("slot:not([name])")

package/dist/chunks/{chunk.G3JK5J7P.js → chunk.FPMNMEXR.js}

@@ -1,7 +1,7 @@
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.RY4KWEME.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -32,7 +32,8 @@ var SdDivider = class extends SolidElement {
  */
 SdDivider.styles = [
   ...SolidElement.styles,
-  css`:host{margin:var(--sd-spacing-0,0)}:host(sd-divider[orientation=horizontal]){display:block}:host(sd-divider[orientation=vertical]){display:inline-block}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
+:host{margin:calc(var(--sd-spacing-1) * 0)}:host(sd-divider[orientation=horizontal]){display:block}:host(sd-divider[orientation=vertical]){display:inline-block}`
 ];
 __decorateClass([
   property({ type: String, reflect: true })

package/dist/chunks/{chunk.UVOGBJGP.js → chunk.GYXMDYGY.js}

@@ -1,9 +1,9 @@
 import {
   library_default_default
-} from "./chunk.7VPFFNHR.js";
+} from "./chunk.KPAQRMCC.js";
 import {
   library_internal_default
-} from "./chunk.QSQRQKYT.js";
+} from "./chunk.O6MXNSO7.js";
 import {
   library_status_default
 } from "./chunk.4TPOL3LB.js";

package/dist/chunks/{chunk.4VTG7PRD.js → chunk.HB45IF2T.js}

@@ -4,7 +4,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.RY4KWEME.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -49,7 +49,8 @@ var SdLoader = class extends SolidElement {
  */
 SdLoader.styles = [
   ...SolidElement.styles,
-  css`:host{display:inline-block;height:1em;width:1em}.dot:nth-child(2){animation-delay:.1s}.dot:first-child{animation-delay:.2s}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
+:host{display:inline-block;width:1em;height:1em}.dot:nth-child(2){animation-delay:.1s}.dot:nth-child(1){animation-delay:.2s}`
 ];
 __decorateClass([
   property({ type: String, reflect: true })

package/{dist-versioned/chunks/chunk.7VPFFNHR.js → dist/chunks/chunk.KPAQRMCC.js}

@@ -26,10 +26,10 @@ var defaultLibrary = {
       strokedElement.setAttribute("stroke", "currentColor");
     });
     recoloredElements.greenFills.forEach((filledElement) => {
-      filledElement.setAttribute("fill", "rgb(var(--sd-color-accent, 45 157 0) / var(--tw-bg-opacity, 1))");
+      filledElement.setAttribute("fill", "var(--sd-color-accent, 45 157 0)");
     });
     recoloredElements.greenStrokes.forEach((strokedElement) => {
-      strokedElement.setAttribute("stroke", "rgb(var(--sd-color-accent, 45 157 0) / var(--tw-bg-opacity, 1))");
+      strokedElement.setAttribute("stroke", "var(--sd-color-accent, 45 157 0)");
     });
     return svg;
   }

package/dist/chunks/{chunk.7MXI26GR.js → chunk.M5EPD6OZ.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk.FNYEXUNK.js";
 import {
   SdCarouselItem
-} from "./chunk.GUZQ4ADZ.js";
+} from "./chunk.WSXDUNN7.js";
 import {
   AutoplayController
 } from "./chunk.F4VGSDIW.js";
@@ -19,7 +19,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.RY4KWEME.js";
 import {
   prefersReducedMotion
 } from "./chunk.HQWAKJBV.js";
@@ -487,7 +487,8 @@ var SdCarousel = class extends SolidElement {
 };
 SdCarousel.styles = [
   ...SolidElement.styles,
-  css`:host{--slide-gap:var(--sl-spacing-medium,1rem);--scroll-hint:0px;display:flex}.carousel{grid-template-areas:". slides ." ". pagination ."}.carousel__pagination{grid-area:pagination}.carousel__slides{grid-area:slides;scrollbar-width:none;--slide-size:calc((100% - (var(--slides-per-page) - 1)*var(--slide-gap))/var(--slides-per-page));-moz-column-gap:var(--slide-gap);column-gap:var(--slide-gap);grid-auto-columns:var(--slide-size);padding-inline:var(--scroll-hint);scroll-padding-inline:var(--scroll-hint)}.carousel__slides::-webkit-scrollbar{display:none}:host([fade]){--carousel-height:auto}:host([fade]) .carousel__slides{display:block;height:var(--carousel-height);overflow:hidden;position:relative}@media (prefers-reduced-motion){:where(.carousel__slides){scroll-behavior:auto}}.carousel__navigation{grid-area:navigation}sd-button::part(label){align-items:center;display:flex;flex:1 1 auto;pointer-events:none}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
+:host{--slide-gap:var(--sl-spacing-medium, 1rem);--scroll-hint:0px;display:flex}.carousel{grid-template-areas:'. slides .' '. pagination .'}.carousel__pagination{grid-area:pagination}.carousel__slides{grid-area:slides;scrollbar-width:none;--slide-size:calc((100% - (var(--slides-per-page) - 1) * var(--slide-gap)) / var(--slides-per-page));grid-auto-columns:var(--slide-size);-moz-column-gap:var(--slide-gap);column-gap:var(--slide-gap);scroll-padding-inline:var(--scroll-hint);padding-inline:var(--scroll-hint)}.carousel__slides::-webkit-scrollbar{display:none}:host([fade]){--carousel-height:auto}:host([fade]) .carousel__slides{position:relative;display:block;overflow:hidden;height:var(--carousel-height)}@media (prefers-reduced-motion){:where(.carousel__slides){scroll-behavior:auto}}.carousel__navigation{grid-area:navigation}sd-button::part(label){pointer-events:none;display:flex;flex:auto;align-items:center}`
 ];
 __decorateClass([
   query('[part~="autoplay-controls"]')

package/dist/chunks/{chunk.2SR73L2N.js → chunk.MB47FVBP.js}

@@ -1,7 +1,7 @@
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.RY4KWEME.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -83,7 +83,8 @@ var SdMapMarker = class extends SolidElement {
  */
 SdMapMarker.styles = [
   ...SolidElement.styles,
-  css`:host{display:block}#motion-wrapper{mask-position:center;-webkit-mask-position:center;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-size:contain;-webkit-mask-size:contain}:host([variant=cluster]) [part=base],svg{width:calc(var(--sd-spacing-12,3rem)*var(--map-marker-scaling,1))}:host([variant=cluster]) [part=base]{height:calc(var(--sd-spacing-12,3rem)*var(--map-marker-scaling,1))}:host(:not([variant=cluster])) [part=base]{height:calc(var(--sd-spacing-16,4rem)*var(--map-marker-scaling,1))}:host([variant=cluster]) [part=content]{font-size:calc(var(--sd-font-size-sm,.875rem)*var(--map-marker-scaling,1))}:host([variant=place]) [part=content]{font-size:calc(var(--sd-font-size-3xl,2rem)*var(--map-marker-scaling,1));margin-top:calc(var(--sd-spacing-2,.5rem)*-1)}:host([variant=main]) [part=marker],:host([variant=place]) [part=marker]{--tw-drop-shadow:drop-shadow(var(--sd-shadow,0px 1px 3px #515151));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}:host([variant=main]) #marker-circle{height:calc(var(--sd-spacing-4,1rem)*var(--map-marker-scaling,1));left:calc(var(--sd-spacing-4,1rem)*var(--map-marker-scaling,1));right:calc(var(--sd-spacing-4,1rem)*var(--map-marker-scaling,1));top:calc(var(--sd-spacing-4,1rem)*var(--map-marker-scaling,1));width:calc(var(--sd-spacing-4,1rem)*var(--map-marker-scaling,1))}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
+:host{display:block}#motion-wrapper{mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-position:center;-webkit-mask-position:center;mask-size:contain;-webkit-mask-size:contain}:host([variant=cluster]) [part=base],svg{width:calc(var(--sd-spacing-12,3rem) * var(--map-marker-scaling,1))}:host([variant=cluster]) [part=base]{height:calc(var(--sd-spacing-12,3rem) * var(--map-marker-scaling,1))}:host(:not([variant=cluster])) [part=base]{height:calc(var(--sd-spacing-16,4rem) * var(--map-marker-scaling,1))}:host([variant=cluster]) [part=content]{font-size:calc(var(--sd-font-size-sm,.875rem) * var(--map-marker-scaling,1))}:host([variant=place]) [part=content]{margin-top:calc(var(--sd-spacing-2) * -1);font-size:calc(var(--sd-font-size-3xl,2rem) * var(--map-marker-scaling,1))}:host([variant=main]) [part=marker],:host([variant=place]) [part=marker]{--tw-drop-shadow-size:drop-shadow(var(--sd-drop-shadow));--tw-drop-shadow:drop-shadow(var(--sd-drop-shadow));filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}:host([variant=main]) #marker-circle{width:calc(var(--sd-spacing-4,1rem) * var(--map-marker-scaling,1));height:calc(var(--sd-spacing-4,1rem) * var(--map-marker-scaling,1));left:calc(var(--sd-spacing-4,1rem) * var(--map-marker-scaling,1));right:calc(var(--sd-spacing-4,1rem) * var(--map-marker-scaling,1));top:calc(var(--sd-spacing-4,1rem) * var(--map-marker-scaling,1))}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}`
 ];
 __decorateClass([
   property({ type: String, reflect: true })

package/dist/chunks/{chunk.RCBOBERD.js → chunk.MFE2NCVX.js}

@@ -11,7 +11,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.RY4KWEME.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -101,7 +101,7 @@ var SdMenuItem = class extends SolidElement {
       iconIndent: this.hasSlotController.test("icon-indent")
     };
     return html`<div id="anchor" part="base" class="${cx(
-      "relative flex items-stretch whitespace-nowrap py-3 px-4 no-wrap",
+      "relative flex items-stretch whitespace-nowrap py-3 px-4 no-wrap !navigable-border-radius",
       this.disabled ? "outline-none cursor-not-allowed text-neutral-500 hover:bg-transparent" : "cursor-pointer text-primary hover:bg-neutral-200",
       this.isSubmenu() && isSubmenuExpanded && "submenu-expanded"
     )}" .disabled="${this.disabled}" ?aria-haspopup="${this.isSubmenu()}" ?aria-expanded="${isSubmenuExpanded ? true : false}">${this.type === "checkbox" ? html`<span part="checked-icon" class="${cx(
@@ -112,7 +112,8 @@ var SdMenuItem = class extends SolidElement {
 };
 SdMenuItem.styles = [
   ...SolidElement.styles,
-  css`:host{--submenu-offset:-6px;display:block}:host(:focus-visible){outline:2px solid transparent;outline-offset:2px}::slotted(sd-icon){height:var(--sd-spacing-6,1.5rem);width:var(--sd-spacing-6,1.5rem)}[part=checked-icon]{margin-right:var(--sd-spacing-3,.75rem)}.submenu-expanded:after{bottom:var(--sd-spacing-0,0);left:var(--sd-spacing-0,0);position:fixed;right:var(--sd-spacing-0,0);top:var(--sd-spacing-0,0);z-index:calc(var(z-dropdown) - 1);--tw-content:"";clip-path:polygon(var(--safe-triangle-cursor-x,0) var(--safe-triangle-cursor-y,0),var(--safe-triangle-submenu-start-x,0) var(--safe-triangle-submenu-start-y,0),var(--safe-triangle-submenu-end-x,0) var(--safe-triangle-submenu-end-y,0));content:var(--tw-content)}:host(:hover:not([aria-disabled=true],:focus-visible)) [part=base]{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-neutral-200,233 233 233)/var(--tw-bg-opacity,1));outline:2px solid transparent;outline-offset:2px}:host(:focus-visible:not([aria-disabled=true])) [part=base]{outline-color:rgb(var(--sd-color-primary,0 53 142)/1);outline-offset:-2px;outline-style:solid;outline-width:2px}:host(:hover) [part=base]{outline:2px solid transparent;outline-offset:2px}sd-popup::part(popup){z-index:var(--sd-z-index-dropdown,900);--tw-bg-opacity:1;background-color:rgb(var(--sd-color-white,255 255 255)/var(--tw-bg-opacity,1));margin-left:var(--submenu-offset)}::slotted(sd-menu){max-height:var(--auto-size-available-height)!important;max-width:var(--auto-size-available-width)!important}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
+:host{--submenu-offset:-6px;display:block}:host(:focus-visible){--tw-outline-style:none;outline-style:none}::slotted(sd-icon){height:var(--sd-spacing-6);width:var(--sd-spacing-6)}[part=checked-icon]{margin-right:var(--sd-spacing-3)}.submenu-expanded::after{position:fixed;top:calc(var(--sd-spacing-1) * 0);right:calc(var(--sd-spacing-1) * 0);bottom:calc(var(--sd-spacing-1) * 0);left:calc(var(--sd-spacing-1) * 0);z-index:calc(var(z-dropdown) - 1);--tw-content:'';content:var(--tw-content);clip-path:polygon(var(--safe-triangle-cursor-x,0) var(--safe-triangle-cursor-y,0),var(--safe-triangle-submenu-start-x,0) var(--safe-triangle-submenu-start-y,0),var(--safe-triangle-submenu-end-x,0) var(--safe-triangle-submenu-end-y,0))}:host(:hover:not([aria-disabled=true],:focus-visible)) [part=base]{background-color:var(--sd-color-background-neutral-200);--tw-outline-style:none;outline-style:none}:host(:focus-visible:not([aria-disabled=true])) [part=base]{outline-style:solid;outline-offset:2px;outline-width:2px;outline-color:var(--outline-color-primary);outline-offset:-2px}:host(:hover) [part=base]{--tw-outline-style:none;outline-style:none}sd-popup::part(popup){z-index:var(--sd-z-index-dropdown,900);background-color:var(--sd-color-background-white);margin-left:var(--submenu-offset)}::slotted(sd-menu){max-width:var(--auto-size-available-width)!important;max-height:var(--auto-size-available-height)!important}@property --tw-content{syntax:"*";inherits:false;initial-value:""}`
 ];
 __decorateClass([
   query("slot:not([name])")

package/dist/chunks/{chunk.AXFVYO5L.js → chunk.N5XK43AK.js}

@@ -11,7 +11,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.RY4KWEME.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -152,7 +152,7 @@ var SdButton = class extends SolidElement {
     return html`<${tag} part="base" class="${cx(
       `group relative z-10 font-md no-underline
         w-full align-middle inline-flex items-stretch justify-center
-        transition-colors duration-fast ease-in-out rounded-default
+        transition-colors duration-fast ease-in-out
         select-none cursor-[inherit]`,
       !this.inverted ? "focus-visible:focus-outline" : "focus-visible:focus-outline-inverted",
       this.loading && "relative cursor-wait",
@@ -163,41 +163,47 @@ var SdButton = class extends SolidElement {
        * */
       {
         /* sizes, fonts */
-        sm: `text-sm varspacing-8 ${hasBorder ? "py-[0.281rem] px-[0.938rem]" : "py-[0.344rem] px-4"}`,
-        md: `text-base varspacing-10 ${hasBorder ? "py-[0.438rem] px-[0.938rem]" : "py-2 px-4"}`,
-        lg: `text-base varspacing-12 ${hasBorder ? "py-[0.688rem] px-[0.938rem]" : "py-3 px-4"}`
+        sm: `text-sm varspacing-8 rounded-default ${hasBorder ? "py-[0.281rem] px-[0.938rem]" : "py-[0.344rem] px-4"}`,
+        md: `sd-button--size-md-font-size sd-button--size-md-border-radius varspacing-10 ${hasBorder ? "py-[0.438rem] px-[0.938rem]" : "sd-button--size-md-padding-block px-4"}`,
+        lg: `sd-button--size-lg-font-size sd-button--size-lg-border-radius varspacing-12 ${hasBorder ? "py-[0.688rem] px-[0.938rem]" : "sd-button--size-lg-padding-block px-4"}`
       }[this.size],
       {
         /* variants */
-        primary: !this.inverted ? `text-white ${this.visuallyDisabled ? "bg-neutral-500 border-neutral-500 hover:bg-neutral-500" : "bg-primary border-transparent hover:text-primary-100 active:text-primary-200"}
-          disabled:bg-neutral-500` : `${this.visuallyDisabled ? "bg-neutral-500 text-white border-neutral-500 hover:bg-neutral-500 active:bg-neutral-500" : "text-primary bg-white border-white hover:text-primary-500 active:text-primary-800"}
+        primary: !this.inverted ? `sd-button--primary--default-color-text ${this.visuallyDisabled ? "bg-neutral-500 border-neutral-500 hover:bg-neutral-500" : "sd-button--primary--default-color-background border-transparent hover:text-primary-100 active:sd-button--primary--active-color-text"}
+          disabled:bg-neutral-500` : `${this.visuallyDisabled ? "bg-neutral-500 text-white border-neutral-500 hover:bg-neutral-500 active:bg-neutral-500" : "sd-button--primary--inverted--default-color-text sd-button--primary--inverted--default-color-background border-white hover:sd-button--primary--inverted--hover-color-text active:sd-button--primary--inverted--active-color-text"}
           disabled:bg-neutral-600 disabled:text-white disabled:border-neutral-600`,
         secondary: !this.inverted ? `border ${this.visuallyDisabled ? "text-neutral-500 border-neutral-500 hover:text-neutral-500 hover:border-neutral-500 active:text-neutral-500 active:border-neutral-500" : "text-primary border-primary hover:text-primary-500 hover:border-primary-500 active:text-primary-800 active:border-primary-800"}
-          disabled:text-neutral-500 disabled:border-neutral-500` : `border ${this.visuallyDisabled ? "text-neutral-600 border-neutral-600 hover:text-neutral-600 hover:border-neutral-600 active:text-neutral-600 active:border-neutral-600" : "text-white border-white hover:text-primary-100 hover:border-primary-100 active:text-primary-200"}
+          disabled:text-neutral-500 disabled:border-neutral-500` : `border ${this.visuallyDisabled ? "text-neutral-600 border-neutral-600 hover:text-neutral-600 hover:border-neutral-600 active:text-neutral-600 active:border-neutral-600" : "text-white border-white hover:sd-button--secondary--inverted--hover-color-text hover:border-primary-100 active:text-primary-200"}
           disabled:text-neutral-600 disabled:border-neutral-600`,
         tertiary: !this.inverted ? `border-transparent ${this.visuallyDisabled ? "text-neutral-500 hover:text-neutral-500 active:text-neutral-500" : "text-primary hover:text-primary-500 active:text-primary-800"}
-          disabled:text-neutral-500` : `border-transparent  ${this.visuallyDisabled ? "text-neutral-600 hover:text-neutral-600 active:text-neutral-600" : "text-white hover:text-primary-100 active:text-primary-200"}
+          disabled:text-neutral-500` : `border-transparent  ${this.visuallyDisabled ? "text-neutral-600 hover:text-neutral-600 active:text-neutral-600" : "text-white hover:sd-button--tertiary--inverted--hover-color-text active:text-primary-200"}
           disabled:text-neutral-600`,
         cta: `text-white ${this.visuallyDisabled ? "bg-neutral-500 border-neutral-500 hover:bg-neutral-500 active:bg-neutral-500" : "bg-accent-500 border-transparent"}
           ${!this.inverted ? "disabled:bg-neutral-500 disabled:border-neutral-500" : "disabled:bg-neutral-600 disabled:border-neutral-600"} disabled:text-white`
       }[this.variant]
     )}" ?disabled="${ifDefined(isLink ? void 0 : this.disabled)}" type="${ifDefined(isLink ? void 0 : this.type)}" title="${this.title}" name="${ifDefined(isLink ? void 0 : this.name)}" value="${ifDefined(isLink ? void 0 : this.value)}" href="${ifDefined(isLink ? this.href : void 0)}" target="${ifDefined(isLink ? this.target : void 0)}" download="${ifDefined(isLink ? this.download : void 0)}" rel="${ifDefined(isLink && this.target ? "noreferrer noopener" : void 0)}" role="${ifDefined(isLink ? void 0 : "button")}" aria-disabled="${this.disabled || this.visuallyDisabled ? "true" : "false"}" aria-labelledby="content" tabindex="${this.disabled ? "-1" : "0"}" @blur="${this.handleBlur}" @focus="${this.handleFocus}" @invalid="${this.isButton() ? this.handleInvalid : null}" @click="${this.handleClick}"><div part="motion-wrapper" class="${cx(
-      "absolute inset-0 rounded-default -z-10 overflow-hidden pointer-events-none ",
-      (this.disabled || this.visuallyDisabled) && "hidden"
+      "absolute inset-0 -z-10 overflow-hidden pointer-events-none ",
+      (this.disabled || this.visuallyDisabled) && "hidden",
+      {
+        /* sizes, fonts */
+        sm: `rounded-default`,
+        md: `sd-button--size-md-border-radius`,
+        lg: `sd-button--size-lg-border-radius`
+      }[this.size]
     )}"><div class="absolute inset-0 w-full h-full transition-all duration-fast translate-y-full group-hover:translate-y-0 group-hover:mt-[-22%] mt-[11%]"><div class="${cx(
       "absolute right-0 min-w-full min-h-full aspect-square skew-y-[-11deg] mt-[11%]",
       {
-        primary: !this.inverted ? "bg-primary-500 group-active:bg-primary-800" : "bg-primary-100 group-active:bg-primary-200",
-        secondary: !this.inverted ? "bg-primary-100 group-active:bg-primary-200" : "bg-primary-500 group-active:bg-primary-800",
-        tertiary: !this.inverted ? "bg-primary-100 group-active:bg-primary-200" : "bg-primary-500 group-active:bg-primary-800",
+        primary: !this.inverted ? "sd-button--primary--hover-color-background group-active:bg-primary-800" : "sd-button--primary--inverted--hover-color-background group-active:bg-primary-200",
+        secondary: !this.inverted ? "sd-button--secondary--hover-color-background group-active:sd-button--secondary--active-color-background" : "bg-primary-500 group-active:sd-button--secondary--inverted--active-color-background",
+        tertiary: !this.inverted ? "sd-button--tertiary--hover-color-background group-active:sd-button--tertiary--active-color-background" : "bg-primary-500 group-active:sd-button--tertiary--inverted--active-color-background",
         cta: "bg-accent-550 group-active:bg-accent-700"
       }[this.variant]
     )}"></div><div class="${cx(
       "absolute w-full h-full mt-[22%]",
       {
-        primary: !this.inverted ? "bg-primary-500 group-active:bg-primary-800" : "bg-primary-100 group-active:bg-primary-200",
-        secondary: !this.inverted ? "bg-primary-100 group-active:bg-primary-200" : "bg-primary-500 group-active:bg-primary-800",
-        tertiary: !this.inverted ? "bg-primary-100 group-active:bg-primary-200" : "bg-primary-500 group-active:bg-primary-800",
+        primary: !this.inverted ? "sd-button--primary--hover-color-background group-active:bg-primary-800" : "sd-button--primary--inverted--hover-color-background group-active:bg-primary-200",
+        secondary: !this.inverted ? "sd-button--secondary--hover-color-background group-active:sd-button--secondary--active-color-background" : "bg-primary-500 group-active:sd-button--secondary--inverted--active-color-background",
+        tertiary: !this.inverted ? "sd-button--tertiary--hover-color-background group-active:sd-button--tertiary--active-color-background" : "bg-primary-500 group-active:sd-button--tertiary--inverted--active-color-background",
         cta: "bg-accent-550 group-active:bg-accent-700"
       }[this.variant]
     )}"></div></div></div><slot name="icon-left" part="icon-left" class="${cx(
@@ -230,7 +236,8 @@ var SdButton = class extends SolidElement {
  */
 SdButton.styles = [
   ...SolidElement.styles,
-  css`:host{cursor:pointer;display:inline-block;position:relative;width:var(--sd-spacing-auto,auto);z-index:0}::slotted(sd-badge){pointer-events:none;position:absolute;right:var(--sd-spacing-0,0);top:var(--sd-spacing-0,0);--tw-translate-x:50%!important;--tw-translate-y:-50%!important;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))!important}::slotted(sd-icon),sd-loader{font-size:calc(var(--tw-varspacing)/2)}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
+:host{position:relative;z-index:0;display:inline-block;width:auto;cursor:pointer}::slotted(sd-badge){pointer-events:none;position:absolute;top:calc(var(--sd-spacing-1) * 0);right:calc(var(--sd-spacing-1) * 0);--tw-translate-x:calc(1/2 * 100%)!important;--tw-translate-y:calc(calc(1/2 * 100%) * -1)!important;translate:var(--tw-translate-x) var(--tw-translate-y)!important}::slotted(sd-icon),sd-loader{font-size:calc(var(--tw-varspacing)/ 2)}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}`
 ];
 __decorateClass([
   query("a, button")

package/dist/chunks/{chunk.2CAP3Q56.js → chunk.NCZBBZOR.js}

@@ -1,7 +1,7 @@
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.RY4KWEME.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -241,7 +241,8 @@ var SdPopup = class extends SolidElement {
 };
 SdPopup.styles = [
   ...SolidElement.styles,
-  css`:host{--arrow-color:var(--sd-color-neutral-1000);--arrow-size:6px;--arrow-size-diagonal:calc(var(--arrow-size)*0.7071);--arrow-padding-offset:calc(var(--arrow-size-diagonal) - var(--arrow-size));display:contents}[part=popup]{max-height:var(--auto-size-available-height,none);max-width:var(--auto-size-available-width,none)}[part=arrow]{background:var(--arrow-color);height:calc(var(--arrow-size-diagonal)*2);width:calc(var(--arrow-size-diagonal)*2)}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
+:host{--arrow-color:var(--sd-color-neutral-1000);--arrow-size:6px;--arrow-size-diagonal:calc(var(--arrow-size) * 0.7071);--arrow-padding-offset:calc(var(--arrow-size-diagonal) - var(--arrow-size));display:contents}[part=popup]{max-width:var(--auto-size-available-width,none);max-height:var(--auto-size-available-height,none)}[part=arrow]{width:calc(var(--arrow-size-diagonal) * 2);height:calc(var(--arrow-size-diagonal) * 2);background:var(--arrow-color)}`
 ];
 __decorateClass([
   query('[part="popup"]')

package/dist/chunks/{chunk.EOLLVTEE.js → chunk.NK5K5MMW.js}

@@ -4,7 +4,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.RY4KWEME.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -35,7 +35,8 @@ var SdSpinner = class extends SolidElement {
  */
 SdSpinner.styles = [
   ...SolidElement.styles,
-  css`:host{display:inline-block;height:1em;width:1em}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
+:host{display:inline-block;width:1em;height:1em}`
 ];
 __decorateClass([
   property({ type: String, reflect: true })