/*
 * Telefono (< 640 px), 24/10/2026: niente scorrimento laterale.
 * Le righe delle tabelle marcate da js/mobile-tabelle.js (.tw-schede) diventano schede: titolo in alto (prima colonna),
 * poi etichetta | valore su due colonne, voci vuote nascoste, pulsanti in fondo.
 * Le schede in alto (Referenti, Documenti, Posta...) vanno a capo invece di uscire dallo schermo.
 */
@media (max-width: 639px) {
    .fi-ta-content-ctn:has(> table.tw-schede), .fi-ta-content:has(table.tw-schede) { overflow-x: visible !important; }
    div:has(> table.tw-schede) { overflow-x: visible !important; }

    table.tw-schede, table.tw-schede > tbody { display: block; width: 100% !important; min-width: 0 !important; }
    table.tw-schede > thead { display: none; }
    table.tw-schede > tfoot { display: block; }
    table.tw-schede > tbody > tr {
        display: block; position: relative;
        margin: .5rem .4rem; padding: .45rem .75rem;
        border: 1px solid rgba(127, 127, 127, .25); border-radius: .75rem;
        background: var(--tw-scheda-fondo, #fff);
        box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
    }
    .dark table.tw-schede > tbody > tr { --tw-scheda-fondo: rgba(255, 255, 255, .04); }

    table.tw-schede > tbody > tr > td {
        display: grid; grid-template-columns: minmax(5.5rem, 36%) 1fr; column-gap: .75rem; align-items: start;
        width: auto !important; min-width: 0 !important; max-width: none !important;
        padding: .22rem 0 !important; border: 0 !important; text-align: left;
        white-space: normal !important;
    }
    table.tw-schede > tbody > tr > td::before {
        content: attr(data-label);
        font-size: .7rem; font-weight: 600; text-transform: uppercase; letter-spacing: .02em; line-height: 1.2;
        color: rgb(107 114 128); padding-top: .2rem;
    }
    /* il valore sta SEMPRE nella colonna di destra, anche se fatto di più pezzi (es. icone dei Documenti) */
    table.tw-schede > tbody > tr > td[data-label]:not(.tw-titolo):not(.tw-azioni) > * { grid-column: 2; }
    table.tw-schede > tbody > tr > td > :empty:not(img):not(input) { display: none; }
    table.tw-schede .tw-nulla { display: none !important; }
    /* valori allineati a sinistra anche nelle colonne centrate/a destra della tabella */
    table.tw-schede > tbody > tr > td:not(.tw-azioni):not(.tw-scelta) :is(div, a, span, p) { text-align: left !important; justify-content: flex-start !important; margin-left: 0 !important; }
    table.tw-schede > tbody > tr > td:not([data-label]) { grid-template-columns: 1fr; }
    table.tw-schede > tbody > tr > td:not([data-label])::before { content: none; }
    /* il contenuto delle celle di Filament ha i suoi margini da tabella: sul telefono via */
    table.tw-schede > tbody > tr > td > * { min-width: 0; max-width: 100%; padding: 0 !important; margin: 0 !important; }
    table.tw-schede > tbody > tr > td :is(.fi-ta-col, .fi-ta-text, .fi-ta-icon, .fi-ta-image, .fi-ta-color, .fi-ta-view, .fi-ta-col-wrp, .fi-ta-placeholder) {
        padding: 0 !important; min-height: 0 !important;
    }
    table.tw-schede > tbody > tr > td * { white-space: normal !important; overflow-wrap: anywhere; }
    table.tw-schede > tbody > tr > td.tw-vuota, table.tw-schede > tbody > tr > td:empty { display: none; }

    /* titolo della scheda */
    table.tw-schede > tbody > tr > td.tw-titolo { display: block; padding: .15rem 2rem .35rem 0 !important; font-size: 1rem; font-weight: 700; }
    table.tw-schede > tbody > tr > td.tw-titolo::before { content: none; }
    table.tw-schede > tbody > tr > td.tw-titolo * { font-weight: 700; }

    /* casella di selezione in alto a destra, pulsanti in fondo */
    table.tw-schede > tbody > tr > td.tw-scelta { position: absolute; top: .55rem; right: .6rem; display: block; padding: 0 !important; z-index: 1; }
    /* pulsanti della scheda: griglia ordinata di bottoncini uguali (niente pulsante spaiato su una riga sola) */
    table.tw-schede > tbody > tr > td.tw-azioni {
        display: block; margin-top: .35rem; padding-top: .5rem !important;
        border-top: 1px solid rgba(127, 127, 127, .18) !important;
    }
    table.tw-schede > tbody > tr > td.tw-azioni::before { content: none; }
    table.tw-schede > tbody > tr > td.tw-azioni > .fi-ta-actions {
        display: grid !important; grid-template-columns: repeat(auto-fit, minmax(5.6rem, 1fr)); gap: .4rem; width: 100%;
    }
    table.tw-schede > tbody > tr > td.tw-azioni > .fi-ta-actions > :is(a, button, .fi-dropdown) {
        display: flex !important; align-items: center; justify-content: center; gap: .3rem;
        min-height: 2.25rem; padding: .3rem .5rem !important; margin: 0 !important;
        border: 1px solid rgba(127, 127, 127, .3); border-radius: .5rem;
        text-decoration: none !important; white-space: nowrap !important; font-size: .8rem;
    }
    table.tw-schede > tbody > tr > td.tw-azioni > .fi-ta-actions > .fi-dropdown > * { width: 100%; justify-content: center; }
    table.tw-schede > tbody > tr > td.tw-azioni * { white-space: nowrap !important; }

    /* righe a tutta larghezza (gruppi, "nessun risultato") */
    table.tw-schede > tbody > tr.tw-riga-intera { border: 0; box-shadow: none; background: none; padding: 0; }
    table.tw-schede > tbody > tr.tw-riga-intera > td { display: block; }
    table.tw-schede > tbody > tr.tw-riga-intera > td::before { content: none; }

    /* pulsanti in cima alle pagine (Invia email, Inoltra a azienda, Drive...): due colonne, larghi uguale */
    .fi-header-actions-ctn { width: 100%; }
    .fi-header-actions-ctn > .fi-ac { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: .5rem; width: 100%; }
    .fi-header-actions-ctn > .fi-ac > * { width: 100%; min-width: 0; justify-content: center; }
    .fi-header-actions-ctn > .fi-ac > * > :is(button, a) { width: 100%; justify-content: center; }
    .fi-header-actions-ctn > .fi-ac > .fi-dropdown > * { width: 100%; justify-content: center; }
    .fi-header-actions-ctn > .fi-ac .fi-dropdown-trigger > :is(button, a) { width: 100%; justify-content: center; }
    .fi-header-actions-ctn > .fi-ac > * :is(span) { white-space: normal; text-align: center; }

    /* barra delle schede (Referenti, Documenti, Posta...): va a capo */
    .fi-tabs { flex-wrap: wrap !important; overflow-x: visible !important; row-gap: .25rem; }
}