Expected behavior no border style

Actual behavior The border style, which does not conform to the predetermined roundness, is visible and disappears when the input field is selected.

Resources (screenshots, code snippets etc.)

<MDBInputGroup>
            <MDBInput
              label="Search"
              type="text"
              className="searchBar bg-light"
              size="sm"
            />
            <MDBBtn color="dark" className="search-btn">
              <MDBIcon icon="search" />
            </MDBBtn>
 </MDBInputGroup>

and css part

.searchBar {
  width: 15rem;
  transition: all 0.5s ease-in;
  border-radius: 50px 0 0 50px;
}

.search-btn{
  border-radius: 0 50px 50px 0;
}

Am I doing something wrong?