/* Albero espandibile del formattatore JSON.
   I nodi sono inline perché gli a capo e l'indentazione sono già testo dentro il <pre>
   (white-space: pre): un blocco qui spezzerebbe le righe in punti sbagliati, per esempio
   mandando a capo la virgola dopo un array annidato. */

.jf-node,
.jf-children {
    display: inline;
}

.jf-toggle {
    all: unset;
    cursor: pointer;
    display: inline-block;
    width: 1.1em;
    text-align: center;
    color: var(--bs-secondary-color, #6c757d);
    user-select: none;
}

.jf-toggle::before {
    content: '\25BE'; /* freccia giù: nel textContent non finisce, la copia resta pulita */
}

.jf-node.jf-collapsed > .jf-toggle::before {
    content: '\25B8'; /* freccia destra */
}

.jf-toggle:focus-visible {
    outline: 2px solid var(--bs-primary, #0d6efd);
    outline-offset: 1px;
    border-radius: 2px;
}

.jf-node.jf-collapsed > .jf-children {
    display: none;
}

/* L'ellissi e il conteggio vivono nell'attributo data-summary e il CSS li materializza
   solo a nodo compresso: così ciò che si copia resta il JSON, senza abbellimenti. */
.jf-node.jf-collapsed > .jf-ellipsis::before {
    content: ' \2026  ' attr(data-summary);
}

.jf-ellipsis {
    color: var(--bs-secondary-color, #6c757d);
}