From 2ad5bb6a8f7d724567f1cdda87f20e9537ff6a38 Mon Sep 17 00:00:00 2001
From: Alaguraj0361 <alaguraj0361@gmail.com>
Date: Wed, 2 Sep 2026 22:42:26 +0530
Subject: [PATCH] implement custom product details page layout with styling
 enhancements and image disclaimer notes

---
 .../views/product_details_page.xml            | 32 +++++++++++--------
 1 file changed, 19 insertions(+), 13 deletions(-)

diff --git a/addons/dine360_theme_shivasakthi/views/product_details_page.xml b/addons/dine360_theme_shivasakthi/views/product_details_page.xml
index 6bde2f6..ee0303f 100644
--- a/addons/dine360_theme_shivasakthi/views/product_details_page.xml
+++ b/addons/dine360_theme_shivasakthi/views/product_details_page.xml
@@ -4,9 +4,15 @@
         <!-- Product Page Layout Customization -->
         <template id="Shivasakthi_product_details_layout" inherit_id="website_sale.product" name="Shivasakthi Product Details" priority="60">
             
-            <!-- 1. Style the image column -->
+            <!-- 1. Style the image column and add image note -->
             <xpath expr="//div[@id='product_details']/preceding-sibling::div" position="attributes">
-                 <attribute name="class" add="rounded-4 shadow-sm overflow-hidden" separator=" "/>
+                 <attribute name="class" add="rounded-4 shadow-sm" separator=" "/>
+            </xpath>
+            <xpath expr="//div[@id='product_details']/preceding-sibling::div" position="inside">
+                <div class="product-image-disclaimer-note mt-2 text-center text-muted small fst-italic px-3 py-2 bg-light rounded border border-secondary-subtle">
+                    <i class="fa fa-info-circle me-1 text-primary"/>
+                    <span style="font-size: 12px;"><strong>Note:</strong> Food images are for illustration purposes only and may differ from the actual dishes served.</span>
+                </div>
             </xpath>
 
             <!-- 2. Hide Duplicate Original Elements and Terms block via CSS (Safer than XPath) -->
@@ -23,18 +29,9 @@
                 </style>
             </xpath>
 
-            <!-- 4. Prepend our Premium Styled content at the very top of product_details container -->
-            <!-- We use 'inside' and a wrapper with 'order-first' to ensure it stays at the top -->
+            <!-- 3. Prepend our Premium Styled content at the very top of product_details container -->
             <xpath expr="//div[@id='product_details']" position="inside">
                 <div class="product-details-wrapper Shivasakthi-premium-content" style="order: -1; position: relative; z-index: 10;">
-                    <!-- Breadcrumbs -->
-                    <!-- <div class="o_wsale_products_breadcrumb mb-3">
-                        <ul class="breadcrumb bg-transparent p-0 small">
-                            <li class="breadcrumb-item"><a href="/shop" class="text-secondary text-decoration-none">All Products</a></li>
-                            <li class="breadcrumb-item active fw-bold" style="color: #ffb800;"><span t-field="product.name"/></li>
-                        </ul>
-                    </div> -->
-
                     <h1 itemprop="name" t-field="product.name" class="display-5 fw-bold mb-3 text-dark"/>
                     
                     <div class="product-meta d-flex align-items-center mb-4">
@@ -50,7 +47,16 @@
                         </h2>
                     </div>
 
-                    <p t-field="product.description_sale" class="text-muted mb-4 fs-6" placeholder="A short description of the product..."/>
+                    <p t-field="product.description_sale" class="text-muted mb-3 fs-6" placeholder="A short description of the product..."/>
+
+                    <!-- Food Illustration Disclaimer Note -->
+                    <div class="product-food-disclaimer-note my-3 p-2 px-3 rounded-3 bg-light border border-secondary-subtle text-muted small d-flex align-items-start gap-2 shadow-sm">
+                        <i class="fa fa-info-circle text-warning flex-shrink-0 mt-1" style="font-size: 15px;"/>
+                        <span style="font-size: 12px; line-height: 1.5; color: #555;">
+                            <strong>Note:</strong> Food images are for illustration purposes only and may differ from the actual dishes served.
+                        </span>
+                    </div>
+
                     <hr class="my-4 text-muted opacity-25"/>
                 </div>
             </xpath>