Standardize healthcard CSS

[ashley-cui]

Standardize column-gap to 8px, and row-gap to 4px.

Fixes: #20822

[garrett]

It seems that the base variable, which is used here, no longer exists:

PF now has column and row instead, it seems:

--pf-v5-l-flex--spacer--column--base: var(--pf-v5-global--spacer--lg);
--pf-v5-l-flex--spacer--row--base: var(--pf-v5-global--spacer--sm);

I think a proper fix is to reconsider our overrides. I started to look at this, but I had a migraine happen during lunch.

Meanwhile, as PF changed things which affected Cockpit, this means a few things:

1. Regression in PF caused by a code change (probably several months ago at this point)
2. Other parts of Cockpit are probably affected (I have seen other weird spacing elsewhere)
3. There weren't tests that caught this

As a more proper fix would probably other parts of Cockpit, I suggest we put this in as a temporary fix while we investigate the problem and make tests.

Here's where I was investigating this: main...garrett:cockpit:wip-pf-flex-fix — I need to stop for today and come back to this. (You can look at it more if you'd like.)

Again, I think we could merge in a fix like you have here in this PR, but we should probably use shorthand, add a comment, and open an issue to investigate the underlying issue.

[garrett]

We usually use shorthand for things like this; for example:

Suggested change

	.pf-v5-l-flex {
	column-gap: var(--pf-v5-global--spacer--sm);
	row-gap: var(--pf-v5-global--spacer--xs);
	}
	.pf-v5-l-flex {
	gap: var(--pf-v5-global--spacer--xs) var(--pf-v5-global--spacer--sm);
	}

However, while reviewing this, I noticed something strange. I'll post about it in the main comment.