.mkicon--primary{
	&:before {
        color:@primary-color;
  	}

  	&:hover:before{
  		  cursor: pointer;
        color: ~`colorPalette("@{primary-color}", 5)`;
    }
}

.mkicon--showy{
	  &:before {
        color:@showy-color ;
  	}

  	&:hover:before{
  		  cursor: pointer;
        color: ~`colorPalette("@{showy-color}", 5)`;
    }
}

.mkicon--softly{
    &:before {
        color:@softly-color ;
    }

    &:hover:before{
        cursor: pointer;
        color: ~`colorPalette("@{softly-color}", 5)`;
    }
}

.mkicon--normal{
    &:before {
        color:@text-color ;
    }

    &:hover:before{
        cursor: pointer;
        color: ~`colorPalette("@{text-color}", 5)`;
    }
}


.mkicon--disabled{
	  &:before {
        color:@disabled-color ;
  	}

  	&:hover:before{
  		  cursor: not-allowed;
    }
}

.mkicon{
    &:before {
    	font-family: "mkicon" !important;
  	}
}