如何仅设计非只读v型开关的样式

我有以下内容:

<v-switch
  inset
  name="foo"
  label="foo"
  disabled
/>

和

<v-switch
  inset
  name="bar"
  label="bar"
  :readonly="true"
/>

在Vuetify 2中,禁用的开关保持原色,但只读开关为灰色。我正试图在Vuetify 3上获得同样的行为。

如果我这样做:

.v-input--readonly .v-switch__track, .v-switch__thumb {
  color:rgb(var(--v-theme-primary))
}

然后这导致只读不再是灰色的,这不是我想要的

但这使得所有开关都是原色:

.v-switch__track:not(.v-input--readonly), .v-switch__thumb:not(.v-input--readonly) {
  color:rgb(var(--v-theme-primary))
}

我仔细阅读了很多Stackoverflow的帖子,但没有找到任何有效的东西。其中一些链接,供参考: Change all read only fields background color in Vuetify Override disabled style on v-btn Set Styles for disabled Mat-Expansion Panel How to change/override the default color of a switch label in vuetify? How to change vuetify checkbox label style?

没有组合 :not , :has , disabled , :disabled , aria-disabled , input[aria-disabled] , input.aria-disabled , [aria-disabled=true] 等,似乎有效。可能是因为这个原因: css :not(), selectors and selecting descendants

我的最佳猜测是问题在于 VSelectionControl 实际上 aria已禁用 ,但类似的css调整与 .v-selection-control 还没有结果。