@solid-design-system/components 5.16.2 → 6.0.0-next.10

package/dist/chunks/{chunk.7FMGPUZF.js → chunk.2LOD5KZ2.js}

@@ -16,7 +16,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.XZHOUXTG.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -73,17 +73,7 @@ var SdDatepicker = class extends SolidElement {
     this.tabbingIntoGrid = false;
     /** Bump counter ensuring live region text updates are recognized. */
     this.statusBumpCounter = 0;
-    this.onFocusOut = (ev) => {
-      const next = ev.relatedTarget;
-      if (next && this.contains(next)) return;
-      if (this.open) {
-        this.hide();
-        this.emit("sd-datepicker-close");
-      }
-      this.hasFocus = false;
-    };
     this.onFocusIn = (ev) => {
-      if (this.disabled || this.visuallyDisabled) return;
       const path = ev.composedPath();
       const fromHeader = path.some(
         (n) => {
@@ -96,20 +86,20 @@ var SdDatepicker = class extends SolidElement {
       }
     };
     this.handleInput = (ev) => {
-      var _a, _b, _c, _d, _e;
-      if (this.disabled || this.visuallyDisabled) {
-        (_a = ev.preventDefault) == null ? void 0 : _a.call(ev);
-        (_b = ev.stopPropagation) == null ? void 0 : _b.call(ev);
-        return;
-      }
+      var _a, _b, _c;
       const input = ev.target;
       const raw = input.value;
-      const oldPos = (_c = input.selectionStart) != null ? _c : raw.length;
-      const isDeleting = (_d = ev.inputType) == null ? void 0 : _d.startsWith("delete");
+      const oldPos = (_a = input.selectionStart) != null ? _a : raw.length;
+      const isDeleting = (_b = ev.inputType) == null ? void 0 : _b.startsWith("delete");
+      if (this.visuallyDisabled || this.disabled) {
+        ev.preventDefault();
+        ev.stopPropagation();
+        return;
+      }
       if (!this.range) {
         const inputEl = input;
         const rawText = inputEl.value;
-        const oldCaret = (_e = inputEl.selectionStart) != null ? _e : rawText.length;
+        const oldCaret = (_c = inputEl.selectionStart) != null ? _c : rawText.length;
         const digits = rawText.replace(/\D/g, "").slice(0, 8);
         const d = digits.slice(0, 2);
         const m = digits.slice(2, 4);
@@ -282,10 +272,6 @@ var SdDatepicker = class extends SolidElement {
       }
     };
     this.handleInputBlur = () => {
-      if (this.disabled || this.visuallyDisabled) {
-        this.handleBlur();
-        return;
-      }
       const parsed = this.parseInputText(this.inputValue);
       if (!parsed.valid) {
         this.inputValue = this.formatInputValue();
@@ -316,11 +302,6 @@ var SdDatepicker = class extends SolidElement {
       }
     };
     this.onKeyDown = (ev) => {
-      if (this.disabled || this.visuallyDisabled) {
-        ev.preventDefault();
-        ev.stopPropagation();
-        return;
-      }
       const key = ev.key;
       let handled = true;
       const next = new Date(this.focusedDate);
@@ -387,11 +368,6 @@ var SdDatepicker = class extends SolidElement {
       }
     };
     this.handleInputKeyDown = (ev) => {
-      if ((this.disabled || this.visuallyDisabled) && ev.key !== "Tab") {
-        ev.preventDefault();
-        ev.stopPropagation();
-        return;
-      }
       if (ev.key === "ArrowLeft" || ev.key === "ArrowRight" || ev.key === "ArrowUp" || ev.key === "ArrowDown" || ev.key === "Home" || ev.key === "End" || ev.key === "PageUp" || ev.key === "PageDown") {
         return;
       }
@@ -412,7 +388,6 @@ var SdDatepicker = class extends SolidElement {
     super.connectedCallback();
     this.syncDisabledDatesSet();
     document.addEventListener("click", this.handleOutsideClick);
-    this.addEventListener("focusout", this.onFocusOut);
     this.updateComplete.then(() => {
       this.formControlController.updateValidity();
     });
@@ -425,6 +400,7 @@ var SdDatepicker = class extends SolidElement {
       this.firstDayOfWeek = 1;
     }
     this.inputValue = this.formatInputValue();
+    this.tabIndex = 0;
     this.setAttribute("role", "group");
     this.setAttribute(
       "aria-label",
@@ -438,7 +414,6 @@ var SdDatepicker = class extends SolidElement {
   disconnectedCallback() {
     super.disconnectedCallback();
     this.removeEventListener("focusin", this.onFocusIn);
-    this.removeEventListener("focusout", this.onFocusOut);
     document.removeEventListener("click", this.handleOutsideClick);
   }
   handleLocaleChange() {
@@ -828,9 +803,10 @@ var SdDatepicker = class extends SolidElement {
   show() {
     if (this.open || this.disabled || this.visuallyDisabled) {
       this.open = false;
-      return;
+      return void 0;
     }
     this.open = true;
+    return void 0;
   }
   hide() {
     if (!this.open || this.disabled) {
@@ -853,6 +829,9 @@ var SdDatepicker = class extends SolidElement {
     this.emit("sd-blur");
   }
   handleFocus() {
+    if (this.visuallyDisabled || this.disabled) {
+      return;
+    }
     this.hasFocus = true;
     if (!this.open && !this.disabled && !this.visuallyDisabled) {
       this.show();
@@ -1089,10 +1068,6 @@ var SdDatepicker = class extends SolidElement {
       }
       weeks.push(row);
     }
-    const isRowOutsideMonth = (row) => row.every((d) => d.getMonth() !== monthRef.getMonth());
-    while (weeks.length > 0 && isRowOutsideMonth(weeks[weeks.length - 1])) {
-      weeks.pop();
-    }
     return { weeks };
   }
   formatMonthYear(d) {
@@ -1191,7 +1166,7 @@ var SdDatepicker = class extends SolidElement {
           "cell day flex items-center justify-center focus-visible:outline focus:outline-2 focus:outline-primary -outline-offset-2 rounded-md w-[36px]",
           this.size === "sm" ? "text-sm h-6" : "text-base h-8",
           isRangeStart || isRangeEnd ? "hover:bg-primary-500" : "hover:bg-primary-100 hover:text-primary-500",
-          !inMonth ? this.disabledWeekends && isWeekendDay ? "out-month weekend-day text-neutral-500" : isWeekendDay ? "out-month weekend-day text-neutral-700" : "out-month text-neutral-700" : this.isInDisabledDates(day) ? "out-month text-neutral-500" : this.disabledWeekends && isWeekendDay ? "weekend-day text-neutral-500" : "in-month text-primary",
+          !inMonth ? isWeekendDay ? "out-month weekend-day text-neutral-500" : "out-month text-neutral-700" : this.isInDisabledDates(day) ? "out-month text-neutral-700" : this.disabledWeekends && isWeekendDay ? "weekend-day text-neutral-500" : "in-month text-primary",
           isSelectedSingle ? "selected border-primary bg-primary text-white hover:bg-primary-500 hover:text-white" : "",
           isRangeStart ? "bg-primary text-white rounded-l-md rounded-r-none" : "",
           isRangeEnd ? "bg-primary text-white range-end rounded-r-md rounded-l-none" : "",
@@ -1232,11 +1207,7 @@ var SdDatepicker = class extends SolidElement {
       default: "border-neutral-800"
     }[inputState];
     const textSize = this.size === "sm" ? "text-sm" : "text-base";
-    return html`<div part="form-control" class="${cx(
-      "min-w-[284px]",
-      this.open && "z-50",
-      (this.disabled || this.visuallyDisabled) && "cursor-not-allowed"
-    )}">${hasLabel || hasTooltip ? html`<div class="flex items-center gap-1 mb-2"><label part="form-control-label" id="label" class="${cx(hasLabel ? "inline-block" : "hidden", textSize)}" for="input" aria-hidden="${hasLabel ? "false" : "true"}"><slot name="label">${this.label}</slot></label> ${slots["tooltip"] ? html`<slot name="tooltip"></slot>` : ""}</div>` : null}<div part="form-control-input" class="${cx(
+    return html`<div part="form-control" class="${cx("w-[370px]", this.open && "z-50", (this.disabled || this.visuallyDisabled) && "cursor-not-allowed")}">${hasLabel || hasTooltip ? html`<div class="flex items-center gap-1 mb-2"><label part="form-control-label" id="label" class="${cx(hasLabel ? "inline-block" : "hidden", textSize)}" for="input" aria-hidden="${hasLabel ? "false" : "true"}"><slot name="label">${this.label}</slot></label> ${slots["tooltip"] ? html`<slot name="tooltip"></slot>` : ""}</div>` : null}<div part="form-control-input" class="${cx(
       "relative w-full",
       this.disabled && "pointer-events-none",
       this.visuallyDisabled && "cursor-not-allowed"
@@ -1251,16 +1222,17 @@ var SdDatepicker = class extends SolidElement {
       this.readonly ? "bg-neutral-100" : "bg-white",
       inputState === "disabled" || inputState === "visuallyDisabled" ? "text-neutral-500" : "text-black"
     )}" slot="anchor"><input id="input" type="text" role="combobox" aria-expanded="${this.open ? "true" : "false"}" aria-haspopup="dialog" aria-controls="calendar-grid" aria-describedby="${hasHelpText ? "help-text" : void 0}" aria-invalid="${this.showInvalidStyle ? "true" : "false"}" aria-label="${this.range ? "Select date range" : "Select a date"}" class="${cx(
-      "min-w-0 flex-grow focus:outline-none bg-transparent hover:cursor-pointer",
-      this.visuallyDisabled || this.disabled ? "placeholder:text-neutral-500 cursor-not-allowed" : "placeholder:text-neutral-700",
+      "min-w-0 flex-grow focus:outline-none bg-transparent",
+      this.visuallyDisabled || this.disabled ? "placeholder-neutral-500 cursor-not-allowed" : "placeholder-neutral-700",
       { sm: "h-8", md: "h-10", lg: "h-12" }[this.size],
       textSize
-    )}" autocomplete="off" spellcheck="false" placeholder="${this.placeholder || this.localize.term(this.range ? "dateRangePlaceholder" : "datePlaceholder")}" ?disabled="${this.disabled}" ?readonly="${this.readonly || this.visuallyDisabled}" @input="${this.handleInput}" @click="${this.handleMouseDown}" @keydown="${this.handleInputKeyDown}" @focus="${this.handleFocus}" @blur="${this.handleInputBlur}" @invalid="${this.handleInvalid}"> ${this.showInvalidStyle ? html`<sd-icon part="invalid-icon" class="${cx("text-error", iconMarginLeft, iconSize)}" library="_internal" name="risk"></sd-icon>` : ""} ${this.showValidStyle && this.styleOnValid ? html`<sd-icon class="${cx("text-success flex-shrink-0", iconMarginLeft, iconSize)}" library="_internal" name="confirm-circle" part="valid-icon"></sd-icon>` : ""}<sd-icon class="${cx(iconColor, iconMarginLeft, iconSize, "hover:cursor-pointer")}" library="_internal" name="calendar" @click="${this.show}"></sd-icon>${this.renderCalendar()}</div></sd-popup></div><slot name="help-text" part="form-control-help-text" id="help-text" class="${cx("text-sm text-neutral-700 mt-1", hasHelpText ? "block" : "hidden")}" aria-hidden="${!hasHelpText}">${this.helpText}</slot></div>${this.formControlController.renderInvalidMessage()}`;
+    )}" placeholder="${this.placeholder || this.localize.term(this.range ? "dateRangePlaceholder" : "datePlaceholder")}" ?disabled="${this.disabled || this.disabled}" ?readonly="${this.readonly}" @input="${this.handleInput}" @click="${this.handleMouseDown}" @keydown="${this.handleInputKeyDown}" @focus="${this.handleFocus}" @blur="${this.handleInputBlur}" @invalid="${this.handleInvalid}"> ${this.showInvalidStyle ? html`<sd-icon part="invalid-icon" class="${cx("text-error", iconMarginLeft, iconSize)}" library="_internal" name="risk"></sd-icon>` : ""} ${this.showValidStyle && this.styleOnValid ? html`<sd-icon class="${cx("text-success flex-shrink-0", iconMarginLeft, iconSize)}" library="_internal" name="confirm-circle" part="valid-icon"></sd-icon>` : ""}<sd-icon class="${cx(iconColor, iconMarginLeft, iconSize)}" library="_internal" name="calendar"></sd-icon>${this.renderCalendar()}</div></sd-popup></div><slot name="help-text" part="form-control-help-text" id="help-text" class="${cx("text-sm text-neutral-700 mt-1", hasHelpText ? "block" : "hidden")}" aria-hidden="${!hasHelpText}">${this.helpText}</slot></div>${this.formControlController.renderInvalidMessage()}`;
   }
 };
 SdDatepicker.styles = [
   ...SolidElement.styles,
-  css`:host{display:inline-block;outline:2px solid transparent;outline-offset:2px;position:relative;width:100%}:host([required]) #label:after{content:" *"}:host([visually-disabled]) input{caret-color:transparent}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
+:host{position:relative;display:inline-block;--tw-outline-style:none;outline-style:none}:host([required]) #label::after{content:' *'}`
 ];
 __decorateClass([
   property({ type: String, reflect: true })

package/dist/chunks/{chunk.7QAWQQC2.js → chunk.3EAQUDVX.js}

@@ -4,13 +4,13 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.XZHOUXTG.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
 
 // src/components/range-tick/range-tick.ts
-import { html } from "lit";
+import { css, html } from "lit";
 import { property } from "lit/decorators.js";
 import cx from "classix";
 var SdRangeTick = class extends SolidElement {
@@ -20,10 +20,14 @@ var SdRangeTick = class extends SolidElement {
     this.subtick = false;
   }
   render() {
-    return html`<div part="base" class="${cx(this.subtick ? "w-0.25" : "w-0.5")}"><div part="line" class="${cx("bg-neutral-500", this.subtick ? "h-2" : "h-[10px]")}"></div><div part="label" class="flex items-center justify-center text-center text-nowrap text-sm"><slot></slot></div></div>`;
+    return html`<div part="base" class="${cx(this.subtick ? "w-0.25" : "w-0.5")}"><div part="line" class="${cx(this.subtick ? "h-2" : "h-[10px]")}"></div><div part="label" class="flex items-center justify-center text-center text-nowrap text-sm"><slot></slot></div></div>`;
   }
 };
-SdRangeTick.styles = SolidElement.styles;
+SdRangeTick.styles = [
+  ...SolidElement.styles,
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
+[part='line']{background-color:rgba(var(--sd-color-border-neutral-400,rgba(var(--sd-color-neutral-400))))}`
+];
 __decorateClass([
   property({ type: Boolean, reflect: true })
 ], SdRangeTick.prototype, "subtick", 2);

package/dist/chunks/{chunk.TWLOCD6V.js → chunk.3OSNOL5U.js}

@@ -17,7 +17,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.XZHOUXTG.js";
 import {
   animateTo,
   parseDuration,
@@ -214,7 +214,8 @@ var SdTooltip = class extends SolidElement {
 };
 SdTooltip.styles = [
   ...SolidElement.styles,
-  css`:host{--hide-delay:0ms;--show-delay:150ms;display:contents}sd-popup{--arrow-color:rgb(var(--sd-color-primary,0 53 142)/1);--arrow-size:10px}sd-popup::part(popup){pointer-events:none;z-index:10;--tw-shadow:var(--sd-shadow,0px 1px 3px 0px rgba(81,81,81,.75));--tw-shadow-colored:0px 1px 3px 0px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}sd-popup::part(arrow){--tw-shadow:var(--sd-shadow,0px 1px 3px 0px rgba(81,81,81,.75));--tw-shadow-colored:0px 1px 3px 0px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}sd-popup[placement^=top]::part(popup){transform-origin:bottom}sd-popup[placement^=bottom]::part(popup){transform-origin:top}#tooltip{max-width:var(--max-width)}::slotted([slot=content]){max-height:var(--auto-size-available-height)!important;max-width:var(--auto-size-available-width)!important;overflow:auto}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
+:host{--hide-delay:0ms;--show-delay:150ms;display:contents}sd-popup{--arrow-color:rgba(var(--sd-color-background-primary));--arrow-size:10px}sd-popup::part(popup){pointer-events:none;z-index:10;--tw-shadow:var(--sd-shadow);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}sd-popup::part(arrow){--tw-shadow:var(--sd-shadow, 0px 1px 3px 0px rgb(81 81 81 / 75%));--tw-shadow-colored:0px 1px 3px 0px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}sd-popup[placement^=top]::part(popup){transform-origin:bottom}sd-popup[placement^=bottom]::part(popup){transform-origin:top}#tooltip{max-width:var(--max-width)}::slotted([slot=content]){overflow:auto;max-width:var(--auto-size-available-width)!important;max-height:var(--auto-size-available-height)!important}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}`
 ];
 __decorateClass([
   query("slot:not([name])")

package/dist/chunks/{chunk.U3IJ4WDG.js → chunk.3WAKJXC7.js}

@@ -4,7 +4,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.XZHOUXTG.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -37,17 +37,18 @@ var SdTeaserMedia = class extends SolidElement {
     return html`<div class="relative flex flex-col group" part="base"><div class="absolute flex flex-col justify-end h-full w-full pb-4"><div class="${cx(
       "flex-1",
       this.variant === "gradient-light" && "bg-gradient-to-t from-white/[.8] to-60%",
-      this.variant === "gradient-dark" && "bg-gradient-to-t from-primary-800/[.6] to-60%"
-    )}"></div><div class="${cx(
+      this.variant === "gradient-dark" && "bg-gradient-to-t from-primary-800/[.8] to-60%"
+    )}"></div><div class="${cx("relative", ["primary", "gradient-dark"].includes(this.variant) && "text-white")}"><div class="${cx(
+      "absolute inset-0",
       {
         white: "bg-white/[.8] group-hover:bg-white/90",
         "neutral-100": "bg-neutral-100/[.8] group-hover:bg-neutral-100/90",
         primary: "bg-primary/[.8] text-white group-hover:bg-primary/90",
         "primary-100": "bg-primary-100/[.8] group-hover:bg-primary-100/90",
         "gradient-light": "bg-gradient-to-t from-white/90 to-white/[.8]",
-        "gradient-dark": "bg-gradient-to-t from-primary-800/75 to-primary-800/[.6]  text-white"
+        "gradient-dark": "bg-gradient-to-t from-primary-800/90 to-primary-800/[.8]"
       }[this.variant]
-    )}"><div class="flex-col text-left p-4" part="content"><div class="flex flex-col"><div part="headline" class="text-lg font-bold m-0 order-2"><slot name="headline">Always insert one semantically correct heading element here (e. g. &lt;h2>)</slot></div><div part="meta" class="${cx("gap-2 mb-4 order-1", !slots["teaser-has-meta"] && "hidden")}"><slot name="meta"></slot></div></div><div class="${cx(
+    )}"></div><div class="relative flex-col text-left p-4" part="content"><div class="flex flex-col"><div part="headline" class="text-lg font-bold m-0 order-2"><slot name="headline">Always insert one semantically correct heading element here (e. g. &lt;h2>)</slot></div><div part="meta" class="${cx("gap-2 mb-4 order-1", !slots["teaser-has-meta"] && "hidden")}"><slot name="meta"></slot></div></div><div class="${cx(
       "hidden",
       slots["teaser-has-expandable"] && "h-[0px] invisible opacity-0 md:[transition:_height_0.2s_linear,opacity_0.1s_linear_0.1s] md:block md:group-hover:h-auto md:group-hover:my-4 md:group-hover:opacity-[100%] md:group-hover:visible"
     )}" part="expandable" aria-hidden="true"><slot name="expandable"></slot></div><div part="main" class="${cx(!slots["teaser-has-default"] && "hidden")}"><slot></slot></div></div></div></div><div class="${cx("mb-4 -z-10", !slots["teaser-has-media"] && "hidden")}" part="media"><slot name="media"></slot></div></div>`;
@@ -55,7 +56,12 @@ var SdTeaserMedia = class extends SolidElement {
 };
 SdTeaserMedia.styles = [
   ...SolidElement.styles,
-  css`:host{display:block}::slotted(*){margin:var(--sd-spacing-0,0)}::slotted([slot=headline]){font-size:var(--sd-font-size-lg,1.25rem)!important;font-weight:700;margin:var(--sd-spacing-0,0)!important}:host([variant=white]) .background:focus-within{background-color:rgb(var(--sd-color-white,255 255 255)/var(--sd-opacity-90,.9))}:host([variant=neutral-100]) .background:focus-within{background-color:rgb(var(--sd-color-neutral-100,246 246 246)/var(--sd-opacity-90,.9))}:host([variant=primary]) .background:focus-within{background-color:rgb(var(--sd-color-primary,0 53 142)/var(--sd-opacity-90,.9))}:host([variant=primary-100]) .background:focus-within{background-color:rgb(var(--sd-color-primary-100,236 240 249)/var(--sd-opacity-90,.9))}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
+:host{display:block}::slotted(*){margin:calc(var(--sd-spacing-1) * 0)}:host([variant=white]) .background:focus-within{background-color:rgba(var(--sd-color-background-white))}@supports (color:color-mix(in lab,red,red)){:host([variant=white]) .background:focus-within{background-color:color-mix(in oklab,rgba(var(--sd-color-background-white)) var(--sd-opacity-90),transparent)}}:host([variant=neutral-100]) .background:focus-within{background-color:rgba(var(--sd-color-background-neutral-100))}@supports (color:color-mix(in lab,red,red)){:host([variant=neutral-100]) .background:focus-within{background-color:color-mix(in oklab,rgba(var(--sd-color-background-neutral-100)) var(--sd-opacity-90),transparent)}}:host([variant=primary]) .background:focus-within{background-color:rgba(var(--sd-color-background-primary))}@supports (color:color-mix(in lab,red,red)){:host([variant=primary]) .background:focus-within{background-color:color-mix(in oklab,rgba(var(--sd-color-background-primary)) var(--sd-opacity-90),transparent)}}:host([variant=primary-100]) .background:focus-within{background-color:rgba(var(--sd-color-background-primary-100))}@supports (color:color-mix(in lab,red,red)){:host([variant=primary-100]) .background:focus-within{background-color:color-mix(in oklab,rgba(var(--sd-color-background-primary-100)) var(--sd-opacity-90),transparent)}}:host([variant=gradient-light]) .bg-gradient-to-t{--sd-color-background-white:rgba(
+          var(--sd-informational-gradient--white-color-background, rgba(var(--sd-color-white)))
+        )}:host([variant=gradient-dark]) .bg-gradient-to-t{--sd-color-background-primary-800:rgba(
+          var(--sd-informational-gradient--primary-800-color-background, rgba(var(--sd-color-primary-800)))
+        )}`
 ];
 __decorateClass([
   property({ type: String, reflect: true })

package/dist/chunks/{chunk.W5ZR6XJP.js → chunk.45QURS66.js}

@@ -4,7 +4,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.XZHOUXTG.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -51,7 +51,7 @@ var SdLink = class extends SolidElement {
       "icon-right": this.hasSlotController.test("icon-right")
     };
     return html`<a part="base" class="${cx(
-      "inline",
+      this.standalone ? "flex items-start" : "inline",
       this.href && !this.visuallyDisabled ? "cursor-pointer" : "",
       this.visuallyDisabled ? "cursor-not-allowed focus-visible:focus-outline" : "",
       {
@@ -61,10 +61,9 @@ var SdLink = class extends SolidElement {
       }[this.size],
       {
         disabled: !this.inverted ? "text-neutral-500" : "text-neutral-600",
-        enabled: !this.inverted ? ` text-primary hover:text-primary-500 active:text-primary-800 focus-visible:focus-outline` : `text-white hover:text-primary-200 active:text-primary-400 focus-visible:focus-outline-inverted`,
+        enabled: !this.inverted ? ` text-primary hover:text-primary-500 active:interactive--active-color-text focus-visible:focus-outline` : `text-white hover:text-primary-200 active:text-primary-400 focus-visible:focus-outline-inverted`,
         visuallyDisabled: !this.inverted ? "text-neutral-500" : "text-neutral-600"
-      }[this.href && !this.visuallyDisabled ? "enabled" : this.visuallyDisabled ? "visuallyDisabled" : "disabled"],
-      this.standalone && "flex items-start"
+      }[this.href && !this.visuallyDisabled ? "enabled" : this.visuallyDisabled ? "visuallyDisabled" : "disabled"]
     )}" href="${ifDefined(this.href || void 0)}" target="${ifDefined(this.target || void 0)}" download="${ifDefined(this.download)}" rel="${ifDefined(this.target ? "noreferrer noopener" : void 0)}" aria-disabled="${!this.href || this.visuallyDisabled ? "true" : "false"}" tabindex="${!this.href ? "-1" : "0"}" @blur="${this.handleBlur}" @focus="${this.handleFocus}" @click="${this.handleClick}"><slot name="icon-left" part="icon-left" class="${cx(
       "inline",
       slots["icon-left"] && (!this.standalone ? "mr-[0.25em]" : {
@@ -84,7 +83,8 @@ var SdLink = class extends SolidElement {
 };
 SdLink.styles = [
   ...SolidElement.styles,
-  css`::slotted(sd-icon){font-size:1.25em;margin-bottom:-.25em}:host([size=sm][standalone]) ::slotted(sd-icon){font-size:var(--sd-font-size-base,1rem)}:host([size=lg][standalone]) ::slotted(sd-icon){font-size:var(--sd-font-size-xl,1.5rem)}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
+::slotted(sd-icon){font-size:1.25em;margin-bottom:-.25em}:host([size=sm][standalone]) ::slotted(sd-icon){font-size:var(--sd-text-base);line-height:var(--tw-leading,var(--text-base--line-height,calc(1.5 / 1)))}:host([size=lg][standalone]) ::slotted(sd-icon){font-size:var(--sd-text-xl);line-height:var(--tw-leading,var(--text-xl--line-height,calc(1.75 / 1.25)))}`
 ];
 __decorateClass([
   query("a")

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

@@ -1,7 +1,7 @@
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.XZHOUXTG.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.AXFVYO5L.js → chunk.4KJL7PWN.js}

@@ -11,7 +11,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.XZHOUXTG.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.PB672B5H.js → chunk.4ONB2X42.js}

@@ -7,7 +7,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.XZHOUXTG.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -146,7 +146,8 @@ var SdAnimation = class extends SolidElement {
 };
 SdAnimation.styles = [
   ...SolidElement.styles,
-  css`:host{display:contents}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
+:host{display:contents}`
 ];
 __decorateClass([
   queryAsync("slot")

package/dist/chunks/{chunk.72VNUTTV.js → chunk.5NGEWIDT.js}

@@ -1,7 +1,7 @@
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.XZHOUXTG.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -104,17 +104,7 @@ var SdBrandshape = class extends SolidElement {
   }
   render() {
     const isStylizedVariant = this.variant.startsWith("border-") || this.variant === "image";
-    return html`<div class="${cx(
-      {
-        "neutral-100": "fill-neutral-100",
-        primary: "fill-primary",
-        white: "fill-white",
-        "border-white": "fill-transparent",
-        "border-primary": "fill-transparent",
-        image: "fill-transparent"
-      }[this.variant],
-      "relative"
-    )}" part="base">${isStylizedVariant ? this.renderStylizedVariant() : ""} ${this.renderShapes()}</div>`;
+    return html`<div class="${cx(isStylizedVariant && "fill-transparent", "relative")}" part="base">${isStylizedVariant ? this.renderStylizedVariant() : ""} ${this.renderShapes()}</div>`;
   }
 };
 /**
@@ -122,7 +112,10 @@ var SdBrandshape = class extends SolidElement {
  */
 SdBrandshape.styles = [
   ...SolidElement.styles,
-  css`:host{container-type:inline-size;display:block;--angle:11deg;--radius:60px;--tan:tan(var(--angle));--adjacent:100cqw;--opposite:calc(var(--tan)*var(--adjacent));--curve:calc((var(--opposite) - (var(--radius)/3))*0.5)}@supports not (transform:skewY(11deg)){:host{--tan:0.1943803091}}@media (min-width:415px){:host{--radius:72px}}@media (min-width:640px){:host{--radius:84px}}:host([variant=image]) [part=stylized-container],:host([variant^=border-]) [part=stylized-container]:before{border-radius:0 var(--radius);height:calc(100% - var(--curve)*2);left:var(--sd-spacing-0,0);margin-top:calc(var(--curve));position:absolute;top:var(--sd-spacing-0,0);transform:skewY(calc(var(--angle)*-1))}slot[name=image]::slotted(img),slot[name=image]::slotted(video){height:calc(100% + var(--curve)*2)!important;-o-object-fit:cover;object-fit:cover;position:absolute!important;transform:translateY(calc(var(--curve)*-1)) skewY(var(--angle));width:100%}@supports not (height:100cqw){:host([variant=image]) [part=stylized-container],:host([variant^=border-]) [part=stylized-container]:before{height:100%;margin-top:0;transform:unset}slot[name=image]::slotted(img),slot[name=image]::slotted(video){height:100%!important;transform:unset}}:host([variant=border-primary]){--internal-border-color:rgb(var(--sd-color-primary,0 53 142))}:host([variant=border-white]){--internal-border-color:var(--sd-color-white,#fff)}:host([variant^=border-]) [part=stylized-container]:before{border-color:var(--internal-border-color,#000);border-style:solid;border-width:2px;content:"";right:var(--sd-spacing-0,0)}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
+:host{display:block;container-type:inline-size;--angle:11deg;--radius:60px;--tan:tan(var(--angle));--adjacent:100cqw;--opposite:calc(var(--tan) * var(--adjacent));--curve:calc(
+          (var(--opposite) - (var(--radius) / 3)) * 0.5
+        )}@supports not (transform:skewY(11deg)){:host{--tan:0.1943803091}}@media (min-width:415px){:host{--radius:72px}}@media (min-width:640px){:host{--radius:84px}}:host([variant=image]) [part=stylized-container],:host([variant^=border-]) [part=stylized-container]::before{position:absolute;top:calc(var(--sd-spacing-1) * 0);left:calc(var(--sd-spacing-1) * 0);transform:skewY(calc(var(--angle) * -1));height:calc(100% - var(--curve) * 2);border-radius:0 var(--radius);margin-top:calc(var(--curve))}slot[name=image]::slotted(img),slot[name=image]::slotted(video){width:100%;-o-object-fit:cover;object-fit:cover;transform:translateY(calc(var(--curve) * -1)) skewY(var(--angle));height:calc(100% + var(--curve) * 2)!important;position:absolute!important}@supports not (height:100cqw){:host([variant=image]) [part=stylized-container],:host([variant^=border-]) [part=stylized-container]::before{transform:unset;height:100%;margin-top:0}slot[name=image]::slotted(img),slot[name=image]::slotted(video){transform:unset;height:100%!important}}:host([variant=border-primary]){--internal-border-color:rgba(var(--sd-color-border-primary, rgba(var(--sd-color-primary))))}:host([variant=border-white]){--internal-border-color:rgba(var(--sd-color-border-white, rgba(var(--sd-color-white))))}:host([variant^=border-]) [part=stylized-container]::before{right:calc(var(--sd-spacing-1) * 0);border-style:var(--tw-border-style);border-width:var(--sd-border-width-2);--tw-border-style:solid;border-style:solid;content:'';border-color:var(--internal-border-color,#000)}:host([variant=neutral-100]) [part=base]{fill:rgba(var(--sd-color-background-neutral-100,rgba(var(--sd-color-neutral-100))))}:host([variant=white]) [part=base]{fill:rgba(var(--sd-color-background-white,rgba(var(--sd-color-white))))}:host([variant=primary]) [part=base]{fill:rgba(var(--sd-color-background-primary,rgba(var(--sd-color-primary))))}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}`
 ];
 __decorateClass([
   query("[part=base]")

package/dist/chunks/{chunk.LLUTMJ6Y.js → chunk.6NX4UFZ2.js}

@@ -26,7 +26,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.XZHOUXTG.js";
 import {
   animateTo,
   stopAnimations
@@ -598,13 +598,13 @@ var SdSelect = class extends SolidElement {
       {
         disabled: "border-neutral-500",
         visuallyDisabled: "border-neutral-500",
-        readonly: "border-neutral-800",
+        readonly: "form-control-color-border",
         activeInvalid: "border-error border-2",
         activeValid: "border-success border-2",
         active: "border-primary border-2",
         invalid: "border-error",
         valid: "border-success",
-        default: "border-neutral-800"
+        default: "form-control-color-border"
       }[selectState],
       this.open && (this.currentPlacement === "bottom" ? "rounded-bl-none rounded-br-none" : "rounded-tl-none rounded-tr-none")
     )}"></div><sd-popup @sd-current-placement="${this.handleCurrentPlacement}" class="${cx(
@@ -623,7 +623,7 @@ var SdSelect = class extends SolidElement {
         lg: "py-2"
       }[this.size]
     )}"><input name="${this.name}" form="${this.form}" part="display-input" class="${cx(
-      "top-0 left-0 appearance-none outline-none flex-grow bg-transparent flex-1 placeholder-neutral-700",
+      "top-0 left-0 appearance-none outline-none flex-grow bg-transparent flex-1 placeholder:text-neutral-700",
       cursorStyles,
       this.multiple && this.useTags && this.value.length > 0 ? "hidden" : ""
     )}" type="text" .disabled="${this.disabled}" placeholder="${this.placeholder || this.localize.term("selectDefaultPlaceholder")}" .value="${this.displayLabel}" autocomplete="off" spellcheck="false" autocapitalize="off" readonly="readonly" aria-controls="listbox" aria-expanded="${this.open ? "true" : "false"}" aria-haspopup="listbox" aria-labelledby="label" aria-disabled="${this.disabled || this.visuallyDisabled ? "true" : "false"}" aria-invalid="${this.showInvalidStyle}" aria-describedby="help-text invalid-message" role="combobox" tabindex="-1"> ${this.multiple && this.useTags ? html`<div part="tags" class="flex-grow flex flex-wrap items-center gap-1">${this.tags}</div>` : ""}<div aria-live="polite" id="control-value" class="absolute top-0 left-0 opacity-0 -z-10">${this.selectedOptions.map((option) => option == null ? void 0 : option.getTextLabel()).join(", ")}</div><input class="${cx("value-input absolute top-0 left-0 w-full h-full opacity-0 -z-10", cursorStyles)}" type="text" ?disabled="${this.disabled}" ?required="${this.required}" .value="${Array.isArray(this.value) ? this.value.join(", ") : this.value}" tabindex="-1" aria-controls="control-value" aria-hidden="true" @focus="${() => this.focus()}" @invalid="${this.handleInvalid}"> ${hasClearIcon ? html`<button part="clear-button" class="${cx(
@@ -656,7 +656,8 @@ var SdSelect = class extends SolidElement {
  */
 SdSelect.styles = [
   ...SolidElement.styles,
-  css`:host{display:block;position:relative;width:var(--sd-spacing-auto,auto)}:host([required]) #label:after{content:" *"}:host([disabled]) ::-moz-placeholder,:host([visually-disabled]) ::-moz-placeholder{--tw-text-opacity:1;color:rgb(var(--sd-color-neutral-500,174 174 174)/var(--tw-text-opacity,1))}:host([disabled]) ::placeholder,:host([visually-disabled]) ::placeholder{--tw-text-opacity:1;color:rgb(var(--sd-color-neutral-500,174 174 174)/var(--tw-text-opacity,1))}[part=listbox]{max-height:var(--auto-size-available-height,auto)}.input-container,[part=combobox]{grid-column:1/1;grid-row:1/1}sd-popup::part(popup){z-index:var(--sd-z-index-dropdown,900)}sd-tag::part(base){border-radius:var(--sd-border-radius-default,.25rem);padding-left:var(--sd-spacing-1,.25rem);padding-right:var(--sd-spacing-1,.25rem)}sd-tag::part(content){display:inline-block;max-width:var(--tag-max-width,15ch);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}sd-tag[size=lg]::part(base){padding-left:var(--sd-spacing-2,.5rem);padding-right:var(--sd-spacing-2,.5rem)}sd-tag[disabled=false]::part(base):hover{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-primary-100,236 240 249)/var(--tw-bg-opacity,1))}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
+:host{position:relative;display:block;width:auto}:host([required]) #label::after{content:' *'}:host([disabled]) ::-moz-placeholder,:host([visually-disabled]) ::-moz-placeholder{color:rgba(var(--sd-color-text-neutral-500))}:host([disabled]) ::placeholder,:host([visually-disabled]) ::placeholder{color:rgba(var(--sd-color-text-neutral-500))}[part=listbox]{max-height:var(--auto-size-available-height,auto)}.input-container,[part=combobox]{grid-column:1/1;grid-row:1/1}sd-popup::part(popup){z-index:var(--sd-z-index-dropdown,900)}sd-tag::part(base){border-radius:var(--sd-radius);padding-inline:var(--sd-spacing-1)}sd-tag::part(content){display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:var(--tag-max-width,15ch)}sd-tag[size=lg]::part(base){padding-inline:var(--sd-spacing-2)}sd-tag[disabled=false]::part(base):hover{background-color:rgba(var(--sd-color-background-primary-100))}`
 ];
 __decorateClass([
   queryAssignedElements({ selector: "sd-option" })

package/dist/chunks/{chunk.G3JK5J7P.js → chunk.7AKNXMU5.js}

@@ -1,7 +1,7 @@
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.XZHOUXTG.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 })