/* ═══════════════════════════════════════════════
   WORLD MAP — HIGHLIGHT & TOOLTIP STYLES
   Kept separate so style.css resets don't wipe it
   ═══════════════════════════════════════════════ */

/* Override the brightness/invert filter so cyan countries stay visible */
.world-map-image {
  filter: contrast(1.08) drop-shadow(0 0 10px rgba(0,229,255,0.2)) !important;
}

/* Transparent SVG overlay that sits on top of the <img> for hit-testing */
.map-overlay {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  pointer-events: none;
}

/* Invisible country shapes — only capture mouse events */
.map-hit {
  fill: transparent;
  pointer-events: all;
  cursor: pointer;
}
body.custom-cursor-ready .map-hit {
  cursor: none;
}

/* Tooltip that follows the cursor */
.map-tooltip {
  position: absolute;
  pointer-events: none;
  z-index: 10;
  background: rgba(10,10,10,0.88);
  border: 1px solid #00E5FF;
  color: #00E5FF;
  font-family: 'IBM Plex Mono', 'Courier New', monospace;
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  padding: 6px 12px;
  white-space: nowrap;
  opacity: 0;
  transition: opacity 0.15s ease;
}
.map-tooltip.visible { opacity: 1; }