CSS Selector :not is not overriding css from specified class - css

Question

In my site I have a links with the target="_blank". On some of these links I want the cursor to be a pointer. On links with the class name "inline-link" I want it to be text. I updated the post with my entire CSS page.
However I cannot seem to override the css.
Here is my 'complete' css:
.grouped-link {
cursor: pointer;
}
.slideout-link {
span.show:hover {
color: $darkgrey;
}
}
.section-subtitle a, a.section-subtitle {
color: $darkgrey;
float: right;
text-transform: uppercase;
font-size: 16px;
font-weight: 400;
letter-spacing: 2px;
margin-top: 65px;
text-decoration: none;
border-bottom: 1px solid $darkgrey;
&:hover {
border-color: $midgrey;
color: $midgrey;
text-decoration: none;
}
}
.underline-link {
border-bottom: 1px solid $lightgrey;
cursor: pointer;
padding-bottom: 5px;
text-transform: uppercase;
width: 150px;
&.dark {
border-color: $grey;
color: $grey;
}
&:hover {
border-color: $midgrey;
color: $midgrey;
text-decoration: none;
}
&.light {
border-color: $upmidgrey;
color: $upmidgrey;
}
&.lightest {
color: $lightgrey;
}
}
.inline-link {
color: $grey;
cursor: text;
&:hover {
text-decoration: none;
cursor: text;
}
}
a[target="_blank"]:not(.inline-link):hover {
text-decoration: none;
cursor: pointer;
}
Here is my html:
<p> Text text text <a className="inline-link" href="http://www.link.com" target="_blank">text</a> text </p>

Answer 1

Unless you use React or some other system that require you to use className instead of class, basically this code works:
.inline-link {
color: grey;
cursor: text;
}
.inline-link:hover {
text-decoration: none;
cursor: text;
}
a[target="_blank"]:not(.inline-link):hover {
text-decoration: none;
cursor: pointer;
}
<p> Text text text <a class="inline-link" href="http://www.link.com" target="_blank">text</a> text </p>
<p> Text text text text text </p>