From ff17bab0db2a72b9bc9da86a3bfdc987326e82e4 Mon Sep 17 00:00:00 2001
From: pradeepkumar <kongupradeep@live.com>
Date: Sat, 18 Apr 2026 10:54:52 +0530
Subject: [PATCH] fix: update validation error message to overlay layout to
 prevent content shifting

---
 src/components/home/HeroSection.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/home/HeroSection.tsx b/src/components/home/HeroSection.tsx
index b874ae7..f01b9b8 100644
--- a/src/components/home/HeroSection.tsx
+++ b/src/components/home/HeroSection.tsx
@@ -239,10 +239,10 @@ export function HeroSection({ content }: { content?: HeroContent }) {
             </div>
           </div>
 
-          {/* Validation Error Message */}
+          {/* Validation Error Message (overlay — does not push layout) */}
           {validationError && (
-            <div className="mt-3 flex justify-center px-2">
-              <div className="text-white font-serif text-xs md:text-sm bg-red-500/90 rounded-[7px] py-1.5 px-3 inline-flex items-center gap-2 max-w-fit shadow-md">
+            <div className="pointer-events-none fixed inset-x-0 top-20 z-50 flex justify-center px-4 md:absolute md:top-auto md:bottom-[-56px] md:inset-x-0">
+              <div className="pointer-events-auto text-white font-serif text-xs md:text-sm bg-red-500/95 rounded-[7px] py-2 px-3 inline-flex items-center gap-2 max-w-[92%] shadow-lg">
                 <span className="text-left">{validationError}</span>
                 <button
                   onClick={handleClearError}