fix: unite all price details modals to one and align on ui

apps/scandic-web/components/HotelReservation/PriceDetailsModal/PriceDetailsTable/Tbody/index.tsx

@@ -0,0 +1,6 @@
+import { type TbodyProps,tbodyVariants } from "./variants"
+
+export default function Tbody({ border, children }: TbodyProps) {
+  const classNames = tbodyVariants({ border })
+  return <tbody className={classNames}>{children}</tbody>
+}

apps/scandic-web/components/HotelReservation/PriceDetailsModal/PriceDetailsTable/Tbody/tbody.module.css

@@ -0,0 +1,23 @@
+.tbody {
+  display: flex;
+  gap: var(--Spacing-x-half);
+  flex-direction: column;
+  width: 100%;
+}
+
+.tbody:has(tr > th) {
+  padding-top: var(--Spacing-x2);
+}
+
+.tbody:has(tr > th):not(:first-of-type),
+.border {
+  border-top: 1px solid var(--Primary-Light-On-Surface-Divider-subtle);
+}
+
+.tbody:not(:last-child) {
+  padding-bottom: var(--Spacing-x2);
+}
+
+.border {
+  padding-top: var(--Spacing-x2);
+}

apps/scandic-web/components/HotelReservation/PriceDetailsModal/PriceDetailsTable/Tbody/variants.ts

@@ -0,0 +1,18 @@
+import { cva, type VariantProps } from "class-variance-authority"
+
+import styles from "./tbody.module.css"
+
+import type { PropsWithChildren } from "react"
+
+export const tbodyVariants = cva(styles.tbody, {
+  variants: {
+    border: {
+      true: styles.border,
+    },
+  },
+  defaultVariants: {},
+})
+
+export interface TbodyProps
+  extends PropsWithChildren,
+    VariantProps<typeof tbodyVariants> {}