Border clipped at bottom on some themes

[nunoaac]

On certain themes (e.g. emergency, prism) the bottom border of the card is partially clipped. Other themes (e.g. warning) render correctly. Zooming the browser in or out will randomly make it appear correct or broken — suggesting a sub-pixel rounding issue.

What we've tried:

Setting overflow: visible on all ancestor containers (column cells, parent button-card, middle section)
Setting overflow: visible via card_mod on ha-card, :host, and .atc-inner-clip
None of these had any effect, suggesting the clipping originates inside the card's own rendering

Hypothesis:
The theme's root div (e.g. .at-emergency) uses box-sizing: content-box, so the border renders outside the element's layout box. Sub-pixel rounding causes the border to occasionally fall just outside the clip boundary of .atc-inner-clip. Themes that use inset borders or box-shadow are not affected.

[djdevil]

Hi @nunoaac — your hypothesis is correct. Themes like emergency and prism use an outer border with the default box-sizing: content-box, so the border renders just outside the element's layout box. .atc-inner-clip clips with overflow: hidden at exactly its boundary, and sub-pixel rounding can push the bottom border a fraction of a pixel outside that boundary — hence the intermittent clipping that changes when you zoom.

Fixed in v1.3.2.5 by adding transform: translateZ(0) to .atc-inner-clip. This promotes the clip container to its own compositor layer, which operates on integer pixel boundaries and eliminates the sub-pixel rounding artifact entirely. No layout changes at all.