react-native-multiple-select: remove unwanted white background

Question

Using <MultiSelect /> of react-native-multiple-select getting unusual white background on the above the input bordered box, this package is so hard to style, please help where is it coming from and how to remove it.

Here is what am I getting on Disease input field.

-

Here is the code:-

<View style={{ marginBottom: verticalScale(15) }}>
          <Text style={styles.label}>Diseases </Text>
          <MultiSelect
            items={diseaseList}
            uniqueKey="name"
            onSelectedItemsChange={onSelectedItemsChange}
            selectedItems={selectedItems}
            searchInputPlaceholderText="Search Items..."
            onChangeInput={(text) => console.log(text)}
            tagRemoveIconColor="#CCC"
            tagBorderColor={
              selectedItems.length > 0 ? "green" : Colors.grayColor.gray600
            }
            tagTextColor={
              selectedItems.length > 0 ? "green" : Colors.grayColor.gray700
            }
            selectedItemTextColor="#CCC"
            selectedItemIconColor="#CCC"
            itemTextColor="#000"
            displayKey="name"
            selectText={""}
            submitButtonColor={
              selectedItems.length > 0
                ? "green"
                : Colors.primaryColor.primary400
            }
            submitButtonText="Submit"
            searchInputStyle={{
              fontSize: moderateScale(15),
              paddingVertical: verticalScale(6),
            }}
            styleInputGroup={{
              borderRadius: moderateScale(4),
              borderColor:
                selectedItems.length > 0 ? "green" : Colors.grayColor.gray600,
              borderWidth: 2,
            }}
            styleDropdownMenu={
              !diseaseList.length === 0
                ? styles.multiSelect
                : styles.multiSelectEmpty
            }
            styleRowList={{
              fontSize: moderateScale(15),
            }}
            styleTextDropdown={{
              fontSize: moderateScale(15),
              height: verticalScale(20),
            }}
            styleTextDropdownSelected={{
              height: verticalScale(23),
              fontSize: moderateScale(15),
            }}
            style={[styles.input, styles.inputTextFont, styles.dropdown1]}
          />
        </View>

const styles = StyleSheet.create({
 input: {
    flex: 1,
    padding: moderateScale(7),
    borderRadius: moderateScale(4),
    marginBottom: verticalScale(15),
    backgroundColor: "#fff",
    borderColor: Colors.grayColor.gray600,
    borderWidth: 2,
  },
  inputTextFont: {
    fontSize: moderateScale(15),
  },
dropdown1: {
    flex: 1,
  },
multiSelect: {
    backgroundColor: "#fff", //Its not coming from here, its the background of input behind this white box
  },
  multiSelectEmpty: {
    borderRadius: moderateScale(4),
    borderColor: Colors.grayColor.gray600,
    borderWidth: 2,
    paddingHorizontal: horizontalScale(10),
    paddingVertical: verticalScale(1),
    backgroundColor: "#fff",
    height: verticalScale(37),
  },
})

I tried many things but couldn't find where is it coming form so please if anyone knows anything about this package please guide me on this.