.mt-user-profile-badge {
    text-align: center;
    display: inline-block;
    width: 100%;
}

.mt-user-profile-level {
    margin-bottom: 10px;
}

.mt-user-profile-level .mt-user-favicon {
    width: 40px;
    height: 40px;
    display: inline-block;
    object-fit: contain;
}

.mt-user-level-name {
    margin-top: 5px;
    font-weight: 600;
    line-height: 1.2;
}

.mt-user-profile-badge-image {
    margin-top: 8px;
}

.mt-user-badge {
    max-width: 220px;
    width: 100%;
    height: auto;
    display: inline-block;
}

/* Utile se usi [mt_user_favicon] o [mt_user_level] fuori dal profilo */
/*.mt-user-favicon {
    width: 54px;
    height: 54px;
    object-fit: contain;
    vertical-align: middle;
}
*/

.mt-user-level {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}



.mt-avatar-container {
    position: relative;
    display: inline-block; /* Assicura che il contenitore si adatti al contenuto */
}

.mt-avatar-container img.avatar {
    /* Stili opzionali per l'avatar, es. bordo arrotondato */
    border-radius: 10%;
    display: block; /* Rimuove lo spazio extra sotto l'immagine */
}

.mt-favicon-overlay {
    position: absolute;
    bottom: 0;
    right: 0;
    transform: translate(21px, 13px); /* sposta a destra (6px) e in basso (6px) */
    z-index: 10;
    pointer-events: none; /* evita interferenze con click sull'avatar */
    /* Potresti voler aggiungere un piccolo padding o un background per il favicon */
    /* background-color: white; */
    /* border-radius: 50%; */
    /* padding: 2px; */
}

.mt-user-favicon { /* Classe usata dalla tua funzione user_favicon() */
    width: 55px; /* Dimensione desiderata per il favicon */
    height: 55px; /* Dimensione desiderata per il favicon */
    display: block;
}