.hf-ba{display:block;margin-top:var(--hf-ba-mt);margin-bottom:var(--hf-ba-mb);width:var(--hf-ba-width-mobile, 100%)}@media screen and (min-width:750px){.hf-ba{width:var(--hf-ba-width-desktop, 100%)}}.hf-ba__wrapper{position:relative;isolation:isolate;-webkit-user-select:none;user-select:none;overflow:hidden;--ba-hint-duration: 1.4s;--ba-percent: 50%}.hf-ba--rounded .hf-ba__wrapper{border-radius:var(--media-radius)}.hf-ba--border .hf-ba__wrapper{border:var(--media-border-width) solid var(--color-border-value)}.hf-ba--shadow .hf-ba__wrapper{box-shadow:var(--media-support-shadow-horizontal-offset) var(--media-support-shadow-vertical-offset) var(--media-support-shadow-blur-radius) rgba(var(--color-shadow),var(--media-support-shadow-opacity))}.hf-ba__base{position:relative}.hf-ba__img{width:100%;height:100%;display:block;object-fit:cover}.hf-ba__base svg,.hf-ba__overlay svg{width:100%;height:100%;object-fit:cover;object-position:center;fill:#000;background-color:#fff;display:block}.hf-ba__overlay svg{filter:invert(1)}.hf-ba__img--placeholder{background-color:#fff}.hf-ba__img--placeholder-after{background-color:#000;filter:invert(1)}.hf-ba__overlay{clip-path:inset(0 0 0 var(--ba-percent));-webkit-clip-path:inset(0 0 0 var(--ba-percent));position:absolute;top:0;bottom:0;left:0;right:0}.hf-ba__cursor-zone{position:absolute;top:0;bottom:0;left:0;right:0;pointer-events:none;touch-action:pan-y}.hf-ba__cursor{pointer-events:none;touch-action:pan-y;position:absolute;top:50%;left:var(--ba-percent);transform:translate(-50%,-50%);height:100%;width:max-content;display:grid;place-items:center;cursor:grab;will-change:transform;z-index:2}.hf-ba__cursor:before,.hf-ba__cursor:after{content:"";position:absolute;width:3px;background:var(--hf-ba-line-color);z-index:-1}.hf-ba__cursor:before{top:0;height:calc(50% - var(--hf-ba-btn-size) / 2)}.hf-ba__cursor:after{bottom:0;height:calc(50% - var(--hf-ba-btn-size) / 2)}.hf-ba__handle{width:var(--hf-ba-btn-size);height:var(--hf-ba-btn-size);border-radius:50%;border:var(--hf-ba-btn-border) solid var(--hf-ba-btn-border-color);background-color:var(--hf-ba-btn-bg);box-shadow:#00000059 0 0 7px;display:flex;align-items:center;justify-content:center;z-index:3;position:relative;line-height:0;pointer-events:auto;touch-action:pan-y}.hf-ba__handle-icon{width:100%;height:100%;display:grid;place-items:center;color:var(--hf-ba-btn-arrow-color)}.hf-ba__handle-icon svg{width:62%;height:62%;display:block;transform:scale(var(--hf-ba-icon-scale));stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;fill:none}.hf-ba__label{position:absolute;z-index:4;display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;border-radius:var(--badge-corner-radius, 999px);color:var(--hf-ba-label-color);background-color:var(--hf-ba-label-bg);font-size:var(--hf-ba-label-size);line-height:1.2;text-transform:none;pointer-events:none;-webkit-user-select:none;user-select:none}.hf-ba__label--left{left:12px}.hf-ba__label--right{right:12px}.hf-ba__label--bottom{bottom:12px}.hf-ba__label--top{top:12px}@media(prefers-reduced-motion:no-preference){.hf-ba__wrapper:not([data-ba-visible]){--ba-percent: 95%}}@media(prefers-reduced-motion:no-preference)and (min-width:768px){.hf-ba__wrapper:not([data-ba-visible]){--ba-percent: 97.8%}}.hf-ba__wrapper.is-animating .hf-ba__overlay{transition:clip-path var(--ba-hint-duration) ease,-webkit-clip-path var(--ba-hint-duration) ease;will-change:clip-path}.hf-ba__wrapper.is-animating .hf-ba__cursor{transition:left var(--ba-hint-duration) ease;will-change:left}.hf-ba__base{aspect-ratio:var(--hf-ba-ratio-mobile)}@media screen and (min-width:750px){.hf-ba__base{aspect-ratio:var(--hf-ba-ratio-desktop)}.hf-ba__label{font-size:var(--hf-ba-label-size-desktop)}.hf-ba__handle{width:var(--hf-ba-btn-size-desktop);height:var(--hf-ba-btn-size-desktop)}.hf-ba__handle-icon{--hf-ba-icon-scale: var(--hf-ba-icon-scale-desktop)}.hf-ba__cursor:before{height:calc(50% - var(--hf-ba-btn-size-desktop) / 2)}.hf-ba__cursor:after{height:calc(50% - var(--hf-ba-btn-size-desktop) / 2)}}.hf-ba__img--mobile-only{display:block}.hf-ba__img--desktop-only{display:none}@media screen and (min-width:750px){.hf-ba__img--mobile-only{display:none}.hf-ba__img--desktop-only{display:block}}shopify-visual-preview-block-list .hf-ba[data-visual-preview-mode]{width:350px;max-width:100%;flex:none;background:#fff}
/*# sourceMappingURL=/cdn/shop/t/2/assets/component-before-after.css.map */