/* -------------------------------------
  Hidden Info Card
-------------------------------------- */
.label-row {
  display: flex;
  position: relative;
}

.info-icon {
  font-size: 1rem;
  cursor: pointer;
  opacity: 0;
  transition: opacity var(--transition-normal);
  padding: 8px;
  margin: -8px;
  border-radius: 50%;
}

.label-row:hover .info-icon {
  opacity: 1;
}

.info-card {
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: 6px;
  padding: 12px;
  background: var(--card-bg);
  color: var(--card-fg);
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);

  opacity: 0;
  transform: translateY(6px) scale(0.98);
  transition:
    opacity var(--transition-normal),
    transform var(--transition-normal);

  pointer-events: none;

  z-index: var(--z-tooltip);
}

.info-card.open {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

.info-card content {
  font-size: 1rem;
}

.info-card ul {
  margin: 0.5rem 0 0 0;
}

.info-card li {
  font-size: 1rem;
  margin: 0 0 0.25rem 0;
}

@media (max-width: 768px) {
  .info-card {
    width: 75vw;
  }
}