<odoo>

    <template
        id="external_layout_standard"
        inherit_id="web.external_layout_standard"
        priority="99"
    >
        <xpath expr="//div[1]" position="replace">
            <div
                t-attf-class="header o_company_#{company.id}_layout"
                t-att-style="report_header_style"
                position="replace"
            >
                <div class="o_clean_header">
                    <div class="row px-3" t-if="cfdi">
                        <div class="col-8 m-0 p-1">
                            <b class="text-uppercase " t-field="cfdi.type" />
                        </div>
                        <div class="col-4 text-right m-0 p-1">
                            <b>Folio:</b>
                            <span t-out="cfdi.name" />
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-3">
                            <img
                                t-if="cfdi and cfdi.issuer_id.logo_url"
                                t-att-src="cfdi.issuer_id.logo_url"
                                class="img-fluid w-100"
                                style="max-height: 180px !important;"
                            />
                            <img
                                t-if="company.logo and not (cfdi and cfdi.issuer_id.logo_url)"
                                class="img-fluid w-100"
                                t-att-src="image_data_uri(company.logo)"
                                style="max-height: 180px !important;"
                            />
                        </div>
                        <div
                            t-if="not cfdi"
                            class="col-5 offset-1"
                            name="company_address"
                        >
                            <ul class="list-unstyled">
                                <strong>
                                    <li t-if="company.name">
                                        <span t-field="company.name" />
                                    </li>
                                </strong>
                                <li t-if="forced_vat or company.vat">
                                    <t
                                        t-esc="company.country_id.vat_label or 'Tax ID'"
                                    />:
                                    <span t-if="forced_vat" t-esc="forced_vat" />
                                    <span t-else="" t-field="company.vat" />
                                </li>
                                <li t-if="company.phone">Tel:
                                    <span class="o_force_ltr" t-field="company.phone" />
                                </li>
                                <li t-if="company.email">
                                    <span t-field="company.email" />
                                </li>
                                <li t-if="company.website">
                                    <span t-field="company.website" />
                                </li>
                            </ul>
                        </div>

                        <div class="row" style="font-size: 12px;" t-if="cfdi">
                            <div class="m-0 p-1" style="width: 50%;">
                                <t t-call="l10n_mx_cfdi.cfdi_issuer_data" t-if="cfdi" />
                                <t
                                    t-call="l10n_mx_cfdi.default_issuer_data"
                                    t-else=""
                                />
                            </div>

                            <div class="m-0 p-1" style="width: 50%;">
                                <t
                                    t-call="l10n_mx_cfdi.cfdi_receiver_data"
                                    t-if="cfdi"
                                />
                                <t
                                    t-call="l10n_mx_cfdi.default_receiver_data"
                                    t-else=""
                                />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </xpath>

        <!-- Add CFDI note to footer -->
        <div t-if="report_type == 'pdf'" class="text-muted" position="before">
            <div t-if="cfdi" class="col-12" style="font-size: 12px;">
                Este documento es una representación impresa de un CFDI
            </div>
        </div>
    </template>

    <template
        id="external_layout_bold"
        inherit_id="web.external_layout_bold"
        priority="99"
    >
        <xpath expr="//div[1]" position="replace">
            <div
                t-attf-class="header o_company_#{company.id}_layout"
                t-att-style="report_header_style"
                position="replace"
            >
                <div class="o_clean_header">
                    <div class="row px-3" t-if="cfdi">
                        <div class="col-8 m-0 p-1">
                            <b class="text-uppercase " t-field="cfdi.type" />
                        </div>
                        <div class="col-4 text-right m-0 p-1">
                            <b>Folio:</b>
                            <span t-out="cfdi.name" />
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-3">
                            <img
                                t-if="cfdi and cfdi.issuer_id.logo_url"
                                t-att-src="cfdi.issuer_id.logo_url"
                                class="img-fluid w-100"
                                style="max-height: 180px !important;"
                            />
                            <img
                                t-if="company.logo and not (cfdi and cfdi.issuer_id.logo_url)"
                                class="img-fluid w-100"
                                t-att-src="image_data_uri(company.logo)"
                                style="max-height: 180px !important;"
                            />
                        </div>
                        <div
                            t-if="not cfdi"
                            class="col-5 offset-1"
                            name="company_address"
                        >
                            <ul class="list-unstyled">
                                <strong>
                                    <li t-if="company.name">
                                        <span t-field="company.name" />
                                    </li>
                                </strong>
                                <li t-if="forced_vat or company.vat">
                                    <t
                                        t-esc="company.country_id.vat_label or 'Tax ID'"
                                    />:
                                    <span t-if="forced_vat" t-esc="forced_vat" />
                                    <span t-else="" t-field="company.vat" />
                                </li>
                                <li t-if="company.phone">Tel:
                                    <span class="o_force_ltr" t-field="company.phone" />
                                </li>
                                <li t-if="company.email">
                                    <span t-field="company.email" />
                                </li>
                                <li t-if="company.website">
                                    <span t-field="company.website" />
                                </li>
                            </ul>
                        </div>

                        <div class="row" style="font-size: 12px;" t-if="cfdi">
                            <div class="m-0 p-1" style="width: 50%;">
                                <t t-call="l10n_mx_cfdi.cfdi_issuer_data" t-if="cfdi" />
                                <t
                                    t-call="l10n_mx_cfdi.default_issuer_data"
                                    t-else=""
                                />
                            </div>

                            <div class="m-0 p-1" style="width: 50%;">
                                <t
                                    t-call="l10n_mx_cfdi.cfdi_receiver_data"
                                    t-if="cfdi"
                                />
                                <t
                                    t-call="l10n_mx_cfdi.default_receiver_data"
                                    t-else=""
                                />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </xpath>

        <!-- Extend Footer -->
        <div
            t-attf-class="footer o_clean_footer o_company_#{company.id}_layout"
            position="replace"
        >
            <div t-attf-class="footer o_clean_footer o_company_#{company.id}_layout">
                <div class="row" style="font-size: 12px;">
                    <div class="col-11">
                        <span t-field="company.report_footer" />
                        <span t-if="cfdi">
                            Este documento es una representación impresa de un CFDI
                        </span>
                    </div>
                    <div class="col-1">
                        <ul
                            t-if="report_type == 'pdf'"
                            class="list-inline pagenumber float-right text-center"
                        >
                            <li class="list-inline-item">
                                <strong>
                                    <span class="page" />
                                </strong>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </template>

    <template
        id="external_layout_striped"
        inherit_id="web.external_layout_striped"
        priority="99"
    >
        <xpath expr="//div[1]" position="replace">
            <div
                t-attf-class="header o_company_#{company.id}_layout"
                t-att-style="report_header_style"
                position="replace"
            >
                <div class="o_clean_header">
                    <div class="row px-3" t-if="cfdi">
                        <div class="col-8 m-0 p-1">
                            <b class="text-uppercase " t-field="cfdi.type" />
                        </div>
                        <div class="col-4 text-right m-0 p-1">
                            <b>Folio:</b>
                            <span t-out="cfdi.name" />
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-3">
                            <img
                                t-if="cfdi and cfdi.issuer_id.logo_url"
                                t-att-src="cfdi.issuer_id.logo_url"
                                class="img-fluid w-100"
                                style="max-height: 180px !important;"
                            />
                            <img
                                t-if="company.logo and not (cfdi and cfdi.issuer_id.logo_url)"
                                class="img-fluid w-100"
                                t-att-src="image_data_uri(company.logo)"
                                style="max-height: 180px !important;"
                            />
                        </div>
                        <div
                            t-if="not cfdi"
                            class="col-5 offset-1"
                            name="company_address"
                        >
                            <ul class="list-unstyled">
                                <strong>
                                    <li t-if="company.name">
                                        <span t-field="company.name" />
                                    </li>
                                </strong>
                                <li t-if="forced_vat or company.vat">
                                    <t
                                        t-esc="company.country_id.vat_label or 'Tax ID'"
                                    />:
                                    <span t-if="forced_vat" t-esc="forced_vat" />
                                    <span t-else="" t-field="company.vat" />
                                </li>
                                <li t-if="company.phone">Tel:
                                    <span class="o_force_ltr" t-field="company.phone" />
                                </li>
                                <li t-if="company.email">
                                    <span t-field="company.email" />
                                </li>
                                <li t-if="company.website">
                                    <span t-field="company.website" />
                                </li>
                            </ul>
                        </div>

                        <div class="row" style="font-size: 12px;" t-if="cfdi">
                            <div class="m-0 p-1" style="width: 50%;">
                                <t t-call="l10n_mx_cfdi.cfdi_issuer_data" t-if="cfdi" />
                                <t
                                    t-call="l10n_mx_cfdi.default_issuer_data"
                                    t-else=""
                                />
                            </div>

                            <div class="m-0 p-1" style="width: 50%;">
                                <t
                                    t-call="l10n_mx_cfdi.cfdi_receiver_data"
                                    t-if="cfdi"
                                />
                                <t
                                    t-call="l10n_mx_cfdi.default_receiver_data"
                                    t-else=""
                                />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </xpath>

        <div t-if="report_type == 'pdf'" class="text-muted" position="before">
            <div t-if="cfdi" class="col-12" style="font-size: 12px;">
                Este documento es una representación impresa de un CFDI
            </div>
        </div>
    </template>

    <template
        id="external_layout_boxed"
        inherit_id="web.external_layout_boxed"
        priority="99"
    >
        <xpath expr="//div[1]" position="replace">
            <div
                t-attf-class="header o_company_#{company.id}_layout"
                t-att-style="report_header_style"
                position="replace"
            >
                <div class="o_clean_header">
                    <div class="row px-3" t-if="cfdi">
                        <div class="col-8 m-0 p-1">
                            <b class="text-uppercase " t-field="cfdi.type" />
                        </div>
                        <div class="col-4 text-right m-0 p-1">
                            <b>Folio:</b>
                            <span t-out="cfdi.name" />
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-3">
                            <img
                                t-if="cfdi and cfdi.issuer_id.logo_url"
                                t-att-src="cfdi.issuer_id.logo_url"
                                class="img-fluid w-100"
                                style="max-height: 180px !important;"
                            />
                            <img
                                t-if="company.logo and not (cfdi and cfdi.issuer_id.logo_url)"
                                class="img-fluid w-100"
                                t-att-src="image_data_uri(company.logo)"
                                style="max-height: 180px !important;"
                            />
                        </div>
                        <div
                            t-if="not cfdi"
                            class="col-5 offset-1"
                            name="company_address"
                        >
                            <ul class="list-unstyled">
                                <strong>
                                    <li t-if="company.name">
                                        <span t-field="company.name" />
                                    </li>
                                </strong>
                                <li t-if="forced_vat or company.vat">
                                    <t
                                        t-esc="company.country_id.vat_label or 'Tax ID'"
                                    />:
                                    <span t-if="forced_vat" t-esc="forced_vat" />
                                    <span t-else="" t-field="company.vat" />
                                </li>
                                <li t-if="company.phone">Tel:
                                    <span class="o_force_ltr" t-field="company.phone" />
                                </li>
                                <li t-if="company.email">
                                    <span t-field="company.email" />
                                </li>
                                <li t-if="company.website">
                                    <span t-field="company.website" />
                                </li>
                            </ul>
                        </div>

                        <div class="row" style="font-size: 12px;" t-if="cfdi">
                            <div class="m-0 p-1" style="width: 50%;">
                                <t t-call="l10n_mx_cfdi.cfdi_issuer_data" t-if="cfdi" />
                                <t
                                    t-call="l10n_mx_cfdi.default_issuer_data"
                                    t-else=""
                                />
                            </div>

                            <div class="m-0 p-1" style="width: 50%;">
                                <t
                                    t-call="l10n_mx_cfdi.cfdi_receiver_data"
                                    t-if="cfdi"
                                />
                                <t
                                    t-call="l10n_mx_cfdi.default_receiver_data"
                                    t-else=""
                                />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </xpath>

        <div t-if="report_type == 'pdf'" position="before">
            <div t-if="cfdi" class="col-12" style="font-size: 12px;">
                Este documento es una representación impresa de un CFDI
            </div>
        </div>
    </template>

</odoo>
