Product Preview Card Component with CSS Variables and Light/Dark

Don't know how to properly tag the light dark switcher for Aria. I assume best just to set to aria-hidden = true?

I already know some don't like the over use of CSS properties / variables that I do. My intention is to make it easier for just changing certain details without changing the structure of the CSS setup, and means for media queries I only update the variables rather than add repeat selectors. Something I find more irritating.

-- Added update 2022-10-10

Have made a minor update based on a comment from Grace in reply to someone else. Have swapped my pricing block to be a paragraph rather than a div, wrapped the old price in del tags, and I have added an aria-label to describe that it is the old price and what the price was.