.jbw-hover-tracker {
  --jbw-tracker-x: 50%;
  --jbw-tracker-y: 50%;
  --jbw-tracker-line: #000;
  --jbw-tracker-dot: #000;
  position: relative;
  display: block;
  width: 100%;
  height: 500px;
  overflow: hidden;
  cursor: crosshair;
}

/* In a flexbox Elementor container, the widget itself must stretch. A fixed
   380px child inside a 380px min-height parent adds to its padding/gap. */
.elementor-widget:has(.jbw-hover-tracker.jbw-fill-container) {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  align-self: stretch;
  min-height: 0;
  margin-bottom: 0;
}

.elementor-widget:has(.jbw-hover-tracker.jbw-fill-container) > .elementor-widget-container {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
}

.jbw-hover-tracker.jbw-fill-container {
  flex: 1 1 auto;
  height: 100%;
  min-height: 0;
}

.jbw-hover-tracker-v,
.jbw-hover-tracker-h,
.jbw-hover-tracker-dot {
  position: absolute;
  display: block;
  margin: 0;
  padding: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity .25s ease;
}

.jbw-hover-tracker-v {
  top: 0;
  bottom: 0;
  left: var(--jbw-tracker-x);
  width: 1px;
  background: var(--jbw-tracker-line);
}

.jbw-hover-tracker-h {
  top: var(--jbw-tracker-y);
  right: 0;
  left: 0;
  height: 1px;
  background: var(--jbw-tracker-line);
}

.jbw-hover-tracker-dot {
  top: var(--jbw-tracker-y);
  left: var(--jbw-tracker-x);
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--jbw-tracker-dot);
  transform: translate(-50%, -50%);
}

.jbw-hover-tracker.is-tracking :is(.jbw-hover-tracker-v, .jbw-hover-tracker-h, .jbw-hover-tracker-dot) {
  opacity: 1;
}

@media (hover: none), (pointer: coarse) {
  .jbw-hover-tracker { cursor: auto; }
  .jbw-hover-tracker :is(.jbw-hover-tracker-v, .jbw-hover-tracker-h, .jbw-hover-tracker-dot) { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .jbw-hover-tracker :is(.jbw-hover-tracker-v, .jbw-hover-tracker-h, .jbw-hover-tracker-dot) { transition: none; }
}
