diff --git a/djangorota/djangorota/templates/rota/rota_detail.html b/djangorota/djangorota/templates/rota/rota_detail.html
index 3767591..c63f1a7 100644
--- a/djangorota/djangorota/templates/rota/rota_detail.html
+++ b/djangorota/djangorota/templates/rota/rota_detail.html
@@ -17,9 +17,9 @@
       </div>
 
       <div class="mb-4">
-        <h2 class="subtitle">Historic runs</h2>
-        <div class="box">
-          <div style="margin-bottom:0.5em;">
+        <details class="box">
+          <summary class="subtitle" style="cursor:pointer; outline:none;">Historic runs</summary>
+          <div style="margin-bottom:0.5em; margin-top:0.5em;">
             <form method="post" action="{% url 'rota:rota_runs_clear' rota.id %}" style="display:inline" onsubmit="return confirm('Delete all historic runs for this rota? This cannot be undone.')">
               {% csrf_token %}
               <button class="button is-danger is-light is-small" type="submit">Clear all runs</button>
@@ -36,7 +36,7 @@
               <li>No previous runs</li>
             {% endfor %}
           </ul>
-        </div>
+        </details>
       </div>
 
       <div class="mb-4">
diff --git a/djangorota/djangorota/templates/rota/worker_detail.html b/djangorota/djangorota/templates/rota/worker_detail.html
index c81f236..74e192e 100644
--- a/djangorota/djangorota/templates/rota/worker_detail.html
+++ b/djangorota/djangorota/templates/rota/worker_detail.html
@@ -46,16 +46,21 @@
     </div>
   </div>
 
+  {% json_script leaves as worker_leaves_json %}
   <script src="{% static 'js/calendar.js' %}"></script>
   <script>
     (function(){
       const container = document.getElementById('calendar');
       if(!container) return;
-      const leaves = [
-        {% for l in worker.leaves.all %}
-          {start:'{{ l.start_date|date:"Y-m-d" }}', end:'{{ l.end_date|date:"Y-m-d" }}'},
-        {% endfor %}
-      ];
+      let leaves = [];
+      try {
+        const raw = document.getElementById('worker_leaves_json');
+        if (raw) {
+          leaves = JSON.parse(raw.textContent || raw.innerText || '[]');
+        }
+      } catch (e) {
+        console.debug('Unable to parse embedded leaves JSON', e);
+      }
       window.initCalendar('calendar', { workerId: container.dataset.workerId, leaves: leaves, requestUrl: '{% url "rota:request_leave" %}', leavesUrl: '{% url "rota:worker_leaves_json" worker.id %}', mode: container.dataset.mode || 'inline' });
     })();
   </script>
diff --git a/djangorota/rota/views.py b/djangorota/rota/views.py
index cb22d91..229bc21 100644
--- a/djangorota/rota/views.py
+++ b/djangorota/rota/views.py
@@ -320,7 +320,23 @@ def worker_detail(request, worker_id):
 		else:
 			form = LeaveForm()
 
-	return render(request, "rota/worker_detail.html", {"worker": worker, "form": form})
+	# Build a JSON-serializable list of leaves for the calendar widget to consume
+	leaves = []
+	try:
+		for leave in worker.leaves.all():
+			try:
+				s = leave.start_date.isoformat()
+			except Exception:
+				s = str(leave.start_date)
+			try:
+				e = leave.end_date.isoformat()
+			except Exception:
+				e = str(leave.end_date)
+			leaves.append({"start": s, "end": e})
+	except Exception:
+		leaves = []
+
+	return render(request, "rota/worker_detail.html", {"worker": worker, "form": form, "leaves": leaves})
 
 
 @require_http_methods(["GET", "POST"])