npm - @simai-studio/ui - Versions diffs - 0.0.0-stage → 5.20261019.1710 - Mend

@simai-studio/ui 0.0.0-stage → 5.20261019.1710

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (3356) hide show

package/distr/component/icon-buttons/css/icon-buttons.min.css ADDED Viewed

@@ -0,0 +1 @@

+ @property --sf-icon-button--border-top-width{syntax:"<length>";inherits:true;initial-value:0px}@property --sf-icon-button--border-bottom-width{syntax:"<length>";inherits:true;initial-value:0px}@property --sf-icon-button--border-inline-start-width{syntax:"<length>";inherits:true;initial-value:0px}@property --sf-icon-button--border-inline-end-width{syntax:"<length>";inherits:true;initial-value:0px}@layer sf.components{_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-icon-button{border-bottom-right-radius:var(--sf-icon-button--radius);border-bottom-right-radius:var(--sf-icon-button--border-bottom-right-radius, var(--sf-icon-button--radius))}@supports not (border-end-end-radius: initial){html:not([dir="rtl"]) .sf-icon-button{border-bottom-right-radius:var(--sf-icon-button--radius);border-bottom-right-radius:var(--sf-icon-button--border-bottom-right-radius, var(--sf-icon-button--radius))}}.sf-icon-button:where(:dir(ltr)){border-bottom-right-radius:var(--sf-icon-button--radius);border-bottom-right-radius:var(--sf-icon-button--border-bottom-right-radius, var(--sf-icon-button--radius))}_:-ms-input-placeholder, [dir="rtl"] .sf-icon-button{border-bottom-left-radius:var(--sf-icon-button--radius);border-bottom-left-radius:var(--sf-icon-button--border-bottom-right-radius, var(--sf-icon-button--radius))}@supports not (border-end-end-radius: initial){[dir="rtl"] .sf-icon-button{border-bottom-left-radius:var(--sf-icon-button--radius);border-bottom-left-radius:var(--sf-icon-button--border-bottom-right-radius, var(--sf-icon-button--radius))}}.sf-icon-button:where(:dir(rtl)){border-bottom-left-radius:var(--sf-icon-button--radius);border-bottom-left-radius:var(--sf-icon-button--border-bottom-right-radius, var(--sf-icon-button--radius))}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-icon-button{border-bottom-left-radius:var(--sf-icon-button--radius);border-bottom-left-radius:var(--sf-icon-button--border-bottom-left-radius, var(--sf-icon-button--radius))}@supports not (border-end-start-radius: initial){html:not([dir="rtl"]) .sf-icon-button{border-bottom-left-radius:var(--sf-icon-button--radius);border-bottom-left-radius:var(--sf-icon-button--border-bottom-left-radius, var(--sf-icon-button--radius))}}.sf-icon-button:where(:dir(ltr)){border-bottom-left-radius:var(--sf-icon-button--radius);border-bottom-left-radius:var(--sf-icon-button--border-bottom-left-radius, var(--sf-icon-button--radius))}_:-ms-input-placeholder, [dir="rtl"] .sf-icon-button{border-bottom-right-radius:var(--sf-icon-button--radius);border-bottom-right-radius:var(--sf-icon-button--border-bottom-left-radius, var(--sf-icon-button--radius))}@supports not (border-end-start-radius: initial){[dir="rtl"] .sf-icon-button{border-bottom-right-radius:var(--sf-icon-button--radius);border-bottom-right-radius:var(--sf-icon-button--border-bottom-left-radius, var(--sf-icon-button--radius))}}.sf-icon-button:where(:dir(rtl)){border-bottom-right-radius:var(--sf-icon-button--radius);border-bottom-right-radius:var(--sf-icon-button--border-bottom-left-radius, var(--sf-icon-button--radius))}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-icon-button{border-top-right-radius:var(--sf-icon-button--radius);border-top-right-radius:var(--sf-icon-button--border-top-right-radius, var(--sf-icon-button--radius))}@supports not (border-start-end-radius: initial){html:not([dir="rtl"]) .sf-icon-button{border-top-right-radius:var(--sf-icon-button--radius);border-top-right-radius:var(--sf-icon-button--border-top-right-radius, var(--sf-icon-button--radius))}}.sf-icon-button:where(:dir(ltr)){border-top-right-radius:var(--sf-icon-button--radius);border-top-right-radius:var(--sf-icon-button--border-top-right-radius, var(--sf-icon-button--radius))}_:-ms-input-placeholder, [dir="rtl"] .sf-icon-button{border-top-left-radius:var(--sf-icon-button--radius);border-top-left-radius:var(--sf-icon-button--border-top-right-radius, var(--sf-icon-button--radius))}@supports not (border-start-end-radius: initial){[dir="rtl"] .sf-icon-button{border-top-left-radius:var(--sf-icon-button--radius);border-top-left-radius:var(--sf-icon-button--border-top-right-radius, var(--sf-icon-button--radius))}}.sf-icon-button:where(:dir(rtl)){border-top-left-radius:var(--sf-icon-button--radius);border-top-left-radius:var(--sf-icon-button--border-top-right-radius, var(--sf-icon-button--radius))}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-icon-button{border-top-left-radius:var(--sf-icon-button--radius);border-top-left-radius:var(--sf-icon-button--border-top-left-radius, var(--sf-icon-button--radius))}@supports not (border-start-start-radius: initial){html:not([dir="rtl"]) .sf-icon-button{border-top-left-radius:var(--sf-icon-button--radius);border-top-left-radius:var(--sf-icon-button--border-top-left-radius, var(--sf-icon-button--radius))}}.sf-icon-button:where(:dir(ltr)){border-top-left-radius:var(--sf-icon-button--radius);border-top-left-radius:var(--sf-icon-button--border-top-left-radius, var(--sf-icon-button--radius))}_:-ms-input-placeholder, [dir="rtl"] .sf-icon-button{border-top-right-radius:var(--sf-icon-button--radius);border-top-right-radius:var(--sf-icon-button--border-top-left-radius, var(--sf-icon-button--radius))}@supports not (border-start-start-radius: initial){[dir="rtl"] .sf-icon-button{border-top-right-radius:var(--sf-icon-button--radius);border-top-right-radius:var(--sf-icon-button--border-top-left-radius, var(--sf-icon-button--radius))}}.sf-icon-button:where(:dir(rtl)){border-top-right-radius:var(--sf-icon-button--radius);border-top-right-radius:var(--sf-icon-button--border-top-left-radius, var(--sf-icon-button--radius))}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-icon-button{padding-left:calc(var(--sf-icon-button--padding-inline-start) - var(--sf-icon-button--border-inline-start-width))}@supports not (padding-inline-start: initial){html:not([dir="rtl"]) .sf-icon-button{padding-left:calc(var(--sf-icon-button--padding-inline-start) - var(--sf-icon-button--border-inline-start-width))}}.sf-icon-button:where(:dir(ltr)){padding-left:calc(var(--sf-icon-button--padding-inline-start) - var(--sf-icon-button--border-inline-start-width))}_:-ms-input-placeholder, [dir="rtl"] .sf-icon-button{padding-right:calc(var(--sf-icon-button--padding-inline-start) - var(--sf-icon-button--border-inline-start-width))}@supports not (padding-inline-start: initial){[dir="rtl"] .sf-icon-button{padding-right:calc(var(--sf-icon-button--padding-inline-start) - var(--sf-icon-button--border-inline-start-width))}}.sf-icon-button:where(:dir(rtl)){padding-right:calc(var(--sf-icon-button--padding-inline-start) - var(--sf-icon-button--border-inline-start-width))}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-icon-button{padding-right:calc(var(--sf-icon-button--padding-inline-end) - var(--sf-icon-button--border-inline-end-width))}@supports not (padding-inline-end: initial){html:not([dir="rtl"]) .sf-icon-button{padding-right:calc(var(--sf-icon-button--padding-inline-end) - var(--sf-icon-button--border-inline-end-width))}}.sf-icon-button:where(:dir(ltr)){padding-right:calc(var(--sf-icon-button--padding-inline-end) - var(--sf-icon-button--border-inline-end-width))}_:-ms-input-placeholder, [dir="rtl"] .sf-icon-button{padding-left:calc(var(--sf-icon-button--padding-inline-end) - var(--sf-icon-button--border-inline-end-width))}@supports not (padding-inline-end: initial){[dir="rtl"] .sf-icon-button{padding-left:calc(var(--sf-icon-button--padding-inline-end) - var(--sf-icon-button--border-inline-end-width))}}.sf-icon-button:where(:dir(rtl)){padding-left:calc(var(--sf-icon-button--padding-inline-end) - var(--sf-icon-button--border-inline-end-width))}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-icon-button{border-right-width:0;border-right-width:var(--sf-icon-button--border-inline-end-width, 0)}@supports not (border-inline-end-width: initial){html:not([dir="rtl"]) .sf-icon-button{border-right-width:0;border-right-width:var(--sf-icon-button--border-inline-end-width, 0)}}.sf-icon-button:where(:dir(ltr)){border-right-width:0;border-right-width:var(--sf-icon-button--border-inline-end-width, 0)}_:-ms-input-placeholder, [dir="rtl"] .sf-icon-button{border-left-width:0;border-left-width:var(--sf-icon-button--border-inline-end-width, 0)}@supports not (border-inline-end-width: initial){[dir="rtl"] .sf-icon-button{border-left-width:0;border-left-width:var(--sf-icon-button--border-inline-end-width, 0)}}.sf-icon-button:where(:dir(rtl)){border-left-width:0;border-left-width:var(--sf-icon-button--border-inline-end-width, 0)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-icon-button{border-left-width:0;border-left-width:var(--sf-icon-button--border-inline-start-width, 0)}@supports not (border-inline-start-width: initial){html:not([dir="rtl"]) .sf-icon-button{border-left-width:0;border-left-width:var(--sf-icon-button--border-inline-start-width, 0)}}.sf-icon-button:where(:dir(ltr)){border-left-width:0;border-left-width:var(--sf-icon-button--border-inline-start-width, 0)}_:-ms-input-placeholder, [dir="rtl"] .sf-icon-button{border-right-width:0;border-right-width:var(--sf-icon-button--border-inline-start-width, 0)}@supports not (border-inline-start-width: initial){[dir="rtl"] .sf-icon-button{border-right-width:0;border-right-width:var(--sf-icon-button--border-inline-start-width, 0)}}.sf-icon-button:where(:dir(rtl)){border-right-width:0;border-right-width:var(--sf-icon-button--border-inline-start-width, 0)}.sf-icon-button{color:var(--sf-on-surface-variant);color:var(--sf-icon--color, var(--sf-icon-button-color, var(--sf-on-surface-variant)));--sf-icon-button--radius: var(--sf-icon-button-radius, var(--sf-radius--ui));border-end-end-radius:var(--sf-icon-button--radius);border-end-end-radius:var(--sf-icon-button--border-bottom-right-radius, var(--sf-icon-button--radius));border-end-start-radius:var(--sf-icon-button--radius);border-end-start-radius:var(--sf-icon-button--border-bottom-left-radius, var(--sf-icon-button--radius));border-start-end-radius:var(--sf-icon-button--radius);border-start-end-radius:var(--sf-icon-button--border-top-right-radius, var(--sf-icon-button--radius));border-start-start-radius:var(--sf-icon-button--radius);border-start-start-radius:var(--sf-icon-button--border-top-left-radius, var(--sf-icon-button--radius));-webkit-padding-start:calc(var(--sf-icon-button--padding-inline-start) - var(--sf-icon-button--border-inline-start-width));padding-inline-start:calc(var(--sf-icon-button--padding-inline-start) - var(--sf-icon-button--border-inline-start-width));padding-top:calc(var(--sf-icon-button--padding-top) - var(--sf-icon-button--border-top-width));-webkit-padding-end:calc(var(--sf-icon-button--padding-inline-end) - var(--sf-icon-button--border-inline-end-width));padding-inline-end:calc(var(--sf-icon-button--padding-inline-end) - var(--sf-icon-button--border-inline-end-width));padding-bottom:calc(var(--sf-icon-button--padding-bottom) - var(--sf-icon-button--border-bottom-width));--sf-icon-button--border-top-width: var(--sf-icon-button-border-width, 0);--sf-icon-button--border-bottom-width: var(--sf-icon-button-border-width, 0);--sf-icon-button--border-inline-start-width: var(--sf-icon-button-border-width, 0);--sf-icon-button--border-inline-end-width: var(--sf-icon-button-border-width, 0);background-color:var(--sf-icon-button--background-color);border-color:transparent;border-color:var(--sf-icon-button--border-color, var(--sf-icon-button-border-color, transparent));border-width:0;border-width:var(--sf-icon-button--border-width, 0);border-top-width:0;border-top-width:var(--sf-icon-button--border-top-width, 0);border-inline-end-width:0;border-inline-end-width:var(--sf-icon-button--border-inline-end-width, 0);border-bottom-width:0;border-bottom-width:var(--sf-icon-button--border-bottom-width, 0);border-inline-start-width:0;border-inline-start-width:var(--sf-icon-button--border-inline-start-width, 0);border-style:solid;border-style:var(--sf-icon-button--border-style, solid);box-shadow:0 0 rgba(0, 0, 0, 0),0 0 rgba(0, 0, 0, 0);box-shadow:var(--sf-icon-button--focus-inset, 0 0 rgba(0, 0, 0, 0)),var(--sf-icon-button--box-shadow, 0 0 rgba(0, 0, 0, 0))}.sf-icon-button .sf-close-icon{background-color:var(--sf-close-icon--background-color);border-color:transparent;border-color:var(--sf-close-icon--border-color, transparent)}.sf-icon-button .sf-icon{color:var(--sf-on-surface-variant);color:var(--sf-icon--color, var(--sf-icon-button-color, var(--sf-on-surface-variant)));font-size:var(--sf-icon-size-3);font-size:var(--sf-icon--font-size, var(--sf-icon-size-3));height:var(--sf-icon-size-3);height:var(--sf-icon--height, var(--sf-icon-size-3));width:var(--sf-icon-size-3);width:var(--sf-icon--width, var(--sf-icon-size-3))}.sf-icon-button.sf-icon-button--default.sf-icon-button--primary.sf-icon-button--icon,.sf-icon-button.sf-icon-button--default.sf-icon-button--primary.sf-icon-button--close{--sf-icon-button--background-color: var(--sf-icon-button-background-color, var(--sf-primary))}.sf-icon-button.sf-icon-button--default.sf-icon-button--primary.sf-icon-button--icon{--sf-icon--color: var(--sf-icon-button-color, var(--sf-on-primary))}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--secondary.sf-icon-button--icon,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--secondary.sf-icon-button--close{--sf-icon-button--background-color: var(--sf-icon-button-background-color, var(--sf-secondary-container))}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--primary.sf-icon-button--icon,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--primary.sf-icon-button--close{--sf-icon-button--background-color: var(--sf-icon-button-background-color, var(--sf-primary-container))}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--secondary.sf-icon-button--icon{--sf-icon--color: var(--sf-icon-button-color, var(--sf-on-secondary-container))}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--primary.sf-icon-button--icon{--sf-icon--color: var(--sf-icon-button-color, var(--sf-on-primary-container))}.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--icon,.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--icon,.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--close,.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--close{--sf-icon-button--background-color: var(--sf-icon-button-background-color, transparent);--sf-icon-button--border-color: var(--sf-icon-button-border-color, var(--sf-outline))}.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--icon{--sf-icon--color: var(--sf-icon-button-color, var(--sf-primary))}.sf-icon-button.sf-icon-button--link.sf-icon-button--primary.sf-icon-button--icon{--sf-icon-button--background-color: var(--sf-icon-button-background-color, transparent)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--primary.sf-icon-button--icon{--sf-icon-button--background-color: var(--sf-icon-button-background-color, transparent)}.sf-icon-button.sf-icon-button--link.sf-icon-button--on-surface.sf-icon-button--icon{--sf-icon-button--background-color: var(--sf-icon-button-background-color, transparent)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--on-surface.sf-icon-button--icon{--sf-icon-button--background-color: var(--sf-icon-button-background-color, transparent)}.sf-icon-button.sf-icon-button--link.sf-icon-button--primary.sf-icon-button--close{--sf-icon-button--background-color: var(--sf-icon-button-background-color, transparent)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--primary.sf-icon-button--close{--sf-icon-button--background-color: var(--sf-icon-button-background-color, transparent)}.sf-icon-button.sf-icon-button--link.sf-icon-button--on-surface.sf-icon-button--close{--sf-icon-button--background-color: var(--sf-icon-button-background-color, transparent)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--on-surface.sf-icon-button--close{--sf-icon-button--background-color: var(--sf-icon-button-background-color, transparent)}.sf-icon-button.sf-icon-button--link.sf-icon-button--primary.sf-icon-button--icon{--sf-icon--color: var(--sf-icon-button-color, var(--sf-primary-active))}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--primary.sf-icon-button--icon{--sf-icon--color: var(--sf-icon-button-color, var(--sf-primary-active))}.sf-icon-button.sf-icon-button--link.sf-icon-button--on-surface.sf-icon-button--icon{--sf-icon--color: var(--sf-icon-button-color, var(--sf-on-surface))}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--on-surface.sf-icon-button--icon{--sf-icon--color: var(--sf-icon-button-color, var(--sf-on-surface))}.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--icon,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--on-surface.sf-icon-button--icon{--sf-icon--color: var(--sf-icon-button-color, var(--sf-on-surface))}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--on-surface.sf-icon-button--icon,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--on-surface.sf-icon-button--close{--sf-icon-button--background-color: var(--sf-icon-button-background-color, var(--sf-surface-container));--sf-on-surface-variant: var(--sf-on-surface-container--variant)}.sf-icon-button.sf-icon-button--default.sf-icon-button--on-surface.sf-icon-button--icon,.sf-icon-button.sf-icon-button--default.sf-icon-button--on-surface.sf-icon-button--close{--sf-icon-button--background-color: var(--sf-icon-button-background-color, var(--sf-on-surface))}.sf-icon-button.sf-icon-button--default.sf-icon-button--on-surface.sf-icon-button--icon{--sf-icon--color: var(--sf-icon-button-color, var(--sf-on-surface-inverse))}.sf-icon-button.sf-icon-button--default.sf-icon-button--primary.sf-icon-button--close>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-icon-button-color, var(--sf-on-primary))}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--secondary.sf-icon-button--close>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-icon-button-color, var(--sf-on-secondary-container))}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--primary.sf-icon-button--close>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-icon-button-color, var(--sf-on-primary-container))}.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--close>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-icon-button-color, var(--sf-primary))}.sf-icon-button.sf-icon-button--link.sf-icon-button--primary.sf-icon-button--close>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-icon-button-color, var(--sf-primary-active))}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--primary.sf-icon-button--close>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-icon-button-color, var(--sf-primary-active))}.sf-icon-button.sf-icon-button--close>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-icon-button-color, var(--sf-on-surface))}.sf-icon-button.sf-icon-button--default.sf-icon-button--on-surface.sf-icon-button--close>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-icon-button-color, var(--sf-on-surface-inverse))}.sf-icon-button.sf-icon-button--size-2.sf-icon-button--icon .sf-icon:not(does-not-exist){--sf-icon--font-size: var(--sf-text-height-2);--sf-icon--height: var(--sf-text-height-2);--sf-icon--width: var(--sf-text-height-2)}.sf-icon-button.sf-icon-button--size-2.sf-icon-button--icon sf-icon:not(:defined){--sf-icon--font-size: var(--sf-text-height-2);--sf-icon--height: var(--sf-text-height-2);--sf-icon--width: var(--sf-text-height-2)}.sf-icon-button.sf-icon-button--size-3.sf-icon-button--icon .sf-icon:not(does-not-exist){--sf-icon--font-size: var(--sf-text-height-3);--sf-icon--height: var(--sf-text-height-3);--sf-icon--width: var(--sf-text-height-3)}.sf-icon-button.sf-icon-button--size-3.sf-icon-button--icon sf-icon:not(:defined){--sf-icon--font-size: var(--sf-text-height-3);--sf-icon--height: var(--sf-text-height-3);--sf-icon--width: var(--sf-text-height-3)}.sf-icon-button.sf-icon-button--size-1\/2.sf-icon-button--icon .sf-icon:not(does-not-exist){--sf-icon--font-size: var(--sf-text-height-1\/2);--sf-icon--height: var(--sf-text-height-1\/2);--sf-icon--width: var(--sf-text-height-1\/2)}.sf-icon-button.sf-icon-button--size-1\/2.sf-icon-button--icon sf-icon:not(:defined){--sf-icon--font-size: var(--sf-text-height-1\/2);--sf-icon--height: var(--sf-text-height-1\/2);--sf-icon--width: var(--sf-text-height-1\/2)}.sf-icon-button.sf-icon-button--size-1\/3.sf-icon-button--icon .sf-icon:not(does-not-exist){--sf-icon--font-size: var(--sf-text-height-1\/3);--sf-icon--height: var(--sf-text-height-1\/3);--sf-icon--width: var(--sf-text-height-1\/3)}.sf-icon-button.sf-icon-button--size-1\/3.sf-icon-button--icon sf-icon:not(:defined){--sf-icon--font-size: var(--sf-text-height-1\/3);--sf-icon--height: var(--sf-text-height-1\/3);--sf-icon--width: var(--sf-text-height-1\/3)}.sf-icon-button.sf-icon-button--size-1.sf-icon-button--icon .sf-icon:not(does-not-exist){--sf-icon--font-size: var(--sf-text-height-1);--sf-icon--height: var(--sf-text-height-1);--sf-icon--width: var(--sf-text-height-1)}.sf-icon-button.sf-icon-button--size-1.sf-icon-button--icon sf-icon:not(:defined){--sf-icon--font-size: var(--sf-text-height-1);--sf-icon--height: var(--sf-text-height-1);--sf-icon--width: var(--sf-text-height-1)}.sf-icon-button--size-1{--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1--space-y-tightness-default));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1--space-y-tightness-default));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1--space-y-tightness-default));--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1--space-y-tightness-default))}.sf-icon-button--size-1.tightness-low{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1--space-y-tightness-low));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1--space-y-tightness-low));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1--space-y-tightness-low));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1--space-y-tightness-low))}.sf-icon-button--size-1.spacing-compact{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1--space-y-tightness-low));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1--space-y-tightness-low));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1--space-y-tightness-low));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1--space-y-tightness-low))}.sf-icon-button--size-1.tightness-high{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1--space-y-tightness-high));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1--space-y-tightness-high));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1--space-y-tightness-high));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1--space-y-tightness-high))}.sf-icon-button--size-1.spacing-comfortable{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1--space-y-tightness-high));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1--space-y-tightness-high));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1--space-y-tightness-high));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1--space-y-tightness-high))}.sf-icon-button--size-1.tightness-highest{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1--space-y-tightness-highest));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1--space-y-tightness-highest));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1--space-y-tightness-highest));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1--space-y-tightness-highest))}.sf-icon-button--size-1.spacing-spacious{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1--space-y-tightness-highest));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1--space-y-tightness-highest));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1--space-y-tightness-highest));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1--space-y-tightness-highest))}.sf-icon-button--size-2{--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-2--space-y-tightness-default));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-2--space-y-tightness-default));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-2--space-y-tightness-default));--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-2--space-y-tightness-default))}.sf-icon-button--size-2.tightness-low{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-2--space-y-tightness-low));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-2--space-y-tightness-low));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-2--space-y-tightness-low));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-2--space-y-tightness-low))}.sf-icon-button--size-2.spacing-compact{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-2--space-y-tightness-low));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-2--space-y-tightness-low));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-2--space-y-tightness-low));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-2--space-y-tightness-low))}.sf-icon-button--size-2.tightness-high{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-2--space-y-tightness-high));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-2--space-y-tightness-high));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-2--space-y-tightness-high));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-2--space-y-tightness-high))}.sf-icon-button--size-2.spacing-comfortable{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-2--space-y-tightness-high));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-2--space-y-tightness-high));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-2--space-y-tightness-high));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-2--space-y-tightness-high))}.sf-icon-button--size-2.tightness-highest{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-2--space-y-tightness-highest));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-2--space-y-tightness-highest));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-2--space-y-tightness-highest));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-2--space-y-tightness-highest))}.sf-icon-button--size-2.spacing-spacious{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-2--space-y-tightness-highest));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-2--space-y-tightness-highest));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-2--space-y-tightness-highest));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-2--space-y-tightness-highest))}.sf-icon-button--size-3{--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-3--space-y-tightness-default));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-3--space-y-tightness-default));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-3--space-y-tightness-default));--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-3--space-y-tightness-default))}.sf-icon-button--size-3.tightness-low{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-3--space-y-tightness-low));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-3--space-y-tightness-low));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-3--space-y-tightness-low));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-3--space-y-tightness-low))}.sf-icon-button--size-3.spacing-compact{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-3--space-y-tightness-low));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-3--space-y-tightness-low));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-3--space-y-tightness-low));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-3--space-y-tightness-low))}.sf-icon-button--size-3.tightness-high{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-3--space-y-tightness-high));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-3--space-y-tightness-high));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-3--space-y-tightness-high));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-3--space-y-tightness-high))}.sf-icon-button--size-3.spacing-comfortable{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-3--space-y-tightness-high));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-3--space-y-tightness-high));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-3--space-y-tightness-high));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-3--space-y-tightness-high))}.sf-icon-button--size-3.tightness-highest{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-3--space-y-tightness-highest));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-3--space-y-tightness-highest));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-3--space-y-tightness-highest));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-3--space-y-tightness-highest))}.sf-icon-button--size-3.spacing-spacious{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-3--space-y-tightness-highest));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-3--space-y-tightness-highest));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-3--space-y-tightness-highest));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-3--space-y-tightness-highest))}.sf-icon-button--size-1\/2{--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1\/2--space-y-tightness-default));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/2--space-y-tightness-default));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/2--space-y-tightness-default));--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1\/2--space-y-tightness-default))}.sf-icon-button--size-1\/2.tightness-low{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1\/2--space-y-tightness-low));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1\/2--space-y-tightness-low));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/2--space-y-tightness-low));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/2--space-y-tightness-low))}.sf-icon-button--size-1\/2.spacing-compact{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1\/2--space-y-tightness-low));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1\/2--space-y-tightness-low));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/2--space-y-tightness-low));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/2--space-y-tightness-low))}.sf-icon-button--size-1\/2.tightness-high{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1\/2--space-y-tightness-high));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1\/2--space-y-tightness-high));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/2--space-y-tightness-high));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/2--space-y-tightness-high))}.sf-icon-button--size-1\/2.spacing-comfortable{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1\/2--space-y-tightness-high));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1\/2--space-y-tightness-high));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/2--space-y-tightness-high));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/2--space-y-tightness-high))}.sf-icon-button--size-1\/2.tightness-highest{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1\/2--space-y-tightness-highest));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1\/2--space-y-tightness-highest));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/2--space-y-tightness-highest));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/2--space-y-tightness-highest))}.sf-icon-button--size-1\/2.spacing-spacious{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1\/2--space-y-tightness-highest));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1\/2--space-y-tightness-highest));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/2--space-y-tightness-highest));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/2--space-y-tightness-highest))}.sf-icon-button--size-1\/3{--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1\/3--space-y-tightness-default));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/3--space-y-tightness-default));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/3--space-y-tightness-default));--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1\/3--space-y-tightness-default))}.sf-icon-button--size-1\/3.tightness-low{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1\/3--space-y-tightness-low));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1\/3--space-y-tightness-low));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/3--space-y-tightness-low));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/3--space-y-tightness-low))}.sf-icon-button--size-1\/3.spacing-compact{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1\/3--space-y-tightness-low));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1\/3--space-y-tightness-low));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/3--space-y-tightness-low));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/3--space-y-tightness-low))}.sf-icon-button--size-1\/3.tightness-high{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1\/3--space-y-tightness-high));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1\/3--space-y-tightness-high));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/3--space-y-tightness-high));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/3--space-y-tightness-high))}.sf-icon-button--size-1\/3.spacing-comfortable{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1\/3--space-y-tightness-high));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1\/3--space-y-tightness-high));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/3--space-y-tightness-high));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/3--space-y-tightness-high))}.sf-icon-button--size-1\/3.tightness-highest{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1\/3--space-y-tightness-highest));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1\/3--space-y-tightness-highest));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/3--space-y-tightness-highest));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/3--space-y-tightness-highest))}.sf-icon-button--size-1\/3.spacing-spacious{--sf-icon-button--padding-top: var(--sf-icon-button-padding-block, var(--sf-ui-1\/3--space-y-tightness-highest));--sf-icon-button--padding-bottom: var(--sf-icon-button-padding-block, var(--sf-ui-1\/3--space-y-tightness-highest));--sf-icon-button--padding-inline-start: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/3--space-y-tightness-highest));--sf-icon-button--padding-inline-end: var(--sf-icon-button-padding-inline, var(--sf-ui-1\/3--space-y-tightness-highest))}.sf-icon-button--outline{--sf-icon-button--border-bottom-width: var(--sf-icon-button-border-width, var(--sf-px));--sf-icon-button--border-inline-end-width: var(--sf-icon-button-border-width, var(--sf-px));--sf-icon-button--border-inline-start-width: var(--sf-icon-button-border-width, var(--sf-px));--sf-icon-button--border-style: solid;--sf-icon-button--border-top-width: var(--sf-icon-button-border-width, var(--sf-px));--sf-icon-button--border-width: var(--sf-icon-button-border-width, var(--sf-px))}.sf-icon-button.radius-default{border-radius:var(--sf-radius-default)}.sf-icon-button.radius-square{border-radius:var(--sf-radius-square)}.sf-icon-button.radius-rounded{border-radius:var(--sf-radius-rounded)}.sf-icon-button.segment-start{--sf-icon-button--border-top-right-radius: var(--sf-radius-square);--sf-icon-button--border-bottom-right-radius: var(--sf-radius-square);--sf-icon-button--border-inline-end-width: var(--sf-px)}.sf-icon-button.segment-middle{--sf-icon-button--border-top-left-radius: var(--sf-radius-square);--sf-icon-button--border-top-right-radius: var(--sf-radius-square);--sf-icon-button--border-bottom-right-radius: var(--sf-radius-square);--sf-icon-button--border-bottom-left-radius: var(--sf-radius-square);--sf-icon-button--border-inline-start-width: var(--sf-px);--sf-icon-button--border-inline-end-width: var(--sf-px)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-icon-button.segment-end{border-left-color:transparent;border-left-color:var(--sf-white--alfa-24, transparent)}@supports not (border-inline-start-color: initial){html:not([dir="rtl"]) .sf-icon-button.segment-end{border-left-color:transparent;border-left-color:var(--sf-white--alfa-24, transparent)}}.sf-icon-button.segment-end:where(:dir(ltr)){border-left-color:transparent;border-left-color:var(--sf-white--alfa-24, transparent)}_:-ms-input-placeholder, [dir="rtl"] .sf-icon-button.segment-end{border-right-color:transparent;border-right-color:var(--sf-white--alfa-24, transparent)}@supports not (border-inline-start-color: initial){[dir="rtl"] .sf-icon-button.segment-end{border-right-color:transparent;border-right-color:var(--sf-white--alfa-24, transparent)}}.sf-icon-button.segment-end:where(:dir(rtl)){border-right-color:transparent;border-right-color:var(--sf-white--alfa-24, transparent)}.sf-icon-button.segment-end{--sf-icon-button--border-top-left-radius: var(--sf-radius-square);--sf-icon-button--border-bottom-left-radius: var(--sf-radius-square);border-inline-start-color:transparent;border-inline-start-color:var(--sf-white--alfa-24, transparent);--sf-icon-button--border-inline-start-width: var(--sf-px)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-icon-button:not(.sf-icon-button--outline).segment-end{border-left-color:transparent;border-left-color:var(--sf-white--alfa-24, transparent)}@supports not (border-inline-start-color: initial){html:not([dir="rtl"]) .sf-icon-button:not(.sf-icon-button--outline).segment-end{border-left-color:transparent;border-left-color:var(--sf-white--alfa-24, transparent)}}.sf-icon-button:not(.sf-icon-button--outline).segment-end:where(:dir(ltr)){border-left-color:transparent;border-left-color:var(--sf-white--alfa-24, transparent)}_:-ms-input-placeholder, [dir="rtl"] .sf-icon-button:not(.sf-icon-button--outline).segment-end{border-right-color:transparent;border-right-color:var(--sf-white--alfa-24, transparent)}@supports not (border-inline-start-color: initial){[dir="rtl"] .sf-icon-button:not(.sf-icon-button--outline).segment-end{border-right-color:transparent;border-right-color:var(--sf-white--alfa-24, transparent)}}.sf-icon-button:not(.sf-icon-button--outline).segment-end:where(:dir(rtl)){border-right-color:transparent;border-right-color:var(--sf-white--alfa-24, transparent)}.sf-icon-button:not(.sf-icon-button--outline).segment-end{border-inline-start-color:transparent;border-inline-start-color:var(--sf-white--alfa-24, transparent)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-icon-button:not(.sf-icon-button--outline).segment-start{border-right-color:transparent;border-right-color:var(--sf-white--alfa-24, transparent)}@supports not (border-inline-end-color: initial){html:not([dir="rtl"]) .sf-icon-button:not(.sf-icon-button--outline).segment-start{border-right-color:transparent;border-right-color:var(--sf-white--alfa-24, transparent)}}.sf-icon-button:not(.sf-icon-button--outline).segment-start:where(:dir(ltr)){border-right-color:transparent;border-right-color:var(--sf-white--alfa-24, transparent)}_:-ms-input-placeholder, [dir="rtl"] .sf-icon-button:not(.sf-icon-button--outline).segment-start{border-left-color:transparent;border-left-color:var(--sf-white--alfa-24, transparent)}@supports not (border-inline-end-color: initial){[dir="rtl"] .sf-icon-button:not(.sf-icon-button--outline).segment-start{border-left-color:transparent;border-left-color:var(--sf-white--alfa-24, transparent)}}.sf-icon-button:not(.sf-icon-button--outline).segment-start:where(:dir(rtl)){border-left-color:transparent;border-left-color:var(--sf-white--alfa-24, transparent)}.sf-icon-button:not(.sf-icon-button--outline).segment-start{border-inline-end-color:transparent;border-inline-end-color:var(--sf-white--alfa-24, transparent)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-icon-button:not(.sf-icon-button--outline).segment-middle{border-right-color:transparent;border-right-color:var(--sf-white--alfa-24, transparent)}@supports not (border-inline-end-color: initial){html:not([dir="rtl"]) .sf-icon-button:not(.sf-icon-button--outline).segment-middle{border-right-color:transparent;border-right-color:var(--sf-white--alfa-24, transparent)}}.sf-icon-button:not(.sf-icon-button--outline).segment-middle:where(:dir(ltr)){border-right-color:transparent;border-right-color:var(--sf-white--alfa-24, transparent)}_:-ms-input-placeholder, [dir="rtl"] .sf-icon-button:not(.sf-icon-button--outline).segment-middle{border-left-color:transparent;border-left-color:var(--sf-white--alfa-24, transparent)}@supports not (border-inline-end-color: initial){[dir="rtl"] .sf-icon-button:not(.sf-icon-button--outline).segment-middle{border-left-color:transparent;border-left-color:var(--sf-white--alfa-24, transparent)}}.sf-icon-button:not(.sf-icon-button--outline).segment-middle:where(:dir(rtl)){border-left-color:transparent;border-left-color:var(--sf-white--alfa-24, transparent)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-icon-button:not(.sf-icon-button--outline).segment-middle{border-left-color:transparent;border-left-color:var(--sf-white--alfa-24, transparent)}@supports not (border-inline-start-color: initial){html:not([dir="rtl"]) .sf-icon-button:not(.sf-icon-button--outline).segment-middle{border-left-color:transparent;border-left-color:var(--sf-white--alfa-24, transparent)}}.sf-icon-button:not(.sf-icon-button--outline).segment-middle:where(:dir(ltr)){border-left-color:transparent;border-left-color:var(--sf-white--alfa-24, transparent)}_:-ms-input-placeholder, [dir="rtl"] .sf-icon-button:not(.sf-icon-button--outline).segment-middle{border-right-color:transparent;border-right-color:var(--sf-white--alfa-24, transparent)}@supports not (border-inline-start-color: initial){[dir="rtl"] .sf-icon-button:not(.sf-icon-button--outline).segment-middle{border-right-color:transparent;border-right-color:var(--sf-white--alfa-24, transparent)}}.sf-icon-button:not(.sf-icon-button--outline).segment-middle:where(:dir(rtl)){border-right-color:transparent;border-right-color:var(--sf-white--alfa-24, transparent)}.sf-icon-button:not(.sf-icon-button--outline).segment-middle{border-inline-end-color:transparent;border-inline-end-color:var(--sf-white--alfa-24, transparent);border-inline-start-color:transparent;border-inline-start-color:var(--sf-white--alfa-24, transparent)}.sf-icon-button.sf-icon-button--surface{--sf-icon-button--background-color: transparent}.sf-icon-button.sf-icon-button--surface{--sf-icon-button--background-color: var(--sf-icon-button-background-color, var(--sf-alpha-4));--sf-icon-button--border-color: var(--sf-icon-button-border-color, var(--sf-alpha-8));--sf-icon-button--border-bottom-width: var(--sf-icon-button-border-width, var(--sf-px));--sf-icon-button--border-inline-end-width: var(--sf-icon-button-border-width, var(--sf-px));--sf-icon-button--border-inline-start-width: var(--sf-icon-button-border-width, var(--sf-px));--sf-icon-button--border-style: solid;--sf-icon-button--border-top-width: var(--sf-icon-button-border-width, var(--sf-px));--sf-icon-button--border-width: var(--sf-icon-button-border-width, var(--sf-px))}.sf-icon-button.sf-icon-button--surface.sf-icon-button--on-surface{--sf-icon--color: var(--sf-icon-button-color, var(--sf-on-surface))}.sf-icon-button.sf-icon-button--surface.sf-icon-button--on-surface.sf-icon-button--close>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-icon-button-color, var(--sf-on-surface))}.sf-icon-button.sf-icon-button--surface.sf-icon-button--primary{--sf-icon--color: var(--sf-icon-button-color, var(--sf-primary))}.sf-icon-button.sf-icon-button--surface.sf-icon-button--primary.sf-icon-button--close>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-icon-button-color, var(--sf-primary))}}@layer sf.states{.sf-icon-button.sf-icon-button--tonal.sf-icon-button--secondary.sf-icon-button--icon:disabled{--sf-icon-button--background-color: var(--sf-disable)}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--primary.sf-icon-button--icon:disabled{--sf-icon-button--background-color: var(--sf-disable)}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--secondary.sf-icon-button--close:disabled{--sf-icon-button--background-color: var(--sf-disable)}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--primary.sf-icon-button--close:disabled{--sf-icon-button--background-color: var(--sf-disable)}.sf-icon-button.sf-icon-button--default.sf-icon-button--primary.sf-icon-button--icon:disabled,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--on-surface.sf-icon-button--icon:disabled,.sf-icon-button.sf-icon-button--default.sf-icon-button--on-surface.sf-icon-button--icon:disabled,.sf-icon-button.sf-icon-button--default.sf-icon-button--primary.sf-icon-button--close:disabled,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--on-surface.sf-icon-button--close:disabled,.sf-icon-button.sf-icon-button--default.sf-icon-button--on-surface.sf-icon-button--close:disabled{--sf-icon-button--background-color: var(--sf-disable)}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--secondary.sf-icon-button--icon:disabled{--sf-icon--color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--primary.sf-icon-button--icon:disabled{--sf-icon--color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--link.sf-icon-button--primary.sf-icon-button--icon:disabled{--sf-icon--color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--primary.sf-icon-button--icon:disabled{--sf-icon--color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--link.sf-icon-button--on-surface.sf-icon-button--icon:disabled{--sf-icon--color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--on-surface.sf-icon-button--icon:disabled{--sf-icon--color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--default.sf-icon-button--primary.sf-icon-button--icon:disabled,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--on-surface.sf-icon-button--icon:disabled,.sf-icon-button.sf-icon-button--default.sf-icon-button--on-surface.sf-icon-button--icon:disabled,.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--icon:disabled,.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--icon:disabled{--sf-icon--color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--icon:disabled,.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--icon:disabled,.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--close:disabled,.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--close:disabled{--sf-icon-button--border-color: var(--sf-outline-variant)}.sf-icon-button.sf-icon-button--default.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled):hover,.sf-icon-button.sf-icon-button--default.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-primary-hover)}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--secondary.sf-icon-button--icon:not(:disabled):not(.disabled):hover,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--secondary.sf-icon-button--close:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-secondary-container-hover)}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled):hover,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-primary-container-hover)}.sf-icon-button.sf-icon-button--link.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-primary-container-hover)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-primary-container-hover)}.sf-icon-button.sf-icon-button--link.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-primary-container-hover)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-primary-container-hover)}.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled):hover,.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-primary-container-hover)}.sf-icon-button.sf-icon-button--link.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-surface-container-hover)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-surface-container-hover)}.sf-icon-button.sf-icon-button--link.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-surface-container-hover)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-surface-container-hover)}.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled):hover,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled):hover,.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled):hover,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-surface-container-hover)}.sf-icon-button.sf-icon-button--default.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--default.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled).active,.sf-icon-button.sf-icon-button--default.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--default.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled).active{--sf-icon-button--background-color: var(--sf-primary-active)}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--secondary.sf-icon-button--icon:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--secondary.sf-icon-button--icon:not(:disabled):not(.disabled).active,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--secondary.sf-icon-button--close:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--secondary.sf-icon-button--close:not(:disabled):not(.disabled).active{--sf-icon-button--background-color: var(--sf-secondary-container-active)}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled).active,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled).active{--sf-icon-button--background-color: var(--sf-primary-container-active)}.sf-icon-button.sf-icon-button--link.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled):active{--sf-icon-button--background-color: var(--sf-primary-container-active)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled):active{--sf-icon-button--background-color: var(--sf-primary-container-active)}.sf-icon-button.sf-icon-button--link.sf-icon-button--primary.sf-icon-button--icon.active:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-primary-container-active)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--primary.sf-icon-button--icon.active:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-primary-container-active)}.sf-icon-button.sf-icon-button--link.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled):active{--sf-icon-button--background-color: var(--sf-primary-container-active)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled):active{--sf-icon-button--background-color: var(--sf-primary-container-active)}.sf-icon-button.sf-icon-button--link.sf-icon-button--primary.sf-icon-button--close.active:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-primary-container-active)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--primary.sf-icon-button--close.active:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-primary-container-active)}.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled).active,.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled).active{--sf-icon-button--background-color: var(--sf-primary-container-active)}.sf-icon-button.sf-icon-button--link.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled):active{--sf-icon-button--background-color: var(--sf-surface-container-active)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled):active{--sf-icon-button--background-color: var(--sf-surface-container-active)}.sf-icon-button.sf-icon-button--link.sf-icon-button--on-surface.sf-icon-button--icon.active:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-surface-container-active)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--on-surface.sf-icon-button--icon.active:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-surface-container-active)}.sf-icon-button.sf-icon-button--link.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled):active{--sf-icon-button--background-color: var(--sf-surface-container-active)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled):active{--sf-icon-button--background-color: var(--sf-surface-container-active)}.sf-icon-button.sf-icon-button--link.sf-icon-button--on-surface.sf-icon-button--close.active:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-surface-container-active)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--on-surface.sf-icon-button--close.active:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-surface-container-active)}.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled).active,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled).active,.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled).active,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled).active{--sf-icon-button--background-color: var(--sf-surface-container-active)}.sf-icon-button.sf-icon-button--link.sf-icon-button--primary.sf-icon-button--icon.focus-visible:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--primary.sf-icon-button--icon.focus-visible:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--link.sf-icon-button--on-surface.sf-icon-button--icon.focus-visible:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--on-surface.sf-icon-button--icon.focus-visible:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--link.sf-icon-button--primary.sf-icon-button--close.focus-visible:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--primary.sf-icon-button--close.focus-visible:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--link.sf-icon-button--on-surface.sf-icon-button--close.focus-visible:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--on-surface.sf-icon-button--close.focus-visible:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled).focus-visible,.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled).focus-visible,.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled).focus-visible,.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled).focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--link.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled).focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--link.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled):focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled).focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled):focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--link.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled).focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--link.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled):focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled).focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled):focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--link.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled).focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--link.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled):focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled).focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled):focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--link.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled).focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--link.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled):focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled).focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled):focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled).focus-visible,.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled).focus-visible,.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled).focus-visible,.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled).focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--icon:not(:disabled):not(.disabled):focus-visible,.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled):focus-visible,.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--close:not(:disabled):not(.disabled):focus-visible,.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled):focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--default.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled):hover,.sf-icon-button.sf-icon-button--default.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-on-surface-hover)}.sf-icon-button.sf-icon-button--default.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--default.sf-icon-button--on-surface.sf-icon-button--icon:not(:disabled):not(.disabled).active,.sf-icon-button.sf-icon-button--default.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--default.sf-icon-button--on-surface.sf-icon-button--close:not(:disabled):not(.disabled).active{--sf-icon-button--background-color: var(--sf-on-surface-active)}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--secondary.sf-icon-button--close:disabled>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--primary.sf-icon-button--close:disabled>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--link.sf-icon-button--primary.sf-icon-button--close:disabled>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--primary.sf-icon-button--close:disabled>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--link.sf-icon-button--on-surface.sf-icon-button--close:disabled>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--on-surface.sf-icon-button--close:disabled>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--default.sf-icon-button--primary.sf-icon-button--close:disabled>.sf-close>.sf-close-icon,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--on-surface.sf-icon-button--close:disabled>.sf-close>.sf-close-icon,.sf-icon-button.sf-icon-button--default.sf-icon-button--on-surface.sf-icon-button--close:disabled>.sf-close>.sf-close-icon,.sf-icon-button.sf-icon-button--outline.sf-icon-button--primary.sf-icon-button--close:disabled>.sf-close>.sf-close-icon,.sf-icon-button.sf-icon-button--outline.sf-icon-button--on-surface.sf-icon-button--close:disabled>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-on-disable)}.sf-icon-button:not(:disabled):not(.disabled).focus-visible{outline:var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color);outline-offset:var(--sf-focus--offset);--sf-icon-button--focus-inset: inset 0 0 0 var(--sf-focus--offset) var(--sf-icon-button--focus-ink, transparent)}.sf-icon-button:not(:disabled):not(.disabled):focus-visible{outline:var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color);outline-offset:var(--sf-focus--offset);--sf-icon-button--focus-inset: inset 0 0 0 var(--sf-focus--offset) var(--sf-icon-button--focus-ink, transparent)}.sf-icon-button.sf-icon-button--default.sf-icon-button--primary{--sf-icon-button--focus-ink: var(--sf-on-primary)}.sf-icon-button.segment-start:not(:disabled):not(.disabled).focus-visible,.sf-icon-button.segment-middle:not(:disabled):not(.disabled).focus-visible,.sf-icon-button.segment-end:not(:disabled):not(.disabled).focus-visible{outline-offset:calc(var(--sf-focus--width)*-1)}.sf-icon-button.segment-start:not(:disabled):not(.disabled):focus-visible,.sf-icon-button.segment-middle:not(:disabled):not(.disabled):focus-visible,.sf-icon-button.segment-end:not(:disabled):not(.disabled):focus-visible{outline-offset:calc(var(--sf-focus--width)*-1)}@media(forced-colors: active){.sf-icon-button:not(:disabled):not(.disabled).focus-visible{outline:var(--sf-focus-outline-width) solid currentColor;outline-offset:calc(var(--sf-focus-outline-width)*-1)}.sf-icon-button:not(:disabled):not(.disabled):focus-visible{outline:var(--sf-focus-outline-width) solid currentColor;outline-offset:calc(var(--sf-focus-outline-width)*-1)}}.sf-icon-button.sf-icon-button--surface:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-alpha-8)}.sf-icon-button.sf-icon-button--surface:not(:disabled):not(.disabled):hover{--sf-icon-button--border-color: var(--sf-alpha-12)}.sf-icon-button.sf-icon-button--surface:not(:disabled):not(.disabled):active{--sf-icon-button--background-color: var(--sf-alpha-12)}.sf-icon-button.sf-icon-button--surface.active:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-alpha-12)}.sf-icon-button.sf-icon-button--surface:not(:disabled):not(.disabled):active{--sf-icon-button--border-color: var(--sf-alpha-16)}.sf-icon-button.sf-icon-button--surface.active:not(:disabled):not(.disabled){--sf-icon-button--border-color: var(--sf-alpha-16)}.sf-icon-button.sf-icon-button--surface:disabled,.sf-icon-button.sf-icon-button--surface.disabled{--sf-icon-button--background-color: transparent;--sf-icon-button--border-color: var(--sf-alpha-4)}.sf-icon-button.sf-icon-button--surface:disabled,.sf-icon-button.sf-icon-button--surface.disabled{--sf-icon--color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--surface:disabled>.sf-close>.sf-close-icon,.sf-icon-button.sf-icon-button--surface.disabled>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-on-disable)}}@layer sf.components{.sf-icon-button.sf-icon-button--default.sf-icon-button--error.sf-icon-button--icon,.sf-icon-button.sf-icon-button--default.sf-icon-button--error.sf-icon-button--close{--sf-icon-button--background-color: var(--sf-icon-button-background-color, var(--sf-error))}.sf-icon-button.sf-icon-button--default.sf-icon-button--error.sf-icon-button--icon{--sf-icon--color: var(--sf-icon-button-color, var(--sf-on-error))}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--error.sf-icon-button--icon,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--error.sf-icon-button--close{--sf-icon-button--background-color: var(--sf-icon-button-background-color, var(--sf-error-container))}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--error.sf-icon-button--icon{--sf-icon--color: var(--sf-icon-button-color, var(--sf-on-error-container))}.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--icon,.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--close{--sf-icon-button--background-color: var(--sf-icon-button-background-color, transparent);--sf-icon-button--border-color: var(--sf-icon-button-border-color, var(--sf-outline))}.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--icon{--sf-icon--color: var(--sf-icon-button-color, var(--sf-error))}.sf-icon-button.sf-icon-button--link.sf-icon-button--error.sf-icon-button--icon{--sf-icon-button--background-color: var(--sf-icon-button-background-color, transparent)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--error.sf-icon-button--icon{--sf-icon-button--background-color: var(--sf-icon-button-background-color, transparent)}.sf-icon-button.sf-icon-button--link.sf-icon-button--error.sf-icon-button--close{--sf-icon-button--background-color: var(--sf-icon-button-background-color, transparent)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--error.sf-icon-button--close{--sf-icon-button--background-color: var(--sf-icon-button-background-color, transparent)}.sf-icon-button.sf-icon-button--link.sf-icon-button--error.sf-icon-button--icon{--sf-icon--color: var(--sf-icon-button-color, var(--sf-error-active))}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--error.sf-icon-button--icon{--sf-icon--color: var(--sf-icon-button-color, var(--sf-error-active))}.sf-icon-button.sf-icon-button--default.sf-icon-button--error.sf-icon-button--close>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-icon-button-color, var(--sf-on-error))}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--error.sf-icon-button--close>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-icon-button-color, var(--sf-on-error-container))}.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--close>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-icon-button-color, var(--sf-error))}.sf-icon-button.sf-icon-button--link.sf-icon-button--error.sf-icon-button--close>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-icon-button-color, var(--sf-error-active))}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--error.sf-icon-button--close>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-icon-button-color, var(--sf-error-active))}}@layer sf.states{.sf-icon-button.sf-icon-button--default.sf-icon-button--error.sf-icon-button--icon:disabled,.sf-icon-button.sf-icon-button--default.sf-icon-button--error.sf-icon-button--close:disabled{--sf-icon-button--background-color: var(--sf-disable)}.sf-icon-button.sf-icon-button--link.sf-icon-button--error.sf-icon-button--icon:disabled{--sf-icon--color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--error.sf-icon-button--icon:disabled{--sf-icon--color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--default.sf-icon-button--error.sf-icon-button--icon:disabled,.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--icon:disabled{--sf-icon--color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--icon:disabled,.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--close:disabled{--sf-icon-button--border-color: var(--sf-outline-variant)}.sf-icon-button.sf-icon-button--default.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled):hover,.sf-icon-button.sf-icon-button--default.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-error-hover)}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled):hover,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-error-container-hover)}.sf-icon-button.sf-icon-button--link.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-error-container-hover)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-error-container-hover)}.sf-icon-button.sf-icon-button--link.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-error-container-hover)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-error-container-hover)}.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled):hover,.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled):hover{--sf-icon-button--background-color: var(--sf-error-container-hover)}.sf-icon-button.sf-icon-button--default.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--default.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled).active,.sf-icon-button.sf-icon-button--default.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--default.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled).active{--sf-icon-button--background-color: var(--sf-error-active)}.sf-icon-button.sf-icon-button--tonal.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled).active,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--tonal.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled).active{--sf-icon-button--background-color: var(--sf-error-container-active)}.sf-icon-button.sf-icon-button--link.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled):active{--sf-icon-button--background-color: var(--sf-error-container-active)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled):active{--sf-icon-button--background-color: var(--sf-error-container-active)}.sf-icon-button.sf-icon-button--link.sf-icon-button--error.sf-icon-button--icon.active:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-error-container-active)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--error.sf-icon-button--icon.active:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-error-container-active)}.sf-icon-button.sf-icon-button--link.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled):active{--sf-icon-button--background-color: var(--sf-error-container-active)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled):active{--sf-icon-button--background-color: var(--sf-error-container-active)}.sf-icon-button.sf-icon-button--link.sf-icon-button--error.sf-icon-button--close.active:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-error-container-active)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--error.sf-icon-button--close.active:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-error-container-active)}.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled).active,.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled):active,.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled).active{--sf-icon-button--background-color: var(--sf-error-container-active)}.sf-icon-button.sf-icon-button--link.sf-icon-button--error.sf-icon-button--icon.focus-visible:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--error.sf-icon-button--icon.focus-visible:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--link.sf-icon-button--error.sf-icon-button--close.focus-visible:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--error.sf-icon-button--close.focus-visible:not(:disabled):not(.disabled){--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled).focus-visible,.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled).focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--link.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled).focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--link.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled):focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled).focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled):focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--link.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled).focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--link.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled):focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled).focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled):focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled).focus-visible,.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled).focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--icon:not(:disabled):not(.disabled):focus-visible,.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--close:not(:disabled):not(.disabled):focus-visible{--sf-icon-button--background-color: var(--sf-transparent-for-focus)}.sf-icon-button.sf-icon-button--link.sf-icon-button--error.sf-icon-button--close:disabled>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--ghost.sf-icon-button--error.sf-icon-button--close:disabled>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--default.sf-icon-button--error.sf-icon-button--close:disabled>.sf-close>.sf-close-icon,.sf-icon-button.sf-icon-button--outline.sf-icon-button--error.sf-icon-button--close:disabled>.sf-close>.sf-close-icon{--sf-close-icon--background-color: var(--sf-on-disable)}.sf-icon-button.sf-icon-button--default.sf-icon-button--error{--sf-icon-button--focus-ink: var(--sf-on-error)}}@layer sf.override{sf-icon-button[\:has$.sf-icon-button--outline\[class*\%3Dsegment-\]$]+sf-icon-button .sf-icon-button[class*=segment-]:not(.sf-icon-button--outline),.sf-icon-button.sf-icon-button--outline[class*=segment-]+.sf-icon-button[class*=segment-]:not(.sf-icon-button--outline){--sf-icon-button--border-top-width: var(--sf-px);--sf-icon-button--border-inline-end-width: var(--sf-px);--sf-icon-button--border-bottom-width: var(--sf-px);--sf-icon-button--border-inline-start-width: var(--sf-px)}sf-icon-button:has(.sf-icon-button--outline[class*=segment-])+sf-icon-button .sf-icon-button[class*=segment-]:not(.sf-icon-button--outline),.sf-icon-button.sf-icon-button--outline[class*=segment-]+.sf-icon-button[class*=segment-]:not(.sf-icon-button--outline){--sf-icon-button--border-top-width: var(--sf-px);--sf-icon-button--border-inline-end-width: var(--sf-px);--sf-icon-button--border-bottom-width: var(--sf-px);--sf-icon-button--border-inline-start-width: var(--sf-px)}sf-icon-button[\:has$.sf-icon-button--outline\[class*\%3Dsegment-\]$]+sf-button .sf-button[class*=segment-]:not(.sf-button--outline),.sf-icon-button.sf-icon-button--outline[class*=segment-]+.sf-button[class*=segment-]:not(.sf-button--outline){--sf-button--border-top-width: var(--sf-px);--sf-button--border-inline-end-width: var(--sf-px);--sf-button--border-bottom-width: var(--sf-px);--sf-button--border-inline-start-width: var(--sf-px)}sf-icon-button:has(.sf-icon-button--outline[class*=segment-])+sf-button .sf-button[class*=segment-]:not(.sf-button--outline),.sf-icon-button.sf-icon-button--outline[class*=segment-]+.sf-button[class*=segment-]:not(.sf-button--outline){--sf-button--border-top-width: var(--sf-px);--sf-button--border-inline-end-width: var(--sf-px);--sf-button--border-bottom-width: var(--sf-px);--sf-button--border-inline-start-width: var(--sf-px)}sf-icon-button[\:has$\%2Bsf-icon-button\%20.sf-icon-button--outline\[class*\%3Dsegment-\]$] .sf-icon-button[class*=segment-]:not(.sf-icon-button--outline),.sf-icon-button[class*=segment-]:not(.sf-icon-button--outline)[\:has$\%2B.sf-icon-button.sf-icon-button--outline\[class*\%3Dsegment-\]$]{--sf-icon-button--border-top-width: var(--sf-px);--sf-icon-button--border-inline-end-width: var(--sf-px);--sf-icon-button--border-bottom-width: var(--sf-px);--sf-icon-button--border-inline-start-width: var(--sf-px)}sf-icon-button:has(+sf-icon-button .sf-icon-button--outline[class*=segment-]) .sf-icon-button[class*=segment-]:not(.sf-icon-button--outline),.sf-icon-button[class*=segment-]:not(.sf-icon-button--outline):has(+.sf-icon-button.sf-icon-button--outline[class*=segment-]){--sf-icon-button--border-top-width: var(--sf-px);--sf-icon-button--border-inline-end-width: var(--sf-px);--sf-icon-button--border-bottom-width: var(--sf-px);--sf-icon-button--border-inline-start-width: var(--sf-px)}sf-icon-button[\:has$\%2Bsf-button\%20.sf-button--outline\[class*\%3Dsegment-\]$] .sf-icon-button[class*=segment-]:not(.sf-icon-button--outline),.sf-icon-button[class*=segment-]:not(.sf-icon-button--outline)[\:has$\%2B.sf-button.sf-button--outline\[class*\%3Dsegment-\]$]{--sf-icon-button--border-top-width: var(--sf-px);--sf-icon-button--border-inline-end-width: var(--sf-px);--sf-icon-button--border-bottom-width: var(--sf-px);--sf-icon-button--border-inline-start-width: var(--sf-px)}sf-icon-button:has(+sf-button .sf-button--outline[class*=segment-]) .sf-icon-button[class*=segment-]:not(.sf-icon-button--outline),.sf-icon-button[class*=segment-]:not(.sf-icon-button--outline):has(+.sf-button.sf-button--outline[class*=segment-]){--sf-icon-button--border-top-width: var(--sf-px);--sf-icon-button--border-inline-end-width: var(--sf-px);--sf-icon-button--border-bottom-width: var(--sf-px);--sf-icon-button--border-inline-start-width: var(--sf-px)}}@layer sf.components{.sf-icon-button{--sf-icon-button-loading-stripe: var(--sf-alpha-8)}.sf-icon-button>*{position:relative;z-index:1}.sf-icon-button.loading,.sf-icon-button.sf-icon-button-state-loading{pointer-events:none;position:relative;overflow:hidden}.sf-icon-button.loading::after,.sf-icon-button.sf-icon-button-state-loading::after{content:"";position:absolute;top:-50%;right:-50%;bottom:-50%;left:-50%;inset:-50%;background-image:repeating-linear-gradient(135deg, var(--sf-icon-button-loading-stripe) 0, var(--sf-icon-button-loading-stripe) var(--sf-space-1\/2), transparent var(--sf-space-1\/2), transparent var(--sf-space-1));-webkit-animation:sf-icon-button-stripes-slide calc(var(--sf-duration-slow)*2) linear infinite;animation:sf-icon-button-stripes-slide calc(var(--sf-duration-slow)*2) linear infinite;will-change:transform;pointer-events:none}@-webkit-keyframes sf-icon-button-stripes-slide{from{-webkit-transform:translateX(0);transform:translateX(0)}to{-webkit-transform:translateX(calc(var(--sf-space-1) * 1.41421356));transform:translateX(calc(var(--sf-space-1) * 1.41421356))}}@keyframes sf-icon-button-stripes-slide{from{-webkit-transform:translateX(0);transform:translateX(0)}to{-webkit-transform:translateX(calc(var(--sf-space-1) * 1.41421356));transform:translateX(calc(var(--sf-space-1) * 1.41421356))}}@media(prefers-reduced-motion: reduce){.sf-icon-button.loading::after,.sf-icon-button.sf-icon-button-state-loading::after{-webkit-animation:none;animation:none}}}

package/distr/component/icon-buttons/js/icon-buttons.min.js ADDED Viewed

@@ -0,0 +1 @@

package/distr/component/icon-buttons/json/icon-button.utility.json ADDED Viewed

@@ -0,0 +1,14 @@
+{
+  ".sf-icon-button": [
+    "display/flex (.flex)",
+    "flex-direction/row (.flex-row)",
+    "flex-wrap/nowrap (.flex-nowrap)",
+    "justify-content/center (.justify-center)",
+    "align-items/center (.items-center)"
+  ],
+  ".sf-icon-button .sf-icon": [
+    "display/flex (.flex)",
+    "justify-content/center (.justify-center)",
+    "align-items/center (.items-center)"
+  ]
+}

package/distr/component/icons/a5f1f832a64baed42867.woff2 ADDED Viewed

Binary file

package/distr/component/icons/css/icons.min.css ADDED Viewed

@@ -0,0 +1 @@

+ .sf-icon--rotate-45{-webkit-transform:rotate(45deg);transform:rotate(45deg);-webkit-transform-origin:center;transform-origin:center}.sf-icon--rotate-90{-webkit-transform:rotate(90deg);transform:rotate(90deg);-webkit-transform-origin:center;transform-origin:center}.sf-icon--rotate-135{-webkit-transform:rotate(135deg);transform:rotate(135deg);-webkit-transform-origin:center;transform-origin:center}.sf-icon--rotate-180{-webkit-transform:rotate(180deg);transform:rotate(180deg);-webkit-transform-origin:center;transform-origin:center}.sf-icon--rotate-225{-webkit-transform:rotate(225deg);transform:rotate(225deg);-webkit-transform-origin:center;transform-origin:center}.sf-icon--rotate-270{-webkit-transform:rotate(270deg);transform:rotate(270deg);-webkit-transform-origin:center;transform-origin:center}.sf-icon--rotate-315{-webkit-transform:rotate(315deg);transform:rotate(315deg);-webkit-transform-origin:center;transform-origin:center}@font-face{font-family:"Material Symbols Outlined";font-style:normal;font-weight:100 700;font-display:block;src:url(../a5f1f832a64baed42867.woff2) format("woff2")}.sf-icon{--sf-icon--fill: 0;--sf-icon--weight: var(--sf-weight--regular);--sf-icon--grade: 0;--sf-icon--optical-size: 24;--sf-icon--line-height: 1;font-variation-settings:"FILL" var(--sf-icon--fill),"wght" var(--sf-icon--weight),"GRAD" var(--sf-icon--grade),"opsz" var(--sf-icon--optical-size);font-family:"Material Symbols Outlined";font-family:var(--sf-icon--font-family, "Material Symbols Outlined");font-weight:var(--sf-icon--weight);font-style:normal;font-size:var(--sf-icon-size-3);font-size:var(--sf-icon--font-size, var(--sf-icon-size-3));line-height:1;line-height:var(--sf-icon--line-height, 1);letter-spacing:normal;text-transform:none;justify-content:center;align-items:center;white-space:nowrap;word-wrap:normal;direction:ltr;flex:none;-webkit-font-feature-settings:"liga";-webkit-font-smoothing:antialiased;vertical-align:bottom;height:var(--sf-icon-size-3);height:var(--sf-icon--height, var(--sf-icon-size-3));width:var(--sf-icon-size-3);width:var(--sf-icon--width, var(--sf-icon-size-3))}.sf-icon:not(.hidden){display:inline-flex}:root[data-sf-icons=subset-pending] .sf-icon{--sf-icon--font-family: "Material Symbols Outlined Subset";-webkit-text-fill-color:rgba(0,0,0,0);overflow:hidden}.sf-icon--size-1\/4{--sf-icon--font-size: var(--sf-icon-size-1\/4);--sf-icon--width: var(--sf-icon-size-1\/4);--sf-icon--height: var(--sf-icon-size-1\/4)}.sf-icon--size-1\/3{--sf-icon--font-size: var(--sf-icon-size-1\/3);--sf-icon--width: var(--sf-icon-size-1\/3);--sf-icon--height: var(--sf-icon-size-1\/3)}.sf-icon--size-1\/2{--sf-icon--font-size: var(--sf-icon-size-1\/2);--sf-icon--width: var(--sf-icon-size-1\/2);--sf-icon--height: var(--sf-icon-size-1\/2)}.sf-icon--size-1{--sf-icon--font-size: var(--sf-icon-size-1);--sf-icon--width: var(--sf-icon-size-1);--sf-icon--height: var(--sf-icon-size-1)}.sf-icon--size-2{--sf-icon--font-size: var(--sf-icon-size-2);--sf-icon--width: var(--sf-icon-size-2);--sf-icon--height: var(--sf-icon-size-2)}.sf-icon--size-3{--sf-icon--font-size: var(--sf-icon-size-3);--sf-icon--width: var(--sf-icon-size-3);--sf-icon--height: var(--sf-icon-size-3)}.sf-icon--size-4{--sf-icon--font-size: var(--sf-icon-size-4);--sf-icon--width: var(--sf-icon-size-4);--sf-icon--height: var(--sf-icon-size-4)}.sf-icon--size-5{--sf-icon--font-size: var(--sf-icon-size-5);--sf-icon--width: var(--sf-icon-size-5);--sf-icon--height: var(--sf-icon-size-5)}.sf-icon--size-6{--sf-icon--font-size: var(--sf-icon-size-6);--sf-icon--width: var(--sf-icon-size-6);--sf-icon--height: var(--sf-icon-size-6)}.sf-icon--size-7{--sf-icon--font-size: var(--sf-icon-size-7);--sf-icon--width: var(--sf-icon-size-7);--sf-icon--height: var(--sf-icon-size-7)}.sf-icon--weight-thin,.sf-icon-thin{--sf-icon--weight: var(--sf-weight--thin)}.sf-icon--weight-extra-light,.sf-icon-extra-light{--sf-icon--weight: var(--sf-weight--extra-light)}.sf-icon--weight-light,.sf-icon-light{--sf-icon--weight: var(--sf-weight--light)}.sf-icon--weight-regular,.sf-icon-regular{--sf-icon--weight: var(--sf-weight--regular)}.sf-icon--weight-medium,.sf-icon-medium{--sf-icon--weight: var(--sf-weight--medium)}.sf-icon--weight-semi-bold,.sf-icon-semi-bold{--sf-icon--weight: var(--sf-weight--semi-bold)}.sf-icon--weight-bold,.sf-icon-bold{--sf-icon--weight: var(--sf-weight--bold)}@layer sf.base{.sf-icon{color:currentColor;color:var(--sf-icon--color, currentColor)}}.sf-icon--filled,.sf-icon-filled,.sf-icon-solid{--sf-icon--fill: 1}.sf-icon--rounded,.sf-icon-rounded{--sf-icon--font-family: "Material Symbols Rounded"}.sf-icon--sharp,.sf-icon-shape{--sf-icon--font-family: "Material Symbols Sharp"}sf-icon:not(:defined){display:inline-flex;flex:none;width:var(--sf-icon-size-3);width:var(--sf-icon--width, var(--sf-icon-size-3));height:var(--sf-icon-size-3);height:var(--sf-icon--height, var(--sf-icon-size-3));vertical-align:bottom}sf-icon[size="1/4"]:not(:defined){--sf-icon--width: var(--sf-icon-size-1\/4);--sf-icon--height: var(--sf-icon-size-1\/4)}sf-icon[size="1/3"]:not(:defined){--sf-icon--width: var(--sf-icon-size-1\/3);--sf-icon--height: var(--sf-icon-size-1\/3)}sf-icon[size="1/2"]:not(:defined){--sf-icon--width: var(--sf-icon-size-1\/2);--sf-icon--height: var(--sf-icon-size-1\/2)}sf-icon[size="1"]:not(:defined){--sf-icon--width: var(--sf-icon-size-1);--sf-icon--height: var(--sf-icon-size-1)}sf-icon[size="2"]:not(:defined){--sf-icon--width: var(--sf-icon-size-2);--sf-icon--height: var(--sf-icon-size-2)}sf-icon[size="3"]:not(:defined){--sf-icon--width: var(--sf-icon-size-3);--sf-icon--height: var(--sf-icon-size-3)}sf-icon[size="4"]:not(:defined){--sf-icon--width: var(--sf-icon-size-4);--sf-icon--height: var(--sf-icon-size-4)}sf-icon[size="5"]:not(:defined){--sf-icon--width: var(--sf-icon-size-5);--sf-icon--height: var(--sf-icon-size-5)}sf-icon[size="6"]:not(:defined){--sf-icon--width: var(--sf-icon-size-6);--sf-icon--height: var(--sf-icon-size-6)}sf-icon[size="7"]:not(:defined){--sf-icon--width: var(--sf-icon-size-7);--sf-icon--height: var(--sf-icon-size-7)}

package/distr/component/icons/fonts/MaterialIconsOutlined-Regular.otf ADDED Viewed

Binary file

package/distr/component/icons/fonts/MaterialIconsRound-Regular.otf ADDED Viewed

Binary file

package/distr/component/icons/fonts/MaterialIconsSharp-Regular.otf ADDED Viewed

Binary file

package/distr/component/icons/fonts/MaterialIconsTwoTone-Regular.otf ADDED Viewed

Binary file

package/distr/component/icons/fonts/MaterialSymbols-Outlined.woff2 ADDED Viewed

Binary file

package/distr/component/icons/js/icons.min.js ADDED Viewed

File without changes

package/distr/component/inputs/css/inputs.min.css ADDED Viewed

@@ -0,0 +1 @@

+ @layer sf.components{.sf-input .sf-input-field input{flex:1 1 auto;min-width:0;width:auto}.sf-input .sf-input-right,.sf-input .sf-input-field>.sf-icon,.sf-input .sf-input-field>.sf-icon-hint{flex-shrink:0}}@layer sf.components{.sf-input{min-width:0;min-inline-size:0;--sf-input--radius: var(--sf-input-radius, var(--sf-radius--ui));background-color:transparent;background-color:var(--sf-input--background-color, transparent);gap:var(--sf-space-1\/4);gap:var(--sf-input--gap, var(--sf-space-1\/4))}.sf-input .sf-icon{color:var(--sf-on-surface-variant);color:var(--sf-icon--color, var(--sf-on-surface-variant));font-size:var(--sf-icon-size-3);font-size:var(--sf-icon--font-size, var(--sf-icon-size-3));height:var(--sf-icon-size-3);height:var(--sf-icon--height, var(--sf-icon-size-3));width:var(--sf-icon-size-3);width:var(--sf-icon--width, var(--sf-icon-size-3))}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-input .sf-input-field{border-bottom-right-radius:var(--sf-input-field--border-end-end-radius)}@supports not (border-end-end-radius: initial){html:not([dir="rtl"]) .sf-input .sf-input-field{border-bottom-right-radius:var(--sf-input-field--border-end-end-radius)}}.sf-input .sf-input-field:where(:dir(ltr)){border-bottom-right-radius:var(--sf-input-field--border-end-end-radius)}_:-ms-input-placeholder, [dir="rtl"] .sf-input .sf-input-field{border-bottom-left-radius:var(--sf-input-field--border-end-end-radius)}@supports not (border-end-end-radius: initial){[dir="rtl"] .sf-input .sf-input-field{border-bottom-left-radius:var(--sf-input-field--border-end-end-radius)}}.sf-input .sf-input-field:where(:dir(rtl)){border-bottom-left-radius:var(--sf-input-field--border-end-end-radius)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-input .sf-input-field{border-bottom-left-radius:var(--sf-input-field--border-end-start-radius)}@supports not (border-end-start-radius: initial){html:not([dir="rtl"]) .sf-input .sf-input-field{border-bottom-left-radius:var(--sf-input-field--border-end-start-radius)}}.sf-input .sf-input-field:where(:dir(ltr)){border-bottom-left-radius:var(--sf-input-field--border-end-start-radius)}_:-ms-input-placeholder, [dir="rtl"] .sf-input .sf-input-field{border-bottom-right-radius:var(--sf-input-field--border-end-start-radius)}@supports not (border-end-start-radius: initial){[dir="rtl"] .sf-input .sf-input-field{border-bottom-right-radius:var(--sf-input-field--border-end-start-radius)}}.sf-input .sf-input-field:where(:dir(rtl)){border-bottom-right-radius:var(--sf-input-field--border-end-start-radius)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-input .sf-input-field{border-top-right-radius:var(--sf-input-field--border-start-end-radius)}@supports not (border-start-end-radius: initial){html:not([dir="rtl"]) .sf-input .sf-input-field{border-top-right-radius:var(--sf-input-field--border-start-end-radius)}}.sf-input .sf-input-field:where(:dir(ltr)){border-top-right-radius:var(--sf-input-field--border-start-end-radius)}_:-ms-input-placeholder, [dir="rtl"] .sf-input .sf-input-field{border-top-left-radius:var(--sf-input-field--border-start-end-radius)}@supports not (border-start-end-radius: initial){[dir="rtl"] .sf-input .sf-input-field{border-top-left-radius:var(--sf-input-field--border-start-end-radius)}}.sf-input .sf-input-field:where(:dir(rtl)){border-top-left-radius:var(--sf-input-field--border-start-end-radius)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-input .sf-input-field{border-top-left-radius:var(--sf-input-field--border-start-start-radius)}@supports not (border-start-start-radius: initial){html:not([dir="rtl"]) .sf-input .sf-input-field{border-top-left-radius:var(--sf-input-field--border-start-start-radius)}}.sf-input .sf-input-field:where(:dir(ltr)){border-top-left-radius:var(--sf-input-field--border-start-start-radius)}_:-ms-input-placeholder, [dir="rtl"] .sf-input .sf-input-field{border-top-right-radius:var(--sf-input-field--border-start-start-radius)}@supports not (border-start-start-radius: initial){[dir="rtl"] .sf-input .sf-input-field{border-top-right-radius:var(--sf-input-field--border-start-start-radius)}}.sf-input .sf-input-field:where(:dir(rtl)){border-top-right-radius:var(--sf-input-field--border-start-start-radius)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-input .sf-input-field{padding-right:var(--sf-input-field--padding-inline-end)}@supports not (padding-inline-end: initial){html:not([dir="rtl"]) .sf-input .sf-input-field{padding-right:var(--sf-input-field--padding-inline-end)}}.sf-input .sf-input-field:where(:dir(ltr)){padding-right:var(--sf-input-field--padding-inline-end)}_:-ms-input-placeholder, [dir="rtl"] .sf-input .sf-input-field{padding-left:var(--sf-input-field--padding-inline-end)}@supports not (padding-inline-end: initial){[dir="rtl"] .sf-input .sf-input-field{padding-left:var(--sf-input-field--padding-inline-end)}}.sf-input .sf-input-field:where(:dir(rtl)){padding-left:var(--sf-input-field--padding-inline-end)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-input .sf-input-field{padding-left:var(--sf-input-field--padding-inline-start)}@supports not (padding-inline-start: initial){html:not([dir="rtl"]) .sf-input .sf-input-field{padding-left:var(--sf-input-field--padding-inline-start)}}.sf-input .sf-input-field:where(:dir(ltr)){padding-left:var(--sf-input-field--padding-inline-start)}_:-ms-input-placeholder, [dir="rtl"] .sf-input .sf-input-field{padding-right:var(--sf-input-field--padding-inline-start)}@supports not (padding-inline-start: initial){[dir="rtl"] .sf-input .sf-input-field{padding-right:var(--sf-input-field--padding-inline-start)}}.sf-input .sf-input-field:where(:dir(rtl)){padding-right:var(--sf-input-field--padding-inline-start)}.sf-input .sf-input-field{min-width:0;min-inline-size:0;--sf-input-field--border: var(--sf-px) solid;--sf-input-field--border-end-end-radius: var(--sf-input--radius);--sf-input-field--border-end-start-radius: var(--sf-input--radius);--sf-input-field--border-start-end-radius: var(--sf-input--radius);--sf-input-field--border-start-start-radius: var(--sf-input--radius);background-color:var(--sf-input-field--background-color);border:0 solid;border:var(--sf-input-field--border, 0 solid);border-color:transparent;border-color:var(--sf-input-field--border-color, transparent);border-end-end-radius:var(--sf-input-field--border-end-end-radius);border-end-start-radius:var(--sf-input-field--border-end-start-radius);border-start-end-radius:var(--sf-input-field--border-start-end-radius);border-start-start-radius:var(--sf-input-field--border-start-start-radius);box-shadow:var(--sf-input-field--box-shadow);padding-bottom:var(--sf-input-field--padding-bottom);-webkit-padding-end:var(--sf-input-field--padding-inline-end);padding-inline-end:var(--sf-input-field--padding-inline-end);-webkit-padding-start:var(--sf-input-field--padding-inline-start);padding-inline-start:var(--sf-input-field--padding-inline-start);padding-top:var(--sf-input-field--padding-top);transition-duration:var(--sf-duration-fast);transition-property:background-color,border-color,box-shadow,color;transition-timing-function:var(--sf-animation)}.sf-input .sf-input-hint{--sf-input-hint--background-color: transparent;background-color:var(--sf-input-hint--background-color)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-input .sf-input-field input{padding-right:var(--sf-input-input--padding-inline-end)}@supports not (padding-inline-end: initial){html:not([dir="rtl"]) .sf-input .sf-input-field input{padding-right:var(--sf-input-input--padding-inline-end)}}.sf-input .sf-input-field input:where(:dir(ltr)){padding-right:var(--sf-input-input--padding-inline-end)}_:-ms-input-placeholder, [dir="rtl"] .sf-input .sf-input-field input{padding-left:var(--sf-input-input--padding-inline-end)}@supports not (padding-inline-end: initial){[dir="rtl"] .sf-input .sf-input-field input{padding-left:var(--sf-input-input--padding-inline-end)}}.sf-input .sf-input-field input:where(:dir(rtl)){padding-left:var(--sf-input-input--padding-inline-end)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-input .sf-input-field input{padding-left:var(--sf-input-input--padding-inline-start)}@supports not (padding-inline-start: initial){html:not([dir="rtl"]) .sf-input .sf-input-field input{padding-left:var(--sf-input-input--padding-inline-start)}}.sf-input .sf-input-field input:where(:dir(ltr)){padding-left:var(--sf-input-input--padding-inline-start)}_:-ms-input-placeholder, [dir="rtl"] .sf-input .sf-input-field input{padding-right:var(--sf-input-input--padding-inline-start)}@supports not (padding-inline-start: initial){[dir="rtl"] .sf-input .sf-input-field input{padding-right:var(--sf-input-input--padding-inline-start)}}.sf-input .sf-input-field input:where(:dir(rtl)){padding-right:var(--sf-input-input--padding-inline-start)}.sf-input .sf-input-field input{min-width:0;min-inline-size:0;--sf-input-input--background-color: transparent;background-color:var(--sf-input-input--background-color);color:var(--sf-input-input--color);color:var(--sf-input-color, var(--sf-input-input--color));font-family:var(--sf-input-input--font-family);font-size:var(--sf-input-input--font-size);line-height:var(--sf-input-input--line-height);-webkit-padding-end:var(--sf-input-input--padding-inline-end);padding-inline-end:var(--sf-input-input--padding-inline-end);-webkit-padding-start:var(--sf-input-input--padding-inline-start);padding-inline-start:var(--sf-input-input--padding-inline-start)}.sf-input .sf-input-field input::-webkit-input-placeholder{--sf-input-placeholder--color: var(--sf-on-surface-variant);--sf-input-placeholder--font-family: var(--sf-text--family);color:var(--sf-input-placeholder--color);font-family:var(--sf-input-placeholder--font-family);font-size:var(--sf-input-placeholder--font-size);line-height:var(--sf-input-placeholder--line-height)}.sf-input .sf-input-field input::-moz-placeholder{--sf-input-placeholder--color: var(--sf-on-surface-variant);--sf-input-placeholder--font-family: var(--sf-text--family);color:var(--sf-input-placeholder--color);font-family:var(--sf-input-placeholder--font-family);font-size:var(--sf-input-placeholder--font-size);line-height:var(--sf-input-placeholder--line-height)}.sf-input .sf-input-field input:-ms-input-placeholder{--sf-input-placeholder--color: var(--sf-on-surface-variant);--sf-input-placeholder--font-family: var(--sf-text--family);color:var(--sf-input-placeholder--color);font-family:var(--sf-input-placeholder--font-family);font-size:var(--sf-input-placeholder--font-size);line-height:var(--sf-input-placeholder--line-height)}.sf-input .sf-input-field input::-ms-input-placeholder{--sf-input-placeholder--color: var(--sf-on-surface-variant);--sf-input-placeholder--font-family: var(--sf-text--family);color:var(--sf-input-placeholder--color);font-family:var(--sf-input-placeholder--font-family);font-size:var(--sf-input-placeholder--font-size);line-height:var(--sf-input-placeholder--line-height)}.sf-input .sf-input-field input::placeholder{--sf-input-placeholder--color: var(--sf-on-surface-variant);--sf-input-placeholder--font-family: var(--sf-text--family);color:var(--sf-input-placeholder--color);font-family:var(--sf-input-placeholder--font-family);font-size:var(--sf-input-placeholder--font-size);line-height:var(--sf-input-placeholder--line-height)}.sf-input.sf-input--filled .sf-input-field input::-webkit-input-placeholder{--sf-input-placeholder--color: var(--sf-on-surface)}.sf-input.sf-input--filled .sf-input-field input::-moz-placeholder{--sf-input-placeholder--color: var(--sf-on-surface)}.sf-input.sf-input--filled .sf-input-field input:-ms-input-placeholder{--sf-input-placeholder--color: var(--sf-on-surface)}.sf-input.sf-input--filled .sf-input-field input::-ms-input-placeholder{--sf-input-placeholder--color: var(--sf-on-surface)}.sf-input.sf-input--filled .sf-input-field input::placeholder{--sf-input-placeholder--color: var(--sf-on-surface)}.sf-input .sf-input-left{--sf-input-left--background-color: transparent;background-color:var(--sf-input-left--background-color)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-input .sf-input-right{padding-right:var(--sf-input-right--padding-inline-end)}@supports not (padding-inline-end: initial){html:not([dir="rtl"]) .sf-input .sf-input-right{padding-right:var(--sf-input-right--padding-inline-end)}}.sf-input .sf-input-right:where(:dir(ltr)){padding-right:var(--sf-input-right--padding-inline-end)}_:-ms-input-placeholder, [dir="rtl"] .sf-input .sf-input-right{padding-left:var(--sf-input-right--padding-inline-end)}@supports not (padding-inline-end: initial){[dir="rtl"] .sf-input .sf-input-right{padding-left:var(--sf-input-right--padding-inline-end)}}.sf-input .sf-input-right:where(:dir(rtl)){padding-left:var(--sf-input-right--padding-inline-end)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-input .sf-input-right{padding-left:var(--sf-input-right--padding-inline-start)}@supports not (padding-inline-start: initial){html:not([dir="rtl"]) .sf-input .sf-input-right{padding-left:var(--sf-input-right--padding-inline-start)}}.sf-input .sf-input-right:where(:dir(ltr)){padding-left:var(--sf-input-right--padding-inline-start)}_:-ms-input-placeholder, [dir="rtl"] .sf-input .sf-input-right{padding-right:var(--sf-input-right--padding-inline-start)}@supports not (padding-inline-start: initial){[dir="rtl"] .sf-input .sf-input-right{padding-right:var(--sf-input-right--padding-inline-start)}}.sf-input .sf-input-right:where(:dir(rtl)){padding-right:var(--sf-input-right--padding-inline-start)}.sf-input .sf-input-right{--sf-input-right--background-color: transparent;background-color:var(--sf-input-right--background-color);-webkit-padding-end:var(--sf-input-right--padding-inline-end);padding-inline-end:var(--sf-input-right--padding-inline-end);-webkit-padding-start:var(--sf-input-right--padding-inline-start);padding-inline-start:var(--sf-input-right--padding-inline-start)}.sf-input .sf-input-text{--sf-input-text--color: var(--sf-on-surface-variant);--sf-input-text--font-family: var(--sf-text--family);--sf-input-text--font-weight: var(--sf-font-weight-regular);color:var(--sf-input-text--color);font-family:var(--sf-input-text--font-family);font-size:var(--sf-input-text--font-size);font-weight:var(--sf-input-text--font-weight);line-height:var(--sf-input-text--line-height)}.sf-input .sf-input-hint-text-wrap{--sf-input-hint-text-wrap--background-color: transparent;background-color:var(--sf-input-hint-text-wrap--background-color);color:var(--sf-input-hint-text-wrap--color);font-family:var(--sf-input-hint-text-wrap--font-family);font-size:var(--sf-input-hint-text-wrap--font-size);font-weight:var(--sf-input-hint-text-wrap--font-weight);gap:var(--sf-b0);line-height:var(--sf-input-hint-text-wrap--line-height)}.sf-input .sf-input-label{--sf-input-label--background-color: transparent;--sf-input-label--gap: var(--sf-space-1\/4);background-color:var(--sf-input-label--background-color);gap:var(--sf-input-label--gap)}.sf-input .sf-input-required{--sf-input-required--color: var(--sf-error);--sf-input-required--font-family: var(--sf-text--family);--sf-input-required--font-weight: var(--sf-font-weight-regular);color:var(--sf-input-required--color);font-family:var(--sf-input-required--font-family);font-size:var(--sf-input-required--font-size);font-weight:var(--sf-input-required--font-weight);line-height:var(--sf-input-required--line-height)}.sf-input.sf-input--size-1 .sf-input-field .sf-input-right .sf-input-text,.sf-input.sf-input--size-2 .sf-input-label .sf-input-text{--sf-input-text--font-size: var(--sf-text-size-1);--sf-input-text--line-height: var(--sf-text-height-1)}.sf-input.sf-input--bordered>.sf-input-field>.sf-input-hint>.sf-icon,.sf-input.sf-input--filled>.sf-input-field>.sf-input-hint>.sf-icon{--sf-icon--color: var(--sf-on-surface-variant)}.sf-input.sf-input--size-1>.sf-input-field>.sf-input-hint>.sf-icon,.sf-input.sf-input--size-1>.sf-input-field>.sf-input-left .sf-icon,.sf-input.sf-input--size-1>.sf-input-field>.sf-icon{--sf-icon--font-size: var(--sf-text-height-1);--sf-icon--height: var(--sf-text-height-1);--sf-icon--width: var(--sf-text-height-1)}.sf-input.sf-input--size-1 .sf-input-field input{--sf-input-input--padding-inline-end: var(--sf-ui-1--text-space-x);--sf-input-input--padding-inline-start: var(--sf-ui-1--text-space-x)}.sf-input.sf-input--size-1 .sf-input-hint-text-wrap{--sf-input-hint-text-wrap--font-size: var(--sf-text-size-1\/2);--sf-input-hint-text-wrap--line-height: var(--sf-text-height-1\/2)}.sf-input.sf-input--size-1 .sf-input-hint-text-wrap,.sf-input.sf-input--size-2 .sf-input-hint-text-wrap,.sf-input.sf-input--size-1\/2 .sf-input-hint-text-wrap{--sf-input-hint-text-wrap--font-family: var(--sf-text--family);--sf-input-hint-text-wrap--font-weight: var(--sf-font-weight-regular)}.sf-input.sf-input--bordered .sf-input-hint-text-wrap,.sf-input.sf-input--filled .sf-input-hint-text-wrap{--sf-input-hint-text-wrap--color: var(--sf-on-surface-variant)}.sf-input.sf-input--size-1 input{--sf-input-input--font-size: var(--sf-text-size-1);--sf-input-input--line-height: var(--sf-text-height-1)}.sf-input.sf-input--size-1 input,.sf-input.sf-input--size-2 input,.sf-input.sf-input--size-1\/2 input{--sf-input-input--font-family: var(--sf-text--family)}.sf-input.sf-input--bordered input,.sf-input.sf-input--filled input{--sf-input-input--color: var(--sf-on-surface)}.sf-input.sf-input--size-1 .sf-input-label .sf-input-text,.sf-input.sf-input--size-1\/2 .sf-input-field .sf-input-right .sf-input-text{--sf-input-text--font-size: var(--sf-text-size-1\/2);--sf-input-text--line-height: var(--sf-text-height-1\/2)}.sf-input.sf-input--size-1 .sf-input-required{--sf-input-required--font-size: var(--sf-text-size-1\/2);--sf-input-required--line-height: var(--sf-text-height-1\/2)}.sf-input.sf-input--size-1 .sf-input-right{--sf-input-right--padding-inline-end: var(--sf-ui-1--text-space-x);--sf-input-right--padding-inline-start: var(--sf-ui-1--text-space-x)}.sf-input.error.sf-input--bordered .sf-input-field{--sf-input-field--background-color: var(--sf-transparent-for-focus);--sf-input-field--border-color: var(--sf-error)}.sf-input.error.sf-input--bordered .sf-input-hint-text-wrap,.sf-input.error.sf-input--filled .sf-input-hint-text-wrap{--sf-input-hint-text-wrap--color: var(--sf-error)}.sf-input.error.sf-input--filled .sf-input-field{--sf-input-field--background-color: var(--sf-error-container)}.sf-input.sf-input--size-2 .sf-input-field input{--sf-input-input--padding-inline-end: var(--sf-ui-2--text-space-x);--sf-input-input--padding-inline-start: var(--sf-ui-2--text-space-x)}.sf-input.sf-input--size-2 .sf-input-hint-text-wrap{--sf-input-hint-text-wrap--font-size: var(--sf-text-size-1);--sf-input-hint-text-wrap--line-height: var(--sf-text-height-1)}.sf-input.sf-input--size-2 .sf-input-required{--sf-input-required--font-size: var(--sf-text-size-1);--sf-input-required--line-height: var(--sf-text-height-1)}.sf-input.sf-input--size-2 .sf-input-right{--sf-input-right--padding-inline-end: var(--sf-ui-2--text-space-x);--sf-input-right--padding-inline-start: var(--sf-ui-2--text-space-x)}.sf-input.sf-input--size-2 .sf-input-field .sf-input-right .sf-input-text{--sf-input-text--font-size: var(--sf-text-size-2);--sf-input-text--line-height: var(--sf-text-height-2)}.sf-input.sf-input--size-2>.sf-input-field>.sf-input-hint>.sf-icon,.sf-input.sf-input--size-2>.sf-input-field>.sf-input-left .sf-icon,.sf-input.sf-input--size-2>.sf-input-field>.sf-icon{--sf-icon--font-size: var(--sf-text-height-2);--sf-icon--height: var(--sf-text-height-2);--sf-icon--width: var(--sf-text-height-2)}.sf-input.sf-input--size-2 input{--sf-input-input--font-size: var(--sf-text-size-2);--sf-input-input--line-height: var(--sf-text-height-2)}.sf-input.sf-input--size-1\/2 .sf-input-label .sf-input-text{--sf-input-text--font-size: var(--sf-text-size-1\/3);--sf-input-text--line-height: var(--sf-text-height-1\/3)}.sf-input.sf-input--size-1\/2>.sf-input-field>.sf-input-hint>.sf-icon,.sf-input.sf-input--size-1\/2>.sf-input-field>.sf-input-left .sf-icon,.sf-input.sf-input--size-1\/2>.sf-input-field>.sf-icon{--sf-icon--font-size: var(--sf-text-height-1\/2);--sf-icon--height: var(--sf-text-height-1\/2);--sf-icon--width: var(--sf-text-height-1\/2)}.sf-input.sf-input--size-1\/2 .sf-input-field input{--sf-input-input--padding-inline-end: var(--sf-ui-1\/2--text-space-x);--sf-input-input--padding-inline-start: var(--sf-ui-1\/2--text-space-x)}.sf-input.sf-input--size-1\/2 .sf-input-hint-text-wrap{--sf-input-hint-text-wrap--font-size: var(--sf-text-size-1\/3);--sf-input-hint-text-wrap--line-height: var(--sf-text-height-1\/3)}.sf-input.sf-input--size-1\/2 input{--sf-input-input--font-size: var(--sf-text-size-1\/2);--sf-input-input--line-height: var(--sf-text-height-1\/2)}.sf-input.sf-input--size-1\/2 .sf-input-required{--sf-input-required--font-size: var(--sf-text-size-1\/3);--sf-input-required--line-height: var(--sf-text-height-1\/3)}.sf-input.sf-input--size-1\/2 .sf-input-right{--sf-input-right--padding-inline-end: var(--sf-ui-1\/2--text-space-x);--sf-input-right--padding-inline-start: var(--sf-ui-1\/2--text-space-x)}.sf-input.sf-input--size-1 .sf-input-field{height:var(--sf-ui-1--control-height);block-size:var(--sf-ui-1--control-height);--sf-input-field--padding-bottom: var(--sf-input-padding-block, calc(var(--sf-ui-1--space-y-tightness-default) - var(--sf-px)));--sf-input-field--padding-inline-end: var(--sf-input-padding-inline, var(--sf-ui-1--space-x));--sf-input-field--padding-inline-start: var(--sf-input-padding-inline, var(--sf-ui-1--space-x));--sf-input-field--padding-top: var(--sf-input-padding-block, calc(var(--sf-ui-1--space-y-tightness-default) - var(--sf-px)))}.sf-input.sf-input--size-1 .sf-input-field input::-webkit-input-placeholder{--sf-input-placeholder--font-size: var(--sf-text-size-1);--sf-input-placeholder--line-height: var(--sf-text-height-1)}.sf-input.sf-input--size-1 .sf-input-field input::-moz-placeholder{--sf-input-placeholder--font-size: var(--sf-text-size-1);--sf-input-placeholder--line-height: var(--sf-text-height-1)}.sf-input.sf-input--size-1 .sf-input-field input:-ms-input-placeholder{--sf-input-placeholder--font-size: var(--sf-text-size-1);--sf-input-placeholder--line-height: var(--sf-text-height-1)}.sf-input.sf-input--size-1 .sf-input-field input::-ms-input-placeholder{--sf-input-placeholder--font-size: var(--sf-text-size-1);--sf-input-placeholder--line-height: var(--sf-text-height-1)}.sf-input.sf-input--size-1 .sf-input-field input::placeholder{--sf-input-placeholder--font-size: var(--sf-text-size-1);--sf-input-placeholder--line-height: var(--sf-text-height-1)}.sf-input.sf-input--size-2 .sf-input-field{height:var(--sf-ui-2--control-height);block-size:var(--sf-ui-2--control-height);--sf-input-field--padding-bottom: var(--sf-input-padding-block, calc(var(--sf-ui-2--space-y-tightness-default) - var(--sf-px)));--sf-input-field--padding-inline-end: var(--sf-input-padding-inline, var(--sf-ui-2--space-x));--sf-input-field--padding-inline-start: var(--sf-input-padding-inline, var(--sf-ui-2--space-x));--sf-input-field--padding-top: var(--sf-input-padding-block, calc(var(--sf-ui-2--space-y-tightness-default) - var(--sf-px)))}.sf-input.sf-input--size-2 .sf-input-field input::-webkit-input-placeholder{--sf-input-placeholder--font-size: var(--sf-text-size-2);--sf-input-placeholder--line-height: var(--sf-text-height-2)}.sf-input.sf-input--size-2 .sf-input-field input::-moz-placeholder{--sf-input-placeholder--font-size: var(--sf-text-size-2);--sf-input-placeholder--line-height: var(--sf-text-height-2)}.sf-input.sf-input--size-2 .sf-input-field input:-ms-input-placeholder{--sf-input-placeholder--font-size: var(--sf-text-size-2);--sf-input-placeholder--line-height: var(--sf-text-height-2)}.sf-input.sf-input--size-2 .sf-input-field input::-ms-input-placeholder{--sf-input-placeholder--font-size: var(--sf-text-size-2);--sf-input-placeholder--line-height: var(--sf-text-height-2)}.sf-input.sf-input--size-2 .sf-input-field input::placeholder{--sf-input-placeholder--font-size: var(--sf-text-size-2);--sf-input-placeholder--line-height: var(--sf-text-height-2)}.sf-input.sf-input--size-1\/2 .sf-input-field{height:var(--sf-ui-1\/2--control-height);block-size:var(--sf-ui-1\/2--control-height);--sf-input-field--padding-bottom: var(--sf-input-padding-block, calc(var(--sf-ui-1\/2--space-y-tightness-default) - var(--sf-px)));--sf-input-field--padding-inline-end: var(--sf-input-padding-inline, var(--sf-ui-1\/2--space-x));--sf-input-field--padding-inline-start: var(--sf-input-padding-inline, var(--sf-ui-1\/2--space-x));--sf-input-field--padding-top: var(--sf-input-padding-block, calc(var(--sf-ui-1\/2--space-y-tightness-default) - var(--sf-px)))}.sf-input.sf-input--size-1\/2 .sf-input-field input::-webkit-input-placeholder{--sf-input-placeholder--font-size: var(--sf-text-size-1\/2);--sf-input-placeholder--line-height: var(--sf-text-height-1\/2)}.sf-input.sf-input--size-1\/2 .sf-input-field input::-moz-placeholder{--sf-input-placeholder--font-size: var(--sf-text-size-1\/2);--sf-input-placeholder--line-height: var(--sf-text-height-1\/2)}.sf-input.sf-input--size-1\/2 .sf-input-field input:-ms-input-placeholder{--sf-input-placeholder--font-size: var(--sf-text-size-1\/2);--sf-input-placeholder--line-height: var(--sf-text-height-1\/2)}.sf-input.sf-input--size-1\/2 .sf-input-field input::-ms-input-placeholder{--sf-input-placeholder--font-size: var(--sf-text-size-1\/2);--sf-input-placeholder--line-height: var(--sf-text-height-1\/2)}.sf-input.sf-input--size-1\/2 .sf-input-field input::placeholder{--sf-input-placeholder--font-size: var(--sf-text-size-1\/2);--sf-input-placeholder--line-height: var(--sf-text-height-1\/2)}.sf-input.error>.sf-input-field>.sf-input-hint>.sf-icon{--sf-icon--color: var(--sf-error)}}@layer sf.states{.sf-input:not(.error).sf-input--bordered[\:not-has$input\:disabled$] .sf-input-field{--sf-input-field--background-color: var(--sf-input-background-color, var(--sf-surface-0));--sf-input-field--border-color: var(--sf-input-border-color, var(--sf-outline))}.sf-input:not(.error).sf-input--bordered:not(:has(input:disabled)) .sf-input-field{--sf-input-field--background-color: var(--sf-input-background-color, var(--sf-surface-0));--sf-input-field--border-color: var(--sf-input-border-color, var(--sf-outline))}.sf-input:not(.error).sf-input--bordered[\:has$input\:enabled\:not\(\:disabled$\:not$.disabled$\:not$\:-moz-read-only$\:active\)] .sf-input-field{--sf-input-field--border-color: var(--sf-primary)}.sf-input:not(.error).sf-input--bordered[\:has$input\:enabled\:not\(\:disabled$\:not$.disabled$\:not$\:read-only$\:active\)] .sf-input-field{--sf-input-field--border-color: var(--sf-primary)}.sf-input:not(.error).sf-input--bordered:has(input:enabled:not(:disabled):not(.disabled):not(:-moz-read-only):active) .sf-input-field{--sf-input-field--border-color: var(--sf-primary)}.sf-input:not(.error).sf-input--bordered:has(input:enabled:not(:disabled):not(.disabled):not(:read-only):active) .sf-input-field{--sf-input-field--border-color: var(--sf-primary)}.sf-input.sf-input--bordered[\:has$input\:disabled$] .sf-input-field{--sf-input-field--border-color: var(--sf-outline-disable)}.sf-input.sf-input--bordered:has(input:disabled) .sf-input-field{--sf-input-field--border-color: var(--sf-outline-disable)}.sf-input.sf-input--bordered[\:has$input\:disabled$] input,.sf-input.sf-input--filled[\:has$input\:disabled$] input{--sf-input-input--color: var(--sf-on-disable)}.sf-input.sf-input--bordered:has(input:disabled) input,.sf-input.sf-input--filled:has(input:disabled) input{--sf-input-input--color: var(--sf-on-disable)}.sf-input.sf-input--filled[\:has$input\:disabled$] .sf-input-field{--sf-input-field--background-color: var(--sf-disable)}.sf-input.sf-input--filled:has(input:disabled) .sf-input-field{--sf-input-field--background-color: var(--sf-disable)}.sf-input:not(.error).sf-input--filled[\:not-has$input\:disabled$] .sf-input-field{--sf-input-field--background-color: var(--sf-input-background-color, var(--sf-surface-container));--sf-on-surface-variant: var(--sf-on-surface-container--variant);--sf-input-field--border-color: var(--sf-input-border-color, var(--sf-transparent-for-focus))}.sf-input:not(.error).sf-input--filled:not(:has(input:disabled)) .sf-input-field{--sf-input-field--background-color: var(--sf-input-background-color, var(--sf-surface-container));--sf-on-surface-variant: var(--sf-on-surface-container--variant);--sf-input-field--border-color: var(--sf-input-border-color, var(--sf-transparent-for-focus))}.sf-input:not(.error).sf-input--filled[\:has$input\:enabled\:not\(\:disabled$\:not$.disabled$\:not$\:-moz-read-only$\:hover\)] .sf-input-field{--sf-input-field--background-color: var(--sf-surface-container-hover)}.sf-input:not(.error).sf-input--filled[\:has$input\:enabled\:not\(\:disabled$\:not$.disabled$\:not$\:read-only$\:hover\)] .sf-input-field{--sf-input-field--background-color: var(--sf-surface-container-hover)}.sf-input:not(.error).sf-input--filled:has(input:enabled:not(:disabled):not(.disabled):not(:-moz-read-only):hover) .sf-input-field{--sf-input-field--background-color: var(--sf-surface-container-hover)}.sf-input:not(.error).sf-input--filled:has(input:enabled:not(:disabled):not(.disabled):not(:read-only):hover) .sf-input-field{--sf-input-field--background-color: var(--sf-surface-container-hover)}.sf-input:not(.error).sf-input--filled[\:has$input\:enabled\:not\(\:disabled$\:not$.disabled$\:not$\:-moz-read-only$\:active\)] .sf-input-field{--sf-input-field--border-color: var(--sf-primary-active)}.sf-input:not(.error).sf-input--filled[\:has$input\:enabled\:not\(\:disabled$\:not$.disabled$\:not$\:read-only$\:active\)] .sf-input-field{--sf-input-field--border-color: var(--sf-primary-active)}.sf-input:not(.error).sf-input--filled:has(input:enabled:not(:disabled):not(.disabled):not(:-moz-read-only):active) .sf-input-field{--sf-input-field--border-color: var(--sf-primary-active)}.sf-input:not(.error).sf-input--filled:has(input:enabled:not(:disabled):not(.disabled):not(:read-only):active) .sf-input-field{--sf-input-field--border-color: var(--sf-primary-active)}.sf-input[\:has$input\:disabled$]>.sf-input-field>.sf-input-hint>.sf-icon,.sf-input[\:has$input\:disabled$]>.sf-input-field>.sf-input-left .sf-icon{--sf-icon--color: var(--sf-on-disable)}.sf-input:has(input:disabled)>.sf-input-field>.sf-input-hint>.sf-icon,.sf-input:has(input:disabled)>.sf-input-field>.sf-input-left .sf-icon{--sf-icon--color: var(--sf-on-disable)}.sf-input[\:has$input\:disabled$] .sf-input-field input::-webkit-input-placeholder{--sf-input-placeholder--color: var(--sf-on-disable)}.sf-input[\:has$input\:disabled$] .sf-input-field input::-moz-placeholder{--sf-input-placeholder--color: var(--sf-on-disable)}.sf-input[\:has$input\:disabled$] .sf-input-field input:-ms-input-placeholder{--sf-input-placeholder--color: var(--sf-on-disable)}.sf-input[\:has$input\:disabled$] .sf-input-field input::-ms-input-placeholder{--sf-input-placeholder--color: var(--sf-on-disable)}.sf-input[\:has$input\:disabled$] .sf-input-field input::placeholder{--sf-input-placeholder--color: var(--sf-on-disable)}.sf-input:has(input:disabled) .sf-input-field input::-webkit-input-placeholder{--sf-input-placeholder--color: var(--sf-on-disable)}.sf-input:has(input:disabled) .sf-input-field input::-moz-placeholder{--sf-input-placeholder--color: var(--sf-on-disable)}.sf-input:has(input:disabled) .sf-input-field input:-ms-input-placeholder{--sf-input-placeholder--color: var(--sf-on-disable)}.sf-input:has(input:disabled) .sf-input-field input::-ms-input-placeholder{--sf-input-placeholder--color: var(--sf-on-disable)}.sf-input:has(input:disabled) .sf-input-field input::placeholder{--sf-input-placeholder--color: var(--sf-on-disable)}.sf-input[\:has$input\:disabled$] .sf-input-text{--sf-input-text--color: var(--sf-on-disable)}.sf-input:has(input:disabled) .sf-input-text{--sf-input-text--color: var(--sf-on-disable)}.sf-input:not(.error)[\:has$input\:enabled\:not\(\:disabled$\:not$.disabled$\:not$\:-moz-read-only$\:hover\)] .sf-input-field{--sf-input-field--border-color: var(--sf-primary-hover)}.sf-input:not(.error)[\:has$input\:enabled\:not\(\:disabled$\:not$.disabled$\:not$\:read-only$\:hover\)] .sf-input-field{--sf-input-field--border-color: var(--sf-primary-hover)}.sf-input:not(.error):has(input:enabled:not(:disabled):not(.disabled):not(:-moz-read-only):hover) .sf-input-field{--sf-input-field--border-color: var(--sf-primary-hover)}.sf-input:not(.error):has(input:enabled:not(:disabled):not(.disabled):not(:read-only):hover) .sf-input-field{--sf-input-field--border-color: var(--sf-primary-hover)}.sf-input:not(.error)[\:has$input\:enabled\:not\(\:disabled$\:not$.disabled$\:not$\:-moz-read-only$\:active\)] .sf-input-field{--sf-input-field--background-color: var(--sf-surface-0)}.sf-input:not(.error)[\:has$input\:enabled\:not\(\:disabled$\:not$.disabled$\:not$\:read-only$\:active\)] .sf-input-field{--sf-input-field--background-color: var(--sf-surface-0)}.sf-input:not(.error):has(input:enabled:not(:disabled):not(.disabled):not(:-moz-read-only):active) .sf-input-field{--sf-input-field--background-color: var(--sf-surface-0)}.sf-input:not(.error):has(input:enabled:not(:disabled):not(.disabled):not(:read-only):active) .sf-input-field{--sf-input-field--background-color: var(--sf-surface-0)}.sf-input:not(.sf-input--pointer-focus)[\:has$input\:enabled\:not\(\:disabled$\:not$.disabled$.focus-visible\)] .sf-input-field{outline:var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color);outline-offset:var(--sf-focus--offset)}.sf-input:not(.sf-input--pointer-focus):has(input:enabled:not(:disabled):not(.disabled).focus-visible) .sf-input-field{outline:var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color);outline-offset:var(--sf-focus--offset)}.sf-input:not(.sf-input--pointer-focus)[\:has$input\:enabled\:not\(\:disabled$\:not$.disabled$\:focus-visible\)] .sf-input-field{outline:var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color);outline-offset:var(--sf-focus--offset)}.sf-input:not(.sf-input--pointer-focus):has(input:enabled:not(:disabled):not(.disabled):focus-visible) .sf-input-field{outline:var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color);outline-offset:var(--sf-focus--offset)}.sf-input input.focus-visible{outline:none}.sf-input input:focus-visible{outline:none}.sf-input:not(.error).sf-input--bordered[\:has$input\:-moz-read-only\:not\(\:disabled$\)] .sf-input-field{--sf-input-field--background-color: var(--sf-surface-container);--sf-on-surface-variant: var(--sf-on-surface-container--variant)}.sf-input:not(.error).sf-input--bordered[\:has$input\:read-only\:not\(\:disabled$\)] .sf-input-field{--sf-input-field--background-color: var(--sf-surface-container);--sf-on-surface-variant: var(--sf-on-surface-container--variant)}.sf-input:not(.error).sf-input--bordered:has(input:-moz-read-only:not(:disabled)) .sf-input-field{--sf-input-field--background-color: var(--sf-surface-container);--sf-on-surface-variant: var(--sf-on-surface-container--variant)}.sf-input:not(.error).sf-input--bordered:has(input:read-only:not(:disabled)) .sf-input-field{--sf-input-field--background-color: var(--sf-surface-container);--sf-on-surface-variant: var(--sf-on-surface-container--variant)}}@layer sf.states{@media(prefers-reduced-motion: reduce){.sf-input .sf-input-field{transition-duration:0s}}}@layer sf.states{@media(forced-colors: active){.sf-input:not(.sf-input--pointer-focus)[\:has$input\:not\(\:disabled$\:not$.disabled$.focus-visible\)] .sf-input-field{outline:var(--sf-focus-outline-width) solid currentColor;outline-offset:var(--sf-focus-outline-width);--sf-input-field--box-shadow: none}.sf-input:not(.sf-input--pointer-focus):has(input:not(:disabled):not(.disabled).focus-visible) .sf-input-field{outline:var(--sf-focus-outline-width) solid currentColor;outline-offset:var(--sf-focus-outline-width);--sf-input-field--box-shadow: none}.sf-input:not(.sf-input--pointer-focus)[\:has$input\:not\(\:disabled$\:not$.disabled$\:focus-visible\)] .sf-input-field{outline:var(--sf-focus-outline-width) solid currentColor;outline-offset:var(--sf-focus-outline-width);--sf-input-field--box-shadow: none}.sf-input:not(.sf-input--pointer-focus):has(input:not(:disabled):not(.disabled):focus-visible) .sf-input-field{outline:var(--sf-focus-outline-width) solid currentColor;outline-offset:var(--sf-focus-outline-width);--sf-input-field--box-shadow: none}}}@layer sf.states{.sf-input:not(.error).sf-input--filled[\:has$input\:enabled\:not\(\:disabled$\:not$.disabled$\:not$\:-moz-read-only$\[focus-within\]\)] .sf-input-field{--sf-input-field--background-color: var(--sf-surface-0)}.sf-input:not(.error).sf-input--filled[\:has$input\:enabled\:not\(\:disabled$\:not$.disabled$\:not$\:read-only$\[focus-within\]\)] .sf-input-field{--sf-input-field--background-color: var(--sf-surface-0)}.sf-input:not(.error).sf-input--filled:has(input:enabled:not(:disabled):not(.disabled):not(:-moz-read-only)[focus-within]) .sf-input-field{--sf-input-field--background-color: var(--sf-surface-0)}.sf-input:not(.error).sf-input--filled:has(input:enabled:not(:disabled):not(.disabled):not(:read-only)[focus-within]) .sf-input-field{--sf-input-field--background-color: var(--sf-surface-0)}.sf-input:not(.error).sf-input--filled[\:has$input\:enabled\:not\(\:disabled$\:not$.disabled$\:not$\:-moz-read-only$\:focus-within\)] .sf-input-field{--sf-input-field--background-color: var(--sf-surface-0)}.sf-input:not(.error).sf-input--filled[\:has$input\:enabled\:not\(\:disabled$\:not$.disabled$\:not$\:read-only$\:focus-within\)] .sf-input-field{--sf-input-field--background-color: var(--sf-surface-0)}.sf-input:not(.error).sf-input--filled:has(input:enabled:not(:disabled):not(.disabled):not(:-moz-read-only):focus-within) .sf-input-field{--sf-input-field--background-color: var(--sf-surface-0)}.sf-input:not(.error).sf-input--filled:has(input:enabled:not(:disabled):not(.disabled):not(:read-only):focus-within) .sf-input-field{--sf-input-field--background-color: var(--sf-surface-0)}.sf-input:not(.error).sf-input--filled[\:has$input\[focus-within\]$] .sf-input-field{--sf-input-field--border-color: var(--sf-outline)}.sf-input:not(.error).sf-input--filled:has(input[focus-within]) .sf-input-field{--sf-input-field--border-color: var(--sf-outline)}.sf-input:not(.error).sf-input--filled[\:has$input\:focus-within$] .sf-input-field{--sf-input-field--border-color: var(--sf-outline)}.sf-input:not(.error).sf-input--filled:has(input:focus-within) .sf-input-field{--sf-input-field--border-color: var(--sf-outline)}}

package/distr/component/inputs/js/inputs.min.js ADDED Viewed

@@ -0,0 +1 @@

+ (()=>{"use strict";class t{lifecycleName(){return this.componentName??this.constructor.componentName}constructor(t){this.props=t,this.id=t?.id,this.params=t?.param,this.attrs=t?.attrs||{},this.template=null,window.dispatchEvent(new CustomEvent(`${this.lifecycleName()}:beforeRender`,{detail:this}))}getUtilityMap(){return this.constructor.utilityMap||null}extractUtilityClasses(t){if(!Array.isArray(t))return[];const e=new Set;return t.forEach(t=>{if("string"!=typeof t)return;const n=t.match(/$([^)]+)$/g);n&&n.forEach(t=>{t.slice(1,-1).split(/\s+/).filter(Boolean).forEach(t=>{t.startsWith(".")&&t.length>1&&e.add(t.slice(1))})})}),Array.from(e)}applyLayoutUtilities(t,e){if(!t||!e)return;const n=this.getUtilityMap();if(!n||!n[e])return;this.extractUtilityClasses(n[e]).forEach(e=>t.classList.add(e))}render(){return this.html=this.template,"function"==typeof this.init&&this.init(),this.html&&window.dispatchEvent(new CustomEvent(`${this.lifecycleName()}:render`,{detail:this})),this.html}destroy(){this.destroyInternal?.(),this.props=null,this.id=null,this.params=null,this.template=null,this.html&&(this.html.remove(),this.html=null),window.dispatchEvent(new CustomEvent(`${this.lifecycleName()}:destroy`,{detail:this}))}destroyInternal(){}}const e=function(t,e){if(t&&e)if("undefined"==typeof window||"function"!=typeof window.registerSfComponent){if("undefined"!=typeof window&&window.SF?.Loader?.registerComponent)window.SF.Loader.registerComponent(t,e);else if("undefined"!=typeof window){(window.SF_PENDING_COMPONENTS=window.SF_PENDING_COMPONENTS||[]).push([t,e])}}else window.registerSfComponent(t,e)},n=JSON.parse('{".sf-input":["display/flex (.flex)","flex-direction/column (.flex-col)","flex-wrap/nowrap (.flex-nowrap)","gap/var(--sf-space-1\\\\/4)","justify-content/flex-start (.justify-start)"],".sf-input .sf-input-field":["display/flex (.flex)","flex-direction/row (.flex-row)","flex-wrap/nowrap (.flex-nowrap)","justify-content/flex-start (.justify-start)","align-items/center (.items-center)"],".sf-input .sf-input-label":["display/flex (.flex)","flex-direction/row (.flex-row)","align-items/flex-start (.items-start)"],".sf-input .sf-input-field input":["flex/1 (.flex-1)"],".sf-input .sf-input-field .sf-icon":["display/flex (.flex)","justify-content/flex-start (.justify-start)","align-items/center (.items-center)"],".sf-input .sf-input-text-container":["flex/1 (.flex-1)","display/flex (.flex)","flex-direction/row (.flex-row)","flex-wrap/nowrap (.flex-nowrap)","justify-content/flex-start (.justify-start)","align-items/center (.items-center)"],".sf-input .sf-input-group":["display/flex (.flex)","flex-direction/column (.flex-col)","flex-wrap/nowrap (.flex-nowrap)","justify-content/center (.justify-center)","align-items/flex-start (.items-start)"],".sf-input .sf-input-text-container-alt":["display/flex (.flex)","flex-direction/row (.flex-row)","flex-wrap/nowrap (.flex-nowrap)","justify-content/center (.justify-center)","align-items/center (.items-center)"],".sf-input .sf-icon-alt":["display/flex (.flex)","justify-content/flex-start (.justify-start)","align-items/center (.items-center)"],".sf-input .sf-input-hint-text-wrap":["flex/1 (.flex-1)","display/flex (.flex)","flex-direction/row (.flex-row)","flex-wrap/nowrap (.flex-nowrap)","gap/var(--sf-b0)","justify-content/flex-start (.justify-start)","align-items/center (.items-center)"]}');let s=0;const i=new WeakMap;function r(t,{prefix:e="sf-field",required:n=!1,invalid:r=!1,hint:a="",errorMessage:o=""}={}){const l=function(t,e){if(t&&i.has(t))return i.get(t);const n=(t?.id?String(t.id).trim():"")||`${e}-${++s}`,r={controlId:`${n}-control`,messageId:`${n}-message`};return!t||"object"!=typeof t&&"function"!=typeof t||i.set(t,r),r}(t,e),u=Boolean(r),d=u&&o?o:a;return{...l,required:Boolean(n),invalid:u,message:d,describedBy:d?l.messageId:"",errorMessageId:u&&o?l.messageId:""}}function a(t,e,{prefix:n="sf-field",required:s=!1,invalid:i=!1,messageNode:a=null,labelNode:o=null,errorMessage:l=""}={}){if(!t||!e)return null;const u=r(t,{prefix:n,required:s,invalid:i,hint:a?.textContent?.trim()||"",errorMessage:l});var d,c;return e.id||(e.id=u.controlId),"LABEL"!==t.tagName||t.hasAttribute("for")||t.setAttribute("for",e.id),!o?.textContent?.trim()||e.hasAttribute("aria-label")||e.hasAttribute("aria-labelledby")||(o.id||(o.id=`${e.id}-label`),e.setAttribute("aria-labelledby",o.id)),e.required=u.required,t.classList.toggle("error",u.invalid),e.classList.toggle("error",u.invalid),u.invalid?e.setAttribute("aria-invalid","true"):e.removeAttribute("aria-invalid"),a&&(a.id||(a.id=u.messageId),e.setAttribute("aria-describedby",(d=e.getAttribute("aria-describedby"),c=[a.id],[...new Set([...String(d||"").split(/\s+/).filter(Boolean),...c.filter(Boolean)])].join(" ")))),u.errorMessageId&&a?e.setAttribute("aria-errormessage",a.id):e.removeAttribute("aria-errormessage"),u}function o(){const t=globalThis.SF=globalThis.SF||{};return t.__deprecationNotes instanceof Map||Object.defineProperty(t,"__deprecationNotes",{value:new Map,configurable:!0}),t.__deprecationNotes}function l({component:t="",kind:e="attribute",attribute:n="",from:s,to:i=null}={}){if(!s)return;const r=[t,e,n,s].join("|"),a=o(),l=a.get(r);if(l)l.count+=1;else if(a.set(r,{component:t,kind:e,attribute:n,from:s,to:i,count:1}),function(){const t=globalThis.document?.documentElement;return"warn"===t?.dataset?.sfDeprecations||!0===globalThis.SF?.deprecations?.warn}()){const r=t?`${t}: `:"",a="value"===e?`${n}="${s}"`:`${e} ${s}`;globalThis.console?.warn?.(`[Simai Framework] ${r}${a} is a legacy name${i?`; write ${i}`:""}. See contracts/changes/journal.json.`)}}if("undefined"!=typeof globalThis){globalThis.SF=globalThis.SF||{};const t=globalThis.SF.deprecations||{};t.list=function(){return[...o().values()].map(t=>({...t}))},t.clear=function(){o().clear()},t.note=l,globalThis.SF.deprecations=t}const u=Object.freeze(["1/2","1","2"]),d=Object.freeze({"1/3":"1/2",3:"2"}),c=new Set;function f(t,e="field",n="1"){const s=String(t??"").trim().toLowerCase();if(u.includes(s))return s;if(Object.hasOwn(d,s)){const t=d[s];l({component:e,kind:"value",attribute:"size",from:s,to:t});const n=`${e}:${s}`;return c.has(n)||"undefined"==typeof console||(c.add(n),console.warn(`[Simai Framework] ${e}: size ${s} is retired for form fields; rendering size ${t}.`)),t}return n}const p=new WeakMap,m=new WeakSet;let h=null;const w="label.sf-input",g="sfInputBound",y=new Set(["text","email","password","search","tel","url"]),x=new Set(["","none","text","tel","url","email","numeric","decimal","search"]),b=new Set(["bordered","filled","hidden"]);function S(t){if(""===t||null==t)return null;const e=Number(t);return Number.isInteger(e)&&e>=0?e:null}function L(t,e=!1){return null==t||""===t?e:"boolean"==typeof t?t:["1","true","yes","on"].includes(String(t).toLowerCase())}function v(t){return t?.querySelector?.(".sf-input-field input, input")||null}function _(t){return t?.querySelector?.(".sf-input-hint-text-wrap")||null}function k(t){const e=_(t);return{messageNode:e,errorMessage:"error"===e?.dataset.fieldMessage&&e.textContent?.trim()||""}}function I(t){if(!t||"string"!=typeof t)return null;const e=t.trim();if(!e)return null;try{const t=JSON.parse(e);return t&&"object"==typeof t?t:null}catch{return null}}function E(t,e,n){const s={...t},i=n.dataset.maskLazy??e.dataset.maskLazy,r=n.dataset.maskPlaceholderChar??e.dataset.maskPlaceholderChar;return void 0!==i&&""!==i&&(s.lazy=L(i,!0)),void 0!==r&&""!==r&&(s.placeholderChar=String(r)),s}async function M(t,e){const n=function(t,e){if(!L(e.dataset.mask??t.dataset.mask,!1))return null;const n=I(e.dataset.maskOptions),s=I(t.dataset.maskOptions);if(n)return E(n,t,e);if(s)return E(s,t,e);const i=e.dataset.maskPattern??t.dataset.maskPattern;return i?E({mask:String(i)},t,e):null}(t,e);if(!n)return;const s={};t.__sfInputMaskRequest=s;try{const i=await function(){const t=()=>window.SF?.Mask?.create?window.SF.Mask:null,e=t();return e?Promise.resolve(e):h||(h=new Promise(e=>{const n=[[window,"sf-mask-ready"],[window,"sf-loader-ready"],[window,"load"],[document,"DOMContentLoaded"]],s=()=>{const i=t();i&&(n.forEach(([t,e])=>t.removeEventListener(e,s)),h=null,e(i))};n.forEach(([t,e])=>t.addEventListener(e,s))}),h)}();if(t.__sfInputMaskRequest!==s)return;const r=await i.create(e,n);if(!r)return;if("1"!==t.dataset[g]||t.__sfInputMaskRequest!==s||v(t)!==e)return void i.destroy(r);t.__sfInputMask=r}catch(t){console.warn("SF.Input mask init failed",t)}}function N(t){if(function(t,e){if(t?.classList)for(const[n,s]of Object.entries(d)){const s=`${e}--size-${n}`;t.classList.contains(s)&&t.classList.replace(s,`${e}--size-${f(n,e)}`)}}(t,"sf-input"),!t||"1"===t.dataset[g])return;const e=v(t);if(!e)return;const n=()=>{},s=()=>t.classList.add("sf-input--pointer-focus"),i=()=>t.classList.remove("sf-input--pointer-focus");e.addEventListener("input",n),e.addEventListener("pointerdown",s),e.addEventListener("blur",i),t.__sfInputNoopHandler=n,t.__sfInputPointerFocusHandler=s,t.__sfInputBlurHandler=i,t.dataset[g]="1";const r=k(t);a(t,e,{prefix:"sf-input",labelNode:t.querySelector(".sf-input-text"),required:e.required||Boolean(t.querySelector(".sf-input-required")),invalid:t.classList.contains("error")||e.classList.contains("error"),...r}),t.__sfInputReleaseReset=function(t,e){const n=t.ownerDocument;m.has(n)||(n.addEventListener("reset",t=>{const e=t.target;if("FORM"!==e?.tagName)return;const n=Array.from(e.elements);setTimeout(()=>{if(!t.defaultPrevented)for(const t of n)if(t.isConnected&&t.form===e)for(const e of p.get(t)||[])e()},0)},!0),m.add(n));let s=p.get(t);return s||p.set(t,s=new Set),s.add(e),()=>s.delete(e)}(e,()=>{t.__sfInputMask&&(t.__sfInputMask.value=e.value)}),M(t,e)}function C(t=document){t.querySelectorAll(w).forEach(N)}class j extends t{static componentName="Inputs";html=null;constructor(t){super(t);const{size:e="1",type:n="bordered",label:s="",required:i=!1,placeholder:r="",inputType:a="text",autocomplete:o="",inputMode:l="",minLength:u="",maxLength:d="",pattern:c="",hint:p="",value:m="",name:h="",leftIcon:w="",rightText:g="",hintIcon:v="",disabled:_=!1,readonly:k=!1,error:I=!1,invalid:E=!1,errorMessage:M="",mask:N=!1,maskPattern:C="",maskLazy:j="",maskPlaceholderChar:O="",maskOptions:$=""}=this.params||{},F=this.attrs.class||this.attrs.className,P=f(e,"sf-input"),q=function(t,e,n){const s=String(t||n);return e.has(s)?s:n}(n,b,"bordered");this.template=document.createElement("label"),this.id&&(this.template.id=this.id),this.template.classList.add("sf-input",`sf-input--size-${P}`,`sf-input--${q}`),this.template.classList.toggle("error",L(E||I,!1)),this.template.dataset.mask=String(L(N,!1)),this.template.dataset.maskPattern=String(C||""),this.template.dataset.maskLazy=String(j??""),this.template.dataset.maskPlaceholderChar=String(O||""),this.template.dataset.maskOptions=String($||""),F&&this.template.classList.add(...`${F}`.split(" ").filter(Boolean));const A=document.createElement("span");A.classList.add("sf-input-label");const T=document.createElement("span");if(T.classList.add("sf-input-text"),T.textContent=s,A.append(T),L(i,!0)){const t=document.createElement("span");t.classList.add("sf-input-required"),t.textContent="*",A.append(t)}const z=document.createElement("span");if(z.classList.add("sf-input-field"),w){const t=document.createElement("i");t.classList.add("sf-icon"),t.textContent=String(w),z.append(t)}const B=document.createElement("input");B.type=function(t){const e=String(t||"text").toLowerCase();return y.has(e)?e:"text"}(a),B.placeholder=String(r??""),o&&(B.autocomplete=String(o)),B.inputMode=function(t){const e=String(t||"").toLowerCase();return x.has(e)?e:""}(l);const H=S(u),R=S(d);if(null!==H&&(B.minLength=H),null!==R&&(B.maxLength=R),c&&(B.pattern=String(c)),B.value=String(m??""),B.defaultValue=String(m??""),h&&(B.name=String(h)),B.disabled=L(_,!1),B.readOnly=L(k,!1),B.required=L(i,!0),B.dataset.mask=String(L(N,!1)),B.dataset.maskPattern=String(C||""),B.dataset.maskLazy=String(j??""),B.dataset.maskPlaceholderChar=String(O||""),B.dataset.maskOptions=String($||""),B.classList.toggle("error",L(E||I,!1)),z.append(B),g){const t=document.createElement("span");t.classList.add("sf-input-right"),t.textContent=String(g),z.append(t)}if(v){const t=document.createElement("i");t.classList.add("sf-icon","sf-icon-hint"),t.textContent=String(v),z.append(t)}this.template.append(A,z);const U=L(E||I,!1)&&M?M:p;if(U){const t=document.createElement("span");t.classList.add("sf-input-hint-text-wrap"),t.textContent=String(U),t.dataset.fieldMessage=L(E||I,!1)&&M?"error":"hint",this.template.append(t)}this.applyLayoutUtilities(this.template,".sf-input"),this.applyLayoutUtilities(A,".sf-input .sf-input-label"),this.applyLayoutUtilities(z,".sf-input .sf-input-field"),this.applyLayoutUtilities(B,".sf-input .sf-input-field input")}init(){N(this.template)}destroyInternal(){!function(t){if(!t||"1"!==t.dataset[g])return;delete t.__sfInputMaskRequest;const e=v(t);e&&t.__sfInputNoopHandler&&e.removeEventListener("input",t.__sfInputNoopHandler),e&&t.__sfInputPointerFocusHandler&&e.removeEventListener("pointerdown",t.__sfInputPointerFocusHandler),e&&t.__sfInputBlurHandler&&e.removeEventListener("blur",t.__sfInputBlurHandler),t.__sfInputMask&&window.SF?.Mask?.destroy?.(t.__sfInputMask),t.__sfInputReleaseReset?.(),delete t.__sfInputReleaseReset,delete t.__sfInputMask,delete t.__sfInputNoopHandler,delete t.__sfInputPointerFocusHandler,delete t.__sfInputBlurHandler,t.classList.remove("sf-input--pointer-focus"),delete t.dataset[g]}(this.template)}}j.utilityMap=n,e("Inputs",j),"undefined"!=typeof window&&(window.SF=window.SF||{},window.SF.Input=window.SF.Input||{},window.SF.Input.setState=function(t,e={}){const n=t instanceof HTMLElement?t.closest(w)||t:null;if(!n)return!1;const s=v(n);if(!s)return!1;if(Object.prototype.hasOwnProperty.call(e,"disabled")&&(s.disabled=L(e.disabled)),Object.prototype.hasOwnProperty.call(e,"error")){const t=L(e.error);n.classList.toggle("error",t),s.classList.toggle("error",t)}if(Object.prototype.hasOwnProperty.call(e,"invalid")){const t=L(e.invalid);n.classList.toggle("error",t),s.classList.toggle("error",t)}if(Object.prototype.hasOwnProperty.call(e,"errorMessage")){const t=String(e.errorMessage??""),i=t?function(t){const e=_(t);if(e)return e;const n=document.createElement("span");return n.classList.add("sf-input-hint-text-wrap"),t.append(n),n}(n):_(n);if(i){i.textContent=t;const e=n.classList.contains("error")||s.classList.contains("error");i.dataset.fieldMessage=t&&e?"error":"hint"}}return Object.prototype.hasOwnProperty.call(e,"value")&&(s.value=String(e.value??""),s.dispatchEvent(new Event("input",{bubbles:!0}))),a(n,s,{prefix:"sf-input",labelNode:n.querySelector(".sf-input-text"),required:s.required||Boolean(n.querySelector(".sf-input-required")),invalid:n.classList.contains("error")||s.classList.contains("error"),...k(n)}),!0}),"loading"===document.readyState?document.addEventListener("DOMContentLoaded",()=>C()):C();new MutationObserver(t=>{t.forEach(t=>{t.addedNodes.forEach(t=>{t instanceof Element&&(t.matches?.(w)&&N(t),C(t))})})}).observe(document.documentElement,{childList:!0,subtree:!0})})();

package/distr/component/inputs/json/input.utility.json ADDED Viewed

@@ -0,0 +1,65 @@
+{
+  ".sf-input": [
+    "display/flex (.flex)",
+    "flex-direction/column (.flex-col)",
+    "flex-wrap/nowrap (.flex-nowrap)",
+    "gap/var(--sf-space-1\\/4)",
+    "justify-content/flex-start (.justify-start)"
+  ],
+  ".sf-input .sf-input-field": [
+    "display/flex (.flex)",
+    "flex-direction/row (.flex-row)",
+    "flex-wrap/nowrap (.flex-nowrap)",
+    "justify-content/flex-start (.justify-start)",
+    "align-items/center (.items-center)"
+  ],
+  ".sf-input .sf-input-label": [
+    "display/flex (.flex)",
+    "flex-direction/row (.flex-row)",
+    "align-items/flex-start (.items-start)"
+  ],
+  ".sf-input .sf-input-field input": [
+    "flex/1 (.flex-1)"
+  ],
+  ".sf-input .sf-input-field .sf-icon": [
+    "display/flex (.flex)",
+    "justify-content/flex-start (.justify-start)",
+    "align-items/center (.items-center)"
+  ],
+  ".sf-input .sf-input-text-container": [
+    "flex/1 (.flex-1)",
+    "display/flex (.flex)",
+    "flex-direction/row (.flex-row)",
+    "flex-wrap/nowrap (.flex-nowrap)",
+    "justify-content/flex-start (.justify-start)",
+    "align-items/center (.items-center)"
+  ],
+  ".sf-input .sf-input-group": [
+    "display/flex (.flex)",
+    "flex-direction/column (.flex-col)",
+    "flex-wrap/nowrap (.flex-nowrap)",
+    "justify-content/center (.justify-center)",
+    "align-items/flex-start (.items-start)"
+  ],
+  ".sf-input .sf-input-text-container-alt": [
+    "display/flex (.flex)",
+    "flex-direction/row (.flex-row)",
+    "flex-wrap/nowrap (.flex-nowrap)",
+    "justify-content/center (.justify-center)",
+    "align-items/center (.items-center)"
+  ],
+  ".sf-input .sf-icon-alt": [
+    "display/flex (.flex)",
+    "justify-content/flex-start (.justify-start)",
+    "align-items/center (.items-center)"
+  ],
+  ".sf-input .sf-input-hint-text-wrap": [
+    "flex/1 (.flex-1)",
+    "display/flex (.flex)",
+    "flex-direction/row (.flex-row)",
+    "flex-wrap/nowrap (.flex-nowrap)",
+    "gap/var(--sf-b0)",
+    "justify-content/flex-start (.justify-start)",
+    "align-items/center (.items-center)"
+  ]
+}

package/distr/component/kbd/css/kbd.min.css ADDED Viewed

@@ -0,0 +1 @@

+ @layer sf.components{:where(kbd:not(.sf-kbd--group),.sf-kbd:not(.sf-kbd--group)){--sf-kbd--min-block-size: var(--sf-text-height-1\/3);--sf-kbd--min-inline-size: var(--sf-text-height-1\/3);--sf-kbd--padding-block: var(--sf-space-1\/4);--sf-kbd--padding-inline: var(--sf-space-1\/2);--sf-kbd--color: var(--sf-on-surface);--sf-kbd--background: var(--sf-surface-container);--sf-on-surface-variant: var(--sf-on-surface-container--variant);--sf-kbd--border-color: var(--sf-outline-variant);--sf-kbd--border-width: var(--sf-px);--sf-kbd--radius: var(--sf-radius--ui);--sf-kbd--font-family: var(--sf-mono);--sf-kbd--font-size: var(--sf-text-size-1\/3);--sf-kbd--font-weight: var(--sf-font-weight-medium);--sf-kbd--line-height: var(--sf-text-height-1\/3);display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;min-height:var(--sf-kbd--min-block-size);min-block-size:var(--sf-kbd--min-block-size);min-width:var(--sf-kbd--min-inline-size);min-inline-size:var(--sf-kbd--min-inline-size);padding-top:var(--sf-kbd--padding-block);padding-bottom:var(--sf-kbd--padding-block);padding-block:var(--sf-kbd--padding-block);padding-left:var(--sf-kbd--padding-inline);padding-right:var(--sf-kbd--padding-inline);padding-inline:var(--sf-kbd--padding-inline);color:var(--sf-kbd--color);background:var(--sf-kbd--background);border:var(--sf-kbd--border-width) solid var(--sf-kbd--border-color);border-radius:var(--sf-kbd--radius);font-family:var(--sf-kbd--font-family);font-size:var(--sf-kbd--font-size);font-weight:var(--sf-kbd--font-weight);line-height:var(--sf-kbd--line-height);unicode-bidi:-webkit-isolate;unicode-bidi:-moz-isolate;unicode-bidi:isolate;vertical-align:baseline;white-space:nowrap}kbd[\:has$\%3Ekbd$],.sf-kbd--group{display:inline-flex;box-sizing:border-box;align-items:center;gap:var(--sf-space-1\/4);min-height:var(--sf-0);min-block-size:var(--sf-0);min-width:var(--sf-0);min-inline-size:var(--sf-0);margin:var(--sf-0);padding:var(--sf-0);color:inherit;background:var(--sf-transparent);border:none;border-radius:var(--sf-0);font:inherit;line-height:inherit;unicode-bidi:-webkit-isolate;unicode-bidi:-moz-isolate;unicode-bidi:isolate;vertical-align:baseline;white-space:nowrap}kbd[\:has$\%3Ekbd$],.sf-kbd--group{display:inline-flex;box-sizing:border-box;align-items:center;gap:var(--sf-space-1\/4);min-height:var(--sf-0);min-height:var(--sf-0);min-block-size:var(--sf-0);min-width:var(--sf-0);min-width:var(--sf-0);min-inline-size:var(--sf-0);margin:var(--sf-0);padding:var(--sf-0);color:inherit;background:var(--sf-transparent);border:none;border-radius:var(--sf-0);font:inherit;line-height:inherit;unicode-bidi:-webkit-isolate;unicode-bidi:-moz-isolate;unicode-bidi:isolate;vertical-align:baseline;white-space:nowrap}kbd:has(>kbd),.sf-kbd--group{display:inline-flex;box-sizing:border-box;align-items:center;gap:var(--sf-space-1\/4);min-height:var(--sf-0);min-block-size:var(--sf-0);min-width:var(--sf-0);min-inline-size:var(--sf-0);margin:var(--sf-0);padding:var(--sf-0);color:inherit;background:var(--sf-transparent);border:none;border-radius:var(--sf-0);font:inherit;line-height:inherit;unicode-bidi:-webkit-isolate;unicode-bidi:-moz-isolate;unicode-bidi:isolate;vertical-align:baseline;white-space:nowrap}@media(forced-colors: active){:where(kbd:not(.sf-kbd--group),.sf-kbd:not(.sf-kbd--group)){border-color:CanvasText}}}

package/distr/component/kbd/js/kbd.min.js ADDED Viewed

File without changes

package/distr/component/lazy-load/js/lazy-load.min.js ADDED Viewed

	@@ -0,0 +1 @@
1	+ (()=>{var e={e28285ba28da(){var e=e\|\|{};e.LazyLoad=function(){},document.addEventListener("lazybeforeunveil",e.LazyLoad)}};const t={};function o(n){const r=t[n];if(void 0!==r)return r.exports;const a=t[n]={exports:{}};return e[n](a,a.exports,o),a.exports}(()=>{"use strict";o("e28285ba28da")})()})();

package/distr/component/link/css/link.min.css ADDED Viewed

@@ -0,0 +1 @@

+ @layer sf.components{.sf-link{--sf-link--color: var(--sf-link);--sf-link--background-color: var(--sf-transparent);--sf-link--gap: var(--sf-space-1\/3);--sf-link--font-family: var(--sf-text--family);--sf-link--font-size: var(--sf-text-size-1);--sf-link--font-weight: var(--sf-font-weight-regular);--sf-link--line-height: var(--sf-text-height-1);--sf-link--text-decoration: underline;display:inline-flex;box-sizing:border-box;align-items:center;gap:var(--sf-link--gap);min-width:var(--sf-0);min-inline-size:var(--sf-0);max-width:100%;max-inline-size:100%;color:var(--sf-link--color);background-color:var(--sf-link--background-color);font-family:var(--sf-link--font-family);font-size:var(--sf-link--font-size);font-weight:var(--sf-link--font-weight);line-height:var(--sf-link--line-height);-webkit-text-decoration-line:var(--sf-link--text-decoration);text-decoration-line:var(--sf-link--text-decoration);-webkit-text-decoration-color:currentColor;text-decoration-color:currentColor;text-underline-offset:var(--sf-a3)}.sf-link :where(.sf-link__content,.sf-link-content){min-width:var(--sf-0);min-inline-size:var(--sf-0);color:inherit;font:inherit;word-wrap:anywhere;text-decoration:inherit}.sf-link :where(.sf-link__icon,.sf-link-icon){--sf-link-icon--size: var(--sf-text-height-1);flex:none;height:var(--sf-link-icon--size);block-size:var(--sf-link-icon--size);width:var(--sf-link-icon--size);inline-size:var(--sf-link-icon--size);color:currentColor}}@layer sf.states{.sf-link:visited:not(.disabled):not([aria-disabled=true]){--sf-link--color: var(--sf-link-visited)}.sf-link:hover:not(.disabled):not([aria-disabled=true]){--sf-link--color: var(--sf-link-hover);--sf-link--text-decoration: none}.sf-link:active:not(.disabled):not([aria-disabled=true]){--sf-link--color: var(--sf-link-active);--sf-link--text-decoration: none}.sf-link:focus{outline:none}.sf-link.focus-visible{border-radius:var(--sf-radius--ui);outline-color:var(--sf-focus);outline-offset:var(--sf-focus--offset);outline-style:var(--sf-focus--style);outline-width:var(--sf-focus--width)}.sf-link:focus-visible{border-radius:var(--sf-radius--ui);outline-color:var(--sf-focus);outline-offset:var(--sf-focus--offset);outline-style:var(--sf-focus--style);outline-width:var(--sf-focus--width)}.sf-link.disabled{--sf-link--color: var(--sf-on-disable);--sf-link--text-decoration: none;cursor:default}.sf-link[aria-disabled=true]{--sf-link--color: var(--sf-on-disable);--sf-link--text-decoration: none;cursor:default}@media(forced-colors: active){.sf-link.focus-visible{outline-color:Highlight}.sf-link:focus-visible{outline-color:Highlight}}}

package/distr/component/link/js/link.min.js ADDED Viewed

File without changes

package/distr/component/menu/css/menu.min.css ADDED Viewed

@@ -0,0 +1 @@

+ @layer sf.components{.sf-menu{list-style:none;margin:var(--sf-0);padding:var(--sf-0)}.sf-menu>.sf-menu-item{list-style:none;margin:var(--sf-0);padding:var(--sf-0)}.sf-menu>.sf-menu-item:not(.open)>.sf-menu{display:none}}@layer sf.components{_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-menu-element{padding-right:var(--sf-space-1);padding-right:var(--sf-menu-element--padding-right, var(--sf-menu-element--padding-inline-end, var(--sf-space-1)))}@supports not (padding-inline-end: initial){html:not([dir="rtl"]) .sf-menu-element{padding-right:var(--sf-space-1);padding-right:var(--sf-menu-element--padding-right, var(--sf-menu-element--padding-inline-end, var(--sf-space-1)))}}.sf-menu-element:where(:dir(ltr)){padding-right:var(--sf-space-1);padding-right:var(--sf-menu-element--padding-right, var(--sf-menu-element--padding-inline-end, var(--sf-space-1)))}_:-ms-input-placeholder, [dir="rtl"] .sf-menu-element{padding-left:var(--sf-space-1);padding-left:var(--sf-menu-element--padding-right, var(--sf-menu-element--padding-inline-end, var(--sf-space-1)))}@supports not (padding-inline-end: initial){[dir="rtl"] .sf-menu-element{padding-left:var(--sf-space-1);padding-left:var(--sf-menu-element--padding-right, var(--sf-menu-element--padding-inline-end, var(--sf-space-1)))}}.sf-menu-element:where(:dir(rtl)){padding-left:var(--sf-space-1);padding-left:var(--sf-menu-element--padding-right, var(--sf-menu-element--padding-inline-end, var(--sf-space-1)))}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-menu-element{padding-left:var(--sf-space-1);padding-left:var(--sf-menu-element--padding-inline-start, var(--sf-space-1))}@supports not (padding-inline-start: initial){html:not([dir="rtl"]) .sf-menu-element{padding-left:var(--sf-space-1);padding-left:var(--sf-menu-element--padding-inline-start, var(--sf-space-1))}}.sf-menu-element:where(:dir(ltr)){padding-left:var(--sf-space-1);padding-left:var(--sf-menu-element--padding-inline-start, var(--sf-space-1))}_:-ms-input-placeholder, [dir="rtl"] .sf-menu-element{padding-right:var(--sf-space-1);padding-right:var(--sf-menu-element--padding-inline-start, var(--sf-space-1))}@supports not (padding-inline-start: initial){[dir="rtl"] .sf-menu-element{padding-right:var(--sf-space-1);padding-right:var(--sf-menu-element--padding-inline-start, var(--sf-space-1))}}.sf-menu-element:where(:dir(rtl)){padding-right:var(--sf-space-1);padding-right:var(--sf-menu-element--padding-inline-start, var(--sf-space-1))}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-menu-element{border-left-width:var(--sf-menu-element--border-width);border-left-width:var(--sf-menu-element--border-left-width, var(--sf-menu-element--border-width))}@supports not (border-inline-start-width: initial){html:not([dir="rtl"]) .sf-menu-element{border-left-width:var(--sf-menu-element--border-width);border-left-width:var(--sf-menu-element--border-left-width, var(--sf-menu-element--border-width))}}.sf-menu-element:where(:dir(ltr)){border-left-width:var(--sf-menu-element--border-width);border-left-width:var(--sf-menu-element--border-left-width, var(--sf-menu-element--border-width))}_:-ms-input-placeholder, [dir="rtl"] .sf-menu-element{border-right-width:var(--sf-menu-element--border-width);border-right-width:var(--sf-menu-element--border-left-width, var(--sf-menu-element--border-width))}@supports not (border-inline-start-width: initial){[dir="rtl"] .sf-menu-element{border-right-width:var(--sf-menu-element--border-width);border-right-width:var(--sf-menu-element--border-left-width, var(--sf-menu-element--border-width))}}.sf-menu-element:where(:dir(rtl)){border-right-width:var(--sf-menu-element--border-width);border-right-width:var(--sf-menu-element--border-left-width, var(--sf-menu-element--border-width))}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-menu-element{border-right-width:var(--sf-menu-element--border-width);border-right-width:var(--sf-menu-element--border-right-width, var(--sf-menu-element--border-width))}@supports not (border-inline-end-width: initial){html:not([dir="rtl"]) .sf-menu-element{border-right-width:var(--sf-menu-element--border-width);border-right-width:var(--sf-menu-element--border-right-width, var(--sf-menu-element--border-width))}}.sf-menu-element:where(:dir(ltr)){border-right-width:var(--sf-menu-element--border-width);border-right-width:var(--sf-menu-element--border-right-width, var(--sf-menu-element--border-width))}_:-ms-input-placeholder, [dir="rtl"] .sf-menu-element{border-left-width:var(--sf-menu-element--border-width);border-left-width:var(--sf-menu-element--border-right-width, var(--sf-menu-element--border-width))}@supports not (border-inline-end-width: initial){[dir="rtl"] .sf-menu-element{border-left-width:var(--sf-menu-element--border-width);border-left-width:var(--sf-menu-element--border-right-width, var(--sf-menu-element--border-width))}}.sf-menu-element:where(:dir(rtl)){border-left-width:var(--sf-menu-element--border-width);border-left-width:var(--sf-menu-element--border-right-width, var(--sf-menu-element--border-width))}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-menu-element{border-top-left-radius:var(--sf-menu-element--radius);border-top-left-radius:var(--sf-menu-element--border-top-left-radius, var(--sf-menu-element--radius))}@supports not (border-start-start-radius: initial){html:not([dir="rtl"]) .sf-menu-element{border-top-left-radius:var(--sf-menu-element--radius);border-top-left-radius:var(--sf-menu-element--border-top-left-radius, var(--sf-menu-element--radius))}}.sf-menu-element:where(:dir(ltr)){border-top-left-radius:var(--sf-menu-element--radius);border-top-left-radius:var(--sf-menu-element--border-top-left-radius, var(--sf-menu-element--radius))}_:-ms-input-placeholder, [dir="rtl"] .sf-menu-element{border-top-right-radius:var(--sf-menu-element--radius);border-top-right-radius:var(--sf-menu-element--border-top-left-radius, var(--sf-menu-element--radius))}@supports not (border-start-start-radius: initial){[dir="rtl"] .sf-menu-element{border-top-right-radius:var(--sf-menu-element--radius);border-top-right-radius:var(--sf-menu-element--border-top-left-radius, var(--sf-menu-element--radius))}}.sf-menu-element:where(:dir(rtl)){border-top-right-radius:var(--sf-menu-element--radius);border-top-right-radius:var(--sf-menu-element--border-top-left-radius, var(--sf-menu-element--radius))}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-menu-element{border-top-right-radius:var(--sf-menu-element--radius);border-top-right-radius:var(--sf-menu-element--border-top-right-radius, var(--sf-menu-element--radius))}@supports not (border-start-end-radius: initial){html:not([dir="rtl"]) .sf-menu-element{border-top-right-radius:var(--sf-menu-element--radius);border-top-right-radius:var(--sf-menu-element--border-top-right-radius, var(--sf-menu-element--radius))}}.sf-menu-element:where(:dir(ltr)){border-top-right-radius:var(--sf-menu-element--radius);border-top-right-radius:var(--sf-menu-element--border-top-right-radius, var(--sf-menu-element--radius))}_:-ms-input-placeholder, [dir="rtl"] .sf-menu-element{border-top-left-radius:var(--sf-menu-element--radius);border-top-left-radius:var(--sf-menu-element--border-top-right-radius, var(--sf-menu-element--radius))}@supports not (border-start-end-radius: initial){[dir="rtl"] .sf-menu-element{border-top-left-radius:var(--sf-menu-element--radius);border-top-left-radius:var(--sf-menu-element--border-top-right-radius, var(--sf-menu-element--radius))}}.sf-menu-element:where(:dir(rtl)){border-top-left-radius:var(--sf-menu-element--radius);border-top-left-radius:var(--sf-menu-element--border-top-right-radius, var(--sf-menu-element--radius))}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-menu-element{border-bottom-left-radius:var(--sf-menu-element--radius);border-bottom-left-radius:var(--sf-menu-element--border-bottom-left-radius, var(--sf-menu-element--radius))}@supports not (border-end-start-radius: initial){html:not([dir="rtl"]) .sf-menu-element{border-bottom-left-radius:var(--sf-menu-element--radius);border-bottom-left-radius:var(--sf-menu-element--border-bottom-left-radius, var(--sf-menu-element--radius))}}.sf-menu-element:where(:dir(ltr)){border-bottom-left-radius:var(--sf-menu-element--radius);border-bottom-left-radius:var(--sf-menu-element--border-bottom-left-radius, var(--sf-menu-element--radius))}_:-ms-input-placeholder, [dir="rtl"] .sf-menu-element{border-bottom-right-radius:var(--sf-menu-element--radius);border-bottom-right-radius:var(--sf-menu-element--border-bottom-left-radius, var(--sf-menu-element--radius))}@supports not (border-end-start-radius: initial){[dir="rtl"] .sf-menu-element{border-bottom-right-radius:var(--sf-menu-element--radius);border-bottom-right-radius:var(--sf-menu-element--border-bottom-left-radius, var(--sf-menu-element--radius))}}.sf-menu-element:where(:dir(rtl)){border-bottom-right-radius:var(--sf-menu-element--radius);border-bottom-right-radius:var(--sf-menu-element--border-bottom-left-radius, var(--sf-menu-element--radius))}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-menu-element{border-bottom-right-radius:var(--sf-menu-element--radius);border-bottom-right-radius:var(--sf-menu-element--border-bottom-right-radius, var(--sf-menu-element--radius))}@supports not (border-end-end-radius: initial){html:not([dir="rtl"]) .sf-menu-element{border-bottom-right-radius:var(--sf-menu-element--radius);border-bottom-right-radius:var(--sf-menu-element--border-bottom-right-radius, var(--sf-menu-element--radius))}}.sf-menu-element:where(:dir(ltr)){border-bottom-right-radius:var(--sf-menu-element--radius);border-bottom-right-radius:var(--sf-menu-element--border-bottom-right-radius, var(--sf-menu-element--radius))}_:-ms-input-placeholder, [dir="rtl"] .sf-menu-element{border-bottom-left-radius:var(--sf-menu-element--radius);border-bottom-left-radius:var(--sf-menu-element--border-bottom-right-radius, var(--sf-menu-element--radius))}@supports not (border-end-end-radius: initial){[dir="rtl"] .sf-menu-element{border-bottom-left-radius:var(--sf-menu-element--radius);border-bottom-left-radius:var(--sf-menu-element--border-bottom-right-radius, var(--sf-menu-element--radius))}}.sf-menu-element:where(:dir(rtl)){border-bottom-left-radius:var(--sf-menu-element--radius);border-bottom-left-radius:var(--sf-menu-element--border-bottom-right-radius, var(--sf-menu-element--radius))}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-menu-element{text-align:left}@supports not (text-align: start){html:not([dir="rtl"]) .sf-menu-element{text-align:left}}.sf-menu-element:where(:dir(ltr)){text-align:left}_:-ms-input-placeholder, [dir="rtl"] .sf-menu-element{text-align:right}@supports not (text-align: start){[dir="rtl"] .sf-menu-element{text-align:right}}.sf-menu-element:where(:dir(rtl)){text-align:right}.sf-menu-element{--sf-menu-element--background-color: var(--sf-transparent);--sf-menu-element--border-color: var(--sf-surface-container);--sf-menu-element--border-width: var(--sf-px);--sf-menu-element--color: var(--sf-on-surface);--sf-menu-element--gap: var(--sf-space-1\/3);--sf-menu-element--radius: var(--sf-radius--ui);display:flex;box-sizing:border-box;align-items:center;gap:var(--sf-menu-element--gap);min-width:var(--sf-0);min-width:var(--sf-0);min-inline-size:var(--sf-0);width:100%;width:100%;inline-size:100%;max-width:100%;max-width:100%;max-inline-size:100%;margin:var(--sf-0);padding-top:calc((var(--sf-ui-1--control-height) - var(--sf-text-height-1)) / 2 - var(--sf-menu-element--border-width));-webkit-padding-before:calc((var(--sf-ui-1--control-height) - var(--sf-text-height-1)) / 2 - var(--sf-menu-element--border-width));padding-block-start:calc((var(--sf-ui-1--control-height) - var(--sf-text-height-1)) / 2 - var(--sf-menu-element--border-width));padding-top:calc((var(--sf-ui-1--control-height) - var(--sf-text-height-1)) / 2 - var(--sf-menu-element--border-width));padding-top:var(--sf-menu-element--padding-top, var(--sf-menu-element--padding-block, calc((var(--sf-ui-1--control-height) - var(--sf-text-height-1)) / 2 - var(--sf-menu-element--border-width))));-webkit-padding-before:var(--sf-menu-element--padding-top, var(--sf-menu-element--padding-block, calc((var(--sf-ui-1--control-height) - var(--sf-text-height-1)) / 2 - var(--sf-menu-element--border-width))));padding-block-start:var(--sf-menu-element--padding-top, var(--sf-menu-element--padding-block, calc((var(--sf-ui-1--control-height) - var(--sf-text-height-1)) / 2 - var(--sf-menu-element--border-width))));padding-bottom:calc((var(--sf-ui-1--control-height) - var(--sf-text-height-1)) / 2 - var(--sf-menu-element--border-width));-webkit-padding-after:calc((var(--sf-ui-1--control-height) - var(--sf-text-height-1)) / 2 - var(--sf-menu-element--border-width));padding-block-end:calc((var(--sf-ui-1--control-height) - var(--sf-text-height-1)) / 2 - var(--sf-menu-element--border-width));padding-bottom:calc((var(--sf-ui-1--control-height) - var(--sf-text-height-1)) / 2 - var(--sf-menu-element--border-width));padding-bottom:var(--sf-menu-element--padding-bottom, var(--sf-menu-element--padding-block, calc((var(--sf-ui-1--control-height) - var(--sf-text-height-1)) / 2 - var(--sf-menu-element--border-width))));-webkit-padding-after:var(--sf-menu-element--padding-bottom, var(--sf-menu-element--padding-block, calc((var(--sf-ui-1--control-height) - var(--sf-text-height-1)) / 2 - var(--sf-menu-element--border-width))));padding-block-end:var(--sf-menu-element--padding-bottom, var(--sf-menu-element--padding-block, calc((var(--sf-ui-1--control-height) - var(--sf-text-height-1)) / 2 - var(--sf-menu-element--border-width))));-webkit-padding-end:var(--sf-space-1);padding-inline-end:var(--sf-space-1);-webkit-padding-end:var(--sf-menu-element--padding-right, var(--sf-menu-element--padding-inline-end, var(--sf-space-1)));padding-inline-end:var(--sf-menu-element--padding-right, var(--sf-menu-element--padding-inline-end, var(--sf-space-1)));-webkit-padding-start:var(--sf-space-1);padding-inline-start:var(--sf-space-1);-webkit-padding-start:var(--sf-menu-element--padding-inline-start, var(--sf-space-1));padding-inline-start:var(--sf-menu-element--padding-inline-start, var(--sf-space-1));border-color:var(--sf-menu-element--border-color);border-style:solid;border-style:var(--sf-menu-element--border-style, solid);border-top-width:var(--sf-menu-element--border-width);border-block-start-width:var(--sf-menu-element--border-width);border-top-width:var(--sf-menu-element--border-width);border-top-width:var(--sf-menu-element--border-top-width, var(--sf-menu-element--border-width));border-block-start-width:var(--sf-menu-element--border-top-width, var(--sf-menu-element--border-width));border-bottom-width:var(--sf-menu-element--border-width);border-block-end-width:var(--sf-menu-element--border-width);border-bottom-width:var(--sf-menu-element--border-width);border-bottom-width:var(--sf-menu-element--border-bottom-width, var(--sf-menu-element--border-width));border-block-end-width:var(--sf-menu-element--border-bottom-width, var(--sf-menu-element--border-width));border-inline-start-width:var(--sf-menu-element--border-width);border-inline-start-width:var(--sf-menu-element--border-left-width, var(--sf-menu-element--border-width));border-inline-end-width:var(--sf-menu-element--border-width);border-inline-end-width:var(--sf-menu-element--border-right-width, var(--sf-menu-element--border-width));border-start-start-radius:var(--sf-menu-element--radius);border-start-start-radius:var(--sf-menu-element--border-top-left-radius, var(--sf-menu-element--radius));border-start-end-radius:var(--sf-menu-element--radius);border-start-end-radius:var(--sf-menu-element--border-top-right-radius, var(--sf-menu-element--radius));border-end-start-radius:var(--sf-menu-element--radius);border-end-start-radius:var(--sf-menu-element--border-bottom-left-radius, var(--sf-menu-element--radius));border-end-end-radius:var(--sf-menu-element--radius);border-end-end-radius:var(--sf-menu-element--border-bottom-right-radius, var(--sf-menu-element--radius));color:var(--sf-menu-element--color);background-color:var(--sf-menu-element--background-color);font-family:var(--sf-text--family);font-family:var(--sf-menu-element--font-family, var(--sf-text--family));font-size:var(--sf-text-size-1);font-size:var(--sf-menu-element--font-size, var(--sf-text-size-1));font-weight:var(--sf-font-weight-regular);font-weight:var(--sf-menu-element--font-weight, var(--sf-font-weight-regular));line-height:var(--sf-text-height-1);line-height:var(--sf-menu-element--line-height, var(--sf-text-height-1));text-align:start;text-decoration:none}button.sf-menu-element,a.sf-menu-element,.sf-menu-element[role=button]{cursor:pointer}button.sf-menu-element{-webkit-appearance:none;-moz-appearance:none;appearance:none}.sf-menu-element .sf-menu-element-wrap{display:flex;flex:1 1 auto;align-items:center;gap:var(--sf-space-1\/3);gap:var(--sf-menu-element-wrap--gap, var(--sf-space-1\/3));min-width:var(--sf-0);min-width:var(--sf-0);min-inline-size:var(--sf-0);color:inherit;font:inherit}.sf-menu-element-text{min-width:var(--sf-0);min-width:var(--sf-0);min-inline-size:var(--sf-0);word-wrap:anywhere}.sf-menu-element-icon,.sf-menu-element>.sf-icon-button{flex:none}.sf-menu-element.disabled,.sf-menu-element:disabled,.sf-menu-element[aria-disabled=true]{--sf-menu-element--background-color: var(--sf-disable);--sf-menu-element--border-color: var(--sf-outline-disable);--sf-menu-element--color: var(--sf-on-disable);cursor:default}.sf-menu-element.disabled .sf-icon,.sf-menu-element:disabled .sf-icon,.sf-menu-element[aria-disabled=true] .sf-icon{--sf-icon--color: currentColor}.sf-menu-element:not(:disabled):not(.disabled):not([aria-disabled=true]):hover{--sf-menu-element--background-color: var(--sf-surface-container-hover);--sf-menu-element--border-color: var(--sf-surface-container-hover)}.sf-menu-element.open,.sf-menu-element[aria-expanded=true]{--sf-menu-element--background-color: var(--sf-surface-container-active);--sf-menu-element--border-color: var(--sf-surface-container-active)}.sf-menu-element[aria-expanded=false]:dir(rtl)>.sf-icon-button .sf-icon{-webkit-transform:scaleX(-1);transform:scaleX(-1)}.sf-menu-element:focus{outline:none}.sf-menu-element:not(:disabled):not(.disabled):not([aria-disabled=true]).focus-visible,.sf-menu-element>.sf-icon-button:not(:disabled).focus-visible{position:relative;z-index:1;outline:var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color);outline-offset:calc(var(--sf-focus--width)*-1)}.sf-menu-element:not(:disabled):not(.disabled):not([aria-disabled=true]):focus-visible,.sf-menu-element>.sf-icon-button:not(:disabled):focus-visible{position:relative;z-index:1;outline:var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color);outline-offset:calc(var(--sf-focus--width)*-1)}.sf-menu-element--level-1{--sf-menu-element--padding-inline-start: var(--sf-space-1)}.sf-menu-element--level-2{--sf-menu-element--padding-inline-start: var(--sf-space-3)}.sf-menu-element--level-3{--sf-menu-element--padding-inline-start: var(--sf-space-4)}.sf-menu-element--level-4{--sf-menu-element--padding-inline-start: var(--sf-space-5)}@media(forced-colors: active){.sf-menu-element:not(:disabled):not(.disabled):not([aria-disabled=true]).focus-visible,.sf-menu-element>.sf-icon-button:not(:disabled).focus-visible{outline:var(--sf-focus-outline-width) solid currentColor;outline-offset:calc(var(--sf-focus-outline-width)*-1);box-shadow:none}.sf-menu-element:not(:disabled):not(.disabled):not([aria-disabled=true]):focus-visible,.sf-menu-element>.sf-icon-button:not(:disabled):focus-visible{outline:var(--sf-focus-outline-width) solid currentColor;outline-offset:calc(var(--sf-focus-outline-width)*-1);box-shadow:none}}}@layer sf.components{.sf-menu{display:flex;box-sizing:border-box;flex-direction:column;align-items:stretch;min-width:var(--sf-0);min-width:var(--sf-0);min-inline-size:var(--sf-0);max-width:100%;max-width:100%;max-inline-size:100%;background-color:transparent;background-color:var(--sf-menu--background-color, transparent);gap:var(--sf-space-1\/3);gap:var(--sf-menu--gap, var(--sf-space-1\/3))}.sf-menu .sf-menu-item{--sf-menu-item--background-color: transparent;--sf-menu-item--gap: var(--sf-space-1\/3);display:flex;box-sizing:border-box;flex-direction:column;align-items:stretch;min-width:var(--sf-0);min-width:var(--sf-0);min-inline-size:var(--sf-0);max-width:100%;max-width:100%;max-inline-size:100%;background-color:var(--sf-menu-item--background-color);gap:var(--sf-menu-item--gap)}.sf-menu.sf-menu--horizontal{flex-direction:row;align-items:center;flex-wrap:nowrap}.sf-menu.sf-menu--horizontal>.sf-menu-item{position:relative;flex:0 0 auto;max-width:none;max-inline-size:none}.sf-menu.sf-menu--horizontal>.sf-menu-item>.sf-menu-element{width:auto;inline-size:auto;max-width:none;max-inline-size:none}.sf-menu.sf-menu--horizontal .sf-menu .sf-menu-item{position:relative}.sf-menu.sf-menu--horizontal>.sf-menu-item>.sf-menu,.sf-menu.sf-menu--horizontal .sf-menu .sf-menu-item>.sf-menu{position:absolute;z-index:3;z-index:var(--sf-menu-horizontal-submenu--z-index, 3);width:-webkit-max-content;width:-moz-max-content;width:max-content;inline-size:-webkit-max-content;inline-size:-moz-max-content;inline-size:max-content;min-width:100%;min-inline-size:100%;max-width:calc(100vw - var(--sf-space-2));max-inline-size:calc(100vw - var(--sf-space-2));padding:var(--sf-space-1\/3);padding:var(--sf-menu-horizontal-submenu--padding, var(--sf-space-1\/3));border:var(--sf-px) solid var(--sf-outline-variant);border:var(--sf-px) solid var(--sf-menu-horizontal-submenu--border-color, var(--sf-outline-variant));border-radius:var(--sf-radius--ui);border-radius:var(--sf-menu-horizontal-submenu--radius, var(--sf-radius--ui));background:var(--sf-elevation-2--surface);background:var(--sf-menu-horizontal-submenu--background-color, var(--sf-elevation-2--surface));--sf-on-surface-variant: var(--sf-on-elevation-2--variant);box-shadow:var(--sf-elevation-2--shadow);box-shadow:var(--sf-menu-horizontal-submenu--box-shadow, var(--sf-elevation-2--shadow))}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-menu.sf-menu--horizontal>.sf-menu-item>.sf-menu{left:0}@supports not (inset-inline-start: initial){html:not([dir="rtl"]) .sf-menu.sf-menu--horizontal>.sf-menu-item>.sf-menu{left:0}}.sf-menu.sf-menu--horizontal>.sf-menu-item>.sf-menu:where(:dir(ltr)){left:0}_:-ms-input-placeholder, [dir="rtl"] .sf-menu.sf-menu--horizontal>.sf-menu-item>.sf-menu{right:0}@supports not (inset-inline-start: initial){[dir="rtl"] .sf-menu.sf-menu--horizontal>.sf-menu-item>.sf-menu{right:0}}.sf-menu.sf-menu--horizontal>.sf-menu-item>.sf-menu:where(:dir(rtl)){right:0}.sf-menu.sf-menu--horizontal>.sf-menu-item>.sf-menu{top:100%;inset-block-start:100%;inset-inline-start:0}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-menu.sf-menu--horizontal .sf-menu .sf-menu-item>.sf-menu{left:100%}@supports not (inset-inline-start: initial){html:not([dir="rtl"]) .sf-menu.sf-menu--horizontal .sf-menu .sf-menu-item>.sf-menu{left:100%}}.sf-menu.sf-menu--horizontal .sf-menu .sf-menu-item>.sf-menu:where(:dir(ltr)){left:100%}_:-ms-input-placeholder, [dir="rtl"] .sf-menu.sf-menu--horizontal .sf-menu .sf-menu-item>.sf-menu{right:100%}@supports not (inset-inline-start: initial){[dir="rtl"] .sf-menu.sf-menu--horizontal .sf-menu .sf-menu-item>.sf-menu{right:100%}}.sf-menu.sf-menu--horizontal .sf-menu .sf-menu-item>.sf-menu:where(:dir(rtl)){right:100%}.sf-menu.sf-menu--horizontal .sf-menu .sf-menu-item>.sf-menu{top:0;inset-block-start:0;inset-inline-start:100%}.sf-menu.sf-menu--horizontal .sf-menu .sf-menu-element{width:100%;inline-size:100%;max-width:100%;max-inline-size:100%;--sf-menu-element--padding-inline-start: var(--sf-space-1)}.sf-menu.sf-menu--documentation-tree,.sf-menu.sf-menu--documentation-tree .sf-menu{--sf-menu--gap: var(--sf-space-1\/4);list-style:none;margin:var(--sf-0);padding:var(--sf-0)}.sf-menu.sf-menu--documentation-tree .sf-menu-element{--sf-menu-element--border-width: var(--sf-0);--sf-menu-element--padding-top: var(--sf-0);--sf-menu-element--padding-bottom: var(--sf-0);--sf-menu-element--padding-right: var(--sf-0);min-width:var(--sf-0)}.sf-menu.sf-menu--documentation-tree .sf-menu-element-wrap{min-width:var(--sf-0);padding-top:var(--sf-space-1\/3);padding-bottom:var(--sf-space-1\/3);padding-block:var(--sf-space-1\/3);padding-left:var(--sf-space-1);padding-right:var(--sf-space-1);padding-inline:var(--sf-space-1);word-wrap:anywhere}.sf-menu.sf-menu--documentation-tree .sf-menu-element--level-1{--sf-menu-element--padding-inline-start: var(--sf-0)}.sf-menu.sf-menu--documentation-tree .sf-menu-element--level-2{--sf-menu-element--padding-inline-start: var(--sf-space-1)}.sf-menu.sf-menu--documentation-tree .sf-menu-element--level-3{--sf-menu-element--padding-inline-start: var(--sf-space-2)}.sf-menu.sf-menu--documentation-tree .sf-menu-element--level-4{--sf-menu-element--padding-inline-start: var(--sf-space-3)}.sf-menu.sf-menu--documentation-tree [aria-current=page]{background:var(--sf-surface-container-active);color:var(--sf-on-surface);font-weight:var(--sf-font-weight-medium)}.sf-menu.sf-menu--documentation-tree .sf-menu-element-wrap.focus-visible{outline:var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color);outline-offset:calc(var(--sf-focus--width)*-1)}.sf-menu.sf-menu--documentation-tree .sf-menu-element-wrap:focus-visible{outline:var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color);outline-offset:calc(var(--sf-focus--width)*-1)}}