/* Compattazione layout per il wrapper mobile GtsApp.
 * Caricato SOLO quando $_COOKIE['ISMOBILE']=='S' (vedi Templates::init() in
 * gts/tpl/templates.php) — mai su browser desktop, quindi non impatta l'uso
 * via Chrome/PC.
 */

/* Navbar fissa in cima (bs3/bs4/bs5: sempre nav.navbar) e spazio riservato */
nav.navbar { display: none !important; }
body { padding-top: 0 !important; margin-top: 0 !important; }

/* Impedisce a contenuti larghi e non contenuti (es. tabelle con molte
 * colonne, prima che venga applicato il layout a card) di allargare l'intera
 * pagina oltre lo schermo: senza questo, il viewport effettivo cresce oltre
 * 768px e i breakpoint Tailwind md: dei pannelli filtri scattano erroneamente
 * (layout desktop a 3 colonne anche su schermi stretti, campi troncati). */
html, body { overflow-x: hidden !important; max-width: 100vw !important; }

/* AdminLTE (pagine bs3/bs4 più vecchie, es. careglio/appstd) */
.main-header, .main-sidebar, .control-sidebar,
.content-header, footer.main-footer { display: none !important; }
.content-wrapper { margin-left: 0 !important; padding-top: 8px !important; }

#main-container { padding-top: 8px !important; }
.container-fluid { padding-left: 8px !important; padding-right: 8px !important; }

.btn { min-height: 38px; font-size: 14px; }
.tablesorter-resizer-guide, .tablesorter-resizer { display: none !important; }

/* Form compatto: recupera spazio verticale nei filtri (Bootstrap standard) */
.card { margin-bottom: 8px !important; }
.card-body { padding: 10px 12px !important; }
.card-header { padding: 8px 12px !important; }
.form-group { margin-bottom: 5px !important; }
.col-form-label { padding-top: 5px !important; padding-bottom: 3px !important; font-size: 14px !important; }
/* hb_input() imposta l'attributo HTML size, che fissa una larghezza in
 * caratteri indipendente dalla colonna: su schermi stretti tronca il valore
 * (es. date "13/07/2026" -> "13/07/20"). Forza la larghezza al 100% del
 * contenitore invece di quella derivata da size. */
.form-control { height: 34px !important; padding: 4px 8px !important; font-size: 14px !important;
  width: 100% !important; box-sizing: border-box !important; }
.input-group .form-control, .input-group .btn { height: 34px !important; }
.input-group-append .btn, .input-group-prepend .btn { padding: 4px 10px !important; }

/* table#pdata (skel/page.layout: %table#pdata.pagina) è il contenitore
 * generico dei gruppi di filtro: ogni <td class="val"> diretto è un gruppo
 * (es. uno per Data, uno per Articolo, uno per Cliente...). Confermato via
 * bottone diagnostico 🐛: la riga risultava larga 1869px contro ~784px di
 * schermo reale — una <table> HTML non va MAI a capo da sola, trabocca
 * silenziosamente oltre lo schermo (nascosto da overflow-x:hidden qui sopra).
 * Forza la riga a comportarsi come un flex che va a capo.
 * NOTA: stessa identica struttura vista anche con id="filtri" invece di
 * "pdata" (solo l'id cambia da pagina a pagina) — se si trovano altri id
 * equivalenti in futuro, aggiungerli qui. */
#pdata > tbody > tr, #pdata > tr,
#filtri > tbody > tr, #filtri > tr {
  display: flex !important;
  flex-wrap: wrap !important;
  width: 100% !important;
}
#pdata > tbody > tr > td.val, #pdata > tr > td.val,
#filtri > tbody > tr > td.val, #filtri > tr > td.val {
  display: block !important;
  flex: 1 1 260px !important;
  width: auto !important;
  box-sizing: border-box !important;
}
/* Ogni gruppo ha una propria mini-riga (tr.tr-gv, da hb_frow) che si
 * auto-dimensiona indipendentemente dalle altre: l'etichetta (td.fld) si
 * stringe/allarga in base al proprio testo ("Magazzino" vs "Azienda"),
 * quindi lente/campo partono da un punto diverso riga per riga. Larghezza
 * fissa uguale per tutte, per allineare verticalmente icone e input. */
#pdata td.fld, #filtri td.fld {
  width: 88px !important;
  min-width: 88px !important;
  max-width: 88px !important;
  white-space: nowrap;
}

/* hb_search_generic() (campo codice + lente + descrizione, xhtmlbuild.php):
 * desktop lo tiene su una riga con input:first-of-type{width:20%}/
 * :last-of-type{width:60%} (style-bootstrap5.css) — la regola generica
 * .form-control{width:100%} qui sopra le sovrascrive entrambe, e siccome
 * sono display:inline-block (non flex) i due campo al 100% si accatastano
 * verticalmente invece di stare affiancati. Ripristina una riga flessibile:
 * va a capo solo se lo spazio è davvero insufficiente. */
[data-role='gtssearch'] {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center;
  gap: 4px;
}
[data-role='gtssearch'] input.form-control {
  width: auto !important;
  min-width: 0;
}
[data-role='gtssearch'] input[data-role='gtssearch-cod'] {
  flex: 0 1 70px !important;
}
[data-role='gtssearch'] input[data-role='gtssearch-des'] {
  flex: 2 1 140px !important;
}
[data-role='gtssearch'] button[data-role='gtssearch-btn'] {
  flex: 0 0 auto;
}

/* hb_calendar_range() (due input .bs-calendar + icona calendario, dentro
 * <div class="input-group"> su pagine bs5, xhtmlbuild.php): stesso problema
 * di gtssearch sopra — .form-control{width:100%} li impila invece di
 * tenerli affiancati, e la cella <td> di hb_frow (tabella HTML, non grid)
 * resta stretta per via dell'auto-layout delle tabelle. min-width forza la
 * colonna ad allargarsi, flex li tiene affiancati con wrap solo se serve. */
.input-group:has(> input.bs-calendar) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center;
  gap: 4px;
  min-width: 210px;
}
.input-group:has(> input.bs-calendar) input.bs-calendar {
  width: auto !important;
  flex: 1 1 90px !important;
  min-width: 70px;
}
.input-group:has(> input.bs-calendar) .gv-cal-shortcuts {
  flex: 0 0 auto;
}

/* Pannello filtri Tailwind (pagine bs5 più recenti, es. "Gestione Agenti") */
#filters { padding: 4px !important; margin-bottom: 8px !important; }
#filters .grid { gap: 6px !important; }
#filters label { margin-bottom: 2px !important; }