:root{--s-notice-bar-min-height:var(--s-content-height-sm);--s-notice-bar-padding-x:var(--s-content-padding-x);--s-notice-bar-padding-y:var(--s-content-padding-y);--s-notice-bar-font-size:var(--s-font-size);--s-notice-bar-color:#f97316;--s-notice-bar-bg:rgba(var(--s-color-warning-rgb), var(--s-opacity-theme-bg));--s-notice-bar-wrap-line-height:var(--s-line-height-snug);--s-notice-bar-left-icon-size:var(--s-size-lg);--s-notice-bar-left-icon-margin-end:var(--s-size-xs);--s-notice-bar-right-icon-padding:var(--s-size-xs);--s-notice-bar-right-icon-size:var(--s-size);--s-notice-bar-right-icon-margin-start:0;--s-notice-bar-right-icon-margin-end:calc(var(--s-size-xs)*-1)}.s-notice-bar{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;min-height:var(--s-notice-bar-min-height);padding:0 var(--s-notice-bar-padding-x);background:var(--s-notice-bar-bg);color:var(--s-notice-bar-color)}.s-notice-bar--wrap{padding-top:var(--s-notice-bar-padding-y);padding-bottom:var(--s-notice-bar-padding-y)}.s-notice-bar--linkable{cursor:pointer}.s-notice-bar__left-icon{font-size:var(--s-notice-bar-left-icon-size);margin-inline-end:var(--s-notice-bar-left-icon-margin-end)}.s-notice-bar__content{flex:1;display:flex;flex-direction:row;overflow:hidden}.s-notice-bar__wrapper{font-size:var(--s-notice-bar-font-size);line-height:var(--s-notice-bar-wrap-line-height);white-space:nowrap;animation-duration:var(--duration);animation-timing-function:linear;animation-fill-mode:both;transform:translateX(var(--x))}:root[dir=rtl] .s-notice-bar__wrapper{transform:translateX(calc(var(--x) * -1))}.s-notice-bar__right-icon{font-size:var(--s-notice-bar-right-icon-size);padding:var(--s-notice-bar-right-icon-padding);margin-inline-start:var(--s-notice-bar-right-icon-margin-start);margin-inline-end:var(--s-notice-bar-right-icon-margin-end);cursor:pointer}.s-notice-bar--linkable{cursor:pointer}:root[dir=rtl] .s-notice-bar--linkable .s-notice-bar__right-icon{transform:scaleX(-1)}.s-notice-bar--vertical .s-notice-bar__content{flex-direction:column}.s-notice-bar--scrollable .s-notice-bar__wrapper{animation-name:s-notice-bar-scroll}:root[dir=rtl] .s-notice-bar--scrollable .s-notice-bar__wrapper{animation-name:s-notice-bar-scroll-rtl}.s-notice-bar--infinite .s-notice-bar__wrapper{animation-name:s-notice-bar-scroll-infinite;animation-iteration-count:infinite}:root[dir=rtl] .s-notice-bar--infinite .s-notice-bar__wrapper{animation-name:s-notice-bar-scroll-infinite-rtl}@keyframes s-notice-bar-scroll{100%{transform:translate3d(-100%, 0, 0)}}@keyframes s-notice-bar-scroll-infinite{100%{transform:translate3d(-100%, 0, 0)}}@keyframes s-notice-bar-scroll-rtl{100%{transform:translate3d(100%, 0, 0)}}@keyframes s-notice-bar-scroll-infinite-rtl{100%{transform:translate3d(100%, 0, 0)}}.s-notice-bar--wrap .s-notice-bar__wrapper{white-space:normal}