<div class="tvd-nm-modal-step">
	<div class="tvd-modal-content">
		<h3 class="tvd-modal-title"><?php echo __( "Email Delivery Setup", 'thrive-dash' ) ?></h3>
		<p id="tvd-nm-connections-text"><?php echo __( 'Your existing connections', 'thrive-dash' ) ?></p>
		<ul id="tvd-nm-connected-list"></ul>
		<button class="tvd-btn-flat-blue tvd-btn-flat tvd-waves-effect tvd-nm-modal-next-step">
			<span class="tvd-icon-plus tvd-icon-small"></span><?php echo __( 'Add New', 'thrive-dash' ) ?>
		</button>
	</div>
	<div class="tvd-modal-footer">
		<div class="tvd-row">
			<div class="tvd-col tvd-s12">
				<a href="javascript:void(0)"
				   class="tvd-waves-effect tvd-waves-light tvd-btn tvd-btn-green tvd-right tvd-modal-close">
					<?php echo __( 'OK', 'thrive-dash' ) ?>
				</a>
			</div>
		</div>
	</div>
</div>
<div class="tvd-nm-modal-step">
	<div class="tvd-modal-content">
		<h3 class="tvd-modal-title"><?php echo __( "Email Delivery Setup", 'thrive-dash' ) ?></h3>
		<p><?php echo __( 'Select the email delivery service you want to use for Send Email Notification Actions. Integrating one of these services ensures your emails get delivered without you needing to deal with email server setups and spam protection', 'thrive-dash' ) ?></p>
		<div id="tvd-nm-connections-list" class="tvd-row"></div>
	</div>
	<div class="tvd-modal-footer">
		<div class="tvd-row">
			<div class="tvd-col tvd-s12 tvd-m6">
				<a href="javascript:void(0)" class="tvd-btn-flat-blue tvd-btn-flat tvd-waves-effect tvd-nm-modal-prev-step">
					<?php echo __( 'Back', 'thrive-dash' ) ?>
				</a>
			</div>
		</div>
	</div>
</div>
<div class="tvd-nm-modal-step">
	<div class="tvd-modal-content">
		<h3 class="tvd-modal-title"><?php echo __( "Email Delivery Setup", 'thrive-dash' ) ?></h3>
		<p><?php echo __( "Fill the form's fields with your credentials and click the Connect button to establish the connection.", 'thrive-dash' ) ?></p>
		<div id="tvd-nm-connection-form" class="tvd-row tvd-collapse"></div>
	</div>
	<div class="tvd-modal-footer">
		<div class="tvd-row">
			<div class="tvd-col tvd-s12 tvd-m6">
				<a href="javascript:void(0)" class="tvd-btn-flat tvd-btn-flat-secondary tvd-btn-flat-dark tvd-waves-effect tvd-nm-modal-prev-step">
					<?php echo __( 'Cancel', 'thrive-dash' ) ?>
				</a>
			</div>
			<div class="tvd-col tvd-s12 tvd-m6">
				<a href="javascript:void(0)"
				   class="tvd-waves-effect tvd-waves-light tvd-btn tvd-btn-green tvd-right tvd-nm-save-connection">
					<?php echo __( 'Connect', 'thrive-dash' ) ?>
				</a>
			</div>
		</div>
	</div>
</div>
<?php foreach ( Thrive_Dash_List_Manager::get_available_apis( false, [ 'include_types' => [ 'email' ] ] ) as $key => $api ) : ?>
	<?php /** @var $api Thrive_Dash_List_Connection_Abstract */ ?>
	<div class="tvd-nm-connection-form" data-key="<?php echo $key ?>" style="display: none">
		<?php echo $api->output_setup_form() ?>
	</div>
<?php endforeach; ?>
