title: Sendgrid Dark Mode compatibility with two logos
body: <p>I'm working with Sendgrid, but it has conflicts with the logo in dark mode, my logo is black and I don't want to add a white border to the letters. I have two logos, one black and one white. I need to detect on all devices when it is in dark mode and when it is not.</p>
  <p>On my <code>head</code> html I have:</p>
  <pre><code>&lt;meta name=&quot;color-scheme&quot; content=&quot;light dark&quot;&gt;
  &lt;meta name=&quot;supported-color-schemes&quot; content=&quot;light dark&quot;&gt;
  </code></pre>
  <p>In the css styles I have this:</p>
  <pre><code>    .dark-block { display: none; }
      .dark-logo { display: none; }
      @media (prefers-color-scheme: dark ) {
        .dark-logo { display:inline !important; line-height: auto !important; }
        .light-logo { display:none; display:none !important; }
        .light-block { display:none; }
        .dark-block { display:block; }
        
        body, p, a, td {
            color: #FFFFFF !important;
        }
      }
  </code></pre>
  <p>Then in my html I have the two logos with the class <code>dark-logo / light-log</code>.
  but on iPhone it doesn't work, I have tried Outlook dark mode in Chrome and it works perfectly, on Android Outlook it doesn't work.</p>
  <p>I need help to know how to correctly identify if the theme is in dark or light mode.</p>
  <p>I appreciate the help. Thank you!</p>