From 30000857c11c111a081c1ab0f44446147eda6f5d Mon Sep 17 00:00:00 2001
From: nekenny <nekenny@ya.ru>
Date: Fri, 3 Apr 2026 01:19:33 +0500
Subject: [PATCH] feat: add Contact Form 7 forms and gated content modal

---
 .../themes/bitwms-child/inc/enqueue.php       |  3 ++
 .../themes/bitwms-child/js/gated-content.js   | 38 +++++++++++++++++++
 wp-content/themes/bitwms-child/style.css      | 12 ++++++
 3 files changed, 53 insertions(+)
 create mode 100644 wp-content/themes/bitwms-child/js/gated-content.js

diff --git a/wp-content/themes/bitwms-child/inc/enqueue.php b/wp-content/themes/bitwms-child/inc/enqueue.php
index 632754f..944bb5e 100644
--- a/wp-content/themes/bitwms-child/inc/enqueue.php
+++ b/wp-content/themes/bitwms-child/inc/enqueue.php
@@ -27,6 +27,9 @@ function bitwms_enqueue_scripts() {
         true               // load in footer
     );
 
+    // Gated content modal — loaded on all pages.
+    wp_enqueue_script( 'bitwms-gated-content', $theme_uri . '/js/gated-content.js', [], $theme_version, true );
+
     // Content feed AJAX filter — front page only.
     if ( is_front_page() ) {
         wp_enqueue_script(
diff --git a/wp-content/themes/bitwms-child/js/gated-content.js b/wp-content/themes/bitwms-child/js/gated-content.js
new file mode 100644
index 0000000..7f0e5c4
--- /dev/null
+++ b/wp-content/themes/bitwms-child/js/gated-content.js
@@ -0,0 +1,38 @@
+document.addEventListener('DOMContentLoaded', function () {
+    var modal = document.getElementById('gated-modal');
+    if (!modal) return;
+
+    var overlay = modal.querySelector('.gated-modal__overlay');
+    var closeBtn = modal.querySelector('.gated-modal__close');
+
+    // Open modal on [data-gated] click
+    document.addEventListener('click', function (e) {
+        var trigger = e.target.closest('[data-gated]');
+        if (!trigger) return;
+        e.preventDefault();
+        var materialId = trigger.dataset.gated;
+        var downloadUrl = trigger.dataset.downloadUrl;
+        // Set hidden field + store download URL
+        var hiddenField = modal.querySelector('input[name="material-id"]');
+        if (hiddenField) hiddenField.value = materialId;
+        modal.dataset.downloadUrl = downloadUrl || '';
+        modal.classList.add('gated-modal--open');
+        document.body.style.overflow = 'hidden';
+    });
+
+    function closeModal() {
+        modal.classList.remove('gated-modal--open');
+        document.body.style.overflow = '';
+    }
+
+    if (closeBtn) closeBtn.addEventListener('click', closeModal);
+    if (overlay) overlay.addEventListener('click', closeModal);
+
+    // After CF7 successful submit — trigger download
+    document.addEventListener('wpcf7mailsent', function () {
+        if (modal.classList.contains('gated-modal--open') && modal.dataset.downloadUrl) {
+            window.open(modal.dataset.downloadUrl, '_blank');
+            closeModal();
+        }
+    });
+});
diff --git a/wp-content/themes/bitwms-child/style.css b/wp-content/themes/bitwms-child/style.css
index 65124a6..13b3035 100644
--- a/wp-content/themes/bitwms-child/style.css
+++ b/wp-content/themes/bitwms-child/style.css
@@ -1704,3 +1704,15 @@ body.sidebar-overlay::after {
         width: 100%;
     }
 }
+
+/* ==========================================================================
+   Gated Content Modal
+   ========================================================================== */
+
+.gated-modal { display: none; position: fixed; inset: 0; z-index: 2000; align-items: center; justify-content: center; }
+.gated-modal--open { display: flex; }
+.gated-modal__overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.5); }
+.gated-modal__content { position: relative; background: var(--color-white); padding: 48px; max-width: 480px; width: 90%; z-index: 1; }
+.gated-modal__close { position: absolute; top: 16px; right: 16px; background: none; border: none; font-size: 1.5rem; cursor: pointer; color: var(--color-gray-text); }
+.gated-form input[type="text"], .gated-form input[type="email"] { width: 100%; padding: 12px 16px; border: 2px solid var(--color-gray-light); border-radius: 0; margin-bottom: 12px; font-size: 1rem; box-sizing: border-box; }
+.gated-form input:focus { outline: none; border-color: var(--color-primary); }