thanks @ryan-u for reporting

Describe the bug

e41498c#diff-5504fef8091c98ca477efeabcecff901a7053f5307d16bdd7be3e3aafc94614d introduced a bug whereby the light-dark styles (and any other user customizations) are overridden on the host. This occurred when LLM tools migrated cssprop jsdoc to css.

The fix should ensure that those doc comments are left on the appropriate var calls, or if there's only one var call in the declaration, above the declaration:

Good:

/** comment for --a */
color: var(--a);
/** comment for --b */
--b: blue;
/** comment for --c */
--c:
  /** comment for --d */
  var(--d);

Bad:

/** comment for --d */
--c: var(--d);

Screenshots

RHDS version number

3.1.0

Steps to reproduce

this occurs in any use of breadcrumb

Expected behaviour

light-dark is respected, css props are properly documented

Element HTML

<rh-breadcrumb>
  <ol>
    <li><a href="#">Home</a></li>
    <li><a href="#">Products</a></li>
    <li><a href="#">Red Hat OpenShift on AWS</a></li>
    <li><a href="#">4</a></li>
    <li><a href="#">Introduction to ROSA</a></li>
    <li><a href="#" aria-current="page">Chapter 1. Understanding ROSA</a></li>
  </ol>
</rh-breadcrumb>

Operating System (OS)

Linux

Browser

No response

Additional browser or assistive technology info

No response