/* Moduli configurabili (sessione F giro 3, 22/10/2026): viste, dialoghi, adattamento a telefono e tablet.
   Solo classi mo-*; riusa variabili e bottoni di style.css. */

#view-modulo h2:focus { outline: none; }
.mo-schede-viste { display: flex; flex-wrap: wrap; gap: .25rem; border-bottom: 2px solid var(--border); margin-bottom: 1rem; }
.mo-schede-viste .tab-btn { white-space: nowrap; }
.mo-schede-viste .tab-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.mo-stato { min-height: 1.3em; margin: .25rem 0 .75rem; color: var(--muted); font-size: .9rem; }
.mo-errore { color: #b91c1c; }
.mo-stato.mo-errore { color: #b91c1c; font-weight: 600; }
.mo-pannello:focus { outline: none; }
.mo-caricamento, .mo-vuoto, .mo-nota, .mo-conteggio { color: var(--muted); font-size: .9rem; }
.mo-conteggio { margin: .5rem 0; }
.mo-sottotitolo { font-size: 1.05rem; margin: 1rem 0 .5rem; }

.mo-barra { display: flex; flex-wrap: wrap; gap: .6rem 1rem; align-items: flex-end; margin-bottom: .75rem; }
.mo-campo { display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.mo-campo label { font-size: .8rem; color: var(--muted); font-weight: 600; }
.mo-campo input, .mo-campo select, .mo-campo textarea {
  padding: .45rem .55rem; border: 1px solid var(--border); border-radius: var(--radius); font: inherit; font-size: .9rem;
  background: var(--surface); color: var(--text); min-height: 2.25rem;
}
.mo-campo input[type=search] { min-width: 16rem; }
.mo-campo textarea { width: 100%; }
.mo-campo input:focus-visible, .mo-campo select:focus-visible, .mo-campo textarea:focus-visible,
.mo-tabella input:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.mo-aiuto { color: var(--muted); font-size: .78rem; }
.mo-spunta { flex-direction: row; align-items: center; gap: .4rem; }
.mo-spunta label { color: var(--text); font-weight: 400; font-size: .9rem; }
.mo-numero { width: 5.5rem; text-align: right; }
.mo-num { font-variant-numeric: tabular-nums; }
.mo-barra button, .mo-persona-azioni button, .mo-dlg-azioni button { min-height: 2.25rem; }

/* tabelle: la tabella di base (.admin-table) ha min-width 900px; qui la larghezza segue il contenuto */
.mo-tabella { min-width: 0; }
.mo-tabella th, .mo-tabella td { padding: .5rem .75rem; white-space: nowrap; }
.mo-tabella td:last-child { white-space: normal; min-width: 8rem; }
.mo-tabella input { padding: .3rem .45rem; border: 1px solid var(--border); border-radius: 6px; font: inherit; font-size: .9rem; background: var(--surface); }
.mo-tabella td .mo-num { display: block; text-align: right; }
.mo-sotto-scorta td { background: #fff7ed; }
.mo-etichetta { display: inline-block; margin-left: .35rem; padding: .05rem .45rem; border-radius: 999px; font-size: .75rem;
  background: var(--bg); border: 1px solid var(--border); color: var(--muted); font-weight: 600; vertical-align: middle; }
.mo-etichetta.mo-avviso { background: #fff7ed; border-color: #fdba74; color: #9a3412; }

/* schede per persona */
.mo-persone { display: flex; flex-direction: column; gap: 1rem; }
.mo-persona { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: .75rem 1rem; }
.mo-persona-testa { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .25rem 1rem; }
.mo-persona-testa h3 { font-size: 1rem; }
.mo-codice { color: var(--muted); font-weight: 400; font-size: .85rem; }
.mo-reparto { color: var(--muted); font-size: .85rem; }
.mo-persona-azioni { display: flex; flex-wrap: wrap; gap: .4rem; margin: .5rem 0; }
.mo-persona .admin-table { box-shadow: none; }

.mo-riquadro { margin-bottom: 1.25rem; }
.mo-risultato-importazione h4 { margin: 1.1rem 0 .4rem; }   /* giro 4 */
.mo-modulo-mov { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: .75rem 1rem; margin-bottom: 1rem; }
.mo-righe { display: flex; flex-direction: column; gap: .5rem; margin: .5rem 0; }
.mo-riga, .mo-gruppo { display: flex; flex-wrap: wrap; gap: .5rem .75rem; align-items: flex-end; border: 1px solid var(--border);
  border-radius: var(--radius); padding: .5rem .75rem; }
.mo-gruppo legend { font-size: .85rem; font-weight: 600; padding: 0 .25rem; }
.mo-riga .mo-campo select { max-width: 16rem; }

/* dialoghi */
.mo-dialogo { margin: auto; border: none; border-radius: var(--radius); padding: 0; width: min(34rem, calc(100vw - 2rem)); max-height: calc(100vh - 2rem);
  box-shadow: 0 12px 40px rgba(0,0,0,.3); color: var(--text); background: var(--surface); }
.mo-dialogo.mo-largo { width: min(60rem, calc(100vw - 2rem)); }
.mo-dialogo::backdrop { background: rgba(15, 23, 42, .45); }
.mo-dlg-form { display: flex; flex-direction: column; max-height: calc(100vh - 2rem); }
.mo-dlg-testa { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .85rem 1.1rem; border-bottom: 1px solid var(--border); }
.mo-dlg-testa h3 { font-size: 1.05rem; }
.mo-chiudi { background: transparent; border: none; font-size: 1.1rem; cursor: pointer; min-width: 2.25rem; min-height: 2.25rem; border-radius: var(--radius); }
.mo-chiudi:focus-visible { outline: 2px solid var(--accent); }
.mo-dlg-corpo { padding: 1rem 1.1rem; overflow-y: auto; display: flex; flex-direction: column; gap: .75rem; }
.mo-dlg-corpo h4 { font-size: .95rem; margin-top: .5rem; }
.mo-dlg-errore { padding: 0 1.1rem; }
.mo-dlg-errore:empty { display: none; }
.mo-dlg-azioni { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: .5rem; padding: .75rem 1.1rem; border-top: 1px solid var(--border); }
.mo-messaggio { line-height: 1.45; }

/* tablet */
@media (max-width: 1024px) {
  #view-modulo .mo-campo input[type=search] { min-width: 12rem; }
}

/* telefono: righe delle tabelle come schede, campi a tutta larghezza, bottoni grandi */
@media (max-width: 640px) {
  .mo-schede-viste { flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; }   /* F-G3-06 */
  .mo-barra { flex-direction: column; align-items: stretch; }
  .mo-campo input[type=search], .mo-campo input, .mo-campo select { min-width: 0; width: 100%; }
  .mo-riga .mo-campo, .mo-gruppo .mo-campo { flex: 1 1 100%; }
  .mo-riga .mo-campo select { max-width: none; }
  .mo-barra button, .mo-persona-azioni button, .mo-dlg-azioni button { min-height: 2.75rem; }
  .mo-persona-azioni button { flex: 1 1 auto; }
  .mo-persona { padding: .6rem .7rem; }
  .mo-carte thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .mo-carte, .mo-carte tbody, .mo-carte tr, .mo-carte td { display: block; width: 100%; }
  .mo-carte tr { border-bottom: 1px solid var(--border); padding: .35rem 0; }
  .mo-carte td, .mo-carte td:last-child { border: none; padding: .2rem .5rem; display: flex; justify-content: space-between; gap: 1rem;
    text-align: right; white-space: normal; min-width: 0; }
  .mo-carte td::before { content: attr(data-etichetta); color: var(--muted); font-weight: 600; text-align: left; }
  .mo-carte td[data-etichetta=""]::before { content: none; }
  .mo-carte td .mo-num { display: inline; }
  .mo-carte td.mo-vuoto { display: block; text-align: left; }
  .mo-carte td.mo-vuoto::before { content: none; }
  .mo-dialogo, .mo-dialogo.mo-largo { width: 100vw; max-width: 100vw; max-height: 100vh; height: 100%; border-radius: 0; margin: 0; }
  .mo-dlg-form { max-height: 100vh; height: 100%; }
  .mo-dlg-corpo { flex: 1; }
}
