<?xml version="1.0" encoding="UTF-8"?>
<templates id="template" xml:space="preserve">
    <t t-name="pos_loyalty.ProductScreen" t-inherit="point_of_sale.ProductScreen" t-inherit-mode="extension">
		<xpath expr="//Orderline" position="inside" >
            <li t-if="line.isGiftCardOrEWalletReward()">
                Current Balance: <t t-esc="line.getGiftCardOrEWalletBalance()"/>
            </li>
        </xpath>
        <xpath expr="//OrderWidget/t[@t-set-slot='details']" position="inside">
            <t t-foreach="pos.get_order()?.getLoyaltyPoints() or []" t-as="_loyaltyStat" t-key="_loyaltyStat.couponId">
                <div t-if="_loyaltyStat.points.won || _loyaltyStat.points.spent" class="w-100 border-top mt-auto fw-bolder d-flex flex-column px-3 py-2 bg-200">
                    <div t-esc="_loyaltyStat.points.name" class="loyalty-points-title text-center mb-1" />
                    <div class="d-flex justify-content-around gap-2 mt-1">
                        <div t-if='_loyaltyStat.points.won' class="loyalty-points-won d-flex flex-column align-items-center justify-content-center flex-grow-1 rounded bg-300 px-3 py-2" >
                            <span class="text-muted">Points Won</span>
                            <span class='value text-success '>+<t t-esc='_loyaltyStat.points.won'/></span>
                        </div>
                        <div t-if='_loyaltyStat.points.spent' class="loyalty-points-won d-flex flex-column align-items-center justify-content-center flex-grow-1 rounded bg-300 px-3 py-2" >
                            <span class="text-muted">Points Spent</span>
                            <span class='value text-danger'>-<t t-esc='_loyaltyStat.points.spent'/></span>
                        </div>
                        <div class="loyalty-points-total d-flex flex-column align-items-center justify-content-center flex-grow-1 rounded bg-300 px-3 py-2">
                            <span class="text-muted">New Total</span>
                            <span class='value text-primary'><t t-esc='_loyaltyStat.points.total'/></span>
                        </div>
                    </div>
                </div>
            </t>
        </xpath>
    </t>
</templates>
