REST Countries API with color theme switcher

One problem which I could not solve is in the flag image size for some countries in CountryDetail react component when object-fit: cover is used. For some countries e.g the image is cropped I tried everything but could not succeed resolving it. The relevant CSS is .flag-detail { flex: 1 1 0;

  @media (max-width: 1024px) {
    width: 100%;
  }

  img {
    display: block;
    width: 87.5%;
    height: 400px;
    /* object-fit: cover; */

    @media (max-width: 1024px) {
      width: 100%;
      height: auto;
    }
  }
}

Any suggestion/help in this regard will be highly appriciated.