/* Money rooms keep line editors and lists within a phone's viewport. */
.payment-filters,
.payment-pagination,
.payment-approval-heading,
.payment-approval-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.payment-filters [aria-pressed='true'] {
  border-color: var(--accent, #23c9ed);
}
.payment-history-row,
.payments-room section,
.payment-row-fields {
  min-width: 0;
  max-width: 100%;
}
.payment-row-fields {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}
.payment-row-fields dt {
  grid-row: 1;
  font-weight: 600;
}
.payment-row-fields dd {
  grid-row: 2;
  margin: 0;
  min-width: 0;
}
.payments-room article,
.payments-room dd,
.catalog-room pre,
.invoices-room pre,
.estimates-room pre {
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}
@media (max-width: 600px) {
  .payment-row-fields {
    grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  }
  .payment-row-fields dt,
  .payment-row-fields dd {
    grid-row: auto;
  }
  .catalog-room,
  .invoices-room,
  .payments-room {
    min-width: 0;
  }
  .catalog-room .cat-table,
  .invoices-room .room-table,
  .invoices-room .cat-table,
  .invoices-room .est-lines,
  .estimates-room .est-lines,
  .catalog-room .cat-table tbody,
  .invoices-room table tbody,
  .estimates-room .est-lines tbody {
    display: block;
    width: 100%;
    min-width: 0;
  }
  .catalog-room .cat-table thead,
  .invoices-room .room-table thead,
  .invoices-room .cat-table thead,
  .invoices-room .est-lines thead,
  .estimates-room .est-lines thead {
    display: none;
  }
  .catalog-room .cat-table tr,
  .invoices-room table tr,
  .estimates-room .est-lines tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    padding: 12px 0;
    border-bottom: 1px solid var(--line);
  }
  .catalog-room .cat-table td,
  .invoices-room table td,
  .estimates-room .est-lines td {
    display: block;
    padding: 4px;
    border: 0;
    overflow-wrap: anywhere;
  }
  .invoices-room .room-table td:nth-child(3)::before {
    content: 'Date: ';
  }
  .invoices-room .room-table td:nth-child(4)::before {
    content: 'Due: ';
  }
  .invoices-room .room-table td:nth-child(6)::before {
    content: 'Total: ';
  }
  .invoices-room .room-table td:nth-child(7):not(:empty)::before {
    content: 'Owed: ';
  }
  .invoices-room .est-lines td:nth-child(3)::before,
  .estimates-room .est-lines td:nth-child(3)::before {
    content: 'Quantity';
  }
  .invoices-room .est-lines td:nth-child(4)::before,
  .estimates-room .est-lines td:nth-child(4)::before {
    content: 'Unit price';
  }
  .invoices-room .est-lines td:nth-child(5)::before,
  .estimates-room .est-lines td:nth-child(5)::before {
    content: 'Discount %';
  }
  .invoices-room input,
  .invoices-room select,
  .invoices-room textarea,
  .catalog-room input,
  .catalog-room select,
  .estimates-room .est-lines input,
  .estimates-room .est-lines select {
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
  }
  .invoices-room .ur-field,
  .catalog-room .ur-field,
  .invoices-room .est-totals {
    min-width: 0;
    max-width: 100%;
  }
}
