@festo-ui/react 6.0.0-dev.213 → 6.0.0-dev.217

package/index.css

@@ -1,4 +1,4 @@
-.fr-accordion{background-color:var(--fwe-white)}.fr-accordion,.fr-accordion-header{border-bottom:1px solid var(--fwe-gray-100)}.fr-accordion-header{align-items:center;color:var(--fwe-text);display:flex;font-size:var(--fwe-font-size-md);font-weight:var(--fwe-font-weight-bold);height:48px;padding:0 16px 0 24px}.fr-accordion-item-body{height:0;overflow:hidden;transition:height .3s cubic-bezier(.4,0,.2,1)}.fr-accordion-item-body>:first-child:not(.fr-accordion-item-body-spacer-bottom):not(.fr-accordion){margin-top:0!important;padding-top:0!important}.fr-accordion-item-body>:not(.fr-accordion){margin-right:0}.fr-accordion-item-body-content{margin-right:64px}.fr-accordion-item-body-spacer-bottom{height:0;margin-top:24px;width:0}.fr-accordion-item-body .fr-accordion{margin-bottom:24px;margin-top:64px}.fr-accordion-item-body .fr-accordion-item-link{display:block;top:8px}.fr-accordion-item-body .fr-accordion-item-header{padding-right:32px;padding-top:32px}.fr-accordion-item-body .fr-accordion-item:after{color:var(--fwe-caerul);content:"";font-family:var(--fwe-font-family-icons-16);font-size:var(--fwe-font-size-base);height:16px;line-height:16px;right:4px;top:12px}.fr-accordion-item-body .fr-accordion-item--expanded:before{background-color:transparent}@media(min-width:600px){.fr-accordion-item-body>:not(.fng-accordion){margin-right:64px}.fr-accordion-item-body .fr-accordion-item-header{padding-right:168px;padding-top:24px}.fr-accordion-item-body .fr-accordion-item-link{font-size:var(--fwe-font-size-base);max-width:128px;overflow:hidden;text-overflow:ellipsis;top:24px;white-space:nowrap}.fr-accordion-item-body .fr-accordion-item:after{top:30px}}.fr-accordion-item-header{align-items:center;cursor:pointer;display:flex;min-height:48px;padding:24px 64px 24px 0}.fr-accordion-item{border-bottom:1px solid var(--fwe-gray-100);border-top:1px solid var(--fwe-gray-100);padding:0 16px 0 24px;position:relative}.fr-accordion-item-link{color:var(--fwe-caerul);display:none;font-size:var(--fwe-font-size-md);pointer-events:none;position:absolute;right:24px;top:24px}.fr-accordion-item:before{background-color:var(--fwe-caerul);content:"";display:block;height:0;left:0;position:absolute;top:0;width:4px}.fr-accordion-item:after{content:"";display:block;font-family:var(--fwe-font-family-icons-32);font-size:var(--fwe-font-size-xxl);height:32px;line-height:32px;pointer-events:none;position:absolute;right:16px;top:21px;transition:transform .2s ease}.fr-accordion-item--expanded .fr-accordion-item-header{font-weight:var(--fwe-font-weight-bold)}.fr-accordion-item--expanded .fr-accordion-item-body{height:auto}.fr-accordion-item--expanded:after{transform:rotate(-180deg)}.fr-accordion-item--expanded:before{height:100%}.fr-accordion-item--collapsed .fr-accordion-item-body{height:0}.fr-accordion-item--collapsed .fr-accordion-item-header{font-weight:var(--fwe-font-weight-normal)}.fwe-chip-container .fr-chip .fwe-icon-menu-close{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#333;font-size:var(--fwe-font-size-base);line-height:var(--fwe-font-size-base);margin-left:0;padding-right:0;position:absolute;right:5px;top:3px}.fwe-chip-container .fr-chip .fwe-icon-menu-close:before{font-family:var(--fwe-font-family-icons-32)}.fwe-chip-container .fr-chip.fwe-chip.fwe-selected.fwe-category:after{content:none}.fr-modal{opacity:0}.fr-modal-enter-done{opacity:1;transition:opacity .1s ease-out .3s}.fr-modal-backdrop{opacity:0}.fr-modal-backdrop-enter-done{opacity:1;transition:opacity .3s ease-out}.fr-modal-backdrop-exit,.fr-modal-exit{opacity:1}.fr-modal-backdrop-exit-active,.fr-modal-exit-active{opacity:0;transition:opacity .6s}@font-face{font-family:swiper-icons;font-style:normal;font-weight:400;src:url("data:application/font-woff;charset=utf-8;base64, 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") format("woff")}.swiper-free-mode>.swiper-wrapper{margin:0 auto;transition-timing-function:ease-out}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{align-items:center;color:var(--swiper-navigation-color,var(--swiper-theme-color));cursor:pointer;display:flex;height:var(--swiper-navigation-size);justify-content:center;margin-top:calc(0px - var(--swiper-navigation-size)/2);position:absolute;top:var(--swiper-navigation-top-offset,50%);width:calc(var(--swiper-navigation-size)/44*27);z-index:10}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{cursor:auto;opacity:.35;pointer-events:none}.swiper-button-next.swiper-button-hidden,.swiper-button-prev.swiper-button-hidden{cursor:auto;opacity:0;pointer-events:none}.swiper-navigation-disabled .swiper-button-next,.swiper-navigation-disabled .swiper-button-prev{display:none!important}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);font-variant:normal;letter-spacing:0;line-height:1;text-transform:none!important}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset,10px);right:auto}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:"prev"}.swiper-button-next,.swiper-rtl .swiper-button-prev{left:auto;right:var(--swiper-navigation-sides-offset,10px)}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:"next"}.swiper-button-lock{display:none}.swiper-zoom-container{align-items:center;display:flex;height:100%;justify-content:center;text-align:center;width:100%}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-height:100%;max-width:100%;-o-object-fit:contain;object-fit:contain}.swiper-slide-zoomed{cursor:move;touch-action:none}@font-face{font-family:swiper-icons;font-style:normal;font-weight:400;src:url("data:application/font-woff;charset=utf-8;base64, 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")}:root{--swiper-theme-color:#007aff}.swiper,swiper-container{display:block;list-style:none;margin-left:auto;margin-right:auto;overflow:hidden;padding:0;position:relative;z-index:1}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{box-sizing:content-box;display:flex;height:100%;position:relative;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);width:100%;z-index:1}.swiper-android .swiper-slide,.swiper-wrapper{transform:translateZ(0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide,swiper-slide{display:block;flex-shrink:0;height:100%;position:relative;transition-property:transform;width:100%}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{backface-visibility:hidden;transform:translateZ(0)}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide,.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{transform-style:preserve-3d}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(270deg,rgba(0,0,0,.5),transparent)}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(90deg,rgba(0,0,0,.5),transparent)}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(0deg,rgba(0,0,0,.5),transparent)}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(180deg,rgba(0,0,0,.5),transparent)}.swiper-css-mode>.swiper-wrapper{-ms-overflow-style:none;overflow:auto;scrollbar-width:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-horizontal.swiper-css-mode>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-vertical.swiper-css-mode>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-centered>.swiper-wrapper:before{content:"";flex-shrink:0;order:9999}.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-centered.swiper-horizontal>.swiper-wrapper:before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-centered.swiper-vertical>.swiper-wrapper:before{height:var(--swiper-centered-offset-after);min-width:1px;width:100%}.swiper-lazy-preloader{border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top:4px solid transparent;box-sizing:border-box;height:42px;left:50%;margin-left:-21px;margin-top:-21px;position:absolute;top:50%;transform-origin:50%;width:42px;z-index:10}.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,swiper-container:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s linear infinite}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.fwe-page-dot:focus{background:var(--fwe-control-border-dark);outline:0}.fwe-popover-menu #tooltip{background:#fff;box-shadow:0 1px 4px rgba(51,51,51,.2)}.fwe-popover-menu #tooltip,.fwe-popover-menu .fwe-popover{font-size:var(--fwe-font-size-base);line-height:1.5rem;padding:16px}.fwe-popover-menu .fwe-list-group .fwe-list-group-item{border-bottom:none;min-height:36px;padding:0}.fwe-popover-menu .fwe-list-group .fwe-list-group-item button{display:inline-flex;height:32px;margin-left:inherit;max-height:32px;padding:0 8px 0 0;text-align:left;width:100%}.fwe-popover-menu .fwe-list-group .fwe-list-group-item button:hover{color:var(--fwe-black)}.fwe-popover-menu .fwe-list-group .fwe-list-group-item button i{align-items:center;display:inline-flex;flex-wrap:nowrap;height:24px;justify-content:center;width:32px}.fwe-popover-menu .fwe-list-group .fwe-list-group-item button i:before{display:inline-flex}.fwe-popover-menu .fwe-list-group .fwe-list-group-item button span{display:inline-flex;height:24px}.fwe-popover-menu .fwe-list-group .fwe-list-group-item button [class*=" fwe-icon-"]{margin-left:inherit}.fwe-popover-menu .fwe-list-group .fwe-list-group-item:hover{background-color:rgba(51,51,51,.102);color:var(--fwe-black)}.fwe-popover-menu .fwe-list-group .fwe-list-group-item:active{background-color:rgba(51,51,51,.2)}#arrow,#arrow:after{height:12px;position:absolute;transform:rotate(45deg);width:12px}#arrow{height:17px;overflow:hidden;width:17px}#arrow:after{background:#fff;box-shadow:0 1px 4px rgba(51,51,51,.2);content:"";z-index:-1}.fwe-popover-container[data-popper-placement^=top]>#arrow{top:100%}.fwe-popover-container[data-popper-placement^=top]>#arrow:after{left:3px;top:-6px}.fwe-popover-container[data-popper-placement^=bottom]>#arrow{top:-17px}.fwe-popover-container[data-popper-placement^=bottom]>#arrow:after{left:3px;top:11px}.fwe-popover-container[data-popper-placement^=left]>#arrow{left:100%}.fwe-popover-container[data-popper-placement^=left]>#arrow:after{left:-6px;top:2px}.fwe-popover-container[data-popper-placement^=right]>#arrow{left:-17px}.fwe-popover-container[data-popper-placement^=right]>#arrow:after{left:11px;top:2px}.fr-tooltip-container{width:-moz-fit-content;width:fit-content}.fwe-w-100{width:100%}.fwe-search-suggestion{height:40px}.fr-snackbar-wrapper{height:48px;margin-bottom:24px;opacity:1;opacity:0}.fr-snackbar-wrapper-enter-done{opacity:1;transition:opacity .6s ease-out}.fr-snackbar-wrapper-exit{opacity:1}.fr-snackbar-wrapper-exit-active{height:0;margin-bottom:0;opacity:0;transition:height .3s ease-out .3s,opacity .3s ease-out,margin-bottom .3s ease-out .3s}.fr-snackbar-wrapper--first{height:48px;margin-bottom:24px;opacity:1;transform:translateY(100px)}.fr-snackbar-wrapper--first-enter-done{opacity:1;transition:opacity .6s ease-out}.fr-snackbar-wrapper--first-exit{opacity:1}.fr-snackbar-wrapper--first-exit-active{height:0;margin-bottom:0;opacity:0;transition:height .3s ease-out .3s,opacity .3s ease-out,margin-bottom .3s ease-out .3s}.fr-snackbar-wrapper--first-enter-done{transform:translateY(0);transition:transform .6s ease-out}.fr-snackbar-wrapper--first-exit-active{transform:translateY(0)}.overflow-hidden{overflow:hidden}@keyframes stepperAnimation{0%{transform:translateX(100%)}to{transform:translateX(0)}}.fr-moving-container{animation-duration:.3s;animation-name:stepperAnimation;animation-timing-function:ease}.hidden{display:none}.fwe-stepper-vertical .fwe-step-container.fwe-step-active .fwe-step-content-container{height:20px}.fr-show{display:block}.fr-hide{display:none}.fwe-legacy-tabs{height:100%;margin:48px 0;width:100%}.fwe-legacy-tab-bar{display:flex;flex-wrap:nowrap;font-size:var(--fwe-font-size-base);list-style:none;margin-bottom:0;margin-top:0;padding-left:0;width:75%}.fwe-legacy-tab-bar.fwe-legacy-tab-bar-full-width{width:100%}.fwe-legacy-tab-bar.fwe-legacy-tab-items-fill .fwe-legacy-tab-item{flex:1 1 auto}.fwe-legacy-tab-bar.fwe-legacy-tab-items-equal-width .fwe-legacy-tab-item{flex:1 1 0}.fwe-legacy-tab-item{background-color:var(--fwe-gray-300);border-right:2px solid var(--fwe-gray-100);height:48px;max-height:48px;text-align:center}.fwe-legacy-tab-item:last-child{border-right:none}.fwe-legacy-tab-item.fwe-active{background-color:var(--fwe-white)}.fwe-legacy-tab-item.fwe-active .fwe-legacy-tab-link{color:var(--fwe-caerul)}.fwe-legacy-tab-item:not(.fwe-active){border-bottom:2px solid var(--fwe-gray-100)}.fwe-legacy-tab-item:not(.fwe-active) .fwe-legacy-tab-link{padding:11px 16px}.fwe-legacy-tab-link{color:var(--fwe-black);cursor:pointer;display:inline-block;height:48px;line-height:24px;padding:11px 16px 13px;white-space:nowrap;width:100%}.fwe-legacy-tab-link i.fwe-icon{padding-right:8px;vertical-align:initial}.fwe-legacy-tab-link i.fwe-icon.fwe-icon-lg{position:relative;top:3px}.fwe-legacy-tab-link:hover{color:var(--fwe-caerul)}.fwe-legacy-tab-link:active{background-color:var(--fwe-white);color:var(--fwe-caerul)}.fwe-legacy-tab-panel-content{background-color:var(--fwe-white);height:100%;overflow:auto;padding:48px 24px}@media(max-width:375px){.fwe-legacy-tab-bar{background-color:var(--fwe-white);justify-content:space-between;width:100%}.fwe-legacy-tab-item{background-color:var(--fwe-white);border-right:2px solid var(--fwe-white)}.fwe-legacy-tab-item:not(.fwe-active){border-bottom:2px solid var(--fwe-white)}.fwe-legacy-tab-item:not(.fwe-active) .fwe-legacy-tab-link,.fwe-legacy-tab-item:not(.fwe-active) .fwe-legacy-tab-link i.fwe-icon{color:var(--fwe-icon-gray)}.fwe-legacy-tab-link.fwe-can-swap-icon{direction:rtl}.fwe-legacy-tab-link.fwe-can-swap-icon i.fwe-icon{padding-left:8px;padding-right:0}}.fr-tab-panel-content{background-color:var(--fwe-white);height:100%;overflow:auto;padding:48px 24px}.fr-tab-bar{width:100%}.fr-tab-scroller{overflow-y:hidden}.fr-tab-scroller-scroll-area{display:flex;overflow-x:hidden;position:relative}.fr-tab-scroller-scroll-area::-webkit-scrollbar{display:none}.fr-tab-scroller-scroll-area--scroll{overflow-x:scroll}.fr-tab-scroller-scroll-content{display:flex;flex:1 0 auto;padding:0 17px 0 16px;position:relative;transform:none;will-change:transform}.fr-tab-scroller-scroll-content--with-divider .fr-tab-scroller-divider-line{display:block}.fr-tab-scroller--animating .fr-tab-scroller-scroll-content{transition:transform .25s cubic-bezier(.4,0,.2,1)}.fr-tab-scroller-divider-line{border-bottom:1px solid var(--fwe-control);bottom:0;display:none;left:0;position:absolute;right:0;top:0}.fr-tab-indicator{display:flex;height:100%;justify-content:center;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:1}.fr-tab-indicator-content{opacity:0;transform-origin:left}.fr-tab-indicator-content--underline{align-self:flex-end;border-top-style:solid;box-sizing:border-box;width:100%}.fr-tab-indicator .fr-tab-indicator-content{transition:transform .25s cubic-bezier(.4,0,.2,1)}.fr-tab-indicator .fr-tab-indicator-content--underline{border-top:4px solid var(--fwe-caerul)}.fr-tab-indicator--active .fr-tab-indicator-content{opacity:1}.fr-tab{-webkit-appearance:none;background:none;border:none;cursor:pointer;display:flex;flex:1 0 auto;height:36px;justify-content:center;margin:0;outline:none;padding:0;position:relative;text-align:center;white-space:nowrap;z-index:1}.fr-tab:not(:last-child){margin-right:32px}.fr-tab::-moz-focus-inner{border:0;padding:0}.fr-tab .fr-tab-text-label{color:var(--fwe-text)}.fr-tab--active .fr-tab-text-label{color:var(--fwe-caerul)}.fr-tab-content{align-items:flex-start;display:flex;height:inherit;justify-content:center;pointer-events:none;position:relative}.fr-tab-text-label{display:inline-block;z-index:2}.fr-tab-scroller-scroll-area:not(.fr-tab-scroller-scroll-area--compact) .fr-tab{flex:none}.fr-tab-scroller-scroll-area:not(.fr-tab-scroller-scroll-area--compact) .fr-tab:not(:last-child){margin-right:64px}.fr-tab-scroller-scroll-area:not(.fr-tab-scroller-scroll-area--compact) .fr-tab-scroller-scroll-content{padding:0 32px}.fr-tab-scroller-scroll-area:not(.fr-tab-scroller-scroll-area--compact) .fr-tab-scroller-divider-line{padding-right:64px}.fwe-checkbox-container{align-items:center;cursor:pointer;display:flex;flex-direction:row;font-family:var(--fwe-font-family-sans-serif);-webkit-user-select:none;-moz-user-select:none;user-select:none}.fwe-checkbox-container.fwe-label-below{flex-direction:column}.fwe-checkbox-container.fwe-label-below .fwe-checkbox-title{margin:8px 0 0}.fwe-checkbox-container.fwe-label-before{flex-direction:row-reverse;justify-content:flex-end}.fwe-checkbox-container.fwe-label-before .fwe-checkbox-title{margin:0 8px 0 0}.fwe-checkbox-container .fwe-checkbox-indicator-container{position:relative}.fwe-checkbox-container input{cursor:pointer;height:0;opacity:0;width:0}.fwe-checkbox-container .fwe-checkbox-title{color:var(--fwe-text);line-height:24px;margin-left:8px;-webkit-user-select:none;-moz-user-select:none;user-select:none}.fwe-checkbox-container .fwe-checkbox-indicator-background{background:var(--fwe-white);border:1px solid var(--fwe-text-light);border-radius:2px;box-sizing:border-box;height:16px;transition:border-width .2s ease-out;width:16px}.fwe-checkbox-container .fwe-indeterminate-indicator{background:#fff;height:2px;left:3px;position:absolute;top:7px;width:10px}.fwe-checkbox-container svg{display:block;left:0;position:absolute;top:0}.fwe-checkbox-container.fr-checkbox-large .fwe-checkbox-indicator-background{border-radius:4px;height:24px;width:24px}.fwe-checkbox-container.fr-checkbox-large .fwe-indeterminate-indicator{left:5px;top:11px;width:14px}.fwe-checkbox-container.fr-checkbox-large.fr-checkbox-indeterminate .fwe-checkbox-indicator-background,.fwe-checkbox-container.fr-checkbox-large.fwe-checked .fwe-checkbox-indicator-background{border:12px solid var(--fwe-hero)}.fwe-checkbox-container:hover .fwe-checkbox-indicator-background{background-color:var(--fwe-control)}.fwe-checkbox-container:active .fwe-checkbox-indicator-background{background-color:var(--fwe-control-dark)}.fwe-checkbox-container.fr-checkbox-indeterminate .fwe-checkbox-indicator-background,.fwe-checkbox-container.fwe-checked .fwe-checkbox-indicator-background{border:8px solid var(--fwe-hero)}.fwe-checkbox-container.fr-checkbox-indeterminate:hover .fwe-checkbox-indicator-background,.fwe-checkbox-container.fwe-checked:hover .fwe-checkbox-indicator-background{border-color:var(--fwe-hero-dark)}.fwe-checkbox-container.fr-checkbox-indeterminate:active .fwe-checkbox-indicator-background,.fwe-checkbox-container.fwe-checked:active .fwe-checkbox-indicator-background{border-color:var(--fwe-hero-darker)}.fwe-checkbox-container.fr-checkbox-invalid .fwe-checkbox-indicator-background{background:var(--fwe-white);border:1px solid var(--fwe-red)}.fwe-checkbox-container.fwe-disabled{cursor:default}.fwe-checkbox-container.fwe-disabled .fwe-checkbox-indicator-background{background-color:var(--fwe-white);border:1px solid var(--fwe-control)}.fwe-checkbox-container.fwe-disabled.fr-checkbox-indeterminate .fwe-checkbox-indicator-background,.fwe-checkbox-container.fwe-disabled.fwe-checked .fwe-checkbox-indicator-background{background-color:var(--fwe-control);border:1px solid var(--fwe-control)}.fwe-checkbox-container.fwe-disabled.fr-checkbox-invalid .fwe-checkbox-indicator-background{background-color:var(--fwe-white);border:1px solid var(--fwe-control)}.fwe-checkbox-container.fwe-disabled .fwe-checkbox-title{color:var(--fwe-text-disabled)}.fwe-color-indicator .fwe-popover-container{position:relative}.fwe-color-indicator .fwe-popover-container .fwe-popover{background-color:var(--fwe-white);border-radius:4px;box-shadow:0 1px 4px rgba(51,51,51,.2);font-size:var(--fwe-font-size-md);line-height:1rem;padding:8px 16px 16px}.fwe-color-indicator .fwe-backdrop{background:transparent}.fwe-color-indicator .fwe-color-label{font-size:var(--fwe-font-size-small);font-weight:var(--fwe-font-weight-bold);height:18px;margin-bottom:4px}.fwe-color-indicator .fwe-color-container{display:flex}.fwe-color-indicator .fwe-color-container .fwe-color-box{background:var(--fwe-white);border:1px solid var(--fwe-control-border);border-radius:4px;height:24px;width:24px}.fwe-color-indicator .fwe-color-container .fwe-color-box .fwe-no-color-pattern{margin:2px}.fwe-color-indicator .fwe-color-container .fwe-color-indicator-text{margin-left:8px}.fwe-color-indicator.disabled{pointer-events:none}.fwe-color-indicator.disabled .fwe-color-label{color:var(--fwe-text-disabled)}.fwe-color-indicator.disabled .fwe-color-container .fwe-color-box{opacity:.5}.fwe-color-indicator.disabled .fwe-color-container .fwe-color-indicator-text{color:var(--fwe-text-disabled)}.fwe-triangle.fwe-triangle-bottom,.fwe-triangle.fwe-triangle-left,.fwe-triangle.fwe-triangle-right,.fwe-triangle.fwe-triangle-top{height:17px;overflow:hidden;position:absolute;width:17px}.fwe-triangle.fwe-triangle-bottom:after,.fwe-triangle.fwe-triangle-left:after,.fwe-triangle.fwe-triangle-right:after,.fwe-triangle.fwe-triangle-top:after{background:var(--fwe-white);box-shadow:0 1px 4px rgba(51,51,51,.2);content:"";height:12px;position:absolute;transform:rotate(45deg);width:12px}.fwe-popover,.fwe-popover.fwe-popover-menu{background-color:var(--fwe-white);border-radius:4px;box-shadow:0 1px 4px rgba(51,51,51,.2)}.fwe-popover{font-size:var(--fwe-font-size-md);line-height:1rem;padding:8px}.fwe-popover-container{display:inline-block;position:relative}.fwe-triangle.fwe-triangle-top{left:50%;top:-17px;transform:translateX(-8px)}.fwe-triangle.fwe-triangle-top:after{left:3px;top:11px}.fwe-triangle.fwe-triangle-bottom{left:50%;top:100%;transform:translateX(-8px)}.fwe-triangle.fwe-triangle-bottom:after{left:3px;top:-6px}.fwe-triangle.fwe-triangle-left{left:-17px;top:50%;transform:translateY(-8px)}.fwe-triangle.fwe-triangle-left:after{left:11px;top:2px}.fwe-triangle.fwe-triangle-right{left:100%;top:50%;transform:translateY(-8px)}.fwe-triangle.fwe-triangle-right:after{left:-6px;top:2px}.fwe-popover.fwe-popover-menu{font-size:var(--fwe-font-size-base);line-height:1.5rem;padding:16px}.fwe-popover.fwe-popover-menu .fwe-list-group .fwe-list-group-item{border-bottom:none;min-height:36px;padding:0}.fwe-popover.fwe-popover-menu .fwe-list-group .fwe-list-group-item button{display:inline-flex;height:32px;justify-content:unset;margin-left:inherit;max-height:32px;padding:0 8px 0 0;text-align:left;width:100%}.fwe-popover.fwe-popover-menu .fwe-list-group .fwe-list-group-item button:hover{color:var(--fwe-black)}.fwe-popover.fwe-popover-menu .fwe-list-group .fwe-list-group-item button i{align-items:center;display:inline-flex;flex-wrap:nowrap;height:24px;justify-content:center;width:32px}.fwe-popover.fwe-popover-menu .fwe-list-group .fwe-list-group-item button i:before{display:inline-flex}.fwe-popover.fwe-popover-menu .fwe-list-group .fwe-list-group-item button span{display:inline-flex;height:24px}.fwe-popover.fwe-popover-menu .fwe-list-group .fwe-list-group-item button [class*=" fwe-icon-"]{margin-left:inherit}.fwe-popover.fwe-popover-menu .fwe-list-group .fwe-list-group-item:hover{background-color:rgba(51,51,51,.102);color:var(--fwe-black)}.fwe-popover.fwe-popover-menu .fwe-list-group .fwe-list-group-item:active{background-color:rgba(51,51,51,.2)}.fwe-popover .fwe-popover-legend{display:table;line-height:24px;margin:16px}.fwe-popover .fwe-popover-legend .fwe-popover-legend-content{display:table-row}.fwe-popover .fwe-popover-legend .fwe-popover-legend-content dt{display:table-cell;margin:0;padding-right:8px}.fwe-popover .fwe-popover-legend .fwe-popover-legend-content dd{display:table-cell;margin:0}.fwe-color-picker{width:216px}.fwe-color-picker.fwe-alpha-active{width:245px}.fwe-color-picker .fwe-gradient-picker{height:198px;margin:-7px;position:relative;width:198px}.fwe-color-picker .fwe-gradient-picker .fwe-brightness-gradient{background-image:linear-gradient(transparent,#000);bottom:7px;left:7px;position:absolute;right:7px;top:7px}.fwe-color-picker .fwe-gradient-picker .fwe-saturation-gradient{bottom:7px;left:7px;position:absolute;right:7px;top:7px}.fwe-color-picker .fwe-alpha-picker,.fwe-color-picker .fwe-hue-picker,.fwe-color-picker .fwe-vertical-picker{height:198px;margin:-7px -3px -7px 18px;position:relative;width:14px}.fwe-color-picker .fwe-alpha-picker .fwe-picker-background,.fwe-color-picker .fwe-hue-picker .fwe-picker-background,.fwe-color-picker .fwe-vertical-picker .fwe-picker-background{border-radius:4px;height:184px;margin:7px 3px;width:8px}.fwe-color-picker .fwe-alpha-picker .fwe-knob,.fwe-color-picker .fwe-hue-picker .fwe-knob,.fwe-color-picker .fwe-vertical-picker .fwe-knob{left:-3px}.fwe-color-picker .fwe-hue-picker .fwe-picker-background{background-image:linear-gradient(red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.fwe-color-picker .fwe-alpha-picker .fwe-no-color-pattern{margin:7px 3px;position:absolute}.fwe-color-picker .fwe-alpha-picker .fwe-picker-background{position:absolute}.fwe-color-picker .fwe-type-select{display:flex;position:relative}.fwe-color-picker .fwe-type-select .fwe-type-indicator{cursor:pointer;display:flex;flex-shrink:1}.fwe-color-picker .fwe-type-select .fwe-type-indicator .fwe-input-type{font-size:var(--fwe-font-size-small);font-weight:var(--fwe-font-weight-bold);line-height:calc(var(--fwe-font-size-small) + 5px)}.fwe-color-picker .fwe-type-select .fwe-type-indicator:hover{color:var(--fwe-hero)}.fwe-color-picker .fwe-type-select .fwe-icon-arrows-collapse{line-height:16px;margin-left:16px}.fwe-color-picker .fwe-type-select .fwe-popover{left:0;position:absolute;top:24px;z-index:1}.fwe-color-picker .fwe-type-select .fwe-popover .fwe-type-item{cursor:pointer;display:flex;padding:8px}.fwe-color-picker .fwe-type-select .fwe-popover .fwe-type-item:hover{color:var(--fwe-hero)}.fwe-color-picker .fwe-type-select .fwe-popover .fwe-type-item .fwe-icon-menu-check{margin-right:8px;opacity:0}.fwe-color-picker .fwe-type-select .fwe-popover .fwe-type-item.fwe-selected{cursor:default}.fwe-color-picker .fwe-type-select .fwe-popover .fwe-type-item.fwe-selected .fwe-icon-menu-check{opacity:1}.fwe-color-picker input::-webkit-inner-spin-button,.fwe-color-picker input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.fwe-color-picker input[type=number]{-moz-appearance:textfield}.fwe-color-picker input{padding-right:0!important;text-align:center}.fwe-color-picker .fwe-hex-input{margin-right:16px;width:75px}.fwe-color-picker .fwe-green-input,.fwe-color-picker .fwe-red-input{margin-right:8px;width:32px}.fwe-color-picker .fwe-blue-input{width:32px}.fwe-color-picker .fwe-alpha-input span input{padding-right:16px!important;width:48px}.fwe-color-picker .fwe-alpha-input .fwe-percent-char{margin-left:-16px}.fwe-color-picker .fwe-color-grid{display:flex;flex-wrap:wrap;margin-bottom:-8px;margin-right:-8px}.fwe-color-picker .fwe-color-grid .fwe-color-item{align-items:center;border-radius:4px;color:#fff;display:flex;height:24px;justify-content:center;margin-bottom:8px;margin-right:8px;width:24px}.fwe-color-picker .fwe-color-grid .fwe-color-item.fwe-white-item{border:1px solid var(--fwe-control-border);color:#000}.fwe-color-picker .fwe-color-grid .fwe-remove-color-button{align-items:center;border:1px solid var(--fwe-control-border);border-radius:4px;color:var(--fwe-control);display:flex;height:24px;justify-content:center;margin-bottom:8px;margin-right:8px;width:24px}.fwe-color-picker .fwe-color-grid .fwe-remove-color-button .fwe-no-color-pattern{margin:2px}.fwe-color-picker .fwe-color-grid .fwe-remove-color-button i{color:transparent;position:absolute}.fwe-color-picker .fwe-knob{border:2px solid #fff;border-radius:50%;box-shadow:0 0 4px 0 rgba(0,0,0,.15);height:14px;position:absolute;width:14px;z-index:1}.flatpickr-calendar{margin-top:6px}.flatpickr-calendar:not(.open){display:none}.fwe-border-hero{border-color:var(--fwe-hero)!important}.fr-date-range-picker:hover input{color:var(--fwe-hero)}.fr-date-range-picker-inputs{display:flex;order:2}.fwe-select-wrapper{min-width:48px;width:100%}.fwe-select-wrapper .fr-select-input{bottom:0;box-sizing:border-box;left:0;opacity:0;pointer-events:none;position:absolute;width:100%}.fwe-select-wrapper.fwe-disabled:before{color:var(--fwe-text-disabled)}.fwe-select-wrapper .fwe-select{cursor:pointer}.fwe-select-wrapper .fwe-select .fwe-select-content{line-height:1.5rem;overflow:hidden;padding-right:24px;text-overflow:ellipsis;white-space:nowrap}.fwe-select-wrapper .fwe-select.fwe-required:not(.fwe-disabled)~.fwe-select-label:after{content:"*";display:inline-block;left:3px;position:relative}.fwe-select-wrapper .fwe-select.fwe-required:not(.fwe-disabled):not(.fwe-invalid)~.fwe-select-valid{display:block}.fwe-select-wrapper .fwe-select:focus:not(:disabled){border-color:var(--fwe-hero);color:var(--fwe-hero)}.fwe-select-wrapper .fwe-select:focus:not(:disabled) option{color:var(--fwe-text)}.fwe-select-wrapper .fwe-select:focus:invalid{border-color:var(--fwe-red)}.fwe-select-wrapper .fwe-select.fwe-disabled{border-color:var(--fwe-control-disabled)!important;cursor:default}.fwe-select-wrapper .fwe-select.fwe-disabled .fwe-select-content,.fwe-select-wrapper .fwe-select.fwe-disabled~.fwe-select-label{color:var(--fwe-text-disabled)}.fwe-select-wrapper .fwe-select-options-container{background-color:var(--fwe-white);border:1px solid var(--fwe-gray-200);border-radius:4px;box-shadow:0 1px 4px rgba(0,0,0,.161);font-size:var(--fwe-font-size-base);left:0;list-style:none;margin:0;padding:8px;position:absolute;top:56px;width:100%;z-index:500}.fwe-select-wrapper .fwe-select-options-container .fwe-select-option{cursor:pointer;line-height:24px;min-height:24px;padding:12px 8px;position:relative}.fwe-select-wrapper .fwe-select-options-container .fwe-select-option:focus,.fwe-select-wrapper .fwe-select-options-container .fwe-select-option:hover{background-color:var(--fwe-gray-100);outline:none}.fwe-select-wrapper .fwe-select-options-container .fwe-select-option:last-child{border-bottom:none}.fwe-select-wrapper .fwe-select-options-container .fwe-select-option .fwe-select-option-content{display:block;line-height:24px;min-height:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:95%}.fwe-select-wrapper .fwe-select-label:empty~.fwe-select-options-container{top:40px}.fwe-select-wrapper .fwe-select.fwe-invalid.fwe-select:focus,.fwe-select-wrapper .fwe-select.fwe-invalid.fwe-select:hover{border-color:var(--fwe-red)}.fwe-select-wrapper .fwe-select.fwe-invalid~.fwe-select-invalid{display:block}.fwe-select-wrapper .fwe-select.fwe-invalid~.fwe-select-description{display:none}.fwe-select-wrapper .fr-select-scroll{overflow-y:scroll}label.fwe-slider{display:block;height:56px;position:relative}label.fwe-slider.fr-slider-label{height:83px}label.fwe-slider .fr-slider-value{bottom:0;color:var(--fwe-text);font-size:var(--fwe-font-size-base);margin-bottom:0;position:absolute;-webkit-user-select:none;-moz-user-select:none;user-select:none}label.fwe-input-text .fr-textarea{overflow:visible}
+.fr-accordion{background-color:var(--fwe-white)}.fr-accordion,.fr-accordion-header{border-bottom:1px solid var(--fwe-gray-100)}.fr-accordion-header{align-items:center;color:var(--fwe-text);display:flex;font-size:var(--fwe-font-size-md);font-weight:var(--fwe-font-weight-bold);height:48px;padding:0 16px 0 24px}.fr-accordion-item-body{height:0;overflow:hidden;transition:height .3s cubic-bezier(.4,0,.2,1)}.fr-accordion-item-body>:first-child:not(.fr-accordion-item-body-spacer-bottom):not(.fr-accordion){margin-top:0!important;padding-top:0!important}.fr-accordion-item-body>:not(.fr-accordion){margin-right:0}.fr-accordion-item-body-content{margin-right:64px}.fr-accordion-item-body-spacer-bottom{height:0;margin-top:24px;width:0}.fr-accordion-item-body .fr-accordion{margin-bottom:24px;margin-top:64px}.fr-accordion-item-body .fr-accordion-item-link{display:block;top:8px}.fr-accordion-item-body .fr-accordion-item-header{padding-right:32px;padding-top:32px}.fr-accordion-item-body .fr-accordion-item:after{color:var(--fwe-caerul);content:"";font-family:var(--fwe-font-family-icons-16);font-size:var(--fwe-font-size-base);height:16px;line-height:16px;right:4px;top:12px}.fr-accordion-item-body .fr-accordion-item--expanded:before{background-color:transparent}@media(min-width:600px){.fr-accordion-item-body>:not(.fng-accordion){margin-right:64px}.fr-accordion-item-body .fr-accordion-item-header{padding-right:168px;padding-top:24px}.fr-accordion-item-body .fr-accordion-item-link{font-size:var(--fwe-font-size-base);max-width:128px;overflow:hidden;text-overflow:ellipsis;top:24px;white-space:nowrap}.fr-accordion-item-body .fr-accordion-item:after{top:30px}}.fr-accordion-item-header{align-items:center;cursor:pointer;display:flex;min-height:48px;padding:24px 64px 24px 0}.fr-accordion-item{border-bottom:1px solid var(--fwe-gray-100);border-top:1px solid var(--fwe-gray-100);padding:0 16px 0 24px;position:relative}.fr-accordion-item-link{color:var(--fwe-caerul);display:none;font-size:var(--fwe-font-size-md);pointer-events:none;position:absolute;right:24px;top:24px}.fr-accordion-item:before{background-color:var(--fwe-caerul);content:"";display:block;height:0;left:0;position:absolute;top:0;width:4px}.fr-accordion-item:after{content:"";display:block;font-family:var(--fwe-font-family-icons-32);font-size:var(--fwe-font-size-xxl);height:32px;line-height:32px;pointer-events:none;position:absolute;right:16px;top:21px;transition:transform .2s ease}.fr-accordion-item--expanded .fr-accordion-item-header{font-weight:var(--fwe-font-weight-bold)}.fr-accordion-item--expanded .fr-accordion-item-body{height:auto}.fr-accordion-item--expanded:after{transform:rotate(-180deg)}.fr-accordion-item--expanded:before{height:100%}.fr-accordion-item--collapsed .fr-accordion-item-body{height:0}.fr-accordion-item--collapsed .fr-accordion-item-header{font-weight:var(--fwe-font-weight-normal)}.fwe-chip-container .fr-chip .fwe-icon-menu-close{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#333;font-size:var(--fwe-font-size-base);line-height:var(--fwe-font-size-base);margin-left:0;padding-right:0;position:absolute;right:5px;top:3px}.fwe-chip-container .fr-chip .fwe-icon-menu-close:before{font-family:var(--fwe-font-family-icons-32)}.fwe-chip-container .fr-chip.fwe-chip.fwe-selected.fwe-category:after{content:none}.fr-modal{opacity:0}.fr-modal-enter-done{opacity:1;transition:opacity .1s ease-out .3s}.fr-modal-backdrop{opacity:0}.fr-modal-backdrop-enter-done{opacity:1;transition:opacity .3s ease-out}.fr-modal-backdrop-exit,.fr-modal-exit{opacity:1}.fr-modal-backdrop-exit-active,.fr-modal-exit-active{opacity:0;transition:opacity .6s}.fr-modal-overlay-wrapper{align-items:center;display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:var(--fwe-z-index-modal)}@font-face{font-family:swiper-icons;font-style:normal;font-weight:400;src:url("data:application/font-woff;charset=utf-8;base64, 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") format("woff")}.swiper-free-mode>.swiper-wrapper{margin:0 auto;transition-timing-function:ease-out}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{align-items:center;color:var(--swiper-navigation-color,var(--swiper-theme-color));cursor:pointer;display:flex;height:var(--swiper-navigation-size);justify-content:center;margin-top:calc(0px - var(--swiper-navigation-size)/2);position:absolute;top:var(--swiper-navigation-top-offset,50%);width:calc(var(--swiper-navigation-size)/44*27);z-index:10}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{cursor:auto;opacity:.35;pointer-events:none}.swiper-button-next.swiper-button-hidden,.swiper-button-prev.swiper-button-hidden{cursor:auto;opacity:0;pointer-events:none}.swiper-navigation-disabled .swiper-button-next,.swiper-navigation-disabled .swiper-button-prev{display:none!important}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);font-variant:normal;letter-spacing:0;line-height:1;text-transform:none!important}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset,10px);right:auto}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:"prev"}.swiper-button-next,.swiper-rtl .swiper-button-prev{left:auto;right:var(--swiper-navigation-sides-offset,10px)}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:"next"}.swiper-button-lock{display:none}.swiper-zoom-container{align-items:center;display:flex;height:100%;justify-content:center;text-align:center;width:100%}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-height:100%;max-width:100%;-o-object-fit:contain;object-fit:contain}.swiper-slide-zoomed{cursor:move;touch-action:none}@font-face{font-family:swiper-icons;font-style:normal;font-weight:400;src:url("data:application/font-woff;charset=utf-8;base64, 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")}:root{--swiper-theme-color:#007aff}.swiper,swiper-container{display:block;list-style:none;margin-left:auto;margin-right:auto;overflow:hidden;padding:0;position:relative;z-index:1}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{box-sizing:content-box;display:flex;height:100%;position:relative;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);width:100%;z-index:1}.swiper-android .swiper-slide,.swiper-wrapper{transform:translateZ(0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide,swiper-slide{display:block;flex-shrink:0;height:100%;position:relative;transition-property:transform;width:100%}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{backface-visibility:hidden;transform:translateZ(0)}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide,.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{transform-style:preserve-3d}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(270deg,rgba(0,0,0,.5),transparent)}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(90deg,rgba(0,0,0,.5),transparent)}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(0deg,rgba(0,0,0,.5),transparent)}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(180deg,rgba(0,0,0,.5),transparent)}.swiper-css-mode>.swiper-wrapper{-ms-overflow-style:none;overflow:auto;scrollbar-width:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-horizontal.swiper-css-mode>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-vertical.swiper-css-mode>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-centered>.swiper-wrapper:before{content:"";flex-shrink:0;order:9999}.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-centered.swiper-horizontal>.swiper-wrapper:before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-centered.swiper-vertical>.swiper-wrapper:before{height:var(--swiper-centered-offset-after);min-width:1px;width:100%}.swiper-lazy-preloader{border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top:4px solid transparent;box-sizing:border-box;height:42px;left:50%;margin-left:-21px;margin-top:-21px;position:absolute;top:50%;transform-origin:50%;width:42px;z-index:10}.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,swiper-container:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s linear infinite}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.fwe-page-dot:focus{background:var(--fwe-control-border-dark);outline:0}.fwe-popover-menu #tooltip{background:#fff;box-shadow:0 1px 4px rgba(51,51,51,.2)}.fwe-popover-menu #tooltip,.fwe-popover-menu .fwe-popover{font-size:var(--fwe-font-size-base);line-height:1.5rem;padding:16px}.fwe-popover-menu .fwe-list-group .fwe-list-group-item{border-bottom:none;min-height:36px;padding:0}.fwe-popover-menu .fwe-list-group .fwe-list-group-item button{display:inline-flex;height:32px;margin-left:inherit;max-height:32px;padding:0 8px 0 0;text-align:left;width:100%}.fwe-popover-menu .fwe-list-group .fwe-list-group-item button:hover{color:var(--fwe-black)}.fwe-popover-menu .fwe-list-group .fwe-list-group-item button i{align-items:center;display:inline-flex;flex-wrap:nowrap;height:24px;justify-content:center;width:32px}.fwe-popover-menu .fwe-list-group .fwe-list-group-item button i:before{display:inline-flex}.fwe-popover-menu .fwe-list-group .fwe-list-group-item button span{display:inline-flex;height:24px}.fwe-popover-menu .fwe-list-group .fwe-list-group-item button [class*=" fwe-icon-"]{margin-left:inherit}.fwe-popover-menu .fwe-list-group .fwe-list-group-item:hover{background-color:rgba(51,51,51,.102);color:var(--fwe-black)}.fwe-popover-menu .fwe-list-group .fwe-list-group-item:active{background-color:rgba(51,51,51,.2)}#arrow,#arrow:after{height:12px;position:absolute;transform:rotate(45deg);width:12px}#arrow{height:17px;overflow:hidden;width:17px}#arrow:after{background:#fff;box-shadow:0 1px 4px rgba(51,51,51,.2);content:"";z-index:-1}.fwe-popover-container[data-popper-placement^=top]>#arrow{top:100%}.fwe-popover-container[data-popper-placement^=top]>#arrow:after{left:3px;top:-6px}.fwe-popover-container[data-popper-placement^=bottom]>#arrow{top:-17px}.fwe-popover-container[data-popper-placement^=bottom]>#arrow:after{left:3px;top:11px}.fwe-popover-container[data-popper-placement^=left]>#arrow{left:100%}.fwe-popover-container[data-popper-placement^=left]>#arrow:after{left:-6px;top:2px}.fwe-popover-container[data-popper-placement^=right]>#arrow{left:-17px}.fwe-popover-container[data-popper-placement^=right]>#arrow:after{left:11px;top:2px}.fr-tooltip-container{width:-moz-fit-content;width:fit-content}.fwe-w-100{width:100%}.fwe-search-suggestion{height:40px}.fr-snackbar-wrapper{height:48px;margin-bottom:24px;opacity:1;opacity:0}.fr-snackbar-wrapper-enter-done{opacity:1;transition:opacity .6s ease-out}.fr-snackbar-wrapper-exit{opacity:1}.fr-snackbar-wrapper-exit-active{height:0;margin-bottom:0;opacity:0;transition:height .3s ease-out .3s,opacity .3s ease-out,margin-bottom .3s ease-out .3s}.fr-snackbar-wrapper--first{height:48px;margin-bottom:24px;opacity:1;transform:translateY(100px)}.fr-snackbar-wrapper--first-enter-done{opacity:1;transition:opacity .6s ease-out}.fr-snackbar-wrapper--first-exit{opacity:1}.fr-snackbar-wrapper--first-exit-active{height:0;margin-bottom:0;opacity:0;transition:height .3s ease-out .3s,opacity .3s ease-out,margin-bottom .3s ease-out .3s}.fr-snackbar-wrapper--first-enter-done{transform:translateY(0);transition:transform .6s ease-out}.fr-snackbar-wrapper--first-exit-active{transform:translateY(0)}.overflow-hidden{overflow:hidden}@keyframes stepperAnimation{0%{transform:translateX(100%)}to{transform:translateX(0)}}.fr-moving-container{animation-duration:.3s;animation-name:stepperAnimation;animation-timing-function:ease}.hidden{display:none}.fwe-stepper-vertical .fwe-step-container.fwe-step-active .fwe-step-content-container{height:20px}.fr-show{display:block}.fr-hide{display:none}.fwe-legacy-tabs{height:100%;margin:48px 0;width:100%}.fwe-legacy-tab-bar{display:flex;flex-wrap:nowrap;font-size:var(--fwe-font-size-base);list-style:none;margin-bottom:0;margin-top:0;padding-left:0;width:75%}.fwe-legacy-tab-bar.fwe-legacy-tab-bar-full-width{width:100%}.fwe-legacy-tab-bar.fwe-legacy-tab-items-fill .fwe-legacy-tab-item{flex:1 1 auto}.fwe-legacy-tab-bar.fwe-legacy-tab-items-equal-width .fwe-legacy-tab-item{flex:1 1 0}.fwe-legacy-tab-item{background-color:var(--fwe-gray-300);border-right:2px solid var(--fwe-gray-100);height:48px;max-height:48px;text-align:center}.fwe-legacy-tab-item:last-child{border-right:none}.fwe-legacy-tab-item.fwe-active{background-color:var(--fwe-white)}.fwe-legacy-tab-item.fwe-active .fwe-legacy-tab-link{color:var(--fwe-caerul)}.fwe-legacy-tab-item:not(.fwe-active){border-bottom:2px solid var(--fwe-gray-100)}.fwe-legacy-tab-item:not(.fwe-active) .fwe-legacy-tab-link{padding:11px 16px}.fwe-legacy-tab-link{color:var(--fwe-black);cursor:pointer;display:inline-block;height:48px;line-height:24px;padding:11px 16px 13px;white-space:nowrap;width:100%}.fwe-legacy-tab-link i.fwe-icon{padding-right:8px;vertical-align:initial}.fwe-legacy-tab-link i.fwe-icon.fwe-icon-lg{position:relative;top:3px}.fwe-legacy-tab-link:hover{color:var(--fwe-caerul)}.fwe-legacy-tab-link:active{background-color:var(--fwe-white);color:var(--fwe-caerul)}.fwe-legacy-tab-panel-content{background-color:var(--fwe-white);height:100%;overflow:auto;padding:48px 24px}@media(max-width:375px){.fwe-legacy-tab-bar{background-color:var(--fwe-white);justify-content:space-between;width:100%}.fwe-legacy-tab-item{background-color:var(--fwe-white);border-right:2px solid var(--fwe-white)}.fwe-legacy-tab-item:not(.fwe-active){border-bottom:2px solid var(--fwe-white)}.fwe-legacy-tab-item:not(.fwe-active) .fwe-legacy-tab-link,.fwe-legacy-tab-item:not(.fwe-active) .fwe-legacy-tab-link i.fwe-icon{color:var(--fwe-icon-gray)}.fwe-legacy-tab-link.fwe-can-swap-icon{direction:rtl}.fwe-legacy-tab-link.fwe-can-swap-icon i.fwe-icon{padding-left:8px;padding-right:0}}.fr-tab-panel-content{background-color:var(--fwe-white);height:100%;overflow:auto;padding:48px 24px}.fr-tab-bar{width:100%}.fr-tab-scroller{overflow-y:hidden}.fr-tab-scroller-scroll-area{display:flex;overflow-x:hidden;position:relative}.fr-tab-scroller-scroll-area::-webkit-scrollbar{display:none}.fr-tab-scroller-scroll-area--scroll{overflow-x:scroll}.fr-tab-scroller-scroll-content{display:flex;flex:1 0 auto;padding:0 17px 0 16px;position:relative;transform:none;will-change:transform}.fr-tab-scroller-scroll-content--with-divider .fr-tab-scroller-divider-line{display:block}.fr-tab-scroller--animating .fr-tab-scroller-scroll-content{transition:transform .25s cubic-bezier(.4,0,.2,1)}.fr-tab-scroller-divider-line{border-bottom:1px solid var(--fwe-control);bottom:0;display:none;left:0;position:absolute;right:0;top:0}.fr-tab-indicator{display:flex;height:100%;justify-content:center;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:1}.fr-tab-indicator-content{opacity:0;transform-origin:left}.fr-tab-indicator-content--underline{align-self:flex-end;border-top-style:solid;box-sizing:border-box;width:100%}.fr-tab-indicator .fr-tab-indicator-content{transition:transform .25s cubic-bezier(.4,0,.2,1)}.fr-tab-indicator .fr-tab-indicator-content--underline{border-top:4px solid var(--fwe-caerul)}.fr-tab-indicator--active .fr-tab-indicator-content{opacity:1}.fr-tab{-webkit-appearance:none;background:none;border:none;cursor:pointer;display:flex;flex:1 0 auto;height:36px;justify-content:center;margin:0;outline:none;padding:0;position:relative;text-align:center;white-space:nowrap;z-index:1}.fr-tab:not(:last-child){margin-right:32px}.fr-tab::-moz-focus-inner{border:0;padding:0}.fr-tab .fr-tab-text-label{color:var(--fwe-text)}.fr-tab--active .fr-tab-text-label{color:var(--fwe-caerul)}.fr-tab-content{align-items:flex-start;display:flex;height:inherit;justify-content:center;pointer-events:none;position:relative}.fr-tab-text-label{display:inline-block;z-index:2}.fr-tab-scroller-scroll-area:not(.fr-tab-scroller-scroll-area--compact) .fr-tab{flex:none}.fr-tab-scroller-scroll-area:not(.fr-tab-scroller-scroll-area--compact) .fr-tab:not(:last-child){margin-right:64px}.fr-tab-scroller-scroll-area:not(.fr-tab-scroller-scroll-area--compact) .fr-tab-scroller-scroll-content{padding:0 32px}.fr-tab-scroller-scroll-area:not(.fr-tab-scroller-scroll-area--compact) .fr-tab-scroller-divider-line{padding-right:64px}.fwe-checkbox-container{align-items:center;cursor:pointer;display:flex;flex-direction:row;font-family:var(--fwe-font-family-sans-serif);-webkit-user-select:none;-moz-user-select:none;user-select:none}.fwe-checkbox-container.fwe-label-below{flex-direction:column}.fwe-checkbox-container.fwe-label-below .fwe-checkbox-title{margin:8px 0 0}.fwe-checkbox-container.fwe-label-before{flex-direction:row-reverse;justify-content:flex-end}.fwe-checkbox-container.fwe-label-before .fwe-checkbox-title{margin:0 8px 0 0}.fwe-checkbox-container .fwe-checkbox-indicator-container{position:relative}.fwe-checkbox-container input{cursor:pointer;height:0;opacity:0;width:0}.fwe-checkbox-container .fwe-checkbox-title{color:var(--fwe-text);line-height:24px;margin-left:8px;-webkit-user-select:none;-moz-user-select:none;user-select:none}.fwe-checkbox-container .fwe-checkbox-indicator-background{background:var(--fwe-white);border:1px solid var(--fwe-text-light);border-radius:2px;box-sizing:border-box;height:16px;transition:border-width .2s ease-out;width:16px}.fwe-checkbox-container .fwe-indeterminate-indicator{background:#fff;height:2px;left:3px;position:absolute;top:7px;width:10px}.fwe-checkbox-container svg{display:block;left:0;position:absolute;top:0}.fwe-checkbox-container.fr-checkbox-large .fwe-checkbox-indicator-background{border-radius:4px;height:24px;width:24px}.fwe-checkbox-container.fr-checkbox-large .fwe-indeterminate-indicator{left:5px;top:11px;width:14px}.fwe-checkbox-container.fr-checkbox-large.fr-checkbox-indeterminate .fwe-checkbox-indicator-background,.fwe-checkbox-container.fr-checkbox-large.fwe-checked .fwe-checkbox-indicator-background{border:12px solid var(--fwe-hero)}.fwe-checkbox-container:hover .fwe-checkbox-indicator-background{background-color:var(--fwe-control)}.fwe-checkbox-container:active .fwe-checkbox-indicator-background{background-color:var(--fwe-control-dark)}.fwe-checkbox-container.fr-checkbox-indeterminate .fwe-checkbox-indicator-background,.fwe-checkbox-container.fwe-checked .fwe-checkbox-indicator-background{border:8px solid var(--fwe-hero)}.fwe-checkbox-container.fr-checkbox-indeterminate:hover .fwe-checkbox-indicator-background,.fwe-checkbox-container.fwe-checked:hover .fwe-checkbox-indicator-background{border-color:var(--fwe-hero-dark)}.fwe-checkbox-container.fr-checkbox-indeterminate:active .fwe-checkbox-indicator-background,.fwe-checkbox-container.fwe-checked:active .fwe-checkbox-indicator-background{border-color:var(--fwe-hero-darker)}.fwe-checkbox-container.fr-checkbox-invalid .fwe-checkbox-indicator-background{background:var(--fwe-white);border:1px solid var(--fwe-red)}.fwe-checkbox-container.fwe-disabled{cursor:default}.fwe-checkbox-container.fwe-disabled .fwe-checkbox-indicator-background{background-color:var(--fwe-white);border:1px solid var(--fwe-control)}.fwe-checkbox-container.fwe-disabled.fr-checkbox-indeterminate .fwe-checkbox-indicator-background,.fwe-checkbox-container.fwe-disabled.fwe-checked .fwe-checkbox-indicator-background{background-color:var(--fwe-control);border:1px solid var(--fwe-control)}.fwe-checkbox-container.fwe-disabled.fr-checkbox-invalid .fwe-checkbox-indicator-background{background-color:var(--fwe-white);border:1px solid var(--fwe-control)}.fwe-checkbox-container.fwe-disabled .fwe-checkbox-title{color:var(--fwe-text-disabled)}.fwe-color-indicator .fwe-popover-container{position:relative}.fwe-color-indicator .fwe-popover-container .fwe-popover{background-color:var(--fwe-white);border-radius:4px;box-shadow:0 1px 4px rgba(51,51,51,.2);font-size:var(--fwe-font-size-md);line-height:1rem;padding:8px 16px 16px}.fwe-color-indicator .fwe-backdrop{background:transparent}.fwe-color-indicator .fwe-color-label{font-size:var(--fwe-font-size-small);font-weight:var(--fwe-font-weight-bold);height:18px;margin-bottom:4px}.fwe-color-indicator .fwe-color-container{display:flex}.fwe-color-indicator .fwe-color-container .fwe-color-box{background:var(--fwe-white);border:1px solid var(--fwe-control-border);border-radius:4px;height:24px;width:24px}.fwe-color-indicator .fwe-color-container .fwe-color-box .fwe-no-color-pattern{margin:2px}.fwe-color-indicator .fwe-color-container .fwe-color-indicator-text{margin-left:8px}.fwe-color-indicator.disabled{pointer-events:none}.fwe-color-indicator.disabled .fwe-color-label{color:var(--fwe-text-disabled)}.fwe-color-indicator.disabled .fwe-color-container .fwe-color-box{opacity:.5}.fwe-color-indicator.disabled .fwe-color-container .fwe-color-indicator-text{color:var(--fwe-text-disabled)}.fwe-triangle.fwe-triangle-bottom,.fwe-triangle.fwe-triangle-left,.fwe-triangle.fwe-triangle-right,.fwe-triangle.fwe-triangle-top{height:17px;overflow:hidden;position:absolute;width:17px}.fwe-triangle.fwe-triangle-bottom:after,.fwe-triangle.fwe-triangle-left:after,.fwe-triangle.fwe-triangle-right:after,.fwe-triangle.fwe-triangle-top:after{background:var(--fwe-white);box-shadow:0 1px 4px rgba(51,51,51,.2);content:"";height:12px;position:absolute;transform:rotate(45deg);width:12px}.fwe-popover,.fwe-popover.fwe-popover-menu{background-color:var(--fwe-white);border-radius:4px;box-shadow:0 1px 4px rgba(51,51,51,.2)}.fwe-popover{font-size:var(--fwe-font-size-md);line-height:1rem;padding:8px}.fwe-popover-container{display:inline-block;position:relative}.fwe-triangle.fwe-triangle-top{left:50%;top:-17px;transform:translateX(-8px)}.fwe-triangle.fwe-triangle-top:after{left:3px;top:11px}.fwe-triangle.fwe-triangle-bottom{left:50%;top:100%;transform:translateX(-8px)}.fwe-triangle.fwe-triangle-bottom:after{left:3px;top:-6px}.fwe-triangle.fwe-triangle-left{left:-17px;top:50%;transform:translateY(-8px)}.fwe-triangle.fwe-triangle-left:after{left:11px;top:2px}.fwe-triangle.fwe-triangle-right{left:100%;top:50%;transform:translateY(-8px)}.fwe-triangle.fwe-triangle-right:after{left:-6px;top:2px}.fwe-popover.fwe-popover-menu{font-size:var(--fwe-font-size-base);line-height:1.5rem;padding:16px}.fwe-popover.fwe-popover-menu .fwe-list-group .fwe-list-group-item{border-bottom:none;min-height:36px;padding:0}.fwe-popover.fwe-popover-menu .fwe-list-group .fwe-list-group-item button{display:inline-flex;height:32px;justify-content:unset;margin-left:inherit;max-height:32px;padding:0 8px 0 0;text-align:left;width:100%}.fwe-popover.fwe-popover-menu .fwe-list-group .fwe-list-group-item button:hover{color:var(--fwe-black)}.fwe-popover.fwe-popover-menu .fwe-list-group .fwe-list-group-item button i{align-items:center;display:inline-flex;flex-wrap:nowrap;height:24px;justify-content:center;width:32px}.fwe-popover.fwe-popover-menu .fwe-list-group .fwe-list-group-item button i:before{display:inline-flex}.fwe-popover.fwe-popover-menu .fwe-list-group .fwe-list-group-item button span{display:inline-flex;height:24px}.fwe-popover.fwe-popover-menu .fwe-list-group .fwe-list-group-item button [class*=" fwe-icon-"]{margin-left:inherit}.fwe-popover.fwe-popover-menu .fwe-list-group .fwe-list-group-item:hover{background-color:rgba(51,51,51,.102);color:var(--fwe-black)}.fwe-popover.fwe-popover-menu .fwe-list-group .fwe-list-group-item:active{background-color:rgba(51,51,51,.2)}.fwe-popover .fwe-popover-legend{display:table;line-height:24px;margin:16px}.fwe-popover .fwe-popover-legend .fwe-popover-legend-content{display:table-row}.fwe-popover .fwe-popover-legend .fwe-popover-legend-content dt{display:table-cell;margin:0;padding-right:8px}.fwe-popover .fwe-popover-legend .fwe-popover-legend-content dd{display:table-cell;margin:0}.fwe-color-picker{width:216px}.fwe-color-picker.fwe-alpha-active{width:245px}.fwe-color-picker .fwe-gradient-picker{height:198px;margin:-7px;position:relative;width:198px}.fwe-color-picker .fwe-gradient-picker .fwe-brightness-gradient{background-image:linear-gradient(transparent,#000);bottom:7px;left:7px;position:absolute;right:7px;top:7px}.fwe-color-picker .fwe-gradient-picker .fwe-saturation-gradient{bottom:7px;left:7px;position:absolute;right:7px;top:7px}.fwe-color-picker .fwe-alpha-picker,.fwe-color-picker .fwe-hue-picker,.fwe-color-picker .fwe-vertical-picker{height:198px;margin:-7px -3px -7px 18px;position:relative;width:14px}.fwe-color-picker .fwe-alpha-picker .fwe-picker-background,.fwe-color-picker .fwe-hue-picker .fwe-picker-background,.fwe-color-picker .fwe-vertical-picker .fwe-picker-background{border-radius:4px;height:184px;margin:7px 3px;width:8px}.fwe-color-picker .fwe-alpha-picker .fwe-knob,.fwe-color-picker .fwe-hue-picker .fwe-knob,.fwe-color-picker .fwe-vertical-picker .fwe-knob{left:-3px}.fwe-color-picker .fwe-hue-picker .fwe-picker-background{background-image:linear-gradient(red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.fwe-color-picker .fwe-alpha-picker .fwe-no-color-pattern{margin:7px 3px;position:absolute}.fwe-color-picker .fwe-alpha-picker .fwe-picker-background{position:absolute}.fwe-color-picker .fwe-type-select{display:flex;position:relative}.fwe-color-picker .fwe-type-select .fwe-type-indicator{cursor:pointer;display:flex;flex-shrink:1}.fwe-color-picker .fwe-type-select .fwe-type-indicator .fwe-input-type{font-size:var(--fwe-font-size-small);font-weight:var(--fwe-font-weight-bold);line-height:calc(var(--fwe-font-size-small) + 5px)}.fwe-color-picker .fwe-type-select .fwe-type-indicator:hover{color:var(--fwe-hero)}.fwe-color-picker .fwe-type-select .fwe-icon-arrows-collapse{line-height:16px;margin-left:16px}.fwe-color-picker .fwe-type-select .fwe-popover{left:0;position:absolute;top:24px;z-index:1}.fwe-color-picker .fwe-type-select .fwe-popover .fwe-type-item{cursor:pointer;display:flex;padding:8px}.fwe-color-picker .fwe-type-select .fwe-popover .fwe-type-item:hover{color:var(--fwe-hero)}.fwe-color-picker .fwe-type-select .fwe-popover .fwe-type-item .fwe-icon-menu-check{margin-right:8px;opacity:0}.fwe-color-picker .fwe-type-select .fwe-popover .fwe-type-item.fwe-selected{cursor:default}.fwe-color-picker .fwe-type-select .fwe-popover .fwe-type-item.fwe-selected .fwe-icon-menu-check{opacity:1}.fwe-color-picker input::-webkit-inner-spin-button,.fwe-color-picker input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.fwe-color-picker input[type=number]{-moz-appearance:textfield}.fwe-color-picker input{padding-right:0!important;text-align:center}.fwe-color-picker .fwe-hex-input{margin-right:16px;width:75px}.fwe-color-picker .fwe-green-input,.fwe-color-picker .fwe-red-input{margin-right:8px;width:32px}.fwe-color-picker .fwe-blue-input{width:32px}.fwe-color-picker .fwe-alpha-input span input{padding-right:16px!important;width:48px}.fwe-color-picker .fwe-alpha-input .fwe-percent-char{margin-left:-16px}.fwe-color-picker .fwe-color-grid{display:flex;flex-wrap:wrap;margin-bottom:-8px;margin-right:-8px}.fwe-color-picker .fwe-color-grid .fwe-color-item{align-items:center;border-radius:4px;color:#fff;display:flex;height:24px;justify-content:center;margin-bottom:8px;margin-right:8px;width:24px}.fwe-color-picker .fwe-color-grid .fwe-color-item.fwe-white-item{border:1px solid var(--fwe-control-border);color:#000}.fwe-color-picker .fwe-color-grid .fwe-remove-color-button{align-items:center;border:1px solid var(--fwe-control-border);border-radius:4px;color:var(--fwe-control);display:flex;height:24px;justify-content:center;margin-bottom:8px;margin-right:8px;width:24px}.fwe-color-picker .fwe-color-grid .fwe-remove-color-button .fwe-no-color-pattern{margin:2px}.fwe-color-picker .fwe-color-grid .fwe-remove-color-button i{color:transparent;position:absolute}.fwe-color-picker .fwe-knob{border:2px solid #fff;border-radius:50%;box-shadow:0 0 4px 0 rgba(0,0,0,.15);height:14px;position:absolute;width:14px;z-index:1}.flatpickr-calendar{margin-top:6px}.flatpickr-calendar:not(.open){display:none}.fwe-border-hero{border-color:var(--fwe-hero)!important}.fr-date-range-picker:hover input{color:var(--fwe-hero)}.fr-date-range-picker-inputs{display:flex;order:2}.fwe-select-wrapper{min-width:48px;width:100%}.fwe-select-wrapper .fr-select-input{bottom:0;box-sizing:border-box;left:0;opacity:0;pointer-events:none;position:absolute;width:100%}.fwe-select-wrapper.fwe-disabled:before{color:var(--fwe-text-disabled)}.fwe-select-wrapper .fwe-select{cursor:pointer}.fwe-select-wrapper .fwe-select .fwe-select-content{line-height:1.5rem;overflow:hidden;padding-right:24px;text-overflow:ellipsis;white-space:nowrap}.fwe-select-wrapper .fwe-select.fwe-required:not(.fwe-disabled)~.fwe-select-label:after{content:"*";display:inline-block;left:3px;position:relative}.fwe-select-wrapper .fwe-select.fwe-required:not(.fwe-disabled):not(.fwe-invalid)~.fwe-select-valid{display:block}.fwe-select-wrapper .fwe-select:focus:not(:disabled){border-color:var(--fwe-hero);color:var(--fwe-hero)}.fwe-select-wrapper .fwe-select:focus:not(:disabled) option{color:var(--fwe-text)}.fwe-select-wrapper .fwe-select:focus:invalid{border-color:var(--fwe-red)}.fwe-select-wrapper .fwe-select.fwe-disabled{border-color:var(--fwe-control-disabled)!important;cursor:default}.fwe-select-wrapper .fwe-select.fwe-disabled .fwe-select-content,.fwe-select-wrapper .fwe-select.fwe-disabled~.fwe-select-label{color:var(--fwe-text-disabled)}.fwe-select-wrapper .fwe-select-options-container{background-color:var(--fwe-white);border:1px solid var(--fwe-gray-200);border-radius:4px;box-shadow:0 1px 4px rgba(0,0,0,.161);font-size:var(--fwe-font-size-base);left:0;list-style:none;margin:0;padding:8px;position:absolute;top:56px;width:100%;z-index:500}.fwe-select-wrapper .fwe-select-options-container .fwe-select-option{cursor:pointer;line-height:24px;min-height:24px;padding:12px 8px;position:relative}.fwe-select-wrapper .fwe-select-options-container .fwe-select-option:focus,.fwe-select-wrapper .fwe-select-options-container .fwe-select-option:hover{background-color:var(--fwe-gray-100);outline:none}.fwe-select-wrapper .fwe-select-options-container .fwe-select-option:last-child{border-bottom:none}.fwe-select-wrapper .fwe-select-options-container .fwe-select-option .fwe-select-option-content{display:block;line-height:24px;min-height:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:95%}.fwe-select-wrapper .fwe-select-label:empty~.fwe-select-options-container{top:40px}.fwe-select-wrapper .fwe-select.fwe-invalid.fwe-select:focus,.fwe-select-wrapper .fwe-select.fwe-invalid.fwe-select:hover{border-color:var(--fwe-red)}.fwe-select-wrapper .fwe-select.fwe-invalid~.fwe-select-invalid{display:block}.fwe-select-wrapper .fwe-select.fwe-invalid~.fwe-select-description{display:none}.fwe-select-wrapper .fr-select-scroll{overflow-y:scroll}label.fwe-slider{display:block;height:56px;position:relative}label.fwe-slider.fr-slider-label{height:83px}label.fwe-slider .fr-slider-value{bottom:0;color:var(--fwe-text);font-size:var(--fwe-font-size-base);margin-bottom:0;position:absolute;-webkit-user-select:none;-moz-user-select:none;user-select:none}label.fwe-input-text .fr-textarea{overflow:visible}
 /*!
  * Quill Editor v1.3.7
  * https://quilljs.com/

package/lib/components/buttons/button/Button.d.ts

@@ -1,12 +1,10 @@
-import React from 'react';
-import { ClassNamePropsWithChildren } from '../../../helper/types';
-interface ButtonProps extends ClassNamePropsWithChildren {
+import { ComponentPropsWithoutRef } from 'react';
+interface ButtonProps extends ComponentPropsWithoutRef<'button'> {
     icon?: string;
     disabled?: boolean;
     primary?: boolean;
     iconOnly?: boolean;
     large?: boolean;
-    onClick: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
 }
-declare function Button({ icon, disabled, iconOnly, large, onClick, primary, className, children, }: ButtonProps): JSX.Element;
+declare const Button: (props: ButtonProps & import("react").RefAttributes<HTMLButtonElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
 export default Button;

package/lib/components/buttons/button/Button.js

@@ -1,8 +1,8 @@
 import classNames from 'classnames';
-import React from 'react';
+import { forwardRef } from 'react';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-function Button(_ref) {
+const Button = /*#__PURE__*/forwardRef((_ref, ref) => {
   let {
     icon,
     disabled = false,
@@ -11,7 +11,8 @@ function Button(_ref) {
     onClick,
     primary = false,
     className,
-    children
+    children,
+    ...props
   } = _ref;
   const classes = classNames('fwe-btn', 'fr-button', {
     'fwe-btn-icon': iconOnly
@@ -27,11 +28,13 @@ function Button(_ref) {
     onClick: onClick,
     className: classes,
     disabled: disabled,
+    ref: ref,
+    ...props,
     children: [icon && /*#__PURE__*/_jsx("i", {
       className: `fwe-icon fwe-icon-${icon}`
     }), !iconOnly && /*#__PURE__*/_jsx("div", {
       children: children
     })]
   });
-}
+});
 export default Button;

package/lib/components/link-button/LinkButton.d.ts

@@ -1,10 +1,9 @@
-/// <reference types="react" />
-import { ClassNamePropsWithChildren } from '../../helper/types';
-interface LinkButtonProps extends ClassNamePropsWithChildren {
+import { ComponentPropsWithoutRef } from 'react';
+interface LinkButtonProps extends ComponentPropsWithoutRef<'button'> {
     disabled?: boolean;
-    icon?: string;
+    icon?: React.ReactNode;
     onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
     iconOnly?: boolean;
 }
-declare function LinkButton({ icon, onClick, disabled, children, iconOnly, className, }: LinkButtonProps): JSX.Element;
+declare const LinkButton: (props: LinkButtonProps & import("react").RefAttributes<HTMLButtonElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
 export default LinkButton;

package/lib/components/link-button/LinkButton.js

@@ -1,26 +1,38 @@
 import classNames from 'classnames';
+import { forwardRef } from 'react';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-function LinkButton(_ref) {
+const LinkButton = /*#__PURE__*/forwardRef((_ref, ref) => {
   let {
     icon,
     onClick,
     disabled = false,
     children,
     iconOnly = false,
-    className
+    className,
+    ...props
   } = _ref;
   const classes = classNames('fwe-btn', 'fwe-btn-link', {
     'fwe-disabled': disabled
   }, className);
+  let innerIcon;
+  if (icon) {
+    if (typeof icon === 'string') {
+      innerIcon = /*#__PURE__*/_jsx("i", {
+        className: `fwe-icon fwe-icon-${icon}`
+      });
+    } else {
+      innerIcon = icon;
+    }
+  }
   return /*#__PURE__*/_jsxs("button", {
     onClick: onClick,
     type: "button",
     className: classes,
     disabled: disabled,
-    children: [/*#__PURE__*/_jsx("i", {
-      className: `fwe-icon fwe-icon-${icon}`
-    }), !iconOnly && children]
+    ref: ref,
+    ...props,
+    children: [innerIcon, !iconOnly && children]
   });
-}
+});
 export default LinkButton;

package/lib/components/modals/ModalBase.js

@@ -2,6 +2,7 @@ import classNames from 'classnames';
 import { forwardRef, useEffect, useRef } from 'react';
 import ReactDOM from 'react-dom';
 import { CSSTransition } from 'react-transition-group';
+import { RemoveScroll } from 'react-remove-scroll';
 import useForkRef from '../../helper/useForkRef';
 import useOnClickOutside from '../../helper/useOnClickOutside';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -54,10 +55,13 @@ const ModalBase = /*#__PURE__*/forwardRef((_ref, ref) => {
           exit: 600
         },
         component: null,
-        children: /*#__PURE__*/_jsx("div", {
-          ref: allRefs,
-          className: classNames('fr-modal fwe-modal', className),
-          children: children
+        children: /*#__PURE__*/_jsx(RemoveScroll, {
+          className: "fr-modal-overlay-wrapper",
+          children: /*#__PURE__*/_jsx("div", {
+            ref: allRefs,
+            className: classNames('fr-modal fwe-modal', className),
+            children: children
+          })
         })
       })]
     }), container.body)

package/lib/forms/time-picker/TimePicker.js

@@ -1,10 +1,9 @@
 import cn from 'classnames';
-import React, { forwardRef, useCallback, useMemo, useRef, useState, useEffect } from 'react';
+import React, { forwardRef, useMemo, useRef, useState, useEffect } from 'react';
 import ReactDOM from 'react-dom';
 import { usePopper } from 'react-popper';
 import useForkRef from '../../helper/useForkRef';
 import useId from '../../helper/useId';
-import useOnClickOutside from '../../helper/useOnClickOutside';
 import TimePickerDropdown from './time-picker-dropdown/TimePickerDropdown';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -61,10 +60,6 @@ export const TimePicker = /*#__PURE__*/forwardRef((_ref, ref) => {
   const timePickerRef = useRef(null);
   const combinedTimePickerRef = useForkRef(timePickerRef, r => setPopperElement(r));
   const [open, setOpen] = useState(false);
-  const closeDropdown = useCallback(() => {
-    setOpen(false);
-  }, []);
-  useOnClickOutside(labelRef, closeDropdown, timePickerRef);
   const controlled = value !== undefined;
   const initialValue = controlled ? value : defaultValue;
   const [innerValue, setInnerValue] = useState(initialValue ?? new Date());
@@ -144,6 +139,7 @@ export const TimePicker = /*#__PURE__*/forwardRef((_ref, ref) => {
         })]
       })
     }), open && /*#__PURE__*/ReactDOM.createPortal( /*#__PURE__*/_jsx(TimePickerDropdown, {
+      labelRef: labelRef,
       ref: combinedTimePickerRef,
       onClose: handleClose,
       onDateChange: handleDateChange,

package/lib/forms/time-picker/time-picker-dropdown/TimePickerDropdown.d.ts

@@ -1,5 +1,5 @@
 import './TimePickerDropdown.scss';
-import React from 'react';
+import React, { RefObject } from 'react';
 interface TimePickerDropdownProps {
     timeFormat: '12' | '24';
     date: Date;
@@ -7,6 +7,7 @@ interface TimePickerDropdownProps {
     showSeconds?: boolean;
     onClose: (date?: Date) => void;
     style?: React.CSSProperties;
+    labelRef: RefObject<HTMLDivElement>;
 }
 declare const TimePickerDropdown: (props: TimePickerDropdownProps & React.RefAttributes<HTMLDivElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
 export default TimePickerDropdown;

package/lib/forms/time-picker/time-picker-dropdown/TimePickerDropdown.js

@@ -1,6 +1,9 @@
 import cn from 'classnames';
 import React, { forwardRef, useEffect, useRef, useState } from 'react';
 import useForkRef from '../../../helper/useForkRef';
+import LinkButton from '../../../components/link-button/LinkButton';
+import TimePickerInput from './TimePickerInput';
+import useOnClickOutside from '../../../helper/useOnClickOutside';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const TimePickerDropdown = /*#__PURE__*/forwardRef((_ref, ref) => {
@@ -10,7 +13,8 @@ const TimePickerDropdown = /*#__PURE__*/forwardRef((_ref, ref) => {
     onDateChange,
     showSeconds,
     onClose,
-    style
+    style,
+    labelRef
   } = _ref;
   const innerRef = useRef(null);
   const combinedRef = useForkRef(ref, innerRef);
@@ -19,6 +23,7 @@ const TimePickerDropdown = /*#__PURE__*/forwardRef((_ref, ref) => {
   const [tmpMinutes, setTmpMinutes] = useState(null);
   const [tmpSeconds, setTmpSeconds] = useState(null);
   const [innerDate, setInnerDate] = useState(date);
+  useOnClickOutside(labelRef, () => onClose(innerDate), innerRef);
   const min = 0;
   const hourMax = timeFormat === '12' ? 12 : 23;
   const minutesSecondsMax = 59;
@@ -32,16 +37,9 @@ const TimePickerDropdown = /*#__PURE__*/forwardRef((_ref, ref) => {
       onClose(e.key === 'Enter' ? innerDate : undefined);
     }
   }
-  function handleHourUp() {
+  function handleHourIncrement(increment) {
     const newDate = new Date(innerDate);
-    newDate.setHours(innerDate.getHours() + 1);
-    setInnerDate(newDate);
-    onDateChange(newDate);
-    setTmpHours(null);
-  }
-  function handleHourDown() {
-    const newDate = new Date(innerDate);
-    newDate.setHours(innerDate.getHours() - 1);
+    newDate.setHours(innerDate.getHours() + increment);
     setInnerDate(newDate);
     onDateChange(newDate);
     setTmpHours(null);
@@ -53,16 +51,9 @@ const TimePickerDropdown = /*#__PURE__*/forwardRef((_ref, ref) => {
     setInnerDate(newDate);
     setTmpHours(e.target.value);
   }
-  function handleMinuteUp() {
-    const newDate = new Date(innerDate);
-    newDate.setMinutes(innerDate.getMinutes() + 1);
-    setInnerDate(newDate);
-    onDateChange(newDate);
-    setTmpMinutes(null);
-  }
-  function handleMinuteDown() {
+  function handleMinuteIncrement(increment) {
     const newDate = new Date(innerDate);
-    newDate.setMinutes(innerDate.getMinutes() - 1);
+    newDate.setMinutes(innerDate.getMinutes() + increment);
     setInnerDate(newDate);
     onDateChange(newDate);
     setTmpMinutes(null);
@@ -74,16 +65,9 @@ const TimePickerDropdown = /*#__PURE__*/forwardRef((_ref, ref) => {
     setInnerDate(newDate);
     setTmpMinutes(e.target.value);
   }
-  function handleSecondUp() {
+  function handleSecondIncrement(increment) {
     const newDate = new Date(innerDate);
-    newDate.setSeconds(innerDate.getSeconds() + 1);
-    setInnerDate(newDate);
-    onDateChange(newDate);
-    setTmpSeconds(null);
-  }
-  function handleSecondDown() {
-    const newDate = new Date(innerDate);
-    newDate.setSeconds(innerDate.getSeconds() - 1);
+    newDate.setSeconds(innerDate.getSeconds() + increment);
     setInnerDate(newDate);
     onDateChange(newDate);
     setTmpSeconds(null);
@@ -96,6 +80,21 @@ const TimePickerDropdown = /*#__PURE__*/forwardRef((_ref, ref) => {
     setTmpSeconds(e.target.value);
   }
   const hours = timeFormat === '12' ? (innerDate.getHours() + 11) % 12 + 1 : innerDate.getHours();
+  function toggleAmPm() {
+    const newDate = new Date(innerDate);
+    // Get the current hour in 24-hour format
+    const currentHours = innerDate.getHours();
+    if (currentHours >= 0 && currentHours < 12) {
+      // Switching from AM to PM
+      newDate.setHours(currentHours + 12);
+    } else {
+      // Switching from PM to AM
+      newDate.setHours(currentHours - 12);
+    }
+    setInnerDate(newDate);
+    onDateChange(newDate);
+  }
+  const formatNumberWithLeadingZero = number => (number < 10 ? '0' : '') + number;
   return (
     /*#__PURE__*/
     // should not be an issue with dialog
@@ -113,98 +112,85 @@ const TimePickerDropdown = /*#__PURE__*/forwardRef((_ref, ref) => {
         className: "fwe-timepicker-spinners",
         children: [/*#__PURE__*/_jsxs("div", {
           className: "fwe-timepicker-spinners-hours",
-          children: [/*#__PURE__*/_jsx("button", {
-            type: "button",
+          children: [/*#__PURE__*/_jsx(LinkButton, {
             "aria-label": "hour up",
-            className: "fwe-btn fwe-btn-link fwe-dark",
-            onClick: () => handleHourUp(),
-            children: /*#__PURE__*/_jsx("i", {
+            className: "fwe-dark",
+            onClick: () => handleHourIncrement(1),
+            icon: /*#__PURE__*/_jsx("i", {
               "aria-hidden": true,
               className: "fwe-icon fwe-icon-arrows-expand"
             })
-          }), /*#__PURE__*/_jsx("input", {
+          }), /*#__PURE__*/_jsx(TimePickerInput, {
             "aria-label": "hours value",
-            className: "fwe-timepicker-hide-spinners",
-            type: "number",
             min: min,
-            step: 1,
-            value: tmpHours ?? (hours < 10 ? '0' : '') + hours,
             max: hourMax,
+            value: tmpHours ?? formatNumberWithLeadingZero(hours),
             onInput: handleHourChange,
             ref: hoursRef
-          }), /*#__PURE__*/_jsx("button", {
-            type: "button",
+          }), /*#__PURE__*/_jsx(LinkButton, {
             "aria-label": "hour down",
-            className: "fwe-btn fwe-btn-link fwe-dark",
-            onClick: () => handleHourDown(),
-            children: /*#__PURE__*/_jsx("i", {
+            className: "fwe-dark",
+            onClick: () => handleHourIncrement(-1),
+            icon: /*#__PURE__*/_jsx("i", {
               "aria-hidden": true,
               className: "fwe-icon fwe-icon-arrows-collapse"
             })
           })]
         }), /*#__PURE__*/_jsxs("div", {
           className: "fwe-timepicker-spinners-minutes",
-          children: [/*#__PURE__*/_jsx("button", {
-            type: "button",
+          children: [/*#__PURE__*/_jsx(LinkButton, {
             "aria-label": "minute up",
-            className: "fwe-btn fwe-btn-link fwe-dark",
-            onClick: () => handleMinuteUp(),
-            children: /*#__PURE__*/_jsx("i", {
+            className: "fwe-dark",
+            onClick: () => handleMinuteIncrement(1),
+            icon: /*#__PURE__*/_jsx("i", {
               "aria-hidden": true,
               className: "fwe-icon fwe-icon-arrows-expand"
             })
-          }), /*#__PURE__*/_jsx("input", {
+          }), /*#__PURE__*/_jsx(TimePickerInput, {
             "aria-label": "minutes value",
-            className: "fwe-timepicker-hide-spinners",
-            type: "number",
             min: min,
-            step: 1,
-            value: tmpMinutes ?? (innerDate.getMinutes() < 10 ? '0' : '') + innerDate.getMinutes(),
             max: minutesSecondsMax,
+            value: tmpMinutes ?? formatNumberWithLeadingZero(innerDate.getMinutes()),
             onInput: handleMinuteChange
-          }), /*#__PURE__*/_jsx("button", {
-            type: "button",
+          }), /*#__PURE__*/_jsx(LinkButton, {
             "aria-label": "minute down",
-            className: "fwe-btn fwe-btn-link fwe-dark",
-            onClick: () => handleMinuteDown(),
-            children: /*#__PURE__*/_jsx("i", {
+            className: "fwe-dark",
+            onClick: () => handleMinuteIncrement(-1),
+            icon: /*#__PURE__*/_jsx("i", {
               "aria-hidden": true,
               className: "fwe-icon fwe-icon-arrows-collapse"
             })
           })]
         }), showSeconds && /*#__PURE__*/_jsxs("div", {
           className: "fwe-timepicker-spinners-seconds",
-          children: [/*#__PURE__*/_jsx("button", {
-            type: "button",
+          children: [/*#__PURE__*/_jsx(LinkButton, {
             "aria-label": "seconds up",
-            className: "fwe-btn fwe-btn-link fwe-dark",
-            onClick: () => handleSecondUp(),
-            children: /*#__PURE__*/_jsx("i", {
+            className: "fwe-dark",
+            onClick: () => handleSecondIncrement(1),
+            icon: /*#__PURE__*/_jsx("i", {
               "aria-hidden": true,
               className: "fwe-icon fwe-icon-arrows-expand"
             })
-          }), /*#__PURE__*/_jsx("input", {
+          }), /*#__PURE__*/_jsx(TimePickerInput, {
             "aria-label": "seconds value",
-            className: "fwe-timepicker-hide-spinners",
-            type: "number",
             min: min,
-            step: 1,
-            value: tmpSeconds ?? (innerDate.getSeconds() < 10 ? '0' : '') + innerDate.getSeconds(),
             max: minutesSecondsMax,
+            value: tmpSeconds ?? formatNumberWithLeadingZero(innerDate.getSeconds()),
             onInput: handleSecondChange
-          }), /*#__PURE__*/_jsx("button", {
-            type: "button",
+          }), /*#__PURE__*/_jsx(LinkButton, {
             "aria-label": "minute down",
-            className: "fwe-btn fwe-btn-link fwe-dark",
-            onClick: () => handleSecondDown(),
-            children: /*#__PURE__*/_jsx("i", {
+            className: "fwe-dark",
+            onClick: () => handleSecondIncrement(-1),
+            icon: /*#__PURE__*/_jsx("i", {
               "aria-hidden": true,
               className: "fwe-icon fwe-icon-arrows-collapse"
             })
           })]
         })]
-      }), timeFormat === '12' && /*#__PURE__*/_jsx("span", {
-        className: "fwe-badge fwe-badge-control",
+      }), timeFormat === '12' && /*#__PURE__*/_jsx("button", {
+        onClick: toggleAmPm,
+        type: "button",
+        className: "fwe-btn fwe-ml-m",
         children: innerDate.getHours() >= 12 ? 'PM' : 'AM'
       })]
     })

package/lib/forms/time-picker/time-picker-dropdown/TimePickerInput.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+interface TimePickerInputProps {
+    min: number;
+    value: string | number;
+    max: number;
+    onInput: React.FormEventHandler<HTMLInputElement>;
+    'aria-label': string;
+}
+declare const TimePickerInput: (props: TimePickerInputProps & import("react").RefAttributes<HTMLInputElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
+export default TimePickerInput;

package/lib/forms/time-picker/time-picker-dropdown/TimePickerInput.js

@@ -0,0 +1,23 @@
+import { forwardRef } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+const TimePickerInput = /*#__PURE__*/forwardRef((_ref, ref) => {
+  let {
+    min,
+    max,
+    value,
+    onInput,
+    'aria-label': ariaLabel
+  } = _ref;
+  return /*#__PURE__*/_jsx("input", {
+    "aria-label": ariaLabel,
+    className: "fwe-timepicker-hide-spinners",
+    type: "number",
+    min: min,
+    step: 1,
+    value: value,
+    max: max,
+    onInput: onInput,
+    ref: ref
+  });
+});
+export default TimePickerInput;

package/node/lib/components/buttons/button/Button.js

@@ -5,10 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _classnames = _interopRequireDefault(require("classnames"));
-var _react = _interopRequireDefault(require("react"));
+var _react = require("react");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function Button(_ref) {
+const Button = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
     icon,
     disabled = false,
@@ -17,7 +17,8 @@ function Button(_ref) {
     onClick,
     primary = false,
     className,
-    children
+    children,
+    ...props
   } = _ref;
   const classes = (0, _classnames.default)('fwe-btn', 'fr-button', {
     'fwe-btn-icon': iconOnly
@@ -33,11 +34,13 @@ function Button(_ref) {
     onClick: onClick,
     className: classes,
     disabled: disabled,
+    ref: ref,
+    ...props,
     children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
       className: `fwe-icon fwe-icon-${icon}`
     }), !iconOnly && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       children: children
     })]
   });
-}
+});
 var _default = exports.default = Button;

package/node/lib/components/link-button/LinkButton.js

@@ -5,28 +5,40 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _classnames = _interopRequireDefault(require("classnames"));
+var _react = require("react");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function LinkButton(_ref) {
+const LinkButton = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
     icon,
     onClick,
     disabled = false,
     children,
     iconOnly = false,
-    className
+    className,
+    ...props
   } = _ref;
   const classes = (0, _classnames.default)('fwe-btn', 'fwe-btn-link', {
     'fwe-disabled': disabled
   }, className);
+  let innerIcon;
+  if (icon) {
+    if (typeof icon === 'string') {
+      innerIcon = /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+        className: `fwe-icon fwe-icon-${icon}`
+      });
+    } else {
+      innerIcon = icon;
+    }
+  }
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
     onClick: onClick,
     type: "button",
     className: classes,
     disabled: disabled,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
-      className: `fwe-icon fwe-icon-${icon}`
-    }), !iconOnly && children]
+    ref: ref,
+    ...props,
+    children: [innerIcon, !iconOnly && children]
   });
-}
+});
 var _default = exports.default = LinkButton;

package/node/lib/components/modals/ModalBase.js

@@ -8,6 +8,7 @@ var _classnames = _interopRequireDefault(require("classnames"));
 var _react = require("react");
 var _reactDom = _interopRequireDefault(require("react-dom"));
 var _reactTransitionGroup = require("react-transition-group");
+var _reactRemoveScroll = require("react-remove-scroll");
 var _useForkRef = _interopRequireDefault(require("../../helper/useForkRef"));
 var _useOnClickOutside = _interopRequireDefault(require("../../helper/useOnClickOutside"));
 var _jsxRuntime = require("react/jsx-runtime");
@@ -59,10 +60,13 @@ const ModalBase = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
           exit: 600
         },
         component: null,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          ref: allRefs,
-          className: (0, _classnames.default)('fr-modal fwe-modal', className),
-          children: children
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactRemoveScroll.RemoveScroll, {
+          className: "fr-modal-overlay-wrapper",
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            ref: allRefs,
+            className: (0, _classnames.default)('fr-modal fwe-modal', className),
+            children: children
+          })
         })
       })]
     }), container.body)

package/node/lib/forms/time-picker/TimePicker.js

@@ -10,7 +10,6 @@ var _reactDom = _interopRequireDefault(require("react-dom"));
 var _reactPopper = require("react-popper");
 var _useForkRef = _interopRequireDefault(require("../../helper/useForkRef"));
 var _useId = _interopRequireDefault(require("../../helper/useId"));
-var _useOnClickOutside = _interopRequireDefault(require("../../helper/useOnClickOutside"));
 var _TimePickerDropdown = _interopRequireDefault(require("./time-picker-dropdown/TimePickerDropdown"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -68,10 +67,6 @@ const TimePicker = exports.TimePicker = /*#__PURE__*/(0, _react.forwardRef)((_re
   const timePickerRef = (0, _react.useRef)(null);
   const combinedTimePickerRef = (0, _useForkRef.default)(timePickerRef, r => setPopperElement(r));
   const [open, setOpen] = (0, _react.useState)(false);
-  const closeDropdown = (0, _react.useCallback)(() => {
-    setOpen(false);
-  }, []);
-  (0, _useOnClickOutside.default)(labelRef, closeDropdown, timePickerRef);
   const controlled = value !== undefined;
   const initialValue = controlled ? value : defaultValue;
   const [innerValue, setInnerValue] = (0, _react.useState)(initialValue ?? new Date());
@@ -151,6 +146,7 @@ const TimePicker = exports.TimePicker = /*#__PURE__*/(0, _react.forwardRef)((_re
         })]
       })
     }), open && /*#__PURE__*/_reactDom.default.createPortal( /*#__PURE__*/(0, _jsxRuntime.jsx)(_TimePickerDropdown.default, {
+      labelRef: labelRef,
       ref: combinedTimePickerRef,
       onClose: handleClose,
       onDateChange: handleDateChange,

package/node/lib/forms/time-picker/time-picker-dropdown/TimePickerDropdown.js

@@ -7,6 +7,9 @@ exports.default = void 0;
 var _classnames = _interopRequireDefault(require("classnames"));
 var _react = _interopRequireWildcard(require("react"));
 var _useForkRef = _interopRequireDefault(require("../../../helper/useForkRef"));
+var _LinkButton = _interopRequireDefault(require("../../../components/link-button/LinkButton"));
+var _TimePickerInput = _interopRequireDefault(require("./TimePickerInput"));
+var _useOnClickOutside = _interopRequireDefault(require("../../../helper/useOnClickOutside"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -18,7 +21,8 @@ const TimePickerDropdown = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     onDateChange,
     showSeconds,
     onClose,
-    style
+    style,
+    labelRef
   } = _ref;
   const innerRef = (0, _react.useRef)(null);
   const combinedRef = (0, _useForkRef.default)(ref, innerRef);
@@ -27,6 +31,7 @@ const TimePickerDropdown = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   const [tmpMinutes, setTmpMinutes] = (0, _react.useState)(null);
   const [tmpSeconds, setTmpSeconds] = (0, _react.useState)(null);
   const [innerDate, setInnerDate] = (0, _react.useState)(date);
+  (0, _useOnClickOutside.default)(labelRef, () => onClose(innerDate), innerRef);
   const min = 0;
   const hourMax = timeFormat === '12' ? 12 : 23;
   const minutesSecondsMax = 59;
@@ -40,16 +45,9 @@ const TimePickerDropdown = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
       onClose(e.key === 'Enter' ? innerDate : undefined);
     }
   }
-  function handleHourUp() {
+  function handleHourIncrement(increment) {
     const newDate = new Date(innerDate);
-    newDate.setHours(innerDate.getHours() + 1);
-    setInnerDate(newDate);
-    onDateChange(newDate);
-    setTmpHours(null);
-  }
-  function handleHourDown() {
-    const newDate = new Date(innerDate);
-    newDate.setHours(innerDate.getHours() - 1);
+    newDate.setHours(innerDate.getHours() + increment);
     setInnerDate(newDate);
     onDateChange(newDate);
     setTmpHours(null);
@@ -61,16 +59,9 @@ const TimePickerDropdown = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     setInnerDate(newDate);
     setTmpHours(e.target.value);
   }
-  function handleMinuteUp() {
-    const newDate = new Date(innerDate);
-    newDate.setMinutes(innerDate.getMinutes() + 1);
-    setInnerDate(newDate);
-    onDateChange(newDate);
-    setTmpMinutes(null);
-  }
-  function handleMinuteDown() {
+  function handleMinuteIncrement(increment) {
     const newDate = new Date(innerDate);
-    newDate.setMinutes(innerDate.getMinutes() - 1);
+    newDate.setMinutes(innerDate.getMinutes() + increment);
     setInnerDate(newDate);
     onDateChange(newDate);
     setTmpMinutes(null);
@@ -82,16 +73,9 @@ const TimePickerDropdown = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     setInnerDate(newDate);
     setTmpMinutes(e.target.value);
   }
-  function handleSecondUp() {
+  function handleSecondIncrement(increment) {
     const newDate = new Date(innerDate);
-    newDate.setSeconds(innerDate.getSeconds() + 1);
-    setInnerDate(newDate);
-    onDateChange(newDate);
-    setTmpSeconds(null);
-  }
-  function handleSecondDown() {
-    const newDate = new Date(innerDate);
-    newDate.setSeconds(innerDate.getSeconds() - 1);
+    newDate.setSeconds(innerDate.getSeconds() + increment);
     setInnerDate(newDate);
     onDateChange(newDate);
     setTmpSeconds(null);
@@ -104,6 +88,21 @@ const TimePickerDropdown = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     setTmpSeconds(e.target.value);
   }
   const hours = timeFormat === '12' ? (innerDate.getHours() + 11) % 12 + 1 : innerDate.getHours();
+  function toggleAmPm() {
+    const newDate = new Date(innerDate);
+    // Get the current hour in 24-hour format
+    const currentHours = innerDate.getHours();
+    if (currentHours >= 0 && currentHours < 12) {
+      // Switching from AM to PM
+      newDate.setHours(currentHours + 12);
+    } else {
+      // Switching from PM to AM
+      newDate.setHours(currentHours - 12);
+    }
+    setInnerDate(newDate);
+    onDateChange(newDate);
+  }
+  const formatNumberWithLeadingZero = number => (number < 10 ? '0' : '') + number;
   return (
     /*#__PURE__*/
     // should not be an issue with dialog
@@ -121,98 +120,85 @@ const TimePickerDropdown = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
         className: "fwe-timepicker-spinners",
         children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
           className: "fwe-timepicker-spinners-hours",
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
-            type: "button",
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_LinkButton.default, {
             "aria-label": "hour up",
-            className: "fwe-btn fwe-btn-link fwe-dark",
-            onClick: () => handleHourUp(),
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+            className: "fwe-dark",
+            onClick: () => handleHourIncrement(1),
+            icon: /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
               "aria-hidden": true,
               className: "fwe-icon fwe-icon-arrows-expand"
             })
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TimePickerInput.default, {
             "aria-label": "hours value",
-            className: "fwe-timepicker-hide-spinners",
-            type: "number",
             min: min,
-            step: 1,
-            value: tmpHours ?? (hours < 10 ? '0' : '') + hours,
             max: hourMax,
+            value: tmpHours ?? formatNumberWithLeadingZero(hours),
             onInput: handleHourChange,
             ref: hoursRef
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
-            type: "button",
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_LinkButton.default, {
             "aria-label": "hour down",
-            className: "fwe-btn fwe-btn-link fwe-dark",
-            onClick: () => handleHourDown(),
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+            className: "fwe-dark",
+            onClick: () => handleHourIncrement(-1),
+            icon: /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
               "aria-hidden": true,
               className: "fwe-icon fwe-icon-arrows-collapse"
             })
           })]
         }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
           className: "fwe-timepicker-spinners-minutes",
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
-            type: "button",
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_LinkButton.default, {
             "aria-label": "minute up",
-            className: "fwe-btn fwe-btn-link fwe-dark",
-            onClick: () => handleMinuteUp(),
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+            className: "fwe-dark",
+            onClick: () => handleMinuteIncrement(1),
+            icon: /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
               "aria-hidden": true,
               className: "fwe-icon fwe-icon-arrows-expand"
             })
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TimePickerInput.default, {
             "aria-label": "minutes value",
-            className: "fwe-timepicker-hide-spinners",
-            type: "number",
             min: min,
-            step: 1,
-            value: tmpMinutes ?? (innerDate.getMinutes() < 10 ? '0' : '') + innerDate.getMinutes(),
             max: minutesSecondsMax,
+            value: tmpMinutes ?? formatNumberWithLeadingZero(innerDate.getMinutes()),
             onInput: handleMinuteChange
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
-            type: "button",
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_LinkButton.default, {
             "aria-label": "minute down",
-            className: "fwe-btn fwe-btn-link fwe-dark",
-            onClick: () => handleMinuteDown(),
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+            className: "fwe-dark",
+            onClick: () => handleMinuteIncrement(-1),
+            icon: /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
               "aria-hidden": true,
               className: "fwe-icon fwe-icon-arrows-collapse"
             })
           })]
         }), showSeconds && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
           className: "fwe-timepicker-spinners-seconds",
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
-            type: "button",
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_LinkButton.default, {
             "aria-label": "seconds up",
-            className: "fwe-btn fwe-btn-link fwe-dark",
-            onClick: () => handleSecondUp(),
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+            className: "fwe-dark",
+            onClick: () => handleSecondIncrement(1),
+            icon: /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
               "aria-hidden": true,
               className: "fwe-icon fwe-icon-arrows-expand"
             })
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TimePickerInput.default, {
             "aria-label": "seconds value",
-            className: "fwe-timepicker-hide-spinners",
-            type: "number",
             min: min,
-            step: 1,
-            value: tmpSeconds ?? (innerDate.getSeconds() < 10 ? '0' : '') + innerDate.getSeconds(),
             max: minutesSecondsMax,
+            value: tmpSeconds ?? formatNumberWithLeadingZero(innerDate.getSeconds()),
             onInput: handleSecondChange
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
-            type: "button",
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_LinkButton.default, {
             "aria-label": "minute down",
-            className: "fwe-btn fwe-btn-link fwe-dark",
-            onClick: () => handleSecondDown(),
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+            className: "fwe-dark",
+            onClick: () => handleSecondIncrement(-1),
+            icon: /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
               "aria-hidden": true,
               className: "fwe-icon fwe-icon-arrows-collapse"
             })
           })]
         })]
-      }), timeFormat === '12' && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-        className: "fwe-badge fwe-badge-control",
+      }), timeFormat === '12' && /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+        onClick: toggleAmPm,
+        type: "button",
+        className: "fwe-btn fwe-ml-m",
         children: innerDate.getHours() >= 12 ? 'PM' : 'AM'
       })]
     })

package/node/lib/forms/time-picker/time-picker-dropdown/TimePickerInput.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = require("react");
+var _jsxRuntime = require("react/jsx-runtime");
+const TimePickerInput = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+  let {
+    min,
+    max,
+    value,
+    onInput,
+    'aria-label': ariaLabel
+  } = _ref;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+    "aria-label": ariaLabel,
+    className: "fwe-timepicker-hide-spinners",
+    type: "number",
+    min: min,
+    step: 1,
+    value: value,
+    max: max,
+    onInput: onInput,
+    ref: ref
+  });
+});
+var _default = exports.default = TimePickerInput;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@festo-ui/react",
-  "version": "6.0.0-dev.213",
+  "version": "6.0.0-dev.217",
   "author": "Festo UI (styleguide@festo.com)",
   "license": "apache-2.0",
   "exports": {
@@ -30,6 +30,7 @@
     "quill": "1.3.7",
     "react-draggable": "^4.4.4",
     "react-popper": "^2.3.0",
+    "react-remove-scroll": "^2.5.7",
     "react-transition-group": "^4.4.2",
     "swiper": "^9.4.1",
     "xss": "^1.0.10"