{% set mail_company = company|default('') %}
{% if mail_company is empty and contact is defined and contact %}
    {% set mail_company = contact.company|default('') %}
{% endif %}
<!DOCTYPE html>
<html lang="{{ locale|default('fr') }}">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="x-apple-disable-message-reformatting">
    <title>{% block mail_subject %}{{ mail_company }}{% endblock %}</title>
    <style>
        body, table, td, a {
            -webkit-text-size-adjust: 100%;
            -ms-text-size-adjust: 100%;
        }

        table {
            border-collapse: collapse !important;
        }

        img {
            border: 0;
            height: auto;
            line-height: 100%;
            outline: none;
            text-decoration: none;
            -ms-interpolation-mode: bicubic;
        }

        @media only screen and (max-width: 640px) {
            .email-shell {
                padding: 18px 12px !important;
            }

            .email-card {
                width: 100% !important;
            }

            .email-header,
            .email-body,
            .email-footer {
                padding-left: 22px !important;
                padding-right: 22px !important;
            }

            .email-header {
                padding-top: 28px !important;
                padding-bottom: 22px !important;
            }

            .email-body,
            .email-footer {
                padding-top: 24px !important;
                padding-bottom: 28px !important;
            }

            .email-logo {
                max-width: 148px !important;
                margin-bottom: 18px !important;
            }

            .email-eyebrow {
                font-size: 10px !important;
                letter-spacing: 0.28em !important;
            }

            .email-title {
                font-size: 28px !important;
                line-height: 1.18 !important;
            }

            .email-block {
                padding: 16px 18px !important;
            }

            .email-button a {
                display: block !important;
                padding: 17px 22px !important;
                font-size: 12px !important;
            }

            .email-line-label,
            .email-line-value {
                display: block !important;
                width: 100% !important;
                padding-left: 0 !important;
                padding-right: 0 !important;
            }

            .email-line-value {
                padding-top: 8px !important;
                white-space: normal !important;
            }

            .email-product-name,
            .email-product-price,
            .detail-label,
            .detail-value {
                display: block !important;
                width: 100% !important;
                box-sizing: border-box !important;
                padding-left: 0 !important;
                padding-right: 0 !important;
            }

            .email-product-price {
                padding-top: 0 !important;
                text-align: left !important;
                white-space: normal !important;
            }

            .detail-label {
                padding-bottom: 2px !important;
            }

            .detail-value {
                padding-top: 2px !important;
            }

            .email-actions td {
                display: block !important;
                width: 100% !important;
                box-sizing: border-box !important;
                padding: 0 0 10px !important;
            }

            .email-actions a {
                display: block !important;
                text-align: center !important;
            }
        }
    </style>
    <!--[if mso]>
    <style>
        .email-header {
            background: #fffaf5 !important;
        }
    </style>
    <![endif]-->
</head>
<body bgcolor="#f6efe7" style="margin:0; padding:0; background:#f6efe7; color:#3f2f24; font-family:Arial, Helvetica, sans-serif;">
{% set preheader_content %}{% block mail_preheader %}{{ email_preheader|default('') }}{% endblock %}{% endset %}
{% if preheader_content|trim is not empty %}
    <div style="display:none; max-height:0; max-width:0; overflow:hidden; opacity:0; color:transparent; mso-hide:all;">
        {{ preheader_content|raw }}
    </div>
    <div style="display:none; max-height:0; max-width:0; overflow:hidden; mso-hide:all;" aria-hidden="true">
        &#847; &zwnj; &nbsp; &#847; &zwnj; &nbsp; &#847; &zwnj; &nbsp; &#847; &zwnj; &nbsp;
    </div>
{% endif %}
<table role="presentation" width="100%" cellspacing="0" cellpadding="0" bgcolor="#f6efe7" style="width:100%; background:#f6efe7; margin:0; padding:0;">
    <tr>
        <td class="email-shell" align="center" style="padding:28px 16px;">
            <table role="presentation" width="680" cellspacing="0" cellpadding="0" bgcolor="#fffdf9" class="email-card" style="width:100%; max-width:680px; background:#fffdf9; border:1px solid #eadfce;">
                <tr>
                    <td height="14" bgcolor="#3f2f24" style="height:14px; background:#3f2f24;"></td>
                </tr>
                <tr>
                    <td class="email-header" bgcolor="#fffaf5" style="padding:34px 42px 24px; text-align:center; background-color:#fffaf5; background-image:linear-gradient(180deg,#fffaf5 0%,#f8f0e7 100%);">
                        {% if contact is defined and contact and contact.image and contact.image.path %}
                            <img
                                src="{{ absolute_url(asset(contact.image.path)|imagine_filter('logo_email_filter')) }}"
                                alt="{{ contact.image.title ?: mail_company }}"
                                width="170"
                                class="email-logo"
                                style="display:block; width:100%; max-width:170px; margin:0 auto 20px;"
                            >
                        {% elseif mail_company is not empty %}
                            <div style="margin:0 0 18px; font-family:Georgia, 'Times New Roman', serif; font-size:22px; line-height:1.2; color:#3f2f24;">{{ mail_company }}</div>
                        {% endif %}

                        {% set eyebrow_content %}{% block mail_eyebrow %}{% endblock %}{% endset %}
                        {% if eyebrow_content|trim is not empty %}
                            <div class="email-eyebrow" style="font-size:11px; letter-spacing:0.32em; text-transform:uppercase; color:#8a6a2f;">{{ eyebrow_content|raw }}</div>
                        {% endif %}

                        <h1 class="email-title" style="margin:16px 0 0; font-family:Georgia, 'Times New Roman', serif; font-size:38px; line-height:1.08; font-weight:400; color:#3f2f24;">
                            {% block mail_heading %}{% endblock %}
                        </h1>

                        {% set subtitle_content %}{% block mail_header_extra %}{% endblock %}{% endset %}
                        {% if subtitle_content|trim is not empty %}
                            <div style="margin:14px auto 0; max-width:520px; font-size:15px; line-height:1.7; color:#6e5848;">
                                {{ subtitle_content|raw }}
                            </div>
                        {% endif %}
                    </td>
                </tr>
                <tr>
                    <td class="email-body" style="padding:34px 42px; font-size:16px; line-height:1.75; color:#6e5848;">
                        {% block mail_body %}{% endblock %}
                    </td>
                </tr>
                <tr>
                    <td class="email-footer" bgcolor="#fffaf5" style="padding:24px 42px 30px; background:#fffaf5; border-top:1px solid #eadfce; text-align:center;">
                        {% if mail_company is not empty %}
                            <div style="font-size:11px; letter-spacing:0.28em; text-transform:uppercase; color:#8a6a2f;">{{ mail_company }}</div>
                        {% endif %}
                        {% if contact is defined and contact %}
                            <div style="margin:12px 0 0; font-size:13px; line-height:1.8; color:#8c7564;">
                                {% if contact.address %}{{ contact.address }}<br>{% endif %}
                                {% if contact.postal or contact.city %}{{ contact.postal|default('') }} {{ contact.city|default('') }}<br>{% endif %}
                                {% if contact.phone1 %}{{ contact.phone1 }}<br>{% endif %}
                                {% if contact.emailFrom %}{{ contact.emailFrom }}{% endif %}
                            </div>
                        {% endif %}
                        {% set footer_extra_content %}{% block mail_footer_extra %}{% endblock %}{% endset %}
                        {% if footer_extra_content|trim is not empty %}
                            <div style="margin:18px 0 0; padding:18px 0 0; border-top:1px solid #eadfce; font-size:12px; line-height:1.7; color:#8c7564;">
                                {{ footer_extra_content|raw }}
                            </div>
                        {% endif %}
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>
</body>
</html>
