chore: replace old border-radius variables with new tokens

2025-05-05 11:11:00 +02:00
parent aa43d7d059
commit d6b70edfa3
183 changed files with 263 additions and 263 deletions
--- a/apps/scandic-web/app/[lang]/(live)/(protected)/my-pages/profile/edit/page.module.css
+++ b/apps/scandic-web/app/[lang]/(live)/(protected)/my-pages/profile/edit/page.module.css
@@ -1,6 +1,6 @@
 .container {
  background-color: var(--Main-Grey-White);
-  border-radius: var(--Corner-radius-Large);
+  border-radius: var(--Corner-radius-lg);
  display: grid;
  gap: var(--Spacing-x3);
  padding: var(--Spacing-x2) var(--Spacing-x2) var(--Spacing-x4);
--- a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/components/SASModal.module.css
+++ b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/components/SASModal.module.css
@@ -7,12 +7,12 @@
  width: 100%;
  padding: var(--Spacing-x3) var(--Spacing-x3) var(--Spacing-x4);
  text-align: center;
-  border-radius: var(--Corner-radius-Medium) var(--Corner-radius-Medium) 0 0;
+  border-radius: var(--Corner-radius-md) var(--Corner-radius-md) 0 0;
  margin-top: auto;

  @media screen and (min-width: 768px) {
    & {
-      border-radius: var(--Corner-radius-Medium);
+      border-radius: var(--Corner-radius-md);
      margin-top: initial;
      width: 560px;
    }
--- a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/otp/OneTimePasswordForm.module.css
+++ b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/otp/OneTimePasswordForm.module.css
@@ -7,12 +7,12 @@
  width: 100%;
  padding: var(--Spacing-x3);
  text-align: center;
-  border-radius: var(--Corner-radius-Medium) var(--Corner-radius-Medium) 0 0;
+  border-radius: var(--Corner-radius-md) var(--Corner-radius-md) 0 0;
  margin-top: auto;

  @media screen and (min-width: 768px) {
    & {
-      border-radius: var(--Corner-radius-Medium);
+      border-radius: var(--Corner-radius-md);
      margin-top: initial;
      width: 512px;
    }
@@ -44,7 +44,7 @@
  padding: var(--Spacing-x3) 0;
  font-family: var(--typography-Body-Regular-fontFamily);
  border: 1px solid var(--Base-Border-Normal);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  text-align: center;

  &.active {
--- a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/transfer/success/transferSuccess.module.css
+++ b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/transfer/success/transferSuccess.module.css
@@ -17,7 +17,7 @@
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-x3);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  align-items: center;
  width: 100%;
 }
--- a/apps/scandic-web/components/Blocks/DynamicContent/HowItWorks/howItWorks.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/HowItWorks/howItWorks.module.css
@@ -1,7 +1,7 @@
 .container {
  align-items: center;
  background-color: var(--UI-Grey-10);
-  border-radius: var(--Corner-radius-xLarge);
+  border-radius: var(--Corner-radius-xl);
  display: flex;
  height: 370px;
  justify-content: center;
--- a/apps/scandic-web/components/Blocks/DynamicContent/JobylonFeed/JobylonCard/jobylonCard.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/JobylonFeed/JobylonCard/jobylonCard.module.css
@@ -4,7 +4,7 @@
  padding: var(--Spacing-x2);
  background-color: var(--Base-Surface-Primary-light-Normal);
  border: 1px solid var(--Base-Border-Subtle);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
 }

 .contentWrapper {
--- a/apps/scandic-web/components/Blocks/DynamicContent/LoyaltyLevels/loyaltyLevels.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/LoyaltyLevels/loyaltyLevels.module.css
@@ -9,7 +9,7 @@

 .card {
  background-color: var(--Scandic-Brand-Pale-Peach);
-  border-radius: var(--Corner-radius-xLarge);
+  border-radius: var(--Corner-radius-xl);
  display: grid;
  gap: var(--Spacing-x2);
  min-height: 280px;
--- a/apps/scandic-web/components/Blocks/DynamicContent/Overview/Friend/Hero/hero.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Overview/Friend/Hero/hero.module.css
@@ -1,5 +1,5 @@
 .hero {
-  border-radius: var(--Corner-radius-xLarge);
+  border-radius: var(--Corner-radius-xl);
  display: grid;
  gap: var(--Spacing-x2);
  grid-template-columns: 1fr;
--- a/apps/scandic-web/components/Blocks/DynamicContent/Overview/Friend/MembershipNumber/membershipNumber.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Overview/Friend/MembershipNumber/membershipNumber.module.css
@@ -1,7 +1,7 @@
 .membershipContainer {
  align-items: center;
  background: var(--Scandic-Brand-Burgundy);
-  border-radius: var(--Corner-radius-Small);
+  border-radius: var(--Corner-radius-sm);
  display: grid;
  grid-template-columns: 1fr;
  justify-items: center;
--- a/apps/scandic-web/components/Blocks/DynamicContent/Overview/Friend/friend.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Overview/Friend/friend.module.css
@@ -33,7 +33,7 @@
 .membershipContainer {
  align-items: center;
  background: var(--Scandic-Brand-Burgundy);
-  border-radius: var(--Corner-radius-Small);
+  border-radius: var(--Corner-radius-sm);
  display: grid;
  grid-template-columns: 1fr;
  justify-items: center;
--- a/apps/scandic-web/components/Blocks/DynamicContent/OverviewTable/LargeTable/largeTable.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/OverviewTable/LargeTable/largeTable.module.css
@@ -2,7 +2,7 @@
  border: none;
  border-collapse: collapse;
  background-color: var(--UI-Opacity-White-100);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  color: var(--UI-Grey-100);
 }

--- a/apps/scandic-web/components/Blocks/DynamicContent/OverviewTable/LevelSummary/levelSummary.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/OverviewTable/LevelSummary/levelSummary.module.css
@@ -7,7 +7,7 @@
 }

 .levelRequirements {
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  background-color: var(--Scandic-Brand-Pale-Peach);
  color: var(--Scandic-Peach-80);
  padding: var(--Spacing-x-half) var(--Spacing-x1);
--- a/apps/scandic-web/components/Blocks/DynamicContent/OverviewTable/overviewTable.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/OverviewTable/overviewTable.module.css
@@ -11,7 +11,7 @@
  display: none;
  position: relative;
  background-color: var(--UI-Opacity-White-100);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
 }

 .mobileColumns {
@@ -48,7 +48,7 @@

 .columnHeader:nth-child(2) {
  padding-left: var(--Spacing-x1);
-  border-top-left-radius: var(--Corner-radius-Medium);
+  border-top-left-radius: var(--Corner-radius-md);
 }

 .columnHeader:nth-child(2):has(+ .columnHeader) {
@@ -76,7 +76,7 @@
    grid-template-columns: 1fr 1fr 1fr;
  }
  .columnHeader:nth-child(2) {
-    border-top-right-radius: var(--Corner-radius-Medium);
+    border-top-right-radius: var(--Corner-radius-md);
  }

  .columns {
--- a/apps/scandic-web/components/Blocks/DynamicContent/Points/EarnAndBurn/JourneyTable/ClientTable/clientTable.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Points/EarnAndBurn/JourneyTable/ClientTable/clientTable.module.css
@@ -1,6 +1,6 @@
 .container {
  overflow-x: auto;
-  border-radius: var(--Corner-radius-Small);
+  border-radius: var(--Corner-radius-sm);
 }

 .placeholder {
@@ -13,6 +13,6 @@

@media screen and (min-width: 768px) {
  .container {
-    border-radius: var(--Corner-radius-Large);
+    border-radius: var(--Corner-radius-lg);
  }
 }
--- a/apps/scandic-web/components/Blocks/DynamicContent/Points/ExpiringPoints/ExpiringPointsTable/expiringPointsTable.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Points/ExpiringPoints/ExpiringPointsTable/expiringPointsTable.module.css
@@ -2,11 +2,11 @@
  display: flex;
  flex-direction: column;
  overflow-x: auto;
-  border-radius: var(--Corner-radius-Small);
+  border-radius: var(--Corner-radius-sm);
 }

@media screen and (min-width: 768px) {
  .container {
-    border-radius: var(--Corner-radius-Large);
+    border-radius: var(--Corner-radius-lg);
  }
 }
--- a/apps/scandic-web/components/Blocks/DynamicContent/Rewards/CurrentRewards/current.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Rewards/CurrentRewards/current.module.css
@@ -9,7 +9,7 @@
 .card {
  background-color: var(--UI-Opacity-White-100);
  border: 1px solid var(--Base-Border-Subtle);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
--- a/apps/scandic-web/components/Blocks/DynamicContent/Rewards/NextLevel/next.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Rewards/NextLevel/next.module.css
@@ -1,7 +1,7 @@
 .card {
  align-items: center;
  background-color: var(--Scandic-Brand-Burgundy);
-  border-radius: var(--Corner-radius-Small);
+  border-radius: var(--Corner-radius-sm);
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-x2);
--- a/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/redeem.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/redeem.module.css
@@ -36,7 +36,7 @@

 .modal {
  background-color: var(--Base-Surface-Primary-light-Normal);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  box-shadow: var(--modal-box-shadow);
  width: 100%;
  max-height: 90vh;
@@ -119,7 +119,7 @@
 }

 .rewardBadge {
-  border-radius: var(--Corner-radius-Small);
+  border-radius: var(--Corner-radius-sm);
  padding: var(--Spacing-x1) var(--Spacing-x-one-and-half);
  background: var(--Base-Surface-Secondary-light-Normal);
  display: grid;
--- a/apps/scandic-web/components/Blocks/DynamicContent/SAS/LinkedAccounts/linkedAccounts.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/SAS/LinkedAccounts/linkedAccounts.module.css
@@ -44,7 +44,7 @@
  width: 100%;
  background-color: var(--Surface-Primary-On-Surface-Default);
  border: 1px solid var(--Border-Default);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  box-shadow:
    0px 0px 4px 2px rgba(0, 0, 0, 0.1),
    0px 4px 4px 0px rgba(255, 255, 255, 0.29) inset;
@@ -78,7 +78,7 @@
  width: 100%;
  justify-content: space-between;
  border: 1px solid var(--Border-Divider-Accent);
-  border-radius: var(--Corner-radius-Small);
+  border-radius: var(--Corner-radius-sm);
  padding: var(--Spacing-x2);
  background:
    linear-gradient(
--- a/apps/scandic-web/components/Blocks/DynamicContent/SAS/TransferPoints/transferPoints.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/SAS/TransferPoints/transferPoints.module.css
@@ -13,7 +13,7 @@
  gap: var(--Spacing-x3);
  padding: var(--Spacing-x3) var(--Spacing-x9);
  background-color: var(--Background-Secondary);
-  border-radius: var(--Corner-radius-Large);
+  border-radius: var(--Corner-radius-lg);
  box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, 0.1);
  margin-top: var(--Spacing-x9);
 }
@@ -100,7 +100,7 @@
      display: block;
      position: absolute;
      background-color: var(--Border-Divider-Accent);
-      border-radius: var(--Corner-radius-Small);
+      border-radius: var(--Corner-radius-sm);
      opacity: 0.3;
      transition: background-color 300ms ease;
    }
@@ -112,7 +112,7 @@
    position: relative;
    top: 50%;
    transform: translateY(-50%);
-    border-radius: var(--Corner-radius-Small);
+    border-radius: var(--Corner-radius-sm);
  }

  .sliderOutput {
@@ -123,7 +123,7 @@
    background-color: var(--Surface-Brand-Primary-1-OnSurface-Default);
    color: var(--Text-Brand-OnPrimary-2-Accent);
    padding: var(--Spacing-x-half) var(--Spacing-x1);
-    border-radius: var(--Corner-radius-Small);
+    border-radius: var(--Corner-radius-sm);
    opacity: 0;
    transition:
      opacity 0.15s,
@@ -226,7 +226,7 @@
 }

 .pointsOutput {
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  background-color: var(--Surface-Primary-Disabled);
  height: 100%;
  color: var(--Text-Tertiary);
--- a/apps/scandic-web/components/Blocks/DynamicContent/Stays/Previous/EmptyPreviousStays/emptyPreviousStays.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Stays/Previous/EmptyPreviousStays/emptyPreviousStays.module.css
@@ -4,7 +4,7 @@
  justify-content: center;
  align-items: center;
  background-color: var(--Scandic-Brand-Pale-Peach);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  margin-bottom: var(--Spacing-x-half);
  height: 200px;
 }
--- a/apps/scandic-web/components/Blocks/DynamicContent/Stays/Soonest/EmptyUpcomingStays/emptyUpcomingStays.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Stays/Soonest/EmptyUpcomingStays/emptyUpcomingStays.module.css
@@ -2,7 +2,7 @@
  display: grid;
  grid-template-rows: 1fr min(50px);
  background-color: var(--Base-Surface-Primary-light-Normal);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  min-height: 250px;
  margin-bottom: var(--Spacing-x-half);
  overflow: hidden;
--- a/apps/scandic-web/components/Blocks/DynamicContent/Stays/StayCard/stay.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Stays/StayCard/stay.module.css
@@ -1,6 +1,6 @@
 .link {
  outline: 1px solid var(--Base-Border-Subtle);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  overflow: hidden;
  position: relative;

--- a/apps/scandic-web/components/Blocks/DynamicContent/Stays/Upcoming/EmptyUpcomingStays/emptyUpcomingStays.module.css
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Stays/Upcoming/EmptyUpcomingStays/emptyUpcomingStays.module.css
@@ -2,7 +2,7 @@
  display: grid;
  grid-template-rows: 1fr min(50px);
  background-color: var(--Base-Surface-Primary-light-Normal);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  min-height: 250px;
  margin-bottom: var(--Spacing-x-half);
  overflow: hidden;
--- a/apps/scandic-web/components/Blocks/HotelListing/HotelListingItem/hotelListingItem.module.css
+++ b/apps/scandic-web/components/Blocks/HotelListing/HotelListingItem/hotelListingItem.module.css
@@ -1,7 +1,7 @@
 .container {
  background-color: var(--Base-Surface-Primary-light-Normal);
  border: 1px solid var(--Base-Border-Subtle);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  overflow: hidden;
 }

--- a/apps/scandic-web/components/Blocks/JoinScandicFriends/joinScandicFriends.module.css
+++ b/apps/scandic-web/components/Blocks/JoinScandicFriends/joinScandicFriends.module.css
@@ -1,5 +1,5 @@
 .container {
-  border-radius: var(--Corner-radius-Large);
+  border-radius: var(--Corner-radius-lg);
  background-color: var(--Main-Brand-WarmWhite);
  padding: 0 var(--Spacing-x2);
  display: flex;
--- a/apps/scandic-web/components/Blocks/ShortcutsList/ShortcutsListItems/shortcutsListItems.module.css
+++ b/apps/scandic-web/components/Blocks/ShortcutsList/ShortcutsListItems/shortcutsListItems.module.css
@@ -1,6 +1,6 @@
 .list {
  height: fit-content;
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  overflow: hidden;
  list-style: none;
 }
--- a/apps/scandic-web/components/Blocks/ShortcutsList/shortcutsList.module.css
+++ b/apps/scandic-web/components/Blocks/ShortcutsList/shortcutsList.module.css
@@ -1,6 +1,6 @@
@media screen and (max-width: 1366px) {
  .section {
-    border-radius: var(--Corner-radius-Medium);
+    border-radius: var(--Corner-radius-md);
    overflow: hidden;
  }
  .column {
--- a/apps/scandic-web/components/Blocks/Table/table.module.css
+++ b/apps/scandic-web/components/Blocks/Table/table.module.css
@@ -1,6 +1,6 @@
 .tableWrapper {
  display: grid;
  border: 1px solid var(--Base-Border-Subtle);
-  border-radius: var(--Corner-radius-Small);
+  border-radius: var(--Corner-radius-sm);
  overflow: hidden;
 }
--- a/apps/scandic-web/components/BookingWidget/bookingWidget.module.css
+++ b/apps/scandic-web/components/BookingWidget/bookingWidget.module.css
@@ -20,13 +20,13 @@

 .compact {
  .formContainer {
-    border-radius: var(--Corner-radius-Large);
+    border-radius: var(--Corner-radius-lg);
  }
 }

@media screen and (max-width: 767px) {
  .formContainer {
-    border-radius: var(--Corner-radius-Large) var(--Corner-radius-Large) 0 0;
+    border-radius: var(--Corner-radius-lg) var(--Corner-radius-lg) 0 0;
  }
 }

--- a/apps/scandic-web/components/Carousel/carousel.module.css
+++ b/apps/scandic-web/components/Carousel/carousel.module.css
@@ -51,7 +51,7 @@
 .dot {
  height: 8px;
  width: 8px;
-  border-radius: var(--Corner-radius-Large);
+  border-radius: var(--Corner-radius-lg);
  background: var(--UI-Grey-40);
  transition: width 0.3s ease;
 }
--- a/apps/scandic-web/components/ContentCard/contentCard.module.css
+++ b/apps/scandic-web/components/ContentCard/contentCard.module.css
@@ -5,13 +5,13 @@
 .imageContainer {
  position: relative;
  aspect-ratio: 16/9;
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  overflow: hidden;
  transition: border-radius 0.3s ease-in-out;
 }

 .image {
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  transition:
    transform 0.3s ease-in-out,
    border-radius 0.3s ease-in-out;
@@ -20,7 +20,7 @@
 .card:hover,
 .card:hover .imageContainer,
 .card:hover .image {
-  border-radius: var(--Corner-radius-Large);
+  border-radius: var(--Corner-radius-lg);
 }

 .card:hover .image {
--- a/apps/scandic-web/components/ContentType/DestinationPage/CityListing/CityListingItem/cityListingItem.module.css
+++ b/apps/scandic-web/components/ContentType/DestinationPage/CityListing/CityListingItem/cityListingItem.module.css
@@ -1,7 +1,7 @@
 .container {
  background-color: var(--Base-Surface-Primary-light-Normal);
  border: 1px solid var(--Base-Border-Subtle);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  overflow: hidden;
 }

--- a/apps/scandic-web/components/ContentType/DestinationPage/DestinationCityPage/CityMap/HotelListItem/hotelListItem.module.css
+++ b/apps/scandic-web/components/ContentType/DestinationPage/DestinationCityPage/CityMap/HotelListItem/hotelListItem.module.css
@@ -2,7 +2,7 @@
  display: grid;
  background-color: var(--Base-Surface-Primary-light-Normal);
  border: 1px solid var(--Base-Border-Subtle);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  overflow: hidden;
 }

@@ -33,7 +33,7 @@
  gap: var(--Spacing-x-half);
  background-color: var(--Base-Surface-Primary-light-Normal);
  padding: var(--Spacing-x-quarter) var(--Spacing-x1);
-  border-radius: var(--Corner-radius-Small);
+  border-radius: var(--Corner-radius-sm);
  color: var(--Text-Interactive-Default);
 }

--- a/apps/scandic-web/components/ContentType/DestinationPage/DestinationCountryPage/CountryMap/CityListItem/cityListItem.module.css
+++ b/apps/scandic-web/components/ContentType/DestinationPage/DestinationCountryPage/CountryMap/CityListItem/cityListItem.module.css
@@ -2,7 +2,7 @@
  display: grid;
  background-color: var(--Base-Surface-Primary-light-Normal);
  border: 1px solid var(--Base-Border-Subtle);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  overflow: hidden;
 }

--- a/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/HotelsSection/DestinationsList/destinationsList.module.css
+++ b/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/HotelsSection/DestinationsList/destinationsList.module.css
@@ -2,7 +2,7 @@
  display: flex;
  flex-direction: column;
  background-color: var(--Base-Surface-Primary-light-Normal);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
 }

 .accordion {
--- a/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/JumpTo/jumpTo.module.css
+++ b/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/JumpTo/jumpTo.module.css
@@ -4,7 +4,7 @@
  align-items: center;
  margin: 0 auto;
  width: 100%;
-  border-radius: var(--Corner-radius-Rounded);
+  border-radius: var(--Corner-radius-rounded);
  border: 1px solid var(--Border-Default);
  background: var(--Surface-Primary-Default);
  padding: var(--Space-x15) var(--Space-x15) var(--Space-x15) var(--Space-x3);
--- a/apps/scandic-web/components/ContentType/DestinationPage/HotelListing/HotelListingItem/hotelListingItem.module.css
+++ b/apps/scandic-web/components/ContentType/DestinationPage/HotelListing/HotelListingItem/hotelListingItem.module.css
@@ -1,7 +1,7 @@
 .container {
  background-color: var(--Base-Surface-Primary-light-Normal);
  border: 1px solid var(--Base-Border-Subtle);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  overflow: hidden;
 }

@@ -27,7 +27,7 @@
  gap: var(--Spacing-x-half);
  background-color: var(--Base-Surface-Primary-light-Normal);
  padding: var(--Spacing-x-quarter) var(--Spacing-x1);
-  border-radius: var(--Corner-radius-Small);
+  border-radius: var(--Corner-radius-sm);
  color: var(--Text-Interactive-Default);
 }

--- a/apps/scandic-web/components/ContentType/DestinationPage/HotelMapCard/DialogImage/dialogImage.module.css
+++ b/apps/scandic-web/components/ContentType/DestinationPage/HotelMapCard/DialogImage/dialogImage.module.css
@@ -18,7 +18,7 @@
 .imageContainer {
  position: relative;
  min-width: 177px;
-  border-radius: var(--Corner-radius-Medium) 0 0 var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md) 0 0 var(--Corner-radius-md);
  overflow: hidden;
 }

@@ -30,7 +30,7 @@
  position: absolute;
  left: 7px;
  top: 7px;
-  border-radius: var(--Corner-radius-Small);
+  border-radius: var(--Corner-radius-sm);
 }

@media screen and (max-width: 500px) {
--- a/apps/scandic-web/components/ContentType/DestinationPage/HotelMapCard/hotelMapCard.module.css
+++ b/apps/scandic-web/components/ContentType/DestinationPage/HotelMapCard/hotelMapCard.module.css
@@ -1,7 +1,7 @@
 .wrapper {
  background: var(--Base-Surface-Primary-light-Normal);
  border: 1px solid var(--Base-Border-Subtle);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  box-shadow: 0px 0px 8px 3px rgba(0, 0, 0, 0.1);
  flex-direction: row;
  display: flex;
--- a/apps/scandic-web/components/ContentType/DestinationPage/Map/MapContent/ClusterMarker/clusterMarker.module.css
+++ b/apps/scandic-web/components/ContentType/DestinationPage/Map/MapContent/ClusterMarker/clusterMarker.module.css
@@ -7,7 +7,7 @@
  background-color: var(--Base-Text-High-contrast);
  border: 4px solid var(--Base-Surface-Primary-light-Normal);
  color: var(--Base-Text-Inverted);
-  border-radius: var(--Corner-radius-Rounded);
+  border-radius: var(--Corner-radius-rounded);
  box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.1);
  cursor: pointer;
  transition: all 0.3s;
--- a/apps/scandic-web/components/ContentType/DestinationPage/StaticMap/staticMap.module.css
+++ b/apps/scandic-web/components/ContentType/DestinationPage/StaticMap/staticMap.module.css
@@ -8,7 +8,7 @@
 }

 .mapWrapper img {
-  border-radius: var(--Corner-radius-Large);
+  border-radius: var(--Corner-radius-lg);
  overflow: hidden;
 }

--- a/apps/scandic-web/components/ContentType/DestinationPage/TopImages/topImages.module.css
+++ b/apps/scandic-web/components/ContentType/DestinationPage/TopImages/topImages.module.css
@@ -11,7 +11,7 @@
  height: 200px;
  max-height: 40dvh;
  width: 100%;
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
 }

 .image.clickable {
--- a/apps/scandic-web/components/ContentType/HotelMapPage/Sidebar/sidebar.module.css
+++ b/apps/scandic-web/components/ContentType/HotelMapPage/Sidebar/sidebar.module.css
@@ -41,7 +41,7 @@
  color: var(--Text-Default);
  width: 100%;
  padding: var(--Space-x05) var(--Space-x1);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  cursor: pointer;
  text-align: left;
  transition: background-color 0.3s;
@@ -69,7 +69,7 @@
    transition:
      bottom 0.3s,
      top 0.3s;
-    border-radius: var(--Corner-radius-Large) var(--Corner-radius-Large) 0 0;
+    border-radius: var(--Corner-radius-lg) var(--Corner-radius-lg) 0 0;
  }

  .sidebar.fullscreen + .backdrop {
--- a/apps/scandic-web/components/ContentType/HotelPage/AmenitiesList/amenitiesList.module.css
+++ b/apps/scandic-web/components/ContentType/HotelPage/AmenitiesList/amenitiesList.module.css
@@ -1,6 +1,6 @@
 .amenitiesContainer {
  background-color: var(--Base-Surface-Subtle-Normal);
-  border-radius: var(--Corner-radius-Large);
+  border-radius: var(--Corner-radius-lg);
  padding: var(--Spacing-x3) var(--Spacing-x3) var(--Spacing-x-one-and-half)
    var(--Spacing-x3);
  display: grid;
--- a/apps/scandic-web/components/ContentType/HotelPage/Map/MapCard/mapCard.module.css
+++ b/apps/scandic-web/components/ContentType/HotelPage/Map/MapCard/mapCard.module.css
@@ -6,8 +6,8 @@
  right: 0;
  background-color: var(--Base-Surface-Primary-light-Normal);
  padding: var(--Spacing-x2);
-  border-top-left-radius: var(--Corner-radius-Medium);
-  border-top-right-radius: var(--Corner-radius-Medium);
+  border-top-left-radius: var(--Corner-radius-md);
+  border-top-right-radius: var(--Corner-radius-md);
 }

 .poiList {
--- a/apps/scandic-web/components/ContentType/HotelPage/PreviewImages/previewImages.module.css
+++ b/apps/scandic-web/components/ContentType/HotelPage/PreviewImages/previewImages.module.css
@@ -13,7 +13,7 @@
  border-width: 0;
  background-color: transparent;
  cursor: pointer;
-  border-radius: var(--Corner-radius-Small);
+  border-radius: var(--Corner-radius-sm);
  overflow: hidden;
 }

--- a/apps/scandic-web/components/ContentType/HotelPage/Rooms/RoomCard/roomCard.module.css
+++ b/apps/scandic-web/components/ContentType/HotelPage/Rooms/RoomCard/roomCard.module.css
@@ -1,5 +1,5 @@
 .roomCard {
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  background-color: var(--UI-Opacity-White-100);
  border: 1px solid var(--Base-Border-Subtle);
  display: grid;
--- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/MeetingsAndConferences/meetingsAndConferences.module.css
+++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/MeetingsAndConferences/meetingsAndConferences.module.css
@@ -10,7 +10,7 @@
  width: 100%;
  height: 300px;
  object-fit: cover;
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
 }

 .secondaryImage {
--- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/RestaurantBar/RestaurantBarItem/restaurantBarItem.module.css
+++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/RestaurantBar/RestaurantBarItem/restaurantBarItem.module.css
@@ -26,7 +26,7 @@
 }

 .image {
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  overflow: hidden;
  width: 100%;
  object-fit: cover;
--- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Room/room.module.css
+++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Room/room.module.css
@@ -22,7 +22,7 @@

 .imageContainer {
  position: relative;
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  overflow: hidden;
 }

--- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/WellnessAndExercise/Facility/facility.module.css
+++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/WellnessAndExercise/Facility/facility.module.css
@@ -8,7 +8,7 @@
  width: 100%;
  height: 270px;
  object-fit: cover;
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
 }

 .information {
--- a/apps/scandic-web/components/ContentType/StartPage/InfoCard/infoCard.module.css
+++ b/apps/scandic-web/components/ContentType/StartPage/InfoCard/infoCard.module.css
@@ -8,7 +8,7 @@
  overflow: hidden;
  width: 100%;
  height: 179px; /* Exact mobile height from Figma */
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
 }

 .imageContainer {
--- a/apps/scandic-web/components/DatePicker/date-picker.module.css
+++ b/apps/scandic-web/components/DatePicker/date-picker.module.css
@@ -45,20 +45,20 @@
  }

  .container[data-isopen="true"] .hideWrapper {
-    border-radius: var(--Corner-radius-Large) var(--Corner-radius-Large) 0 0;
+    border-radius: var(--Corner-radius-lg) var(--Corner-radius-lg) 0 0;
    top: 20px;
  }
 }

@media screen and (min-width: 1367px) {
  .hideWrapper {
-    border-radius: var(--Corner-radius-Large);
+    border-radius: var(--Corner-radius-lg);
    box-shadow: var(--popup-box-shadow);
    padding: var(--Spacing-x2) var(--Spacing-x3);
    position: absolute;
-    /** 
-      BookingWidget padding + 
-      border-width + 
+    /**
+      BookingWidget padding +
+      border-width +
      wanted space below booking widget
     */
    top: calc(100% + var(--Spacing-x1) + 1px + var(--Spacing-x4));
--- a/apps/scandic-web/components/DeprecatedJsonToHtml/jsontohtml.module.css
+++ b/apps/scandic-web/components/DeprecatedJsonToHtml/jsontohtml.module.css
@@ -3,7 +3,7 @@
  width: 100%;
  height: 365px;
  object-fit: cover;
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  margin: var(--Spacing-x1) var(--Spacing-x0);
 }

--- a/apps/scandic-web/components/DestinationFilterAndSort/Filter/Checkbox/checkbox.module.css
+++ b/apps/scandic-web/components/DestinationFilterAndSort/Filter/Checkbox/checkbox.module.css
@@ -4,7 +4,7 @@
  gap: var(--Spacing-x-one-and-half);
  padding: var(--Spacing-x1) var(--Spacing-x-one-and-half);
  cursor: pointer;
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  transition: background-color 0.3s;
 }

@@ -17,7 +17,7 @@
  height: 24px;
  min-width: 24px;
  border: 1px solid var(--UI-Input-Controls-Border-Normal);
-  border-radius: var(--Corner-radius-Small);
+  border-radius: var(--Corner-radius-sm);
  transition: all 0.3s;
  display: flex;
  align-items: center;
--- a/apps/scandic-web/components/DestinationFilterAndSort/destinationFilterAndSort.module.css
+++ b/apps/scandic-web/components/DestinationFilterAndSort/destinationFilterAndSort.module.css
@@ -11,7 +11,7 @@

 .dialog {
  width: min(80dvw, 960px);
-  border-radius: var(--Corner-radius-Large);
+  border-radius: var(--Corner-radius-lg);
  background-color: var(--Base-Surface-Primary-light-Normal);
  box-shadow: 0px 4px 24px 0px rgba(38, 32, 30, 0.08);
  overflow: hidden;
@@ -33,7 +33,7 @@

 .badge {
  background-color: var(--Base-Text-Accent);
-  border-radius: var(--Corner-radius-xLarge);
+  border-radius: var(--Corner-radius-xl);
  width: 20px;
  height: 20px;
  color: var(--Base-Surface-Primary-light-Normal);
--- a/apps/scandic-web/components/Dialog/dialog.module.css
+++ b/apps/scandic-web/components/Dialog/dialog.module.css
@@ -35,7 +35,7 @@

 .modal {
  background-color: var(--Base-Surface-Primary-light-Normal);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  box-shadow: var(--modal-box-shadow);
  display: flex;
  flex-direction: column;
--- a/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/booking-code.module.css
+++ b/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/booking-code.module.css
@@ -7,7 +7,7 @@
 .bookingCode {
  height: 60px;
  background-color: var(--Base-Background-Primary-Normal);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  padding: var(--Spacing-x1) var(--Spacing-x-one-and-half);
 }

@@ -101,7 +101,7 @@
  .container:focus-within,
  .container:has([data-focused="true"], [data-pressed="true"]) {
    background-color: var(--Base-Surface-Primary-light-Hover-alt);
-    border-radius: var(--Corner-radius-Medium);
+    border-radius: var(--Corner-radius-md);
  }

  .bookingCodeRememberVisible {
--- a/apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/SearchList/ClearSearchButton/button.module.css
+++ b/apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/SearchList/ClearSearchButton/button.module.css
@@ -1,7 +1,7 @@
 .button {
  align-items: center;
  border: none;
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  cursor: pointer;
  display: flex;
  gap: var(--Spacing-x-half);
--- a/apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/SearchList/Dialog/dialog.module.css
+++ b/apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/SearchList/Dialog/dialog.module.css
@@ -1,6 +1,6 @@
 .dialog {
  background-color: var(--Base-Surface-Primary-light-Normal);
-  border-radius: var(--Corner-radius-Large);
+  border-radius: var(--Corner-radius-lg);

  display: flex;
  flex-direction: column;
@@ -31,10 +31,10 @@
  .dialog {
    position: absolute;
    width: 360px;
-    /** 
-   * var(--Spacing-x4) to account for padding inside 
+    /**
+   * var(--Spacing-x4) to account for padding inside
   * the bookingwidget and to add the padding for the
-   * box itself 
+   * box itself
   */
    top: calc(100% + var(--Spacing-x4));
    z-index: 99;
--- a/apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/SearchList/List/ListItem/listItem.module.css
+++ b/apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/SearchList/List/ListItem/listItem.module.css
@@ -1,5 +1,5 @@
 .listItem {
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  cursor: pointer;
  padding: var(--Spacing-x1);
 }
--- a/apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/search.module.css
+++ b/apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/search.module.css
@@ -2,7 +2,7 @@
  border-color: transparent;
  border-style: solid;
  border-width: 1px;
-  border-radius: var(--Corner-radius-Small);
+  border-radius: var(--Corner-radius-sm);
  padding: var(--Spacing-x1) var(--Spacing-x-one-and-half);
  position: relative;
  height: 60px;
@@ -11,7 +11,7 @@
    background-color: var(--Base-Surface-Primary-light-Normal);
    padding: var(--Space-x15) var(--Space-x15) var(--Space-x15) var(--Space-x3);
    border: 1px solid var(--Border-Intense);
-    border-radius: var(--Corner-radius-Rounded);
+    border-radius: var(--Corner-radius-rounded);
    height: auto;
  }

--- a/apps/scandic-web/components/Forms/BookingWidget/FormContent/formContent.module.css
+++ b/apps/scandic-web/components/Forms/BookingWidget/FormContent/formContent.module.css
@@ -41,7 +41,7 @@
  .when,
  .where {
    background-color: var(--Base-Background-Primary-Normal);
-    border-radius: var(--Corner-radius-Medium);
+    border-radius: var(--Corner-radius-md);
  }

  .rooms,
@@ -97,7 +97,7 @@
  .rooms,
  .when {
    padding: var(--Spacing-x1) var(--Spacing-x-one-and-half);
-    border-radius: var(--Corner-radius-Small);
+    border-radius: var(--Corner-radius-sm);
  }

  .when:hover,
--- a/apps/scandic-web/components/Forms/BookingWidget/form.module.css
+++ b/apps/scandic-web/components/Forms/BookingWidget/form.module.css
@@ -22,7 +22,7 @@

@media screen and (min-width: 768px) {
  .default {
-    border-radius: var(--Corner-radius-Medium);
+    border-radius: var(--Corner-radius-md);
  }
 }

--- a/apps/scandic-web/components/GuestsRoomsPicker/guests-rooms-picker.module.css
+++ b/apps/scandic-web/components/GuestsRoomsPicker/guests-rooms-picker.module.css
@@ -6,7 +6,7 @@
  --header-height: 72px;
  --sticky-button-height: 140px;
  background-color: var(--Main-Grey-White);
-  border-radius: var(--Corner-radius-Large) var(--Corner-radius-Large) 0 0;
+  border-radius: var(--Corner-radius-lg) var(--Corner-radius-lg) 0 0;
  bottom: 0;
  left: 0;
  position: fixed;
@@ -130,7 +130,7 @@
    padding: var(--Spacing-x1) var(--Spacing-x2);
    background-color: var(--Base-Background-Primary-Normal);
    margin: 0 var(--Spacing-x2);
-    border-radius: var(--Corner-radius-Medium);
+    border-radius: var(--Corner-radius-md);
    display: flex;
    gap: var(--Spacing-x1);
  }
@@ -176,7 +176,7 @@

    background-color: var(--Main-Grey-White);
    display: grid;
-    border-radius: var(--Corner-radius-Large);
+    border-radius: var(--Corner-radius-lg);
    box-shadow: var(--popup-box-shadow);
    max-width: calc(100vw - 20px);
    padding: var(--Spacing-x2) var(--Spacing-x3);
--- a/apps/scandic-web/components/Header/MainMenu/Avatar/avatar.module.css
+++ b/apps/scandic-web/components/Header/MainMenu/Avatar/avatar.module.css
@@ -3,7 +3,7 @@
  justify-content: center;
  align-items: center;
  overflow: hidden;
-  border-radius: var(--Corner-radius-Rounded);
+  border-radius: var(--Corner-radius-rounded);
  width: 2rem;
  height: 2rem;
  background-color: var(--UI-Grey-40);
--- a/apps/scandic-web/components/Header/MainMenu/MyPagesMenu/myPagesMenu.module.css
+++ b/apps/scandic-web/components/Header/MainMenu/MyPagesMenu/myPagesMenu.module.css
@@ -22,7 +22,7 @@
    ); /* 3.5rem is the height of the main menu + bottom padding. */
    right: 0;
    background-color: var(--Base-Surface-Primary-light-Normal);
-    border-radius: var(--Corner-radius-Large);
+    border-radius: var(--Corner-radius-lg);
    box-shadow: 0 0 0.875rem 0.375rem rgba(0, 0, 0, 0.1);
    min-width: 20rem;
    z-index: var(--menu-overlay-z-index);
--- a/apps/scandic-web/components/Header/MainMenu/NavigationMenu/NavigationMenuItem/navigationMenuItem.module.css
+++ b/apps/scandic-web/components/Header/MainMenu/NavigationMenu/NavigationMenuItem/navigationMenuItem.module.css
@@ -49,7 +49,7 @@
    ); /* 3.5rem is the height of the main menu + bottom padding. */
    left: 50%;
    transform: translateX(-50%);
-    border-radius: var(--Corner-radius-Large);
+    border-radius: var(--Corner-radius-lg);
    box-shadow: var(--popup-box-shadow);
  }
  .dropdown.isExpanded {
--- a/apps/scandic-web/components/Hero/hero.module.css
+++ b/apps/scandic-web/components/Hero/hero.module.css
@@ -3,7 +3,7 @@
  margin-bottom: var(--Spacing-x2);
  width: 100%;
  object-fit: cover;
-  border-radius: var(--Corner-radius-xLarge);
+  border-radius: var(--Corner-radius-xl);
  margin: 0;
 }

--- a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Header/header.module.css
+++ b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Header/header.module.css
@@ -18,7 +18,7 @@
 }

 .actions {
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  display: grid;
  grid-area: actions;
  justify-content: flex-start;
--- a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/LinkedReservation/linkedReservationCardSkeleton.module.css
+++ b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/LinkedReservation/linkedReservationCardSkeleton.module.css
@@ -6,7 +6,7 @@

 .content {
  background-color: var(--Base-Background-Primary-Normal);
-  border-radius: var(--Corner-radius-Large);
+  border-radius: var(--Corner-radius-lg);
  display: grid;
  gap: var(--Spacing-x2);
  padding: var(--Spacing-x2) var(--Spacing-x2) var(--Spacing-x3)
@@ -14,7 +14,7 @@
 }

 .img {
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  overflow: hidden;
 }

--- a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/LinkedReservation/retry.module.css
+++ b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/LinkedReservation/retry.module.css
@@ -1,6 +1,6 @@
 .retry {
  background-color: var(--Base-Background-Primary-Normal);
-  border-radius: var(--Corner-radius-Large);
+  border-radius: var(--Corner-radius-lg);
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-x2);
--- a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/Room/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/Room/index.tsx
@@ -106,7 +106,7 @@ export default function Room({
          focalPoint={{ x: 50, y: 50 }}
          height={204}
          src={img.imageSizes.medium}
-          style={{ borderRadius: "var(--Corner-radius-Medium)" }}
+          style={{ borderRadius: "var(--Corner-radius-md)" }}
          title={img.metaData.title}
          width={204}
        />
--- a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/Room/room.module.css
+++ b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/Room/room.module.css
@@ -13,7 +13,7 @@
 .benefits {
  align-items: center;
  border: 1px solid var(--Base-Border-Subtle);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  display: flex;
  gap: var(--Spacing-x1);
  padding: var(--Spacing-x1) var(--Spacing-x-one-and-half);
@@ -26,7 +26,7 @@

 .booking {
  background-color: var(--Base-Background-Primary-Normal);
-  border-radius: var(--Corner-radius-Large);
+  border-radius: var(--Corner-radius-lg);
  display: grid;
  gap: var(--Spacing-x2);
  padding: var(--Spacing-x2) var(--Spacing-x2) var(--Spacing-x3)
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/Confirm/confirm.module.css
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/Confirm/confirm.module.css
@@ -16,7 +16,7 @@
  flex-direction: column;
  gap: var(--Spacing-x-one-and-half);
  background-color: var(--Base-Surface-Primary-light-Normal);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  padding: var(--Spacing-x-one-and-half) var(--Spacing-x2);
  width: min(512px, 100%);
 }
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/Details/Multiroom/JoinScandicFriendsCard/joinScandicFriendsCard.module.css
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/Details/Multiroom/JoinScandicFriendsCard/joinScandicFriendsCard.module.css
@@ -2,7 +2,7 @@
  align-self: flex-start;
  background-color: var(--Base-Surface-Primary-light-Normal);
  border: 1px solid var(--Base-Border-Subtle);
-  border-radius: var(--Corner-radius-Large);
+  border-radius: var(--Corner-radius-lg);
  display: grid;
  gap: var(--Spacing-x-one-and-half);
  padding: var(--Spacing-x-one-and-half) var(--Spacing-x2);
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/Details/RoomOne/JoinScandicFriendsCard/joinScandicFriendsCard.module.css
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/Details/RoomOne/JoinScandicFriendsCard/joinScandicFriendsCard.module.css
@@ -2,7 +2,7 @@
  align-self: flex-start;
  background-color: var(--Base-Surface-Primary-light-Normal);
  border: 1px solid var(--Base-Border-Subtle);
-  border-radius: var(--Corner-radius-Large);
+  border-radius: var(--Corner-radius-lg);
  display: grid;
  gap: var(--Spacing-x-one-and-half);
  padding: var(--Spacing-x-one-and-half) var(--Spacing-x2);
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/Payment/MixedRatePaymentBreakdown/mixedRatePaymentBreakdown.module.css
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/Payment/MixedRatePaymentBreakdown/mixedRatePaymentBreakdown.module.css
@@ -10,7 +10,7 @@
  background-color: var(--Scandic-Blue-00);
  padding: var(--Spacing-x-one-and-half);
  border: 1px solid rgba(0, 0, 0, 0.05);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
 }

 .cardTitle {
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/PriceChangeDialog/priceChangeDialog.module.css
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/PriceChangeDialog/priceChangeDialog.module.css
@@ -52,8 +52,8 @@

 .dialog {
  background-color: var(--Scandic-Brand-Pale-Peach);
-  border-top-left-radius: var(--Corner-radius-Medium);
-  border-top-right-radius: var(--Corner-radius-Medium);
+  border-top-left-radius: var(--Corner-radius-md);
+  border-top-right-radius: var(--Corner-radius-md);

  box-shadow: var(--modal-box-shadow);
  display: flex;
@@ -97,7 +97,7 @@
  }

  .dialog {
-    border-radius: var(--Corner-radius-Medium);
+    border-radius: var(--Corner-radius-md);
    padding: var(--Spacing-x6);
    width: fit-content;
  }
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/Summary/UI/ui.module.css
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/Summary/UI/ui.module.css
@@ -1,5 +1,5 @@
 .summary {
-  border-radius: var(--Corner-radius-Large);
+  border-radius: var(--Corner-radius-lg);
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-x2);
--- a/apps/scandic-web/components/HotelReservation/HotelCard/HotelCardSkeleton.module.css
+++ b/apps/scandic-web/components/HotelReservation/HotelCard/HotelCardSkeleton.module.css
@@ -3,7 +3,7 @@
  display: flex;
  flex-direction: column;
  background-color: #fff;
-  border-radius: var(--Corner-radius-Large);
+  border-radius: var(--Corner-radius-lg);
  border: 1px solid var(--Base-Border-Subtle);
  position: relative;
  height: 100%;
--- a/apps/scandic-web/components/HotelReservation/HotelCard/HotelChequeCard/hotelChequeCard.module.css
+++ b/apps/scandic-web/components/HotelReservation/HotelCard/HotelChequeCard/hotelChequeCard.module.css
@@ -1,7 +1,7 @@
 .chequeCard {
  padding: var(--Spacing-x-one-and-half);
  background-color: var(--Base-Surface-Secondary-light-Normal);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  margin: 0;
  width: 100%;
  display: grid;
--- a/apps/scandic-web/components/HotelReservation/HotelCard/HotelPriceCard/hotelPriceCard.module.css
+++ b/apps/scandic-web/components/HotelReservation/HotelCard/HotelPriceCard/hotelPriceCard.module.css
@@ -1,7 +1,7 @@
 .priceCard {
  padding: var(--Spacing-x-one-and-half);
  background-color: var(--Base-Surface-Secondary-light-Normal);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  margin: 0;
  width: 100%;
 }
--- a/apps/scandic-web/components/HotelReservation/HotelCard/HotelVoucherCard/hotelVoucherCard.module.css
+++ b/apps/scandic-web/components/HotelReservation/HotelCard/HotelVoucherCard/hotelVoucherCard.module.css
@@ -1,7 +1,7 @@
 .voucherCard {
  padding: var(--Spacing-x-one-and-half);
  background-color: var(--Base-Surface-Secondary-light-Normal);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  margin: 0;
  width: 100%;
 }
--- a/apps/scandic-web/components/HotelReservation/HotelCard/NoPriceAvailableCard/noPriceAvailable.module.css
+++ b/apps/scandic-web/components/HotelReservation/HotelCard/NoPriceAvailableCard/noPriceAvailable.module.css
@@ -1,7 +1,7 @@
 .priceCard {
  padding: var(--Spacing-x-one-and-half);
  background-color: var(--Base-Surface-Secondary-light-Normal);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  margin: 0;
  width: 100%;
 }
--- a/apps/scandic-web/components/HotelReservation/HotelCard/hotelCard.module.css
+++ b/apps/scandic-web/components/HotelReservation/HotelCard/hotelCard.module.css
@@ -3,7 +3,7 @@
  flex-direction: column;
  background-color: var(--Base-Surface-Primary-light-Normal);
  border: 1px solid var(--Base-Border-Subtle);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  width: 100%;
  overflow: hidden;
 }
@@ -94,7 +94,7 @@
 .pointsCard {
  background-color: var(--Base-Surface-Secondary-light-Normal);
  padding: var(--Spacing-x-one-and-half);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
 }

@media screen and (min-width: 768px) and (max-width: 1024px) {
--- a/apps/scandic-web/components/HotelReservation/HotelCardDialog/HotelCardDialogImage/hotelCardDialogImage.module.css
+++ b/apps/scandic-web/components/HotelReservation/HotelCardDialog/HotelCardDialogImage/hotelCardDialogImage.module.css
@@ -18,7 +18,7 @@
 .imageContainer {
  position: relative;
  min-width: 177px;
-  border-radius: var(--Corner-radius-Medium) 0 0 var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md) 0 0 var(--Corner-radius-md);
  overflow: hidden;
 }

@@ -26,7 +26,7 @@
  width: 80px;
  min-width: 80px;
  height: 90px;
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
 }

 .imageContainer img {
--- a/apps/scandic-web/components/HotelReservation/HotelCardDialog/hotelCardDialog.module.css
+++ b/apps/scandic-web/components/HotelReservation/HotelCardDialog/hotelCardDialog.module.css
@@ -9,7 +9,7 @@

 .dialogContainer {
  border: 1px solid var(--Base-Border-Subtle);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  min-width: 402px;
  background: var(--Base-Surface-Primary-light-Normal);
  box-shadow: 0px 0px 8px 3px rgba(0, 0, 0, 0.1);
@@ -98,7 +98,7 @@
 }

 .priceCard {
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  padding: var(--Spacing-x-half) var(--Spacing-x1);
  background: var(--Base-Surface-Secondary-light-Normal);
  margin-top: var(--Spacing-x1);
--- a/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/PriceDetails/priceDetails.module.css
+++ b/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/PriceDetails/priceDetails.module.css
@@ -5,7 +5,7 @@
  gap: var(--Spacing-x1);
  padding: var(--Spacing-x-one-and-half);
  background-color: var(--Base-Surface-Secondary-light-Normal);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
 }

 .totalPriceInclVAT {
--- a/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/Steps/ConfirmationStep/confirmationStep.module.css
+++ b/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/Steps/ConfirmationStep/confirmationStep.module.css
@@ -15,7 +15,7 @@
  justify-content: space-between;
  background-color: var(--Surface-Brand-Primary-2-OnSurface-Accent);
  padding: var(--Space-x1) var(--Space-x15);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
 }

 .totalPoints {
--- a/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/Steps/DeliveryDetailsStep/deliveryDetailsStep.module.css
+++ b/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/Steps/DeliveryDetailsStep/deliveryDetailsStep.module.css
@@ -5,7 +5,7 @@
  padding: var(--Space-x3);
  margin-bottom: var(--Space-x05);
  background-color: var(--Base-Background-Primary-Normal);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
 }

 .select {
--- a/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/Steps/SelectAncillaryStep/selectAncillaryStep.module.css
+++ b/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/Steps/SelectAncillaryStep/selectAncillaryStep.module.css
@@ -20,7 +20,7 @@
 }

 .chip {
-  border-radius: var(--Corner-radius-Rounded);
+  border-radius: var(--Corner-radius-rounded);
  padding: calc(var(--Space-x1) + var(--Space-x025)) var(--Space-x2);
  cursor: pointer;
  border: 1px solid var(--Border-Interactive-Default);
--- a/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/Steps/SelectQuantityStep/selectQuantityStep.module.css
+++ b/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/Steps/SelectQuantityStep/selectQuantityStep.module.css
@@ -10,7 +10,7 @@
  gap: var(--Space-x1);
  padding: var(--Space-x2) var(--Space-x3);
  background-color: var(--Surface-Primary-OnSurface-Default);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  margin-bottom: var(--Spacing-x1);
 }

@@ -27,7 +27,7 @@
  justify-content: space-between;
  background-color: var(--Surface-Brand-Primary-2-OnSurface-Accent);
  padding: var(--Space-x1) var(--Space-x15);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
 }

 .totalPoints {
--- a/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/addAncillaryFlowModal.module.css
+++ b/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/addAncillaryFlowModal.module.css
@@ -37,7 +37,7 @@
  display: flex;
  flex-direction: column;
  justify-content: space-between;
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  background: var(--Surface-Primary-OnSurface-Default);
  padding-bottom: var(--Space-x15);
  margin-top: var(--Space-x2);
--- a/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddedAncillaries/addedAncillaries.module.css
+++ b/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddedAncillaries/addedAncillaries.module.css
@@ -31,7 +31,7 @@

 .ancillaryMobile {
  background-color: var(--Base-Background-Primary-Normal);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-x1);
@@ -41,7 +41,7 @@
  display: none;
  padding: var(--Spacing-x2);
  background-color: var(--Base-Background-Primary-Normal);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  flex-direction: column;
  gap: var(--Spacing-x1);
 }
--- a/apps/scandic-web/components/HotelReservation/MyStay/BookingSummary/SummaryCard/summaryCard.module.css
+++ b/apps/scandic-web/components/HotelReservation/MyStay/BookingSummary/SummaryCard/summaryCard.module.css
@@ -8,7 +8,7 @@
 .image {
  width: 152px;
  height: 152px;
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
 }

 .content {
--- a/apps/scandic-web/components/HotelReservation/MyStay/GuestDetails/guestDetails.module.css
+++ b/apps/scandic-web/components/HotelReservation/MyStay/GuestDetails/guestDetails.module.css
@@ -4,7 +4,7 @@
  align-items: center;
  background-color: var(--Main-Brand-PalePeach);
  padding: var(--Spacing-x3) 0;
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
  gap: var(--Spacing-x2);
 }

--- a/apps/scandic-web/components/HotelReservation/MyStay/Modal/modal.module.css
+++ b/apps/scandic-web/components/HotelReservation/MyStay/Modal/modal.module.css
@@ -29,8 +29,8 @@

 .modal {
  background: var(--UI-Input-Controls-Surface-Normal);
-  border-top-left-radius: var(--Corner-radius-Large);
-  border-top-right-radius: var(--Corner-radius-Large);
+  border-top-left-radius: var(--Corner-radius-lg);
+  border-top-right-radius: var(--Corner-radius-lg);
  max-height: 95dvh;
  overflow-y: auto;
  padding: var(--Space-x3);
@@ -71,7 +71,7 @@
  }

  .modal {
-    border-radius: var(--Corner-radius-Large);
+    border-radius: var(--Corner-radius-lg);
    display: flex;
    min-height: 300px;
    min-width: 690px;
--- a/apps/scandic-web/components/HotelReservation/MyStay/ModifyContact/modifyContact.module.css
+++ b/apps/scandic-web/components/HotelReservation/MyStay/ModifyContact/modifyContact.module.css
@@ -1,7 +1,7 @@
 .container {
  background-color: var(--Base-Background-Primary-Normal);
  padding: var(--Spacing-x2) var(--Spacing-x1) var(--Spacing-x3);
-  border-radius: var(--Corner-radius-Medium);
+  border-radius: var(--Corner-radius-md);
 }

 .row {
--- a/Show More
+++ b/Show More