Merged in chore/move-enter-details (pull request #2778)

Chore/move enter details

Approved-by: Anton Gunnarsson

packages/booking-flow/lib/components/EnterDetails/SelectedRoom/selectedRoom.module.css

@@ -0,0 +1,65 @@
+.wrapper {
+  position: relative;
+  display: flex;
+  flex-direction: row;
+}
+
+.wrapper[data-available="false"] .title,
+.wrapper[data-available="false"] .description,
+.wrapper[data-available="false"] .details {
+  opacity: 0.5;
+  pointer-events: none;
+}
+
+.main {
+  width: 100%;
+  border-bottom: 1px solid var(--Primary-Light-On-Surface-Divider-subtle);
+  padding-bottom: var(--Spacing-x3);
+}
+
+.headerContainer {
+  display: grid;
+  justify-content: space-between;
+  align-items: center;
+  grid-template-areas:
+    "title title"
+    "description button";
+}
+
+.title {
+  grid-area: title;
+}
+
+.description {
+  grid-area: description;
+}
+
+.button {
+  grid-area: button;
+  justify-self: flex-end;
+  align-self: flex-start;
+}
+
+.rate {
+  color: var(--UI-Text-Placeholder);
+  display: block;
+}
+
+.details {
+  display: flex;
+  justify-content: flex-start;
+  margin-top: var(--Space-x05);
+}
+
+@media screen and (min-width: 768px) {
+  .rate {
+    display: inline;
+  }
+
+  .rate::before {
+    content: "(";
+  }
+  .rate::after {
+    content: ")";
+  }
+}