/* ══════════════════════════════════════════════════
   THE INVOICES TAB — more filters (js/13-invoicing.js)
   ══════════════════════════════════════════════════ */
.inv-filters { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: -2px 0 12px; }
.inv-filters select.field { width: auto; min-width: 170px; height: 38px; font-size: 13.5px; }
.invf-range { display: none; align-items: center; gap: 6px; }
.invf-range.show { display: inline-flex; }
.invf-range .field { width: 150px; height: 38px; font-size: 13.5px; padding-top: 0; padding-bottom: 0; }
.invf-arrow { color: var(--faint); }
.inv-count { font-size: 12.5px; color: var(--muted); margin: 0 2px 10px; font-variant-numeric: tabular-nums; }
.inv-count .link-btn { padding: 0; font-size: 12.5px; }
.inv-owed { color: var(--danger); font-weight: 600; }

@media (hover: none), (any-pointer: coarse) {
  .inv-filters select.field, .invf-range .field { height: 44px; }
}
/* phones: two to a row, the dates on a row of their own */
@media (max-width: 700px) {
  .inv-filters { display: grid; grid-template-columns: 1fr 1fr; }
  .inv-filters select.field { min-width: 0; width: 100%; }
  .invf-range.show { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); grid-column: 1 / -1; }
  .invf-range .field { width: 100%; }
}