Why does my LESS variable have to be the same - less

Question

I have a variable I am passing through this loop in less that will be used to name the class dynamically. Nevermind that this has the possibility of generating a heinous amount of classes, I am wondering why if I change the "red" variable to anything else in the function call or anywhere else, basically if they are not all the same, I get an "Object[object] has no method toCSS.
note: I am using the less app on mac to compile on save.
the mixin call:
.createShades (10, "red", #ff3333);
The mixin itself
// Generate our reds
.createShades (#index, #color, #base-color) when (#index > 0) {
#i: #index;
.createShade (#index, #i, #color, #base-color);
.createShades (#index - 1, #color, #base-color);
}
.createShades (0, "red", #base-color) {}
.createShade (#index, #i, #color, #base-color) when (#i > 0) {
#num: percentage((lightness(#base-color)/100) * (1 - (#i / #index)));
#newShade: darken(#base-color, #num);
(~".#{color}-#{i}-#{index}-text") {
color: #newShade;
}
(~".#{color}-#{i}-#{index}-bg") {
background-color: #newShade;
}
.createShade (#index, #i - 1, #color, #base-color);
}
.createShade (#index, 0, "red", #base-color) {}

Answer 1

You need to change your ending mixin (used when the value reaches 0) to have #color instead of "red"). So...
.createShades (0, #color, #base-color) {}
.createShade (#index, 0, #color, #base-color) {}
This is because it is seeking a match for "red" so when you change your call to another color, it throws an error since it does not match "red".