SVG icon not responding to CSS fill

I've saved an icon in svg format for a webpage. However, when trying to change the color using "fill" in my CSS, the icon just stays the same.

The icon is being called with a <svg> tag and <use xlink> method so, unlike background SVG, color should respond to "fill"

I've tried producing the same icon with Illustrator and icon responds to "fill"

Things I've tried and didn't work:

-Saving using the normal "Save" options
-Saving as "simplified SVG"
-Saving as "Optimized SVG" (I've tried various ticking/unticking options but none changed the result)

I'm aware of problems with CSS as explained in http://wiki.inkscape.org/wiki/index.php/CSS_Support

However, I'm using the svg XML method and I'm not sure if my icon is affected by Inkscape problems with CSS.

Another possibility I'm not sure about is that the icon came initially from an .eps file. So I'm not sure if problem lies with Inkscape importing options