:where(.no-js) .fs-block-slider__viewport{overflow-x:auto}:where(.fs-block-slider){--viewport-padding:0px;--slide-gap:0px;--columns:1}.fs-block-slider{--fs-height:auto;--fs-direction:horizontal;--fs-slide-height:30cqw;--fs-slide-width:calc((100% - (var(--slide-gap) * (var(--columns) - 1))) / var(--columns));background-color:var(--fs-bg-color);height:var(--fs-height);position:relative;&.is-style-container,&.is-style-focus{--fs-slide-width:var(--wp--style--global--wide-size);.fs-block-slider__container{>*{transform:scale(var(--scale,1));transform-origin:center;transition:transform .3s,opacity .3s;&.is-snapped{opacity:1}&:not(.is-snapped){opacity:.5}}}}&.is-style-focus{padding-block:var(--wp--preset--spacing--xl);.fs-block-slider__container{>:not(.is-snapped){--scale:0.93}}.fs-block-slider__dots{bottom:8px}}&.is-align-center:not(.is-initialized){@container style(--fs-slide-width){.fs-block-slider__container{translate:calc((100% - var(--fs-slide-width)) / 2)}}@container style(--fs-direction: vertical){.fs-block-slider__container{translate:0 calc((var(--fs-height) - var(--fs-slide-height)) / 2)}}}&.is-align-end:not(.is-initialized){@container style(--fs-slide-width){.fs-block-slider__container{translate:calc(100% - var(--fs-slide-width))}}@container style(--fs-direction: vertical){.fs-block-slider__container{translate:0 calc(var(--fs-height) - var(--fs-slide-height))}}}}.fs-block-slider__viewport{height:var(--fs-height);margin-inline:calc(-1 * var(--viewport-padding));overflow-x:clip;padding-inline:var(--viewport-padding);position:relative;@container style(--fs-direction: vertical){overflow:hidden;>.fs-block-slider__container{align-items:center;flex-direction:column;width:100%;>*{flex-basis:auto;width:100%}}}&.is-draggable{cursor:grab;-webkit-user-select:none;-moz-user-select:none;user-select:none}&.is-dragging{cursor:grabbing}}@container style(--fs-direction: vertical){.fs-block-slider__container>*{height:var(--fs-slide-height)}}.fs-block-slider__container{align-items:flex-start;container-type:inline-size;display:flex;gap:var(--slide-gap);height:var(--fs-height);transition:height .2s;>*{--fs-height:initial;flex:0 0 100%;margin-inline:0;max-height:100%;min-width:0;position:relative;&:where(:last-child){margin-right:var(--slide-gap);@container style(--fs-direction: vertical){margin-bottom:var(--slide-gap);margin-right:0}}&.alignwide{max-width:var(--wp--style--global--wide-size)}&.alignfull{max-width:100%}&.fs-block-banner{height:var(--fs-slide-height,100%)}}>:where(:not(.alignwide):not(.alignfull)){flex:0 0 clamp(0px,var(--fs-slide-width,100%),100%)}}.fs-block-slider__button-icon{fill:currentcolor;padding:20%;transition:transform,opacity;transition-duration:.3s;transition-timing-function:ease-out}.fs-block-slider__button{--size:36px;--margin:2%;--translate:0%;background-color:transparent;border:none;color:var(--fs-blocks-color-white);display:block;height:var(--size);opacity:.7;padding:0;pointer-events:auto;position:absolute;transition:transform,opacity,color,background-color,border-color;transition-duration:.3s;transition-timing-function:ease-out;width:var(--size);z-index:10;&:where(:disabled){opacity:.4}&:hover:not(:disabled){opacity:1}@container style(--fs-direction: horizontal){top:50%;&.is-prev{left:var(--margin);transform:translate(var(--translate),-50%)}&.is-next{right:var(--margin);transform:translate(calc(var(--translate) * -1),-50%)}}@container style(--fs-direction: vertical){left:50%;.fs-block-slider__button-icon{rotate:90deg}&.is-prev{top:var(--margin);transform:translate(-50%,var(--translate))}&.is-next{bottom:var(--margin);transform:translate(-50%,calc(var(--translate) * -1))}}&.is-outside{--margin:calc(calc(var(--size) * -1) - 10px);color:currentcolor}&.is-style-circle{border-color:currentcolor;border-radius:100%;border-style:solid;border-width:max(2px,calc(var(--size) * .055))}&.is-style-simple{&:hover:not(:disabled){color:var(--fs-blocks-color-primary)}}&.is-style-reveal{--margin:calc(calc(var(--viewport-padding) * -1) - 1px);background-color:var(--fs-blocks-color-background);color:currentcolor;transform:none;@container style(--fs-direction: horizontal){box-shadow:0 -150px 15px 0 rgba(0,0,0,.3);height:auto;inset-block:-1px;width:30px;&.is-prev{clip-path:inset(1px -15px 1px 1px)}&.is-next{clip-path:inset(1px 1px 1px -15px)}}@container style(--fs-direction: vertical){box-shadow:-150px 0 15px 0 rgba(0,0,0,.3);height:30px;inset-inline:-1px;width:auto;.fs-block-slider__button-icon{height:100%;margin-inline:auto;padding:6px;width:30px}&.is-prev{clip-path:inset(1px 1px -15px 1px)}&.is-next{clip-path:inset(-15px 1px 1px 1px)}}&:hover{opacity:1}}}.fs-block-slider__dot{background-color:transparent;border:3px solid;color:currentcolor;display:block;opacity:.4;padding:0;pointer-events:auto;transition:opacity .3s;&:hover{opacity:.7}&.is-selected{background-color:currentcolor;opacity:1}}.fs-block-slider__dots{color:var(--fs-blocks-color-white);display:flex;pointer-events:none;position:absolute;@container style(--fs-direction: horizontal){bottom:15px;justify-content:center;width:100%}@container style(--fs-direction: vertical){align-items:center;flex-direction:column;right:15px;inset-block:0;justify-content:center}&.is-style-circle,&.is-style-simple,&.is-style-square{gap:var(--fs-dots-gap,10px);.fs-block-slider__dot{height:12px;width:12px}}&.is-style-circle,&.is-style-simple{.fs-block-slider__dot{border-radius:100%}}&.is-style-dashes{gap:var(--fs-dots-gap);.fs-block-slider__dot{border-color:currentcolor;@container style(--fs-direction: horizontal){height:4px;width:40px}@container style(--fs-direction: vertical){height:40px;width:4px}}}&.is-style-simple{.fs-block-slider__dot{background-color:currentcolor}}}:where(.fs-block-slider.has-arrows-hover){.fs-block-slider__button{--translate:20%;opacity:0}&:hover{.fs-block-slider__button{--translate:0%;opacity:.7;&:disabled{opacity:.4}}}}:where(.fs-block-slider.has-dots-hover){.fs-block-slider__dots{opacity:0;transition:opacity .3s}&:hover{.fs-block-slider__dots{opacity:1}}}.fs-carousel{--fs-columns:4;--fs-gap:var(--wp--preset--spacing--base);:where(.fs-block-slider){--columns:var(--fs-columns);--slide-gap:var(--fs-gap)}:where(.fs-block-slider.has-dots-normal){padding-bottom:42px}:where(.fs-block-slider__dots){color:currentcolor}}@keyframes fs-slide-loop-enter{0%{opacity:0}}
