@sbb-esta/lyne-elements-dev 4.0.0-dev.1776072012 → 4.0.0-dev.1776087061

package/development/form-field.js

@@ -1,5 +1,5 @@
 import { t as SbbErrorElement } from "./error.component-C8JQQqSB.js";
-import { n as SbbFormFieldElement, t as SbbFormFieldControlEvent } from "./form-field.component-zroo5xjC.js";
+import { n as SbbFormFieldElement, t as SbbFormFieldControlEvent } from "./form-field.component-DGOrnYkc.js";
 import { SbbFormFieldClearElement } from "./form-field/form-field-clear/form-field-clear.component.js";
 import { SbbFormFieldTextCounterElement } from "./form-field/form-field-text-counter/form-field-text-counter.component.js";
 import { t as SbbHintElement } from "./hint.component-hKw1TLvO.js";

package/development/form-field.pure.js

@@ -1,5 +1,5 @@
 import { t as SbbErrorElement } from "./error.component-C8JQQqSB.js";
-import { n as SbbFormFieldElement, t as SbbFormFieldControlEvent } from "./form-field.component-zroo5xjC.js";
+import { n as SbbFormFieldElement, t as SbbFormFieldControlEvent } from "./form-field.component-DGOrnYkc.js";
 import { SbbFormFieldClearElement } from "./form-field/form-field-clear/form-field-clear.component.js";
 import { SbbFormFieldTextCounterElement } from "./form-field/form-field-text-counter/form-field-text-counter.component.js";
 import { t as SbbHintElement } from "./hint.component-hKw1TLvO.js";

package/form-field/form-field/form-field.component.js

@@ -1,2 +1,2 @@
-import { n as e, t } from "../../form-field.component-BDTzaGuP.js";
+import { n as e, t } from "../../form-field.component-Do5eratI.js";
 export { t as SbbFormFieldControlEvent, e as SbbFormFieldElement };

package/{form-field.component-BDTzaGuP.js → form-field.component-Do5eratI.js}

@@ -1,10 +1,10 @@
 import { __esDecorate as e, __runInitializers as t } from "tslib";
-import { html as n, isServer as r, nothing as i, unsafeCSS as a } from "lit";
-import { property as o, state as s } from "lit/decorators.js";
-import { SbbElement as c, SbbLanguageController as l, SbbNegativeMixin as u, appendAriaElements as d, boxSizingStyles as f, forceType as p, i18nOptional as m, isLean as ee, removeAriaElements as h, sbbInputModalityDetector as g } from "./core.js";
+import { html as n, isServer as r, nothing as i, unsafeCSS as ee } from "lit";
+import { property as a, state as o } from "lit/decorators.js";
+import { SbbElement as s, SbbLanguageController as c, SbbNegativeMixin as l, appendAriaElements as u, boxSizingStyles as d, forceType as f, i18nOptional as p, isLean as m, removeAriaElements as h, sbbInputModalityDetector as g } from "./core.js";
 import { SbbIconElement as te } from "./icon.pure.js";
 //#region src/elements/form-field/form-field/form-field.scss?inline
-var ne = "@charset \"UTF-8\";:host{--sbb-form-field-hint-divider-width: var(--sbb-spacing-fixed-1x);--sbb-form-field-hint-padding-block-start: var(--sbb-form-field-hint-divider-width);--sbb-form-field-select-inline-padding-end: calc( var(--sbb-icon-svg-width) + var(--sbb-form-field-gap) );--sbb-form-field-label-size: calc( var(--sbb-form-field-label-text-size) * var(--sbb-typo-line-height-text) );--sbb-form-field-text-line-height: calc( var(--sbb-form-field-input-text-size) * var(--sbb-typo-line-height-text) );--sbb-form-field-margin-block-start: calc( ( var(--sbb-form-field-min-height) - var(--sbb-form-field-label-size) - var( --sbb-form-field-text-line-height ) + var(--_sbb-form-field-label-to-input-overlapping) ) / 2 );--sbb-icon-svg-width: var(--sbb-form-field-icon-size);--sbb-icon-svg-height: var(--sbb-form-field-icon-size);--sbb-focus-outline-color: var(--sbb-focus-outline-color-default);--sbb-focus-outline-color: light-dark( var(--sbb-focus-outline-color-default), var(--sbb-focus-outline-color-dark) );display:inline-block;color:var(--sbb-form-field-color);font-weight:400}:host(:where(:not([width=collapse]))){min-width:9.375rem;width:min(18.75rem,100%)}:host([negative]){color:var(--sbb-color-3-negative);--sbb-form-field-background-color: var(--sbb-background-color-1-negative);--sbb-form-field-border-color: var(--sbb-border-color-5);--sbb-form-field-label-color: var(--sbb-color-5);--sbb-form-field-prefix-color: var(--sbb-color-5);--sbb-form-field-text-color: var(--sbb-color-3-negative);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);--sbb-form-field-arrow-color: var(--sbb-color-3-negative)}@media(forced-colors:active){:host([negative]){--sbb-form-field-border-color: ButtonBorder}}:host([size=s]){--sbb-form-field-min-height: var(--sbb-size-element-xs);--sbb-form-field-padding-inline: var(--sbb-spacing-fixed-2x);--sbb-form-field-input-text-size: var(--sbb-text-font-size-s);--sbb-form-field-label-text-size: var(--sbb-text-font-size-xxs);--_sbb-form-field-label-to-input-overlapping: .625rem;--_sbb-form-field-floating-label-transform: .34375rem;--_sbb-form-field-spacer-margin-block-end: -.53125rem}@media(min-width:64rem){:host([size=s]){--_sbb-form-field-label-to-input-overlapping: .6875rem;--_sbb-form-field-floating-label-transform: .3125rem;--_sbb-form-field-spacer-margin-block-end: -.5rem}}:host([size=m]){--sbb-form-field-min-height: var(--sbb-size-element-m);--sbb-form-field-padding-inline: var(--sbb-spacing-fixed-3x);--sbb-form-field-input-text-size: var(--sbb-text-font-size-m);--sbb-form-field-label-text-size: var(--sbb-text-font-size-xs);--_sbb-form-field-label-to-input-overlapping: var(--sbb-spacing-fixed-1x);--_sbb-form-field-floating-label-transform: .53125rem;--_sbb-form-field-spacer-margin-block-end: calc( -1 * var(--_sbb-form-field-label-to-input-overlapping) )}@media(min-width:64rem){:host([size=m]){--_sbb-form-field-floating-label-transform: .65625rem}}:host([size=l]){--sbb-form-field-min-height: var(--sbb-size-element-l);--sbb-form-field-padding-inline: var(--sbb-spacing-responsive-xxxs)}:host([error-space=reserve]){--sbb-form-field-hint-min-height: calc( var(--sbb-typo-line-height-text) * var(--sbb-text-font-size-xs) );--sbb-form-field-hint-padding-block-start-override: var(--sbb-form-field-hint-divider-width)}:host(:where(:is(:state(readonly),[state--readonly]),:is(:state(disabled),[state--disabled]))){--sbb-form-field-background-color: var(--sbb-background-color-3);--sbb-form-field-border-color: var(--sbb-color-graphite);--sbb-form-field-border-color: light-dark(var(--sbb-color-graphite), var(--sbb-color-smoke));--sbb-form-field-arrow-color: var(--sbb-color-granite);--sbb-form-field-arrow-color: light-dark(var(--sbb-color-granite), var(--sbb-color-storm))}@media(forced-colors:active){:host(:where(:is(:state(readonly),[state--readonly]),:is(:state(disabled),[state--disabled]))){--sbb-form-field-border-color: ButtonBorder}}:host(:where(:is(:state(readonly),[state--readonly]),:is(:state(disabled),[state--disabled]))[negative]){--sbb-form-field-background-color: var(--sbb-background-color-3-negative);--sbb-form-field-border-color: var(--sbb-border-color-5);--sbb-form-field-arrow-color: var(--sbb-border-color-5)}:host(:where(:is(:state(disabled),[state--disabled]))){--sbb-form-field-label-color: var(--sbb-color-granite);--sbb-form-field-label-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));--sbb-form-field-prefix-color: var(--sbb-color-granite);--sbb-form-field-prefix-color: light-dark(var(--sbb-color-granite), var(--sbb-color-storm));--sbb-form-field-border-style: dashed}@media(forced-colors:active){:host(:where(:is(:state(disabled),[state--disabled]))){--sbb-form-field-label-color: GrayText !important;--sbb-form-field-prefix-color: GrayText !important;--sbb-form-field-text-color: GrayText !important;--sbb-form-field-border-color: GrayText !important}}:host(:where(:is(:state(disabled),[state--disabled]))[negative]){--sbb-form-field-text-color: var(--sbb-color-5);--sbb-form-field-label-color: var(--sbb-color-5);--sbb-form-field-prefix-color: var(--sbb-color-5)}:host(:where(:is(:state(readonly),[state--readonly])):not([negative])){--sbb-form-field-label-color: var(--sbb-color-granite);--sbb-form-field-label-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));--sbb-form-field-prefix-color: var(--sbb-color-granite);--sbb-form-field-prefix-color: light-dark(var(--sbb-color-granite), var(--sbb-color-storm))}:host(:where(:is(:state(focus),[state--focus]))){--sbb-form-field-border-color: var(--sbb-border-color-3);--sbb-form-field-prefix-color: var(--sbb-color-3);--sbb-form-field-border-width: var(--sbb-border-width-2x)}:host(:where(:is(:state(focus),[state--focus]))[negative]){--sbb-form-field-border-color: var(--sbb-border-color-3-negative);--sbb-form-field-prefix-color: var(--sbb-color-3-negative)}@media(forced-colors:active){:host(:is(:state(focus),[state--focus])){--sbb-form-field-border-color: Highlight;--sbb-form-field-prefix-color: Highlight}}:host(:not(:where(:is(:state(has-error),[state--has-error]),:is(:state(has-hint),[state--has-hint])))){--sbb-form-field-hint-padding-block-start: 0}:host([floating-label]){--sbb-select-placeholder-color: transparent}@media(forced-colors:active){:host([floating-label]){--sbb-select-placeholder-color: Canvas}}:host(:is(:not(:is(:state(slotted-label),[state--slotted-label])),[hidden-label])){--sbb-form-field-label-size: 0rem;--_sbb-form-field-label-to-input-overlapping: 0rem}:host(:where(:is(:state(input-type-sbb-slider),[state--input-type-sbb-slider]))){--sbb-form-field-overflow: visible}.sbb-form-field__space-wrapper{display:flex;flex-direction:column;height:100%}.sbb-form-field__space-wrapper:before{content:\"​\";-webkit-user-select:none;user-select:none;width:0;height:0}.sbb-form-field__wrapper{display:flex;flex:1;gap:var(--sbb-form-field-gap);padding-inline:var(--sbb-form-field-padding-inline);border-radius:var(--sbb-form-field-border-radius);min-height:var(--sbb-form-field-min-height);max-height:var(--sbb-form-field-max-height);background-color:var(--sbb-form-field-background-color);position:relative}.sbb-form-field__wrapper:before{content:\"\";display:block;position:absolute;inset:0;border:var(--sbb-form-field-border-width) var(--sbb-form-field-border-style) var(--sbb-form-field-border-color);border-radius:var(--sbb-form-field-border-radius);pointer-events:none}:host(:where(:is(:state(focus),[state--focus]):is(:state(focus-origin-keyboard),[state--focus-origin-keyboard]))) .sbb-form-field__wrapper{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);outline-offset:var(--sbb-form-field-outline-offset, var(--sbb-focus-outline-offset))}@media(forced-colors:none){:host(:is([borderless],:is(:state(input-type-sbb-slider),[state--input-type-sbb-slider]))) .sbb-form-field__wrapper:before{border-color:transparent}:host(:where(:is(:state(focus),[state--focus]),:is(:state(disabled),[state--disabled]))[borderless]) .sbb-form-field__wrapper:after{content:\"\";position:absolute;border-block-end:var(--sbb-border-width-1x) var(--sbb-form-field-border-style) var(--sbb-form-field-border-color);inset-inline:var(--sbb-form-field-padding-inline);inset-block-end:0;z-index:var(--sbb-form-field-focus-underline-z-index, initial)}}::slotted(*[slot=prefix]){color:var(--sbb-form-field-prefix-color)}::slotted(*[slot=prefix]),::slotted(*[slot=suffix]){display:flex;min-width:var(--sbb-icon-svg-width);margin-block-start:calc((var(--sbb-form-field-min-height) - var(--sbb-size-icon-ui-small)) / 2)}:host(:where(:is(:state(empty),[state--empty]),:is(:state(disabled),[state--disabled]),:is(:state(readonly),[state--readonly]))) ::slotted(sbb-form-field-clear){display:none}:host(:is(:state(has-error),[state--has-error])) slot[name=hint]{display:none}:host(:where(:is(:state(disabled),[state--disabled]),:is(:state(readonly),[state--readonly]))) ::slotted(sbb-form-field-text-counter){display:none}::slotted(sbb-datepicker-toggle){padding-block-end:calc((var(--sbb-form-field-min-height) - var(--sbb-size-icon-ui-small)) / 2)}@media(forced-colors:active){::slotted(*[slot=suffix]){color:var(--sbb-form-field-prefix-color)}}.sbb-form-field__select-input-icon{top:50%;transform:translateY(-50%);position:absolute;inset-inline-end:0;margin-block-start:calc(-1 * var(--sbb-form-field-margin-block-start) / 2);pointer-events:none;color:var(--sbb-form-field-arrow-color)}.sbb-form-field__input-container{display:flex;flex-direction:column;flex:1 1 auto;position:relative;margin-block-start:var(--sbb-form-field-margin-block-start);min-width:0}.sbb-form-field__label-spacer{display:flex;height:calc(var(--sbb-form-field-label-text-size) * var(--sbb-typo-line-height-text));margin-block-end:var(--_sbb-form-field-spacer-margin-block-end)}:host(:not(:is(:state(slotted-label),[state--slotted-label]))) :is(.sbb-form-field__label,.sbb-form-field__label-spacer){display:none}:host([hidden-label]) :is(.sbb-form-field__label,.sbb-form-field__label-spacer){border:0;clip-path:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.sbb-form-field__label{display:flex;max-width:100%;cursor:var(--sbb-cursor-default);position:absolute;inset-block-start:0;color:var(--sbb-form-field-label-color);font-size:var(--sbb-form-field-label-text-size);letter-spacing:var(--sbb-typo-letter-spacing-text)}:host(:where(:is(:state(input-type-select),[state--input-type-select]),:is(:state(input-type-sbb-select),[state--input-type-sbb-select]))) .sbb-form-field__label{padding-inline-end:var(--sbb-form-field-select-inline-padding-end)}:host([floating-label]) .sbb-form-field__label{transform-origin:0 0;pointer-events:none;backface-visibility:hidden;will-change:transform,font-size;transition-duration:var(--sbb-disable-animation-duration, var(--sbb-animation-duration-2x));transition-timing-function:var(--sbb-animation-easing);transition-property:transform,font-size}:host([floating-label]:is(:not(:where(:is(:state(focus),[state--focus])):not(:where(:is(:state(input-type-sbb-select),[state--input-type-sbb-select]))),:where(:is(:state(has-popup-open),[state--has-popup-open]))),:where(:is(:state(readonly),[state--readonly]))):where(:is(:state(empty),[state--empty]))) .sbb-form-field__label{font-size:var(--sbb-form-field-input-text-size);transform:translateY(var(--_sbb-form-field-floating-label-transform))}@media(forced-colors:active){:host(:where(:is(:state(input-type-textarea),[state--input-type-textarea]))) .sbb-form-field__label{z-index:1}}.sbb-form-field__label-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.sbb-form-field__input{display:flex;flex:1;align-items:start}:host([size=s]:is(:is(:state(input-type-input),[state--input-type-input]),:is(:state(input-type-select),[state--input-type-select]),:is(:state(input-type-sbb-select),[state--input-type-sbb-select]),:is(:state(input-type-sbb-date-input),[state--input-type-sbb-date-input]),:is(:state(input-type-sbb-time-input),[state--input-type-sbb-time-input]))) .sbb-form-field__input{margin-block-end:-.125rem}.sbb-form-field__hint{display:flex;min-height:var(--sbb-form-field-hint-min-height);flex-direction:column;margin-block-start:var(--sbb-form-field-hint-padding-block-start-override, var(--sbb-form-field-hint-padding-block-start))}", _ = 0, v = /* @__PURE__ */ new WeakMap(), y = [
+var ne = "@charset \"UTF-8\";:host{--sbb-form-field-hint-divider-width: var(--sbb-spacing-fixed-1x);--sbb-form-field-hint-padding-block-start: var(--sbb-form-field-hint-divider-width);--sbb-form-field-select-inline-padding-end: calc( var(--sbb-icon-svg-width) + var(--sbb-form-field-gap) );--sbb-form-field-label-size: calc( var(--sbb-form-field-label-text-size) * var(--sbb-typo-line-height-text) );--sbb-form-field-text-line-height: calc( var(--sbb-form-field-input-text-size) * var(--sbb-typo-line-height-text) );--sbb-form-field-margin-block-start: calc( ( var(--sbb-form-field-min-height) - var(--sbb-form-field-label-size) - var( --sbb-form-field-text-line-height ) + var(--_sbb-form-field-label-to-input-overlapping) ) / 2 );--sbb-icon-svg-width: var(--sbb-form-field-icon-size);--sbb-icon-svg-height: var(--sbb-form-field-icon-size);--sbb-focus-outline-color: var(--sbb-focus-outline-color-default);--sbb-focus-outline-color: light-dark( var(--sbb-focus-outline-color-default), var(--sbb-focus-outline-color-dark) );display:inline-block;color:var(--sbb-form-field-color);font-weight:400}:host(:where(:not([width=collapse]))){min-width:9.375rem;width:min(18.75rem,100%)}:host([negative]){color:var(--sbb-color-3-negative);--sbb-form-field-background-color: var(--sbb-background-color-1-negative);--sbb-form-field-border-color: var(--sbb-border-color-5);--sbb-form-field-label-color: var(--sbb-color-5);--sbb-form-field-prefix-color: var(--sbb-color-5);--sbb-form-field-text-color: var(--sbb-color-3-negative);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);--sbb-form-field-arrow-color: var(--sbb-color-3-negative)}@media(forced-colors:active){:host([negative]){--sbb-form-field-border-color: ButtonBorder}}:host([size=s]){--sbb-form-field-min-height: var(--sbb-size-element-xs);--sbb-form-field-padding-inline: var(--sbb-spacing-fixed-2x);--sbb-form-field-input-text-size: var(--sbb-text-font-size-s);--sbb-form-field-label-text-size: var(--sbb-text-font-size-xxs);--_sbb-form-field-label-to-input-overlapping: .625rem;--_sbb-form-field-floating-label-transform: .34375rem;--_sbb-form-field-spacer-margin-block-end: -.53125rem}@media(min-width:64rem){:host([size=s]){--_sbb-form-field-label-to-input-overlapping: .6875rem;--_sbb-form-field-floating-label-transform: .3125rem;--_sbb-form-field-spacer-margin-block-end: -.5rem}}:host([size=m]){--sbb-form-field-min-height: var(--sbb-size-element-m);--sbb-form-field-padding-inline: var(--sbb-spacing-fixed-3x);--sbb-form-field-input-text-size: var(--sbb-text-font-size-m);--sbb-form-field-label-text-size: var(--sbb-text-font-size-xs);--_sbb-form-field-label-to-input-overlapping: var(--sbb-spacing-fixed-1x);--_sbb-form-field-floating-label-transform: .53125rem;--_sbb-form-field-spacer-margin-block-end: calc( -1 * var(--_sbb-form-field-label-to-input-overlapping) )}@media(min-width:64rem){:host([size=m]){--_sbb-form-field-floating-label-transform: .65625rem}}:host([size=l]){--sbb-form-field-min-height: var(--sbb-size-element-l);--sbb-form-field-padding-inline: var(--sbb-spacing-responsive-xxxs)}:host([error-space=reserve]){--sbb-form-field-hint-min-height: calc( var(--sbb-typo-line-height-text) * var(--sbb-text-font-size-xs) );--sbb-form-field-hint-padding-block-start-override: var(--sbb-form-field-hint-divider-width)}:host(:where(:is(:state(readonly),[state--readonly]),:is(:state(disabled),[state--disabled]))){--sbb-form-field-background-color: var(--sbb-background-color-3);--sbb-form-field-border-color: var(--sbb-color-graphite);--sbb-form-field-border-color: light-dark(var(--sbb-color-graphite), var(--sbb-color-smoke));--sbb-form-field-arrow-color: var(--sbb-color-granite);--sbb-form-field-arrow-color: light-dark(var(--sbb-color-granite), var(--sbb-color-storm))}@media(forced-colors:active){:host(:where(:is(:state(readonly),[state--readonly]),:is(:state(disabled),[state--disabled]))){--sbb-form-field-border-color: ButtonBorder}}:host(:where(:is(:state(readonly),[state--readonly]),:is(:state(disabled),[state--disabled]))[negative]){--sbb-form-field-background-color: var(--sbb-background-color-3-negative);--sbb-form-field-border-color: var(--sbb-border-color-5);--sbb-form-field-arrow-color: var(--sbb-border-color-5)}:host(:where(:is(:state(disabled),[state--disabled]))){--sbb-form-field-label-color: var(--sbb-color-granite);--sbb-form-field-label-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));--sbb-form-field-prefix-color: var(--sbb-color-granite);--sbb-form-field-prefix-color: light-dark(var(--sbb-color-granite), var(--sbb-color-storm));--sbb-form-field-border-style: dashed}@media(forced-colors:active){:host(:where(:is(:state(disabled),[state--disabled]))){--sbb-form-field-label-color: GrayText !important;--sbb-form-field-prefix-color: GrayText !important;--sbb-form-field-text-color: GrayText !important;--sbb-form-field-border-color: GrayText !important}}:host(:where(:is(:state(disabled),[state--disabled]))[negative]){--sbb-form-field-text-color: var(--sbb-color-5);--sbb-form-field-label-color: var(--sbb-color-5);--sbb-form-field-prefix-color: var(--sbb-color-5)}:host(:where(:is(:state(readonly),[state--readonly])):not([negative])){--sbb-form-field-label-color: var(--sbb-color-granite);--sbb-form-field-label-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));--sbb-form-field-prefix-color: var(--sbb-color-granite);--sbb-form-field-prefix-color: light-dark(var(--sbb-color-granite), var(--sbb-color-storm))}:host(:where(:is(:state(focus),[state--focus]))){--sbb-form-field-border-color: var(--sbb-border-color-3);--sbb-form-field-prefix-color: var(--sbb-color-3);--sbb-form-field-border-width: var(--sbb-border-width-2x)}:host(:where(:is(:state(focus),[state--focus]))[negative]){--sbb-form-field-border-color: var(--sbb-border-color-3-negative);--sbb-form-field-prefix-color: var(--sbb-color-3-negative)}@media(forced-colors:active){:host(:is(:state(focus),[state--focus])){--sbb-form-field-border-color: Highlight;--sbb-form-field-prefix-color: Highlight}}:host(:not(:where(:is(:state(has-error),[state--has-error]),:is(:state(has-hint),[state--has-hint])))){--sbb-form-field-hint-padding-block-start: 0}:host([floating-label]){--sbb-select-placeholder-color: transparent}@media(forced-colors:active){:host([floating-label]){--sbb-select-placeholder-color: Canvas}}:host(:is(:not(:is(:state(slotted-label),[state--slotted-label])),[hidden-label])){--sbb-form-field-label-size: 0rem;--_sbb-form-field-label-to-input-overlapping: 0rem}:host(:where(:is(:state(input-type-sbb-slider),[state--input-type-sbb-slider]))){--sbb-form-field-overflow: visible}.sbb-form-field__space-wrapper{display:flex;flex-direction:column;height:100%}.sbb-form-field__space-wrapper:before{content:\"​\";-webkit-user-select:none;user-select:none;width:0;height:0}.sbb-form-field__wrapper{display:flex;flex:1;gap:var(--sbb-form-field-gap);padding-inline:var(--sbb-form-field-padding-inline);border-radius:var(--sbb-form-field-border-radius);min-height:var(--sbb-form-field-min-height);max-height:var(--sbb-form-field-max-height);background-color:var(--sbb-form-field-background-color);position:relative}.sbb-form-field__wrapper:before{content:\"\";display:block;position:absolute;inset:0;border:var(--sbb-form-field-border-width) var(--sbb-form-field-border-style) var(--sbb-form-field-border-color);border-radius:var(--sbb-form-field-border-radius);pointer-events:none}:host(:where(:is(:state(focus),[state--focus]):is(:state(focus-origin-keyboard),[state--focus-origin-keyboard]))) .sbb-form-field__wrapper{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);outline-offset:var(--sbb-form-field-outline-offset, var(--sbb-focus-outline-offset))}@media(forced-colors:none){:host(:is([borderless],:is(:state(input-type-sbb-slider),[state--input-type-sbb-slider]))) .sbb-form-field__wrapper:before{border-color:transparent}:host(:where(:is(:state(focus),[state--focus]),:is(:state(disabled),[state--disabled]))[borderless]) .sbb-form-field__wrapper:after{content:\"\";position:absolute;border-block-end:var(--sbb-border-width-1x) var(--sbb-form-field-border-style) var(--sbb-form-field-border-color);inset-inline:var(--sbb-form-field-padding-inline);inset-block-end:0;z-index:var(--sbb-form-field-focus-underline-z-index, initial)}}::slotted(*[slot=prefix]){color:var(--sbb-form-field-prefix-color)}::slotted(*[slot=prefix]),::slotted(*[slot=suffix]){display:flex;min-width:var(--sbb-icon-svg-width);margin-block-start:calc((var(--sbb-form-field-min-height) - var(--sbb-size-icon-ui-small)) / 2)}:host(:where(:is(:state(empty),[state--empty]),:is(:state(disabled),[state--disabled]),:is(:state(readonly),[state--readonly]))) ::slotted(sbb-form-field-clear){display:none}:host(:is(:state(has-error),[state--has-error])) slot[name=hint]{display:none}:host(:where(:is(:state(disabled),[state--disabled]),:is(:state(readonly),[state--readonly]))) ::slotted(sbb-form-field-text-counter){display:none}::slotted(sbb-datepicker-toggle){padding-block-end:calc((var(--sbb-form-field-min-height) - var(--sbb-size-icon-ui-small)) / 2)}@media(forced-colors:active){::slotted(*[slot=suffix]){color:var(--sbb-form-field-prefix-color)}}.sbb-form-field__select-input-icon{top:50%;transform:translateY(-50%);display:none;position:absolute;inset-inline-end:0;margin-block-start:calc(-1 * var(--sbb-form-field-margin-block-start) / 2);pointer-events:none;color:var(--sbb-form-field-arrow-color)}:host(:is(:is(:state(input-type-select),[state--input-type-select]),:is(:state(input-type-sbb-select),[state--input-type-sbb-select]),:is(:state(explicit-input-type-select),[state--explicit-input-type-select]))) .sbb-form-field__select-input-icon{display:inline-block}.sbb-form-field__input-container{display:flex;flex-direction:column;flex:1 1 auto;position:relative;margin-block-start:var(--sbb-form-field-margin-block-start);min-width:0}.sbb-form-field__label-spacer{display:flex;height:calc(var(--sbb-form-field-label-text-size) * var(--sbb-typo-line-height-text));margin-block-end:var(--_sbb-form-field-spacer-margin-block-end)}:host(:not(:is(:state(slotted-label),[state--slotted-label]))) :is(.sbb-form-field__label,.sbb-form-field__label-spacer){display:none}:host([hidden-label]) :is(.sbb-form-field__label,.sbb-form-field__label-spacer){border:0;clip-path:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.sbb-form-field__label{display:flex;max-width:100%;cursor:var(--sbb-cursor-default);position:absolute;inset-block-start:0;color:var(--sbb-form-field-label-color);font-size:var(--sbb-form-field-label-text-size);letter-spacing:var(--sbb-typo-letter-spacing-text)}:host(:where(:is(:state(input-type-select),[state--input-type-select]),:is(:state(input-type-sbb-select),[state--input-type-sbb-select]))) .sbb-form-field__label{padding-inline-end:var(--sbb-form-field-select-inline-padding-end)}:host([floating-label]) .sbb-form-field__label{transform-origin:0 0;pointer-events:none;backface-visibility:hidden;will-change:transform,font-size;transition-duration:var(--sbb-disable-animation-duration, var(--sbb-animation-duration-2x));transition-timing-function:var(--sbb-animation-easing);transition-property:transform,font-size}:host([floating-label]:is(:not(:where(:is(:state(focus),[state--focus])):not(:where(:is(:state(input-type-sbb-select),[state--input-type-sbb-select]))),:where(:is(:state(has-popup-open),[state--has-popup-open]))),:where(:is(:state(readonly),[state--readonly]))):where(:is(:state(empty),[state--empty]))) .sbb-form-field__label{font-size:var(--sbb-form-field-input-text-size);transform:translateY(var(--_sbb-form-field-floating-label-transform))}@media(forced-colors:active){:host(:where(:is(:state(input-type-textarea),[state--input-type-textarea]))) .sbb-form-field__label{z-index:1}}.sbb-form-field__label-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.sbb-form-field__input{display:flex;flex:1;align-items:start}:host([size=s]:is(:is(:state(input-type-input),[state--input-type-input]),:is(:state(input-type-select),[state--input-type-select]),:is(:state(input-type-sbb-select),[state--input-type-sbb-select]),:is(:state(input-type-sbb-date-input),[state--input-type-sbb-date-input]),:is(:state(input-type-sbb-time-input),[state--input-type-sbb-time-input]))) .sbb-form-field__input{margin-block-end:-.125rem}.sbb-form-field__hint{display:flex;min-height:var(--sbb-form-field-hint-min-height);flex-direction:column;margin-block-start:var(--sbb-form-field-hint-padding-block-start-override, var(--sbb-form-field-hint-padding-block-start))}", _ = 0, v = /* @__PURE__ */ new WeakMap(), y = [
 	"input",
 	"textarea",
 	"select"
@@ -16,25 +16,25 @@ var ne = "@charset \"UTF-8\";:host{--sbb-form-field-hint-divider-width: var(--sb
 		super("formfieldcontrol"), this._control = e;
 	}
 }, x = (() => {
-	let b = u(c), x, S = [], C = [], w, T = [], E = [], D, O = [], k = [], A, j = [], M = [], N, P = [], F = [], I, L = [], R = [], z, B = [], V = [], H, U = [], W = [], G, K = [], q = [], J, Y = [], X = [], Z, Q = [], $ = [];
+	let b = l(s), x, S = [], C = [], w, T = [], E = [], D, O = [], k = [], A, j = [], M = [], N, P = [], F = [], I, L = [], R = [], z, B = [], V = [], H, U = [], W = [], G, K = [], q = [], J, Y = [], X = [], Z, Q = [], $ = [];
 	return class extends b {
 		static {
 			let t = typeof Symbol == "function" && Symbol.metadata ? Object.create(b[Symbol.metadata] ?? null) : void 0;
-			x = [o({
+			x = [a({
 				attribute: "error-space",
 				reflect: !0
-			})], w = [p(), o({ type: Boolean })], D = [o({ reflect: !0 })], A = [p(), o({
+			})], w = [f(), a({ type: Boolean })], D = [a({ reflect: !0 })], A = [f(), a({
 				reflect: !0,
 				type: Boolean
-			})], N = [o({ reflect: !0 })], I = [p(), o({
+			})], N = [a({ reflect: !0 })], I = [f(), a({
 				attribute: "hidden-label",
 				reflect: !0,
 				type: Boolean
-			})], z = [p(), o({
+			})], z = [f(), a({
 				attribute: "floating-label",
 				reflect: !0,
 				type: Boolean
-			})], H = [s()], G = [s()], J = [s()], Z = [s()], e(this, null, x, {
+			})], H = [o()], G = [o()], J = [o()], Z = [o()], e(this, null, x, {
 				kind: "accessor",
 				name: "errorSpace",
 				static: !1,
@@ -191,7 +191,7 @@ var ne = "@charset \"UTF-8\";:host{--sbb-form-field-hint-divider-width: var(--sb
 			this.elementDependencies = [te];
 		}
 		static {
-			this.styles = [f, a(ne)];
+			this.styles = [d, ee(ne)];
 		}
 		#e;
 		get errorSpace() {
@@ -295,9 +295,9 @@ var ne = "@charset \"UTF-8\";:host{--sbb-form-field-hint-divider-width: var(--sb
 				"tel",
 				"text",
 				"url"
-			], this.#e = t(this, S, "none"), this.#t = (t(this, C), t(this, T, !1)), this.#n = (t(this, E), t(this, O, ee() ? "s" : "m")), this.#r = (t(this, k), t(this, j, !1)), this.#i = (t(this, M), t(this, P, "default")), this.#a = (t(this, F), t(this, L, !1)), this.#o = (t(this, R), t(this, B, !1)), this.#s = (t(this, V), t(this, U, [])), this.#c = (t(this, W), t(this, K, [])), this.#l = (t(this, q), t(this, Y, null)), this.#u = (t(this, X), t(this, Q, void 0)), this._language = (t(this, $), new l(this)), this._formFieldAttributeObserver = r ? null : new MutationObserver((e) => {
+			], this.#e = t(this, S, "none"), this.#t = (t(this, C), t(this, T, !1)), this.#n = (t(this, E), t(this, O, m() ? "s" : "m")), this.#r = (t(this, k), t(this, j, !1)), this.#i = (t(this, M), t(this, P, "default")), this.#a = (t(this, F), t(this, L, !1)), this.#o = (t(this, R), t(this, B, !1)), this.#s = (t(this, V), t(this, U, [])), this.#c = (t(this, W), t(this, K, [])), this.#l = (t(this, q), t(this, Y, null)), this.#u = (t(this, X), t(this, Q, void 0)), this._language = (t(this, $), new c(this)), this._formFieldAttributeObserver = r ? null : new MutationObserver((e) => {
 				e.some((e) => e.type === "attributes") && this._input && (this._readInputState(), this._registerInputFormListener(), this._checkAndUpdateInputEmpty(), this.dispatchEvent(new Event("ɵinputattributechange")));
-			}), this._inputFormAbortController = new AbortController(), this._control = null, this.addEventListener?.("focusin", (e) => {
+			}), this._inputFormAbortController = new AbortController(), this._control = null, this._previousType = null, this.addEventListener?.("focusin", (e) => {
 				(e.target === this.inputElement || e.target === this.inputElement?.inputElement) && (this.internals.states.add("focus"), this.internals.states.add(`focus-origin-${g.mostRecentModality}`));
 			}, { passive: !0 }), this.addEventListener?.("focusout", (e) => {
 				if (e.target === this.inputElement || e.target === this.inputElement?.inputElement) {
@@ -363,7 +363,7 @@ var ne = "@charset \"UTF-8\";:host{--sbb-form-field-hint-divider-width: var(--sb
 			return y.includes(e.localName) || !!customElements.get(e.localName)?.formAssociated;
 		}
 		_readInputState() {
-			this.toggleState("readonly", this._control?.readOnly ?? this._input.hasAttribute("readonly")), this.toggleState("disabled", this._control?.disabled ?? this._input.hasAttribute("disabled")), this.toggleState("has-popup-open", this._input.hasAttribute("data-expanded"));
+			this.toggleState("readonly", this._control?.readOnly ?? this._input.hasAttribute("readonly")), this.toggleState("disabled", this._control?.disabled ?? this._input.hasAttribute("disabled")), this.toggleState("has-popup-open", this._input.hasAttribute("data-expanded")), this._previousType && this.internals.states.delete(`explicit-input-type-${this._previousType}`), this._previousType = this._control?.type ?? this._input.type ?? "text", this.internals.states.add(`explicit-input-type-${this._previousType}`);
 		}
 		_registerInputFormListener() {
 			this._inputFormAbortController.abort();
@@ -421,7 +421,7 @@ var ne = "@charset \"UTF-8\";:host{--sbb-form-field-hint-divider-width: var(--sb
 		_assignAriaDescribedByElements() {
 			if (this._input) {
 				let e = this._errorElements.length ? this._errorElements : this._hintElements;
-				this._input.ariaDescribedByElements = d(this._input.ariaDescribedByElements, ...e);
+				this._input.ariaDescribedByElements = u(this._input.ariaDescribedByElements, ...e);
 			}
 		}
 		reset() {
@@ -447,16 +447,16 @@ var ne = "@charset \"UTF-8\";:host{--sbb-form-field-hint-divider-width: var(--sb
             <span class="sbb-form-field__label">
               <span class="sbb-form-field__label-ellipsis">
                 <slot name="label" @slotchange=${this._onSlotLabelChange}></slot>
-                ${this.optional ? n` <span aria-hidden="true"> ${m[this._language.current]} </span>` : i}
+                ${this.optional ? n` <span aria-hidden="true"> ${p[this._language.current]} </span>` : i}
               </span>
             </span>
             <div class="sbb-form-field__input">
               <slot @slotchange=${this._onSlotInputChange}></slot>
             </div>
-            ${this.hasUpdated && ["select", "sbb-select"].includes(this._input?.localName) ? n`<sbb-icon
-                  name="chevron-small-down-small"
-                  class="sbb-form-field__select-input-icon"
-                ></sbb-icon>` : i}
+            <sbb-icon
+              name="chevron-small-down-small"
+              class="sbb-form-field__select-input-icon"
+            ></sbb-icon>
           </div>
           <slot name="suffix" @slotchange=${this._syncNegative}></slot>
         </div>

package/form-field.js

@@ -1,5 +1,5 @@
 import { t as e } from "./error.component-BLChP2fE.js";
-import { n as t, t as n } from "./form-field.component-BDTzaGuP.js";
+import { n as t, t as n } from "./form-field.component-Do5eratI.js";
 import { SbbFormFieldClearElement as r } from "./form-field/form-field-clear/form-field-clear.component.js";
 import { SbbFormFieldTextCounterElement as i } from "./form-field/form-field-text-counter/form-field-text-counter.component.js";
 import { t as a } from "./hint.component-CaF6CBCN.js";

package/form-field.pure.js

@@ -1,5 +1,5 @@
 import { t as e } from "./error.component-BLChP2fE.js";
-import { n as t, t as n } from "./form-field.component-BDTzaGuP.js";
+import { n as t, t as n } from "./form-field.component-Do5eratI.js";
 import { SbbFormFieldClearElement as r } from "./form-field/form-field-clear/form-field-clear.component.js";
 import { SbbFormFieldTextCounterElement as i } from "./form-field/form-field-text-counter/form-field-text-counter.component.js";
 import { t as a } from "./hint.component-CaF6CBCN.js";

package/off-brand-theme.css

@@ -3312,10 +3312,17 @@ sup {
   --sbb-scrollbar-track-color: var(--sbb-background-color-4-negative);
 }
 
-.sbb-table,
-.sbb-table-m,
-.sbb-table-s,
-.sbb-table-xs {
+:root {
+  --sbb-table-border-color: var(--sbb-color-cloud);
+  --sbb-table-border-color: light-dark(var(--sbb-color-cloud), var(--sbb-color-anthracite));
+  --sbb-table-background-color: var(--sbb-background-color-1);
+  --sbb-table-row-striped-color: var(--sbb-background-color-3);
+  --sbb-table-color: var(--sbb-color-1);
+  --sbb-table-caption-color: var(--sbb-color-granite);
+  --sbb-table-caption-color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
+  --sbb-table-caption-margin-block-start: var(--sbb-spacing-fixed-4x);
+  --sbb-table-sticky-shadow-width: 3rem;
+  --sbb-table-sticky-shadow-transition-easing: var(--sbb-animation-easing);
   --sbb-table-header-cell-font-size: var(--sbb-text-font-size-xs);
   --sbb-table-data-cell-font-size: var(--sbb-text-font-size-s);
   --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
@@ -3323,28 +3330,16 @@ sup {
   --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
   --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
 }
-.sbb-table tbody tr:nth-child(odd) :is(th, td),
-.sbb-table-m tbody tr:nth-child(odd) :is(th, td),
-.sbb-table-s tbody tr:nth-child(odd) :is(th, td),
-.sbb-table-xs tbody tr:nth-child(odd) :is(th, td) {
-  background-color: var(--sbb-table-row-striped-color);
-}
+
 .sbb-table,
 .sbb-table-m,
 .sbb-table-s,
 .sbb-table-xs {
   --sbb-table-border: var(--sbb-border-width-1x) solid var(--sbb-table-border-color);
-  --sbb-table-border-color: var(--sbb-color-cloud);
-  --sbb-table-border-color: light-dark(var(--sbb-color-cloud), var(--sbb-color-anthracite));
-  --sbb-table-background-color: var(--sbb-background-color-1);
-  --sbb-table-row-striped-color: var(--sbb-background-color-3);
-  --sbb-table-color: var(--sbb-color-1);
-  --sbb-table-caption-color: var(--sbb-color-granite);
-  --sbb-table-caption-color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
-  --sbb-table-caption-margin-block-start: var(--sbb-spacing-fixed-4x);
-  --sbb-table-sticky-shadow-width: 3rem;
-  --sbb-table-sticky-shadow-transition-easing: var(--sbb-animation-easing);
-  --sbb-table-sticky-shadow-transition-duration: var(--sbb-animation-duration-6x);
+  --sbb-table-sticky-shadow-transition-duration: var(
+    --sbb-disable-animation-duration,
+    var(--sbb-animation-duration-6x)
+  );
   border-spacing: 0;
   caption-side: bottom;
   color: var(--sbb-table-color);
@@ -3388,6 +3383,12 @@ sup {
 .sbb-table-xs :is(th, td):first-child {
   border-inline-start: var(--sbb-table-border);
 }
+.sbb-table tbody tr:nth-child(odd) :is(th, td),
+.sbb-table-m tbody tr:nth-child(odd) :is(th, td),
+.sbb-table-s tbody tr:nth-child(odd) :is(th, td),
+.sbb-table-xs tbody tr:nth-child(odd) :is(th, td) {
+  background-color: var(--sbb-table-row-striped-color);
+}
 .sbb-table:has(thead tr) thead tr:first-of-type > :is(th, td), .sbb-table:not(:has(thead tr)) tbody tr:first-of-type > :is(th, td),
 .sbb-table-m:has(thead tr) thead tr:first-of-type > :is(th, td),
 .sbb-table-m:not(:has(thead tr)) tbody tr:first-of-type > :is(th, td),
@@ -3408,7 +3409,10 @@ sup {
 .sbb-table-s caption,
 .sbb-table-xs caption {
   --sbb-table-caption-color-fallback: var(--sbb-color-granite);
-  --sbb-table-caption-color-fallback: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
+  --sbb-table-caption-color-fallback: light-dark(
+    var(--sbb-color-granite),
+    var(--sbb-color-cement)
+  );
   font-size: var(--sbb-text-font-size-xs);
   letter-spacing: var(--sbb-typo-letter-spacing-text);
   color: var(--sbb-table-caption-color, var(--sbb-table-caption-color-fallback));
@@ -3463,11 +3467,15 @@ sbb-table-wrapper[negative] .sbb-table,
 .sbb-table--theme-iron {
   --sbb-table-cell-color: var(--sbb-color-4);
 }
+sbb-table-wrapper[negative] .sbb-table--theme-iron, .sbb-table--theme-iron.sbb-table--negative {
+  --sbb-table-cell-color: var(--sbb-color-cloud);
+}
 .sbb-table--theme-iron tbody > tr > td {
   color: var(--sbb-table-cell-color);
 }
-.sbb-table--theme-iron.sbb-table--negative {
-  --sbb-table-cell-color: var(--sbb-color-cloud);
+
+.sbb-table-header-subtitle {
+  font-weight: normal;
 }
 
 .sbb-table-header-row:last-of-type > th {
@@ -3551,15 +3559,6 @@ sbb-table-wrapper[negative] .sbb-table,
   inset-inline-end: unset;
 }
 
-html.sbb-lean .sbb-table:not(.sbb-table-xs, .sbb-table-m) {
-  --sbb-table-header-cell-font-size: var(--sbb-text-font-size-xs);
-  --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
-  --sbb-table-header-padding-block: var(--sbb-spacing-fixed-1x);
-  --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-2x);
-  --sbb-table-cell-padding-block: var(--sbb-spacing-fixed-1x);
-  --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-2x);
-}
-
 .sbb-table-align-start {
   text-align: start;
 }
@@ -3584,10 +3583,6 @@ html.sbb-lean .sbb-table:not(.sbb-table-xs, .sbb-table-m) {
   text-align: right;
 }
 
-.sbb-table-header-subtitle {
-  font-weight: normal;
-}
-
 .sbb-timetable-form {
   --sbb-timetable-form-content-max-width: 46.25rem;
   position: relative;

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@sbb-esta/lyne-elements-dev",
-  "version": "4.0.0-dev.1776072012",
+  "version": "4.0.0-dev.1776087061",
   "description": "Lyne Design System",
   "keywords": [
     "design system",
     "web components",
     "lit",
-    "https://github.com/sbb-design-systems/lyne-components/commit/02d65d2ee3bed82b08e5797352838021772d49bb"
+    "https://github.com/sbb-design-systems/lyne-components/commit/0829ef2187605417a4012115df2f483207a5f75f"
   ],
   "type": "module",
   "exports": {

package/safety-theme.css

@@ -3312,10 +3312,17 @@ sup {
   --sbb-scrollbar-track-color: var(--sbb-background-color-4-negative);
 }
 
-.sbb-table,
-.sbb-table-m,
-.sbb-table-s,
-.sbb-table-xs {
+:root {
+  --sbb-table-border-color: var(--sbb-color-cloud);
+  --sbb-table-border-color: light-dark(var(--sbb-color-cloud), var(--sbb-color-anthracite));
+  --sbb-table-background-color: var(--sbb-background-color-1);
+  --sbb-table-row-striped-color: var(--sbb-background-color-3);
+  --sbb-table-color: var(--sbb-color-1);
+  --sbb-table-caption-color: var(--sbb-color-granite);
+  --sbb-table-caption-color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
+  --sbb-table-caption-margin-block-start: var(--sbb-spacing-fixed-4x);
+  --sbb-table-sticky-shadow-width: 3rem;
+  --sbb-table-sticky-shadow-transition-easing: var(--sbb-animation-easing);
   --sbb-table-header-cell-font-size: var(--sbb-text-font-size-xs);
   --sbb-table-data-cell-font-size: var(--sbb-text-font-size-s);
   --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
@@ -3323,28 +3330,16 @@ sup {
   --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
   --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
 }
-.sbb-table tbody tr:nth-child(odd) :is(th, td),
-.sbb-table-m tbody tr:nth-child(odd) :is(th, td),
-.sbb-table-s tbody tr:nth-child(odd) :is(th, td),
-.sbb-table-xs tbody tr:nth-child(odd) :is(th, td) {
-  background-color: var(--sbb-table-row-striped-color);
-}
+
 .sbb-table,
 .sbb-table-m,
 .sbb-table-s,
 .sbb-table-xs {
   --sbb-table-border: var(--sbb-border-width-1x) solid var(--sbb-table-border-color);
-  --sbb-table-border-color: var(--sbb-color-cloud);
-  --sbb-table-border-color: light-dark(var(--sbb-color-cloud), var(--sbb-color-anthracite));
-  --sbb-table-background-color: var(--sbb-background-color-1);
-  --sbb-table-row-striped-color: var(--sbb-background-color-3);
-  --sbb-table-color: var(--sbb-color-1);
-  --sbb-table-caption-color: var(--sbb-color-granite);
-  --sbb-table-caption-color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
-  --sbb-table-caption-margin-block-start: var(--sbb-spacing-fixed-4x);
-  --sbb-table-sticky-shadow-width: 3rem;
-  --sbb-table-sticky-shadow-transition-easing: var(--sbb-animation-easing);
-  --sbb-table-sticky-shadow-transition-duration: var(--sbb-animation-duration-6x);
+  --sbb-table-sticky-shadow-transition-duration: var(
+    --sbb-disable-animation-duration,
+    var(--sbb-animation-duration-6x)
+  );
   border-spacing: 0;
   caption-side: bottom;
   color: var(--sbb-table-color);
@@ -3388,6 +3383,12 @@ sup {
 .sbb-table-xs :is(th, td):first-child {
   border-inline-start: var(--sbb-table-border);
 }
+.sbb-table tbody tr:nth-child(odd) :is(th, td),
+.sbb-table-m tbody tr:nth-child(odd) :is(th, td),
+.sbb-table-s tbody tr:nth-child(odd) :is(th, td),
+.sbb-table-xs tbody tr:nth-child(odd) :is(th, td) {
+  background-color: var(--sbb-table-row-striped-color);
+}
 .sbb-table:has(thead tr) thead tr:first-of-type > :is(th, td), .sbb-table:not(:has(thead tr)) tbody tr:first-of-type > :is(th, td),
 .sbb-table-m:has(thead tr) thead tr:first-of-type > :is(th, td),
 .sbb-table-m:not(:has(thead tr)) tbody tr:first-of-type > :is(th, td),
@@ -3408,7 +3409,10 @@ sup {
 .sbb-table-s caption,
 .sbb-table-xs caption {
   --sbb-table-caption-color-fallback: var(--sbb-color-granite);
-  --sbb-table-caption-color-fallback: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
+  --sbb-table-caption-color-fallback: light-dark(
+    var(--sbb-color-granite),
+    var(--sbb-color-cement)
+  );
   font-size: var(--sbb-text-font-size-xs);
   letter-spacing: var(--sbb-typo-letter-spacing-text);
   color: var(--sbb-table-caption-color, var(--sbb-table-caption-color-fallback));
@@ -3463,11 +3467,15 @@ sbb-table-wrapper[negative] .sbb-table,
 .sbb-table--theme-iron {
   --sbb-table-cell-color: var(--sbb-color-4);
 }
+sbb-table-wrapper[negative] .sbb-table--theme-iron, .sbb-table--theme-iron.sbb-table--negative {
+  --sbb-table-cell-color: var(--sbb-color-cloud);
+}
 .sbb-table--theme-iron tbody > tr > td {
   color: var(--sbb-table-cell-color);
 }
-.sbb-table--theme-iron.sbb-table--negative {
-  --sbb-table-cell-color: var(--sbb-color-cloud);
+
+.sbb-table-header-subtitle {
+  font-weight: normal;
 }
 
 .sbb-table-header-row:last-of-type > th {
@@ -3551,15 +3559,6 @@ sbb-table-wrapper[negative] .sbb-table,
   inset-inline-end: unset;
 }
 
-html.sbb-lean .sbb-table:not(.sbb-table-xs, .sbb-table-m) {
-  --sbb-table-header-cell-font-size: var(--sbb-text-font-size-xs);
-  --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
-  --sbb-table-header-padding-block: var(--sbb-spacing-fixed-1x);
-  --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-2x);
-  --sbb-table-cell-padding-block: var(--sbb-spacing-fixed-1x);
-  --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-2x);
-}
-
 .sbb-table-align-start {
   text-align: start;
 }
@@ -3584,10 +3583,6 @@ html.sbb-lean .sbb-table:not(.sbb-table-xs, .sbb-table-m) {
   text-align: right;
 }
 
-.sbb-table-header-subtitle {
-  font-weight: normal;
-}
-
 .sbb-timetable-form {
   --sbb-timetable-form-content-max-width: 46.25rem;
   position: relative;

package/standard-theme.css

@@ -3312,10 +3312,17 @@ sup {
   --sbb-scrollbar-track-color: var(--sbb-background-color-4-negative);
 }
 
-.sbb-table,
-.sbb-table-m,
-.sbb-table-s,
-.sbb-table-xs {
+:root {
+  --sbb-table-border-color: var(--sbb-color-cloud);
+  --sbb-table-border-color: light-dark(var(--sbb-color-cloud), var(--sbb-color-anthracite));
+  --sbb-table-background-color: var(--sbb-background-color-1);
+  --sbb-table-row-striped-color: var(--sbb-background-color-3);
+  --sbb-table-color: var(--sbb-color-1);
+  --sbb-table-caption-color: var(--sbb-color-granite);
+  --sbb-table-caption-color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
+  --sbb-table-caption-margin-block-start: var(--sbb-spacing-fixed-4x);
+  --sbb-table-sticky-shadow-width: 3rem;
+  --sbb-table-sticky-shadow-transition-easing: var(--sbb-animation-easing);
   --sbb-table-header-cell-font-size: var(--sbb-text-font-size-xs);
   --sbb-table-data-cell-font-size: var(--sbb-text-font-size-s);
   --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
@@ -3323,28 +3330,16 @@ sup {
   --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
   --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
 }
-.sbb-table tbody tr:nth-child(odd) :is(th, td),
-.sbb-table-m tbody tr:nth-child(odd) :is(th, td),
-.sbb-table-s tbody tr:nth-child(odd) :is(th, td),
-.sbb-table-xs tbody tr:nth-child(odd) :is(th, td) {
-  background-color: var(--sbb-table-row-striped-color);
-}
+
 .sbb-table,
 .sbb-table-m,
 .sbb-table-s,
 .sbb-table-xs {
   --sbb-table-border: var(--sbb-border-width-1x) solid var(--sbb-table-border-color);
-  --sbb-table-border-color: var(--sbb-color-cloud);
-  --sbb-table-border-color: light-dark(var(--sbb-color-cloud), var(--sbb-color-anthracite));
-  --sbb-table-background-color: var(--sbb-background-color-1);
-  --sbb-table-row-striped-color: var(--sbb-background-color-3);
-  --sbb-table-color: var(--sbb-color-1);
-  --sbb-table-caption-color: var(--sbb-color-granite);
-  --sbb-table-caption-color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
-  --sbb-table-caption-margin-block-start: var(--sbb-spacing-fixed-4x);
-  --sbb-table-sticky-shadow-width: 3rem;
-  --sbb-table-sticky-shadow-transition-easing: var(--sbb-animation-easing);
-  --sbb-table-sticky-shadow-transition-duration: var(--sbb-animation-duration-6x);
+  --sbb-table-sticky-shadow-transition-duration: var(
+    --sbb-disable-animation-duration,
+    var(--sbb-animation-duration-6x)
+  );
   border-spacing: 0;
   caption-side: bottom;
   color: var(--sbb-table-color);
@@ -3388,6 +3383,12 @@ sup {
 .sbb-table-xs :is(th, td):first-child {
   border-inline-start: var(--sbb-table-border);
 }
+.sbb-table tbody tr:nth-child(odd) :is(th, td),
+.sbb-table-m tbody tr:nth-child(odd) :is(th, td),
+.sbb-table-s tbody tr:nth-child(odd) :is(th, td),
+.sbb-table-xs tbody tr:nth-child(odd) :is(th, td) {
+  background-color: var(--sbb-table-row-striped-color);
+}
 .sbb-table:has(thead tr) thead tr:first-of-type > :is(th, td), .sbb-table:not(:has(thead tr)) tbody tr:first-of-type > :is(th, td),
 .sbb-table-m:has(thead tr) thead tr:first-of-type > :is(th, td),
 .sbb-table-m:not(:has(thead tr)) tbody tr:first-of-type > :is(th, td),
@@ -3408,7 +3409,10 @@ sup {
 .sbb-table-s caption,
 .sbb-table-xs caption {
   --sbb-table-caption-color-fallback: var(--sbb-color-granite);
-  --sbb-table-caption-color-fallback: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
+  --sbb-table-caption-color-fallback: light-dark(
+    var(--sbb-color-granite),
+    var(--sbb-color-cement)
+  );
   font-size: var(--sbb-text-font-size-xs);
   letter-spacing: var(--sbb-typo-letter-spacing-text);
   color: var(--sbb-table-caption-color, var(--sbb-table-caption-color-fallback));
@@ -3463,11 +3467,15 @@ sbb-table-wrapper[negative] .sbb-table,
 .sbb-table--theme-iron {
   --sbb-table-cell-color: var(--sbb-color-4);
 }
+sbb-table-wrapper[negative] .sbb-table--theme-iron, .sbb-table--theme-iron.sbb-table--negative {
+  --sbb-table-cell-color: var(--sbb-color-cloud);
+}
 .sbb-table--theme-iron tbody > tr > td {
   color: var(--sbb-table-cell-color);
 }
-.sbb-table--theme-iron.sbb-table--negative {
-  --sbb-table-cell-color: var(--sbb-color-cloud);
+
+.sbb-table-header-subtitle {
+  font-weight: normal;
 }
 
 .sbb-table-header-row:last-of-type > th {
@@ -3551,15 +3559,6 @@ sbb-table-wrapper[negative] .sbb-table,
   inset-inline-end: unset;
 }
 
-html.sbb-lean .sbb-table:not(.sbb-table-xs, .sbb-table-m) {
-  --sbb-table-header-cell-font-size: var(--sbb-text-font-size-xs);
-  --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
-  --sbb-table-header-padding-block: var(--sbb-spacing-fixed-1x);
-  --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-2x);
-  --sbb-table-cell-padding-block: var(--sbb-spacing-fixed-1x);
-  --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-2x);
-}
-
 .sbb-table-align-start {
   text-align: start;
 }
@@ -3584,10 +3583,6 @@ html.sbb-lean .sbb-table:not(.sbb-table-xs, .sbb-table-m) {
   text-align: right;
 }
 
-.sbb-table-header-subtitle {
-  font-weight: normal;
-}
-
 .sbb-timetable-form {
   --sbb-timetable-form-content-max-width: 46.25rem;
   position: relative;