.light when (lightness(@a) > 50%) {

color: green;

} .dark when (lightness(@a) < 50%) {

color: orange;

} @a: ddd;

.see-the {

@a: #444; // this mirrors what mixins do - they evaluate the guards at the point of definition
.light();
.dark();

}

.hide-the {

.light();
.dark();

}

.multiple-conditions-1 when (@b = 1), (@c = 2), (@d = 3) {

color: red;

}

.multiple-conditions-2 when (@b = 1), (@c = 2), (@d = 2) {

color: blue;

}

@b: 2; @c: 3; @d: 3;

.inheritance when (@b = 2) {

.test {
  color: black;
}
&:hover {
  color: pink;
}
.hideme when (@b = 1) {
  color: green;
}
& when (@b = 1) {
  hideme: green;
}

}

.hideme when (@b = 1) {

.test {
  color: black;
}
&:hover {
  color: pink;
}
.hideme when (@b = 1) {
  color: green;
}

}

& when (@b = 1) {

.hideme {
  color: red;
}

}

.mixin-with-guard-inside(@colWidth) {

// selector with guard (applies also to & when() ...)
.clsWithGuard when (@colWidth <= 0) {
  dispaly: none;
}

}

.mixin-with-guard-inside(0px);

.dont-split-me-up {

width: 1px;
& when (@c = 3) {
  color: red;
}
& when (@c = 3) {
  height: 1px;
}
+ & when (@c = 3) { // creates invalid css but tests that we don't fold it in
  sibling: true;
}

}

.scope-check when (@c = 3) {

@k: 1px;
& when (@c = 3) {
  @k: 2px;
  sub-prop: @k;
}
prop: @k;

} .scope-check-2 {

.scope-check();
@k:4px;

} .errors-if-called when (@c = never) {

.mixin-doesnt-exist();

}