/* nx-legale.css — 24/10/2026 · documenti legali versionati (Tappa 1)
   Caricato SOLO da legal.php via $additional_css, dopo nx-v2.css.
   NON è nexus-legal.css (quello veste badge e modali delle linee guida): qui c'è la pagina
   dei documenti (indice + testo Markdown reso).

   Componenti (STANDARD-UI §3):
   .nx-legale-griglia · .nx-legale-indice/-titolo · .nx-legale-voci/-voce/-voce-link(.is-on)
   .nx-legale-articolo · .nx-legale-meta/-voce/-eti/-val(.is-gold)
   .nx-legale-testo · -h2/-h3/-h4 · -p · -ul/-ol/-li · -b · -i · -link · -hr
   .nx-legale-avviso/-ico/-testo · .nx-legale-segnaposto · .nx-legale-vuoto/-segno/-testo

   Solo token --nx-*: nessun colore scritto a mano. Il tema chiaro cambia i valori dei token,
   non le regole: nessun override di colore qui sotto, tranne dove serve leggibilità. */

/* ── pagina: stessa misura della dashboard (max 1400, padding dai token) ──── */
.nx-legale-pagina{
    margin-top:0;
    max-width:1400px;
    width:100%;
    padding-top:calc(var(--eco-header-h, 68px) + var(--nx-s5));
    padding-left:clamp(12px,2.5vw,40px);
    padding-right:clamp(12px,2.5vw,40px);
}

/* DENTRO LA COLONNA UTENTE (24/10/2026) — quando la pagina sta in `.nx-app-shell`
   l'offset dell'header lo dà già lo scheletro della dashboard: qui si toglie il doppione.
   La larghezza la governa `.nx-app-workspace` (max 1400 sui figli). */
.nx-app-workspace.nx-legale-pagina{
    margin:0;
    max-width:none;
    width:auto;
    padding-top:0;
}

/* LA COLONNA QUI STA NEL FLUSSO (24/10/2026) — sulla pagina legale la colonna non deve
   coprire il documento: resta agganciata sotto l'header e il testo parte alla sua destra.
   Vale solo dentro `.nx-legale-shell`: la dashboard non viene toccata. */
@media (min-width: 993px){
    .nx-legale-shell{
        overflow: visible;
        padding-top: 8px;
    }
    .nx-legale-shell .nx-app-sidebar{
        position: sticky;
        top: calc(var(--eco-header-h, 68px) + 12px);
        bottom: auto;
        align-self: flex-start;
        height: auto;
        max-height: calc(100vh - var(--eco-header-h, 68px) - 24px);
        overflow-y: auto;
        overflow-x: hidden;
    }
}

/* ── griglia: indice + documento ───────────────────────────────────────────── */
.nx-legale-griglia{
    display:grid;
    grid-template-columns:minmax(240px,280px) minmax(0,1fr);
    gap:var(--nx-s5);
    align-items:start;
}

.nx-legale-indice{
    position:sticky;
    top:calc(var(--eco-header-h, 68px) + var(--nx-s4));
    padding:var(--nx-s4);
}

.nx-legale-voci{ list-style:none; margin:0; padding:0; display:grid; gap:3px; }
.nx-legale-voce{ margin:0; }

.nx-legale-voce-link{
    display:flex;
    align-items:center;
    gap:10px;
    padding:7px 8px;
    border-radius:var(--nx-r-sm);
    color:var(--nx-text-mid);
    font-size:.84rem;
    line-height:1.3;
    text-decoration:none;
    transition:var(--nx-t);
}
.nx-legale-voce-link:hover{ background:var(--nx-hover); color:var(--nx-text); }
.nx-legale-voce-link.is-on{
    background:var(--nx-gold-a12);
    color:var(--nx-gold);
    font-weight:600;
    box-shadow:inset 0 0 0 1px var(--nx-gold-a28);
}
.nx-legale-voce-ico{
    display:grid;
    place-items:center;
    width:30px;
    height:30px;
    flex:0 0 auto;
    border-radius:8px;
    background:var(--nx-blue-a10);
    border:1px solid var(--nx-blue-a22);
    color:var(--nx-blue);
}
.nx-legale-voce-ico svg{ width:15px; height:15px; }
.nx-legale-voce-link.is-on .nx-legale-voce-ico{
    background:var(--nx-gold-a12);
    border-color:var(--nx-gold-a28);
    color:var(--nx-gold);
}
.nx-legale-voce-testo{ flex:1 1 auto; min-width:0; }
.nx-legale-voce-freccia{ width:14px; height:14px; flex:0 0 auto; opacity:.45; }
.nx-legale-voce-link.is-on .nx-legale-voce-freccia{ opacity:1; }

/* ── articolo ─────────────────────────────────────────────────────────────── */
.nx-legale-articolo{ padding:var(--nx-s5); min-width:0; }
.nx-legale-articolo > .nx-log-head{
    margin-bottom:var(--nx-s4);
    padding-bottom:var(--nx-s3);
    border-bottom:1px solid var(--nx-line);
}

/* ── testo reso dal Markdown (una classe per elemento: niente selettori nudi) ─ */
.nx-legale-testo{
    max-width:76ch;
    font-size:.95rem;
    line-height:1.78;
    color:var(--nx-text-mid);
}
.nx-legale-h2{
    margin:0 0 var(--nx-s4);
    font-family:var(--nx-font-display);
    font-size:1.28rem;
    font-weight:700;
    letter-spacing:-.015em;
    color:var(--nx-text);
}
.nx-legale-h3{
    margin:var(--nx-s6) 0 var(--nx-s3);
    padding-left:11px;
    border-left:3px solid var(--nx-gold);
    font-family:var(--nx-font-display);
    font-size:1.06rem;
    font-weight:600;
    line-height:1.35;
    color:var(--nx-text);
}
.nx-legale-h4{
    margin:var(--nx-s5) 0 var(--nx-s2);
    font-size:.96rem;
    font-weight:600;
    color:var(--nx-text);
}
.nx-legale-p{ margin:0 0 var(--nx-s4); }
.nx-legale-p:last-child{ margin-bottom:0; }
.nx-legale-ul,
.nx-legale-ol{ margin:0 0 var(--nx-s4); padding-left:1.3rem; }
.nx-legale-li{ margin:0 0 8px; padding-left:2px; }
.nx-legale-li::marker{ color:var(--nx-gold); }
.nx-legale-b{ color:var(--nx-text); font-weight:600; }
.nx-legale-i{ color:var(--nx-text-dim); }
.nx-legale-link{
    color:var(--nx-blue);
    text-decoration:underline;
    text-underline-offset:2px;
}
.nx-legale-link:hover{ color:var(--nx-blue-deep); }
.nx-legale-hr{
    border:0;
    border-top:1px solid var(--nx-line-2);
    margin:var(--nx-s5) 0;
}

/* ── avvisi (traduzione in corso · dati provvisori · segnaposto ignoti) ────── */
.nx-legale-avviso{
    display:flex;
    align-items:flex-start;
    gap:12px;
    margin:0 0 var(--nx-s4);
    padding:12px 16px;
    background:var(--nx-warn-a10);
    border:1px solid var(--nx-warn-a25);
    border-radius:var(--nx-r);
}
.nx-legale-avviso-ico{
    display:grid;
    place-items:center;
    width:30px;
    height:30px;
    flex:0 0 auto;
    border-radius:8px;
    background:var(--nx-warn-a10);
    border:1px solid var(--nx-warn-a25);
    color:var(--nx-warn);
}
.nx-legale-avviso-ico svg{ width:15px; height:15px; }
.nx-legale-avviso-testo{ margin:0; padding-top:5px; font-size:.82rem; line-height:1.55; color:var(--nx-text-mid); }
.nx-legale-segnaposto{
    display:inline-block;
    margin-left:4px;
    padding:1px 6px;
    border-radius:99px;
    background:var(--nx-warn-a10);
    border:1px solid var(--nx-warn-a25);
    font-family:var(--nx-font-display);
    font-size:.72rem;
    color:var(--nx-warn);
}

/* ── documento inesistente / archivio non creato ──────────────────────────── */
.nx-legale-vuoto{ display:flex; align-items:baseline; gap:var(--nx-s4); }
.nx-legale-vuoto-segno{
    font-family:var(--nx-font-display);
    font-size:2.4rem;
    font-weight:700;
    line-height:1;
    color:var(--nx-gold);
    font-variant-numeric:tabular-nums;
}
.nx-legale-vuoto-testo{ margin:0; font-size:.9rem; line-height:1.6; color:var(--nx-text-mid); }

/* ── responsive ───────────────────────────────────────────────────────────── */
@media (max-width:900px){
    .nx-legale-griglia{ grid-template-columns:1fr; }
    .nx-legale-indice{ position:static; }
    .nx-legale-pagina .nx-head{ margin-left:0; margin-right:0; }
}
@media (max-width:560px){
    .nx-legale-pagina{ padding-left:var(--nx-s4); padding-right:var(--nx-s4); }
    .nx-legale-articolo{ padding:var(--nx-s4); }
    .nx-legale-vuoto{ flex-direction:column; gap:var(--nx-s2); align-items:flex-start; }
    .nx-legale-vuoto-segno{ font-size:1.8rem; }
}
