Added firefox specific css.

[revanth0212]

Description

Accordion text is not center-aligned in firefox. This is probably because of the way firefox interprets height on div. Giving line-height for divs in firefox fixes the problem.

Related Issue

Closes PWA-384

Verification Stakeholders

@jimbo

Verification Steps

1. Go to cart in firefox.
2. Text in accordions should be vertically center aligned.

Screenshots / Screen Captures (if appropriate)

Checklist

• No functionality should have changed. This is just a css change.
• Change should not effect css in chrome and safari. This is specific to firefox.

[PWAStudioBot]

	Messages
📖	Access a deployed version of this PR here. Make sure to wait for the "pwa-pull-request-deploy" job to complete.
📖	DangerCI Failures related to missing labels/description/linked issues/etc will persist until the next push or next nightly build run (assuming they are fixed).
📖	Associated JIRA tickets: PWA-384.

Generated by 🚫 dangerJS against 6a26896

[jimbo]

@revanth0212 Thanks for picking this one up; I apologize, I thought it had been assigned to me.

Unfortunately, this doesn't address the root issue, which is that the implementation is relying on display: flex working on a replaced element (<button> in this case). Also, we should avoid tricks that attempt to target Firefox specifically.

There are two things to fix with the accordion button here:

• <button> is not a reliable flex container or grid container
• <div> is not a valid child of <button>

So we need to change the <div> to a <span> and make the <span> the grid container for the whole element. The <button> should not contribute much to the layout; it's there purely for accessibility reasons.

[supernova-at]

✅ Verification steps pass