From 7db8f01074994b97a0707461c389aed4ab7d6fc5 Mon Sep 17 00:00:00 2001
From: bastien <git@bchanot.fr>
Date: Mon, 11 May 2026 16:09:12 +0200
Subject: [PATCH] =?UTF-8?q?fix(client-handover):=20CSS=20=E2=80=94=20kill?=
 =?UTF-8?q?=20checkbox=20overlap=20with=20adjacent=20inline=20elements?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Old rule `li input[type="checkbox"] + *` absolutely-positioned the first
element sibling after the checkbox (typically <a>, <code>, <strong>),
yanking links and code spans out of flow and overlapping adjacent
content in the rendered PDF.

Replace with a targeted rule that styles the native disabled checkbox
inline (small green box) and leaves siblings untouched. Pandoc GFM emits
`<li><input disabled type="checkbox"> text…</li>` with no wrapper class,
so we target `li > input[type="checkbox"]` directly.

Co-Authored-By: Claude <noreply@anthropic.com>
---
 .../resources/branding/zenquality.css         | 26 ++++++++++++++-----
 1 file changed, 20 insertions(+), 6 deletions(-)

diff --git a/skills/client-handover/resources/branding/zenquality.css b/skills/client-handover/resources/branding/zenquality.css
index 2d9f978..fae351a 100644
--- a/skills/client-handover/resources/branding/zenquality.css
+++ b/skills/client-handover/resources/branding/zenquality.css
@@ -372,7 +372,6 @@ ul.task-list li {
 
 ul.checklist li::before,
 ul.task-list li::before,
-li input[type="checkbox"] + *,
 li.task-list-item::before {
   content: "☐";
   position: absolute;
@@ -382,13 +381,28 @@ li.task-list-item::before {
   line-height: 1;
 }
 
-input[type="checkbox"] {
-  display: none;
+/* Pandoc GFM emits <li><input disabled type="checkbox"> text...</li> with
+   no wrapper class. Render the native checkbox inline (small, green) and
+   leave inline elements (<a>, <code>, <strong>) that follow it untouched.
+   Earlier rule `li input[type="checkbox"] + *` mistakenly absolutely-
+   positioned the first element sibling after the checkbox, yanking links
+   and code spans out of flow and overlapping adjacent content. */
+li > input[type="checkbox"] {
+  appearance: none;
+  -webkit-appearance: none;
+  display: inline-block;
+  width: 3mm;
+  height: 3mm;
+  margin: 0 1.5mm 0 0;
+  border: 0.4mm solid var(--green-moss);
+  border-radius: 0.5mm;
+  vertical-align: middle;
+  background: transparent;
 }
 
-input[type="checkbox"]:checked + label::before {
-  content: "☑";
-  color: var(--green-forest);
+li > input[type="checkbox"]:checked {
+  background: var(--green-forest);
+  border-color: var(--green-forest);
 }
 
 /* ============ CALLOUTS ============ */