From 1c0725cc57f548663dd5d3ef563377b2f8279e21 Mon Sep 17 00:00:00 2001
From: Ulas Kalayci <ulas.kalayci@googlemail.com>
Date: Sat, 25 Apr 2026 22:24:40 +0200
Subject: [PATCH] fix: generate unique SVG gradient IDs to prevent DOM ID
 collisions on re-render

---
 public/router.js | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/public/router.js b/public/router.js
index f46dcd7..865b5b7 100644
--- a/public/router.js
+++ b/public/router.js
@@ -313,7 +313,8 @@ function renderAppShell(container) {
   logoSvg.setAttribute('fill', 'none');
   const defs = document.createElementNS(SVG_NS, 'defs');
   const grad = document.createElementNS(SVG_NS, 'linearGradient');
-  grad.setAttribute('id', 'oikos-logo-bg');
+  const gradId = `oikos-logo-bg-${Math.random().toString(36).slice(2, 7)}`;
+  grad.setAttribute('id', gradId);
   grad.setAttribute('x1', '0'); grad.setAttribute('y1', '0');
   grad.setAttribute('x2', '160'); grad.setAttribute('y2', '160');
   grad.setAttribute('gradientUnits', 'userSpaceOnUse');
@@ -328,7 +329,7 @@ function renderAppShell(container) {
   logoSvg.appendChild(defs);
   const bgRect = document.createElementNS(SVG_NS, 'rect');
   bgRect.setAttribute('width', '160'); bgRect.setAttribute('height', '160');
-  bgRect.setAttribute('rx', '36'); bgRect.setAttribute('fill', 'url(#oikos-logo-bg)');
+  bgRect.setAttribute('rx', '36'); bgRect.setAttribute('fill', `url(#${gradId})`);
   logoSvg.appendChild(bgRect);
   const housePath = document.createElementNS(SVG_NS, 'path');
   housePath.setAttribute('d', 'M80 36L36 72V120C36 122.2 37.8 124 40 124H68V96H92V124H120C122.2 124 124 122.2 124 120V72L80 36Z');