> For the complete documentation index, see [llms.txt](https://document.tek-labs.app/free-gift-userguide/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://document.tek-labs.app/free-gift-userguide/user-guides/styling/gift-in-cart-type.md).

# Gift In Cart

Style the gift block shown inside the cart page and cart drawer.

Gift In Cart lists the available gift offers inside the cart page or cart drawer. Each offer card shows the gift, a progress bar toward the goal and a countdown, and customers can claim gifts without leaving the cart. Turn it on per offer in **Free gift › Display › Gift in Cart**.

<figure><img src="https://2782088585-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FyTxhG4dtLtoZ8LGb73m7%2Fuploads%2Fgit-blob-f16b420d021a21c2b0f57cebda971046e3ccf008%2Fsp-st-gift-in-cart.png?alt=media" alt="Gift In Cart style editor"><figcaption></figcaption></figure>

**Preview**: choose **Automatically add gift** or **Manually choose gift**, then **Not eligible yet**, **Eligible, not claimed** (manual only) or **All gifts claimed**. Click the cart icon in the preview to open the cart.

## Sections

| Section             | Settings                                                                                                                                                                                        |
| ------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Container**       | Background and border colour (applies to all states).                                                                                                                                           |
| **Offer order**     | **Sort by**: **Expiring soonest**, **Expiring latest**, **Newly added**, **Oldest added** or **Manual sort** (drag the offers in the list).                                                     |
| **Header**          | Header text and offer-count text: colour, font size and weight (applies to all states).                                                                                                         |
| **Offer card**      | Background and border colour, border radius and width; gift text and options text colour, size and weight; options badge colours.                                                               |
| **Progress bar**    | Radius; unlock, done and label texts; bar and background colours for each state; "spent" subtitle.                                                                                              |
| **Countdown timer** | Shown in **Not eligible yet**: timer text colour, size, weight and dot colour.                                                                                                                  |
| **Gift selector**   | Shown in **Eligible, not claimed**: title, subtitle, "Select your gift" text, reward count, reward name and prices; selected border and background; close icon; **Add to cart** button colours. |
| **Image**           | Image border radius; quantity badge and text colours.                                                                                                                                           |
| **Custom CSS**      | Your own CSS.                                                                                                                                                                                   |

Edit the widget's texts in the **Gift In Cart** tab of [Translations](/free-gift-userguide/user-guides/translation.md).