/* Pagine del gruppo A (Spese, Da verificare, Scansiona, Documenti): solo cio' che non sta nel design system. */

/* link che sembra un bottone (azione principale della testata) */
a.bottone-link { display: inline-flex; align-items: center; gap: .4rem; padding: .6rem 1.15rem; border-radius: var(--raggio-campo);
                 background: var(--accento); color: var(--accento-testo); font-weight: 600; font-size: .88rem; text-decoration: none; }
a.bottone-link:hover { background: var(--accento-hover); }
a.bottone-link.secondario { background: var(--carta); color: var(--testo); border: 1px solid var(--bordo-forte); }
a.bottone-link.secondario:hover { background: var(--sfondo); }

/* --- Spese: filtri su tre righe (1 data, 2 filtri vari, 3 ricerca) ---------------------------------- */
.filtri-spese { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end; }
.filtri-spese .segmenti { grid-column: 1 / -1; display: flex; width: 100%; justify-self: stretch; }
.filtri-spese .segmenti button { flex: 1 1 0; text-align: center; }
.filtri-spese .cerca { grid-column: 1 / -1; }
.filtri-spese .intervallo { grid-column: 1 / -1; }

/* movimenti: l'importo resta sempre allineato a destra, titolo e dettagli si troncano */
.movimento .importo { min-width: 6.5rem; font-size: .95rem; }
.movimento .sotto .etichetta:first-child { margin-left: .5rem; }
.etichetta.utenza { background: color-mix(in srgb, var(--cat-viola) 14%, transparent); color: var(--cat-viola); }
.etichetta.privata { background: var(--sfondo); color: var(--tenue); border: 1px solid var(--bordo); }
.etichetta.da-verificare { background: var(--attenzione); color: var(--attenzione-testo); }

/* pannello riepilogo: totale in grande, sezioni con titolo chiaro */
.pannello .riepilogo-totale { padding: 1rem 1.1rem; border-radius: var(--raggio-scheda); background: var(--sfondo); }
.pannello .totale strong { font-size: 2rem; line-height: 1.1; margin-top: .25rem; }
.pannello .totale .nota { font-size: .78rem; }
.pannello h3 { margin: .5rem 0 -.2rem; }
.pannello .nota#nota-riepilogo { margin: 0; }

/* grafico in scheda */
.grafico.scheda { margin: 0 0 1.75rem; }
.grafico.scheda svg { max-height: none; width: 100%; height: auto; }

/* modulo del movimento: gruppi con titolo */
.gruppo { display: grid; gap: .8rem; padding: 0 0 1rem; margin: 0 0 1rem; border-bottom: 1px solid var(--bordo); }
.gruppo:last-of-type { border-bottom: 0; margin-bottom: 0; }
.gruppo > legend { padding: 0; font-size: .72rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em;
                   color: var(--tenue); margin-bottom: .1rem; }
form.modulo .gruppo + .gruppo { padding-top: .25rem; }

/* --- Da verificare ----------------------------------------------------------------------------------- */
.sezione .conf-recenti { padding: 0 1.1rem; margin: 0; }
.sezione .conf-recenti .collegato { padding: .75rem 0; }

/* --- Scansiona: passi numerati, pagine e dati insieme in una sezione che appare solo quando serve ------- */
.sezione:has(#pagine:empty):has(#dati[hidden]) { display: none; }
.passo { display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; margin-right: .5rem; border-radius: 50%;
         background: var(--accento); color: var(--accento-testo); font-size: .78rem; font-weight: 700; vertical-align: middle; }
.scheda.scatto { padding: 1.25rem; }
form#dati.scheda { margin-top: 0; }
#pagine + #dati { margin-top: .25rem; }

/* --- Documenti: ricerca in evidenza, filtri avanzati a scomparsa -------------------------------------- */
.filtri-doc { grid-template-columns: 1fr; gap: .75rem; }
.filtri-doc .riga-ricerca { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); gap: .6rem; align-items: end; }
.filtri-doc details { border-top: 1px solid var(--bordo); padding-top: .6rem; }
.filtri-doc details summary { font-size: .8rem; font-weight: 600; color: var(--tenue); }
.filtri-doc details .doppio { margin-top: .7rem; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.griglia-documenti { gap: 1rem; }
button.doc { transition: border-color .12s, box-shadow .12s; }
button.doc:hover { box-shadow: var(--ombra-alta); }

@media (max-width: 800px) {
  .filtri-spese { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filtri-doc .riga-ricerca { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .movimento .importo { min-width: 0; }
  .filtri-spese { grid-template-columns: 1fr; }
  .filtri-spese .segmenti { flex-wrap: wrap; }
  .filtri-spese .segmenti button { flex: 1 1 auto; padding: .4rem .5rem; }
  .pannello .totale strong { font-size: 1.6rem; }
}

.intro-doc { margin: -.5rem 0 1.25rem; max-width: 70ch; }

/* riepilogo: risultato del mese colorato e righe entrate/uscite */
.pannello .totale strong.entrata { color: var(--entrata); }
.pannello .totale strong.uscita { color: var(--uscita); }
.entrate-uscite { display: grid; gap: .35rem; margin: .8rem 0 0; padding-top: .7rem; border-top: 1px solid var(--bordo); }
.entrate-uscite > div { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; font-size: .9rem; }
.entrate-uscite dt { color: var(--tenue); font-size: .8rem; font-weight: 500; }
.entrate-uscite dd { margin: 0; font-weight: 650; font-variant-numeric: tabular-nums; }
.entrate-uscite .entrata dd { color: var(--entrata); }
.entrate-uscite .uscita dd { color: var(--uscita); }

/* --- Documenti in stile Finder (D29): barra, percorso, viste Icone / Elenco / Colonne, anteprima, Quick Look --------- */
body.app > main.fnd > * { max-width: none; }
.fnd-app { display: grid; grid-template-columns: 15rem minmax(0, 1fr) 19rem; height: calc(100vh - 13rem); min-height: 34rem;
           background: var(--carta); border: 1px solid var(--bordo); border-radius: var(--raggio-scheda); overflow: hidden; }
.fnd-barra { background: var(--sfondo); border-right: 1px solid var(--bordo); overflow-y: auto; padding: .75rem .5rem 1rem; }
.fnd-sezione { margin-bottom: 1rem; }
.fnd-titolo-sezione { display: flex; align-items: center; justify-content: space-between; padding: .2rem .6rem; font-size: .68rem;
                      font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: var(--tenue); }
.fnd-titolo-sezione button.link { font-size: inherit; font-weight: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit; }
.fnd-riga { position: relative; display: flex; align-items: center; border-radius: 8px; padding-left: calc(var(--livello, 0) * .9rem); }
.fnd-riga:hover { background: color-mix(in srgb, var(--accento) 8%, transparent); }
.fnd-riga.attiva { background: var(--accento-tenue); }
.fnd-riga.bersaglio, .fnd-briciola.bersaglio, .fnd-voce.bersaglio { outline: 2px solid var(--accento); outline-offset: -2px; background: var(--accento-tenue); }
.fnd-voce-barra { flex: 1; display: flex; align-items: center; gap: .5rem; min-width: 0; margin: 0; padding: .35rem .5rem; background: none; border: 0;
                  color: var(--testo); font-size: .86rem; font-weight: 500; text-align: left; border-radius: 8px; }
.fnd-voce-barra:hover { background: none; }
.fnd-riga.attiva .fnd-voce-barra { font-weight: 650; }
.fnd-voce-barra svg.icona { color: var(--accento); width: 16px; height: 16px; }
.fnd-etichetta { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fnd-conta { font-size: .72rem; color: var(--tenue); font-variant-numeric: tabular-nums; }
.fnd-freccia { flex: none; display: inline-grid; place-items: center; width: 1.1rem; height: 1.6rem; margin: 0; padding: 0; background: none; border: 0; color: var(--tenue); }
.fnd-freccia:hover { background: none; color: var(--testo); }
.fnd-freccia svg.icona { width: 12px; height: 12px; transition: transform .12s; }
.fnd-freccia.aperta svg.icona { transform: rotate(90deg); }
.fnd-azioni { display: none; flex: none; padding-right: .15rem; }
.fnd-riga:hover .fnd-azioni { display: inline-flex; }
.fnd-azioni button.icona-btn { width: 24px; height: 24px; }
.fnd-vuoto { margin: .25rem .6rem; color: var(--tenue); font-size: .8rem; }

.fnd-centro { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.fnd-strumenti { display: flex; align-items: center; gap: .6rem; padding: .55rem .75rem; border-bottom: 1px solid var(--bordo); flex-wrap: wrap; }
.fnd-navigazione { display: inline-flex; gap: .15rem; }
.fnd-navigazione button { width: 28px; height: 28px; font-size: 1.1rem; line-height: 1; border: 1px solid var(--bordo-forte); background: var(--carta); color: var(--testo); }
.fnd-navigazione button:disabled { opacity: .35; }
.fnd-percorso { display: flex; align-items: center; gap: .1rem; flex: 1; min-width: 8rem; overflow: hidden; }
.fnd-briciola { margin: 0; padding: .2rem .45rem; background: none; border: 0; color: var(--testo); font-size: .86rem; font-weight: 500; border-radius: 6px; white-space: nowrap; }
.fnd-briciola:hover:not(:disabled) { background: var(--sfondo); }
.fnd-briciola.corrente { font-weight: 700; cursor: default; opacity: 1; }
.fnd-briciola:disabled { opacity: 1; }
.fnd-separatore { color: var(--tenue); }
.fnd-cerca { width: 12rem; height: 2rem; font-size: .85rem; }
#fnd-filtri-apri { margin: 0; }
.fnd-mobile { display: none; flex: 1; }
.fnd-filtri { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: .6rem; padding: .7rem .75rem; border-bottom: 1px solid var(--bordo); background: var(--sfondo); }
.fnd-contenuto { flex: 1; min-height: 0; overflow: auto; outline: none; padding: .75rem; }
.fnd-contenuto[data-vista=colonne] { padding: 0; overflow: hidden; }
.fnd-contenuto:focus-visible { box-shadow: inset 0 0 0 2px var(--accento-tenue); }
.fnd-stato { padding: .35rem .75rem; border-top: 1px solid var(--bordo); font-size: .76rem; color: var(--tenue); }

.fnd-griglia { display: grid; grid-template-columns: repeat(auto-fill, minmax(8.5rem, 1fr)); gap: .5rem; }
.fnd-voce { cursor: default; user-select: none; border-radius: 10px; }
.fnd-icona { display: grid; grid-template-rows: 6.5rem auto auto; gap: .2rem; justify-items: center; padding: .55rem .4rem .5rem; text-align: center; border: 2px solid transparent; }
.fnd-icona:hover { background: var(--sfondo); }
.fnd-voce.selezionato { background: var(--accento-tenue); }
.fnd-icona.selezionato { border-color: var(--accento); }
.fnd-voce.trascinato { opacity: .45; }
.fnd-nome { max-width: 100%; font-size: .82rem; font-weight: 600; line-height: 1.25; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-word; }
.fnd-sotto { max-width: 100%; font-size: .72rem; color: var(--tenue); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fnd-mini { display: grid; place-items: center; width: 100%; height: 100%; min-height: 0; overflow: hidden; border-radius: 8px; background: var(--sfondo); border: 1px solid var(--bordo); }
.fnd-mini img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fnd-mini .segnaposto svg.icona { width: 30px; height: 30px; }
.fnd-mini .segnaposto b { font-size: .65rem; }
.fnd-mini.piccola { width: 1.7rem; height: 2rem; flex: none; border-radius: 4px; }
.fnd-mini.piccola .segnaposto { gap: 0; }
.fnd-mini.piccola .segnaposto svg.icona { width: 14px; height: 14px; }
.fnd-mini.piccola .segnaposto b { display: none; }
.fnd-cartella-icona { display: grid; place-items: center; width: 100%; height: 100%; color: var(--accento); }
.fnd-cartella-icona svg.icona { width: 68%; height: 68%; stroke-width: 1.3; fill: color-mix(in srgb, var(--accento) 14%, transparent); }
.fnd-cartella-icona.piccola { width: 1.7rem; height: 2rem; flex: none; }
.fnd-cartella-icona.piccola svg.icona { width: 22px; height: 22px; }

.fnd-tabella { margin: 0; }
.fnd-tabella table { font-size: .86rem; }
.fnd-ordina { margin: 0; padding: 0; background: none; border: 0; color: inherit; font: inherit; text-transform: inherit; letter-spacing: inherit; cursor: pointer; }
.fnd-ordina:hover { background: none; color: var(--testo); }
.fnd-riga-elenco { cursor: default; user-select: none; }
.fnd-riga-elenco.selezionato { background: var(--accento-tenue); }
.fnd-riga-elenco.selezionato td { background: transparent; }
.fnd-nome-elenco { display: flex; align-items: center; gap: .55rem; font-weight: 600; }
.fnd-tabella td:last-child { white-space: normal; text-align: left; }

.fnd-colonne { display: flex; height: 100%; overflow-x: auto; overflow-y: hidden; }
.fnd-col { flex: none; width: 15rem; height: 100%; overflow-y: auto; border-right: 1px solid var(--bordo); padding: .3rem; }
.fnd-voce-colonna { display: flex; align-items: center; gap: .5rem; padding: .3rem .45rem; font-size: .84rem; }
.fnd-voce-colonna:hover { background: var(--sfondo); }
.fnd-voce-colonna.nel-percorso { background: color-mix(in srgb, var(--accento) 22%, transparent); }
.fnd-voce-colonna.selezionato { background: var(--accento); color: var(--accento-testo); }
.fnd-voce-colonna.selezionato .fnd-cartella-icona, .fnd-voce-colonna.selezionato .fnd-freccia-colonna { color: inherit; }
.fnd-nome-colonna { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fnd-freccia-colonna { color: var(--tenue); display: inline-grid; }
.fnd-freccia-colonna svg.icona { width: 12px; height: 12px; }
.fnd-col-anteprima { width: 19rem; padding: 1rem; border-right: 0; }

.fnd-anteprima { border-left: 1px solid var(--bordo); overflow-y: auto; padding: 1rem; background: var(--sfondo); }
.fnd-app:has(.fnd-contenuto[data-vista=colonne]) { grid-template-columns: 15rem minmax(0, 1fr); }
.fnd-app:has(.fnd-contenuto[data-vista=colonne]) .fnd-anteprima { display: none; }
.fnd-scheda { display: grid; gap: .75rem; }
.fnd-grande { display: grid; place-items: center; width: 100%; height: 11rem; margin: 0; padding: 0; overflow: hidden; border-radius: 10px;
              background: var(--carta); border: 1px solid var(--bordo); color: var(--tenue); cursor: zoom-in; }
.fnd-grande:hover { background: var(--carta); }
.fnd-grande img { width: 100%; height: 100%; object-fit: contain; background: var(--carta); }
.fnd-grande.cartella { color: var(--accento); cursor: default; }
.fnd-grande.cartella svg.icona { width: 5rem; height: 5rem; stroke-width: 1.2; }
.fnd-grande.molti svg.icona { width: 3rem; height: 3rem; }
.fnd-titolo-doc { margin: 0; font-size: 1rem; word-break: break-word; }
.fnd-dati { display: grid; gap: .35rem; margin: 0; font-size: .82rem; }
.fnd-dati > div { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); gap: .5rem; }
.fnd-dati dt { color: var(--tenue); }
.fnd-dati dd { margin: 0; font-weight: 500; word-break: break-word; }
.fnd-azioni-doc { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.fnd-azioni-doc button, .fnd-azioni-doc a { margin: 0; }
.fnd-sposta { font-size: .78rem; }
.fnd-suggerimento, .fnd-vuoto-grande { display: grid; justify-items: center; gap: .4rem; text-align: center; color: var(--tenue); padding: 2rem 1rem; }
.fnd-suggerimento svg.icona, .fnd-vuoto-grande svg.icona { width: 2.6rem; height: 2.6rem; stroke-width: 1.2; }
.fnd-suggerimento p, .fnd-vuoto-grande p { margin: 0; }

dialog.fnd-ql { width: min(960px, calc(100vw - 2rem)); height: min(82vh, 900px); padding: 0; border: 1px solid var(--bordo); border-radius: var(--raggio);
                background: var(--carta); color: var(--testo); box-shadow: var(--ombra-alta); display: flex; flex-direction: column; }
dialog.fnd-ql::backdrop { background: rgb(14 15 17 / .7); backdrop-filter: blur(3px); }
.fnd-ql-testa { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1rem 1.25rem; border-bottom: 1px solid var(--bordo); }
.fnd-ql-titolo { margin: 0; font-size: 1.05rem; }
.fnd-ql-dati { margin: .15rem 0 0; font-size: .82rem; color: var(--tenue); }
.fnd-ql-corpo { flex: 1; min-height: 0; display: grid; place-items: center; padding: 1rem; overflow: auto; background: var(--sfondo); }
.fnd-ql-corpo > img { max-width: 100%; max-height: 100%; object-fit: contain; }
.fnd-ql-pdf { display: grid; justify-items: center; gap: .6rem; }
.fnd-ql-pdf .segnaposto svg.icona { width: 5rem; height: 5rem; }
.fnd-ql-pdf img { max-height: 60vh; max-width: 100%; border-radius: 8px; }

@media (max-width: 1100px) {
  .fnd-app { grid-template-columns: 13rem minmax(0, 1fr); }
  .fnd-anteprima { display: none; }
}
@media (max-width: 700px) {
  .fnd-app { grid-template-columns: 1fr; height: auto; min-height: 0; }
  .fnd-barra, .fnd-anteprima, .fnd-percorso, .fnd-navigazione { display: none; }
  .fnd-mobile { display: block; }
  .fnd-contenuto { min-height: 22rem; }
  .fnd-cerca { width: 100%; }
  .fnd-col { width: 13rem; }
  .fnd-col-anteprima { width: 16rem; }
}