[AEM 6.6] How can I edit a XF's policies?

Hello,

I have a Header component that I am using in a experience fragment, my Header has a responsive grid inside because I want to be able to add modular Header component like Nav Items:

This seems to work fine and I was able to create a experience fragment for the header with a .xml file but when I try to add navigation items from the XF Editor I don't see the option to add my Nav Item component, it looks like I can only add the regular groups, it currently looks like this:

But what I need is for it to look like this:

I thought this could be done by only modifying the policies so under 

I went and added two new policies like so:

But this doesn't seem to work, any ideas? I tried to do it from http://localhost:4502/editor.html/conf/kg-commons/settings/wcm/templates/xf-web-variation/structure.html but I don't think that is the correct way.