Responsive E-Mail Template

Hallo zusammen,
aktuell bearbeite ich gerade den Header bzw. Footer des E-Mail Template. Folgenden einfachen Code verwende ich:

<style type="text/css">
    body {
        background: #d4d4cf;
    }
    
    @media all and (max-width: 700px) {  
        img {
            width: 100% !important;
            height: auto !important;
        }
        
        .footer-table {
            width: 100% !important;
        }
        
        .footer-table,
        .footer-table tbody,
        .footer-table tr,
        .footer-table td {
            width: 100% !important;
            display: block !important;
        }
        
        tbody {
            width: 100% !important;
            display: block !important;
        }
    }
}
</style>

<table cellpadding="0" cellspacing="0" border="0" bgcolor="#191919" class="footer-table" style="width: 100%" width="100%">
    <tbody>
        <tr>
            <td class="footer-column">
                dfgdfgdgfdfg
            </td>
            <td class="footer-column">
                dfgdfgdfg
            </td>
            <td class="footer-column">
                dgfdgfdfg
            </td>
        </tr>
        </tbody>
</table>

Jedoch wird beim Betrachten der E-Mails auf dem Smartphone die Tabelle nicht wie gewünscht einspaltig, sondern dreispaltig angezeigt. Auch zusätzliche Tabellen innerhalb von footer-column haben nicht geholfen. Hat Shopware eventuell Probleme Tabellen responsive darzustellen?

E-Mail-Programme ignorieren teils CSS oder haben nur eine rudimentäre CSS-Implementierung.

Das hat mit Shopware nichts zu tun.