feat(cart): refactor cart item structure and update related components for consistency

src/app/shared/components/cart/cart.component.html

@@ -1,16 +1,28 @@
-<section class="d-flex flex-column h-100 overflow-hidden text-secondary" [style.background-color]="backgroundColor()">
+<section
+  class="d-flex flex-column h-100 overflow-hidden text-secondary"
+  [style.background-color]="backgroundColor()"
+>
   <header class="d-flex align-items-center p-3 justify-content-between bg-transparent cart-header">
     <h2 class="m-0 text-uppercase fw-bold cart-title">{{ title() }}</h2>
 
     @if (showClose()) {
-      <button class="btn btn-link p-0 border-0 d-inline-flex align-items-center justify-content-center cart-close-btn" type="button" aria-label="Cerrar carrito" (click)="closed.emit()">
+      <button
+        class="btn btn-link p-0 border-0 d-inline-flex align-items-center justify-content-center cart-close-btn"
+        type="button"
+        aria-label="Cerrar carrito"
+        (click)="closed.emit()"
+      >
         <i class="fa-solid fa-xmark"></i>
       </button>
     }
   </header>
 
   <div class="d-grid w-100 flex-grow-1 overflow-y-auto cart-items-container">
-    @for (item of items(); track item.productVariantId || item.product + item.discountedPrice; let idx = $index) {
+    @for (
+      item of items();
+      track item.cartItemId || item.product + item.discountedPrice;
+      let idx = $index
+    ) {
       <app-cart-item
         [imageUrl]="item.imageUrl"
         [product]="item.product"
@@ -46,6 +58,3 @@
     </div>
   </footer>
 </section>
-
-
-