From 395fadc83b94ebd76106ee17f9e5e1af4ec3b830 Mon Sep 17 00:00:00 2001
From: Kerim Atilgan <kerim@familie-atilgan.de>
Date: Fri, 15 May 2026 20:38:28 +0200
Subject: [PATCH] Fix hardware-pricing reveal so it respects the Tailwind grid
 layout
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The wizard's EK / Kundenverkaufspreis fields live inside a
<div class="grid grid-cols-2 gap-md"> wrapper. Toggling its inline
display:block as the previous code did replaced the grid layout and
stacked the two inputs full-width. Switch the wrapper to start with
the Tailwind `hidden` utility and toggle `hidden`/`grid` on the
classList, so when hardware is filled in the two pricing fields
appear side by side. Functionality and the existing commission
formula (Provision + Aktionscodes − EK + VK, already covered by the
provisionService tests) are unchanged.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 public/index.html |  2 +-
 public/script.js  | 10 +++++-----
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/public/index.html b/public/index.html
index cd8ade0..76c406a 100644
--- a/public/index.html
+++ b/public/index.html
@@ -1208,7 +1208,7 @@
                                        class="w-full bg-surface-container-lowest border border-outline-variant rounded-lg h-10 px-sm text-body-md text-on-surface focus:border-primary focus:ring-4 focus:ring-primary/20 outline-none">
                             </div>
 
-                            <div id="hardwarePricingFields" style="display:none;" class="grid grid-cols-2 gap-md">
+                            <div id="hardwarePricingFields" class="hidden grid-cols-2 gap-md">
                                 <div class="flex flex-col gap-base">
                                     <label class="text-label-caps text-on-surface-variant" for="hardwareEk">Hardware-EK</label>
                                     <input type="number" id="hardwareEk" name="hardware_ek" step="0.01" min="0" placeholder="0.00"
diff --git a/public/script.js b/public/script.js
index 2ae145d..5db1ebb 100644
--- a/public/script.js
+++ b/public/script.js
@@ -3661,16 +3661,16 @@ function toggleHardwarePricing() {
     const kundenverkaufspreisInput = document.getElementById('kundenverkaufspreis');
 
     if (hardwareInput.value.trim() !== '') {
-        // Show pricing fields and make them required
-        hardwarePricingFields.style.display = 'block';
+        // Reveal the grid wrapper (Tailwind `grid` + `grid-cols-2`).
+        hardwarePricingFields.classList.remove('hidden');
+        hardwarePricingFields.classList.add('grid');
         hardwareEkInput.required = true;
         kundenverkaufspreisInput.required = true;
     } else {
-        // Hide pricing fields and remove required attribute
-        hardwarePricingFields.style.display = 'none';
+        hardwarePricingFields.classList.add('hidden');
+        hardwarePricingFields.classList.remove('grid');
         hardwareEkInput.required = false;
         kundenverkaufspreisInput.required = false;
-        // Clear values
         hardwareEkInput.value = '';
         kundenverkaufspreisInput.value = '';
     }