> ## Documentation Index
> Fetch the complete documentation index at: https://docs.fluid.app/llms.txt
> Use this file to discover all available pages before exploring further.

> ## Agent Instructions
> For new direct REST integrations, use the v2026-04 surfaces. The @fluid-app FairShare SDK continues to use its own published public-v2025-06 contract.
> Authenticate with the header Authorization: Bearer <token>; public storefront read endpoints require no auth.
> To sign a new merchant up for Fluid programmatically, call POST https://api.fluid.app/api/company with no credentials, as described in /api/agent-signup. Do not automate the signup form or book a demo. The merchant must open the emailed sign-in link and create an API token before authenticated calls are possible.
> Lists use cursor pagination via the page[cursor] and page[limit] query params; follow meta.pagination.next_cursor until it is null.
> When the same operation exists on more than one surface, use the newest: dated API versions are newer than unversioned ones, and later dates win (v2026-04 > v2025-06 > unversioned v0/v1.1). Fall back to a legacy or unversioned operation only when no newer versioned equivalent exists — the company-v0 notes below list the known superseded operations. /api/company/v1 and /api/v1/... paths are documented in no spec here and must never be used (/api/v1.1/... is distinct and documented in company-v0). Use page/per_page offset pagination only where a spec documents it — in practice the unversioned company-v0 admin surface; every versioned surface uses cursor pagination.
> Navigation menu management is documented in themes/navigation-menus. These unversioned admin endpoints (/api/menus and nested menu_items) are verified against the implementation but are not yet in the synced OpenAPI specs. Use that reference for menu payloads and its flat page/per_page pagination; missing spec coverage does not make these endpoints unavailable.
> The OpenAPI specs under api-reference/ are the authoritative contracts; prefer them over prose when in doubt. api-reference/storefront-v2026-04.yaml covers the v2026-04 storefront surface (/api/v202604/... paths); api-reference/checkout-v2026-04.yaml covers the v2026-04 checkout surface (/api/checkout/v2026-04/... paths — carts, cart auth, discounts, items, subscriptions, orders, enrollments, and store config); api-reference/public-v2025-06.yaml covers the Public SDK surface used by the @fluid-app FairShare SDK, including its parallel cart lifecycle, browser integrations, versioned payment callbacks, unversioned public utilities, and the cart price-override operation; api-reference/payment-v2026-04.yaml covers the v2026-04 payment gateway admin surface (/api/payment/v2026-04/... paths, bearer-authenticated — gateway CRUD, gateway purchase/authorize/$0-verify, transaction list/show and capture/void/credit, and merchant payment configuration); api-reference/payments-v2026-04.yaml covers the v2026-04 cart payment surface (/api/payments/v2026-04/carts/{cart_token}/... paths, authenticated by the cart token in the path with no bearer — payment-method selection, VGS card tokenization, 3D Secure verification, and PayPal/Braintree/Klarna/Apple Pay flows); api-reference/commerce-v2026-04.yaml covers the v2026-04 commerce order-editing surface (/api/v202604/orders/{order_id}/edits paths, bearer-authenticated — post-checkout order edits that atomically insert items and add adjustments/discounts, with an optional dry-run preview); api-reference/webhooks-v0.yaml covers the unversioned webhooks surface (/api/... paths — webhook registration, delivery payloads, callback registrations, company events, and webhook/callback schemas); api-reference/company-v0.yaml covers the legacy unversioned company admin surface (/api/... paths, bearer-authenticated — company settings and management, customers, users, roles, subscription plans, subscription bundles, subscriptions, media, pages, catch-ups, inventory levels, domains, agreements, and admin order actions). company-v0 caveats: it is the legacy v0 admin contract and its lists use flat page/per_page offset pagination, which is expected there despite the general cursor-pagination rule; where an operation exists in both company-v0 and a versioned spec, prefer the versioned spec — the subscriptions lifecycle (list/create/show/update, cancel, pause, reactivate, resume, retry, skip, failed-cycle-waiver, discounts) and subscription bundles are superseded by checkout-v2026-04, and company pages/media CRUD plus the public pages, categories, products, and media list endpoints are superseded by storefront-v2026-04. Subscription plan management (/api/subscription_plans, resource-wrapped {"subscription_plan": {...}} bodies) exists only in company-v0. api-reference/members-v2025-06.yaml covers the v2025-06 unified Member identity surface (/api/v2025-06/members/... paths, bearer-authenticated — member list/create/show/update, lookup by email/username/external_id/legacy_customer_id, member-type assignment, and the sponsor genealogy read). Prefer it over the customers and reps surfaces when the member type matters: /customers does not serialize member_type. api-reference/analytics-v2026-04.yaml covers the v2026-04 Home dashboard analytics surface (/api/v202604/analytics/dashboard/... paths, bearer-authenticated — read-only endpoints for the Home > Overview, Home > Live, and Home > Field tabs, each accepting an optional country ISO alpha-2 query param that scopes aggregations to a single country).
> api-reference/analytics-v0.yaml covers the unversioned analytics surface that backs the fluid-admin Traffic tab (/api/analytics/... and /api/analytics/traffic/... paths, bearer-authenticated — the legacy shares/views/visitors summary plus traffic overview, ranked campaigns, sources, geographies, flows, and per-rep breakdown, all sharing one reporting-period contract).
> Successful responses wrap the resource payload alongside a top-level integer status and a meta object.
> Portal Definition authoring edits and synchronizes the portal JSON resource graph. Widget Package authoring builds either a company-owned or Droplet-owned Remote DOM package. These are separate contracts; do not imply that one defines the other.
> For Widget Package worker code, use only @fluid-app/portal-sdk/widgets/worker. Use only the Portal Definition and Widget Package workflows and public entry points documented here; do not infer support for undocumented surfaces.
> Every portal function and declarative capability used by a widget must appear in that widget's uses array. Use the same typed function value in uses; do not invent capability-name strings.
> Widget styling must use the portal's semantic theme variables for colors, typography, spacing, radii, borders, focus, and charts whenever a token represents the visual decision. Do not create a separate light or dark palette or duplicate theme controls as widget properties.
> Prefer worker-safe Fluid UI components exported by @fluid-app/portal-sdk/widgets/worker when they fit the interaction. When no exported component fits, use semantic HTML, accessible behavior, and the portal theme variables.
> A Portal Definition push updates the remote working definition. A portal version is an immutable snapshot, and activation is a separate live release operation.

# Cart

> Choose which side of the screen your cart drawer opens on and which colors it uses, and preview the cart on desktop and mobile.

Use the Cart screen to set how your shopping cart appears to customers.

## Where to find it

In the admin, click the **Settings** gear in the top bar. In the Settings sidebar, under **Commerce**, select **Cart**.

Your role needs these permissions, named as they appear on the [Roles](/help/admin/settings/roles) screen:

* **Access advanced cart configuration** and **Edit cart behavior settings**, under **Cart Settings** in the **Settings** category. The first one lets you see **Cart** in the sidebar and open the screen.
* **View popup campaigns** and **Edit popup content and triggers**, under **Popups** in the **Content & Website** category.
* The switch that starts with **View global company configuration**, under **Company Settings** in the **Settings** category, to use your brand colors.

## What's on the screen

On a wide screen, the **Preview** is on the left and the settings panel is on the right. The panel has two sections, **Configure Cart** and **Colors**. Both start collapsed. Click a section's title to open it. Opening one section closes the other. **Save** is at the top of the screen.

### Preview

Click **Desktop** or **Mobile** to switch between a desktop view and a phone view. The preview shows your drawer position and primary color as you change them, before you save.

The preview uses your own store's details:

* The top of the cart shows **Your cart from** and your company name.
* The cart item and the three **You May Also Like** items are active products from your catalog. If you have fewer than four active products, or your role can't view **Products**, placeholder items fill the empty spots.
* The bottom of the cart shows **Shopping with** and your name.

The total on the checkout button adds sample tax and shipping amounts to the item's price, so it won't match a real order.

### Configure Cart

* **Cart Drawer Position**: choose **Left** or **Right** for the side of the screen the cart drawer opens on. **Right** is the default.

### Colors

* **Use Brand Settings**: a checkbox, off by default. When it's checked, the cart uses the **Primary Color** and **Secondary Color** from your [Brand Guidelines](/help/admin/settings/brand-guidelines) screen. This screen then hides its color fields.
* **Manage brand guidelines →**: a link that opens the Brand Guidelines screen.
* **Shuffle Brand Colors**: reapplies your brand's primary and secondary colors. It appears when **Use Brand Settings** is checked, with undo and redo arrows next to it.
* **Random Palette**: sets both colors to random colors. It appears when **Use Brand Settings** is off.
* **Primary Color** and **Secondary Color**: each has a swatch that opens a color picker, and a text field for a six-digit hex value that starts with `#`. They appear when **Use Brand Settings** is off. If no colors have been saved yet, they start at `#0C111D` (primary) and `#5C8CFF` (secondary).

## Tasks

### Change the cart drawer position

<Steps>
  <Step title="Open Configure Cart">
    In the settings panel, click **Configure Cart**.
  </Step>

  <Step title="Choose a side">
    Under **Cart Drawer Position**, click **Left** or **Right**. Check the **Desktop** preview to see the result.
  </Step>

  <Step title="Save">
    Click **Save** at the top of the screen. A confirmation message appears after you save.
  </Step>
</Steps>

<Note>
  Saving the [Floating Action Buttons](/help/admin/settings/floating-action-buttons) screen also sets **Cart Drawer Position** to match the cart button's **Position** on that screen, so check this screen after you save there. Saving this screen doesn't move the cart button.
</Note>

### Use your brand colors

<Steps>
  <Step title="Open Colors">
    In the settings panel, click **Colors**.
  </Step>

  <Step title="Turn on brand settings">
    Select the **Use Brand Settings** checkbox. The checkout button in the preview changes to your brand's primary color. If it doesn't, ask an admin to confirm your role has the permissions under [Where to find it](#where-to-find-it) before you save.
  </Step>

  <Step title="Save">
    Click **Save**.
  </Step>
</Steps>

### Set your own colors

<Steps>
  <Step title="Open Colors">
    In the settings panel, click **Colors**.
  </Step>

  <Step title="Turn off brand settings">
    Clear **Use Brand Settings** so the color fields appear.
  </Step>

  <Step title="Pick the colors">
    For **Primary Color** and **Secondary Color**, click the swatch and choose a color, or type a six-digit hex value, including the `#` (for example `#0C111D`), in the text field. To start from a random pair, click **Random Palette**.
  </Step>

  <Step title="Save">
    Click **Save**.
  </Step>
</Steps>

## FAQ

<AccordionGroup>
  <Accordion title="Why can't I save my changes?" id="save-disabled">
    **Save** is unavailable while the screen is loading or saving. After that, match what you see:

    * **Save** isn't there, and the settings sections don't open: your role doesn't have **Edit cart behavior settings**. You can still see the preview and switch between **Desktop** and **Mobile**.
    * **Save** stays grayed out after the screen loads: the screen couldn't load your saved cart settings, so the preview and fields show defaults.
    * An error message appears when you click **Save**: your changes weren't saved.

    To fix any of these, ask an admin who manages roles to make sure your role has every permission listed under [Where to find it](#where-to-find-it). They add permissions on the [Roles](/help/admin/settings/roles) screen. If your role has them and you still can't save, contact support.

    <Info>
      Email Fluid support at [help@fluid.app](mailto:help@fluid.app). The [Getting help](/help/getting-help) page lists what to include in your request.
    </Info>
  </Accordion>

  <Accordion title="Why doesn't the preview change when I change the secondary color?" id="secondary-color-preview">
    The preview shows only the primary color, on the checkout button and the **+** quantity button. The secondary color is still saved with your cart settings.
  </Accordion>

  <Accordion title="Why does the mobile preview look the same for Left and Right?" id="mobile-preview-position">
    In the mobile preview, the cart drawer rises from the bottom and spans the full width of the phone, so **Left** and **Right** look the same there. Use the **Desktop** preview to check the drawer position.
  </Accordion>

  <Accordion title="Do cart colors change when I update my brand colors?" id="brand-color-updates">
    Yes, if your cart settings were saved with **Use Brand Settings** checked. When someone saves new colors on the Brand Guidelines screen, your cart's colors update to match. If **Use Brand Settings** is off, brand color changes don't affect your cart.

    If the cart kept its old colors, open this screen and click **Colors**. When the preview shows your new brand color, click **Save**.
  </Accordion>

  <Accordion title="Does the Floating Action Buttons screen change these settings?" id="floating-action-buttons-shared">
    Yes. The cart button on the [Floating Action Buttons](/help/admin/settings/floating-action-buttons) screen uses the same saved colors as this screen. Its **Use brand settings** checkbox shares the saved choice with **Use Brand Settings** here. A save on either screen changes them for both.

    If neither screen has saved that choice yet, the two screens show it differently. This screen starts with **Use Brand Settings** cleared. Floating Action Buttons starts with its **Use brand settings** checkbox checked.

    Saving Floating Action Buttons also changes **Cart Drawer Position** on this screen. See the note under [Change the cart drawer position](#change-the-cart-drawer-position).
  </Accordion>
</AccordionGroup>

## Related pages

* [Settings](/help/admin/settings)
* [Brand Guidelines](/help/admin/settings/brand-guidelines)
* [Floating Action Buttons](/help/admin/settings/floating-action-buttons): the floating cart button, which shares these colors
* [Roles](/help/admin/settings/roles)
