<?php
if ( ! defined( 'ABSPATH' ) ) {
    exit;
}
?>

<div class="style6 wavypopup-modal" id="wavypopup-<?php echo esc_attr($popup->ID); ?>">
    <div class="wavypopup-overlay"></div>

    <!-- Background video -->
    <video class="wavypopup-bg-video" <?php echo esc_attr( $opacity_style ); ?> autoplay muted <?php echo esc_attr( $loop ); ?> playsinline>
        <source src="<?php echo esc_url( $video_url ); ?>" type="video/mp4">
        Your browser does not support HTML5 video.
    </video>

    <div class="wavypopup-content <?php echo esc_attr($animation_class); ?>" <?php echo esc_attr( $inline_style ); ?> >
        <span class="wavypopup-close">&times;</span>
        <div class="wavypopup-content-inner">
            <?php echo wp_kses_post(apply_filters('the_content', $popup->post_content)); ?>
        </div>
       
         <!-- Background shapes -->
        <div class="bg-shape bg-red"></div>
        <div class="bg-shape bg-yellow"></div>
        <div class="bg-shape bg-black"></div>

        <!-- Halftone dotted triangles -->
        <div class="halftone red"></div>
        <div class="halftone yellow"></div>

        <!-- Decorative circles -->
        <div class="circle small red c1"></div>
        <div class="circle medium yellow c2"></div>
        <div class="circle large red c3"></div>
        <div class="circle small yellow c4"></div>
        <div class="circle medium red c5"></div>
        <div class="circle small yellow c6"></div>
        <div class="circle medium red c7"></div>
        <div class="circle small yellow c8"></div>
        <div class="circle large red c9"></div>
        <div class="circle medium yellow c10"></div>
    </div>
    <?php if ($enable_confetti) : ?>
            <canvas id="wavypopup-confetti"></canvas>
    <?php endif; ?>
</div>