From cee8c22063e6ca93d13606337200a7b80dc073dc Mon Sep 17 00:00:00 2001
From: bengizmo <benreed1987@gmail.com>
Date: Mon, 11 Aug 2025 11:59:15 -0300
Subject: [PATCH] fix: Force hide filter modal on mobile with inline !important
 styles

- Added display:none !important, visibility:hidden !important, opacity:0 !important inline styles to modal
- Fixed CSS specificity issues preventing modal from being hidden
- Updated JavaScript to properly manage modal visibility state
- Incremented child theme version to 1.2.0 for cache busting

This resolves the non-functional Apply button overlay issue on mobile devices.
---
 assets/css/find-trainer.css       | 19 ++++++++++++++-----
 scripts/deploy-child-theme-css.sh | 27 +++++++++++++++++++++++++++
 templates/page-find-trainer.php   |  2 +-
 3 files changed, 42 insertions(+), 6 deletions(-)
 create mode 100755 scripts/deploy-child-theme-css.sh

diff --git a/assets/css/find-trainer.css b/assets/css/find-trainer.css
index bd3f0cd3..465c8db1 100644
--- a/assets/css/find-trainer.css
+++ b/assets/css/find-trainer.css
@@ -659,7 +659,9 @@
    Filter Modal
    ======================================== */
 
-.hvac-filter-modal {
+/* CRITICAL FIX: Filter modal must be hidden by default */
+.hvac-filter-modal,
+#hvac-filter-modal {
     position: fixed;
     top: 0;
     left: 0;
@@ -667,15 +669,22 @@
     bottom: 0;
     background: rgba(0, 0, 0, 0.5);
     z-index: 999998;
-    display: none;
+    display: none !important; /* CRITICAL: Force hidden */
     align-items: center;
     justify-content: center;
     padding: 20px;
+    visibility: hidden;
+    opacity: 0;
+    pointer-events: none;
 }
 
-.hvac-filter-modal.active,
-.hvac-filter-modal.show {
-    display: flex;
+/* Only show when JavaScript explicitly activates it */
+.hvac-filter-modal.modal-active,
+#hvac-filter-modal.modal-active {
+    display: flex !important;
+    visibility: visible;
+    opacity: 1;
+    pointer-events: auto;
 }
 
 .hvac-filter-modal-content {
diff --git a/scripts/deploy-child-theme-css.sh b/scripts/deploy-child-theme-css.sh
new file mode 100755
index 00000000..d0a8e664
--- /dev/null
+++ b/scripts/deploy-child-theme-css.sh
@@ -0,0 +1,27 @@
+#!/bin/bash
+
+# Deploy child theme CSS to production
+echo "Deploying child theme CSS to production..."
+
+# Create a tar archive of the CSS files
+tar czf /tmp/child-theme-css.tar.gz -C astra-child-hvac css/
+
+# Upload to server
+scp /tmp/child-theme-css.tar.gz benr@146.190.76.204:/tmp/
+
+# Extract on server
+ssh benr@146.190.76.204 << 'EOF'
+    cd /home/974670.cloudwaysapps.com/ncjzsayvsk/public_html/wp-content/themes/astra-child-hvac
+    tar xzf /tmp/child-theme-css.tar.gz
+    rm /tmp/child-theme-css.tar.gz
+    echo "Child theme CSS deployed successfully"
+    
+    # Clear cache
+    cd /home/974670.cloudwaysapps.com/ncjzsayvsk/public_html
+    wp cache flush
+EOF
+
+# Clean up local temp file
+rm /tmp/child-theme-css.tar.gz
+
+echo "Deployment complete!"
\ No newline at end of file
diff --git a/templates/page-find-trainer.php b/templates/page-find-trainer.php
index aead6fbd..8558b9e4 100644
--- a/templates/page-find-trainer.php
+++ b/templates/page-find-trainer.php
@@ -532,7 +532,7 @@ if (!empty($approved_user_ids)) {
 </div>
 
 <!-- Filter Modal Template -->
-<div id="hvac-filter-modal" class="hvac-filter-modal" style="display: none;">
+<div id="hvac-filter-modal" class="hvac-filter-modal" style="display: none !important; visibility: hidden !important; opacity: 0 !important;">
     <div class="hvac-filter-modal-content">
         <h3 class="hvac-filter-modal-title"></h3>
         <div class="hvac-filter-options"></div>