feat: implement cart component with mock data and styling for improved cart functionality

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

@@ -0,0 +1,42 @@
+<section class="cart" [style.background-color]="backgroundColor()">
+  <header class="cart__header">
+    <h2 class="cart__title">{{ title() }}</h2>
+
+    @if (showClose()) {
+      <button class="cart__close" type="button" aria-label="Cerrar carrito" (click)="closed.emit()">
+        <i class="fa-solid fa-xmark"></i>
+      </button>
+    }
+  </header>
+
+  <div class="cart__items">
+    @for (item of items(); track item.product + item.discountedPrice) {
+      <app-cart-item
+        [imageUrl]="item.imageUrl"
+        [product]="item.product"
+        [originalPrice]="item.originalPrice"
+        [discountedPrice]="item.discountedPrice"
+        [discountPercentage]="item.discountPercentage"
+        [attributes]="item.attributes"
+        [quantity]="item.quantity"
+      />
+    }
+  </div>
+
+  <footer class="cart__summary">
+    <div class="cart__summary-row">
+      <span class="cart__summary-label">Subtotal:</span>
+      <span class="cart__summary-value">{{ formattedSubtotal() }}</span>
+    </div>
+
+    <div class="cart__summary-row">
+      <span class="cart__summary-label">Descuento:</span>
+      <span class="cart__summary-value">{{ formattedDiscount() }}</span>
+    </div>
+
+    <div class="cart__summary-row cart__summary-row--total">
+      <span class="cart__summary-label">TOTAL:</span>
+      <span class="cart__summary-value">{{ formattedTotal() }}</span>
+    </div>
+  </footer>
+</section>