.ex-cmp{display:block;width:100%}.ex-cmp__box{position:relative;width:100%;aspect-ratio:var(--ex-cmp-ratio-m, 4 / 3);min-height:var(--ex-cmp-min-h-m, 200px);max-height:var(--ex-cmp-max-h-m, 400px);overflow:hidden;border-radius:var(--ex-cmp-radius, 8px);background:rgba(var(--ex-text-rgb, 31, 41, 55),.06);cursor:ew-resize;touch-action:pan-y pinch-zoom;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;isolation:isolate}@media screen and (min-width:750px){.ex-cmp__box{aspect-ratio:var(--ex-cmp-ratio, 4 / 3);min-height:var(--ex-cmp-min-h, 250px);max-height:var(--ex-cmp-max-h, 500px)}}.ex-cmp--shadow .ex-cmp__box{box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.ex-cmp__layer{position:absolute;top:0;right:0;bottom:0;left:0}.ex-cmp__layer--before{z-index:1;clip-path:inset(0 calc(100% - var(--ex-cmp-pos, 50%)) 0 0)}.ex-cmp__img,.ex-cmp__placeholder{display:block;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none;-webkit-user-drag:none}.ex-cmp__placeholder{display:grid;place-items:center;background:rgba(var(--ex-text-rgb, 31, 41, 55),.06)}.ex-cmp__placeholder--before{background:rgba(var(--ex-text-rgb, 31, 41, 55),.11)}.ex-cmp__placeholder-svg{width:50%;height:50%;opacity:.3;fill:rgb(var(--ex-text-rgb, 107, 114, 128))}.ex-cmp__placeholder--before .ex-cmp__placeholder-svg{transform:translate(-50%)}.ex-cmp__placeholder--after .ex-cmp__placeholder-svg{transform:translate(50%)}.ex-cmp__label{position:absolute;bottom:8px;z-index:1;padding:4px 8px;border-radius:4px;background:var(--ex-cmp-label-bg, rgba(255, 255, 255, .9));color:var(--ex-cmp-label-text, #1f2937);font-size:var(--ex-cmp-label-size-m, 11px);font-weight:var(--ex-weight-bold, 700);line-height:1.2;letter-spacing:0;box-shadow:0 1px 3px #0000001a;pointer-events:none;white-space:nowrap}.ex-cmp__label--before{left:8px}.ex-cmp__label--after{right:8px}@media screen and (min-width:640px){.ex-cmp__label{bottom:12px;padding:6px 12px}.ex-cmp__label--before{left:12px}.ex-cmp__label--after{right:12px}}@media screen and (min-width:750px){.ex-cmp__label{bottom:16px;font-size:var(--ex-cmp-label-size, 12px)}.ex-cmp__label--before{left:16px}.ex-cmp__label--after{right:16px}}.ex-cmp__divider{display:block;position:absolute;top:0;bottom:0;left:var(--ex-cmp-pos, 50%);z-index:2;width:3px;margin-left:-1.5px;background:var(--ex-cmp-divider, #ffffff);box-shadow:0 1px 3px #0000004d;pointer-events:none}.ex-cmp__handle{position:absolute;top:50%;left:clamp(22px,var(--ex-cmp-pos, 50%),calc(100% - 22px));z-index:3;display:grid;place-items:center;width:44px;height:44px;margin:-22px 0 0 -22px;border:2px solid var(--ex-cmp-handle-border, #f3f4f6);border-radius:50%;background:var(--ex-cmp-handle-bg, #ffffff);color:var(--ex-cmp-handle-icon, #374151);box-shadow:0 10px 15px -3px #0000001a;cursor:grab;touch-action:pan-y pinch-zoom;transition:transform var(--ex-dur-fast, .2s) ease,box-shadow var(--ex-dur-fast, .2s) ease}.ex-cmp__handle-icon{width:20px;height:20px}@media screen and (min-width:750px){.ex-cmp__handle{left:clamp(24px,var(--ex-cmp-pos, 50%),calc(100% - 24px));width:48px;height:48px;margin:-24px 0 0 -24px}.ex-cmp__handle-icon{width:24px;height:24px}}@media(hover:hover){.ex-cmp__handle:hover{transform:scale(1.05);box-shadow:0 20px 25px -5px #00000026,0 10px 10px -5px #0000000f}}.ex-cmp__handle:focus{outline:none}.ex-cmp__handle:focus-visible{outline:2px solid var(--ex-accent, #3b82f6);outline-offset:2px}.ex-cmp.is-dragging .ex-cmp__box,.ex-cmp.is-dragging .ex-cmp__handle{cursor:grabbing}.ex-cmp.is-dragging .ex-cmp__handle{transform:scale(.95);transition:none}@media(prefers-reduced-motion:reduce){.ex-cmp__handle{transition:none}.ex-cmp__handle:hover,.ex-cmp.is-dragging .ex-cmp__handle{transform:none}}@media(forced-colors:active){.ex-cmp__divider{background:CanvasText}.ex-cmp__handle{border-color:CanvasText}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/elexa-before-after.css.map */