.tooltip {
    position: fixed;
    left: 50%;
    bottom: 25px;
    transform: translateX(-50%);
    display: inline-block;
    cursor: default; /* Sets cursor to default */
}

.tooltip .Tooltip_text {
    visibility: hidden;
    background-color: #333;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 8px 16px;
    position: absolute;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s, transform 0.3s; /* Transition for fade and movement */
    left: 50%;
    transform: translateX(-50%) translateY(-80%); /* Start slightly below */
    white-space: nowrap; /* Prevents text from wrapping */
}

.tooltip .Tooltip_text.show {
    visibility: visible;
    opacity: 1;
    transform: translateX(-50%) translateY(-110%); /* Move to original position */
}
