/* PPL NIBBIO v2 — Modalita' lettura (dispense e capitoli libro)
   Il contenuto originale della pagina sta in #lettura con il SUO css (body -> #lettura).
   Qui si spengono solo i pezzi della vecchia cornice e si normalizza la colonna. */

body { overflow-x: hidden; }
#lettura {
    padding: 0 !important; margin: 0 !important; max-width: none !important; min-height: 0 !important;
    background: transparent !important; box-shadow: none !important;
    font-family: Inter, "Segoe UI", system-ui, sans-serif !important;
    line-height: 1.65;
}
#lettura .container, #lettura .main, #lettura main {
    max-width: none !important; margin: 0 !important; padding: 0 !important;
    box-shadow: none !important; background: transparent !important;
}
/* cornice vecchia, se qualche pagina l'ha in posti insoliti */
#lettura nav.indice, #lettura .sidebar-toggle, #lettura .header-buttons,
#lettura .btn-home, #lettura .nav-home, #lettura .back-link, #lettura .back, #lettura .navbar, #lettura .top-bar {
    display: none !important;
}
/* pulsanti propri della pagina spostati nella barra lettura */
.barra-pulsanti button, .barra-pulsanti a:not(.v2) {
    text-decoration: none;
    padding: 6px 12px; border: 0; border-radius: 8px; cursor: pointer;
    background: #f1f5f9; color: #334155; font: 500 12px/16px Inter, system-ui, sans-serif;
}
.barra-pulsanti button:hover, .barra-pulsanti a:not(.v2):hover { background: #e2e8f0; }
@media (max-width: 640px) { .barra-pulsanti { flex-wrap: wrap; flex-shrink: 1 !important; min-width: 0; max-width: 100%; } }
/* sezioni e figure: stesso stile del libro (bianco su chiaro) */
#lettura section { box-shadow: none !important; border: 1px solid #e2e8f0; }
#lettura .figura img { cursor: zoom-in; }
#lettura .nav-argomenti { flex-wrap: wrap; gap: 8px; }
#lettura table { max-width: 100%; }
#lettura img { max-width: 100%; height: auto; }
/* modal slide a tutto schermo deve uscire dalla colonna */
#lettura .slide-modal, #lettura .img-modal, #lettura .overlay { position: fixed !important; }

/* telefono: niente scorrimento laterale della pagina; le tabelle larghe scorrono da sole */
@media (max-width: 640px) {
    #lettura { overflow-wrap: break-word; }
    #lettura table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    #lettura pre { overflow-x: auto; }
    #lettura svg[viewBox] { max-width: 100%; height: auto; }
    #lettura .topics-grid { grid-template-columns: 1fr !important; }
    #lettura .topics-grid > * { grid-column: auto !important; }
}

@media (max-width: 1023px) {
    aside.no-print { position: static !important; }
}
@media print {
    header, footer, .no-print, #velo-auth, .barra-pulsanti { display: none !important; }
    main { padding-top: 0 !important; }
    article { box-shadow: none !important; padding: 0 !important; max-width: none !important; }
    #lettura .nav-argomenti { display: none !important; }
}