From e53233b08c31180117ad242997e32b9fb4adf1bb Mon Sep 17 00:00:00 2001
From: Michael Czechowski <mail@dailysh.it>
Date: Wed, 14 Jan 2026 17:53:29 +0100
Subject: [PATCH] fix: header pill shows module name + level, fix RTL checkmark
 spacing

---
 src/app.js   |  6 +++++-
 src/main.css | 28 +++++++++++++++++++++++++++-
 2 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/src/app.js b/src/app.js
index b4f10c9..4a86d00 100644
--- a/src/app.js
+++ b/src/app.js
@@ -479,7 +479,11 @@ function loadCurrentLesson() {
 
 	// Update level indicator
 	renderLevelIndicator(elements.levelIndicator, engineState.lessonIndex + 1, engineState.totalLessons);
-	renderLevelIndicator(elements.headerLevelPill, engineState.lessonIndex + 1, engineState.totalLessons);
+	// Header pill shows module name + level
+	if (elements.headerLevelPill && engineState.module) {
+		const label = t("lessonLabel");
+		elements.headerLevelPill.innerHTML = `<span class="header-module-name">${engineState.module.title}</span> <span class="header-level">${label} ${engineState.lessonIndex + 1} / ${engineState.totalLessons}</span>`;
+	}
 
 	// Update active lesson in sidebar
 	updateActiveLessonInSidebar(engineState.module.id, engineState.lessonIndex);
diff --git a/src/main.css b/src/main.css
index f638983..fc3ac31 100644
--- a/src/main.css
+++ b/src/main.css
@@ -151,6 +151,15 @@ kbd {
 	margin-left: var(--spacing-sm);
 }
 
+.header-module-name {
+	font-weight: 600;
+	color: var(--text-color);
+}
+
+.header-level {
+	margin-left: 0.5em;
+}
+
 .header-left {
 	display: flex;
 	align-items: center;
@@ -1652,12 +1661,29 @@ input:checked + .toggle-slider::before {
 	transform: rotate(-90deg);
 }
 
+/* RTL: Module completed checkmark position (::after) */
+[dir="rtl"] .module-header.completed::after {
+	margin-left: 0;
+	margin-right: 8px;
+}
+
 /* RTL: Lesson checkmark position */
-[dir="rtl"] .lesson-list-item::before {
+[dir="rtl"] .lesson-list-item.completed::before {
 	margin-left: 6px;
 	margin-right: 0;
 }
 
+/* RTL: Header level pill */
+[dir="rtl"] .header-level-pill {
+	margin-left: 0;
+	margin-right: var(--spacing-sm);
+}
+
+[dir="rtl"] .header-level {
+	margin-left: 0;
+	margin-right: 0.5em;
+}
+
 /* RTL: Toggle switch slider */
 [dir="rtl"] .toggle-slider {
 	margin-right: 0;