Merged in feat/SW-3520-update-footer-ui-and-footer-link (pull request #2910)

feat(SW-3520): Updated the footer

* feat(SW-3520): Updated links to route to scandic web

* feat(SW-3520): Updated the footer with language switcher

* feat(SW-3520): Updated the Contact-us link and removed double slash


Approved-by: Anton Gunnarsson

apps/partner-sas/components/LanguageSwitcher/languageSwitcher.module.css

@@ -1,18 +1,39 @@
 .languageSwitcher {
   .triggerButton {
     gap: var(--Space-x1);
-    padding: var(--Space-x1);
     justify-content: flex-start;
     width: 100%;
     border: 0 none;
   }
 
   .triggerText {
+    align-items: center;
     display: flex;
-    justify-content: space-between;
     width: 100%;
     color: var(--Text-sas-20);
   }
+
+  &.header {
+    .triggerButton {
+      padding: var(--Space-x1);
+    }
+    .triggerText {
+      justify-content: space-between;
+    }
+  }
+
+  &.footer {
+    .triggerText,
+    .chevron {
+      color: var(--TEMP-sas-40);
+    }
+    .chevron {
+      margin: 1px 0 0 2px;
+    }
+    .globeIcon {
+      color: var(--TEMP-sas-40);
+    }
+  }
 }
 
 .languageSwitcherContent {
@@ -42,6 +63,10 @@
   justify-content: space-between;
   align-items: center;
   border-radius: var(--Space-x1);
+
+  &.active {
+    background-color: var(--Surface-Primary-Hover);
+  }
 }
 
 .languageModalOverlay {
@@ -61,22 +86,56 @@
   z-index: 1001;
 
   .closeModal {
-    position: fixed;
-    top: var(--Space-x2);
-    right: var(--Space-x2);
+    align-self: flex-end;
     background-color: transparent;
-    color: transparent;
+    color: var(--TEMP-sas-40);
+    gap: 0;
+  }
+
+  .closeIcon {
+    display: none;
+  }
+}
+
+.footer .languageModal {
+  top: 0;
+
+  .languageSwitcherContent {
+    padding: 0;
+
+    .title,
+    .languageSwitcherListContainer {
+      padding: 0 var(--Space-x2);
+    }
+  }
+  .closeModalWrapper {
+    display: flex;
+    width: 100%;
+    padding: 0 var(--Space-x2);
+    border-bottom: 1px solid var(--SAS-90);
+    justify-content: flex-end;
+  }
+  .arrowBackIcon {
+    display: none;
+  }
+  .closeIcon {
+    display: block;
   }
 }
 
 @media screen and (min-width: 768px) {
   .languageSwitcher {
-    .triggerText {
-      color: white;
+    &.header {
+      .triggerText {
+        color: white;
+      }
+
+      .triggerButton {
+        color: white;
+      }
     }
 
     .triggerButton {
-      color: white;
       padding: 0;
     }