Hi Maura!
One thing we discovered while tinkering with the svgs is that we had to export twice. For some reason, the first time we exported from Illustrator, it pulled in the images fine but distorted on preview/publish like my screenshots above. My co-worker, on a whim, exported the image again (she opened the previously exported svg and chose to export again) and for some reason, it fixed the image and brought in everything.
I don't know if it will work in your situation, but it's worth a shot. I also came across numerous help requests that mentioned things becoming grey-scaled when using svgs. Because it was not my issue, I didn't pay them much attention, but definitely worth a google to see if their fixes help yours!