feat: update modal and cart components for improved user feedback and layout adjustments

src/app/shared/components/cart/cart.component.spec.ts

@@ -115,7 +115,7 @@ describe('CartComponent', () => {
 
     expect(openConfirmDelete).toHaveBeenCalledWith({
       title: 'Eliminar producto',
-      content: 'Se eliminara "Producto de prueba" del carrito. Esta accion no se puede deshacer.',
+      content: 'Se eliminará “Producto de prueba” del carrito. Esta acción no se puede deshacer.',
       confirmLabel: 'Eliminar',
       cancelLabel: 'Cancelar',
     });

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

@@ -204,7 +204,7 @@ export class CartComponent {
     this.modalService
       .openConfirmDelete({
         title: 'Eliminar producto',
-        content: `Se eliminara "${target.productName}" del carrito. Esta accion no se puede deshacer.`,
+        content: `Se eliminará “${target.productName}” del carrito. Esta acción no se puede deshacer.`,
         confirmLabel: 'Eliminar',
         cancelLabel: 'Cancelar',
       })

src/app/shared/components/confirm-delete-modal/confirm-delete-modal.component.scss

@@ -1,19 +1,25 @@
 .confirm-modal {
   display: grid;
-  gap: 1.5rem;
-  justify-items: center;
+  width: 100%;
+  gap: 1.25rem;
   text-align: center;
 }
 
 .confirm-modal__content {
   margin: 0;
-  color: #666666;
-  line-height: 1.5;
+  color: #5f6368;
+  line-height: 1.55;
 }
 
 .confirm-modal__actions {
-  display: flex;
-  justify-content: center;
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  width: 100%;
   gap: 0.75rem;
-  flex-wrap: wrap;
+}
+
+@media (max-width: 380px) {
+  .confirm-modal__actions {
+    grid-template-columns: 1fr;
+  }
 }