/* =============================================================
   Cart / checkout cross-sells ("You may be interested in…")

   Cross-sells reuse the shared product-loop wrapper
   (woocommerce/loop/loop-start.php → <div class="row ps-5 pe-5 g-0">) with the
   archive card (woocommerce/content-product.php → col-lg-3, i.e. 25% width).
   Inside the narrow cross-sell column that padding + 25% width collapses the
   card to ~110px, so the date stacks one word per line and "Online" breaks
   mid-word. These rules, scoped to the cart/checkout cross-sell block only,
   drop the oversized side padding and let each card fill the column.
   (Archive/related grids are untouched — they are not inside .cross-sells.)
   ============================================================= */

.woocommerce-cart .cross-sells .row,
.woocommerce-checkout .cross-sells .row {
    padding-left: 0 !important;
    padding-right: 0 !important;
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    margin: 0;
}

.woocommerce-cart .cross-sells .row > .product,
.woocommerce-checkout .cross-sells .row > .product {
    flex: 0 0 auto;
    width: 300px !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Keep the (often square) product image from making the card very tall. */
.woocommerce-cart .cross-sells .card .thumb img,
.woocommerce-checkout .cross-sells .card .thumb img {
    width: 100%;
    height: 150px;
    object-fit: contain;
}

/* Tidy the meta line: no default list bullets, no mid-word breaks. */
.woocommerce-cart .cross-sells .card .meta-list,
.woocommerce-checkout .cross-sells .card .meta-list {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
    overflow-wrap: break-word;
    word-break: normal;
}