Ionicons设置自定义图标的各个路径的样式

Question

我有一个SVG，已将其分为多个路径并指定了类。我正在将其用作自定义的ionicon。

我想根据我分配给它的类来更改单个路径的填充。我可以控制SVG，因此可以添加ID，类或任何必需的内容。

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 1000">
    <path d="" class="legs"/>
    <path d="" class="trunk"/>
    <path d="" class="arm"/>
    <path d="" class="head"/>
</svg>

我尝试了各种选择器和颜色/填充：

.human {
  font-size: 80px;
  color: var(--ion-color-light-contrast);
  & .head {
    color: red !important;
  }
}

在HTML中的用法如下：

<ion-grid>
  <ion-row>
    <ion-col>
      <ion-icon class="human" (click)="updateRegion('head')" src="../../assets/human.svg"></ion-icon>
    </ion-col>
  </ion-row>
</ion-grid>

我希望使用CSS来更改填充。