bug: ion-segment will toggle when the page is scrolled

### Prerequisites

- [X] I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue).
- [X] I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct).
- [X] I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success.

### Ionic Framework Version

- [ ] v4.x
- [X] v5.x
- [ ] v6.x

### Current Behavior

When using an ion-segment as part of a scrollable area (or rubber banding area on iOS), starting a scroll action on that element will toggle the segment, although the finger has enganged in a scroll gesture, scrolling the view.

### Expected Behavior

Starting a scroll gesture must not cause the ion-segment to switch/toggle

### Steps to Reproduce

- Create any page with enough content to allow for scrolling (or use the iOS bounce)
- Add an ion-segment
- Initiate a scroll gesture by tapping the currently inactive part of the segment
- Scroll the page up or down
- Lift off your finger and observe, that the segment has switched

### Code Reproduction URL

https://github.com/wilk-polarny/Repro-Ionic-24062

### Ionic Info

```
Ionic:

Ionic CLI : 6.16.3 (C:\Users\xxx\AppData\Roaming\nvm\v14.17.0\node_modules\@ionic\cli)
Ionic Framework : @ionic/angular 5.7.0
@angular-devkit/build-angular : 12.1.4
@angular-devkit/schematics : 12.1.4
@angular/cli : 12.1.4
@ionic/angular-toolkit : 4.0.0

Cordova:

Cordova CLI : 10.0.0
Cordova Platforms : android 9.1.0
Cordova Plugins : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 5.0.0, (and 23 other plugins)

Utility:

cordova-res : 0.15.3
native-run : 1.3.0

System:

Android SDK Tools : 26.1.1 (C:\Users\xxx\AppData\Local\Android\sdk)
NodeJS : v14.17.0 (C:\Program Files\nodejs\node.exe)
npm : 6.14.13
OS : Windows 10
```

### Additional Information

Added an Ionic Angular Repro-repo, it's reproducable within the browser.