Ion-item applying focus styles

Ionic Framework
1

Im trying to apply css to ion-items when they are focused. inside are ion-radio and everything within an ion-radio-group

<ion-radio-group value="">
    <ion-item>
      <ion-label>Grapes</ion-label>
      <ion-radio slot="end" value="grapes"></ion-radio>
    </ion-item>

    <ion-item>
      <ion-label>Strawberries</ion-label>
      <ion-radio slot="end" value="strawberries"></ion-radio>
    </ion-item>

    <ion-item>
      <ion-label>Pineapple</ion-label>
      <ion-radio slot="end" value="pineapple"></ion-radio>
    </ion-item>
  </ion-radio-group>

I’ve already themed them to look like buttons with a radio input inside. The only thing I can’t seem to do is apply the following code to the focus state. it seems like ion-item is missing a focus state. i know that there is a class .ion-has-focus but I don’t see it getting applied to the dom at all and so using it doesn’t work

outline: 2px solid green;
outline-offset: 1px;

but there doesn’t seem to be a way to get to the focused state of an ion-item. We use the focus state for many accessibility interactions. the closest thing I’ve found is .ion-activated but that class gets removed when the click event is over.