Why is it not possible to set a CSS variable in a:visited but in a:hover?

Question

Why do most modern browsers (except Firefox) not support setting a CSS variable in a:visited?

This is not working in Chromium based browsers, Safari, etc.:

a:visited {
  --bg-color: red;
}

But all browsers support setting variables in a:hover:

a:hover {
  --bg-color: red;
}

Here's a demo: https://codepen.io/mamiu/pen/YzvXXqw

Answer 1

As pointed out by @Tybo this doesn't work for privacy reasons.

The solution is to simply chain CSS selectors and to change the CSS properties directly instead of using variables.

a:visited span.some-child-element {
  background-color: red;
}

I've also updated the demo: https://codepen.io/mamiu/pen/YzvXXqw