chore(toggle): fix track background, when using ion-color (#83)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

Author: rdlabo

demo/e2e/screenshot.spec.ts-snapshots/modal-sheet.png

@@ -44,4 +44,11 @@ <h2>toggle</h2>
     <ion-toggle label-placement="fixed">Fixed Width Label</ion-toggle><br /><br />
     <ion-toggle label-placement="stacked">Stacked Label</ion-toggle>
   </section>
+
+  <ion-toolbar color="primary">
+    <ion-toggle>Default Toggle</ion-toggle>
+  </ion-toolbar>
+  <ion-toolbar color="dark">
+    <ion-toggle>Default Toggle</ion-toggle>
+  </ion-toolbar>
 </ion-content>

demo/e2e/screenshot.spec.ts-snapshots/toggle-dark.png

@@ -21,7 +21,12 @@ ion-toggle.ios:not(.ios26-disabled) {
   --handle-height: 24px;
   --handle-max-width: none;
   --handle-max-height: none;
-  --track-background: rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.23);
+  &.ion-color {
+    --track-background: rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.23);
+  }
+  &:not(.ion-color) {
+    --track-background: rgba(var(--ion-color-contrast-rgb, var(--ion-text-color-rgb, 0, 0, 0)), 0.23);
+  }
   &::part(track) {
     overflow: visible;
     width: 64px;