/* Rapportino — pensato prima per il telefono */

.tb-app {
	max-width: 640px;
	margin: 0 auto;
	font-size: 17px;
	line-height: 1.5;
	color: #1d2327;
}

.tb-app * { box-sizing: border-box; }

.tb-app-testa {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: .6rem 0;
	border-bottom: 1px solid #e2e4e7;
}
.tb-app-nome { font-weight: 600; }
.tb-esci { font-size: .85em; color: #646970; }

/*
 * Le linguette vanno a capo.
 *
 * Con cinque ci stavano; **con la sesta — la Rubrica — l'ultima usciva dallo
 * schermo del telefono** e non c'era modo di arrivarci, perche' `flex` senza
 * `wrap` non manda a capo e qui non c'e' nessuno scorrimento orizzontale. Una
 * voce di menu invisibile e' una voce che non esiste.
 *
 * `flex: 1 1 6.5rem` dice: dividetevi la riga, ma **sotto i 104 pixel andate a
 * capo**. Su un telefono vengono tre per riga, tutte leggibili; sul computer
 * restano su una riga sola come prima.
 */
.tb-tab {
	display: flex;
	flex-wrap: wrap;
	gap: .25rem;
	margin: .75rem 0 1rem;
}
.tb-tab a {
	flex: 1 1 6.5rem;
	text-align: center;
	padding: .7rem .4rem;
	background: #f0f0f1;
	border-radius: 8px;
	text-decoration: none;
	color: #2c3338;
	font-size: .95em;
}
.tb-tab a.attivo { background: #1d4ed8; color: #fff; font-weight: 600; }

.tb-msg {
	padding: .8rem 1rem;
	border-radius: 8px;
	margin-bottom: 1rem;
	background: #f0f6fc;
	border-left: 4px solid #1d4ed8;
}
.tb-msg-ok { background: #edfaef; border-left-color: #00a32a; }
.tb-msg-errore { background: #fcf0f1; border-left-color: #d63638; }

.tb-campo { display: block; margin-bottom: .9rem; }
.tb-campo > span { display: block; font-size: .85em; color: #50575e; margin-bottom: .25rem; }
.tb-campo input[type=text],
.tb-campo input[type=number],
.tb-campo input[type=date],
.tb-campo input[type=file],
.tb-campo select,
.tb-campo textarea {
	width: 100%;
	padding: .7rem;
	font-size: 17px;   /* sotto i 16px iOS ingrandisce la pagina da solo */
	border: 1px solid #8c8f94;
	border-radius: 8px;
	background: #fff;
}

.tb-due { display: flex; gap: .6rem; }
.tb-due .tb-campo { flex: 1; }

.tb-riga {
	border: 1px solid #dcdcde;
	border-radius: 10px;
	padding: .9rem;
	margin-bottom: .9rem;
	background: #fbfbfc;
}
.tb-riga legend { font-size: .8em; text-transform: uppercase; letter-spacing: .04em; color: #646970; padding: 0 .4rem; }

.tb-togli {
	background: none;
	border: 0;
	color: #b32d2e;
	font-size: .85em;
	padding: .3rem 0;
	cursor: pointer;
}

.tb-btn, .tb-btn-secondario {
	display: inline-block;
	padding: .85rem 1.2rem;
	border-radius: 8px;
	border: 0;
	font-size: 17px;
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
	text-align: center;
}
.tb-btn { background: #1d4ed8; color: #fff; }
.tb-btn[disabled] { opacity: .6; }
.tb-btn-secondario { background: #f0f0f1; color: #2c3338; border: 1px solid #c3c4c7; }
.tb-btn-grande { display: block; width: 100%; margin-bottom: 1rem; }

.tb-bottoni { display: flex; gap: .6rem; margin-top: 1rem; }
.tb-bottoni button { flex: 1; }

.tb-totale { font-size: 1.05em; margin: 1rem 0 .5rem; }

.tb-geo { font-size: .88em; min-height: 1.2em; margin: .5rem 0; }
.tb-geo-attesa { color: #996800; }
.tb-geo-ok { color: #007017; }
.tb-geo-ko { color: #b32d2e; }

.tb-nota-piccola { font-size: .82em; color: #646970; }

.tb-scelta-giorno { margin-bottom: 1rem; }
.tb-scelta-giorno label { font-size: .85em; color: #50575e; }
.tb-scelta-giorno input { display: block; width: 100%; padding: .7rem; font-size: 17px; border: 1px solid #8c8f94; border-radius: 8px; }

.tb-stato-riga {
	padding: .6rem .9rem;
	border-radius: 8px;
	margin-bottom: 1rem;
	font-weight: 600;
	background: #f0f0f1;
}
.tb-stato-riga.tb-stato-approvato { background: #edfaef; color: #007017; }
.tb-stato-riga.tb-stato-respinto  { background: #fcf0f1; color: #b32d2e; }
.tb-stato-riga.tb-stato-inviato   { background: #fcf9e8; color: #996800; }

.tb-giorni, .tb-lista-spese, .tb-lista-righe { list-style: none; margin: 0; padding: 0; }

.tb-giorno {
	border: 1px solid #dcdcde;
	border-left-width: 5px;
	border-radius: 8px;
	margin-bottom: .6rem;
	background: #fff;
}
.tb-giorno.tb-stato-approvato { border-left-color: #00a32a; }
.tb-giorno.tb-stato-inviato   { border-left-color: #dba617; }
.tb-giorno.tb-stato-respinto  { border-left-color: #d63638; }
.tb-giorno.tb-stato-bozza     { border-left-color: #c3c4c7; }

.tb-giorno > a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: .5rem;
	padding: .8rem .9rem;
	text-decoration: none;
	color: inherit;
}
.tb-giorno-data { font-weight: 600; text-transform: capitalize; }
.tb-giorno-ore { font-variant-numeric: tabular-nums; }
.tb-giorno-stato { font-size: .8em; color: #646970; }
.tb-giorno-dettaglio { padding: 0 .9rem .7rem; font-size: .85em; color: #646970; }
.tb-giorno-dettaglio span { display: block; }

.tb-lista-spese li {
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: .2rem .6rem;
	padding: .7rem .9rem;
	border: 1px solid #dcdcde;
	border-left-width: 5px;
	border-radius: 8px;
	margin-bottom: .6rem;
	font-size: .92em;
}
.tb-lista-spese li.tb-stato-approvata { border-left-color: #00a32a; }
.tb-lista-spese li.tb-stato-inviata   { border-left-color: #dba617; }
.tb-lista-spese li.tb-stato-respinta  { border-left-color: #d63638; }
.tb-spesa-importo { font-weight: 600; text-align: right; }
.tb-spesa-stato, .tb-spesa-commessa { grid-column: 1 / -1; font-size: .85em; color: #646970; }

.tb-respinto { color: #b32d2e; font-size: .88em; margin: .3rem 0 0; }
.tb-vuoto { color: #646970; padding: 1rem 0; }
.tb-titoletto { margin: 1.5rem 0 .6rem; font-size: 1.05em; }

.tb-lista-righe li { padding: .6rem 0; border-bottom: 1px solid #f0f0f1; }
.tb-lista-righe strong { display: block; }
.tb-lista-righe em { color: #646970; font-size: .9em; }

/* Modulo di accesso dentro la pagina */

.tb-accesso {
	max-width: 400px;
	margin: 1.5rem auto;
	padding: 1.6rem 1.4rem;
	background: #fff;
	border: 1px solid #dcdcde;
	border-radius: 12px;
}
.tb-accesso-titolo { margin: 0 0 .3rem; font-size: 1.25em; }
.tb-accesso-sotto { margin: 0 0 1.2rem; color: #646970; font-size: .9em; }
.tb-accesso .tb-campo { margin-bottom: 1rem; }
.tb-accesso input[type=text],
.tb-accesso input[type=password] {
	width: 100%;
	padding: .75rem;
	font-size: 17px;
	border: 1px solid #8c8f94;
	border-radius: 8px;
	background: #fff;
}
.tb-ricorda { display: flex; align-items: center; gap: .5rem; font-size: .9em; color: #50575e; margin-bottom: 1rem; }
.tb-accesso .tb-bottoni button { width: 100%; }
.tb-accesso .tb-nota-piccola { margin: 1rem 0 0; text-align: center; }
.tb-accesso .tb-msg { font-size: .92em; }

.tb-ctrl-login, .tb-app-login { padding-top: .5rem; }

/* Il campo che ha fatto fallire l'invio. Sul telefono deve gridare. */
.tb-campo-manca {
	border-color: #d63638 !important;
	box-shadow: 0 0 0 2px rgba( 214, 54, 56, .15 );
}
.tb-msg-manca { margin-bottom: 1rem; }

/* «L'ho fatto da remoto»: una casella grossa, si tocca col pollice sporco. */
.tb-remoto {
	flex-direction: row;
	align-items: center;
	gap: .7rem;
	padding: .7rem .9rem;
	background: #f6f7f7;
	border-radius: 10px;
}
.tb-remoto input[type="checkbox"] { width: 1.4rem; height: 1.4rem; margin: 0; flex: 0 0 auto; }
.tb-remoto span { font-weight: 600; }

.tb-recupero { margin-top: 1.2rem; border-top: 1px solid #ececee; padding-top: .8rem; }
.tb-recupero summary { cursor: pointer; color: #1d4ed8; font-size: .93em; }
.tb-recupero[open] summary { margin-bottom: .8rem; font-weight: 600; }

/* --------------------------------------------------- dove si va (rapportino) */
.tb-cantiere { margin: .1rem 0 .8rem; padding: .7rem .85rem; background: #f0f6ff;
	border-left: 3px solid #2271b1; border-radius: 0 4px 4px 0; }
.tb-cantiere p { margin: 0 0 .35rem; font-size: .95rem; line-height: 1.4; }
.tb-cantiere p:last-child { margin-bottom: 0; }
.tb-cantiere-dove strong { display: inline-block; margin-right: .5rem; }
.tb-cantiere-rif { color: #50575e; font-size: .88rem !important; }
.tb-cantiere-note { color: #1d2327; }
.tb-naviga { display: inline-block; padding: .2rem .7rem; background: #2271b1; color: #fff !important;
	border-radius: 999px; font-size: .82rem; text-decoration: none; white-space: nowrap; }
.tb-naviga:hover { background: #135e96; }

/* ---------------------------------------------- foto del lavoro fatto

   Il rapportino dice gia' chi c'era: data, ora e coordinate. Le foto dicono
   cosa ha fatto. Stanno dentro la commessa, perche' una giornata puo' toccare
   due clienti e una foto che non si sa di chi e' non certifica niente. */

.tb-foto-riga { margin: .6rem 0 .2rem; }
.tb-foto-riga input[type="file"] { width: 100%; font-size: 17px; padding: .5rem 0; }

.tb-foto-fatte { list-style: none; display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 .6rem; padding: 0; }
.tb-foto-fatte img { display: block; width: 84px; height: 84px; object-fit: cover; border-radius: 6px; border: 1px solid #c3c4c7; background: #f0f0f1; }

/* Bersaglio da pollice: si tocca in cantiere, con una mano sola. */
.tb-foto-togli { display: flex; align-items: center; gap: .3rem; margin-top: .25rem; font-size: .82em; color: #b32d2e; }
.tb-foto-togli input { width: 22px; height: 22px; margin: 0; }

/* ------------------------------------------- «La posizione non funziona?»

   Pagina da leggere in piedi, col telefono in mano e il lavoro da finire:
   testo grande, un pulsante solo, e l'esito che si distingue a colpo d'occhio
   fra «funziona» e «no». */

.tb-diagnosi { margin: 1rem 0 1.5rem; }
.tb-diagnosi .tb-btn { width: 100%; }

.tb-esito-posizione:empty { display: none; }
.tb-esito-posizione {
	margin-top: .9rem; padding: .9rem 1rem; border-radius: 10px;
	font-size: 16px; line-height: 1.55; border-left: 4px solid #8c8f94; background: #f6f7f7;
}
.tb-esito-posizione.tb-ok     { border-left-color: #007017; background: #edf7ee; }
.tb-esito-posizione.tb-ko     { border-left-color: #b32d2e; background: #fcf0f1; }
.tb-esito-posizione.tb-attesa { border-left-color: #b26200; background: #fcf9e8; }

.tb-sotto-titolo { margin: 1.8rem 0 .4rem; font-size: 1.05em; }
.tb-passi { margin: .4rem 0 0 1.2rem; padding: 0; font-size: 16px; line-height: 1.7; }
.tb-passi li { margin-bottom: .5rem; }

/* Il progetto allegato a fine giornata: chiuso di suo, cosi' non allunga il
   modulo per chi non ha impianti KNX. */
.tb-progetto { margin: 1rem 0; padding: .8rem 1rem; border: 1px dashed #c3c4c7; border-radius: 10px; }
.tb-progetto summary { cursor: pointer; font-size: 17px; font-weight: 600; }
.tb-progetto[open] summary { margin-bottom: .6rem; }
.tb-progetto input[type="file"] { width: 100%; font-size: 17px; padding: .5rem 0; }

/* ------------------------------------- materiale preso e richieste (1.26.0) */

/* Due campi affiancati sul telefono — quantita' e unita' — che stanno stretti
   ma stanno: separarli su due righe fa scorrere il modulo il doppio. */
.tb-griglia-due { display: flex; gap: .6rem; }
.tb-griglia-due .tb-campo { flex: 1 1 0; min-width: 0; }
.tb-griglia-due .tb-campo:last-child { flex: 0 0 6.5rem; }

.tb-materiale-riga {
	margin: .7rem 0 .3rem; padding: .7rem .8rem .4rem;
	border: 1px dashed #c3c4c7; border-radius: 10px; background: #fbfbfc;
}
.tb-materiale-riga .tb-titoletto { margin: 0 0 .5rem; font-size: .95em; }
.tb-mat-riga { padding-bottom: .3rem; }
.tb-mat-riga + .tb-mat-riga { border-top: 1px solid #ececee; padding-top: .6rem; }
.tb-mat-riga input:disabled, .tb-mat-riga select:disabled { background: #f0f0f1; color: #646970; }

.tb-btn-testo {
	background: none; border: 0; padding: .3rem 0; margin: 0;
	color: #2271b1; font: inherit; font-size: .95em; cursor: pointer; text-decoration: underline;
}
.tb-campo-spunta { display: flex; align-items: center; gap: .5rem; }
.tb-campo-spunta input { width: auto; }

/* ------------------------------------------------------ scaffale dei manuali
 *
 * Sta qui e non in `controllo.css` perche' **i manuali si aprono da due posti**:
 * la pagina di controllo e l'app dei collaboratori sul telefono. `app.css` e'
 * l'unico foglio che viene caricato in tutti e due — `controllo.css` sulla
 * pagina del rapportino non arriva, e la prima volta la lista e' uscita nuda,
 * un elenco puntato di link sottolineati.
 */

.tb-cerca-manuali { display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; margin: .6rem 0 .8rem; }
.tb-cerca-manuali input[type="search"] {
	flex: 1 1 260px; padding: .55rem .7rem; font-size: 16px;
	border: 1px solid #8c8f94; border-radius: 8px; background: #fff;
}
.tb-cerca-manuali button { padding: .55rem .9rem; font-size: 15px; }

/* Gli scaffali: pastiglie, non una tendina. Una tendina nasconde quello che c'e'
   dentro, e qui la domanda e' proprio «cosa ho?» — il numero accanto al nome
   risponde prima ancora di aprire. */
.tb-scaffali { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: 1rem; }
.tb-scaffale {
	display: inline-flex; align-items: center; gap: .35rem;
	padding: .35rem .7rem; border-radius: 999px;
	background: #f1f2f4; color: #2c3338; text-decoration: none; font-size: .86em;
	border: 1px solid transparent;
}
.tb-scaffale:hover { background: #e6e8ec; }
.tb-scaffale span { font-size: .85em; color: #6b7280; font-variant-numeric: tabular-nums; }
.tb-scaffale.attivo { background: #1d4ed8; color: #fff; border-color: #1d4ed8; }
.tb-scaffale.attivo span { color: #cdd9f7; }

.tb-lista-manuali { list-style: none; margin: 0 0 1.2rem; padding: 0; }
.tb-lista-manuali li {
	display: flex; align-items: flex-start; gap: .6rem;
	border: 1px solid #e3e4e6; border-radius: 10px;
	margin-bottom: .45rem; background: #fff;
}
.tb-lista-manuali li:hover { border-color: #c3c9d4; }
/* Tutta la riga e' il bersaglio, non il solo titolo: col pollice, un
   collegamento di due parole in mezzo a una riga alta si manca. */
.tb-manuale-apri { flex: 1; display: block; padding: .7rem .85rem; text-decoration: none; color: inherit; }
.tb-manuale-nome { display: block; font-weight: 600; line-height: 1.3; }
.tb-manuale-chi  { display: block; font-size: .88em; color: #1d4ed8; margin-top: .1rem; }
.tb-manuale-note { display: block; font-size: .86em; color: #5b6270; margin-top: .15rem; }
.tb-manuale-sotto{ display: block; font-size: .78em; color: #8c8f94; margin-top: .3rem; }
.tb-manuale-azioni { display: flex; flex-direction: column; gap: .2rem; padding: .7rem .85rem .7rem 0; font-size: .84em; }

/* ------------------------------------------------- le pagine del gestionale
 *
 * Stava in `controllo.css`, ed era **meta' del lavoro**: sulla pagina del
 * rapportino, che carica solo `app.css`, il titolone del tema e il pie' di
 * pagina con Blog / Events / Shop c'erano ancora. Il collaboratore col telefono
 * si trovava mezzo schermo di roba del tema prima delle sue schede — proprio
 * lui, che ha meno schermo di tutti.
 */

/*
 * Il tema, su queste pagine, stampa roba sua: il titolo grande «Controllo»
 * sopra una schermata che il suo titolo ce l'ha gia', e in fondo il pie' di
 * pagina del sito con Blog, Events, Shop, FAQs, Authors, Themes — voci
 * del tema di partenza, mai scritte da nessuno qui dentro.
 *
 * Si nascondono **solo** dove c'e' la classe `tb-pagina-gestione`, cioe' sulle
 * pagine che contengono i nostri shortcode. Il resto di tecnobet.it non se ne
 * accorge, e il menu in alto resta al suo posto: e' la strada per tornare al
 * sito.
 *
 * Con `:where()` la regola pesa quanto un selettore solo, e non va a litigare
 * con quello che il tema decide per le stesse parti altrove.
 */
.tb-pagina-gestione :where(.wp-block-post-title),
.tb-pagina-gestione :where(.wp-site-blocks) > :where(footer.wp-block-template-part) {
	display: none;
}
/*
 * Il tema lascia settanta pixel sopra il contenuto e altri settanta dentro:
 * respiro pensato per un articolo che sotto ha un titolo grande. Tolto il
 * titolo restava un buco alto quanto mezza schermata di telefono, prima di
 * arrivare alla prima riga.
 *
 * **Qui `!important` ci vuole davvero.** Non e' pigrizia: il tema scrive quei
 * due valori nell'attributo `style` del tag, dentro l'HTML
 * (`style="margin-top:var(--wp--preset--spacing--60)"`), e uno stile scritto
 * li' batte qualunque selettore per quanto lo si allunghi. Provato prima per
 * specificita' e verificato che perdeva. E' l'unico caso del foglio dove serve,
 * ed e' chiuso dentro `.tb-pagina-gestione`: fuori dal gestionale non tocca
 * niente.
 */
body.tb-pagina-gestione .wp-site-blocks > main { margin-block-start: 1.4rem !important; }
body.tb-pagina-gestione .wp-site-blocks > main > .wp-block-group { padding-top: 0 !important; }

/* ================================================================== rubrica
   Le persone. Sta in app.css e non in controllo.css per la ragione gia'
   costata due volte: **su /rapportino controllo.css non viene caricato**, e
   una lista messa li' esce nuda sul telefono — un elenco puntato di link
   sottolineati. E' successo ai manuali, e poi di nuovo. Quello che si vede in
   tutte e due le pagine sta qui. */

.tb-rubrica { list-style: none; margin: .8rem 0; padding: 0; }
.tb-rubrica li {
	border: 1px solid #dcdcde; border-radius: 10px;
	padding: .7rem .85rem; margin-bottom: .6rem; background: #fff;
}
.tb-persona-chi { display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem .6rem; }
.tb-persona-nome { font-weight: 600; font-size: 1.02em; }
.tb-persona-ruolo { color: #1d4ed8; font-size: .9em; }
.tb-persona-ditta { color: #50575e; font-size: .9em; }
.tb-persona-scaffale { color: #6b7280; font-size: .82em; flex-basis: 100%; }
.tb-persona-note { margin: .45rem 0 0; color: #50575e; font-size: .9em; }
.tb-persona-fuori { opacity: .55; }

/* I recapiti sono bersagli per un pollice, non righe di testo: in cantiere si
   tocca con i guanti, e un link alto 16 pixel non si prende. */
.tb-persona-recapiti { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .5rem; }
.tb-recapito {
	display: inline-block; text-decoration: none;
	padding: .5rem .8rem; min-height: 2.6rem; line-height: 1.6rem;
	border: 1px solid #cdd9f7; border-radius: 999px;
	background: #eef3fe; color: #1d4ed8;
	font-variant-numeric: tabular-nums; font-size: 1em;
}
.tb-recapito:hover { background: #dfe8fd; }
.tb-recapito-mail { border-color: #dcdcde; background: #f4f4f5; color: #3c434a; }

.tb-persona-azioni { display: flex; gap: .9rem; margin-top: .55rem; font-size: .9em; }

/* Sul telefono i numeri vanno a tutta larghezza, uno per riga: due pastiglie
   affiancate su uno schermo stretto si toccano per sbaglio. */
@media (max-width: 520px) {
	.tb-rubrica-tel .tb-persona-recapiti { flex-direction: column; }
	.tb-rubrica-tel .tb-recapito { text-align: center; }
}

/* La via di scampo nel rapportino, accanto alla tendina delle commesse.
   Sta in app.css e non in controllo.css: il rapportino si compila dal telefono,
   dove controllo.css non viene caricato. E' la trappola gia' costata i manuali
   e poi la rubrica. */
.tb-non-in-elenco {
	background: #f0f6fc; border-left: 3px solid #1d4ed8;
	padding: .5rem .7rem; border-radius: 0 6px 6px 0; margin: -.3rem 0 .8rem;
	line-height: 1.45;
}

/*
 * «Dove sta la roba»: l'elenco di consultazione del magazzino, nella pagina
 * Materiale del collaboratore.
 *
 * Sta in app.css e non in controllo.css perche' vive su /rapportino/, dove
 * controllo.css non viene caricato. E' la trappola che e' gia' costata tre
 * funzioni comparse a video senza uno stile.
 */
.tb-dove-sta { margin: 1rem 0; border: 1px solid #dcdcde; border-radius: 8px; background: #fff; }
.tb-dove-sta > summary {
	padding: .8rem 1rem; font-weight: 600; cursor: pointer; list-style: none;
}
.tb-dove-sta > summary::-webkit-details-marker { display: none; }
.tb-dove-sta > summary::before { content: "▸ "; color: #8c8f94; }
.tb-dove-sta[open] > summary::before { content: "▾ "; }
.tb-dove-filtro {
	display: block; width: calc( 100% - 2rem ); margin: 0 1rem .6rem;
	font-size: 17px; padding: .55rem .7rem;
	border: 1px solid #8c8f94; border-radius: 6px;
}
.tb-dove-elenco { list-style: none; margin: 0; padding: 0 0 .4rem; max-height: 60vh; overflow-y: auto; }
.tb-dove-elenco li {
	display: flex; flex-wrap: wrap; gap: .1rem .8rem; justify-content: space-between;
	padding: .55rem 1rem; border-top: 1px solid #f0f0f1;
}
.tb-dove-nome { font-weight: 600; flex: 1 1 60%; }
.tb-dove-dettaglio { color: #50575e; flex: 0 0 auto; }
.tb-dove-niente { margin: 0 1rem .8rem; }
.tb-dove-sta > p:last-child { margin: .2rem 1rem .9rem; color: #50575e; }

/* ---------------------------------- le voci del preventivo da spuntare
   Elenco lungo dentro un modulo gia' lungo: altezza limitata e scorrimento
   suo, cosi' il pulsante «Aggiungi» resta raggiungibile senza scorrere
   trenta righe. Sul telefono conta piu' di tutto il resto. */
.tb-mat-prev { margin-top: .6rem; }
.tb-mat-prev > summary { cursor: pointer; font-weight: 600; padding: .35rem 0; }
.tb-mat-prev-elenco { max-height: 16rem; overflow-y: auto; margin: .4rem 0 .6rem;
	border: 1px solid #dcdcde; border-radius: .25rem; }
.tb-mat-prev-voce { display: flex; align-items: flex-start; gap: .45rem;
	padding: .4rem .5rem; border-bottom: 1px solid #f0f0f1; font-size: .93em; }
.tb-mat-prev-voce:last-child { border-bottom: 0; }
.tb-mat-prev-voce input[type="checkbox"] { margin-top: .25rem; flex: 0 0 auto; }
.tb-mat-prev-quanto { width: 4.6rem; flex: 0 0 auto; padding: .2rem .3rem; }
.tb-mat-prev-um { flex: 0 0 2.2rem; color: #50575e; padding-top: .3rem; }
.tb-mat-prev-testo { flex: 1 1 auto; line-height: 1.35; }