>>> [!note] Migrated issue <!-- Drupal.org comment --> <!-- Migrated from issue #3558560. --> Reported by: [phenaproxima](https://www.drupal.org/user/205645) Related to !127 !125 !124 !122 >>> <h3 id="summary-problem-motivation">Problem/Motivation</h3> <p>The components use Tailwind's <code>@apply</code> directive <em>extensively</em>. It's necessary sometimes, but in many cases it's an anti-pattern that Tailwind's documentation explicitly dis-recommends. We should refactor as many of these as possible into CVA structures in the Twig files. Not only will this keep the Tailwind-based styling in as few places as possible (which is the goal of Tailwind, and keeps things simple for front-end developers working on their own variants of Mercury), but it will put a lot of the styling logic into a standard, widely-used structure.</p>