fix comments, use @apply

Author: avivkeller

packages/ui-components/src/styles/index.css

@@ -14,26 +14,26 @@
 @import './markdown.css' layer(utilities);
 
 @layer base {
-  /* See https://tailwindcss.com/docs/upgrade-guide#buttons-use-the-default-cursor */
-  button,
-  [role='button'] {
-    &:not(:disabled) {
-      cursor: pointer;
-    }
-  }
-
-  /* See https://tailwindcss.com/docs/upgrade-guide#default-border-color */
   :root {
     --header-height: calc(var(--spacing, 0.25rem) * 16);
   }
 
+  /* See https://tailwindcss.com/docs/upgrade-guide#default-border-color */
   *,
   ::after,
   ::before,
   ::backdrop,
   ::file-selector-button {
     border-color: var(--color-gray-200, currentColor);
   }
+
+  /* See https://tailwindcss.com/docs/upgrade-guide#buttons-use-the-default-cursor */
+  button,
+  [role='button'] {
+    &:not(:disabled) {
+      @apply cursor-pointer;
+    }
+  }
 }
 
 @custom-variant aria-current (&[aria-current="page"]);