Description of problem:

The theme cards fail to scale appropriately when the browser window is resized to smaller dimensions. This issue prevents users from viewing all configured themes when the screen resolution or window size is reduced. The display breaks or doesn't show the full set of themes, causing a suboptimal user experience.

Prerequisites (if any, like setup, operators/versions):

None

Steps to Reproduce

Navigate to Adoption Insights page and start scaling the browser window down until the cards scaling starts breaking.

Actual results:

The infographics, table rows and select fields in the information cards start spilling over the card boundaries and conflicting with each other.

Expected results:

The Adoption Insights page should probably start displaying the cards vertically a bit sooner than it currently does. On bigger display sizes the content of the information cards shouldn't spill over the card borders and it should be contained within the card.

Reproducibility (Always/Intermittent/Only Once):

Always.

Build Details:

RHDH Version: 1.7.1
Backstage Version: 1.39.1
Upstream: https://github.com/redhat-developer/rhdh/tree/release-1.7 @ 0696f3e9
Midstream: https://gitlab.cee.redhat.com/rhidp/rhdh/-/commits/rhdh-1.7-rhel-9 @ c175ece5
Build Time: 2025-09-15T18:46:22Z

Additional info (Such as Logs, Screenshots, etc):

See attachments for screenshots.