I want to embed YouTube video in my react app but I don’t want the controls to be shown on the screen.

This is my current code but still this had no effect on control:

function ProductVideoGallery() {
  const videos = useContext(videoCollectionContext);
  return (
    <>
      <section className="min-h-full flex flex-col gap-12">
        {videos && videos.length ? (
          videos.map((vid) => {
            let videoSrc = vid.includes("?")
              ? vid + "&controls=0"
              : vid + "?controls=0";
            videoSrc += "&modestbranding=1&showinfo=0&autoplay=1";
            return (
              <iframe
                key={vid}
                className="mx-auto my-8"
                src={videoSrc}
                title="Category Video"
                frameBorder={0}
                allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
                referrerPolicy="strict-origin-when-cross-origin"
                allowFullScreen
                style={{ width: "100vmin", aspectRatio: "16/9" }}
              />
            );
          })
        ) : (
          <p className="text-2xl">No video found</p>
        )}
      </section>
    </>
  );
}

export default ProductVideoGallery;