/**
 * Range Tooltip Styles
 */

.range-machine-badge {
  position: relative;
}

/* =============================================
   LIST VIEW: Tooltip opens to the RIGHT
   First qualifying event aligned with badge
   ============================================= */
.athlete-row .range-machine-badge .range-tooltip {
  position: absolute;
  left: calc(100% + 10px);
  bottom: -20px;
  top: auto;
  transform: none;
  right: auto;
  z-index: 9999;
  pointer-events: none;
}

/* Arrow points LEFT, positioned at bottom to align with badge */
.athlete-row .range-machine-badge .range-tooltip .tooltip-arrow {
  position: absolute;
  left: -8px;
  bottom: 24px;
  top: auto;
  right: auto;
  transform: none;
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: none;
  border-right: 8px solid rgb(24 24 27);
}

.dark .athlete-row .range-machine-badge .range-tooltip .tooltip-arrow {
  border-right: 8px solid rgb(63 63 70);
}

/* =============================================
   CARD VIEW (non-list): Tooltip opens DOWN-RIGHT
   ============================================= */
.athlete-card .range-machine-badge .range-tooltip,
.range-machine-badge .range-tooltip {
  position: absolute;
  left: 0;
  top: calc(100% + 10px);
  bottom: auto;
  right: auto;
  transform: none;
  z-index: 9999;
  pointer-events: none;
}

/* Arrow points UP */
.athlete-card .range-machine-badge .range-tooltip .tooltip-arrow,
.range-machine-badge .range-tooltip .tooltip-arrow {
  position: absolute;
  bottom: 100%;
  left: 16px;
  transform: none;
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid rgb(24 24 27);
}

.dark .athlete-card .range-machine-badge .range-tooltip .tooltip-arrow,
.dark .range-machine-badge .range-tooltip .tooltip-arrow {
  border-bottom-color: rgb(63 63 70);
}