.wp-block-tn-before-after {
  --_slider-width: 3px;
  --_slider-color: white;
  --_slider-ball-size: 50px;
  --_slider-ball-color: white;
  --_slider-position: 40%;
}
/* No images selected */
.wp-block-tn-before-after:not(:has(img)) {
  min-height: 100px;
  background: #f0f0f0;
}

/* Images */
.wp-block-tn-before-after .before-after {
  width: 100%;
}
.wp-block-tn-before-after .before-after[data-id="2"] {
  position: absolute;
  width: 100%;
  inset: 0;
  clip-path: inset(0px 0px 0px var(--_slider-position));
}

/* Slider */
.wp-block-tn-before-after .before-after-slider {
  width: var(--_slider-width);
  height: 100%;
  background-color: var(--_slider-color);
  position: absolute;
  top: 0;
  left: 0;
  translate: calc(var(--_slider-position) - var(--_slider-width) / 2) 0;
  pointer-events: none;
}