<!DOCTYPE html>
<html lang="en">

<head>

    <!-- Required meta tags -->
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />

    <!-- Bootstrap CSS -->
    <meta name="csrf-token" content="<?php echo e(csrf_token()); ?>">
    <link rel="stylesheet" href="<?php echo e(asset('front/css/all.min.css')); ?>" />
    <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
    <link rel="stylesheet" href="<?php echo e(asset('front/css/custom.min.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('front/css/responsive.css')); ?>" />
    <link href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/2.0.1/css/toastr.css" rel="stylesheet"/>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js" integrity="sha512-3gJwYpMe3QewGELv8k/BX9vcqhryRdzRMxVfq6ngyWXwo03GFEzjsUm8Q7RZcHPHksttq7/GFoxjCVUjkjvPdw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>

    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
    <style>
        .popup {
            display: none;
            position: fixed;
            inset: 0;
            padding: 2rem;
            border: 1px solid #ccc;
            box-shadow: 0 0 30px 0 rgba(0,0,0,0.2);
            border: 0;
            z-index: 999;
            background: rgba(0,0,0,0.75);
            backdrop-filter: blur(2px);
            width: 100%;
            /*display: grid;*/
            place-items: center;
        }
        .popup   .popup-inner{
            width: 100%;
            max-width: 650px;
            background-color: #fff;
            padding: 2rem;
            border: 1px solid #ccc;
            box-shadow: 0 0 30px 0 rgba(0,0,0,0.2);
            border: 0;
            position: relative;
        }
        .popup button.close{
            position: absolute;
            top: -1rem;
            right: -1rem;
            padding: 0;
            background: white;
            border-radius: 50%;
            width: 30px;
            aspect-ratio: 1;
            opacity: 1;
            border: 1px solid black
        }
        .popup .popup-body {
            border: 1px solid black;
            padding: 2rem;
        }
        .popup .popup-body p{
            text-align: center;
            font-size: 1.125rem;
            margin:1rem 0 2rem;
        }
        .popup form {
            display: flex;
            align-items: center;
            width: 100%;
            gap: 1rem;
        }

        .popup form .form-group {
            margin: 0;
            flex: 1;
        }

        .popup form .form-group input.form-control:focus {
            box-shadow: none;
        }

        .popup form button {
            padding: 0.75rem 2rem;
        }

        .popup form .form-group input.form-control {
            height: 3.125rem;
        }
    </style>


    <div class="popup" id="popup">
        <div class="popup-inner">
            <button type="button" class="close" onclick="closePopup()">&times;</button>

            <div class="popup-body">
                <p>Subscribe to our newsletter and unlock exclusive promotions and discounts!

                    Simply put in your email to stay in the loop</p>
                <form action="<?php echo e(route('popup.submit')); ?>"method="POST">
                    <?php echo csrf_field(); ?>
                    <div class="form-group">
                        <input type="text" class="form-control"placeholder="Email Address" required>
                    </div>
                    <button type="submit" class="btn btn-primary">Subscribe</button>
                </form>
            </div>
        </div>
    </div>


    <script>
        document.addEventListener("DOMContentLoaded", function() {
            setTimeout(function() {
                if (!localStorage.getItem("popupDisplayed")) {
                    displayPopup();
                    localStorage.setItem("popupDisplayed", "true");
                }
            }, 5000);
        });

        function displayPopup() {
            var popup = document.getElementById("popup");
            popup.style.display = "grid";
        }

        function closePopup() {
            var popup = document.getElementById("popup");
            popup.style.display = "none";
        }

    </script>
<?php /**PATH /home/servicedemoweb/public_html/premiere-deals/resources/views/front/layout/header.blade.php ENDPATH**/ ?>