Outlook 365 Windows Not Respecting Darkmode Media Query - Email Template - html

Question

For some reason, the text <p> in the footer section of my email template in Outlook 365 Windows is still remaining the color black. This is also happening for the button text too <a> but all other clients are fine when tested.
Here is the media query and footer markup:
#media (prefers-color-scheme: dark) {
body, center, table {
background: #2d2d2d!important;
color: #ffffff!important;
}
.darkmode-footer {
background-color: #7F7CAC!important;
}
.darkmode-social {
background-color: #60C1CB!important;
}
}
<table cellpadding="0" cellspacing="0" border="0" align="center" style="border-spacing: 0px; color: #565656; font-family: 'Lato', sans-serif, Arial, Helvitica!important; background-color: #fafdfe; Margin: 0; padding: 0; width: 100%; max-width: 600px;" role="presentation">
<!-- START FOOTER -->
<tr>
<td style="padding: 0;">
<table cellpadding="0" cellspacing="0" border="0" class="darkmode-footer" width="100%" style="border-spacing: 0; background-color: #7F7CAC;" role="presentation">
<tr>
<td height="8" style="background-color: #21c6b8;"></td>
</tr>
<tr>
<td style="padding: 60px 10px 25px 10px; color: #ffffff; text-align: center; font-size: 16px;">
<p style="font-size: 18px; font-weight: bold; padding: 10px 0 5px 0;">Lorum</p>
<p style="font-size: 16px; padding-bottom: 5px;">Lorum</p>
<p style="font-size: 16px; padding-bottom: 5px;">Lorum</p>
<p style="font-size: 16px; padding-bottom: 5px;">Lorum</p>
<p style="font-size: 16px; padding-bottom: 5px;">Lorum</p>
<p style="font-size: 16px; padding-bottom: 5px;">Lorum</p>
<p style="font-size: 16px; padding-bottom: 5px;">Lorum</p>
<p style="font-size: 16px; padding-bottom: 20px;">Lorum</p>
</td>
</tr>
<tr>
</tr>
<tr>
<td height="8" style="background-color: #21c6b8;"></td>
</tr>
</table>
</td>
</tr>
<!-- END FOOTER -->
</table>
And here is a snippet of the button markup:
<tr>
<td align="left" style="padding-left: 10px;">
<table cellpadding="0" cellspacing="0" border="0" align="left" border="0" style="border-spacing: 0;" role="presentation">
<tr>
<td style="border-radius: 10px;" bgcolor="#60C1CB">
Lorum
</td>
</tr>
</table>
</td>
</tr>
I can add more markup if needed.

Answer 1

Outlook on Windows uses Word’s rendering engine and does not support media queries.
The only possible tweak regarding dark mode in this version of Outlook is to use VML gradients. You can read more about it here: https://webdesign.tutsplus.com/tutorials/how-to-fix-outlook-dark-mode-problems--cms-37718