From d193bf057d1d8817e9c887049c0143886fa52eda Mon Sep 17 00:00:00 2001
From: Erik Tiekstra <erik.tiekstra@scandichotels.com>
Date: Wed, 28 Jan 2026 12:03:22 +0000
Subject: [PATCH] fix(BOOK-771): Added spacing between content and cta wrapper
 in TeaserCard sidepeeks

Approved-by: Bianca Widstam
---
 .../components/TeaserCard/Sidepeek/index.tsx  | 62 ++++++++++---------
 .../TeaserCard/Sidepeek/sidepeek.module.css   |  5 ++
 2 files changed, 38 insertions(+), 29 deletions(-)

diff --git a/packages/design-system/lib/components/TeaserCard/Sidepeek/index.tsx b/packages/design-system/lib/components/TeaserCard/Sidepeek/index.tsx
index 2d344704a..cccb398d4 100644
--- a/packages/design-system/lib/components/TeaserCard/Sidepeek/index.tsx
+++ b/packages/design-system/lib/components/TeaserCard/Sidepeek/index.tsx
@@ -47,35 +47,39 @@ export default function TeaserCardSidepeek({
           defaultMessage: "Close",
         })}
       >
-        {content ? (
-          <JsonToHtml
-            nodes={content.json.children}
-            embeds={content.embedded_itemsConnection.edges}
-          />
-        ) : null}
-        <div className={styles.ctaContainer}>
-          {primary_button && (
-            <ButtonLink
-              variant="Primary"
-              color="Primary"
-              size="sm"
-              href={primary_button.href}
-              target={primary_button.openInNewTab ? "_blank" : undefined}
-            >
-              {primary_button.title}
-            </ButtonLink>
-          )}
-          {secondary_button && (
-            <ButtonLink
-              variant="Secondary"
-              color="Primary"
-              size="sm"
-              href={secondary_button.href}
-              target={secondary_button.openInNewTab ? "_blank" : undefined}
-            >
-              {secondary_button.title}
-            </ButtonLink>
-          )}
+        <div className={styles.content}>
+          {content ? (
+            <JsonToHtml
+              nodes={content.json.children}
+              embeds={content.embedded_itemsConnection.edges}
+            />
+          ) : null}
+          {primary_button || secondary_button ? (
+            <div className={styles.ctaContainer}>
+              {primary_button && (
+                <ButtonLink
+                  variant="Primary"
+                  color="Primary"
+                  size="sm"
+                  href={primary_button.href}
+                  target={primary_button.openInNewTab ? "_blank" : undefined}
+                >
+                  {primary_button.title}
+                </ButtonLink>
+              )}
+              {secondary_button && (
+                <ButtonLink
+                  variant="Secondary"
+                  color="Primary"
+                  size="sm"
+                  href={secondary_button.href}
+                  target={secondary_button.openInNewTab ? "_blank" : undefined}
+                >
+                  {secondary_button.title}
+                </ButtonLink>
+              )}
+            </div>
+          ) : null}
         </div>
       </SidePeek>
     </div>
diff --git a/packages/design-system/lib/components/TeaserCard/Sidepeek/sidepeek.module.css b/packages/design-system/lib/components/TeaserCard/Sidepeek/sidepeek.module.css
index 90b27f276..7d75d542d 100644
--- a/packages/design-system/lib/components/TeaserCard/Sidepeek/sidepeek.module.css
+++ b/packages/design-system/lib/components/TeaserCard/Sidepeek/sidepeek.module.css
@@ -6,3 +6,8 @@
   display: grid;
   gap: var(--Space-x2);
 }
+
+.content {
+  display: grid;
+  gap: var(--Space-x4);
+}