/* Vista PC / telefono - Finestre di ricerca (prefisso rz-).
   Solo le regole proprie di queste pagine: quelle comuni stanno in app.css (ed-*, vt-*, mg-pagina--tel). */

/* Le finestre di Components\Ricerche hanno tutte la stessa struttura (rc-modal, o rcf-modal per
   RicercaFilialiBanche): in vista telefono il contenitore riceve la classe rz-tel e il modal-dialog
   diventa modal-fullscreen. Le regole qui sotto valgono solo con rz-tel, quindi su PC nulla cambia.
   I blocchi <style> locali delle finestre vengono letti dopo questo foglio: le regole hanno quindi
   sempre almeno una classe in piu' (rc-modal.rz-tel) per vincere a parita' di specificita'. */

/* ── Finestra a tutto schermo (dvh: la barra del browser non copre il piede con i pulsanti) ── */
.rc-modal.rz-tel .modal-dialog.modal-fullscreen,
.rcf-modal.rz-tel .modal-dialog.modal-fullscreen {
    margin: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
}
.rc-modal.rz-tel .modal-dialog.modal-fullscreen > .modal-content,
.rcf-modal.rz-tel .modal-dialog.modal-fullscreen > .modal-content {
    display: flex !important;
    flex-direction: column !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    border-radius: 0 !important;
    overflow: hidden !important;
}

/* ── Intestazione ── */
.rc-modal.rz-tel .rc-header,
.rcf-modal.rz-tel .rcf-header { flex: 0 0 auto; padding: .6rem .6rem .6rem 1rem; gap: .5rem; }
.rc-modal.rz-tel .rc-title,
.rcf-modal.rz-tel .rcf-title { font-size: 1.05rem; line-height: 1.25; }
.rc-modal.rz-tel .rc-close-btn,
.rcf-modal.rz-tel .rcf-close-btn { width: 44px; height: 44px; flex-shrink: 0; font-size: 1.15rem; }

/* ── Ricerca: alta 44 px e 16 px di carattere (niente zoom automatico su iPhone) ── */
.rc-modal.rz-tel .rc-search-wrap,
.rcf-modal.rz-tel .rcf-search-wrap { flex: 0 0 auto; padding: .6rem .75rem; }
.rc-modal.rz-tel .rc-search-input,
.rcf-modal.rz-tel .rcf-search-input { min-height: 44px; font-size: 16px; padding-right: 3rem; }
.rc-modal.rz-tel .rc-clear-btn,
.rcf-modal.rz-tel .rcf-clear-btn {
    right: .2rem; width: 40px; height: 40px; font-size: 1.15rem;
    display: flex; align-items: center; justify-content: center;
}
.rc-modal.rz-tel .rc-search-extra { margin-top: .45rem; }
.rc-modal.rz-tel .rc-filter-chk { min-height: 40px; font-size: 16px; gap: .55rem; }
.rc-modal.rz-tel .rc-filter-chk input { width: 20px; height: 20px; }

/* ── Corpo: occupa lo spazio rimasto; scorre il primo figlio (tabella, elenco a schede, attesa),
      che e' anche il contenitore a cui si aggancia Virtualize dove presente ── */
.rc-modal.rz-tel .rc-body:not(.rc-body--edit),
.rcf-modal.rz-tel .rcf-body {
    flex: 1 1 0;
    min-height: 0;
    max-height: none;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.rc-modal.rz-tel .rc-body:not(.rc-body--edit) > *,
.rcf-modal.rz-tel .rcf-body > * {
    flex: 1 1 0;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}

/* ── Tabelle (table.rc-table e la variante a div per Virtualize) trasformate in schede:
      prima riga codice + descrizione, seconda riga le colonne secondarie (attributo data-label,
      mostrato come etichetta). Il pulsante "Seleziona" sparisce: il tocco sulla scheda seleziona,
      come gia' il clic sulla riga su PC. ── */
.rc-modal.rz-tel .rc-table { display: block; width: 100%; margin: 0; font-size: .95rem; }
.rc-modal.rz-tel table.rc-table > thead,
.rc-modal.rz-tel .rc-table > .rc-thead { display: none; }
.rc-modal.rz-tel table.rc-table > tbody,
.rc-modal.rz-tel .rc-table > .rc-tbody { display: block; width: 100%; }

.rc-modal.rz-tel table.rc-table tr.rc-row,
.rc-modal.rz-tel .rc-table .rc-tbody .rc-tr {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: .6rem;
    row-gap: .2rem;
    min-height: 56px;
    padding: .7rem 1rem;
    border-bottom: 1px solid var(--ab-b-eef0f8, #eef0f8);
    background: var(--ab-s-ffffff, #fff);
    cursor: pointer;
}
.rc-modal.rz-tel table.rc-table tr.rc-row:active,
.rc-modal.rz-tel .rc-table .rc-tbody .rc-tr:active { background: var(--ab-s-eaf0ff, #eaf0ff) !important; }

/* a capo prima delle colonne secondarie */
.rc-modal.rz-tel table.rc-table tr.rc-row::before,
.rc-modal.rz-tel .rc-table .rc-tbody .rc-tr::before {
    content: "";
    order: 1;
    flex-basis: 100%;
    height: 0;
}

.rc-modal.rz-tel table.rc-table tr.rc-row > td,
.rc-modal.rz-tel .rc-table .rc-tbody .rc-tr > .rc-td {
    display: block;
    order: 0;
    min-width: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    text-align: left;
}

/* descrizione: testo principale, va a capo invece di uscire dallo schermo */
.rc-modal.rz-tel table.rc-table tr.rc-row > td:not([data-label]):not(:has(.rc-code)),
.rc-modal.rz-tel .rc-table .rc-tbody .rc-tr > .rc-td:not([data-label]):not(:has(.rc-code)) {
    flex: 1 1 0;
    font-size: 16px;
    font-weight: 600;
    color: var(--ab-t-1e2d5a, #1e2d5a);
    overflow-wrap: anywhere;
}
.rc-modal.rz-tel table.rc-table tr.rc-row > td:has(.rc-code),
.rc-modal.rz-tel .rc-table .rc-tbody .rc-tr > .rc-td:has(.rc-code) { flex: 0 0 auto; }
.rc-modal.rz-tel .rc-table .rc-code { font-size: .85rem; }

/* colonne secondarie come testo piu' piccolo con l'etichetta della colonna */
.rc-modal.rz-tel table.rc-table tr.rc-row > td[data-label],
.rc-modal.rz-tel .rc-table .rc-tbody .rc-tr > .rc-td[data-label] {
    order: 2;
    font-size: .85rem;
    color: var(--ab-t-5a6488, #5a6488);
    white-space: nowrap;
}
.rc-modal.rz-tel table.rc-table tr.rc-row > td[data-label]::before,
.rc-modal.rz-tel .rc-table .rc-tbody .rc-tr > .rc-td[data-label]::before {
    content: attr(data-label);
    margin-right: .3rem;
    font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
    font-weight: 500;
    color: var(--ab-t-8b93b3, #8b93b3);
}
.rc-modal.rz-tel table.rc-table tr.rc-row > td[data-label]:empty,
.rc-modal.rz-tel .rc-table .rc-tbody .rc-tr > .rc-td[data-label]:empty,
.rc-modal.rz-tel .rz-se-pieno:not(:has(*)) { display: none; }

/* pulsante "Seleziona": su telefono basta il tocco sulla scheda */
.rc-modal.rz-tel table.rc-table tr.rc-row > td:has(.rc-select-btn),
.rc-modal.rz-tel .rc-table .rc-tbody .rc-tr > .rc-td:has(.rc-select-btn),
.rc-modal.rz-tel .rc-select-btn { display: none; }

/* ── Elenchi a schede gia' presenti (clienti, fornitori, anagrafiche, banche, filiali) ── */
/* .rc-list / .rcf-list sono colonne flex ad altezza fissa (scorrono): senza flex-shrink:0 il browser
   schiacciava le schede al min-height e il contenuto finiva sopra la scheda successiva. */
.rc-modal.rz-tel .rc-item,
.rcf-modal.rz-tel .rcf-item { min-height: 56px; flex-shrink: 0; }
.rc-modal.rz-tel .rc-item:active,
.rcf-modal.rz-tel .rcf-item:active { background: var(--ab-s-eaf0ff, #eaf0ff); }
.rc-modal.rz-tel .rc-item-name,
.rcf-modal.rz-tel .rcf-item-name { font-size: 16px; white-space: normal; overflow-wrap: anywhere; }
.rc-modal.rz-tel .rc-item-meta { align-items: center; }
.rz-item-nota { font-size: .8rem; color: var(--ab-t-8b93b3, #8b93b3); margin-top: .2rem; overflow-wrap: anywhere; }

/* ── Piede: conteggio sopra, pulsanti alti 44 px a tutta larghezza sotto ── */
.rc-modal.rz-tel .rc-footer,
.rcf-modal.rz-tel .rcf-footer {
    flex: 0 0 auto;
    flex-wrap: wrap;
    gap: .5rem;
    padding: .55rem .75rem calc(.55rem + env(safe-area-inset-bottom));
}
.rc-modal.rz-tel .rc-footer > *,
.rcf-modal.rz-tel .rcf-footer > * { margin: 0; }
.rc-modal.rz-tel .rc-footer-count,
.rcf-modal.rz-tel .rcf-footer-count { flex: 1 1 100%; font-size: .85rem; }
.rc-modal.rz-tel .rc-footer-actions { flex: 1 1 100%; gap: .5rem; }
.rc-modal.rz-tel .rc-btn-new,
.rc-modal.rz-tel .rc-btn-close,
.rc-modal.rz-tel .rc-btn-back,
.rcf-modal.rz-tel .rcf-btn-close {
    flex: 1 1 0;
    min-height: 44px;
    font-size: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}