/** A Tools row: title and help on the left, actions on the right. */
const ToolRow = ({ title, description, children }) => (
  <div className="ino:flex ino:flex-wrap ino:items-center ino:justify-between ino:gap-3 ino:border-t ino:border-border/70 ino:py-4">
    <div className="ino:min-w-0 ino:flex-[1_1_240px]">
      <div className="ino:text-sm ino:font-medium">{title}</div>
      {description && (
        <p className="ino:mt-0.5 ino:mb-0 ino:text-[13px] ino:text-muted-foreground">
          {description}
        </p>
      )}
    </div>
    <div className="ino:flex ino:flex-wrap ino:items-center ino:gap-2">
      {children}
    </div>
  </div>
);

export default ToolRow;