<?php
    // Exit if accessed directly.
if ( ! defined( 'ABSPATH' ) ) {
    exit;
}
    $featuredImage = get_the_post_thumbnail_url( $fab_item->getID(), 'large' );
    $modal         = $fab_item->get_modal();
    $iconCover     = $modal && $modal->get_navigation()['iconCover'] ? true : false;
?>
<div class="md:flex font-sans gap-4">
    <?php if ( $featuredImage ) : ?>
        <div class="fab-modal-featured-img flex-none w-1/2 relative">
            <img src="<?php echo esc_url( $featuredImage ); ?>"
                alt="<?php echo esc_attr( $fab_item->getTitle() ); ?> Cover"
                class="w-full h-full"
            />
        </div>
    <?php elseif ( $iconCover ) : ?>
        <div class="fab-modal-icon-container cursor-move hidden md:block w-full flex items-center justify-center" style="min-height: 200px; background-color: <?php echo esc_attr( $fab_item->getTemplate()['color'] ); ?>;">
            <i class="<?php echo esc_attr( $fab_item->get_icon_class() ); ?> text-8xl" style="color: <?php echo esc_attr( $fab_item->getTemplate()['icon']['color'] ); ?>;"></i>
        </div>
    <?php endif; ?>
    <div class="fab-modal-content flex-auto">
        <?php echo do_shortcode( $content ); ?>
    </div>
</div>
<style>
    .jconfirm-fab-modal-<?php echo esc_attr( $fab_item->getID() ); ?> .jconfirm-box,
    .jconfirm-fab-modal-<?php echo esc_attr( $fab_item->getID() ); ?> .fab-modal-container {
        overflow: visible !important;
    }
</style>
