Tailwindcss env(safe-area-inset-bottom) doesn't work on bottom navigation bar

[setoelkahfi]

I've been trying to solve this iPhone issue with the bottom navigation bar and the top safe area being transparent with no luck.

Simulator.Screen.Recording.-.iPhone.16.Pro.-.2025-03-30.at.11.41.45.mp4

What I have tried:

• Using the env(safe-area-x) on tailwindcss side:

@layer utilities {
  .pb-safe {
    padding-bottom: env(safe-area-inset-bottom);
  }
  .pt-safe {
    padding-top: env(safe-area-inset-top);
  }
}

• view-port:

      <meta
        name="viewport"
        content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover"
      />

• I tried to reach out to the Swift code, but there's only one launch screen interface builder.

Any pointers?