.zf-ba__list{list-style:none;margin:0;padding:0}.zf-ba__list--single{max-width:var(--zf-ba-max, 96rem);margin:0 auto}.zf-ba__item{min-width:0}.zf-ba__figure{margin:0}zf-before-after{display:block;--zf-ba-pos: 50%}.zf-ba__frame{position:relative;aspect-ratio:var(--zf-ba-ratio, 1 / 1);overflow:hidden;border-radius:var(--zf-ba-radius, var(--zf-radius));background:rgba(var(--color-foreground),.06);cursor:ew-resize;touch-action:pan-y;user-select:none;-webkit-user-select:none}.zf-ba__layer{position:absolute;top:0;right:0;bottom:0;left:0}.zf-ba__layer--before{clip-path:inset(0 calc(100% - var(--zf-ba-pos)) 0 0)}.zf-ba__img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;pointer-events:none;-webkit-user-drag:none}.zf-ba__placeholder{fill:rgba(var(--color-foreground),.3)}.zf-ba__placeholder--before{background:rgba(var(--color-foreground),.14)}.zf-ba__placeholder--after{background:rgba(var(--color-foreground),.04)}.zf-ba__label{position:absolute;top:1.2rem;z-index:2;padding:.5rem 1.2rem;border-radius:10rem;background:#0009;color:#fff;font-size:1.2rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;pointer-events:none}.zf-ba__label--before{left:1.2rem}.zf-ba__label--after{right:1.2rem}.zf-ba__range{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;opacity:0;pointer-events:none;z-index:1}.zf-ba__divider{position:absolute;top:0;bottom:0;left:var(--zf-ba-pos);z-index:3;width:.3rem;margin-left:-.15rem;background:var(--zf-ba-handle, #fff);box-shadow:0 0 .6rem #00000040;pointer-events:none}.zf-ba__handle{position:absolute;top:50%;left:50%;width:4.8rem;height:4.8rem;transform:translate(-50%,-50%);border-radius:50%;background:var(--zf-ba-handle, #fff);color:#111;display:flex;align-items:center;justify-content:center;box-shadow:0 .2rem 1rem #0000004d;transition:transform .15s ease}.zf-ba__handle .zf-icon{width:1.6rem;height:1.6rem;margin:0 -.2rem}zf-before-after.is-dragging .zf-ba__handle{transform:translate(-50%,-50%) scale(1.08)}.zf-ba__range:focus-visible~.zf-ba__divider .zf-ba__handle{outline:.3rem solid rgb(var(--color-foreground));outline-offset:.3rem}.zf-ba__caption{margin-top:1.2rem;text-align:center;font-weight:600;font-size:1.5rem}
/*# sourceMappingURL=/cdn/shop/t/100/assets/zf-before-after.css.map */