.visual-compare{height:100%;margin:auto;max-height:100vh;overflow:hidden;position:relative;width:100%}.visual-compare>*{z-index:1}.visual-compare-items{position:relative;z-index:0}.visual-compare-item,.visual-compare-items{box-sizing:border-box;height:100%;left:0;top:0;width:100%}.visual-compare-item{position:absolute}.visual-compare-item:last-child{position:relative}.visual-compare-item img{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.visual-compare-divider{align-items:center;cursor:ew-resize;display:flex;justify-content:center;left:0;pointer-events:auto;position:absolute;top:0}.visual-compare.vertical .visual-compare-divider{cursor:ns-resize}.visual-compare .visual-compare-handle{--handle-size:40px;--handle-border-width:3px;--handle-box-shadow:0px 0px 12px rgba(0,0,0,.4);--handle-color:#fff;border:var(--handle-border-width) solid var(--handle-color);border-radius:100%;box-shadow:var(--handle-box-shadow);box-sizing:border-box;height:var(--handle-size);left:50%;opacity:.7;position:absolute;top:50%;transform:translate(-50%,-50%);width:var(--handle-size)}.visual-compare .visual-compare-handle:hover{opacity:1}.visual-compare .visual-compare-handle-bar{background-color:var(--handle-color);box-shadow:var(--handle-box-shadow);content:"";position:absolute}.visual-compare.horizontal .visual-compare-handle-bar{height:9999px;left:50%;transform:translateX(-50%);width:var(--handle-border-width)}.visual-compare.horizontal .visual-compare-handle-bar.start{bottom:calc(100% + var(--handle-border-width))}.visual-compare.horizontal .visual-compare-handle-bar.end{top:calc(100% + var(--handle-border-width))}.visual-compare.vertical .visual-compare-handle-bar{height:var(--handle-border-width);top:50%;transform:translateY(-50%);width:9999px}.visual-compare.vertical .visual-compare-handle-bar.start{right:calc(100% + var(--handle-border-width))}.visual-compare.vertical .visual-compare-handle-bar.end{left:calc(100% + var(--handle-border-width))}.visual-compare .visual-compare-handle-arrow{--arrow-width:calc(var(--handle-border-width)*2);border:var(--arrow-width) solid transparent;position:absolute}.visual-compare.horizontal .visual-compare-handle-arrow{top:50%}.visual-compare.horizontal .visual-compare-handle-arrow.prev{border-right-color:var(--handle-color);left:calc(25% - var(--handle-border-width));transform:translate(-50%,-50%)}.visual-compare.horizontal .visual-compare-handle-arrow.next{border-left-color:var(--handle-color);right:calc(25% - var(--handle-border-width));transform:translate(50%,-50%)}.visual-compare.vertical .visual-compare-handle-arrow{left:50%}.visual-compare.vertical .visual-compare-handle-arrow.prev{border-bottom-color:var(--handle-color);top:calc(25% - var(--handle-border-width));transform:translate(-50%,-50%)}.visual-compare.vertical .visual-compare-handle-arrow.next{border-top-color:var(--handle-color);bottom:calc(25% - var(--handle-border-width));transform:translate(-50%,50%)}
/**
 * Visual Compare - Styles
 * Main container and divider styling
 */
.visual-compare {
  margin: auto;
  position: relative;
  width: 100%;
  height: 100%;
  max-height: 100vh;
  overflow: hidden;
}
.visual-compare > * {
  z-index: 1;
}

.visual-compare-items {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 0;
  top: 0;
  left: 0;
  box-sizing: border-box;
}

.visual-compare-item {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  box-sizing: border-box;
}

.visual-compare-item:last-child {
  position: relative;
}

.visual-compare-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Dividers */
.visual-compare-divider {
  position: absolute;
  top: 0;
  left: 0;
  cursor: ew-resize;
  pointer-events: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  /*backdrop-filter: blur(4px);*/
}

.visual-compare.vertical .visual-compare-divider {
  cursor: ns-resize;
}

.visual-compare .visual-compare-handle {
  opacity: 0.7;
  --handle-size: 40px;
  --handle-border-width: 3px;
  --handle-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.4);
  --handle-color: white;
  height: var(--handle-size);
  width: var(--handle-size);
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border: var(--handle-border-width) solid var(--handle-color);
  box-sizing: border-box;
  border-radius: 100%;
  box-shadow: var(--handle-box-shadow);
}
.visual-compare .visual-compare-handle:hover {
  opacity: 1;
}

.visual-compare .visual-compare-handle-bar {
  content: "";
  position: absolute;
  background-color: var(--handle-color);
  box-shadow: var(--handle-box-shadow);
}

.visual-compare.horizontal .visual-compare-handle-bar {
  width: var(--handle-border-width);
  height: 9999px;
  transform: translateX(-50%);
  left: 50%;
}
.visual-compare.horizontal .visual-compare-handle-bar.start {
  bottom: calc(100% + var(--handle-border-width));
}
.visual-compare.horizontal .visual-compare-handle-bar.end {
  top: calc(100% + var(--handle-border-width));
}

.visual-compare.vertical .visual-compare-handle-bar {
  height: var(--handle-border-width);
  width: 9999px;
  transform: translateY(-50%);
  top: 50%;
}
.visual-compare.vertical .visual-compare-handle-bar.start {
  right: calc(100% + var(--handle-border-width));
}
.visual-compare.vertical .visual-compare-handle-bar.end {
  left: calc(100% + var(--handle-border-width));
}

.visual-compare .visual-compare-handle-arrow {
  --arrow-width: calc(var(--handle-border-width) * 2);
  border: var(--arrow-width) solid transparent;
  position: absolute;
}

.visual-compare.horizontal .visual-compare-handle-arrow {
  top: 50%;
}
.visual-compare.horizontal .visual-compare-handle-arrow.prev {
  border-right-color: var(--handle-color);
  left: calc(25% - var(--handle-border-width));
  transform: translate(-50%, -50%);
}
.visual-compare.horizontal .visual-compare-handle-arrow.next {
  border-left-color: var(--handle-color);
  right: calc(25% - var(--handle-border-width));
  transform: translate(50%, -50%);
}

.visual-compare.vertical .visual-compare-handle-arrow {
  left: 50%;
}
.visual-compare.vertical .visual-compare-handle-arrow.prev {
  border-bottom-color: var(--handle-color);
  top: calc(25% - var(--handle-border-width));
  transform: translate(-50%, -50%);
}
.visual-compare.vertical .visual-compare-handle-arrow.next {
  border-top-color: var(--handle-color);
  bottom: calc(25% - var(--handle-border-width));
  transform: translate(-50%, 50%);
}

[class*=wp-block].is-selected{animation-name:none!important;outline:solid var(--wp-admin-border-width-focus) var(--wp-admin-theme-color)!important}.is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-selected:after{display:none!important}.wp-block-dragblock-text>span{-webkit-line-clamp:inherit;-webkit-box-orient:inherit;display:inherit;overflow:inherit}.edit-site-block-editor__block-list .wp-block-dragblock-text.is-selected{outline:2px solid var(--wp-admin-theme-color)}.wp-block.dragblock-render-disabled{display:none!important}.wp-block-dragblock-slide{height:100%}.wp-block-dragblock-visual-compare .visual-compare .visual-compare-item:not(:last-child){position:absolute;transition:none!important}