/* ────────────────────────────────────────────────────────────────────────────
   NEREU · finances (albarans, factures, banc i conciliació)
   El que queda de l'estil d'abans de Compres: les peces que els formularis de
   documents encara fan servir al costat de les de css/ext-compres.css. Només
   tokens (tokens.css); la resta ja és a components.css i ext-compres.css.
   ────────────────────────────────────────────────────────────────────────── */

/* pestanyes pròpies de Compres (finances-comu.js): només quan el shell no dibuixa les seves */
.fin-nav { display: flex; gap: var(--sp-2); max-width: max-content; margin: 0 0 var(--sp-7); padding: var(--sp-2); border: 1px solid var(--c-border); border-radius: var(--r-sm);
  background: var(--c-surface); overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.fin-nav::-webkit-scrollbar { display: none; }
.fin-nav__a { flex: none; display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: var(--sp-3) var(--sp-5); border-radius: var(--r-sm);
  color: var(--c-text-2); font-size: var(--fs-body); font-weight: var(--fw-bold); text-decoration: none; white-space: nowrap; }
.fin-nav__a:hover { background: var(--c-surface-subtle); color: var(--c-brand); }
.fin-nav__a.on { background: var(--c-brand); color: var(--c-on-brand); }
@media (max-width: 639px) {
  .fin-nav { width: 100%; max-width: 100%; gap: var(--sp-1); padding: var(--sp-1); }
  .fin-nav__a { flex: 1 1 auto; min-width: 0; padding: var(--sp-3) var(--sp-2); font-size: var(--fs-sm); }
}

/* «= 2,350 kg» sota el camp mentre s'escriu una quantitat */
.fin-previ { display: block; min-height: 18px; margin-top: var(--sp-1); color: var(--c-text-2); font-size: var(--fs-sm); font-weight: var(--fw-bold); }
.fin-previ:empty { min-height: 0; margin: 0; }
.fin-previ--mal { color: var(--c-danger); }
.fin-previ--avis { color: var(--c-warning); }

/* entrada manual: una línia del document */
.fin-linia { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(0, .9fr) minmax(0, .9fr) minmax(0, 1fr) 84px 44px; gap: var(--sp-3); align-items: end; padding: var(--sp-3) 0; border-bottom: 1px solid var(--c-border); }
.fin-linia .camp { margin-bottom: 0; }
.fin-linia .camp__t { margin-bottom: var(--sp-1); font-size: var(--fs-xs); }
@media (max-width: 639px) { .fin-linia { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* «Segur?»: una línia que fa pensar en una coma mal posada */
.fin-linia--sospita { background: var(--c-warning-bg); border-radius: var(--r-sm); box-shadow: 0 0 0 4px var(--c-warning-bg); }
.fin-segur { margin: var(--sp-4) 0 0; }

/* revisió d'una foto llegida: cada línia en dues files */
.fin-olin { display: grid; grid-template-columns: 44px repeat(3, minmax(0, 1fr)); gap: var(--sp-2) var(--sp-3); align-items: end; padding: var(--sp-4) 0; border-bottom: 1px solid var(--c-border); }
.fin-olin .camp { margin-bottom: 0; }
.fin-olin .camp__t { margin-bottom: var(--sp-1); font-size: var(--fs-xs); }

/* reclamació al proveïdor (detall d'una factura que no quadra) */
.fin-rec { display: grid; gap: var(--sp-4); margin-top: var(--sp-4); padding: var(--sp-4); border: 1px solid var(--c-border); border-radius: var(--r-md); background: var(--c-surface-subtle); }

/* «És el mateix que…?» sota cada línia d'un document */
.fin-alies { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); align-items: center; padding: var(--sp-2) var(--sp-4);
  border-radius: var(--r-md); background: var(--c-surface-subtle); font-size: var(--fs-sm); }
.fin-alies:empty { display: none; }
.fin-olin > .fin-alies { grid-column: 2 / -1; }