From 6b72e0a2f56e5278506c496848c1c6b47998824b Mon Sep 17 00:00:00 2001
From: Jan Calanog <jan.calanog@elastic.co>
Date: Thu, 6 Aug 2026 13:20:09 +0200
Subject: [PATCH] Fix applies-block layout shift before web component hydration

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 src/Elastic.Documentation.Site/Assets/markdown/applies-to.css | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/Elastic.Documentation.Site/Assets/markdown/applies-to.css b/src/Elastic.Documentation.Site/Assets/markdown/applies-to.css
index f1aa34c8d0..e52a2ccaf3 100644
--- a/src/Elastic.Documentation.Site/Assets/markdown/applies-to.css
+++ b/src/Elastic.Documentation.Site/Assets/markdown/applies-to.css
@@ -70,6 +70,10 @@
 
 	.applies.applies-block {
 		@apply border-b-grey-20 flex flex-wrap gap-2 border-b-1 pb-4;
+		/* One badge row before applies-to-popover hydrates (border-box). */
+		min-height: calc(
+			1.875rem + 1rem + 1px
+		); /* 30px badge + pb-4 + border */
 	}
 
 	.applies.applies-inline {