Fix heading color and margin in colored containers and nav

- Headings inside .bg-* containers inherit inverse color for readability
- Remove heading margin-bottom inside nav elements

Author: Amaury

css/mu.colors.css

@@ -31,10 +31,10 @@
 .bg-pop       { background-color: var(--mu-pop);       color: var(--mu-primary-inverse); }
 .bg-spark     { background-color: var(--mu-spark);     color: var(--mu-primary-inverse); }
 
-/* Links inside filled backgrounds inherit inverse color */
+/* Links and headings inside filled backgrounds inherit inverse color */
 :is(.bg-primary, .bg-secondary, .bg-tertiary, .bg-contrast,
 .bg-accent, .bg-success, .bg-info, .bg-warning,
-.bg-error, .bg-pop, .bg-spark) a {
+.bg-error, .bg-pop, .bg-spark) :is(a, h1, h2, h3, h4, h5, h6) {
 	color: inherit;
 }
 

css/mu.component.nav.css

@@ -64,6 +64,11 @@ body > header:has(> nav:only-child) {
 	padding-block: 0;
 }
 
+/* Remove heading margin inside nav (PicoCSS headings have margin-bottom by default) */
+nav :is(h1, h2, h3, h4, h5, h6) {
+	margin-bottom: 0;
+}
+
 /* PicoCSS bugfix: nav dropdown full-width on Firefox (picocss/pico#701) — remove when fixed upstream */
 nav details.dropdown {
 	display: inline-block;

documentation/mu.utilities.md

@@ -74,6 +74,22 @@ When used on a `<nav>`, these classes automatically add `z-index: 100` and `box-
 
 ---
 
+## Cursor
+
+| Class | Effect |
+|-------|--------|
+| `.clickable` | `cursor: pointer` — shows a pointer cursor on hover |
+
+Use `.clickable` on elements that are interactive via JavaScript but are not `<a>` or `<button>` (which already show a pointer cursor natively).
+
+```html
+<tr class="clickable" onclick="openDetail(this)">
+    <td>Row content</td>
+</tr>
+```
+
+---
+
 ## Color utilities
 
 Text, background, and border color classes are documented in [µColors](mu.colors.md#utility-classes).