.flag-container {
    display: flex;
    gap: 8px;
    margin-top: 10px;
}

#random-flags .flag {
    height: 30px;
    margin: .25rem;
    border-radius: .25rem; /* Rend chaque drapeau circulaire */
    cursor: pointer; /* Change le curseur pour indiquer que les drapeaux sont cliquables */
    object-fit: 'cover';
    display: block;
}

#random-flags .flag img {
    width: 100%;
    height: 100%;
}

#suggestions {
    overflow-y: hidden; /* Empêche l'apparition de l'ascenseur */
    border: none;
}

.suggestion-item {
    padding: 5px;
    cursor: pointer; /* Change le curseur pour montrer que les suggestions sont cliquables */
    background-color: #EEE; /* Change le fond au survol pour un effet visuel */
    z-index: 200;
}

.suggestion-item:hover {
    background-color: #FFF; /* Change le fond au survol pour un effet visuel */
}

#validation-result {
    margin-top: 10px;
    font-weight: bold; /* Rend le texte du résultat de validation plus proéminent */
}