<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{{ subject|default('Message from Ask Eve AI') }}</title>
    <style>
        .email-container {
            font-family: Tahoma, Geneva, sans-serif;
            max-width: 600px;
            margin: 0 auto;
        }
        .header {
            text-align: center;
            padding: 20px;
        }
        .header img {
            max-width: 200px;
        }
        .footer {
            text-align: center;
            padding: 20px;
            background-color: #f8f9fa;
        }
        .signature {
            font-style: italic;
            margin: 20px 0;
        }
        .footer-text {
            font-size: 12px;
            color: #666;
        }
        .footer img {
            max-width: 100%;
            height: auto;
            width: 600px; /* Match the container width */
            display: block;
            margin: 20px auto;
        }

        @media only screen and (max-width: 600px) {
            .footer img {
                width: 100%;
            }
        }
        .social-links {
            margin: 20px 0;
        }
        .social-links a {
            margin: 0 10px;
            color: #0066cc;
            text-decoration: none;
        }
        .info-box {
            background-color: #f8f9fa;
            border-left: 4px solid #0066cc;
            padding: 15px;
            margin: 20px 0;
        }
        .warning-box {
            background-color: #fff3cd;
            border-left: 4px solid #ffc107;
            padding: 15px;
            margin: 20px 0;
        }
    </style>
</head>
<body>
    <div class="email-container">
        <div class="header">
            <img src="https://askeveai.com/wp-content/uploads/2024/07/Logo-Square-small.png" alt="Ask Eve AI Logo">
        </div>

        <div class="content-wrapper">
            {% block content %}{% endblock %}
        </div>

        <div class="footer">
            <div class="signature">
                Best regards,<br>
                Evie
            </div>

            {% if promo_image_url %}
            <a href="https://www.askeveai.com">
                <img src="{{ promo_image_url }}" alt="Ask Eve AI Promotion">
            </a>
            {% endif %}

            <div class="social-links">
                <a href="https://twitter.com/askeveai">Twitter</a>
                <a href="https://linkedin.com/company/ask-eve-ai">LinkedIn</a>
            </div>

            <div class="footer-text">
                © {{ year }} Ask Eve AI. All rights reserved.<br>
                <a href="https://www.askeveai.com/privacy">Privacy Policy</a> |
                <a href="https://www.askeveai.com/terms">Terms of Service</a>
                {% if unsubscribe_url %}
                | <a href="{{ unsubscribe_url }}">Unsubscribe</a>
                {% endif %}
            </div>
        </div>
    </div>
</body>
</html>