@sbb-esta/lyne-elements 5.0.0-next.2 → 5.0.0

package/tab-label.component-CMbmEoNe.js

@@ -1,157 +0,0 @@
-import { __esDecorate as e, __runInitializers as t } from "tslib";
-import { unsafeCSS as n } from "lit";
-import { property as r } from "lit/decorators.js";
-import { SbbDisabledMixin as i, SbbElement as a, SbbPropertyWatcherController as o, forceType as s, omitEmptyConverter as c } from "./core.js";
-import { html as l, unsafeStatic as u } from "lit/static-html.js";
-import { SbbIconNameMixin as d } from "./icon.pure.js";
-import { tabLabelCommonStyles as f } from "./tabs/common/styles.js";
-//#region src/elements/tabs/tab-label/tab-label.scss?inline
-var p = ":host{--sbb-tab-label-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-tab-label-outline-border-radius-internal: calc( var(--sbb-tab-label-outline-border-radius) - var(--sbb-focus-outline-offset) )}:host(:is(:is(:state(size-s),[state--size-s]),[size=s])){--sbb-tab-label-height: var(--sbb-size-element-xs);--sbb-tab-label-inline-padding: var(--sbb-spacing-responsive-xxxs);--sbb-tab-label-font-size: var(--sbb-text-font-size-s)}:host(:is(:is(:state(size-l),[state--size-l]),[size=l])){--sbb-tab-label-height: var(--sbb-size-element-m);--sbb-tab-label-inline-padding: var(--sbb-spacing-responsive-xs);--sbb-tab-label-font-size: var(--sbb-text-font-size-m)}:host(:is(:is(:state(size-xl),[state--size-xl]),[size=xl])){--sbb-tab-label-height: var(--sbb-size-element-m);--sbb-tab-label-inline-padding: var(--sbb-spacing-responsive-xs);--sbb-tab-label-font-size: var(--sbb-text-font-size-xl)}:host(sbb-tab-label),:host(sbb-tab-nav-bar) ::slotted(a){pointer-events:var(--sbb-tab-label-pointer-events, unset)}@media(forced-colors:active){:host(sbb-tab-label),:host(sbb-tab-nav-bar) ::slotted(a){--sbb-tab-label-color: ButtonText;--sbb-tab-label-amount-color: ButtonText}}:host(sbb-tab-nav-bar) ::slotted(a),:host(sbb-tab-label) .sbb-tab-label{position:relative;display:flex;align-items:center;gap:var(--sbb-tab-label-gap);color:var(--sbb-tab-label-color);margin:0;padding-inline:var(--sbb-tab-label-inline-padding);min-height:var(--sbb-tab-label-height);transition:color var(--sbb-tab-label-animation-duration) var(--sbb-tab-label-animation-easing);font-size:var(--sbb-tab-label-font-size);letter-spacing:var(--sbb-typo-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);font-weight:var(--sbb-tab-label-font-weight);text-decoration:var(--sbb-tab-label-text-decoration)}:host(sbb-tab-nav-bar) ::slotted(a):after,:host(sbb-tab-label) .sbb-tab-label:after{position:absolute;content:\"\";inset-inline:0;inset-block-end:0;height:var(--sbb-tab-label-marker-thickness);background-color:var(--sbb-tab-label-color);scale:var(--sbb-tab-label-marker-scale, 0);transition-duration:var(--sbb-tab-label-animation-duration);transition-timing-function:var(--sbb-tab-label-animation-easing);transition-property:scale,background-color}:host(sbb-tab-nav-bar) .sbb-tab-nav-bar>[data-has-divider],:host(sbb-tab-label:is(:state(has-divider),[state--has-divider])){position:relative}:host(sbb-tab-nav-bar) .sbb-tab-nav-bar>[data-has-divider]:before,:host(sbb-tab-label:is(:state(has-divider),[state--has-divider])):before{content:\"\";position:absolute;inset-inline-start:0;inset-block-end:0;width:var(--sbb-tab-group-width);height:var(--sbb-border-width-1x);background-color:var(--sbb-tab-label-line-color)}:host(sbb-tab-nav-bar) ::slotted(a.sbb-disabled),:host(sbb-tab-label[disabled]){--sbb-tab-label-cursor: unset;--sbb-tab-label-pointer-events: none;--sbb-tab-label-text-decoration: line-through}@media(forced-colors:active){:host(sbb-tab-nav-bar) ::slotted(a.sbb-disabled),:host(sbb-tab-label[disabled]){--sbb-tab-label-color: GrayText;--sbb-tab-label-amount-color: GrayText}}:host(sbb-tab-nav-bar) ::slotted(a.sbb-active:not(.sbb-disabled)),:host(sbb-tab-label[active]:not([disabled])){--sbb-tab-label-color: var(--sbb-color-3);--sbb-tab-label-cursor: unset;--sbb-tab-label-pointer-events: none;--sbb-tab-label-marker-scale: 1}@media(forced-colors:active){:host(sbb-tab-nav-bar) ::slotted(a.sbb-active:not(.sbb-disabled)),:host(sbb-tab-label[active]:not([disabled])){--sbb-tab-label-color: ButtonText;--sbb-tab-label-amount-color: ButtonText}}@media(any-hover:hover){:host(sbb-tab-nav-bar) ::slotted(a:hover:not(.sbb-disabled)),:host(sbb-tab-label:hover:not([disabled])){--sbb-tab-label-marker-scale: 1}}:host(sbb-tab-nav-bar) ::slotted(a:active:not(.sbb-disabled)),:host(sbb-tab-label:active){--sbb-tab-label-color: var(--sbb-color-3)}@media(forced-colors:active){:host(sbb-tab-nav-bar) ::slotted(a:active:not(.sbb-disabled)),:host(sbb-tab-label:active){--sbb-tab-label-color: ButtonText;--sbb-tab-label-amount-color: ButtonText}}:host(sbb-tab-nav-bar) ::slotted(a:focus-visible),:host(sbb-tab-label:focus-visible) .sbb-tab-label{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);border-radius:var(--sbb-tab-label-outline-border-radius-internal)}:host{display:inline-block;max-width:100%;outline:none!important}.sbb-tab-label{cursor:var(--sbb-tab-label-cursor);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.sbb-tab-label__icon{display:flex;flex-shrink:0}:host(:not(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-tab-label__icon{display:none}.sbb-tab-label__text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(:not(:is(:state(slotted),[state--slotted]))) .sbb-tab-label__text{display:none}.sbb-tab-label__amount{margin:0;color:var(--sbb-tab-label-amount-color);font-weight:400;text-decoration:var(--sbb-tab-label-text-decoration)}:host(:not(:is(:state(slotted-amount),[state--slotted-amount]),[amount])) .sbb-tab-label__amount{display:none}", m = (() => {
-	let m = i(d(a)), h, g = [], _ = [], v, y = [], b = [], x, S = [], C = [];
-	return class extends m {
-		static {
-			let t = typeof Symbol == "function" && Symbol.metadata ? Object.create(m[Symbol.metadata] ?? null) : void 0;
-			h = [r()], v = [s(), r({
-				reflect: !0,
-				type: Boolean
-			})], x = [s(), r({
-				reflect: !0,
-				converter: c
-			})], e(this, null, h, {
-				kind: "accessor",
-				name: "level",
-				static: !1,
-				private: !1,
-				access: {
-					has: (e) => "level" in e,
-					get: (e) => e.level,
-					set: (e, t) => {
-						e.level = t;
-					}
-				},
-				metadata: t
-			}, g, _), e(this, null, v, {
-				kind: "accessor",
-				name: "active",
-				static: !1,
-				private: !1,
-				access: {
-					has: (e) => "active" in e,
-					get: (e) => e.active,
-					set: (e, t) => {
-						e.active = t;
-					}
-				},
-				metadata: t
-			}, y, b), e(this, null, x, {
-				kind: "accessor",
-				name: "amount",
-				static: !1,
-				private: !1,
-				access: {
-					has: (e) => "amount" in e,
-					get: (e) => e.amount,
-					set: (e, t) => {
-						e.amount = t;
-					}
-				},
-				metadata: t
-			}, S, C), t && Object.defineProperty(this, Symbol.metadata, {
-				enumerable: !0,
-				configurable: !0,
-				writable: !0,
-				value: t
-			});
-		}
-		static {
-			this.elementName = "sbb-tab-label";
-		}
-		static {
-			this.role = "tab";
-		}
-		static {
-			this.styles = [f, n(p)];
-		}
-		#e;
-		get level() {
-			return this.#e;
-		}
-		set level(e) {
-			this.#e = e;
-		}
-		#t;
-		get active() {
-			return this.#t;
-		}
-		set active(e) {
-			this.#t = e;
-		}
-		#n;
-		get amount() {
-			return this.#n;
-		}
-		set amount(e) {
-			this.#n = e;
-		}
-		get tab() {
-			return this.nextElementSibling?.localName === "sbb-tab" ? this.nextElementSibling : null;
-		}
-		get group() {
-			return this.closest("sbb-tab-group");
-		}
-		constructor() {
-			super(), this._selected = !1, this._previousSize = null, this.#e = t(this, g, "1"), this.#t = (t(this, _), t(this, y, !1)), this.#n = (t(this, b), t(this, S, "")), t(this, C), this.addEventListener("click", () => this.activate()), this.addController(new o(this, () => this.group, { size: (e) => {
-				this._previousSize && this.internals.states.delete(`size-${this._previousSize}`), this._previousSize = e?.size || null, this._previousSize && this.internals.states.add(`size-${this._previousSize}`);
-			} }));
-		}
-		connectedCallback() {
-			super.connectedCallback(), this.slot = "tab-bar", this.tabIndex = this.active ? 0 : -1;
-		}
-		willUpdate(e) {
-			super.willUpdate(e), e.has("active") && (this.internals.ariaSelected = `${this.active}`, this.active && !this.disabled ? this.activate() : this.deactivate()), e.has("disabled") && this.disabled && (this.tabIndex = -1, this.active && (this.deactivate(), this.group?.activateTab(0)));
-		}
-		deactivate() {
-			this.active = !1, this.tab?.deactivate(), this._selected = !1, this.tabIndex = -1;
-		}
-		activate() {
-			if (this.disabled) return;
-			let e = this.group?.labels || [], t = e.find((e) => e._selected);
-			t !== this && (t?.deactivate(), this.active = !0, this.tab?.activate(), this._selected = !0, this.tabIndex = 0, this.tab?.dispatchEvent(new Event("active", {
-				bubbles: !0,
-				composed: !0
-			})), this.group?.dispatchEvent(new CustomEvent("tabchange", {
-				bubbles: !0,
-				composed: !0,
-				detail: {
-					activeIndex: e.findIndex((e) => e === this),
-					activeTabLabel: this,
-					activeTab: this.tab,
-					previousIndex: e.findIndex((e) => e === t),
-					previousTabLabel: t,
-					previousTab: t?.tab
-				}
-			})));
-		}
-		linkToTab() {
-			this.tab && (this.internals.ariaControlsElements = [this.tab]);
-		}
-		render() {
-			let e = `h${Number(this.level) < 7 ? this.level : "1"}`;
-			return l`
-        <${u(e)} class="sbb-tab-label">
-          <span class="sbb-tab-label__icon">
-            ${this.renderIconSlot()}
-          </span>
-          <span class="sbb-tab-label__text">
-            <slot></slot>
-          </span>
-          <p class="sbb-tab-label__amount">
-            <slot name="amount">${this.amount}</slot>
-          </p>
-        </${u(e)}>
-    `;
-		}
-	};
-})();
-//#endregion
-export { m as t };

package/table.css

@@ -1,270 +0,0 @@
-: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);
-  --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-4x);
-  --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
-  --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
-}
-
-.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-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);
-  table-layout: auto;
-  text-align: left;
-}
-.sbb-table th,
-.sbb-table-m th,
-.sbb-table-s th,
-.sbb-table-xs th {
-  font-size: var(--sbb-table-header-cell-font-size);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
-  font-weight: bold;
-  background-color: var(--sbb-table-background-color);
-  border-block-end: var(--sbb-table-border);
-  border-inline-end: var(--sbb-table-border);
-  padding-block: var(--sbb-table-header-padding-block);
-  padding-inline: var(--sbb-table-header-padding-inline);
-}
-.sbb-table td,
-.sbb-table-m td,
-.sbb-table-s td,
-.sbb-table-xs td {
-  font-size: var(--sbb-table-data-cell-font-size);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
-  background-color: var(--sbb-table-background-color);
-  border-block-end: var(--sbb-table-border);
-  border-inline-end: var(--sbb-table-border);
-  padding-block: var(--sbb-table-cell-padding-block);
-  padding-inline: var(--sbb-table-cell-padding-inline);
-}
-.sbb-table :is(th, td).sbb-table-group-with-next,
-.sbb-table-m :is(th, td).sbb-table-group-with-next,
-.sbb-table-s :is(th, td).sbb-table-group-with-next,
-.sbb-table-xs :is(th, td).sbb-table-group-with-next {
-  border-inline-end: none;
-}
-.sbb-table :is(th, td):first-child,
-.sbb-table-m :is(th, td):first-child,
-.sbb-table-s :is(th, td):first-child,
-.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),
-.sbb-table-s:has(thead tr) thead tr:first-of-type > :is(th, td),
-.sbb-table-s:not(:has(thead tr)) tbody tr:first-of-type > :is(th, td),
-.sbb-table-xs:has(thead tr) thead tr:first-of-type > :is(th, td),
-.sbb-table-xs:not(:has(thead tr)) tbody tr:first-of-type > :is(th, td) {
-  border-block-start: var(--sbb-table-border);
-}
-.sbb-table thead > tr:has(+ tr) > :is(th, td),
-.sbb-table-m thead > tr:has(+ tr) > :is(th, td),
-.sbb-table-s thead > tr:has(+ tr) > :is(th, td),
-.sbb-table-xs thead > tr:has(+ tr) > :is(th, td) {
-  border-block-end: none;
-}
-.sbb-table caption,
-.sbb-table-m caption,
-.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)
-  );
-  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));
-  margin-block-start: var(--sbb-table-caption-margin-block-start, var(--sbb-spacing-fixed-4x));
-  text-align: left;
-}
-
-.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-s);
-  --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
-  --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-4x);
-  --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
-  --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
-}
-
-.sbb-table-s {
-  --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-xs {
-  --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: 0;
-  --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-1x);
-  --sbb-table-cell-padding-block: 0;
-  --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-1x);
-}
-
-sbb-table-wrapper[negative] .sbb-table,
-.sbb-table--negative {
-  --sbb-table-border-color: var(--sbb-color-anthracite);
-  --sbb-table-background-color: var(--sbb-background-color-1-negative);
-  --sbb-table-color: var(--sbb-color-1-negative);
-  --sbb-table-row-striped-color: var(--sbb-background-color-3-negative);
-  --sbb-table-caption-color: var(--sbb-color-cement);
-}
-
-.sbb-table--striped tbody tr:nth-child(odd) :is(th, td) {
-  background-color: var(--sbb-table-row-striped-color);
-}
-
-.sbb-table--unstriped tbody tr:nth-child(odd) :is(th, td) {
-  background-color: var(--sbb-table-background-color);
-}
-
-.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-header-subtitle {
-  font-weight: normal;
-}
-
-.sbb-table-header-row:last-of-type > th {
-  border-block-end: var(--sbb-table-border);
-}
-
-.sbb-table-header-cell {
-  font-size: var(--sbb-table-header-cell-font-size);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
-  font-weight: bold;
-  background-color: var(--sbb-table-background-color);
-  border-block-end: var(--sbb-table-border);
-  border-inline-end: var(--sbb-table-border);
-  padding-block: var(--sbb-table-header-padding-block);
-  padding-inline: var(--sbb-table-header-padding-inline);
-}
-
-.sbb-table-row--striped {
-  background-color: var(--sbb-table-row-striped-color);
-}
-
-.sbb-table-data-cell {
-  font-size: var(--sbb-table-data-cell-font-size);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
-  background-color: var(--sbb-table-background-color);
-  border-block-end: var(--sbb-table-border);
-  border-inline-end: var(--sbb-table-border);
-  padding-block: var(--sbb-table-cell-padding-block);
-  padding-inline: var(--sbb-table-cell-padding-inline);
-}
-
-.sbb-table-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));
-  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));
-  margin-block-start: var(--sbb-table-caption-margin-block-start, var(--sbb-spacing-fixed-4x));
-  text-align: left;
-}
-
-.sbb-table-filter {
-  padding-block-start: 0 !important;
-}
-
-.sbb-table-sticky {
-  position: sticky !important;
-}
-
-:is(.sbb-table-sticky-border-elem-left, .sbb-table-sticky-border-elem-right)::after {
-  content: "";
-  transition-timing-function: var(--sbb-table-sticky-shadow-transition-easing);
-  transition-duration: var(--sbb-table-sticky-shadow-transition-duration);
-  transition-property: visibility, opacity;
-  visibility: hidden;
-  opacity: 0;
-  position: absolute;
-  width: var(--sbb-table-sticky-shadow-width);
-  inset: 0;
-}
-
-:is(.sbb-table-wrapper-offset-left, .sbb-table-wrapper-offset-both) .sbb-table-sticky-border-elem-left {
-  border-inline-end: var(--sbb-table-border);
-}
-:is(.sbb-table-wrapper-offset-left, .sbb-table-wrapper-offset-both) .sbb-table-sticky-border-elem-left::after {
-  visibility: visible;
-  opacity: 1;
-  background-image: linear-gradient(-270deg, rgba(0, 0, 0, 0.1) 0%, transparent 100%);
-  inset-inline-start: unset;
-  inset-inline-end: calc(var(--sbb-table-sticky-shadow-width) * -1 - 1px);
-}
-
-:is(.sbb-table-wrapper-offset-right, .sbb-table-wrapper-offset-both) .sbb-table-sticky-border-elem-right {
-  border-inline-start: var(--sbb-table-border);
-}
-:is(.sbb-table-wrapper-offset-right, .sbb-table-wrapper-offset-both) .sbb-table-sticky-border-elem-right::after {
-  visibility: visible;
-  opacity: 1;
-  background-image: linear-gradient(270deg, rgba(0, 0, 0, 0.1) 0%, transparent 100%);
-  inset-inline-start: calc(var(--sbb-table-sticky-shadow-width) * -1 - 1px);
-  inset-inline-end: unset;
-}
-
-.sbb-table-align-start {
-  text-align: start;
-}
-
-.sbb-table-align-center {
-  text-align: center;
-}
-
-.sbb-table-align-end {
-  text-align: end;
-}
-
-.sbb-table-align-justify {
-  text-align: justify;
-}
-
-.sbb-table-align-left {
-  text-align: left;
-}
-
-.sbb-table-align-right {
-  text-align: right;
-}

package/timetable-form.css

@@ -1,73 +0,0 @@
-.sbb-timetable-form {
-  --sbb-timetable-form-content-max-width: 46.25rem;
-  position: relative;
-  display: flex;
-  flex-direction: column;
-  column-gap: var(--sbb-spacing-fixed-3x);
-  border-radius: var(--sbb-border-radius-4x);
-  padding-block: var(--sbb-spacing-fixed-10x) var(--sbb-spacing-responsive-l);
-  padding-inline: var(--sbb-spacing-fixed-5x);
-  background: linear-gradient(to bottom, var(--sbb-color-primary) 0 11.125rem, var(--sbb-background-color-3) 11.125rem 100%);
-}
-@media (max-width: calc(63.9375rem)) {
-  .sbb-timetable-form:has(sbb-signet) {
-    padding-block-start: var(--sbb-spacing-fixed-4x);
-  }
-}
-.sbb-timetable-form sbb-signet {
-  width: var(--sbb-spacing-fixed-16x);
-  align-self: end;
-  margin-block-end: var(--sbb-spacing-fixed-2x);
-  margin-inline: 0;
-}
-@media (min-width: calc(64rem)) {
-  .sbb-timetable-form sbb-signet {
-    position: absolute;
-    inset-block-start: var(--sbb-spacing-fixed-6x);
-    inset-inline-end: var(--sbb-spacing-fixed-6x);
-  }
-}
-.sbb-timetable-form > * {
-  margin-inline: auto;
-  max-width: var(--sbb-timetable-form-content-max-width);
-  width: 100%;
-}
-
-sbb-timetable-form sbb-date-input {
-  min-width: 8.3125rem;
-}
-sbb-timetable-form .sbb-timetable-form-block {
-  --sbb-form-field-focus-underline-z-index: 1;
-  width: 100%;
-  position: relative;
-}
-sbb-timetable-form .sbb-timetable-form-block::after {
-  content: "";
-  position: absolute;
-  border-block-end: var(--sbb-border-width-1x) solid var(--sbb-border-color-4-inverted);
-  inset-inline: var(--sbb-form-field-padding-inline);
-  inset-block-end: 0;
-}
-sbb-timetable-form .sbb-timetable-form-block sbb-datepicker-toggle {
-  margin-inline-end: var(--sbb-spacing-fixed-6x);
-}
-@media (max-width: calc(37.4375rem)) {
-  sbb-timetable-form .sbb-timetable-form-mobile-block {
-    --sbb-form-field-focus-underline-z-index: 1;
-    width: 100%;
-    position: relative;
-  }
-  sbb-timetable-form .sbb-timetable-form-mobile-block::after {
-    content: "";
-    position: absolute;
-    border-block-end: var(--sbb-border-width-1x) solid var(--sbb-border-color-4-inverted);
-    inset-inline: var(--sbb-form-field-padding-inline);
-    inset-block-end: 0;
-  }
-  sbb-timetable-form .sbb-timetable-form-mobile-block sbb-datepicker-toggle {
-    margin-inline-end: var(--sbb-spacing-fixed-6x);
-  }
-  sbb-timetable-form .sbb-timetable-form-mobile-hidden {
-    display: none;
-  }
-}

package/typography.css

@@ -1,67 +0,0 @@
-sub, sup {
-  font-size: 60%;
-  line-height: 0;
-  position: relative;
-  vertical-align: baseline;
-}
-
-sub {
-  bottom: -0.36em;
-}
-
-sup {
-  top: -0.5em;
-}
-
-.sbb-text-xxs,
-.sbb-text-xs,
-.sbb-text-s,
-.sbb-text-m,
-.sbb-text-l,
-.sbb-text-xl {
-  font-family: var(--sbb-typo-font-family);
-  font-weight: normal;
-  line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
-  font-size: var(--sbb-text-font-size);
-}
-
-.sbb-text-xxs {
-  --sbb-text-font-size: var(--sbb-text-font-size-xxs);
-}
-
-.sbb-text-xs {
-  --sbb-text-font-size: var(--sbb-text-font-size-xs);
-}
-
-.sbb-text-s {
-  --sbb-text-font-size: var(--sbb-text-font-size-s);
-}
-
-.sbb-text-m {
-  --sbb-text-font-size: var(--sbb-text-font-size-m);
-}
-
-.sbb-text-l {
-  --sbb-text-font-size: var(--sbb-text-font-size-l);
-}
-
-.sbb-text-xl {
-  --sbb-text-font-size: var(--sbb-text-font-size-xl);
-}
-
-.sbb-text--bold {
-  font-weight: bold;
-}
-
-.sbb-legend {
-  --sbb-text-font-size: var(--sbb-text-font-size-xs);
-  font-family: var(--sbb-typo-font-family);
-  font-weight: normal;
-  line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
-  font-size: var(--sbb-text-font-size);
-  padding: 0;
-  color: var(--sbb-color-granite);
-  color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
-}