<?xml version="1.0"?>
<t name="Configure" t-name="sale_product_configurator.configure">
        <div class="js_product main_product">

            <t t-set="combination" t-value="product_combination if product_combination else product._get_first_possible_combination()"/>
            <t t-set="combination_info" t-value="product._get_combination_info(combination, add_qty=add_qty or 1, pricelist=pricelist)"/>
            <t t-set="product_variant" t-value="product.env['product.product'].browse(combination_info['product_id'])"/>

            <input type="hidden" class="product_template_id" t-att-value="product.id"/>
            <input type="hidden" class="product_id" t-attf-name="product_id" t-att-value="product_variant.id"/>
            <input type="hidden" class="has_optional_products" t-attf-name="has_optional_products" t-att-value="product_variant.optional_product_ids.filtered(lambda p: p._is_add_to_cart_possible(combination))"/>
            <div class="col-lg-12 text-center mt-5">
                <t t-if="product._is_add_to_cart_possible()">
                    <div class="col-lg-5 d-inline-block text-start">
                        <t t-if="combination" t-call="sale.variants">
                            <t t-set="parent_combination" t-value="None"/>
                        </t>
                        <h2>
                            <span t-attf-class="text-danger oe_default_price oe_striked_price {{'' if combination_info['has_discounted_price'] else 'd-none'}}" t-out="combination_info['list_price']" t-options="{                                     &quot;widget&quot;: &quot;monetary&quot;,                                     &quot;display_currency&quot;: (pricelist or product).currency_id                                 }"/>
                            <span class="oe_price product_id mt-3" style="white-space: nowrap;" t-att-data-product-id="product.id" t-out="combination_info['price']" t-options="{                                     &quot;widget&quot;: &quot;monetary&quot;,                                     &quot;display_currency&quot;: (pricelist or product).currency_id                                 }"/>
                        </h2>
                        <t t-if="product.visible_qty_configurator">
                            <t t-call="sale_product_configurator.product_quantity_config"/>
                        </t>
                        <p class="css_not_available_msg alert alert-warning">This combination does not exist.</p>
                    </div>
                    <div class="col-lg-1 d-inline-block"/>
                    <div class="col-lg-5 d-inline-block align-top text-start">
                        <img t-if="product_variant" t-att-src="'/web/image/product.product/%s/image_1024' % product_variant.id" class="d-block product_detail_img" alt="Product Image"/>
                        <img t-else="" t-att-src="'/web/image/product.template/%s/image_1024' % product.id" class="d-block product_detail_img" alt="Product Image"/>
                    </div>
                </t>
                <t t-else="">
                    <div class="col-lg-5 d-inline-block text-start">
                        <p class="alert alert-warning">This product has no valid combination.</p>
                    </div>
                </t>
            </div>
        </div>
    </t>

    