.sortable{cursor:pointer;user-select:none}
.sortable:hover{background:var(--sf2)}
th.r,td.r{text-align:right}
.status-pill{display:inline-block;font-size:11px;font-weight:800;padding:3px 11px;border-radius:var(--r);text-transform:uppercase}
.bal-due{color:#b22222;font-weight:700}
.bal-zero{color:#0a7c5c;font-weight:700}

.due-banner{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:12px 14px;border-radius:var(--rl);margin-bottom:14px;font-size:13px}
.due-banner.overdue{background:#fef2f2;border:1px solid #fecaca;color:#7f1d1d}
.due-banner.soon{background:#fffbeb;border:1px solid #fde68a;color:#78350f}
.due-banner > i{font-size:20px;flex-shrink:0}
.due-banner .db-text{flex:1;min-width:200px;line-height:1.5}
.due-chip{border:1px solid currentColor;background:transparent;color:inherit;
  font-family:inherit;font-size:12px;font-weight:700;padding:5px 11px;border-radius:var(--r);opacity:.85}
.due-chip:hover{opacity:1}
.due-chip.active{background:currentColor}
.due-chip.active span{color:#fff}
#inv-items-body td{vertical-align:top}
textarea.it-desc{width:100%;min-height:34px;resize:vertical;overflow:hidden;
  line-height:1.35;padding:7px 9px;font-size:12.5px;white-space:pre-wrap}

/* ── Horizontal slider for the (wide) invoice table ─────────────────────── */
.table-scroll{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;
  cursor:grab;scroll-behavior:smooth}
.table-scroll.dragging{cursor:grabbing;scroll-behavior:auto;user-select:none}
.table-scroll table{min-width:820px}                 /* keep columns from crushing */
.table-scroll::-webkit-scrollbar{height:10px}
.table-scroll::-webkit-scrollbar-thumb{background:var(--border);border-radius:6px}
.table-scroll::-webkit-scrollbar-thumb:hover{background:var(--ink3)}
.table-scroll::-webkit-scrollbar-track{background:transparent}
.scroll-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:5;
  width:34px;height:34px;border-radius:50%;border:1px solid var(--border);
  background:var(--sf);color:var(--ink2);display:none;align-items:center;justify-content:center;
  box-shadow:0 2px 8px rgba(0,0,0,.12);font-size:18px;line-height:0}
.scroll-arrow:hover{background:var(--sf2);color:var(--ink)}
.scroll-arrow.left{left:-6px}
.scroll-arrow.right{right:-6px}
.scroll-arrow.show{display:flex}