/* Tooltip container */
.tooltip {
    position: relative;
    display: inline-block;
}

/* Tooltip text */
.tooltip .tooltiptext {
    visibility: hidden;
    width: 200px; /* Largeur du tooltip */
    max-width: 300px; /* Largeur maximale du tooltip */
    background-color: black;
    color: white;
    text-align: center;
    border-radius: 8px; /* Bordure arrondie */
    padding: 10px; /* Espacement intérieur */
    font-size: 14px; /* Taille de la police */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; /* Police de caractères de Bootstrap */
    font-style: italic; /* Ajout de l'italique */
    position: absolute;
    z-index: 1;
    bottom: 150%; /* Distance par rapport à l'élément parent */
    left: 50%;
    transform: translateX(-50%); /* Centre le tooltip horizontalement */
    opacity: 0;
    transition: opacity 0.3s;
    overflow: visible; /* Autorise le débordement du texte */
}

/* Show the tooltip text when hovering over the tooltip container */
.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}