Ionic 6 React: Change IonItem lines color

Question

I want to change the border bottom of this IonItem,

i tried adding a class called border-light

<IonItem
  lines="inset"
  color="primary"
  className="ion-align-items-center ion-margin-vertical border-light"
 >

And css

.border-light {
  --border-color: var(--ion-color-light);
}

Answer 1

Template:

<IonItem
  lines="none"
  color="primary"
  className="ion-align-items-center ion-margin-vertical border-light"
 >

CSS:

IonItem.border-light{
--border-color: var(--ion-color-light) !important; // to override primary class style
--border-style:inset;   
--border-width:2px;
border-top-style :none;
border-right-style :none;
border-left-style :none;
}