/* Vista PC / telefono - DettaglioAttivita e finestre collegate (Ufficio).
   Solo le regole proprie di queste pagine: quelle comuni stanno in app.css (ed-*, vt-*, mg-pagina--tel). */

/************************************************************
 * DETTAGLIO ATTIVITÀ - contenitore .ua-da (classe data da DettaglioAttivita.ClasseVista)
 * La vista cambia solo con le classi: il DOM resta uguale, così editor HTML,
 * sezioni aperte e loro stato salvato non si perdono al cambio di vista.
 ************************************************************/

/* ── Gruppo di lavoro + Privato (sezione Utenti), Commessa e Tags: entrambe le viste ── */
.ua-da .da-utenti-filtri {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .4rem 1.25rem;
    margin-bottom: .6rem;
}
.ua-da .da-utenti-filtro { display: flex; align-items: center; gap: .5rem; margin: 0; flex: 1 1 auto; min-width: 0; }
.ua-da .da-select-gruppo { flex: 1 1 auto; min-width: 0; max-width: 320px; }
.ua-da .da-privato { display: flex; align-items: center; gap: .35rem; margin: 0; cursor: pointer; }
.ua-da .da-utente-escluso td { opacity: .45; text-decoration: line-through; }
.ua-da .da-input--tags { flex: 1 1 auto; min-width: 0; }
.ua-da .da-accordion-totale { font-size: .72rem; font-weight: 500; color: var(--ab-t-6b7cad, #6b7cad); margin-left: .35rem; }

/* ── Vista PC: maschera compatta a due colonne, come la form del desktop ──
   Colonna sinistra (.da-col--sx): oggetto, dettagli, descrizione.
   Colonna destra (.da-col--dx): utenti, assegna a, elementi collegati, OneDrive, fatturazione.
   Le due colonne sono indipendenti: ognuna impila le sue sezioni senza lasciare buchi
   (con una griglia a righe ogni riga era alta quanto la sezione più alta delle due).
   Le sezioni sono sempre aperte; l'ordine è quello del DOM, l'"Ordine delle sezioni"
   personale vale solo su telefono, dove le colonne hanno display:contents. */
.ua-da--pc .da-accordion {
    display: grid;
    grid-template-columns: minmax(0, 1.75fr) minmax(300px, 1fr);
    gap: .75rem;
    align-items: start;
}
.ua-da--pc .da-col { display: flex; flex-direction: column; gap: .5rem; min-width: 0; }
@media (min-width: 1101px) { .ua-da--pc .da-col > * { order: 0 !important; } }
.ua-da--tel .da-col { display: contents; }

/* Sezioni sempre aperte: l'intestazione resta come titolo, non si clicca */
.ua-da--pc .da-accordion .collapse { display: block !important; height: auto !important; }
.ua-da--pc .da-accordion .da-accordion-btn {
    pointer-events: none;
    padding: .3rem .7rem;
    min-height: 0;
    font-size: .8rem;
}
.ua-da--pc .da-accordion .da-accordion-chevron { display: none; }
.ua-da--pc .da-accordion .da-accordion-icon { width: 22px; height: 22px; font-size: .75rem; }
.ua-da--pc .da-accordion .da-accordion-body { padding: .5rem .7rem; }

/* Oggetto e intestazioni più basse */
.ua-da--pc .da-sez--oggetto .da-section-header { padding: .3rem .7rem; font-size: .8rem; }
.ua-da--pc .da-sez--oggetto .da-section-body { padding: .5rem .7rem; }
.ua-da--pc .da-tempo-row { margin-top: .35rem !important; }
.ua-da--pc .da-toolbar { margin-bottom: .4rem; }
.ua-da--pc .da-info-bar { margin-bottom: .4rem; padding: .3rem .7rem; }

/* Colonna destra: elenchi con scorrimento interno invece che della pagina */
.ua-da--pc .da-sez--Utenti .da-accordion-body { max-height: 300px; overflow-y: auto; }
/* "Assegna a" (Partecipanti, solo in modifica): l'unica sezione che su PC si apre e si chiude.
   Aperta, l'elenco scorre dentro il riquadro con la barra sempre visibile (overflow-y: scroll):
   con "auto" e poche righe in più non era chiaro che ci fossero altri utenti sotto. */
.ua-da--pc .da-accordion .da-sez--Partecipanti .collapse:not(.show):not(.collapsing) { display: none !important; }
.ua-da--pc .da-accordion .da-sez--Partecipanti .collapsing { display: block !important; }
.ua-da--pc .da-accordion .da-sez--Partecipanti > .da-accordion-btn { pointer-events: auto; cursor: pointer; }
.ua-da--pc .da-accordion .da-sez--Partecipanti .da-accordion-chevron { display: inline-block; }
.ua-da--pc .da-sez--Partecipanti .da-accordion-body { max-height: 320px; overflow-y: scroll; }
.ua-da--pc #collapseElementiCollegati > .da-accordion-body { min-height: 0; }
/* Il menu del bottone Collega esce dalla sezione: su PC il riquadro è basso (niente
   min-height), quindi la sezione non deve tagliarlo (overflow) e deve stare sopra
   OneDrive, che la segue (z-index). Gli angoli dell'intestazione restano arrotondati. */
.ua-da--pc .da-sez--ElementiCollegati { overflow: visible; position: relative; z-index: 5; }
.ua-da--pc .da-sez--ElementiCollegati > .da-accordion-btn { border-radius: 10px 10px 0 0; }
.ua-da--pc .da-sez--ElementiCollegati .da-link-list,
.ua-da--pc .da-sez--OneDrive .da-file-list { max-height: 150px; overflow-y: auto; }
.ua-da--pc .da-table thead th,
.ua-da--pc .da-table tbody td { padding: .2rem .4rem; }
.ua-da--pc .da-user-avatar { width: 20px; height: 20px; font-size: .65rem; }
.ua-da--pc .da-collega-btn,
.ua-da--pc .da-btn--primary-cloud { padding: .25rem .7rem; font-size: .8rem; }

/* Descrizione: storico compatto sopra l'editor */
.ua-da--pc .da-descrizione-storico { max-height: 160px; overflow-y: auto; }

/* Dati per fatturazione: in colonna stretta le spunte vanno a capo */
.ua-da--pc .da-sez--DatiFatturazione .ua-fatt { gap: .25rem 1rem; }

/* Campi dei Dettagli compatti: altezza 30px, testo .85rem, etichette più strette */
.ua-da--pc .ua-dettagli .da-field-check { flex: 0 0 96px; }
.ua-da--pc .ua-dettagli .da-input { padding: .2rem .5rem; font-size: .85rem; height: 30px; }
.ua-da--pc .ua-dettagli .da-input--date { min-width: 0; width: 13rem; }
.ua-da--pc .ua-dettagli .da-data-ora .da-input--date { width: 9.5rem; }
/* Anagrafica e Commessa compatte. Lo stile locale della maschera dà a .da-html-preview
   (pulsante "…" e descrizione) min-height 40px e padding largo: qui si azzerano con
   selettori più specifici; la combo Persona DevExpress va portata alla stessa altezza. */
.ua-da--pc .ua-dettagli .da-field-row { flex-wrap: nowrap; }
.ua-da--pc .ua-dettagli .da-anag-group {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
    max-width: 46rem;
    height: 30px;
    align-items: stretch;
}
.ua-da--pc .ua-dettagli .da-anag-group > .form-control,
.ua-da--pc .ua-dettagli .da-anag-group > .btn,
.ua-da--pc .ua-dettagli .da-anag-group > .form-control.da-html-preview {
    height: 30px;
    min-height: 0;
    padding: .15rem .5rem;
    font-size: .85rem;
    line-height: 1.4;
}
.ua-da--pc .ua-dettagli .da-anag-group > input.form-control:first-child { max-width: 11ch !important; flex: 0 0 11ch; }
.ua-da--pc .ua-dettagli .da-anag-group > .btn { flex: 0 0 30px; padding: 0; }
.ua-da--pc .ua-dettagli .da-commessa-group { max-width: 30rem; }
.ua-da--pc .ua-dettagli .da-anag-group .dxbl-text-edit,
.ua-da--pc .ua-dettagli .da-anag-group .dxbl-combobox {
    height: 30px !important;
    min-height: 0 !important;
    font-size: .85rem;
}
.ua-da--pc .ua-dettagli .da-anag-group .dxbl-text-edit input { padding-top: 0; padding-bottom: 0; font-size: .85rem; }

/* Sotto i 1100 px la colonna destra non ci sta: una colonna, sezioni sempre aperte */
@media (max-width: 1100px) {
    .ua-da--pc .da-accordion { display: flex; flex-direction: column; gap: .5rem; }
    .ua-da--pc .da-col { display: contents; }
}

/* ── Vista PC: campi affiancati invece che impilati ── */
/* Dettagli: Scadenza e Promemoria sulla stessa riga, Categoria e Anagrafica su riga intera */
.ua-da--pc .ua-dettagli {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem 2rem;
    align-items: center;
}
.ua-da--pc .ua-dettagli > .da-field-row { margin-top: 0 !important; }
.ua-da--pc .ua-dettagli > .ua-riga-intera { grid-column: 1 / -1; }

/* Dati per fatturazione: le tre spunte su una riga */
.ua-da--pc .ua-fatt { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 2.5rem; }
.ua-da--pc .ua-fatt > .da-fatt-row { margin-bottom: 0; }

/* ── Vista telefono: una colonna, etichette sopra, controlli alti 40px e testo a 16px ── */
.ua-da--tel {
    max-width: 760px;
    margin: 0 auto;
    overflow-x: clip;           /* niente scroll orizzontale; "clip" non rompe la toolbar sticky */
}

/* Toolbar: i pulsanti vanno a capo e sono grandi da toccare */
.ua-da--tel .da-toolbar { margin-bottom: .6rem; }
.ua-da--tel .da-toolbar-inner { padding: .45rem .5rem; }
.ua-da--tel .da-toolbar-left { display: none; }
.ua-da--tel .da-toolbar-actions {
    flex: 1 1 auto;
    flex-wrap: wrap;
    min-width: 0;
    gap: .35rem;
}
.ua-da--tel .da-divider { display: none; }
.ua-da--tel .da-btn { min-height: 42px; }
.ua-da--tel .da-btn--icon { min-width: 42px; justify-content: center; }
.ua-da--tel .da-switch-wrap { min-height: 42px; margin-right: auto; font-size: .9rem; }
.ua-da--tel .da-switch-wrap .form-check-input { width: 2.6em; height: 1.4em; }
.ua-da--tel .da-dropdown-menu .dropdown-item { min-height: 44px; font-size: .95rem; }

.ua-da--tel .da-alert { font-size: .9rem; }
.ua-da--tel .da-info-bar { flex-direction: column; gap: .3rem; padding: .55rem .75rem; margin-bottom: .6rem; }
.ua-da--tel .da-info-item { overflow-wrap: anywhere; }

/* Oggetto e rilevazione tempo */
.ua-da--tel .da-section-body { padding: .7rem .75rem; }
.ua-da--tel .da-textarea { font-size: 16px; }
.ua-da--tel .da-tempo-toggle { min-height: 42px; font-size: .9rem; }
.ua-da--tel .da-tempo-input { min-height: 42px; font-size: 16px; }

/* Sezioni apribili */
.ua-da--tel .da-accordion-btn { min-height: 48px; font-size: .95rem; padding: .6rem .75rem; }
.ua-da--tel .da-accordion-body { padding: .75rem; }

/* Utenti: spunte e cestino sempre visibili e grandi */
.ua-da--tel .da-table thead th,
.ua-da--tel .da-table tbody td { padding: .45rem .4rem; }
.ua-da--tel .da-table tbody td:first-child { overflow-wrap: anywhere; }
.ua-da--tel .da-check { width: 22px; height: 22px; }

/* Dettagli: etichetta sopra, campo a tutta larghezza */
.ua-da--tel .da-field-row { flex-direction: column; align-items: stretch; gap: .3rem; }
.ua-da--tel .da-field-check { flex: none; width: 100%; min-height: 32px; }
.ua-da--tel .da-input { min-height: 42px; font-size: 16px; }
.ua-da--tel .da-input--date { width: 100%; min-width: 0; }
.ua-da--tel .da-data-ora { width: 100%; }
.ua-da--tel .da-data-ora .da-input--date { flex: 1 1 auto; width: auto; }
.ua-da--tel .da-combobox-wrap { width: 100%; }
.ua-da--tel .da-combobox--categoria,
.ua-da--tel .da-combobox--persona { max-width: none !important; }
.ua-da--tel .dxbl-text-edit { min-height: 42px; }
.ua-da--tel .dxbl-text-edit input { font-size: 16px; }

/* Anagrafica: codice + ricerca sulla prima riga, ragione sociale e persona sotto */
.ua-da--tel .da-anag-group { flex-wrap: wrap !important; gap: .4rem; }
.ua-da--tel .da-anag-group > * { margin-left: 0 !important; border-radius: 8px !important; }
.ua-da--tel .da-anag-group > input.form-control:first-child {
    flex: 1 1 auto;
    max-width: none !important;     /* sovrascrive lo style="max-width:15ch" del campo */
    min-height: 42px;
    font-size: 16px;
}
.ua-da--tel .da-anag-group > .btn { flex: 0 0 48px; min-height: 42px; }
.ua-da--tel .da-anag-group .form-control.da-html-preview {
    flex: 1 1 100%;
    width: 100%;
    min-height: 42px;
    font-size: 16px;
}
.ua-da--tel .da-anag-group .da-combobox,
.ua-da--tel .da-anag-group .dxbl-combobox {
    flex: 1 1 100% !important;
    width: 100% !important;
}
/* la combo Persona lascia posto al bottone della rubrica telefonica sulla stessa riga */
.ua-da--tel .da-anag-group .dxbl-combobox.da-combobox--persona {
    flex: 1 1 0 !important;
    width: auto !important;
    max-width: none !important;
}

/* Descrizione */
.ua-da--tel .da-stamp-btn { min-height: 42px; margin: 0 .3rem .35rem 0; font-size: .9rem; }
.ua-da--tel .da-html-preview { overflow-x: auto; overflow-wrap: anywhere; }

/* OneDrive */
.ua-da--tel .da-btn--primary-cloud { min-height: 44px; }
.ua-da--tel .da-file-item { min-height: 48px; padding: .35rem .5rem .35rem .75rem; }
.ua-da--tel .da-file-del { width: 40px; height: 40px; flex: 0 0 40px; }

/* Elementi collegati: righe che vanno a capo, cestino e conferma sempre visibili */
.ua-da--tel .da-collega-btn { min-height: 44px; }
.ua-da--tel .da-collega-menu { max-width: calc(100vw - 2rem); }
.ua-da--tel .da-collega-menu-item { min-height: 52px; }
.ua-da--tel .da-link-item { flex-wrap: wrap; min-height: 48px; padding: .4rem .5rem .4rem .75rem; }
.ua-da--tel .da-link-anchor { flex: 1 1 55%; min-width: 0; white-space: normal; overflow-wrap: anywhere; padding: .35rem 0; }
.ua-da--tel .da-link-delete-btn { opacity: 1; width: 40px; height: 40px; }
.ua-da--tel .da-link-confirm { flex-wrap: wrap; padding: .25rem .35rem .25rem .55rem; }
.ua-da--tel .da-link-confirm-btn { width: 38px; height: 38px; font-size: 1rem; }

/* Dati per fatturazione */
.ua-da--tel .da-fatt-row { align-items: center; min-height: 40px; margin-bottom: .3rem; }
.ua-da--tel .da-fatt-row .da-check { margin-top: 0; }
.ua-da--tel .da-fatt-label { font-size: .95rem; }

/* Finestre della pagina (ordine delle sezioni, cestino, collegamento alla pratica) */
.ua-da--tel .da-modal-ordine .modal-footer,
.ua-da--tel .da-modal-warn .modal-footer { flex-wrap: wrap; gap: .4rem; }
.ua-da--tel .da-modal-ordine .modal-footer .da-btn,
.ua-da--tel .da-modal-warn .modal-footer .da-btn { min-height: 44px; flex: 1 1 auto; justify-content: center; margin: 0; }
.ua-da--tel .da-ordine-item { min-height: 52px; }
.ua-da--tel .da-ordine-freccia { width: 42px; height: 42px; }
.ua-da--tel .da-modal-ordine .btn-close,
.ua-da--tel .da-modal-warn .btn-close { padding: .9rem; }

/************************************************************
 * FINESTRE COLLEGATE (ElencoPrestazioni, ElencoEmailCollegati, ElencoAttivitaCollegate)
 * .ua-modal--tel sul div .modal: insieme a .modal-fullscreen occupano tutto lo schermo.
 ************************************************************/
.ua-modal--tel .modal-content { border-radius: 0; }
.ep-finestra .ua-modal--tel .pr-body,
.ua-modal--tel .eec-body,
.ua-modal--tel .eac-body { max-height: none; }

.ep-finestra .ua-modal--tel .pr-header,
.ua-modal--tel .eec-header,
.ua-modal--tel .eac-header {
    padding: calc(.7rem + env(safe-area-inset-top, 0px)) .9rem .7rem;
    border-radius: 0;
    margin: 0;
}
.ep-finestra .ua-modal--tel .pr-close-btn,
.ua-modal--tel .eec-close-btn,
.ua-modal--tel .eac-close-btn { width: 42px; height: 42px; flex: 0 0 42px; }

.ep-finestra .ua-modal--tel .pr-footer,
.ua-modal--tel .eec-footer,
.ua-modal--tel .eac-footer {
    flex-wrap: wrap;
    gap: .5rem;
    padding: .6rem .9rem calc(.6rem + env(safe-area-inset-bottom, 0px));
}

/* ── Prestazioni: schede al posto della tabella da 12 colonne ── */
.ep-finestra .ua-modal--tel .pr-body { padding: .75rem; }
.ep-finestra .ua-modal--tel .pr-filter-bar { gap: .45rem; }
.ep-finestra .ua-modal--tel .pr-filter-select { flex: 1 1 auto; min-width: 0; min-height: 42px; font-size: 16px; }
.ep-finestra .ua-modal--tel .pr-filter-clear { width: 40px; height: 40px; justify-content: center; font-size: 1.2rem; }
.ua-modal--tel .ua-prest-utente { font-weight: 600; text-transform: uppercase; color: var(--fe-text); }
.ua-modal--tel .ua-prest-note {
    margin-top: .3rem;
    font-size: .85rem;
    color: var(--ab-t-4a5580, #4a5580);
    overflow-wrap: anywhere;
    white-space: pre-line;
}
.ua-modal--tel .ua-prest-totali { background: var(--fe-blue-light); border-color: var(--fe-blue-mid); }
.ua-modal--tel .ua-prest-totali .vt-scheda-importo { color: var(--ab-t-0e3fa8, #0e3fa8); }
.ua-modal--tel .vt-scheda-azioni .pr-btn { flex: 1 1 0; justify-content: center; min-height: 44px; font-size: .95rem; }
.ep-finestra .ua-modal--tel .pr-footer { flex-direction: column; align-items: stretch; }
.ep-finestra .ua-modal--tel .pr-footer-hint { text-align: center; }
.ep-finestra .ua-modal--tel .pr-footer .pr-btn { justify-content: center; min-height: 44px; font-size: .95rem; }
.ep-finestra .ua-modal--tel .pr-confirm-footer .pr-btn { flex: 1 1 0; justify-content: center; min-height: 44px; }

/* ── Collega email / Collega attività: filtri grandi, schede più ariose ── */
.ua-modal--tel .eec-toolbar,
.ua-modal--tel .eac-toolbar { padding: .6rem .75rem; }
.ua-modal--tel .eec-account-row,
.ua-modal--tel .eac-account-row { flex-wrap: wrap; gap: .35rem; }
.ua-modal--tel .eec-account-select,
.ua-modal--tel .eac-account-select { flex: 1 1 100%; min-height: 44px; font-size: 16px; }
.ua-modal--tel .eec-account-single { overflow-wrap: anywhere; }
.ua-modal--tel .eec-tabs { flex-wrap: nowrap; overflow-x: auto; padding-bottom: .15rem; }
.ua-modal--tel .eec-tab { flex: 0 0 auto; min-height: 40px; }
.ua-modal--tel .eec-toolbar-row,
.ua-modal--tel .eac-toolbar-row { gap: .45rem; }
.ua-modal--tel .eec-search,
.ua-modal--tel .eac-search { flex: 1 1 100%; min-width: 0; }
.ua-modal--tel .eec-search-input,
.ua-modal--tel .eac-search-input { min-height: 44px; font-size: 16px; }
.ua-modal--tel .eec-search-clear,
.ua-modal--tel .eac-search-clear { width: 40px; height: 40px; right: .2rem; display: grid; place-items: center; }
.ua-modal--tel .eec-toolbar-actions,
.ua-modal--tel .eac-toolbar-actions { width: 100%; gap: .4rem; }
.ua-modal--tel .eec-check,
.ua-modal--tel .eac-check { min-height: 40px; font-size: .9rem; }
.ua-modal--tel .eec-check input,
.ua-modal--tel .eac-check input { width: 20px; height: 20px; }
.ua-modal--tel .eac-check--pill { padding: .35rem .85rem; }
.ua-modal--tel .eec-num { min-height: 40px; }
.ua-modal--tel .eec-num-input { font-size: 16px; width: 64px; }
.ua-modal--tel .eec-btn,
.ua-modal--tel .eac-btn { min-height: 42px; margin-left: auto; }

.ua-modal--tel .eec-list-header,
.ua-modal--tel .eac-list-header { padding: .45rem .85rem; gap: .5rem; }
.ua-modal--tel .eec-sel-all,
.ua-modal--tel .eac-sel-all { min-height: 40px; font-size: .88rem; }
.ua-modal--tel .eec-sel-all input,
.ua-modal--tel .eac-sel-all input { width: 22px; height: 22px; }
.ua-modal--tel .eec-item,
.ua-modal--tel .eac-item { padding: .75rem .85rem; gap: .65rem; min-height: 56px; }
.ua-modal--tel .eec-item-mittente { white-space: normal; overflow-wrap: anywhere; }
.ua-modal--tel .eec-item-row1,
.ua-modal--tel .eac-item-row1 { flex-wrap: wrap; row-gap: .1rem; }

.ua-modal--tel .eec-footer > .d-flex,
.ua-modal--tel .eac-footer > .d-flex { width: 100%; }
.ua-modal--tel .eec-btn-cancel,
.ua-modal--tel .eec-btn-confirm,
.ua-modal--tel .eac-btn-cancel,
.ua-modal--tel .eac-btn-confirm { flex: 1 1 0; min-height: 44px; font-size: .95rem; }

/* DettaglioAttivita, vista telefono: Gruppo di lavoro e Privato uno sotto l'altro, select a tutta larghezza */
.ua-da--tel .da-utenti-filtri { flex-direction: column; align-items: stretch; }
.ua-da--tel .da-utenti-filtro { flex-direction: column; align-items: stretch; gap: .3rem; }
.ua-da--tel .da-select-gruppo { max-width: none; width: 100%; }
.ua-da--tel .da-privato { min-height: 42px; }
.ua-da--tel .da-input--tags { width: 100%; }
