Common CSS not applying when specifying platform specific

Comienza con las indicaciones de CSS específicas de la plataforma enlazadas en el issue y reproduce el comportamiento usando items.component.css, items.component.android.css, items.component.ios.css y items.component.ts. Investiga por qué la hoja de estilos común se resuelve en la variante de Android y, después, verifica que la regla compartida de mayúsculas y cada regla de color específica de la plataforma se apliquen conjuntamente.

Environment
Provide version numbers for the following components (information can be retrieved by running tns info in your project folder or by inspecting the package.json of the project):

{
  "name": "stackblitz-nativescript-angular",
  "main": "./src/main.ts",
  "version": "1.0.0",
  "private": true,
  "dependencies": {
    "@angular/animations": "~19.0.0",
    "@angular/common": "~19.0.0",
    "@angular/compiler": "~19.0.0",
    "@angular/core": "~19.0.0",
    "@angular/forms": "~19.0.0",
    "@angular/platform-browser": "~19.0.0",
    "@angular/platform-browser-dynamic": "~19.0.0",
    "@angular/router": "~19.0.0",
    "@nativescript/angular": "^19.0.0",
    "@nativescript/core": "~8.8.0",
    "rxjs": "~7.8.0",
    "zone.js": "~0.15.0"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~19.0.0",
    "@angular/compiler-cli": "~19.0.0",
    "@nativescript/preview-cli": "^1.0.14",
    "@nativescript/stackblitz": "0.0.8",
    "@nativescript/tailwind": "^2.1.0",
    "@nativescript/types": "~8.8.0",
    "@nativescript/webpack": "~5.0.0",
    "@ngtools/webpack": "~19.0.0",
    "tailwindcss": "~3.4.0",
    "typescript": "~5.6.0"
  }
}

Describe the bug
When adding platform specific css then the common.css is not being applied e.g: I have 3 css according to the docs: https://docs.nativescript.org/guide/styling#platform-specific-css

items.component.css
items.component.ios.css
items.component.android.css

When items.component.css is imported into the items.component.android.css then items.component.css rule aren't applied.

To Reproduce

Add 3 css

items.component.css
items.component.ios.css
items.component.android.css

Add styleUrl: 'items.component.css', into items.component.ts

Update items.component.html:

<ActionBar title="My App"> </ActionBar>

<GridLayout rows="*,*">
  <Label row="0" text="Test" class="test"></Label>
  <ListView row="1" [items]="itemService.items()">
    <ng-template let-item="item">
      <StackLayout [nsRouterLink]="['/item', item.id]">
        <Label [text]="item.name" class="text-lg text-gray-500 p-4"></Label>
      </StackLayout>
    </ng-template>
  </ListView>
</GridLayout>

Update 3 css file each with different rules:

items.component.css

.test {
  text-transform: uppercase;
}

items.component.android.css

.test {
  color: purple;
}

items.component.ios.css

.test {
  color: green;
}

Expected behavior

Expect thar the items.component.css rule be applied for Test word be in Uppercase but only color changes in ios and android correctly.

Sample project

Additional context

What I noticed is that it prints this in the console: resolving "/home/projects/nativescript-stackblitz-templates-7sgpxgkm/src/app/item/items.component.css" to "/home/projects/nativescript-stackblitz-templates-7sgpxgkm/src/app/item/items.component.android.css"

More info on this video as well: https://www.youtube.com/watch?v=v5g6irUI704