/* ============================================================
   DataTable JOORNA — comportamento unico di tutte le tabelle
   ------------------------------------------------------------
   Solo CSS (owner 9-ott-2026: niente ricalcoli dal vivo).
   - Scorre la PAGINA, non l'area righe: la tabella è alta quanto le
     sue righe (25 per pagina di partenza, AppServiceProvider) e la
     paginazione sta in fondo alla tabella.
   - Da 1280px la riga dei titoli resta ferma sotto la topbar mentre la
     pagina scorre: contenitore e area righe non tagliano più in
     "hidden"/"auto" (che fermerebbero lo sticky) ma in "clip".
   - Sotto i 1280px le colonne che non ci stanno scorrono in
     orizzontale dentro la tabella (la pagina non si allarga); lì la
     riga dei titoli scorre con la pagina.
   - Colonna Azioni ferma a destra, con un filetto che la separa.
   - Icone delle azioni sempre su una riga: misure e colori in
     public/css/actions.css (.jo-row-actions).
   Escluse: vista Card (.jo-ta-cards, le righe diventano card) e la
   board a colonne dei Lead (.jo-lb, ha il suo scorrimento).
   ============================================================ */

td.fi-ta-actions-cell {
    width: 1%;
    white-space: nowrap;
}

/* ── Riga dei titoli ferma sotto la topbar (pagina che scorre) ── */
@media (min-width: 1280px) {
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-ctn,
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-ctn > .fi-ta-content {
        overflow: clip;
    }

    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-content > table.fi-ta-table > thead > tr > th {
        top: var(--jo-topbar-h, 64px);
    }

    /* Tabelle nei modali e nei campi di form: titoli in cima al loro riquadro. */
    :is(.fi-modal, .fi-fo-component-ctn) .fi-ta:not(.jo-ta-cards) .fi-ta-content > table.fi-ta-table > thead > tr > th {
        top: 0;
    }
}

/* ── Tabelle che stanno nello schermo (da 1280px) ────────────
   Con la riga dei titoli ferma la tabella non può scorrere di lato:
   le colonne si stringono, i testi lunghi finiscono coi puntini (testo
   intero nel tooltip, ui-standard.js) e i titoli vanno su due righe. */
@media (min-width: 1280px) {
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table {
        width: 100%;
    }

    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell):not(.fi-ta-selection-cell) {
        max-width: 15rem;
        min-width: 0 !important;
        overflow: hidden;
    }

    /* Un selettore per tag: con * o :is() come soggetto Chrome prova la regola
       su ogni elemento della pagina a ogni ricalcolo dello stile (28-ott-2026). */
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) div,
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) span,
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) p,
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) a,
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) time,
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) img,
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) button,
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) label,
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) ul,
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) li {
        min-width: 0 !important;
        max-width: 100%;
    }

    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) .fi-ta-text-item-label,
.fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) .fi-ta-text-description,
.fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) .truncate,
.fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) span,
.fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) p,
.fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) a {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > thead > tr > th:not(:last-child):not(.fi-ta-selection-cell) {
        max-width: 15rem;
        min-width: 0 !important;
    }

    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > thead > tr > th:not(:last-child) div,
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > thead > tr > th:not(:last-child) span,
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > thead > tr > th:not(:last-child) button,
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > thead > tr > th:not(:last-child) a {
        white-space: normal !important;
        min-width: 0 !important;
    }

    /* Stato col pallino e valori che si cambiano dalla cella (Stato, In
       carico a): si stringono fino al nome breve, mai "Nuov" o "Assegı"
       (audit 12-ott-2026). Stessi :not() della regola sopra, che sennò vince. */
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell):not(.fi-ta-selection-cell):has(.jo-cell-status) {
        min-width: 6.5rem !important;
    }

    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell):not(.fi-ta-selection-cell):has(.jo-cell-menu-btn) {
        min-width: 9rem !important;
    }

    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:has(:is(.jo-cell-menu-btn, .jo-cell-status)) .fi-ta-text {
        flex: 1 1 auto;
    }

    /* Lo stato sta su una riga, mai a capo ("Ha / prenotato") né coi
       puntini: è il dato principale della cella (revisione 19-ott-2026). */
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) .jo-cell-status,
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) .jo-cell-status span {
        white-space: nowrap;
        overflow: visible;
        text-overflow: clip;
    }

    /* ...e la colonna non scende sotto lo stato intero ("Ha prenotato"). */
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) .jo-cell-status {
        min-width: max-content !important;
    }

    /* Titoli di colonna: a capo fra le parole in modo equilibrato. */
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > thead > tr > th:not(:last-child) .jo-colh > span:first-child {
        text-wrap: balance;
    }
}

/* Schermi da 1280 a 1439px (portatili da 13–14"): con la sidebar aperta
   Lead, Preventivatore, Automazioni, Campagne WhatsApp, Voucher, Richieste
   ospiti e Schede hotel sforavano di 25–160px (audit 12-ott-2026). Margini
   delle celle più stretti, imbuto e freccia d'ordinamento più piccoli (anche
   nascosti tengono il loro posto), colonne del Preventivatore più strette. */
@media (min-width: 1280px) and (max-width: 1439.98px) {
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > thead > tr > th.fi-ta-header-cell {
        padding-inline: 6px;
    }

    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell):not(.fi-ta-selection-cell) .fi-ta-col-wrp .px-3 {
        padding-inline: 6px;
    }

    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table .fi-ta-header-cell-sort-icon {
        width: 14px;
        height: 14px;
    }

    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table .jo-colf-btn {
        width: 16px;
    }

    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell):not(.fi-ta-selection-cell):has(.jo-cell-menu-btn) {
        min-width: 8rem !important;
    }

    html .fi-page .fi-ta:not(.jo-ta-cards) .jo-cell-menu-btn {
        gap: 2px;
    }

    html .fi-page .fi-ta:not(.jo-ta-cards) .jo-cell-menu-chevron {
        flex-basis: 12px;
        width: 12px;
        height: 12px;
    }

    .fi-page .fi-ta:not(.jo-ta-cards) .jo-qd-cell--quote {
        width: 115px;
    }

    /* Date della richiesta: vanno a capo dopo la freccia, mai tagliate. */
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) .jo-qd-cell--request .jo-qd-title {
        flex-wrap: wrap;
        row-gap: 0;
    }

    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) .jo-qd-cell--request .jo-qd-arrow,
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) .jo-q-dates .jo-q-arrow {
        flex: none;
        min-width: 14px !important;
    }

    /* Stesso a capo per il soggiorno delle Prenotazioni (arrivo → partenza · notti). */
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) .jo-q-dates {
        flex-wrap: wrap;
        row-gap: 0;
    }

    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) .jo-q-proposal .jo-q-clamp {
        max-width: 9.5rem;
    }

    /* Preventivi ▸ colonna Preventivo: scadenza e autore vanno a capo
       ("Prenotato · n. JRN-…") invece di allargare la colonna. */
    .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell) .jo-q-cell :is(.jo-q-expiry, .jo-q-faint) {
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }
}

/* ── Intestazioni sticky ─────────────────────────────────── */
:is(.fi-ta:not(.jo-ta-cards)) .fi-ta-content > table.fi-ta-table > thead > tr > th {
    position: sticky;
    top: 0;
    z-index: 3;
    /* Fondo pieno: le righe passano SOTTO l'intestazione. --jo-ui-soft
       in dark è trasparente, quindi si posa sulla superficie. */
    background: linear-gradient(var(--jo-ui-soft), var(--jo-ui-soft)), var(--jo-ui-surface);
    box-shadow: inset 0 -1px 0 var(--jo-ui-line);
}

/* Gruppi di colonne (due righe di intestazione): la seconda sotto la prima. */
:is(.fi-ta:not(.jo-ta-cards)) .fi-ta-content > table.fi-ta-table > thead > tr:first-child:not(:last-child) > th {
    position: static;
}

/* ── Colonna Azioni sticky a destra ──────────────────────── */
:is(.fi-ta:not(.jo-ta-cards)) .fi-ta-content > table.fi-ta-table > tbody > tr > td.fi-ta-actions-cell:last-child,
:is(.fi-ta:not(.jo-ta-cards)) .fi-ta-content > table.fi-ta-table:has(> tbody > tr > td.fi-ta-actions-cell:last-child) > thead > tr > th:last-child {
    position: sticky;
    right: 0;
}

:is(.fi-ta:not(.jo-ta-cards)) .fi-ta-content > table.fi-ta-table > tbody > tr > td.fi-ta-actions-cell:last-child {
    z-index: 2;
    /* Stesso fondo della riga (hover e selezione compresi), ma pieno. */
    background: linear-gradient(var(--jo-dt-row, transparent), var(--jo-dt-row, transparent)), var(--jo-ui-surface);
}

:is(.fi-ta:not(.jo-ta-cards)) .fi-ta-content > table.fi-ta-table:has(> tbody > tr > td.fi-ta-actions-cell:last-child) > thead > tr > th:last-child {
    z-index: 4;
}

/* Menu a tre puntini aperto: la sua cella sta sopra le celle Azioni delle
   righe sotto e sopra l'intestazione, altrimenti il menu ci finisce sotto. */
:is(.fi-ta:not(.jo-ta-cards)) .fi-ta-content > table.fi-ta-table > tbody > tr > td.fi-ta-actions-cell:last-child:has(.fi-dropdown-panel:not([style*='display: none'])) {
    z-index: 5;
}

.fi-ta-ctn .fi-ta-table > tbody > tr.fi-ta-row:hover {
    --jo-dt-row: rgb(124 92 203 / 2.5%);
}

/* Filetto che separa la colonna Azioni (ferma a destra). */
:is(.fi-ta:not(.jo-ta-cards)) .fi-ta-content > table.fi-ta-table > tbody > tr > td.fi-ta-actions-cell:last-child,
:is(.fi-ta:not(.jo-ta-cards)) .fi-ta-content > table.fi-ta-table:has(> tbody > tr > td.fi-ta-actions-cell:last-child) > thead > tr > th:last-child {
    box-shadow: inset 1px 0 0 var(--jo-ui-line);
}

/* Righe con un dettaglio: tutta la riga è cliccabile (data-table.js). */
.fi-ta-row:has(td .fi-ta-col-wrp > a[href]) { cursor: pointer; }

/* Colonne ridimensionate dall'utente (table-columns.js, owner 7-ott-2026):
 * larghezze fisse, il contenuto si adatta alla colonna (puntini o a capo)
 * invece di allargarla; la tabella resta piena, senza vuoti. */
html .fi-ta-table.jo-cols-sized {
    table-layout: fixed;
}
/* Le larghezze scelte valgono come sono: senza il limite di 15rem per cella
 * delle tabelle a misura automatica (22-ott-2026: una colonna allargata a 450px
 * ne mostrava 294). */
html body .fi-page .fi-ta .fi-ta-table.jo-cols-sized > thead > tr > th,
html body .fi-page .fi-ta .fi-ta-table.jo-cols-sized > tbody > tr > td {
    max-width: none !important;
}
html .fi-ta-table.jo-cols-sized > tbody > tr > td:not(.fi-ta-actions-cell) {
    overflow: hidden;
}
html .fi-ta-table.jo-cols-sized > tbody > tr > td .jo-qd-cell,
html .fi-ta-table.jo-cols-sized > tbody > tr > td .fi-ta-col-wrp,
html .fi-ta-table.jo-cols-sized > tbody > tr > td .fi-ta-text {
    width: auto;
    min-width: 0;
    max-width: 100%;
}
html .fi-ta-table.jo-cols-sized .jo-qd-cell > * {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
html .fi-ta-table.jo-cols-sized > tbody > tr > td:not(.fi-ta-actions-cell) > * {
    padding-right: 8px;
}

/* ── Colonne che non si tagliano (revisione 19-ott-2026) ─────────────────
   "Roccafiore Wi…", "Day Spa con colazion…", "JDEMO-WQD…", "07/10/202…"
   mentre colonne quasi vuote prendevano spazio. TableStandard::markWidths
   segna la colonna principale (la prima, in 600), le date e i codici con
   data-jo-w: hanno una larghezza minima e lo spazio lo cedono le colonne di
   contorno. Un testo più lungo del massimo resta coi puntini (tooltip). */
.fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell):not(.fi-ta-selection-cell)[data-jo-w] {
    --jo-dt-w-main: 12rem;
}

.fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell):not(.fi-ta-selection-cell)[data-jo-w='main'] {
    min-width: var(--jo-dt-w-main) !important;
    max-width: 22rem;
}

.fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell):not(.fi-ta-selection-cell)[data-jo-w='date'] {
    min-width: 6.75rem !important;
}

.fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell):not(.fi-ta-selection-cell)[data-jo-w='datetime'] {
    min-width: 9rem !important;
}

.fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell):not(.fi-ta-selection-cell)[data-jo-w='code'] {
    min-width: 8.5rem !important;
}

/* Portatili da 13–14": la colonna principale cede un po' prima delle altre
   misure, perché la tabella resti nello schermo senza scorrere di lato. */
@media (min-width: 1280px) and (max-width: 1439.98px) {
    .fi-ta:not(.jo-ta-cards) .fi-ta-table > tbody > tr > td:not(.fi-ta-actions-cell):not(.fi-ta-selection-cell)[data-jo-w] {
        --jo-dt-w-main: 10rem;
    }
}

/* Colonne ridimensionate a mano (table-columns.js): vince la scelta dell'utente. */
html body .fi-page .fi-ta:not(.jo-ta-cards) .fi-ta-table.jo-cols-sized > tbody > tr > td:not(.fi-ta-actions-cell):not(.fi-ta-selection-cell)[data-jo-w] {
    min-width: 0 !important;
}

/* "In carico a" (Assignment::column): la cella è larga quanto le iniziali,
   il titolo non va su tre righe ("In / carico / a"; revisione 19-ott-2026). */
.fi-ta-header-cell.jo-col-assignee,
.fi-ta-header-cell.jo-col-assignee div,
.fi-ta-header-cell.jo-col-assignee span,
.fi-ta-header-cell.jo-col-assignee button {
    white-space: nowrap !important;
}

/* Menu in cella (Cambia stato, Assegna): il valore non va a capo, nemmeno
   nelle card strette del telefono ("Asseg / n"; revisione 19-ott-2026). */
.jo-cell-menu-btn,
.jo-cell-menu-btn div,
.jo-cell-menu-btn span,
.jo-cell-menu-btn svg {
    white-space: nowrap !important;
}
