.supplierPayableVisuals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0 0 14px}.supplierPayableCard,.supplierPayableProgress{min-height:70px;padding:12px;display:flex;align-items:center;gap:10px;border-radius:5px;color:#fff}.supplierPayableCard span{width:34px;height:34px;display:grid;place-items:center;background:#ffffff22}.supplierPayableCard svg{width:19px;height:19px}.supplierPayableCard small,.supplierPayableProgress small{display:block;font-size:10px;font-weight:700;letter-spacing:.2px}.supplierPayableCard strong{display:block;font-size:18px;margin-top:3px}.supplierPayableCard.payable{background:linear-gradient(135deg,#9a3412,#f59e0b)}.supplierPayableCard.paid{background:linear-gradient(135deg,#047857,#10b981)}.supplierPayableProgress{display:block;background:linear-gradient(135deg,#0f3544,#1d4ed8)}.supplierPayableProgress>div:first-child{display:flex;justify-content:space-between;font-size:12px;font-weight:700}.supplierPayableProgress small{margin-top:7px;color:#dbeafe}.supplierProgressTrack{height:7px;margin-top:9px;overflow:hidden;background:#ffffff40;border-radius:10px}.supplierProgressTrack i{display:block;height:100%;background:#fff;border-radius:inherit}@media(max-width:720px){.supplierPayableVisuals{grid-template-columns:1fr}.supplierPayableCard,.supplierPayableProgress{min-height:62px}}
.supplierPayableHint{margin:8px 0 10px;color:#64748b;font-size:11px;line-height:1.45}