fix/SW-2247 enter details fixes

* fix(SW-2247): Removed accordion like special requests block and changed button variant

* fix(SW-2247): Added additional info for bedtype selection

Approved-by: Tobias Johansson
Approved-by: Niclas Edenvin

apps/scandic-web/components/HotelReservation/EnterDetails/Details/SpecialRequests/index.tsx

@@ -1,42 +1,25 @@
-import { useState } from "react"
 import { useIntl } from "react-intl"
 
-import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
+import { Typography } from "@scandic-hotels/design-system/Typography"
 
-import Divider from "@/components/TempDesignSystem/Divider"
 import TextArea from "@/components/TempDesignSystem/Form/TextArea"
-import Footnote from "@/components/TempDesignSystem/Text/Footnote"
 
 import styles from "./specialRequests.module.css"
 
 export default function SpecialRequests() {
-  const [isOpen, setIsOpen] = useState(false)
   const intl = useIntl()
 
-  function toggleRequests() {
-    setIsOpen((prevVal) => !prevVal)
-  }
-
   return (
-    <div className={styles.requests} data-requests-open={isOpen}>
-      <button className={styles.toggle} onClick={toggleRequests} type="button">
-        <Footnote
-          color="uiTextHighContrast"
-          textTransform="uppercase"
-          type="label"
-          className={styles.header}
-          textAlign="left"
-        >
+    <div className={styles.requests}>
+      <Typography variant="Title/Overline/sm">
+        <p className={styles.heading}>
           {intl.formatMessage({
-            defaultMessage: "Special requests",
+            defaultMessage: "Special requests (optional)",
           })}
-        </Footnote>
-        <MaterialIcon icon="keyboard_arrow_down" className={styles.chevron} />
-        <Divider className={styles.divider} color="subtle" />
-      </button>
+        </p>
+      </Typography>
       <div className={styles.content}>
-        <div className={styles.contentWrapper}>
-          {/*
+        {/*
 
           TODO: Hiding because API is not ready for this yet (https://scandichotels.atlassian.net/browse/SW-1497). Add back in when API is ready.
 
@@ -74,14 +57,13 @@ export default function SpecialRequests() {
               },
             ]}
             /> */}
-          <TextArea
-            label={intl.formatMessage({
-              defaultMessage:
-                "Is there anything else you would like us to know before your arrival?",
-            })}
-            name="specialRequest.comment"
-          />
-        </div>
+        <TextArea
+          label={intl.formatMessage({
+            defaultMessage:
+              "Is there anything else you would like us to know before your arrival?",
+          })}
+          name="specialRequest.comment"
+        />
       </div>
     </div>
   )