/* ============================================
   FIX AUTOCOMPLETE : positionnement et z-index
   ============================================ */

/* Le wrapper doit être en relative ET avoir un contexte d'empilement clair */
.autocomplete-wrapper {
    position: relative;
    z-index: 50;
}

/* Liste : z-index très haut pour passer au-dessus de tout */
.autocomplete {
    position: absolute !important;
    top: 100%;
    left: 0;
    right: 0;
    margin-top: 4px;
    z-index: 9999 !important;
    background: var(--abyss);
    border: 1px solid var(--gold);
    border-radius: 6px;
    overflow-y: auto;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.7), 0 4px 12px rgba(0, 0, 0, 0.4);
}

/* Mode FLIP UP : la liste s'ouvre vers le HAUT au lieu du bas */
.autocomplete.autocomplete--flip-up {
    top: auto;
    bottom: 100%;
    margin-top: 0;
    margin-bottom: 4px;
    box-shadow: 0 -16px 40px rgba(0, 0, 0, 0.7), 0 -4px 12px rgba(0, 0, 0, 0.4);
}

/* Au cas où un parent a un overflow: hidden qui couperait la liste,
   on force le conteneur du formulaire à pas masquer ce qui dépasse */
form .autocomplete-wrapper,
[id="add-loot"],
[id="add-loot"] form {
    overflow: visible !important;
}

/* Bonus : la cellule de tableau qui contient l'autocomplete (si elle existe) */
.data-table td .autocomplete-wrapper {
    overflow: visible;
}