/* Impedisce al testo lungo di spaccare il layout e lo manda a capo */
.fancytree-title {
    white-space: normal !important; 
    display: inline-block !important;
    vertical-align: top;
    max-width: 95%; /* Lascia spazio alle icone */
    word-break: break-word;
    font-size: 0.9rem;
}

/* Rimuove lo sfondo bianco fastidioso e i bordi tratteggiati del focus */
#using_json, 
ul.fancytree-container {
    background-color: transparent !important;
    border: none !important;
    outline: none !important;
    width: 100% !important;
}

/* Colora il nodo selezionato con il tuo blu */
.fancytree-node.fancytree-active .fancytree-title {
    background-color: var(--main-blue-color) !important;
    color: #fff !important;
    border: none !important;
}

/* Aggiunge un po' di respiro tra i nodi */
.fancytree-node {
    padding: 4px 0 !important;
    border: 1px solid transparent !important;
}

#leit_details {
  white-space: pre-line; /* Rispetta i ritorni a capo del database */
  font-size: 0.95rem;
  line-height: 1.5;
}


/* Tronca il testo dei nodi su una sola riga con i tre puntini */
.fancytree-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap !important; 
    display: inline-block;
    vertical-align: middle;
}

/* Opzionale: Mostra il testo intero quando ci passi sopra con il mouse */
/*.fancytree-node:hover .fancytree-title {
    max-width: none;
    white-space: normal !important;
    background: #f8f9fa;
    z-index: 999;
    position: relative;
}*/

/* Allinea icone e testo correttamente */
.fancytree-icon {
    width: 20px !important;
    text-align: center !important;
    margin-right: 8px !important;
}