<style>
  /* Hide WooCommerce section with template styling */
  .wc-settings-email-color-palette-header,
  .wc-settings-email-color-palette-header + .form-table,
  .wc-settings-email-color-palette-title,
  .wc-settings-email-color-palette-buttons,
  .wc-settings-email-color-palette-buttons + .form-table,
  #email_template_options-description,
  #email_template_options-description + .form-table {
    opacity: 0.1;
    pointer-events: none;
  }

  /* Used as an anchor for the overlay */
  .mailpoet-woocommerce-email-overlay-container {
    position: relative;
  }

  /* Position MailPoet buttons over hidden table */
  .mailpoet-woocommerce-email-overlay {
    left: 0;
    max-width: 100%;
    text-align: left;
    position: absolute;
    text-align: center;
    top: 200px;
    width: 640px;
    z-index: 1;
  }
</style>

<div class="mailpoet-woocommerce-email-overlay-container">
  <div class="mailpoet-woocommerce-email-overlay">
    <a class="button button-primary"
      href="?page=mailpoet-newsletter-editor&id=<%= woocommerce_template_id %>"
      data-automation-id="mailpoet_woocommerce_customize"
    >
      <%= _x('Customize with MailPoet', 'Button in WooCommerce settings page') %>
    </a>
    <br>
    <br>
    <a href="?page=mailpoet-settings#woocommerce" data-automation-id="mailpoet_woocommerce_disable">
      <%= _x('Disable MailPoet customizer', 'Link from WooCommerce plugin to MailPoet') %>
    </a>
  </div>
</div>