<?xml version="1.0"?>
<t name="Rate our Services" t-name="rating.rating_external_page_submit">
            <t t-call="web.frontend_layout">
                <div class="container mb-5 mt-4 o_rating_page_submit">
                    <div class="row text-center justify-content-center">
                        <h1 class="col-12 mt-5">Thank you for rating our services!</h1>
                        <form class="col-md-6" t-attf-action="/rate/#{token}/submit_feedback" method="post">
                            <div class="btn-group row flex-nowrap justify-content-center w-100 mt-5" role="group" data-bs-toggle="buttons">
                                <t t-foreach="rate_names" t-as="rate_name">
                                    <input type="radio" name="rate" class="btn-check" t-attf-id="rate_{{rate_name}}" t-att-value="rate_name" t-att-checked="rate == rate_name"/>
                                    <label t-attf-class="col p-4 btn o_rating_label shadow-none transition-base {{rate == rate_name and 'active' or ''}}" t-att-for="'rate_%s' % (rate_name)">
                                        <img t-attf-src="/rating/static/src/img/rating_#{rate_name}.svg" t-att-alt="rate_name_value" t-att-title="rate_name_value" t-attf-class="o_{{rate_name_value.lower()}}"/>
                                    </label>
                                </t>
                            </div>
                            <p class="mt-5">
                                Feel free to write a feedback on your experience:
                            </p>
                            <input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/>
                            <textarea class="form-control" name="feedback" rows="8" t-att-value="rating.feedback"/>
                            <button type="submit" class="btn btn-primary mt-4" style="margin-top:8px;">Send Feedback</button>
                        </form>
                    </div>
                </div>
            </t>
        </t>
