diff --git a/website_sale_aplicoop/controllers/website_sale.py b/website_sale_aplicoop/controllers/website_sale.py
index e3fac6b..3d7a051 100644
--- a/website_sale_aplicoop/controllers/website_sale.py
+++ b/website_sale_aplicoop/controllers/website_sale.py
@@ -260,6 +260,7 @@ class AplicoopWebsiteSale(WebsiteSale):
             # ============ MISC ============
             "items": env_lang._("items"),
             "added_to_cart": env_lang._("added to cart"),
+            "out_of_stock": env_lang._("Out of stock"),
         }
 
         return labels
diff --git a/website_sale_aplicoop/static/src/js/website_sale.js b/website_sale_aplicoop/static/src/js/website_sale.js
index 0acea67..9ccd9f7 100644
--- a/website_sale_aplicoop/static/src/js/website_sale.js
+++ b/website_sale_aplicoop/static/src/js/website_sale.js
@@ -792,6 +792,19 @@
                 var quantityInput = form.querySelector(".product-qty");
                 var quantity = quantityInput ? parseFloat(quantityInput.value) : 1;
 
+                // Block add-to-cart if product is flagged out of stock (from template)
+                var isOutOfStock =
+                    (form.getAttribute("data-out-of-stock") || "false") === "true" ||
+                    (cartBtn.getAttribute("data-out-of-stock") || "false") === "true";
+                if (isOutOfStock) {
+                    var labels = self._getLabels();
+                    self._showNotification(
+                        labels.out_of_stock || "Product is out of stock",
+                        "warning"
+                    );
+                    return;
+                }
+
                 console.log("Adding:", {
                     productId: productId,
                     productName: productName,
diff --git a/website_sale_aplicoop/views/website_templates.xml b/website_sale_aplicoop/views/website_templates.xml
index 9b3bd20..c5cdb78 100644
--- a/website_sale_aplicoop/views/website_templates.xml
+++ b/website_sale_aplicoop/views/website_templates.xml
@@ -666,7 +666,16 @@
                         <t t-set="safe_uom_category" t-value="product_display_info.get(product.id, {}).get('safe_uom_category', '')" />
                         <t t-set="quantity_step" t-value="product_display_info.get(product.id, {}).get('quantity_step', 1)" />
                         <t t-set="order_id_safe" t-value="group_order.id if group_order else ''" />
-                        <form class="add-to-cart-form" t-attf-data-order-id="{{ order_id_safe }}" t-attf-data-product-id="{{ product.id }}" t-attf-data-product-name="{{ product.name }}" t-attf-data-product-price="{{ display_price }}" t-attf-data-uom-category="{{ safe_uom_category }}" t-attf-data-quantity-step="{{ quantity_step }}">
+                        <form
+                            class="add-to-cart-form"
+                            t-attf-data-order-id="{{ order_id_safe }}"
+                            t-attf-data-product-id="{{ product.id }}"
+                            t-attf-data-product-name="{{ product.name }}"
+                            t-attf-data-product-price="{{ display_price }}"
+                            t-attf-data-uom-category="{{ safe_uom_category }}"
+                            t-attf-data-quantity-step="{{ quantity_step }}"
+                            t-att-data-out-of-stock="'true' if product.is_out_of_stock else 'false'"
+                        >
                             <div class="qty-control">
                                 <label t-attf-for="qty_{{ product.id }}" class="sr-only">Quantity of <t t-esc="product.name" />
                                 </label>
@@ -677,8 +686,14 @@
                                 <button class="qty-increase" type="button" t-attf-data-product-id="{{ product.id }}" aria-label="Increase quantity">
                                     <i class="fa fa-plus" />
                                 </button>
-                                <button class="add-to-cart-btn" type="button" t-attf-aria-label="{{ 'Add %s to cart' % product.name }}" t-attf-title="{{ 'Add %s to cart' % product.name }}">
-                                    <i class="fa fa-shopping-cart" aria-hidden="true" />
+                                <button
+                                    class="add-to-cart-btn"
+                                    type="button"
+                                    t-att-data-out-of-stock="'true' if product.is_out_of_stock else 'false'"
+                                    t-attf-aria-label="{{ 'Out of stock' if product.is_out_of_stock else 'Add %s to cart' % product.name }}"
+                                    t-attf-title="{{ 'Out of stock' if product.is_out_of_stock else 'Add %s to cart' % product.name }}"
+                                >
+                                    <i t-attf-class="fa {{ 'fa-ban text-muted' if product.is_out_of_stock else 'fa-shopping-cart' }}" aria-hidden="true" />
                                 </button>
                             </div>
                         </form>