In meinem CSS muss ich Klassen erstellen, die sich auf eine 'Haarfarbe' und eine 'Frisur' beziehen

Ich habe ein Mixin geschrieben, um mein CSS-Schreiben effizienter zu gestalten:

@mixin hair($hair, $colour) {
    .hair-#{$colour} .#{$hair}  { 
background:image-url("xsppsfhair#{$hair}#{$colour}.svg") center top no-repeat, 
image-url("xsppsheadgrey.svg") center top no-repeat, 
image-url("xsppsbhair#{$hair}#{$colour}.svg") center top no-repeat;
}


}

@include hair(spikyboy, blonde);    
@include hair(curlyafroboy, blonde);    

Dies erzeugt das folgende CSS

.hair-blonde .spikyboy {
  background: url('../images/xsppsfhairspikyboyblonde.svg?1348681869') center top no-repeat, url('../images/xsppsheadgrey.svg?1348834673') center top no-repeat, url('../images/xsppsbhairspikyboyblonde.svg?1348682005') center top no-repeat;
}

.hair-blonde .curlyafro {
  background: url('../images/xsppsfhaircurlyafroblonde.svg?1348681869') center top no-repeat, url('../images/xsppsheadgrey.svg?1348834673') center top no-repeat, url('../images/xsppsbhaircurlyafroblonde.svg?1348682005') center top no-repeat;
}

Das ist großartig, aber da ich insgesamt 35 Haarfarben und Frisuren kombiniere, habe ich immer noch viel zu viele @includes.

Auf dieser Seite, heißt es, SASS hat ein @each, mit dem Listen durchlaufen werden können. Es gibt ein weiteres BeispielHier. Diese beiden Beispiele zeigen jedoch nur das Durchlaufen einer Liste. Kann man zwei Listen durchlaufen?

Ich habe viele Varianten meines Codes ausprobiert, aber keine scheint zu funktionieren. Ich dachte, das Folgende würde definitiv funktionieren, aber ich bekomme nur eine Fehlermeldung, dass $ color undefiniert ist.

$hairstyle: (red, blonde, ltbrown);
$haircolour: (red, blonde, ltbrown);

    @each $hair in $haircolour, $colour in $haircolour {
    .hair-#{$colour} .#{$hair}  {
background:image-url("xsppsfhair#{$hair}#{$colour}.svg") center top no-repeat, 
image-url("xsppsheadgrey.svg") center top no-repeat, 
image-url("xsppsbhair#{$hair}#{$colour}.svg") center top no-repeat;
    }

    .girl.hair-#{$colour} #eyelash {
        background: image-url("xsppseyelash#{$colour}.svg") center top no-repeat;
    }
}

Könnte mir bitte jemand einen Hinweis geben, was ich falsch mache?