Angular组件中如何结合:not()实现:host-context()选择器的本地否定匹配？

场景说明 #

现有明暗两套主题，仅通过添加在body上的.dark类区分深色主题，我们需要仅在浅色主题下本地设置组件字体为红色，深色主题下不做任何颜色修改，相关代码需写在Angular组件的SCSS文件中生效。

实现代码 #

在foo-bar.component.scss文件中编写如下代码：

:host-context(:not(.dark)) { 
    color: red; // 仅浅色主题下显示红色字体，深色主题下不修改颜色
}

内容的提问来源于stack exchange，提问作者zaggi