/* ============================================================
   Turnierwelt Tooltip Design für MKTT-Online
   © 2025 Dirk Gelhausen | turnierwelt.com
   ============================================================ */

#tooltip {
  position: absolute;
  z-index: 1000;
  background: linear-gradient(to bottom right, #001f4d, #003b80);
  color: #fff;
  padding: 10px 14px;
  border-radius: 10px;
  border: 2px solid #ff6600;
  font-size: 13px;
  line-height: 1.4;
  font-family: "Segoe UI", Arial, sans-serif;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
  transition: opacity 0.15s ease, transform 0.15s ease;
  opacity: 0.95;
  pointer-events: none;
}

#tooltip::after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 50%;
  margin-left: -6px;
  border-width: 6px;
  border-style: solid;
  border-color: #003b80 transparent transparent transparent;
}

#tooltip.left::after {
  left: 10px;
}

#tooltip.right::after {
  right: 10px;
  left: auto;
}

#tooltip.top::after {
  top: -10px;
  bottom: auto;
  border-color: transparent transparent #003b80 transparent;
}

/* kleine Animation beim Einblenden */
@keyframes twTooltipFade {
  from { transform: translateY(-4px); opacity: 0; }
  to   { transform: translateY(0);   opacity: 0.95; }
}

#tooltip {
  animation: twTooltipFade 0.12s ease;
}