Merged in feat/SW-1890-New-Breakfast-Component (pull request #1666)

Feat/SW-1890 New Breakfast Component Design

* refactor(SW-1890): Replace BreakfastChoiceCard with RadioCard component and update styles

- Removed BreakfastChoiceCard component and its associated styles.
- extemded RadioCard component to additional UI.
- Updated breakfast.module.css to adjust container width.
- Added new properties for subtitleSecondary and description in RadioCard.
- Updated translations for breakfast-related messages in en.json.

* feat(SW-1890): Add hover state to RadioCard

* chore(SW1890): Update translation for breakfast cost message to clarify age range

* chore(SW-1890): Updated breakfast cost display to use formatPrice utility

* fix(SW-1890): Set fixed size for CoffeeIcon component

* fix(SW-1890): Add missing translations for breakfast-related messages

* feat(SW-1890): Introduce new breakfast icons and update Breakfast component

- Replaced CoffeeIcon with BreakfastBuffetIcon and NoBreakfastBuffetIcon in the Breakfast component.
- Added new BreakfastBuffetIcon and NoBreakfastBuffetIcon components to the design system.
- Updated imports in the Breakfast component to reflect the new icons.


Approved-by: Christian Andolf

apps/scandic-web/components/TempDesignSystem/Form/RadioCard/radioCard.module.css

@@ -3,12 +3,22 @@
   cursor: pointer;
   display: grid;
   grid-template-columns: 1fr auto;
-  grid-template-areas: "icon icon" "title subtitle";
+  grid-auto-rows: min-content;
+  grid-template-areas:
+    "icon subtitleSecondary"
+    "title subtitle";
   border-radius: var(--Corner-radius-md);
   border: 1px solid var(--Border-Intense);
   background: var(--Surface-Primary-Default);
   padding: var(--Space-x2) var(--Space-x3);
   gap: var(--Space-x1);
+  transition:
+    background 0.2s ease,
+    border-color 0.2s ease;
+}
+
+.label:hover:not(.disabled) {
+  background: var(--Surface-Primary-Hover);
 }
 
 .label.disabled {
@@ -44,12 +54,34 @@
   grid-area: icon;
 }
 
-.subtitle {
-  grid-area: subtitle;
-  color: var(--Text-Default);
-}
-
 .title {
   grid-area: title;
   color: var(--Text-Default);
 }
+
+.subtitle {
+  grid-area: subtitle;
+  color: var(--Text-Default);
+  justify-self: end;
+}
+
+.subtitleSecondary {
+  grid-area: subtitleSecondary;
+  place-self: end;
+  color: var(--Text-Default);
+}
+
+.divider {
+  grid-column: 1 / -1;
+  margin: var(--Space-x1) 0;
+}
+
+.description {
+  grid-column: 1 / -1;
+  color: var(--Text-Default);
+}
+
+.descriptionSecondary {
+  grid-column: 1 / -1;
+  color: var(--Text-Secondary);
+}