/* AfricaMart local stock limits: keep product card actions compact. */
.stockLimitMessage {
    display: block;
    flex: 0 0 100%;
    width: 100%;
    margin: 4px 0 0;
    font-size: 11px;
    line-height: 1.35;
    color: #356447;
    font-weight: 500;
    letter-spacing: normal;
    white-space: normal;
}
.stockLimitMessage[hidden] { display: none !important; }
.productActions:has(.stockLimitMessage:not([hidden])) { flex-wrap: wrap; }
/* Do not show a dead quantity picker for an unavailable product or a full basket. */
.productCard .qtyControl[aria-disabled="true"],
.productCard.stockLimitUnavailable .qtyControl,
.productCard.stockLimitBasketFull .qtyControl { display: none; }
.productCard.stockLimitUnavailable .productActions .addToCartBtn,
.productCard.stockLimitBasketFull .productActions .addToCartBtn { flex: 1 1 auto; min-width: 0; }
/* A fully unavailable multi-variant card should not advertise size selection. */
.productCard.stockLimitUnavailable[data-product-type="variable"] .productSize { display: none; }

/* Align every product card's purchase controls, regardless of title length or
 * whether a stock message is present. Reserve the message space on ALL cards.
 * The note is out of the button grid so it cannot create another grid row. */
.productCard .productActions {
    position: relative;
    padding-bottom: 20px;
}
.productCard .productActions .stockLimitMessage {
    position: absolute;
    inset-inline: 0;
    bottom: 0;
    margin: 0;
    width: 100%;
    line-height: 1.35;
}

/* The original catalogue uses two 50% columns for sold-out cards, but the
 * quantity picker is hidden by the stock guard. Give its sole button full width. */
.productCard.stockLimitUnavailable .productActions,
.productCard.stockLimitBasketFull .productActions {
    grid-template-columns: minmax(0, 1fr);
}
.productCard.stockLimitUnavailable .productActions .addToCartBtn,
.productCard.stockLimitBasketFull .productActions .addToCartBtn {
    grid-column: 1 / -1;
}

/* On narrow phones the existing layout stacks minus/plus above Add. Keep
 * the primary Add/Choose option buttons aligned at the foot of every card. */
@media (max-width: 480px) {
    .productCard .productActions,
    .productCard[data-product-type="variable"] .productActions {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        min-height: 110px;
        gap: 8px;
    }
    .productCard .productActions > .qtyControl,
    .productCard .productActions > .addToCartBtn,
    .productCard .productActions > .chooseOptionsBtn {
        flex: 0 0 38px;
    }
}

/* All genuinely unavailable cards show the same single full-width control.
 * The catalogue sometimes renders a sold-out variable product with the
 * standard 2-column controls grid and a small disabled Add button. */
.productCard[data-stock-state="out-of-stock"] .qtyControl,
.productCard.stockLimitUnavailable .qtyControl {
    display: none !important;
}
.productCard[data-stock-state="out-of-stock"] .productActions,
.productCard.stockLimitUnavailable .productActions {
    grid-template-columns: minmax(0, 1fr) !important;
}
.productCard[data-stock-state="out-of-stock"] .productActions .addToCartBtn,
.productCard.stockLimitUnavailable .productActions .addToCartBtn {
    display: flex;
    width: 100% !important;
    min-width: 0;
    min-height: 38px;
    grid-column: 1 / -1;
    align-items: center;
    justify-content: center;
    text-align: center;
    white-space: nowrap;
}

/* Keep price baselines aligned for sold-out multi-variant products.
 * Hide the 'Multiple sizes' label visually, but preserve its line box and
 * margin so a missing label does not pull the price one row upwards. */
.shopProductGrid .productCard.stockLimitUnavailable[data-product-type="variable"] .productSize,
.shopProductGrid .productCard[data-stock-state="out-of-stock"][data-product-type="variable"] .productSize,
.productGrid .productCard.stockLimitUnavailable[data-product-type="variable"] .productSize,
.productGrid .productCard[data-stock-state="out-of-stock"][data-product-type="variable"] .productSize {
    display: block;
    visibility: hidden;
}

/* A disabled + must look disabled — on the shop, product page, variation
 * popup and basket. Keep the adjacent – button usable. */
.productCard .qtyControl button:last-child:disabled,
.variationQtyControl button:last-child:disabled,
.productPageQty [data-product-qty="increase"]:disabled,
.basketDrawerItem [data-basket-qty-action="increase"]:disabled,
.basketItem [data-cart-action="increase"]:disabled {
    background-color: #e8ebe8 !important;
    color: #a3aca5 !important;
    border-color: #d6dcd6 !important;
    box-shadow: none !important;
    opacity: 1 !important;
    cursor: not-allowed !important;
    pointer-events: none;
}
.productCard .qtyControl button:last-child:disabled:hover,
.variationQtyControl button:last-child:disabled:hover,
.productPageQty [data-product-qty="increase"]:disabled:hover,
.basketDrawerItem [data-basket-qty-action="increase"]:disabled:hover,
.basketItem [data-cart-action="increase"]:disabled:hover {
    background-color: #e8ebe8 !important;
    color: #a3aca5 !important;
}