Ion-item ripple effect won't go away and -background-activated: transparent not working

Hi! I have these radio buttons which firstly are white and when I click them are becoming dark blue. However, when I click, it has first that effect for a really, really short time and it won’t go away with any command from ionic. (the grey one from the picture) Any help would be amazing. I’ve tried --background-activated: transparent on .item-radio-checked but still no effect

this is my HTML

 <ion-list lines="none">
              <ion-radio-group formControlName="spq">
                <ion-item class="question-option">
                  <ion-label>A</ion-label>
                  <ion-radio slot="end" value="nutrition"></ion-radio>
                </ion-item>
</ion-radio-group >
 </ion-list lines>

my css on ion-item

ion-item {
  border: 1px solid #eeeff0;
  border-radius: 16px;
  height: 64px;
  text-indent: 20px;
  --background-activated: var(--ion-color-secondary);
}

Pictures: