bug: ion-item in iOS16 and RTL view

[muhamed87]

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Ionic Framework Version

v8.x

Current Behavior

There are an issue we are facing specially in iOS 16, even this issue is not in the iOS 17 nor iOS 18

We already upgraded from ionic 6 to ionic 8, and currently testing after upgrade but for devices with iOS 16 we faced that ion-items not read the RTL styles applied through the ionic styles

Expected Behavior

If you can update the.item-inner to have part attribute so we can apply fixes and styles to it.
Or you can make another solution to use padding-inline-start and padding-inline-end instead of padding-right and padding-left for shadow dom elements

Steps to Reproduce

1. Run the XCode and open the simulator for iphone 14 and ios 16.1
2. Open any demo app that have a screen including ion-item
3. app should be in RTL view
4. View the issue of the inner border or add an icon inside the ion-item with slot start you will see the icon is connected to the right border

Code Reproduction URL

No URL

Ionic Info

Ionic:

Ionic CLI : 6.18.1 (/usr/local/lib/node_modules/@ionic/cli)
Ionic Framework : not installed
@angular-devkit/build-angular : 18.2.11
@angular-devkit/schematics : 18.2.11
@angular/cli : 18.2.11
@ionic/angular-toolkit : 6.1.0

Capacitor:

Capacitor CLI : 6.1.2
@capacitor/android : 6.1.2
@capacitor/core : 6.1.2
@capacitor/ios : 6.1.2

Cordova:

Cordova CLI : 12.0.0 ([email protected])
Cordova Platforms : none
Cordova Plugins : no whitelisted plugins (0 plugins total)

Utility:

cordova-res : 0.15.4
native-run : 2.0.1

System:

NodeJS : v20.9.0 (/usr/local/bin/node)
npm : 10.1.0
OS : macOS
Xcode : Xcode 16.2 Build version 16C5032a

Additional Information

No response