@sbb-esta/lyne-elements-dev 5.9.0-dev.1789571498 → 5.9.0-dev.1789572289

package/calendar/_calendar.global.scss

@@ -5,7 +5,6 @@ $theme: 'standard' !default;
 @mixin base {
   --sbb-calendar-cell-background-color-hover: var(--sbb-background-color-3);
   --sbb-calendar-cell-background-color-active: var(--sbb-background-color-4);
-  --sbb-calendar-cell-padding: #{sbb.px-to-rem-build(2)};
   --sbb-calendar-cell-border-width: var(--sbb-border-width-2x);
   --sbb-calendar-cell-border-color-selected: var(--sbb-border-color-2);
   --sbb-calendar-cell-disabled-height: #{sbb.px-to-rem-build(1.5)};

package/checkbox/_checkbox.global.scss

@@ -24,6 +24,6 @@ $theme: 'standard' !default;
       ),
       $theme
     )};
-  --sbb-checkbox-label-color: var(--sbb-color-color-3);
+  --sbb-checkbox-label-color: var(--sbb-color-3);
   --sbb-checkbox-cursor: var(--sbb-cursor-pointer);
 }

package/core/styles/mixins/_layout.scss

@@ -10,6 +10,7 @@
 
   @include mediaqueries.mq($from: ultra) {
     // Subtract padding to get real max-width
+    // @protected --sbb-spacing-max-width
     max-width: var(
       --sbb-spacing-max-width,
       calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive))

package/development/footer.pure.js

@@ -5,7 +5,7 @@ import { html, unsafeStatic } from "lit/static-html.js";
 import { SbbElement, SbbNegativeMixin, forceType, screenReaderOnlyStyles } from "./core.js";
 
 //#region src/elements/footer/footer.scss?inline
-var footer_default = ":host {\n  --sbb-link-text-decoration-line: none;\n  display: block;\n}\n\n:host([negative]) {\n  --sbb-footer-background-color: var(--sbb-background-color-2-negative);\n  --sbb-footer-color: var(--sbb-color-1-negative);\n  --sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);\n}\n\n.sbb-footer {\n  font-size: var(--sbb-footer-font-size);\n  letter-spacing: var(--sbb-letter-spacing-text);\n  line-height: var(--sbb-typo-line-height-text);\n  color: var(--sbb-footer-color);\n  padding-block: var(--sbb-footer-padding-block);\n  background-color: var(--sbb-footer-background-color);\n}\n@media (forced-colors: active) {\n  .sbb-footer {\n    border-block-start: var(--sbb-border-width-1x) solid CanvasText;\n  }\n}\n\n:host(:not([expanded])) .sbb-footer-wrapper {\n  padding-inline: var(--sbb-page-spacing-padding, var(--sbb-layout-base-offset-responsive));\n  margin-inline: auto;\n  width: 100%;\n}\n@media (min-width: calc(90rem)) {\n  :host(:not([expanded])) .sbb-footer-wrapper {\n    max-width: var(--sbb-spacing-max-width, calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive)));\n  }\n}\n:host([expanded]) .sbb-footer-wrapper {\n  padding-inline: var(--sbb-page-spacing-padding, var(--sbb-spacing-responsive-xxs));\n}\n\n::slotted(.sbb-link-list-button-group) {\n  display: flex;\n  flex-direction: column;\n  gap: var(--sbb-spacing-fixed-6x);\n  align-items: flex-start;\n}\n\n:host([variant=clock-columns]) slot {\n  display: grid;\n  grid-template-columns: auto;\n  grid-template-rows: auto;\n  column-gap: var(--sbb-footer-gap-horizontal);\n}\n@media (min-width: calc(37.5rem)) {\n  :host([variant=clock-columns]) slot {\n    grid-template-columns: calc(50% - var(--sbb-footer-gap-horizontal) / 2);\n  }\n}\n@media (min-width: calc(90rem)) {\n  :host([variant=clock-columns]) slot {\n    max-width: var(--sbb-footer-content-max-width);\n    margin-inline: auto;\n    grid-template-columns: repeat(4, 1fr);\n  }\n}\n:host([variant=clock-columns]) ::slotted(*:not(:last-child, sbb-divider)) {\n  margin-block-end: var(--sbb-footer-gap-vertical);\n}\n:host([variant=clock-columns]) ::slotted(sbb-clock) {\n  width: var(--sbb-footer-clock-width);\n  grid-row: 1;\n}\n@media (min-width: calc(37.5rem)) {\n  :host([variant=clock-columns]) ::slotted(sbb-clock) {\n    align-self: start;\n    grid-row: 2;\n  }\n}\n@media (min-width: calc(90rem)) {\n  :host([variant=clock-columns]) ::slotted(sbb-clock) {\n    grid-row: 1;\n    grid-column: 4/5;\n    justify-self: end;\n  }\n}\n:host([variant=clock-columns]) ::slotted(sbb-divider) {\n  margin-block: calc(var(--sbb-spacing-responsive-xl) - var(--sbb-footer-gap-vertical)) var(--sbb-spacing-responsive-s);\n}\n@media (min-width: calc(37.5rem)) {\n  :host([variant=clock-columns]) ::slotted(sbb-divider) {\n    grid-row: 3;\n    grid-column: 1/4;\n    width: 100%;\n  }\n}\n@media (min-width: calc(90rem)) {\n  :host([variant=clock-columns]) ::slotted(sbb-divider) {\n    grid-row: 2;\n  }\n}\n@media (min-width: calc(37.5rem)) {\n  :host([variant=clock-columns]) ::slotted(:nth-child(-n+2)) {\n    grid-row: 1;\n  }\n  :host([variant=clock-columns]) ::slotted(:nth-child(3)),\n  :host([variant=clock-columns]) ::slotted(:nth-child(4)) {\n    grid-row: 2;\n  }\n  :host([variant=clock-columns]) ::slotted(*:last-child) {\n    grid-row: 4;\n  }\n}\n@media (min-width: calc(64rem)) {\n  :host([variant=clock-columns]) ::slotted(*:last-child) {\n    grid-column: 1/4;\n  }\n}\n@media (min-width: calc(90rem)) {\n  :host([variant=clock-columns]) ::slotted(:nth-child(-n+4)) {\n    grid-row: 1;\n  }\n  :host([variant=clock-columns]) ::slotted(*:last-child) {\n    grid-row: 3;\n  }\n  :host([variant=clock-columns]) ::slotted(sbb-divider),\n  :host([variant=clock-columns]) ::slotted(*:last-child) {\n    grid-column: 1/5;\n  }\n}\n";
+var footer_default = ":host {\n  --sbb-link-text-decoration-line: none;\n  display: block;\n}\n\n:host([negative]) {\n  --sbb-footer-background-color: var(--sbb-background-color-2-negative);\n  --sbb-footer-color: var(--sbb-color-1-negative);\n  --sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);\n}\n\n.sbb-footer {\n  font-size: var(--sbb-footer-font-size);\n  letter-spacing: var(--sbb-letter-spacing-text);\n  line-height: var(--sbb-typo-line-height-text);\n  color: var(--sbb-footer-color);\n  padding-block: var(--sbb-footer-padding-block);\n  background-color: var(--sbb-footer-background-color);\n}\n@media (forced-colors: active) {\n  .sbb-footer {\n    border-block-start: var(--sbb-border-width-1x) solid CanvasText;\n  }\n}\n\n:host(:not([expanded])) .sbb-footer-wrapper {\n  padding-inline: var(--sbb-page-spacing-padding, var(--sbb-layout-base-offset-responsive));\n  margin-inline: auto;\n  width: 100%;\n}\n@media (min-width: calc(90rem)) {\n  :host(:not([expanded])) .sbb-footer-wrapper {\n    max-width: var(--sbb-spacing-max-width, calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive)));\n  }\n}\n:host([expanded]) .sbb-footer-wrapper {\n  padding-inline: var(--sbb-page-spacing-padding, var(--sbb-spacing-responsive-xxs));\n}\n\n::slotted(.sbb-link-list-button-group) {\n  display: flex;\n  flex-direction: column;\n  gap: var(--sbb-spacing-fixed-6x);\n  align-items: flex-start;\n}\n\n:host([variant=clock-columns]) slot {\n  display: grid;\n  grid-template-columns: auto;\n  grid-template-rows: auto;\n  column-gap: var(--sbb-footer-gap-horizontal);\n}\n@media (min-width: calc(37.5rem)) {\n  :host([variant=clock-columns]) slot {\n    grid-template-columns: calc(50% - var(--sbb-footer-gap-horizontal) / 2);\n  }\n}\n@media (min-width: calc(90rem)) {\n  :host([variant=clock-columns]) slot {\n    margin-inline: auto;\n    grid-template-columns: repeat(4, 1fr);\n  }\n}\n:host([variant=clock-columns]) ::slotted(*:not(:last-child, sbb-divider)) {\n  margin-block-end: var(--sbb-footer-gap-vertical);\n}\n:host([variant=clock-columns]) ::slotted(sbb-clock) {\n  width: var(--sbb-footer-clock-width);\n  grid-row: 1;\n}\n@media (min-width: calc(37.5rem)) {\n  :host([variant=clock-columns]) ::slotted(sbb-clock) {\n    align-self: start;\n    grid-row: 2;\n  }\n}\n@media (min-width: calc(90rem)) {\n  :host([variant=clock-columns]) ::slotted(sbb-clock) {\n    grid-row: 1;\n    grid-column: 4/5;\n    justify-self: end;\n  }\n}\n:host([variant=clock-columns]) ::slotted(sbb-divider) {\n  margin-block: calc(var(--sbb-spacing-responsive-xl) - var(--sbb-footer-gap-vertical)) var(--sbb-spacing-responsive-s);\n}\n@media (min-width: calc(37.5rem)) {\n  :host([variant=clock-columns]) ::slotted(sbb-divider) {\n    grid-row: 3;\n    grid-column: 1/4;\n    width: 100%;\n  }\n}\n@media (min-width: calc(90rem)) {\n  :host([variant=clock-columns]) ::slotted(sbb-divider) {\n    grid-row: 2;\n  }\n}\n@media (min-width: calc(37.5rem)) {\n  :host([variant=clock-columns]) ::slotted(:nth-child(-n+2)) {\n    grid-row: 1;\n  }\n  :host([variant=clock-columns]) ::slotted(:nth-child(3)),\n  :host([variant=clock-columns]) ::slotted(:nth-child(4)) {\n    grid-row: 2;\n  }\n  :host([variant=clock-columns]) ::slotted(*:last-child) {\n    grid-row: 4;\n  }\n}\n@media (min-width: calc(64rem)) {\n  :host([variant=clock-columns]) ::slotted(*:last-child) {\n    grid-column: 1/4;\n  }\n}\n@media (min-width: calc(90rem)) {\n  :host([variant=clock-columns]) ::slotted(:nth-child(-n+4)) {\n    grid-row: 1;\n  }\n  :host([variant=clock-columns]) ::slotted(*:last-child) {\n    grid-row: 3;\n  }\n  :host([variant=clock-columns]) ::slotted(sbb-divider),\n  :host([variant=clock-columns]) ::slotted(*:last-child) {\n    grid-column: 1/5;\n  }\n}\n";
 
 //#endregion
 //#region src/elements/footer/footer.component.ts

package/development/form-field.pure.js

@@ -775,7 +775,7 @@ var SbbFormFieldClearElement = class extends SbbNegativeMixin(SbbButtonBaseEleme
 
 //#endregion
 //#region src/elements/form-field/hint/hint.scss?inline
-var hint_default = ":host {\n  --sbb-form-field-hint-font-size: var(--sbb-text-font-size-xxs);\n  display: inline-block;\n  color: var(--sbb-form-field-label-color);\n  font-size: var(--sbb-form-field-hint-font-size);\n  letter-spacing: var(--sbb-letter-spacing-text);\n  line-height: var(--sbb-typo-line-height-texts);\n}\n\n:host([negative]) {\n  --sbb-form-field-label-color: var(--sbb-color-5);\n}\n";
+var hint_default = ":host {\n  --sbb-form-field-hint-font-size: var(--sbb-text-font-size-xxs);\n  display: inline-block;\n  color: var(--sbb-form-field-label-color);\n  font-size: var(--sbb-form-field-hint-font-size);\n  letter-spacing: var(--sbb-letter-spacing-text);\n  line-height: var(--sbb-typo-line-height-text);\n}\n\n:host([negative]) {\n  --sbb-form-field-label-color: var(--sbb-color-5);\n}\n";
 
 //#endregion
 //#region src/elements/form-field/hint/hint.component.ts

package/development/logo.pure.js

@@ -432,7 +432,7 @@ const SbbNegativeMixin = (superClass) => {
 
 //#endregion
 //#region src/elements/logo/common/logo-common.scss?inline
-var logo_common_default = ":host {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: var(--sbb-logo-height);\n  background-color: var(--sbb-logo-background-color, none);\n}\n@media (forced-colors: active) {\n  :host {\n    --sbb-logo-word-mark-color: ButtonText !important;\n  }\n}\n\n:host([negative]) {\n  --sbb-logo-word-mark-color: var(--sbb-color-white);\n}\n\n.sbb-logo__svg-container {\n  display: flex;\n  height: var(--sbb-logo-svg-container-height, 100%);\n  width: 100%;\n}\n\nsvg {\n  width: 100%;\n  height: 100%;\n}\n\n#sbb-logo__word-mark {\n  fill: var(--sbb-logo-word-mark-color);\n}\n\n#sbb-logo__panel {\n  fill: var(--sbb-logo-panel-color);\n  stroke: var(--sbb-logo-panel-color);\n}\n\n#sbb-logo__signet {\n  fill: var(--sbb-logo-signet-color);\n}\n";
+var logo_common_default = ":host {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: var(--sbb-logo-height);\n}\n@media (forced-colors: active) {\n  :host {\n    --sbb-logo-word-mark-color: ButtonText !important;\n  }\n}\n\n:host([negative]) {\n  --sbb-logo-word-mark-color: var(--sbb-color-white);\n}\n\n.sbb-logo__svg-container {\n  display: flex;\n  height: var(--sbb-logo-svg-container-height, 100%);\n  width: 100%;\n}\n\nsvg {\n  width: 100%;\n  height: 100%;\n}\n\n#sbb-logo__word-mark {\n  fill: var(--sbb-logo-word-mark-color);\n}\n\n#sbb-logo__panel {\n  fill: var(--sbb-logo-panel-color);\n  stroke: var(--sbb-logo-panel-color);\n}\n\n#sbb-logo__signet {\n  fill: var(--sbb-logo-signet-color);\n}\n";
 
 //#endregion
 //#region src/elements/logo/common/logo-common.ts

package/development/popover.pure.js

@@ -7,7 +7,7 @@ import { IS_FOCUSABLE_QUERY, SbbEscapableOverlayController, SbbFocusTrapControll
 import { SbbSecondaryButtonElement } from "./button.pure.js";
 
 //#region src/elements/popover/popover-base/popover-base.scss?inline
-var popover_base_default = ":host {\n  --sbb-focus-outline-color: var(--sbb-focus-outline-color-default);\n  --sbb-focus-outline-color: light-dark(\n    var(--sbb-focus-outline-color-default),\n    var(--sbb-focus-outline-color-dark)\n  );\n  --sbb-popover-animation-duration: var(\n    --sbb-disable-animation-duration,\n    var(--sbb-animation-duration-4x)\n  );\n  --_sbb-popover-inset: 0 auto auto 0;\n  --_sbb-popover-translate: 0 var(--sbb-spacing-fixed-2x);\n  --_sbb-popover-box-shadow: var(--sbb-box-shadow-level-9-hard);\n  outline: none !important;\n  display: none;\n}\n\n:host(:is(:is(:state(state-opening),[state--state-opening]), :is(:state(state-opened),[state--state-opened]), :is(:state(state-closing),[state--state-closing]))) {\n  --_sbb-popover-inset: 0;\n  display: block;\n}\n\n:host(:is(:state(position-above),[state--position-above])) {\n  --_sbb-popover-translate: 0 calc(var(--sbb-spacing-fixed-2x) * -1);\n}\n\n.sbb-popover::after,\n.sbb-popover__content::before {\n  content: \"\";\n  position: absolute;\n  display: block;\n  width: var(--sbb-popover-arrow-size);\n  height: var(--sbb-popover-arrow-size);\n  left: var(--_sbb-popover-arrow-position-x, 0);\n  bottom: calc(100% - var(--sbb-popover-arrow-size) / 2);\n  background-color: var(--sbb-popover-background);\n  border-radius: var(--sbb-border-radius-2x) 0;\n  rotate: 45deg;\n}\n\n.sbb-popover__container {\n  position: fixed;\n  inset: var(--_sbb-popover-inset);\n  pointer-events: none;\n  z-index: var(--sbb-popover-z-index, var(--sbb-overlay-default-z-index));\n}\n\n.sbb-popover {\n  display: none;\n  position: var(--sbb-popover-position, absolute);\n  top: var(--_sbb-popover-position-y, 0);\n  bottom: unset;\n  left: var(--_sbb-popover-position-x, 0);\n  right: unset;\n  background-color: var(--sbb-popover-background);\n  max-width: var(--sbb-popover-max-width);\n  width: max-content;\n  padding: 0;\n  box-shadow: var(--_sbb-popover-box-shadow);\n  border: none;\n  border-radius: var(--sbb-popover-border-radius);\n  outline: none;\n  pointer-events: all;\n}\n:host(:focus-visible) .sbb-popover {\n  outline-offset: var(--sbb-focus-outline-offset);\n  outline: var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);\n}\n:host(:is(:is(:state(state-opening),[state--state-opening]), :is(:state(state-opened),[state--state-opened]), :is(:state(state-closing),[state--state-closing]))) .sbb-popover {\n  display: block;\n  animation-name: open;\n  animation-duration: var(--sbb-popover-animation-duration);\n  animation-timing-function: var(--sbb-popover-animation-easing);\n}\n:host(:is(:state(state-closing),[state--state-closing])) .sbb-popover {\n  pointer-events: none;\n  animation-name: close;\n  animation-duration: var(--sbb-popover-animation-duration);\n  animation-timing-function: var(--sbb-popover-animation-easing);\n}\n.sbb-popover::after {\n  z-index: -1;\n  box-shadow: var(--_sbb-popover-box-shadow);\n}\n@media (forced-colors: active) {\n  .sbb-popover::after {\n    outline: var(--sbb-border-width-1x) solid CanvasText;\n  }\n}\n:host(:is(:state(position-above),[state--position-above])) .sbb-popover::after {\n  top: calc(100% - var(--sbb-popover-arrow-size) / 2);\n}\n@media (forced-colors: active) {\n  .sbb-popover {\n    outline: var(--sbb-border-width-1x) solid CanvasText;\n  }\n}\n.sbb-popover::before {\n  content: \"\";\n  display: block;\n  position: absolute;\n  inset: 0;\n  z-index: -1;\n  background-color: transparent;\n}\n:host(:is(:state(position-below),[state--position-below])) .sbb-popover::before {\n  inset-block-start: calc(-1 * var(--sbb-spacing-fixed-6x));\n}\n:host(:is(:state(position-above),[state--position-above])) .sbb-popover::before {\n  inset-block-end: calc(-1 * var(--sbb-spacing-fixed-6x));\n}\n\n.sbb-popover__content {\n  border-radius: var(--sbb-popover-border-radius);\n  padding: var(--sbb-popover-padding);\n  outline: none;\n  background-color: var(--sbb-popover-background);\n}\n.sbb-popover__content::before {\n  clip-path: polygon(100% 0, 0% 0%, 0% 100%);\n}\n:host(:is(:state(position-above),[state--position-above])) .sbb-popover__content::before {\n  top: calc(100% - var(--sbb-popover-arrow-size) / 2);\n  clip-path: polygon(100% 0, 100% 100%, 0% 100%);\n}\n\n@keyframes open {\n  from {\n    opacity: 0;\n    translate: var(--_sbb-popover-translate);\n  }\n  to {\n    opacity: 1;\n    translate: 0;\n  }\n}\n@keyframes close {\n  from {\n    opacity: 1;\n    translate: 0;\n  }\n  to {\n    opacity: 0;\n    translate: var(--_sbb-popover-translate);\n  }\n}\n";
+var popover_base_default = ":host {\n  --sbb-focus-outline-color: var(--sbb-focus-outline-color-default);\n  --sbb-focus-outline-color: light-dark(\n    var(--sbb-focus-outline-color-default),\n    var(--sbb-focus-outline-color-dark)\n  );\n  --sbb-popover-animation-duration: var(\n    --sbb-disable-animation-duration,\n    var(--sbb-animation-duration-4x)\n  );\n  --_sbb-popover-inset: 0 auto auto 0;\n  --_sbb-popover-translate: 0 var(--sbb-spacing-fixed-2x);\n  --_sbb-popover-box-shadow: var(--sbb-box-shadow-level-9-hard);\n  outline: none !important;\n  display: none;\n}\n\n:host(:is(:is(:state(state-opening),[state--state-opening]), :is(:state(state-opened),[state--state-opened]), :is(:state(state-closing),[state--state-closing]))) {\n  --_sbb-popover-inset: 0;\n  display: block;\n}\n\n:host(:is(:state(position-above),[state--position-above])) {\n  --_sbb-popover-translate: 0 calc(var(--sbb-spacing-fixed-2x) * -1);\n}\n\n.sbb-popover::after,\n.sbb-popover__content::before {\n  content: \"\";\n  position: absolute;\n  display: block;\n  width: var(--sbb-popover-arrow-size);\n  height: var(--sbb-popover-arrow-size);\n  left: var(--_sbb-popover-arrow-position-x, 0);\n  bottom: calc(100% - var(--sbb-popover-arrow-size) / 2);\n  background-color: var(--sbb-popover-background);\n  border-radius: var(--sbb-border-radius-2x) 0;\n  rotate: 45deg;\n}\n\n.sbb-popover__container {\n  position: fixed;\n  inset: var(--_sbb-popover-inset);\n  pointer-events: none;\n  z-index: var(--sbb-popover-z-index, var(--sbb-overlay-default-z-index));\n}\n\n.sbb-popover {\n  display: none;\n  position: absolute;\n  top: var(--_sbb-popover-position-y, 0);\n  bottom: unset;\n  left: var(--_sbb-popover-position-x, 0);\n  right: unset;\n  background-color: var(--sbb-popover-background);\n  max-width: var(--sbb-popover-max-width);\n  width: max-content;\n  padding: 0;\n  box-shadow: var(--_sbb-popover-box-shadow);\n  border: none;\n  border-radius: var(--sbb-popover-border-radius);\n  outline: none;\n  pointer-events: all;\n}\n:host(:focus-visible) .sbb-popover {\n  outline-offset: var(--sbb-focus-outline-offset);\n  outline: var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);\n}\n:host(:is(:is(:state(state-opening),[state--state-opening]), :is(:state(state-opened),[state--state-opened]), :is(:state(state-closing),[state--state-closing]))) .sbb-popover {\n  display: block;\n  animation-name: open;\n  animation-duration: var(--sbb-popover-animation-duration);\n  animation-timing-function: var(--sbb-popover-animation-easing);\n}\n:host(:is(:state(state-closing),[state--state-closing])) .sbb-popover {\n  pointer-events: none;\n  animation-name: close;\n  animation-duration: var(--sbb-popover-animation-duration);\n  animation-timing-function: var(--sbb-popover-animation-easing);\n}\n.sbb-popover::after {\n  z-index: -1;\n  box-shadow: var(--_sbb-popover-box-shadow);\n}\n@media (forced-colors: active) {\n  .sbb-popover::after {\n    outline: var(--sbb-border-width-1x) solid CanvasText;\n  }\n}\n:host(:is(:state(position-above),[state--position-above])) .sbb-popover::after {\n  top: calc(100% - var(--sbb-popover-arrow-size) / 2);\n}\n@media (forced-colors: active) {\n  .sbb-popover {\n    outline: var(--sbb-border-width-1x) solid CanvasText;\n  }\n}\n.sbb-popover::before {\n  content: \"\";\n  display: block;\n  position: absolute;\n  inset: 0;\n  z-index: -1;\n  background-color: transparent;\n}\n:host(:is(:state(position-below),[state--position-below])) .sbb-popover::before {\n  inset-block-start: calc(-1 * var(--sbb-spacing-fixed-6x));\n}\n:host(:is(:state(position-above),[state--position-above])) .sbb-popover::before {\n  inset-block-end: calc(-1 * var(--sbb-spacing-fixed-6x));\n}\n\n.sbb-popover__content {\n  border-radius: var(--sbb-popover-border-radius);\n  padding: var(--sbb-popover-padding);\n  outline: none;\n  background-color: var(--sbb-popover-background);\n}\n.sbb-popover__content::before {\n  clip-path: polygon(100% 0, 0% 0%, 0% 100%);\n}\n:host(:is(:state(position-above),[state--position-above])) .sbb-popover__content::before {\n  top: calc(100% - var(--sbb-popover-arrow-size) / 2);\n  clip-path: polygon(100% 0, 100% 100%, 0% 100%);\n}\n\n@keyframes open {\n  from {\n    opacity: 0;\n    translate: var(--_sbb-popover-translate);\n  }\n  to {\n    opacity: 1;\n    translate: 0;\n  }\n}\n@keyframes close {\n  from {\n    opacity: 1;\n    translate: 0;\n  }\n  to {\n    opacity: 0;\n    translate: var(--_sbb-popover-translate);\n  }\n}\n";
 
 //#endregion
 //#region src/elements/popover/popover-base/popover-base.ts

package/development/title.pure.js

@@ -101,7 +101,7 @@ let SbbTitleBase = (() => {
 
 //#endregion
 //#region src/elements/title/title.scss?inline
-var title_default = ":host {\n  margin-block: var(--sbb-title-margin-block, 0);\n  margin-block: var(--sbb-heading-margin-block-1);\n}\n\n:host([negative]) {\n  --sbb-title-color: var(--sbb-color-3-negative);\n}\n\n:host(:where([level=\"2\"]:not([visual-level]), [visual-level=\"2\"])) {\n  margin-block: var(--sbb-heading-margin-block-2);\n}\n\n:host(:where([level=\"3\"]:not([visual-level]), [visual-level=\"3\"])) {\n  margin-block: var(--sbb-heading-margin-block-3);\n}\n\n:host(:where([level=\"4\"]:not([visual-level]), [visual-level=\"4\"])) {\n  margin-block: var(--sbb-heading-margin-block-4);\n}\n\n:host(:where([level=\"5\"]:not([visual-level]), [visual-level=\"5\"])) {\n  margin-block: var(--sbb-heading-margin-block-5);\n}\n\n:host(:where([level=\"6\"]:not([visual-level]), [visual-level=\"6\"])) {\n  margin-block: var(--sbb-heading-margin-block-6);\n}\n";
+var title_default = ":host {\n  margin-block: var(--sbb-heading-margin-block-1);\n}\n\n:host([negative]) {\n  --sbb-title-color: var(--sbb-color-3-negative);\n}\n\n:host(:where([level=\"2\"]:not([visual-level]), [visual-level=\"2\"])) {\n  margin-block: var(--sbb-heading-margin-block-2);\n}\n\n:host(:where([level=\"3\"]:not([visual-level]), [visual-level=\"3\"])) {\n  margin-block: var(--sbb-heading-margin-block-3);\n}\n\n:host(:where([level=\"4\"]:not([visual-level]), [visual-level=\"4\"])) {\n  margin-block: var(--sbb-heading-margin-block-4);\n}\n\n:host(:where([level=\"5\"]:not([visual-level]), [visual-level=\"5\"])) {\n  margin-block: var(--sbb-heading-margin-block-5);\n}\n\n:host(:where([level=\"6\"]:not([visual-level]), [visual-level=\"6\"])) {\n  margin-block: var(--sbb-heading-margin-block-6);\n}\n";
 
 //#endregion
 //#region src/elements/title/title.component.ts

package/footer.pure.js

@@ -1,4 +1,4 @@
-import{__esDecorate as e,__runInitializers as t}from"tslib";import{nothing as n,unsafeCSS as r}from"lit";import{property as i}from"lit/decorators.js";import{html as a,unsafeStatic as o}from"lit/static-html.js";import{SbbElement as s,SbbNegativeMixin as c,forceType as l,screenReaderOnlyStyles as u}from"./core.js";var d=`:host{--sbb-link-text-decoration-line:none;display:block}:host([negative]){--sbb-footer-background-color:var(--sbb-background-color-2-negative);--sbb-footer-color:var(--sbb-color-1-negative);--sbb-focus-outline-color:var(--sbb-focus-outline-color-dark)}.sbb-footer{font-size:var(--sbb-footer-font-size);letter-spacing:var(--sbb-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);color:var(--sbb-footer-color);padding-block:var(--sbb-footer-padding-block);background-color:var(--sbb-footer-background-color)}@media (forced-colors:active){.sbb-footer{border-block-start:var(--sbb-border-width-1x) solid CanvasText}}:host(:not([expanded])) .sbb-footer-wrapper{padding-inline:var(--sbb-page-spacing-padding,var(--sbb-layout-base-offset-responsive));width:100%;margin-inline:auto}@media (width>=90rem){:host(:not([expanded])) .sbb-footer-wrapper{max-width:var(--sbb-spacing-max-width,calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive)))}}:host([expanded]) .sbb-footer-wrapper{padding-inline:var(--sbb-page-spacing-padding,var(--sbb-spacing-responsive-xxs))}::slotted(.sbb-link-list-button-group){gap:var(--sbb-spacing-fixed-6x);flex-direction:column;align-items:flex-start;display:flex}:host([variant=clock-columns]) slot{column-gap:var(--sbb-footer-gap-horizontal);grid-template-rows:auto;grid-template-columns:auto;display:grid}@media (width>=37.5rem){:host([variant=clock-columns]) slot{grid-template-columns:calc(50% - var(--sbb-footer-gap-horizontal) / 2)}}@media (width>=90rem){:host([variant=clock-columns]) slot{max-width:var(--sbb-footer-content-max-width);grid-template-columns:repeat(4,1fr);margin-inline:auto}}:host([variant=clock-columns]) ::slotted(:not(:last-child,sbb-divider)){margin-block-end:var(--sbb-footer-gap-vertical)}:host([variant=clock-columns]) ::slotted(sbb-clock){width:var(--sbb-footer-clock-width);grid-row:1}@media (width>=37.5rem){:host([variant=clock-columns]) ::slotted(sbb-clock){grid-row:2;align-self:start}}@media (width>=90rem){:host([variant=clock-columns]) ::slotted(sbb-clock){grid-area:1/4/auto/5;justify-self:end}}:host([variant=clock-columns]) ::slotted(sbb-divider){margin-block:calc(var(--sbb-spacing-responsive-xl) - var(--sbb-footer-gap-vertical)) var(--sbb-spacing-responsive-s)}@media (width>=37.5rem){:host([variant=clock-columns]) ::slotted(sbb-divider){grid-area:3/1/auto/4;width:100%}}@media (width>=90rem){:host([variant=clock-columns]) ::slotted(sbb-divider){grid-row:2}}@media (width>=37.5rem){:host([variant=clock-columns]) ::slotted(:nth-child(-n+2)){grid-row:1}:host([variant=clock-columns]) ::slotted(:nth-child(3)),:host([variant=clock-columns]) ::slotted(:nth-child(4)){grid-row:2}:host([variant=clock-columns]) ::slotted(:last-child){grid-row:4}}@media (width>=64rem){:host([variant=clock-columns]) ::slotted(:last-child){grid-column:1/4}}@media (width>=90rem){:host([variant=clock-columns]) ::slotted(:nth-child(-n+4)){grid-row:1}:host([variant=clock-columns]) ::slotted(:last-child){grid-row:3}:host([variant=clock-columns]) ::slotted(sbb-divider),:host([variant=clock-columns]) ::slotted(:last-child){grid-column:1/5}}
+import{__esDecorate as e,__runInitializers as t}from"tslib";import{nothing as n,unsafeCSS as r}from"lit";import{property as i}from"lit/decorators.js";import{html as a,unsafeStatic as o}from"lit/static-html.js";import{SbbElement as s,SbbNegativeMixin as c,forceType as l,screenReaderOnlyStyles as u}from"./core.js";var d=`:host{--sbb-link-text-decoration-line:none;display:block}:host([negative]){--sbb-footer-background-color:var(--sbb-background-color-2-negative);--sbb-footer-color:var(--sbb-color-1-negative);--sbb-focus-outline-color:var(--sbb-focus-outline-color-dark)}.sbb-footer{font-size:var(--sbb-footer-font-size);letter-spacing:var(--sbb-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);color:var(--sbb-footer-color);padding-block:var(--sbb-footer-padding-block);background-color:var(--sbb-footer-background-color)}@media (forced-colors:active){.sbb-footer{border-block-start:var(--sbb-border-width-1x) solid CanvasText}}:host(:not([expanded])) .sbb-footer-wrapper{padding-inline:var(--sbb-page-spacing-padding,var(--sbb-layout-base-offset-responsive));width:100%;margin-inline:auto}@media (width>=90rem){:host(:not([expanded])) .sbb-footer-wrapper{max-width:var(--sbb-spacing-max-width,calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive)))}}:host([expanded]) .sbb-footer-wrapper{padding-inline:var(--sbb-page-spacing-padding,var(--sbb-spacing-responsive-xxs))}::slotted(.sbb-link-list-button-group){gap:var(--sbb-spacing-fixed-6x);flex-direction:column;align-items:flex-start;display:flex}:host([variant=clock-columns]) slot{column-gap:var(--sbb-footer-gap-horizontal);grid-template-rows:auto;grid-template-columns:auto;display:grid}@media (width>=37.5rem){:host([variant=clock-columns]) slot{grid-template-columns:calc(50% - var(--sbb-footer-gap-horizontal) / 2)}}@media (width>=90rem){:host([variant=clock-columns]) slot{grid-template-columns:repeat(4,1fr);margin-inline:auto}}:host([variant=clock-columns]) ::slotted(:not(:last-child,sbb-divider)){margin-block-end:var(--sbb-footer-gap-vertical)}:host([variant=clock-columns]) ::slotted(sbb-clock){width:var(--sbb-footer-clock-width);grid-row:1}@media (width>=37.5rem){:host([variant=clock-columns]) ::slotted(sbb-clock){grid-row:2;align-self:start}}@media (width>=90rem){:host([variant=clock-columns]) ::slotted(sbb-clock){grid-area:1/4/auto/5;justify-self:end}}:host([variant=clock-columns]) ::slotted(sbb-divider){margin-block:calc(var(--sbb-spacing-responsive-xl) - var(--sbb-footer-gap-vertical)) var(--sbb-spacing-responsive-s)}@media (width>=37.5rem){:host([variant=clock-columns]) ::slotted(sbb-divider){grid-area:3/1/auto/4;width:100%}}@media (width>=90rem){:host([variant=clock-columns]) ::slotted(sbb-divider){grid-row:2}}@media (width>=37.5rem){:host([variant=clock-columns]) ::slotted(:nth-child(-n+2)){grid-row:1}:host([variant=clock-columns]) ::slotted(:nth-child(3)),:host([variant=clock-columns]) ::slotted(:nth-child(4)){grid-row:2}:host([variant=clock-columns]) ::slotted(:last-child){grid-row:4}}@media (width>=64rem){:host([variant=clock-columns]) ::slotted(:last-child){grid-column:1/4}}@media (width>=90rem){:host([variant=clock-columns]) ::slotted(:nth-child(-n+4)){grid-row:1}:host([variant=clock-columns]) ::slotted(:last-child){grid-row:3}:host([variant=clock-columns]) ::slotted(sbb-divider),:host([variant=clock-columns]) ::slotted(:last-child){grid-column:1/5}}
 `;let f=(()=>{let f=c(s),p,m=[],h=[],g,_=[],v=[],y,b=[],x=[],S,C=[],w=[];return class extends f{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(f[Symbol.metadata]??null):void 0;p=[i({reflect:!0})],g=[l(),i({reflect:!0,type:Boolean})],y=[l(),i({attribute:`accessibility-title`})],S=[i({attribute:`accessibility-title-level`})],e(this,null,p,{kind:`accessor`,name:`variant`,static:!1,private:!1,access:{has:e=>`variant`in e,get:e=>e.variant,set:(e,t)=>{e.variant=t}},metadata:t},m,h),e(this,null,g,{kind:`accessor`,name:`expanded`,static:!1,private:!1,access:{has:e=>`expanded`in e,get:e=>e.expanded,set:(e,t)=>{e.expanded=t}},metadata:t},_,v),e(this,null,y,{kind:`accessor`,name:`accessibilityTitle`,static:!1,private:!1,access:{has:e=>`accessibilityTitle`in e,get:e=>e.accessibilityTitle,set:(e,t)=>{e.accessibilityTitle=t}},metadata:t},b,x),e(this,null,S,{kind:`accessor`,name:`accessibilityTitleLevel`,static:!1,private:!1,access:{has:e=>`accessibilityTitleLevel`in e,get:e=>e.accessibilityTitleLevel,set:(e,t)=>{e.accessibilityTitleLevel=t}},metadata:t},C,w),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-footer`}static{this.styles=[u,r(d)]}#e=t(this,m,`default`);get variant(){return this.#e}set variant(e){this.#e=e}#t=(t(this,h),t(this,_,!1));get expanded(){return this.#t}set expanded(e){this.#t=e}#n=(t(this,v),t(this,b,``));get accessibilityTitle(){return this.#n}set accessibilityTitle(e){this.#n=e}#r=(t(this,x),t(this,C,`1`));get accessibilityTitleLevel(){return this.#r}set accessibilityTitleLevel(e){this.#r=e}render(){let e=`h${this.accessibilityTitleLevel}`,t=a`<${o(e)} class="sbb-screen-reader-only"
         >${this.accessibilityTitle}</${o(e)}>`;return a`
       <footer class="sbb-footer">

package/form-field.pure.js

@@ -49,7 +49,7 @@ import{html as e,isServer as t,unsafeCSS as n}from"lit";import{SbbButtonBaseElem
           <slot name="error" @slotchange=${this._onSlotErrorChange}></slot>
         </div>
       </div>
-    `}}})();var O=class extends o(r){static{this.elementName=`sbb-form-field-clear`}static{this.elementDependencies=[v]}static{this.styles=[y]}constructor(){super(),this._language=new a(this),this.addEventListener?.(`click`,()=>this._handleClick())}connectedCallback(){super.connectedCallback(),this._formField=this.closest(`sbb-form-field`),this._formField&&(this.slot||=`suffix`,this.negative=this._formField.hasAttribute(`negative`))}async _handleClick(){let e=this._formField?.inputElement;e&&e.localName===`input`&&(this._formField?.clear(),e.focus(),e.dispatchEvent(new InputEvent(`input`,{bubbles:!0,composed:!0})),e.dispatchEvent(new Event(`change`,{bubbles:!0})))}willUpdate(e){super.willUpdate(e),this.internals.ariaLabel=l[this._language.current]}renderTemplate(){return e`<sbb-icon name="cross-small"></sbb-icon>`}},k=`:host{--sbb-form-field-hint-font-size:var(--sbb-text-font-size-xxs);color:var(--sbb-form-field-label-color);font-size:var(--sbb-form-field-hint-font-size);letter-spacing:var(--sbb-letter-spacing-text);line-height:var(--sbb-typo-line-height-texts);display:inline-block}:host([negative]){--sbb-form-field-label-color:var(--sbb-color-5)}
+    `}}})();var O=class extends o(r){static{this.elementName=`sbb-form-field-clear`}static{this.elementDependencies=[v]}static{this.styles=[y]}constructor(){super(),this._language=new a(this),this.addEventListener?.(`click`,()=>this._handleClick())}connectedCallback(){super.connectedCallback(),this._formField=this.closest(`sbb-form-field`),this._formField&&(this.slot||=`suffix`,this.negative=this._formField.hasAttribute(`negative`))}async _handleClick(){let e=this._formField?.inputElement;e&&e.localName===`input`&&(this._formField?.clear(),e.focus(),e.dispatchEvent(new InputEvent(`input`,{bubbles:!0,composed:!0})),e.dispatchEvent(new Event(`change`,{bubbles:!0})))}willUpdate(e){super.willUpdate(e),this.internals.ariaLabel=l[this._language.current]}renderTemplate(){return e`<sbb-icon name="cross-small"></sbb-icon>`}},k=`:host{--sbb-form-field-hint-font-size:var(--sbb-text-font-size-xxs);color:var(--sbb-form-field-label-color);font-size:var(--sbb-form-field-hint-font-size);letter-spacing:var(--sbb-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);display:inline-block}:host([negative]){--sbb-form-field-label-color:var(--sbb-color-5)}
 `,A=class extends o(i){constructor(){super(...arguments),this.formField=null}static{this.elementName=`sbb-hint`}static{this.styles=[n(k)]}connectedCallback(){super.connectedCallback(),this.slot||=`hint`,this.formField=this.closest?.(`sbb-form-field`),this.negative=this.formField?.hasAttribute(`negative`)??!1}render(){return e`<slot></slot>`}};const j=[100,50,25,10,0];let M=(()=>{let t=A,n,r=[],i=[];return class extends t{constructor(){super(...arguments),this.#e=h(this,r,0),this._language=(h(this,i),new a(this)),this._abortController=null}static{let e=typeof Symbol==`function`&&Symbol.metadata?Object.create(t[Symbol.metadata]??null):void 0;n=[_()],m(this,null,n,{kind:`accessor`,name:`_remainingCharacters`,static:!1,private:!1,access:{has:e=>`_remainingCharacters`in e,get:e=>e._remainingCharacters,set:(e,t)=>{e._remainingCharacters=t}},metadata:e},r,i),e&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:e})}static{this.elementName=`sbb-form-field-text-counter`}#e;get _remainingCharacters(){return this.#e}set _remainingCharacters(e){this.#e=e}connectedCallback(){super.connectedCallback(),this.internals.ariaHidden=`true`,this._abortController?.abort(),this._abortController=new AbortController,this.formField&&(this.formField.addEventListener(`ɵinput`,()=>this._onInputUpdate(),{signal:this._abortController.signal}),this.formField.addEventListener(`input`,()=>this._onInputUpdate(),{signal:this._abortController.signal}),this.formField.addEventListener(`ɵinputattributechange`,()=>this._onInputUpdate(),{signal:this._abortController.signal}),this.formField.addEventListener(`focusin`,e=>{e.target===this.formField?.inputElement&&(this.internals.ariaLabel=this._infoText())},{signal:this._abortController.signal}),this._onInputUpdate())}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort()}_onInputUpdate(){let e=this.formField?.inputElement;if(!e)return;let t=e.maxLength??0,n=e.value?.length??0;this._remainingCharacters=Math.max(t-n,0),[...j.map(e=>Math.round(e/100*t))].includes(this._remainingCharacters)&&p.announce(this._infoText())}_infoText(){return`${this._remainingCharacters} ${u[this._language.current]}`}render(){return e`${this._remainingCharacters}<slot>
         ${u[this._language.current]}</slot
       >`}}})();export{x as SbbErrorElement,O as SbbFormFieldClearElement,E as SbbFormFieldControlEvent,D as SbbFormFieldElement,M as SbbFormFieldTextCounterElement,A as SbbHintElement};

package/lean-off-brand-theme.css

@@ -1167,7 +1167,6 @@ summary {
   --sbb-mini-button-group-padding-inline: var(--sbb-mini-button-group-padding-inline-s);
   --sbb-calendar-cell-background-color-hover: var(--sbb-background-color-3);
   --sbb-calendar-cell-background-color-active: var(--sbb-background-color-4);
-  --sbb-calendar-cell-padding: 0.125rem;
   --sbb-calendar-cell-border-width: var(--sbb-border-width-2x);
   --sbb-calendar-cell-border-color-selected: var(--sbb-border-color-2);
   --sbb-calendar-cell-disabled-height: 0.09375rem;
@@ -1232,7 +1231,7 @@ summary {
   --sbb-checkbox-dimension-m: var(--sbb-size-icon-ui-small);
   --sbb-checkbox-dimension: var(--sbb-checkbox-dimension-xs);
   --sbb-checkbox-font-size: var(--sbb-text-font-size-xs);
-  --sbb-checkbox-label-color: var(--sbb-color-color-3);
+  --sbb-checkbox-label-color: var(--sbb-color-3);
   --sbb-checkbox-cursor: var(--sbb-cursor-pointer);
   --sbb-chip-background-color: var(--sbb-background-color-3);
   --sbb-chip-background-color-active: var(--sbb-background-color-1);
@@ -1537,7 +1536,6 @@ summary {
   --sbb-notification-font-size: var(--sbb-text-font-size-xs);
   --sbb-notification-padding-block: var(--sbb-spacing-responsive-xxxs);
   --sbb-notification-padding-inline: var(--sbb-spacing-responsive-xxs);
-  --sbb-notification-content-margin-block-start: var(--sbb-spacing-fixed-2x);
   --sbb-notification-content-padding-inline: var(--sbb-spacing-responsive-xxxs) var(--sbb-spacing-responsive-xxs);
   --sbb-notification-close-wrapper-gap: var(--sbb-spacing-responsive-xxs);
   --sbb-notification-close-button-size: var(--sbb-button-min-height-size-s);

package/lean-safety-theme.css

@@ -1187,7 +1187,6 @@ summary {
   --sbb-mini-button-group-padding-inline: var(--sbb-mini-button-group-padding-inline-s);
   --sbb-calendar-cell-background-color-hover: var(--sbb-background-color-3);
   --sbb-calendar-cell-background-color-active: var(--sbb-background-color-4);
-  --sbb-calendar-cell-padding: 0.125rem;
   --sbb-calendar-cell-border-width: var(--sbb-border-width-2x);
   --sbb-calendar-cell-border-color-selected: var(--sbb-border-color-2);
   --sbb-calendar-cell-disabled-height: 0.09375rem;
@@ -1252,7 +1251,7 @@ summary {
   --sbb-checkbox-dimension-m: var(--sbb-size-icon-ui-small);
   --sbb-checkbox-dimension: var(--sbb-checkbox-dimension-xs);
   --sbb-checkbox-font-size: var(--sbb-text-font-size-xs);
-  --sbb-checkbox-label-color: var(--sbb-color-color-3);
+  --sbb-checkbox-label-color: var(--sbb-color-3);
   --sbb-checkbox-cursor: var(--sbb-cursor-pointer);
   --sbb-chip-background-color: var(--sbb-background-color-3);
   --sbb-chip-background-color-active: var(--sbb-background-color-1);
@@ -1557,7 +1556,6 @@ summary {
   --sbb-notification-font-size: var(--sbb-text-font-size-xs);
   --sbb-notification-padding-block: var(--sbb-spacing-responsive-xxxs);
   --sbb-notification-padding-inline: var(--sbb-spacing-responsive-xxs);
-  --sbb-notification-content-margin-block-start: var(--sbb-spacing-fixed-2x);
   --sbb-notification-content-padding-inline: var(--sbb-spacing-responsive-xxxs) var(--sbb-spacing-responsive-xxs);
   --sbb-notification-close-wrapper-gap: var(--sbb-spacing-responsive-xxs);
   --sbb-notification-close-button-size: var(--sbb-button-min-height-size-s);

package/lean-theme.css

@@ -1187,7 +1187,6 @@ summary {
   --sbb-mini-button-group-padding-inline: var(--sbb-mini-button-group-padding-inline-s);
   --sbb-calendar-cell-background-color-hover: var(--sbb-background-color-3);
   --sbb-calendar-cell-background-color-active: var(--sbb-background-color-4);
-  --sbb-calendar-cell-padding: 0.125rem;
   --sbb-calendar-cell-border-width: var(--sbb-border-width-2x);
   --sbb-calendar-cell-border-color-selected: var(--sbb-border-color-2);
   --sbb-calendar-cell-disabled-height: 0.09375rem;
@@ -1252,7 +1251,7 @@ summary {
   --sbb-checkbox-dimension-m: var(--sbb-size-icon-ui-small);
   --sbb-checkbox-dimension: var(--sbb-checkbox-dimension-xs);
   --sbb-checkbox-font-size: var(--sbb-text-font-size-xs);
-  --sbb-checkbox-label-color: var(--sbb-color-color-3);
+  --sbb-checkbox-label-color: var(--sbb-color-3);
   --sbb-checkbox-cursor: var(--sbb-cursor-pointer);
   --sbb-chip-background-color: var(--sbb-background-color-3);
   --sbb-chip-background-color-active: var(--sbb-background-color-1);
@@ -1557,7 +1556,6 @@ summary {
   --sbb-notification-font-size: var(--sbb-text-font-size-xs);
   --sbb-notification-padding-block: var(--sbb-spacing-responsive-xxxs);
   --sbb-notification-padding-inline: var(--sbb-spacing-responsive-xxs);
-  --sbb-notification-content-margin-block-start: var(--sbb-spacing-fixed-2x);
   --sbb-notification-content-padding-inline: var(--sbb-spacing-responsive-xxxs) var(--sbb-spacing-responsive-xxs);
   --sbb-notification-close-wrapper-gap: var(--sbb-spacing-responsive-xxs);
   --sbb-notification-close-button-size: var(--sbb-button-min-height-size-s);

package/link/_link.global.scss

@@ -82,6 +82,8 @@ $theme: 'standard' !default;
 @mixin hover-rules {
   @include sbb.hover-mq($hover: true) {
     color: var(--sbb-link-color-hover);
+
+    // @protected --sbb-link-hover-text-decoration
     text-decoration-line: var(--sbb-link-hover-text-decoration, underline);
   }
 }

package/logo.pure.js

@@ -1,5 +1,5 @@
 import{LitElement as e,html as t,isServer as n,unsafeCSS as r}from"lit";import{SbbElement as i}from"./core.js";import{__esDecorate as a,__runInitializers as o}from"tslib";import{property as s}from"lit/decorators.js";var c=`*,:before,:after{box-sizing:border-box}
-`;const l=n||!CSS.supports(`selector(:state(loading))`)?class extends Set{constructor(e){super(),this._host=e,this._applied=n,this._host.addController(this),n||Promise.resolve().then(()=>this._applyStates())}add(e){return this._applied&&this._toggleState(e,!0),super.add(e)}delete(e){return this._toggleState(e,!1),super.delete(e)}clear(){this.forEach(e=>this.delete(e))}hostConnected(){this._applyStates()}_toggleState(e,t){this._host.toggleAttribute(`state--${e}`,t)}_applyStates(){this._applied||(this._applied=!0,this.forEach(e=>this._toggleState(e,!0)))}}:null;if(!n){let e=0,t=e=>e.shadowRoot?.host??(e instanceof Element?e:(()=>{throw Error(`Unable to resolve related element! This should never happen.`)})()),n={attributes:!0,attributeFilter:[`id`]},r=(t,n,r)=>{let i=r[Element.name]??r[ElementInternals.name];t.setAttribute(n,i.id||=`aria-ref-${e++}`)},i=(t,n,r)=>{t.setAttribute(n,Object.values(r).reduce((e,t)=>e.concat(t)).filter((e,t,n)=>n.indexOf(e)===t).map(t=>t.id||=`aria-ref-${e++}`).join(` `))};for(let e of[ElementInternals,Element]){let a=e.prototype;if(!(`ariaActiveDescendantElement`in a)){let i=`aria-activedescendant`,o=new WeakMap;Object.defineProperty(a,"ariaActiveDescendantElement",{enumerable:!0,configurable:!0,get(){let e=t(this),n=e.getAttribute(i)?.split(/\s+/)[0]??null;return n?e.getRootNode().getElementById?.(n)??null:null},set(a){if(a!==null&&!(a instanceof Element))throw TypeError(`Failed to set the 'ariaActiveDescendantElement' property on '${e.name}': Failed to convert value to 'Element'.`);let s=t(this),c=o.get(s);if(c?.observer?.disconnect(),a===null)c&&(delete c.elements[e.name],Object.keys(c).length?c.observer.observe(Object.values(c.elements)[0],n):(o.delete(s),s.removeAttribute(i)));else if(c)c.elements[e.name]=a,r(s,i,c.elements),Object.values(c.elements).forEach(e=>c.observer.observe(e,n));else{let t={[e.name]:a};r(s,i,t);let c=new MutationObserver(()=>r(s,i,t));c.observe(a,n),o.set(s,{elements:t,observer:c})}}})}for(let r of[`ariaControlsElements`,`ariaDescribedByElements`,`ariaDetailsElements`,`ariaErrorMessageElements`,`ariaLabelledByElements`,`ariaOwnsElements`])if(!(r in a)){let o=new WeakMap,s=`aria-${r.slice(4,-8).toLowerCase()}`;Object.defineProperty(a,r,{enumerable:!0,configurable:!0,get(){let e=t(this),n=e.getAttribute(s)?.split(/\s+/).filter((e,t,n)=>n.indexOf(e)===t).map(t=>e.getRootNode().getElementById?.(t)).filter(e=>e instanceof Element);return n?.length?Object.freeze(n):null},set(a){if(a!==null&&(!Array.isArray(a)||a.some(e=>!(e instanceof Element))))throw TypeError(`Failed to set the '${r}' property on '${e.name}': Failed to convert value to 'Element'.`);let c=t(this);a=a?.filter((e,t,n)=>n.indexOf(e)===t)??null;let l=o.get(c);if(l?.observer?.disconnect(),a===null)l&&(delete l.elements[e.name],Object.keys(l.elements).length?Object.values(l.elements).reduce((e,t)=>e.concat(t)).forEach(e=>l.observer.observe(e,n)):o.delete(c));else if(l)l.elements[e.name]=a,i(c,s,l.elements),Object.values(l.elements).reduce((e,t)=>e.concat(t)).forEach(e=>l.observer.observe(e,n));else{let t={[e.name]:a};i(c,s,t);let r=new MutationObserver(()=>i(c,s,t));a.forEach(e=>r.observe(e,n)),o.set(c,{elements:t,observer:r})}}})}}}const u=new WeakMap;var d=class extends Event{constructor(e){super(`slottedchange`,{composed:!0}),this.slot=e}};(class extends e{static{this._$sbbElement$=!0}static{this.styles=[r(c)]}get hydrationComplete(){return this._hydrationComplete}get hydrationRequired(){return this._hydrationRequired}constructor(){if(super(),this.internals=this.attachInternals(),this._hydrationComplete=new Promise(e=>this._resolveHydration=e),u.set(this,this.internals),l)Object.defineProperty(this.internals,"states",{value:new l(this),writable:!1,configurable:!1,enumerable:!1});else for(let e of this.getAttributeNames().filter(e=>e.startsWith(`state--`)))this.internals.states.add(e.slice(7)),this.removeAttribute(e);let e=this.constructor.role;if(e&&(this.internals.role=e),this._hydrationRequired=!!this.shadowRoot,!this._hydrationRequired)this._resolveHydration(!1);else{let e=e=>{this._hydrationRequired&&e.stopImmediatePropagation()},t={capture:!0},n=this.shadowRoot?.querySelectorAll(`slot`);n?.length&&(n.forEach(n=>n.addEventListener(`slotchange`,e,t)),this.hydrationComplete.then(()=>n.forEach(n=>{n.removeEventListener(`slotchange`,e,t),n.assignedNodes().length&&n.dispatchEvent(new Event(`slotchange`,{bubbles:!0}))})))}}static define(){if(!this.elementName)throw Error(`The static property "elementName" is not defined on ${this.name}. Please define it to register the custom element.`);if(!customElements.get(this.elementName)){customElements.define(this.elementName,this);let e=[],t=this;for(;t._$sbbElement$;)Array.isArray(t.elementDependencies)&&e.push(...t.elementDependencies),t=Object.getPrototypeOf(t);new Set(e).forEach(e=>e.define())}}static finalizeStyles(t){let n=[],r=this;for(;r&&r!==e;)Object.hasOwn(r,`styles`)&&r.styles&&n.unshift(r.styles),r=Object.getPrototypeOf(r);return super.finalizeStyles(n)}createRenderRoot(){let e=super.createRenderRoot();return this.shadowRoot?.addEventListener(`slotchange`,e=>this._slotchangeHandler(e,e.target)),this.shadowRoot?.addEventListener(`slottedchange`,e=>this._slotchangeHandler(e,e.slot),{capture:!0}),this.shadowRoot?.querySelectorAll?.(`slot`).forEach(e=>this._handleSlotChangeForSlottedState(e)),e}addController(e){super.addController(e),(this._controllers??=new Set).add(e)}removeController(e){super.removeController(e),this._controllers?.delete(e)}requestUpdate(e,t,n,r,i){if(super.requestUpdate(e,t,n,r,i),e){let a={oldValue:t,value:r?i:this[e]};this._controllers?.forEach(t=>t.hostPropertyUpdate?.(e,a,n))}}update(e){super.update(e),this._hydrationRequired&&(this._hydrationRequired=!1,this._resolveHydration(!0))}toggleState(e,t){t||t!==!1&&!this.internals.states.has(e)?this.internals.states.add(e):this.internals.states.delete(e)}_slotchangeHandler(e,t){let n=this.shadowRoot.contains(t)?t:e.composedPath().find(e=>e instanceof HTMLSlotElement&&this.shadowRoot.contains(e));n&&this._handleSlotChangeForSlottedState(n)}_handleSlotChangeForSlottedState(e){this._updateSlottedState(e),e.name||this._observeTextNodesInSlot(e)}_updateSlottedState(e){let t=e.name?`slotted-${e.name}`:`slotted`,n=this._hasSlottedContent(e);n&&!this.internals.states.has(t)?(this.internals.states.add(t),this.dispatchEvent(new d(e))):!n&&this.internals.states.has(t)&&(this.internals.states.delete(t),this.dispatchEvent(new d(e)))}_observeTextNodesInSlot(e){this._textObserver?.disconnect(),this._textObserver??=new MutationObserver(()=>{let e=this.shadowRoot.querySelector(`slot:not([name])`);e?this._updateSlottedState(e):this._textObserver.disconnect()}),e.assignedNodes().filter(e=>e.nodeType===e.TEXT_NODE).forEach(e=>this._textObserver.observe(e,{characterData:!0}))}_hasSlottedContent(e){return e.name?e.assignedElements().some(e=>!(e instanceof HTMLSlotElement)||this._hasSlottedContent(e)):e.assignedNodes().some(e=>e instanceof HTMLSlotElement?this._hasSlottedContent(e):e.nodeType!==e.TEXT_NODE||!!e.textContent?.trim())}});const f=e=>(t,n)=>{let{kind:r,metadata:i,name:a}=n,o=globalThis.litPropertyMetadata.get(i)?.get(a)?.type??String;if(e??=o,e===String?e=e=>e==null?``:String(e):e===Number&&(e=e=>e==null?NaN:Number(e)),r===`accessor`)return{set(n){t.set.call(this,e(n))}};if(r===`setter`)return function(n){t.call(this,e(n))};throw Error(`Unsupported decorator location: ${r}`)},p=e=>(()=>{let t=e,n,r=[],i=[];return class extends t{static{let e=typeof Symbol==`function`&&Symbol.metadata?Object.create(t[Symbol.metadata]??null):void 0;n=[f(),s({reflect:!0,type:Boolean})],a(this,null,n,{kind:`accessor`,name:`negative`,static:!1,private:!1,access:{has:e=>`negative`in e,get:e=>e.negative,set:(e,t)=>{e.negative=t}},metadata:e},r,i),e&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:e})}#e=o(this,r,!1);get negative(){return this.#e}set negative(e){this.#e=e}constructor(){super(...arguments),o(this,i)}}})();var m=`:host{height:var(--sbb-logo-height);background-color:var(--sbb-logo-background-color,none);justify-content:center;align-items:center;display:flex}@media (forced-colors:active){:host{--sbb-logo-word-mark-color:ButtonText!important}}:host([negative]){--sbb-logo-word-mark-color:var(--sbb-color-white)}.sbb-logo__svg-container{height:var(--sbb-logo-svg-container-height,100%);width:100%;display:flex}svg{width:100%;height:100%}#sbb-logo__word-mark{fill:var(--sbb-logo-word-mark-color)}#sbb-logo__panel{fill:var(--sbb-logo-panel-color);stroke:var(--sbb-logo-panel-color)}#sbb-logo__signet{fill:var(--sbb-logo-signet-color)}
+`;const l=n||!CSS.supports(`selector(:state(loading))`)?class extends Set{constructor(e){super(),this._host=e,this._applied=n,this._host.addController(this),n||Promise.resolve().then(()=>this._applyStates())}add(e){return this._applied&&this._toggleState(e,!0),super.add(e)}delete(e){return this._toggleState(e,!1),super.delete(e)}clear(){this.forEach(e=>this.delete(e))}hostConnected(){this._applyStates()}_toggleState(e,t){this._host.toggleAttribute(`state--${e}`,t)}_applyStates(){this._applied||(this._applied=!0,this.forEach(e=>this._toggleState(e,!0)))}}:null;if(!n){let e=0,t=e=>e.shadowRoot?.host??(e instanceof Element?e:(()=>{throw Error(`Unable to resolve related element! This should never happen.`)})()),n={attributes:!0,attributeFilter:[`id`]},r=(t,n,r)=>{let i=r[Element.name]??r[ElementInternals.name];t.setAttribute(n,i.id||=`aria-ref-${e++}`)},i=(t,n,r)=>{t.setAttribute(n,Object.values(r).reduce((e,t)=>e.concat(t)).filter((e,t,n)=>n.indexOf(e)===t).map(t=>t.id||=`aria-ref-${e++}`).join(` `))};for(let e of[ElementInternals,Element]){let a=e.prototype;if(!(`ariaActiveDescendantElement`in a)){let i=`aria-activedescendant`,o=new WeakMap;Object.defineProperty(a,"ariaActiveDescendantElement",{enumerable:!0,configurable:!0,get(){let e=t(this),n=e.getAttribute(i)?.split(/\s+/)[0]??null;return n?e.getRootNode().getElementById?.(n)??null:null},set(a){if(a!==null&&!(a instanceof Element))throw TypeError(`Failed to set the 'ariaActiveDescendantElement' property on '${e.name}': Failed to convert value to 'Element'.`);let s=t(this),c=o.get(s);if(c?.observer?.disconnect(),a===null)c&&(delete c.elements[e.name],Object.keys(c).length?c.observer.observe(Object.values(c.elements)[0],n):(o.delete(s),s.removeAttribute(i)));else if(c)c.elements[e.name]=a,r(s,i,c.elements),Object.values(c.elements).forEach(e=>c.observer.observe(e,n));else{let t={[e.name]:a};r(s,i,t);let c=new MutationObserver(()=>r(s,i,t));c.observe(a,n),o.set(s,{elements:t,observer:c})}}})}for(let r of[`ariaControlsElements`,`ariaDescribedByElements`,`ariaDetailsElements`,`ariaErrorMessageElements`,`ariaLabelledByElements`,`ariaOwnsElements`])if(!(r in a)){let o=new WeakMap,s=`aria-${r.slice(4,-8).toLowerCase()}`;Object.defineProperty(a,r,{enumerable:!0,configurable:!0,get(){let e=t(this),n=e.getAttribute(s)?.split(/\s+/).filter((e,t,n)=>n.indexOf(e)===t).map(t=>e.getRootNode().getElementById?.(t)).filter(e=>e instanceof Element);return n?.length?Object.freeze(n):null},set(a){if(a!==null&&(!Array.isArray(a)||a.some(e=>!(e instanceof Element))))throw TypeError(`Failed to set the '${r}' property on '${e.name}': Failed to convert value to 'Element'.`);let c=t(this);a=a?.filter((e,t,n)=>n.indexOf(e)===t)??null;let l=o.get(c);if(l?.observer?.disconnect(),a===null)l&&(delete l.elements[e.name],Object.keys(l.elements).length?Object.values(l.elements).reduce((e,t)=>e.concat(t)).forEach(e=>l.observer.observe(e,n)):o.delete(c));else if(l)l.elements[e.name]=a,i(c,s,l.elements),Object.values(l.elements).reduce((e,t)=>e.concat(t)).forEach(e=>l.observer.observe(e,n));else{let t={[e.name]:a};i(c,s,t);let r=new MutationObserver(()=>i(c,s,t));a.forEach(e=>r.observe(e,n)),o.set(c,{elements:t,observer:r})}}})}}}const u=new WeakMap;var d=class extends Event{constructor(e){super(`slottedchange`,{composed:!0}),this.slot=e}};(class extends e{static{this._$sbbElement$=!0}static{this.styles=[r(c)]}get hydrationComplete(){return this._hydrationComplete}get hydrationRequired(){return this._hydrationRequired}constructor(){if(super(),this.internals=this.attachInternals(),this._hydrationComplete=new Promise(e=>this._resolveHydration=e),u.set(this,this.internals),l)Object.defineProperty(this.internals,"states",{value:new l(this),writable:!1,configurable:!1,enumerable:!1});else for(let e of this.getAttributeNames().filter(e=>e.startsWith(`state--`)))this.internals.states.add(e.slice(7)),this.removeAttribute(e);let e=this.constructor.role;if(e&&(this.internals.role=e),this._hydrationRequired=!!this.shadowRoot,!this._hydrationRequired)this._resolveHydration(!1);else{let e=e=>{this._hydrationRequired&&e.stopImmediatePropagation()},t={capture:!0},n=this.shadowRoot?.querySelectorAll(`slot`);n?.length&&(n.forEach(n=>n.addEventListener(`slotchange`,e,t)),this.hydrationComplete.then(()=>n.forEach(n=>{n.removeEventListener(`slotchange`,e,t),n.assignedNodes().length&&n.dispatchEvent(new Event(`slotchange`,{bubbles:!0}))})))}}static define(){if(!this.elementName)throw Error(`The static property "elementName" is not defined on ${this.name}. Please define it to register the custom element.`);if(!customElements.get(this.elementName)){customElements.define(this.elementName,this);let e=[],t=this;for(;t._$sbbElement$;)Array.isArray(t.elementDependencies)&&e.push(...t.elementDependencies),t=Object.getPrototypeOf(t);new Set(e).forEach(e=>e.define())}}static finalizeStyles(t){let n=[],r=this;for(;r&&r!==e;)Object.hasOwn(r,`styles`)&&r.styles&&n.unshift(r.styles),r=Object.getPrototypeOf(r);return super.finalizeStyles(n)}createRenderRoot(){let e=super.createRenderRoot();return this.shadowRoot?.addEventListener(`slotchange`,e=>this._slotchangeHandler(e,e.target)),this.shadowRoot?.addEventListener(`slottedchange`,e=>this._slotchangeHandler(e,e.slot),{capture:!0}),this.shadowRoot?.querySelectorAll?.(`slot`).forEach(e=>this._handleSlotChangeForSlottedState(e)),e}addController(e){super.addController(e),(this._controllers??=new Set).add(e)}removeController(e){super.removeController(e),this._controllers?.delete(e)}requestUpdate(e,t,n,r,i){if(super.requestUpdate(e,t,n,r,i),e){let a={oldValue:t,value:r?i:this[e]};this._controllers?.forEach(t=>t.hostPropertyUpdate?.(e,a,n))}}update(e){super.update(e),this._hydrationRequired&&(this._hydrationRequired=!1,this._resolveHydration(!0))}toggleState(e,t){t||t!==!1&&!this.internals.states.has(e)?this.internals.states.add(e):this.internals.states.delete(e)}_slotchangeHandler(e,t){let n=this.shadowRoot.contains(t)?t:e.composedPath().find(e=>e instanceof HTMLSlotElement&&this.shadowRoot.contains(e));n&&this._handleSlotChangeForSlottedState(n)}_handleSlotChangeForSlottedState(e){this._updateSlottedState(e),e.name||this._observeTextNodesInSlot(e)}_updateSlottedState(e){let t=e.name?`slotted-${e.name}`:`slotted`,n=this._hasSlottedContent(e);n&&!this.internals.states.has(t)?(this.internals.states.add(t),this.dispatchEvent(new d(e))):!n&&this.internals.states.has(t)&&(this.internals.states.delete(t),this.dispatchEvent(new d(e)))}_observeTextNodesInSlot(e){this._textObserver?.disconnect(),this._textObserver??=new MutationObserver(()=>{let e=this.shadowRoot.querySelector(`slot:not([name])`);e?this._updateSlottedState(e):this._textObserver.disconnect()}),e.assignedNodes().filter(e=>e.nodeType===e.TEXT_NODE).forEach(e=>this._textObserver.observe(e,{characterData:!0}))}_hasSlottedContent(e){return e.name?e.assignedElements().some(e=>!(e instanceof HTMLSlotElement)||this._hasSlottedContent(e)):e.assignedNodes().some(e=>e instanceof HTMLSlotElement?this._hasSlottedContent(e):e.nodeType!==e.TEXT_NODE||!!e.textContent?.trim())}});const f=e=>(t,n)=>{let{kind:r,metadata:i,name:a}=n,o=globalThis.litPropertyMetadata.get(i)?.get(a)?.type??String;if(e??=o,e===String?e=e=>e==null?``:String(e):e===Number&&(e=e=>e==null?NaN:Number(e)),r===`accessor`)return{set(n){t.set.call(this,e(n))}};if(r===`setter`)return function(n){t.call(this,e(n))};throw Error(`Unsupported decorator location: ${r}`)},p=e=>(()=>{let t=e,n,r=[],i=[];return class extends t{static{let e=typeof Symbol==`function`&&Symbol.metadata?Object.create(t[Symbol.metadata]??null):void 0;n=[f(),s({reflect:!0,type:Boolean})],a(this,null,n,{kind:`accessor`,name:`negative`,static:!1,private:!1,access:{has:e=>`negative`in e,get:e=>e.negative,set:(e,t)=>{e.negative=t}},metadata:e},r,i),e&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:e})}#e=o(this,r,!1);get negative(){return this.#e}set negative(e){this.#e=e}constructor(){super(...arguments),o(this,i)}}})();var m=`:host{height:var(--sbb-logo-height);justify-content:center;align-items:center;display:flex}@media (forced-colors:active){:host{--sbb-logo-word-mark-color:ButtonText!important}}:host([negative]){--sbb-logo-word-mark-color:var(--sbb-color-white)}.sbb-logo__svg-container{height:var(--sbb-logo-svg-container-height,100%);width:100%;display:flex}svg{width:100%;height:100%}#sbb-logo__word-mark{fill:var(--sbb-logo-word-mark-color)}#sbb-logo__panel{fill:var(--sbb-logo-panel-color);stroke:var(--sbb-logo-panel-color)}#sbb-logo__signet{fill:var(--sbb-logo-signet-color)}
 `;const h=e=>(()=>{let t=p(e),n,i=[],c=[],l,u=[],d=[];return class extends t{static{let e=typeof Symbol==`function`&&Symbol.metadata?Object.create(t[Symbol.metadata]??null):void 0;n=[s({attribute:`protective-room`,reflect:!0})],l=[f(),s({attribute:`accessibility-label`})],a(this,null,n,{kind:`accessor`,name:`protectiveRoom`,static:!1,private:!1,access:{has:e=>`protectiveRoom`in e,get:e=>e.protectiveRoom,set:(e,t)=>{e.protectiveRoom=t}},metadata:e},i,c),a(this,null,l,{kind:`accessor`,name:`accessibilityLabel`,static:!1,private:!1,access:{has:e=>`accessibilityLabel`in e,get:e=>e.accessibilityLabel,set:(e,t)=>{e.accessibilityLabel=t}},metadata:e},u,d),e&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:e})}static{this.styles=[r(m)]}#e=o(this,i,`ideal`);get protectiveRoom(){return this.#e}set protectiveRoom(e){this.#e=e}#t=(o(this,c),o(this,u,``));get accessibilityLabel(){return this.#t}set accessibilityLabel(e){this.#t=e}constructor(){super(...arguments),o(this,d)}}})();var g=`:host{aspect-ratio:var(--sbb-logo-aspect-ratio)}:host([protective-room=minimal]){--sbb-logo-aspect-ratio:502 / 96;--sbb-logo-svg-container-height:50%}:host([protective-room=ideal]){--sbb-logo-aspect-ratio:550 / 144;--sbb-logo-svg-container-height:calc(48 / 144 * 100%)}
 `,_=class extends h(i){static{this.elementName=`sbb-logo`}static{this.styles=[r(g)]}constructor(){super(),this.accessibilityLabel||=`Logo`}render(){return t`
       <span class="sbb-logo__svg-container">

package/notification/_notification.global.scss

@@ -29,7 +29,6 @@ $theme: 'standard' !default;
       ),
       $theme
     )};
-  --sbb-notification-content-margin-block-start: var(--sbb-spacing-fixed-2x);
   --sbb-notification-content-padding-inline: #{sbb.theme-pattern-select(
       (
         'standard': var(--sbb-spacing-responsive-xxxs) var(--sbb-spacing-responsive-xs),

package/off-brand-theme.css

@@ -1167,7 +1167,6 @@ summary {
   --sbb-mini-button-group-padding-inline: var(--sbb-mini-button-group-padding-inline-m);
   --sbb-calendar-cell-background-color-hover: var(--sbb-background-color-3);
   --sbb-calendar-cell-background-color-active: var(--sbb-background-color-4);
-  --sbb-calendar-cell-padding: 0.125rem;
   --sbb-calendar-cell-border-width: var(--sbb-border-width-2x);
   --sbb-calendar-cell-border-color-selected: var(--sbb-border-color-2);
   --sbb-calendar-cell-disabled-height: 0.09375rem;
@@ -1232,7 +1231,7 @@ summary {
   --sbb-checkbox-dimension-m: var(--sbb-size-icon-ui-small);
   --sbb-checkbox-dimension: var(--sbb-checkbox-dimension-m);
   --sbb-checkbox-font-size: var(--sbb-text-font-size-m);
-  --sbb-checkbox-label-color: var(--sbb-color-color-3);
+  --sbb-checkbox-label-color: var(--sbb-color-3);
   --sbb-checkbox-cursor: var(--sbb-cursor-pointer);
   --sbb-chip-background-color: var(--sbb-background-color-3);
   --sbb-chip-background-color-active: var(--sbb-background-color-1);
@@ -1537,7 +1536,6 @@ summary {
   --sbb-notification-font-size: var(--sbb-text-font-size-s);
   --sbb-notification-padding-block: var(--sbb-spacing-responsive-xxs);
   --sbb-notification-padding-inline: var(--sbb-spacing-responsive-xs);
-  --sbb-notification-content-margin-block-start: var(--sbb-spacing-fixed-2x);
   --sbb-notification-content-padding-inline: var(--sbb-spacing-responsive-xxxs) var(--sbb-spacing-responsive-xs);
   --sbb-notification-close-wrapper-gap: var(--sbb-spacing-responsive-xxs);
   --sbb-notification-close-button-size: var(--sbb-button-min-height-size-m);

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@sbb-esta/lyne-elements-dev",
-  "version": "5.9.0-dev.1789571498",
+  "version": "5.9.0-dev.1789572289",
   "description": "Lyne Design System",
   "keywords": [
     "design system",
     "web components",
     "lit",
-    "https://github.com/sbb-design-systems/lyne-components/commit/05c26b200d0ddd3261335debde6331f49ea08211"
+    "https://github.com/sbb-design-systems/lyne-components/commit/a593c3d279a4918c84581fc0d7536367248afdcd"
   ],
   "type": "module",
   "exports": {

package/popover.pure.js

@@ -1,4 +1,4 @@
-import{__esDecorate as e,__runInitializers as t}from"tslib";import{ResizeController as n}from"@lit-labs/observers/resize-controller.js";import{html as r,isServer as i,unsafeCSS as a}from"lit";import{property as o,state as s}from"lit/decorators.js";import{ref as c}from"lit/directives/ref.js";import{IS_FOCUSABLE_QUERY as l,SbbEscapableOverlayController as u,SbbFocusTrapController as d,SbbLanguageController as f,SbbMediaQueryPointerCoarse as p,SbbNegativeMixin as m,SbbOpenCloseBaseElement as h,SbbPropertyWatcherController as g,forceType as _,getElementPosition as v,i18nClosePopover as y,idReference as b,isEventOnElement as x,isFakeMousedownFromScreenReader as S,isZeroAnimationDuration as C,popoverResetStyles as w,readConfig as T,removeAriaOverlayTriggerProperties as E,sbbInputModalityDetector as D,scrollbarStyles as O,setAriaOverlayTriggerProperties as k,ɵstateController as A}from"./core.js";import{SbbSecondaryButtonElement as j}from"./button.pure.js";var M=`:host{--sbb-focus-outline-color:light-dark(var(--sbb-focus-outline-color-default),var(--sbb-focus-outline-color-dark));--sbb-popover-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-4x));--_sbb-popover-inset:0 auto auto 0;--_sbb-popover-translate:0 var(--sbb-spacing-fixed-2x);--_sbb-popover-box-shadow:var(--sbb-box-shadow-level-9-hard);display:none;outline:none!important}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))){--_sbb-popover-inset:0;display:block}:host(:is(:state(position-above),[state--position-above])){--_sbb-popover-translate:0 calc(var(--sbb-spacing-fixed-2x) * -1)}.sbb-popover:after,.sbb-popover__content:before{content:"";width:var(--sbb-popover-arrow-size);height:var(--sbb-popover-arrow-size);left:var(--_sbb-popover-arrow-position-x,0);bottom:calc(100% - var(--sbb-popover-arrow-size) / 2);background-color:var(--sbb-popover-background);border-radius:var(--sbb-border-radius-2x) 0;display:block;position:absolute;rotate:45deg}.sbb-popover__container{inset:var(--_sbb-popover-inset);pointer-events:none;z-index:var(--sbb-popover-z-index,var(--sbb-overlay-default-z-index));position:fixed}.sbb-popover{position:var(--sbb-popover-position,absolute);top:var(--_sbb-popover-position-y,0);bottom:unset;left:var(--_sbb-popover-position-x,0);right:unset;background-color:var(--sbb-popover-background);max-width:var(--sbb-popover-max-width);width:max-content;box-shadow:var(--_sbb-popover-box-shadow);border-radius:var(--sbb-popover-border-radius);pointer-events:all;border:none;outline:none;padding:0;display:none}:host(:focus-visible) .sbb-popover{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width)}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))) .sbb-popover{animation-name:open;animation-duration:var(--sbb-popover-animation-duration);animation-timing-function:var(--sbb-popover-animation-easing);display:block}:host(:is(:state(state-closing),[state--state-closing])) .sbb-popover{pointer-events:none;animation-name:close;animation-duration:var(--sbb-popover-animation-duration);animation-timing-function:var(--sbb-popover-animation-easing)}.sbb-popover:after{z-index:-1;box-shadow:var(--_sbb-popover-box-shadow)}@media (forced-colors:active){.sbb-popover:after{outline:var(--sbb-border-width-1x) solid CanvasText}}:host(:is(:state(position-above),[state--position-above])) .sbb-popover:after{top:calc(100% - var(--sbb-popover-arrow-size) / 2)}@media (forced-colors:active){.sbb-popover{outline:var(--sbb-border-width-1x) solid CanvasText}}.sbb-popover:before{content:"";z-index:-1;background-color:#0000;display:block;position:absolute;inset:0}:host(:is(:state(position-below),[state--position-below])) .sbb-popover:before{inset-block-start:calc(-1 * var(--sbb-spacing-fixed-6x))}:host(:is(:state(position-above),[state--position-above])) .sbb-popover:before{inset-block-end:calc(-1 * var(--sbb-spacing-fixed-6x))}.sbb-popover__content{border-radius:var(--sbb-popover-border-radius);padding:var(--sbb-popover-padding);background-color:var(--sbb-popover-background);outline:none}.sbb-popover__content:before{clip-path:polygon(100% 0,0% 0%,0% 100%)}:host(:is(:state(position-above),[state--position-above])) .sbb-popover__content:before{top:calc(100% - var(--sbb-popover-arrow-size) / 2);clip-path:polygon(100% 0,100% 100%,0% 100%)}@keyframes open{0%{opacity:0;translate:var(--_sbb-popover-translate)}to{opacity:1;translate:0}}@keyframes close{0%{opacity:1;translate:0}to{opacity:0;translate:var(--_sbb-popover-translate)}}
+import{__esDecorate as e,__runInitializers as t}from"tslib";import{ResizeController as n}from"@lit-labs/observers/resize-controller.js";import{html as r,isServer as i,unsafeCSS as a}from"lit";import{property as o,state as s}from"lit/decorators.js";import{ref as c}from"lit/directives/ref.js";import{IS_FOCUSABLE_QUERY as l,SbbEscapableOverlayController as u,SbbFocusTrapController as d,SbbLanguageController as f,SbbMediaQueryPointerCoarse as p,SbbNegativeMixin as m,SbbOpenCloseBaseElement as h,SbbPropertyWatcherController as g,forceType as _,getElementPosition as v,i18nClosePopover as y,idReference as b,isEventOnElement as x,isFakeMousedownFromScreenReader as S,isZeroAnimationDuration as C,popoverResetStyles as w,readConfig as T,removeAriaOverlayTriggerProperties as E,sbbInputModalityDetector as D,scrollbarStyles as O,setAriaOverlayTriggerProperties as k,ɵstateController as A}from"./core.js";import{SbbSecondaryButtonElement as j}from"./button.pure.js";var M=`:host{--sbb-focus-outline-color:light-dark(var(--sbb-focus-outline-color-default),var(--sbb-focus-outline-color-dark));--sbb-popover-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-4x));--_sbb-popover-inset:0 auto auto 0;--_sbb-popover-translate:0 var(--sbb-spacing-fixed-2x);--_sbb-popover-box-shadow:var(--sbb-box-shadow-level-9-hard);display:none;outline:none!important}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))){--_sbb-popover-inset:0;display:block}:host(:is(:state(position-above),[state--position-above])){--_sbb-popover-translate:0 calc(var(--sbb-spacing-fixed-2x) * -1)}.sbb-popover:after,.sbb-popover__content:before{content:"";width:var(--sbb-popover-arrow-size);height:var(--sbb-popover-arrow-size);left:var(--_sbb-popover-arrow-position-x,0);bottom:calc(100% - var(--sbb-popover-arrow-size) / 2);background-color:var(--sbb-popover-background);border-radius:var(--sbb-border-radius-2x) 0;display:block;position:absolute;rotate:45deg}.sbb-popover__container{inset:var(--_sbb-popover-inset);pointer-events:none;z-index:var(--sbb-popover-z-index,var(--sbb-overlay-default-z-index));position:fixed}.sbb-popover{top:var(--_sbb-popover-position-y,0);bottom:unset;left:var(--_sbb-popover-position-x,0);right:unset;background-color:var(--sbb-popover-background);max-width:var(--sbb-popover-max-width);width:max-content;box-shadow:var(--_sbb-popover-box-shadow);border-radius:var(--sbb-popover-border-radius);pointer-events:all;border:none;outline:none;padding:0;display:none;position:absolute}:host(:focus-visible) .sbb-popover{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width)}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))) .sbb-popover{animation-name:open;animation-duration:var(--sbb-popover-animation-duration);animation-timing-function:var(--sbb-popover-animation-easing);display:block}:host(:is(:state(state-closing),[state--state-closing])) .sbb-popover{pointer-events:none;animation-name:close;animation-duration:var(--sbb-popover-animation-duration);animation-timing-function:var(--sbb-popover-animation-easing)}.sbb-popover:after{z-index:-1;box-shadow:var(--_sbb-popover-box-shadow)}@media (forced-colors:active){.sbb-popover:after{outline:var(--sbb-border-width-1x) solid CanvasText}}:host(:is(:state(position-above),[state--position-above])) .sbb-popover:after{top:calc(100% - var(--sbb-popover-arrow-size) / 2)}@media (forced-colors:active){.sbb-popover{outline:var(--sbb-border-width-1x) solid CanvasText}}.sbb-popover:before{content:"";z-index:-1;background-color:#0000;display:block;position:absolute;inset:0}:host(:is(:state(position-below),[state--position-below])) .sbb-popover:before{inset-block-start:calc(-1 * var(--sbb-spacing-fixed-6x))}:host(:is(:state(position-above),[state--position-above])) .sbb-popover:before{inset-block-end:calc(-1 * var(--sbb-spacing-fixed-6x))}.sbb-popover__content{border-radius:var(--sbb-popover-border-radius);padding:var(--sbb-popover-padding);background-color:var(--sbb-popover-background);outline:none}.sbb-popover__content:before{clip-path:polygon(100% 0,0% 0%,0% 100%)}:host(:is(:state(position-above),[state--position-above])) .sbb-popover__content:before{top:calc(100% - var(--sbb-popover-arrow-size) / 2);clip-path:polygon(100% 0,100% 100%,0% 100%)}@keyframes open{0%{opacity:0;translate:var(--_sbb-popover-translate)}to{opacity:1;translate:0}}@keyframes close{0%{opacity:1;translate:0}to{opacity:0;translate:var(--_sbb-popover-translate)}}
 `;const N=new Set;var P=class extends Event{get closeTarget(){return this._closeTarget}constructor(e,{closeTarget:t,cancelable:n}){super(e,{cancelable:n}),this._closeTarget=t}};let F=(()=>{let s=h,f,p=[],m=[];return class extends s{constructor(){super(...arguments),this.#e=t(this,p,null),this._nextFocusedElement=t(this,m),this._skipCloseFocus=!1,this._resizeController=new n(this,{target:null,callback:()=>this._setPopoverPosition()}),this._escapableOverlayController=new u(this),this._focusTrapController=new d(this),this._blurTimeout=null,this._pointerDownListener=e=>{this._isPointerDownEventOnPopover=x(this.overlay,e)},this._closeOnBackdropClick=e=>{let t=e.composedPath();!this._isPointerDownEventOnPopover&&!x(this.overlay,e)&&(!this.trigger||!t.includes(this.trigger))&&(this._nextFocusedElement=t.filter(e=>e instanceof window.HTMLElement).find(e=>e.matches(l)),clearTimeout(this.closeTimeout),this.close())}}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(s[Symbol.metadata]??null):void 0;f=[b(),o()],e(this,null,f,{kind:`accessor`,name:`trigger`,static:!1,private:!1,access:{has:e=>`trigger`in e,get:e=>e.trigger,set:(e,t)=>{e.trigger=t}},metadata:t},p,m),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.styles=[w,a(M)]}#e;get trigger(){return this.#e}set trigger(e){this.#e=e}open(){if((this.state===`closed`||this.state===`closing`)&&this.overlay&&this.dispatchBeforeOpenEvent()){for(let e of N)(e.state===`opened`||e.state===`opening`)&&e.close();this.showPopover?.(),this.state=`opening`,this.inert=!0,this._setPopoverPosition(),this._attachWindowEvents(),this._escapableOverlayController.connect(),this._nextFocusedElement=void 0,this._skipCloseFocus=!1,this._triggerElement&&(this._triggerElement.ariaExpanded=`true`),this._isZeroAnimationDuration()&&this._handleOpening()}}close(e){(this.state===`opened`||this.state===`opening`)&&(this._popoverCloseElement=e,this.dispatchBeforeCloseEvent({closeTarget:e??null})&&(this.state=`closing`,this.inert=!0,this._triggerElement&&(this._triggerElement.ariaExpanded=`false`),this._isZeroAnimationDuration()&&this._handleClosing()))}_isZeroAnimationDuration(){return C(this,`--sbb-popover-animation-duration`)}_handleClosing(){this.state=`closed`,this.hidePopover?.(),this.overlay&&(this._resizeController.unobserve(this.overlay),this.overlay.firstElementChild?.scrollTo(0,0)),this.removeAttribute(`tabindex`),this._skipCloseFocus||(this._nextFocusedElement||this._triggerElement)?.focus(),this._escapableOverlayController.disconnect(),this._openStateController?.abort(),this._focusTrapController.enabled=!1,this.dispatchCloseEvent({closeTarget:this._popoverCloseElement??null})}_handleOpening(){this.state=`opened`,this.inert=!1,this._setPopoverFocus(),this._focusTrapController.enabled=!0,this.overlay&&this._resizeController.observe(this.overlay),this.dispatchOpenEvent()}connectedCallback(){this.popover=`manual`,super.connectedCallback(),this.state=`closed`,N.add(this),this.hasUpdated&&this._configureTrigger()}requestUpdate(e,t,n){super.requestUpdate(e,t,n),!i&&(!e||e===`trigger`||e===`hoverTrigger`)&&this.hasUpdated&&this._configureTrigger()}firstUpdated(e){super.firstUpdated(e),this._configureTrigger()}disconnectedCallback(){super.disconnectedCallback(),this._triggerElement=null,this._triggerAbortController?.abort(),this._openStateController?.abort(),N.delete(this),this._blurTimeout&&clearTimeout(this._blurTimeout)}_configureTrigger(){if(!i){if(this.hydrationRequired){this.hydrationComplete.then(()=>this._configureTrigger());return}this.configureTrigger(this._triggerElement??null)}}configureTrigger(e){this._triggerAbortController?.abort(),E(this._triggerElement),this._triggerElement=this.trigger,this._triggerElement&&(k(this,this._triggerElement,`dialog`,this.state),this._triggerAbortController=new AbortController,this.registerTriggerListeners(this._triggerAbortController.signal))}registerTriggerListeners(e){this._triggerElement.addEventListener(`click`,()=>this.open(),{signal:e})}_attachWindowEvents(){this._openStateController=new AbortController,document.addEventListener(`scroll`,()=>this._setPopoverPosition(),{passive:!0,signal:this._openStateController.signal,capture:!0}),window.addEventListener(`resize`,()=>this._setPopoverPosition(),{passive:!0,signal:this._openStateController.signal}),window.addEventListener(`pointerdown`,this._pointerDownListener,{signal:this._openStateController.signal}),window.addEventListener(`pointerup`,this._closeOnBackdropClick,{signal:this._openStateController.signal})}_closeOnSbbPopoverCloseClick(e){let t=e.composedPath().find((e,t,n)=>e instanceof HTMLElement&&t<n.indexOf(this)&&(e.hasAttribute(`sbb-popover-close`)||e.localName===`sbb-popover-close-button`)&&!e.hasAttribute(`disabled`));t&&(clearTimeout(this.closeTimeout),this.close(t))}_onPopoverAnimationEnd(e){e.animationName===`open`&&this.state===`opening`?this._handleOpening():e.animationName===`close`&&this.state===`closing`&&this._handleClosing()}_setPopoverFocus(){!this._focusTrapController.focusInitialElement()&&this._openStateController&&(this.setAttribute(`tabindex`,`0`),this.focus({preventScroll:!0}),this.addEventListener(`blur`,e=>{this._blurTimeout=setTimeout(()=>{if(document.visibilityState!==`hidden`){if(this.removeAttribute(`tabindex`),this.contains(e.relatedTarget)||e.relatedTarget===this.trigger)return;(this.state===`opened`||this.state===`opening`)&&(this._skipCloseFocus=!0),this.close()}})},{signal:this._openStateController.signal}))}_setPopoverPosition(){if(!this.overlay||!this._triggerElement)return;let e=v(this.overlay,this._triggerElement,this.shadowRoot.querySelector(`.sbb-popover__container`),{verticalOffset:16,horizontalOffset:32,centered:!0,responsiveHeight:!0}),t=e.alignment.vertical;for(let e of[`above`,`below`])this.toggleState(`position-${e}`,e===t);let n=this.overlay.offsetWidth,r=document.documentElement.clientWidth,i=Math.max(2,Math.min(e.left,r-n-2)),a=this._triggerElement.getBoundingClientRect(),o=parseFloat(getComputedStyle(this.overlay).borderTopLeftRadius)||0,s=a.left-i+a.width/2-8,c=Math.max(o,Math.min(s,n-o-16));this.style.setProperty(`--_sbb-popover-position-x`,`${i}px`),this.style.setProperty(`--_sbb-popover-position-y`,`${e.top}px`),this.style.setProperty(`--_sbb-popover-arrow-position-x`,`${c}px`),this.style.setProperty(`--_sbb-popover-max-height`,e.maxHeight)}dispatchBeforeCloseEvent(e){let t=e?.closeTarget??null;return this.dispatchEvent(new P(`beforeclose`,{closeTarget:t,cancelable:!0}))}dispatchCloseEvent(e){let t=e?.closeTarget??null;return this.dispatchEvent(new P(`close`,{closeTarget:t,cancelable:!1}))}render(){return r`
       <div class="sbb-popover__container">
         <div

package/safety-theme.css

@@ -1187,7 +1187,6 @@ summary {
   --sbb-mini-button-group-padding-inline: var(--sbb-mini-button-group-padding-inline-m);
   --sbb-calendar-cell-background-color-hover: var(--sbb-background-color-3);
   --sbb-calendar-cell-background-color-active: var(--sbb-background-color-4);
-  --sbb-calendar-cell-padding: 0.125rem;
   --sbb-calendar-cell-border-width: var(--sbb-border-width-2x);
   --sbb-calendar-cell-border-color-selected: var(--sbb-border-color-2);
   --sbb-calendar-cell-disabled-height: 0.09375rem;
@@ -1252,7 +1251,7 @@ summary {
   --sbb-checkbox-dimension-m: var(--sbb-size-icon-ui-small);
   --sbb-checkbox-dimension: var(--sbb-checkbox-dimension-m);
   --sbb-checkbox-font-size: var(--sbb-text-font-size-m);
-  --sbb-checkbox-label-color: var(--sbb-color-color-3);
+  --sbb-checkbox-label-color: var(--sbb-color-3);
   --sbb-checkbox-cursor: var(--sbb-cursor-pointer);
   --sbb-chip-background-color: var(--sbb-background-color-3);
   --sbb-chip-background-color-active: var(--sbb-background-color-1);
@@ -1557,7 +1556,6 @@ summary {
   --sbb-notification-font-size: var(--sbb-text-font-size-s);
   --sbb-notification-padding-block: var(--sbb-spacing-responsive-xxs);
   --sbb-notification-padding-inline: var(--sbb-spacing-responsive-xs);
-  --sbb-notification-content-margin-block-start: var(--sbb-spacing-fixed-2x);
   --sbb-notification-content-padding-inline: var(--sbb-spacing-responsive-xxxs) var(--sbb-spacing-responsive-xs);
   --sbb-notification-close-wrapper-gap: var(--sbb-spacing-responsive-xxs);
   --sbb-notification-close-button-size: var(--sbb-button-min-height-size-m);

package/standard-theme.css

@@ -1187,7 +1187,6 @@ summary {
   --sbb-mini-button-group-padding-inline: var(--sbb-mini-button-group-padding-inline-m);
   --sbb-calendar-cell-background-color-hover: var(--sbb-background-color-3);
   --sbb-calendar-cell-background-color-active: var(--sbb-background-color-4);
-  --sbb-calendar-cell-padding: 0.125rem;
   --sbb-calendar-cell-border-width: var(--sbb-border-width-2x);
   --sbb-calendar-cell-border-color-selected: var(--sbb-border-color-2);
   --sbb-calendar-cell-disabled-height: 0.09375rem;
@@ -1252,7 +1251,7 @@ summary {
   --sbb-checkbox-dimension-m: var(--sbb-size-icon-ui-small);
   --sbb-checkbox-dimension: var(--sbb-checkbox-dimension-m);
   --sbb-checkbox-font-size: var(--sbb-text-font-size-m);
-  --sbb-checkbox-label-color: var(--sbb-color-color-3);
+  --sbb-checkbox-label-color: var(--sbb-color-3);
   --sbb-checkbox-cursor: var(--sbb-cursor-pointer);
   --sbb-chip-background-color: var(--sbb-background-color-3);
   --sbb-chip-background-color-active: var(--sbb-background-color-1);
@@ -1557,7 +1556,6 @@ summary {
   --sbb-notification-font-size: var(--sbb-text-font-size-s);
   --sbb-notification-padding-block: var(--sbb-spacing-responsive-xxs);
   --sbb-notification-padding-inline: var(--sbb-spacing-responsive-xs);
-  --sbb-notification-content-margin-block-start: var(--sbb-spacing-fixed-2x);
   --sbb-notification-content-padding-inline: var(--sbb-spacing-responsive-xxxs) var(--sbb-spacing-responsive-xs);
   --sbb-notification-close-wrapper-gap: var(--sbb-spacing-responsive-xxs);
   --sbb-notification-close-button-size: var(--sbb-button-min-height-size-m);

package/title.pure.js

@@ -1,3 +1,3 @@
 import{__esDecorate as e,__runInitializers as t}from"tslib";import{unsafeCSS as n}from"lit";import{property as r}from"lit/decorators.js";import{html as i}from"lit/static-html.js";import{SbbElement as a,SbbNegativeMixin as o}from"./core.js";var s=`:host{letter-spacing:var(--sbb-letter-spacing-heading);font-weight:700;line-height:var(--sbb-typo-line-height-heading);color:var(--sbb-title-color);font-size:var(--sbb-heading-font-size-1);display:block}:host([id]){scroll-margin-block-start:var(--sbb-spacing-fixed-10x)}:host(:where([level="2"]:not([visual-level]),[visual-level="2"])){font-size:var(--sbb-heading-font-size-2)}:host(:where([level="3"]:not([visual-level]),[visual-level="3"])){font-size:var(--sbb-heading-font-size-3)}:host(:where([level="4"]:not([visual-level]),[visual-level="4"])){font-size:var(--sbb-heading-font-size-4)}:host(:where([level="5"]:not([visual-level]),[visual-level="5"])){font-size:var(--sbb-heading-font-size-5)}:host(:where([level="6"]:not([visual-level]),[visual-level="6"])){font-size:var(--sbb-heading-font-size-6);line-height:var(--sbb-typo-line-height-text)}
-`;let c=(()=>{let o=a,c,l=[],u=[],d,f=[],p=[];return class extends o{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(o[Symbol.metadata]??null):void 0;c=[r({reflect:!0})],d=[r({attribute:`visual-level`,reflect:!0})],e(this,null,c,{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},l,u),e(this,null,d,{kind:`accessor`,name:`visualLevel`,static:!1,private:!1,access:{has:e=>`visualLevel`in e,get:e=>e.visualLevel,set:(e,t)=>{e.visualLevel=t}},metadata:t},f,p),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.role=`heading`}static{this.styles=[n(s)]}#e=t(this,l,`1`);get level(){return this.#e}set level(e){this.#e=e}#t=(t(this,u),t(this,f,null));get visualLevel(){return this.#t}set visualLevel(e){this.#t=e}willUpdate(e){super.willUpdate(e),e.has(`level`)&&(this.internals.ariaLevel=this.level)}render(){return i`<slot></slot>`}constructor(){super(...arguments),t(this,p)}}})();var l=`:host{margin-block:var(--sbb-title-margin-block,0);margin-block:var(--sbb-heading-margin-block-1)}:host([negative]){--sbb-title-color:var(--sbb-color-3-negative)}:host(:where([level="2"]:not([visual-level]),[visual-level="2"])){margin-block:var(--sbb-heading-margin-block-2)}:host(:where([level="3"]:not([visual-level]),[visual-level="3"])){margin-block:var(--sbb-heading-margin-block-3)}:host(:where([level="4"]:not([visual-level]),[visual-level="4"])){margin-block:var(--sbb-heading-margin-block-4)}:host(:where([level="5"]:not([visual-level]),[visual-level="5"])){margin-block:var(--sbb-heading-margin-block-5)}:host(:where([level="6"]:not([visual-level]),[visual-level="6"])){margin-block:var(--sbb-heading-margin-block-6)}
+`;let c=(()=>{let o=a,c,l=[],u=[],d,f=[],p=[];return class extends o{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(o[Symbol.metadata]??null):void 0;c=[r({reflect:!0})],d=[r({attribute:`visual-level`,reflect:!0})],e(this,null,c,{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},l,u),e(this,null,d,{kind:`accessor`,name:`visualLevel`,static:!1,private:!1,access:{has:e=>`visualLevel`in e,get:e=>e.visualLevel,set:(e,t)=>{e.visualLevel=t}},metadata:t},f,p),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.role=`heading`}static{this.styles=[n(s)]}#e=t(this,l,`1`);get level(){return this.#e}set level(e){this.#e=e}#t=(t(this,u),t(this,f,null));get visualLevel(){return this.#t}set visualLevel(e){this.#t=e}willUpdate(e){super.willUpdate(e),e.has(`level`)&&(this.internals.ariaLevel=this.level)}render(){return i`<slot></slot>`}constructor(){super(...arguments),t(this,p)}}})();var l=`:host{margin-block:var(--sbb-heading-margin-block-1)}:host([negative]){--sbb-title-color:var(--sbb-color-3-negative)}:host(:where([level="2"]:not([visual-level]),[visual-level="2"])){margin-block:var(--sbb-heading-margin-block-2)}:host(:where([level="3"]:not([visual-level]),[visual-level="3"])){margin-block:var(--sbb-heading-margin-block-3)}:host(:where([level="4"]:not([visual-level]),[visual-level="4"])){margin-block:var(--sbb-heading-margin-block-4)}:host(:where([level="5"]:not([visual-level]),[visual-level="5"])){margin-block:var(--sbb-heading-margin-block-5)}:host(:where([level="6"]:not([visual-level]),[visual-level="6"])){margin-block:var(--sbb-heading-margin-block-6)}
 `;let u=(()=>{let i=o(c),a,s=[],u=[];return class extends i{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(i[Symbol.metadata]??null):void 0;a=[r({attribute:`visual-level`,reflect:!0})],e(this,null,a,{kind:`accessor`,name:`visualLevel`,static:!1,private:!1,access:{has:e=>`visualLevel`in e,get:e=>e.visualLevel,set:(e,t)=>{e.visualLevel=t}},metadata:t},s,u),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-title`}static{this.styles=[n(l)]}#e=t(this,s,null);get visualLevel(){return this.#e}set visualLevel(e){this.#e=e}constructor(){super(...arguments),t(this,u)}}})();export{c as SbbTitleBase,u as SbbTitleElement};