From c386bb5a08b67fff509b7036e0ba6e59b97ba230 Mon Sep 17 00:00:00 2001
From: Baptiste Arnaud <contact@baptiste-arnaud.fr>
Date: Fri, 10 Feb 2023 08:40:54 +0100
Subject: [PATCH] :bug: Fix custom CSS initialization

Initializing in its own <style> element to allow import statements
---
 .../bot-engine/src/components/TypebotViewer.tsx    | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/packages/bot-engine/src/components/TypebotViewer.tsx b/packages/bot-engine/src/components/TypebotViewer.tsx
index 89bff4963..a04ff3f55 100644
--- a/packages/bot-engine/src/components/TypebotViewer.tsx
+++ b/packages/bot-engine/src/components/TypebotViewer.tsx
@@ -74,12 +74,14 @@ export const TypebotViewer = ({
     <Frame
       id="typebot-iframe"
       head={
-        <style>
-          {phoneSyle}
-          {styles}
-          {typebot.theme?.customCss}
-          {importantStyles}
-        </style>
+        <>
+          <style>
+            {phoneSyle}
+            {styles}
+          </style>
+          <style>{typebot.theme?.customCss}</style>
+          <style>{importantStyles}</style>
+        </>
       }
       name="Typebot viewer"
       style={{ width: '100%', height: '100%', border: 'none', ...style }}