.kg-cmp{--kg-cmp-pos: 50%;--kg-cmp-handle: 4.4rem}.kg-cmp__stage{display:grid;gap:var(--kg-s3)}.kg-cmp__pane{position:relative;overflow:hidden;border-radius:var(--kg-radius-media);background-color:var(--kg-stone)}.kg-cmp:not(.kg-cmp--ready) .kg-cmp__pane--before{order:-1}.kg-cmp__img{display:block;width:100%;height:100%;object-fit:cover}.kg-cmp__chip{position:absolute;z-index:3;inset-block-start:var(--kg-s3);max-width:calc(50% - var(--kg-s4));padding:.6rem 1.2rem;border-radius:var(--kg-radius-pill);color:var(--kg-ink);pointer-events:none}.kg-cmp__chip--before{inset-inline-start:var(--kg-s3)}.kg-cmp__chip--after{inset-inline-end:var(--kg-s3)}.kg-cmp__divider{display:none}.kg-cmp--ready .kg-cmp__stage{position:relative;display:block;aspect-ratio:4 / 5;overflow:hidden;border-radius:var(--kg-radius-media);background-color:var(--kg-stone);touch-action:pan-y}@media screen and (min-width:750px){.kg-cmp--ready .kg-cmp__stage{aspect-ratio:1 / 1}}.kg-cmp--ready .kg-cmp__pane{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:0;background-color:transparent}.kg-cmp--ready .kg-cmp__pane--before{clip-path:inset(0 calc(100% - var(--kg-cmp-pos)) 0 0)}.kg-cmp--ready .kg-cmp__chip{z-index:3}.kg-cmp--ready .kg-cmp__divider{position:absolute;z-index:3;inset-block:0;inset-inline-start:var(--kg-cmp-pos);display:block;width:.2rem;margin-inline-start:-.1rem;background-color:var(--kg-paper);box-shadow:0 0 0 .1rem #1014182e;pointer-events:none}.kg-cmp__handle{position:absolute;inset-block-start:50%;inset-inline-start:50%;display:flex;width:var(--kg-cmp-handle);height:var(--kg-cmp-handle);cursor:ew-resize;pointer-events:auto;touch-action:none;margin-block-start:calc(var(--kg-cmp-handle) / -2);margin-inline-start:calc(var(--kg-cmp-handle) / -2);border-radius:var(--kg-radius-pill);background-color:var(--kg-paper);box-shadow:0 .2rem 1.2rem #10141847}.kg-cmp__handle:before,.kg-cmp__handle:after{content:"";position:absolute;inset-block-start:50%;width:.7rem;height:.7rem;margin-block-start:-.35rem;border:.2rem solid var(--kg-ink)}.kg-cmp__handle:before{inset-inline-start:1.1rem;border-block-end:0;border-inline-end:0;transform:rotate(-45deg)}.kg-cmp__handle:after{inset-inline-end:1.1rem;border-block-start:0;border-inline-start:0;transform:rotate(-45deg)}.kg-cmp__handle:focus-visible{outline:.2rem solid var(--kg-ink);outline-offset:.2rem}
/*# sourceMappingURL=/cdn/shop/t/2/assets/kg-compare-slider.css.map */