Feature/Enhancement: Add Clear Cart button to Cart Page

[Denisha227]

📝 PR Title
Enhancement: Add Clear Cart button to Cart Page

closes (#554)

📌 Description
This PR addresses the inconvenience of having to remove items from the cart one by one. It introduces a "Clear Cart" button on the cart page that allows users to empty their cart completely with a single click.

With this update:

A "Clear Cart" button is visible at the top-right corner of the cart items list.
Clicking the button displays a confirmation dialog: "Are you sure you want to remove all items from your cart?"
Confirming the prompt removes all items from the cart instantly.
The cart page updates dynamically to show the "Your cart is empty 🛒" message.
When the cart is empty, the "Clear Cart" header is hidden, and the "Checkout" button is disabled.

✅ Changes Made
cart.html:
Layout: Added a .cart-list-header container containing the "Items in Cart" heading and the "Clear Cart" button above the items list.
Styling: Structured #clear-cart-btn with a modern, compact layout, incorporating smooth transition and lift animations on hover.
Logic: Implemented a confirmation step and wired it to window.cartManager.clear(). Updated renderCart() to show/hide the header and enable/disable the checkout button dynamically based on cart occupancy.

🎯 Benefits
Improved Usability: Users can empty large carts instantly instead of clicking "Remove" repeatedly.
Safer Actions: The confirmation dialog prevents accidental clears.
Clean Design: The button and header hide automatically when the cart is empty to avoid visual clutter.

📷 Screenshot

Before

After