/* Composant Infobulle — autonome, sans dependance (ni Bootstrap, ni jQuery, ni
   jadminV2.css). Pour l'utiliser sur une page : charger ce fichier et infobulle.js,
   puis poser data-aide="texte" sur n'importe quel element.

   La bulle est posee en position fixe sur le document, et non dans le flux : un
   conteneur qui defile (overflow) couperait une bulle construite en CSS pur. */

.jp-infobulle {
    --bulle-fond: #111827;
    position: fixed;
    left: 0;
    top: 0;
    z-index: var(--z-tooltip, 1200);
    max-width: 340px;
    padding: 8px 11px;
    border-radius: 6px;
    background: var(--bulle-fond);
    color: #f9fafb;
    font-size: 12px;
    line-height: 1.45;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.24);
    opacity: 0;
    pointer-events: none;
    transform: translateY(3px);
    transition: opacity 0.12s ease, transform 0.12s ease;
}
.jp-infobulle--visible {
    opacity: 1;
    transform: translateY(0);
}
.jp-infobulle::after {
    content: '';
    position: absolute;
    top: 100%;
    left: var(--fleche, 50%);
    margin-left: -5px;
    border: 5px solid transparent;
    border-top-color: var(--bulle-fond);
}
.jp-infobulle--dessous::after {
    top: auto;
    bottom: 100%;
    border-top-color: transparent;
    border-bottom-color: var(--bulle-fond);
}

/* Les liens et boutons gardent leur propre curseur. */
[data-aide]:not(a):not(button) {
    cursor: help;
}

/* Theme sombre de jadminV2 : sans effet sur les pages qui ne le portent pas. */
body.jpadmin-dark .jp-infobulle {
    --bulle-fond: #2f2f3a;
}
