From 98c08e0c55169a2a6f3110dafdd12d935b48d78e Mon Sep 17 00:00:00 2001
From: dtonon <git@dtonon.com>
Date: Thu, 18 Jun 2026 11:55:53 +0100
Subject: [PATCH] Recolor the native search clear button

---
 src/routes/layout.css | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/src/routes/layout.css b/src/routes/layout.css
index b885fdd..62991c1 100644
--- a/src/routes/layout.css
+++ b/src/routes/layout.css
@@ -45,6 +45,21 @@ body {
     :where(.dark) textarea::placeholder {
     color: var(--color-neutral-500);
     }
+
+    /* Redraw the native search clear button so it follows our palette instead
+    of the OS accent color. Firefox renders no button at all. */
+    input[type="search"]::-webkit-search-cancel-button {
+    -webkit-appearance: none;
+    width: 1.2em;
+    height: 1.2em;
+    background-color: var(--color-neutral-400);
+    -webkit-mask: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="black" d="M12 10.6 6.6 5.2 5.2 6.6l5.4 5.4-5.4 5.4 1.4 1.4 5.4-5.4 5.4 5.4 1.4-1.4-5.4-5.4 5.4-5.4-1.4-1.4z"/></svg>')
+      no-repeat center / contain;
+    cursor: pointer;
+    }
+    :where(.dark) input[type="search"]::-webkit-search-cancel-button {
+    background-color: var(--color-neutral-500);
+    }
 }
 
 /* Tighter heading rhythm for all rendered (prose) content. Overrides the