feat: make steps of enter details flow dynamic depending on data

app/[lang]/(live)/(public)/hotelreservation/(standard)/step/enterDetailsLayout.css

@@ -0,0 +1,45 @@
+/** 
+  * Due to css import issues with parallel routes we are forced to 
+  * use a regular css file and import it in the page.tsx
+  * This is addressed in Next 15: https://github.com/vercel/next.js/pull/66300
+  */
+
+.enter-details-layout {
+  background-color: var(--Scandic-Brand-Warm-White);
+}
+
+.enter-details-layout__container {
+  display: grid;
+  gap: var(--Spacing-x3) var(--Spacing-x9);
+  /* simulates padding on viewport smaller than --max-width-navigation */
+}
+
+.enter-details-layout__content {
+  margin: var(--Spacing-x3) var(--Spacing-x2) 0;
+}
+
+.enter-details-layout__summaryContainer {
+  position: sticky;
+  bottom: 0;
+  left: 0;
+  right: 0;
+}
+
+@media screen and (min-width: 1367px) {
+  .enter-details-layout__container {
+    grid-template-columns: 1fr 340px;
+    grid-template-rows: auto 1fr;
+    margin: var(--Spacing-x5) auto 0;
+    width: min(
+      calc(100dvw - (var(--Spacing-x2) * 2)),
+      var(--max-width-navigation)
+    );
+  }
+
+  .enter-details-layout__summaryContainer {
+    position: static;
+    display: grid;
+    grid-column: 2/3;
+    grid-row: 1/-1;
+  }
+}