/* Quick-win mobile (globale). mobile-fix.js avvolge ogni tabella-dati (incluse le DataTables)
   in un contenitore .table-responsive; qui la rendo scrollabile e le do la larghezza naturale
   su schermi stretti, cosi' invece di schiacciarsi (colonne sovrapposte / testo a capo
   lettera-per-lettera) scorre in orizzontale con uno swipe. */

.table-responsive { -webkit-overflow-scrolling: touch; }

@media (max-width: 991.98px) {
    /* La pagina non scrolla di lato: scrolla la singola tabella nel suo box. */
    body { overflow-x: hidden; }

    /* La tabella prende la larghezza dei suoi contenuti (non si comprime): diventa piu'
       larga del box e il .table-responsive la fa scorrere. Annullo le larghezze fisse che
       DataTables imposta su tabella e celle (autoWidth), altrimenti le colonne si sovrappongono. */
    .table-responsive > table {
        width: auto !important;
        min-width: 100%;
        table-layout: auto !important;
    }
    .table-responsive > table > thead > tr > th,
    .table-responsive > table > tbody > tr > td,
    .table-responsive > table > tbody > tr > th {
        white-space: nowrap;
        width: auto !important;
    }

    /* I badge (Progetto/Intervento, stati, ecc.) non si spezzano su piu' righe. */
    .badge { white-space: nowrap; }
}