.form-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.form-grid-2{grid-template-columns:repeat(2,1fr)}
.form-grid-3{grid-template-columns:repeat(3,1fr)}
.form-group{display:flex;flex-direction:column;gap:5px}
.form-label{font-size:12px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:0.04em}
.form-control{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius-sm);padding:8px 12px;color:var(--text-primary);font-size:13px;transition:border-color var(--transition),box-shadow var(--transition);width:100%}
.form-control:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}
.form-control::placeholder{color:var(--text-muted)}
.form-control.error{border-color:var(--danger)}
.field-group{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius);padding:16px 20px;margin-bottom:16px}
.field-group-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--text-muted);margin-bottom:14px;display:flex;align-items:center;gap:6px}
.filter-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.filter-bar .form-control{max-width:180px}
.editable-cell{cursor:text;min-width:60px}
.editable-cell input{background:var(--bg-primary);border:1px solid var(--accent);border-radius:4px;color:var(--text-primary);padding:2px 6px;width:100%;font-size:13px;outline:none}

/* Expense Voucher line: single Amount + a Paid/Received segmented toggle.
   Both are locked until a Particular is chosen, then the direction auto-sets. */
.v-dir{display:inline-flex;border:1px solid var(--border);border-radius:8px;overflow:hidden;background:var(--bg-tertiary)}
.v-dir-btn{border:0;background:transparent;padding:6px 14px;font-size:12px;font-weight:600;color:var(--text-muted);cursor:pointer;transition:background .15s,color .15s;white-space:nowrap}
.v-dir-btn + .v-dir-btn{border-left:1px solid var(--border)}
.v-dir-btn:hover:not(:disabled){color:var(--text-primary)}
.v-dir-btn.active[data-dir="paid"]{background:#dc2626;color:#fff}
.v-dir-btn.active[data-dir="received"]{background:#16a34a;color:#fff}
.v-dir-btn:disabled{opacity:.45;cursor:not-allowed}
.v-line input.v-amount:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}
.total-row .vtot-paid{margin-right:18px;color:#dc2626}
.total-row .vtot-recv{color:#16a34a}
