/*
 * Tabelle che stanno nello schermo (issue #93).
 *
 * Le tabelle Filament vanno in overflow orizzontale quando le colonne non
 * ci stanno: su molti mouse e sistemi operativi lo scorrimento laterale non
 * è disponibile, quindi il contenuto oltre il bordo diventa IRRAGGIUNGIBILE.
 * Il caso reale che ha aperto la segnalazione è un desktop a zoom 200%
 * (1881px fisici = ~940px CSS).
 *
 * Rimedio: le celle vanno a capo invece di allargare la tabella, e le
 * colonne meno essenziali sono nascoste di default (riattivabili dal menu
 * "Colonne"). Nessuna larghezza fissa: la tabella si adatta al viewport.
 */

/* La tabella non supera mai il contenitore. */
.fi-ta-content {
    overflow-x: auto; /* rete di sicurezza: se proprio serve, lo scroll c'è */
    max-width: 100%;
}

.fi-ta-table {
    width: 100%;
    table-layout: auto;
}

/* Il testo va a CAPO invece di spingere la colonna in larghezza. */
.fi-ta-table :is(th, td) {
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* Le intestazioni non devono forzare la larghezza minima della colonna. */
.fi-ta-header-cell-label {
    white-space: normal;
}

/* Badge e pill restano su una riga (sono corti) ma non allargano la cella. */
.fi-ta-table :is(th, td) .fi-badge {
    white-space: nowrap;
    max-width: 100%;
}

/* Colonna azioni compatta: è il maggior consumatore di larghezza. */
.fi-ta-actions {
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.25rem;
}

/* Rete di sicurezza (issue #107): un pulsante con etichetta lunga resta più
   largo della cella e finisce SOPRA le scritte della colonna accanto — il
   `flex-wrap` qui sopra manda a capo i pulsanti fra loro, non il testo dentro
   il singolo pulsante.
   La prima versione lasciava andare a capo anche DENTRO il pulsante
   (`overflow-wrap: anywhere`): in una cella molto stretta — un desktop a zoom
   200% — non c'era nessuna larghezza in cui una parola sola potesse stare, e
   «Consegna» si spezzava una lettera per riga, illeggibile in verticale
   (issue #141). Il testo di un pulsante resta quindi SEMPRE su una riga: se
   proprio non ci sta viene troncato con i puntini, che è brutto ma si legge e
   non invade la colonna accanto.
   Il rimedio vero resta accorciare la colonna: icone col suggerimento del
   mouse dove le azioni sono poche (riepilogo preparazioni), menu ⋮ dove sono
   tante (lista ordini). */
.fi-ta-actions .fi-btn {
    max-width: 100%;
    min-width: 0;
}

.fi-ta-actions .fi-btn .fi-btn-label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* La colonna delle azioni si prende la larghezza che le serve (poca: sono
   pulsanti corti) e la toglie alle colonne di testo, che sanno andare a capo.
   Senza questo, la regola generale qui sopra tratta la cella dei pulsanti come
   tutte le altre e la comprime fino a nasconderli (issue #141). */
.fi-ta-table td:has(> .fi-ta-actions) {
    width: 1%;
    white-space: nowrap;
}

/* Sotto i 1100px CSS (desktop a zoom alto, notebook piccoli) si stringe
   ulteriormente: meno padding, testi più compatti. */
@media (max-width: 1100px) {
    .fi-ta-table :is(th, td) {
        padding-inline: 0.5rem;
        font-size: 0.8125rem;
    }

    .fi-ta-table .fi-ta-text-item-label {
        font-size: 0.8125rem;
    }
}

/* La pagina non deve MAI scorrere lateralmente nel suo insieme. */
.fi-main,
.fi-page {
    max-width: 100%;
    overflow-x: clip;
}