How to handle media play button and media loading indicator while media is loading.?

[kevalrathod]

I am having having issue with media loading indicator and media player while media is playing.
as you can see the screenshot while media is still in loading state the media play button placement. Is there any way to hide media play button while media is loading only.

one more,
also when media is not loading media play button is not in the center possition while media is not loading. (second screenshot)

[kevalrathod]

This is my css

media-loading-indicator:not([medialoading]) {
  display: none;
}

media-controller:not([mediahasplayed]) media-loading-indicator[medialoading][mediapaused] {
  display: none;
}

media-loading-indicator[medialoading] {
  display: block;
}

/* // hide center media button i media controller has played and media loading indicaror in loading  */
media-loading-indicator[medialoading] div[slot="centered-chrome"] media-play-button {
  display: none;
}

but it does not work. it still showung media button when loading