.elementor-1054906 .elementor-element.elementor-element-59ed85c8{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--padding-top:5px;--padding-bottom:5px;--padding-left:5px;--padding-right:5px;}.elementor-1054906 .elementor-element.elementor-element-59ed85c8:not(.elementor-motion-effects-element-type-background), .elementor-1054906 .elementor-element.elementor-element-59ed85c8 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F7FAFC;}.elementor-1054906 .elementor-element.elementor-element-191c508f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--border-radius:16px 16px 16px 16px;box-shadow:0px 4px 24px 0px rgba(0,0,0,0.10);}.elementor-1054906 .elementor-element.elementor-element-191c508f:not(.elementor-motion-effects-element-type-background), .elementor-1054906 .elementor-element.elementor-element-191c508f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-1054906 .elementor-element.elementor-element-59dc02e7{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:center;--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-1054906 .elementor-element.elementor-element-a7c7fbc{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;}#elementor-popup-modal-1054906 .dialog-widget-content{animation-duration:1s;background-color:#F8F3EF;}#elementor-popup-modal-1054906{background-color:#000000B3;justify-content:center;align-items:center;pointer-events:all;}#elementor-popup-modal-1054906 .dialog-message{width:530px;height:auto;}#elementor-popup-modal-1054906 .dialog-close-button{display:flex;top:0%;font-size:15px;}body:not(.rtl) #elementor-popup-modal-1054906 .dialog-close-button{right:100%;}body.rtl #elementor-popup-modal-1054906 .dialog-close-button{left:100%;}#elementor-popup-modal-1054906 .dialog-close-button i{color:#FFFFFF;}#elementor-popup-modal-1054906 .dialog-close-button svg{fill:#FFFFFF;}@media(min-width:768px){.elementor-1054906 .elementor-element.elementor-element-191c508f{--width:520px;}}@media(max-width:1024px){#elementor-popup-modal-1054906 .dialog-message{width:370px;}}@media(max-width:767px){#elementor-popup-modal-1054906 .dialog-message{width:320px;}}/* Start custom CSS for html, class: .elementor-element-a7c7fbc */<style>
.iqra-form-wrapper {
    background: #fff; padding: 25px; border-radius: 15px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05); font-family: 'Poppins', sans-serif;
}
.upload-section {
    border: 2px dashed #ddd; padding: 30px; text-align: center;
    border-radius: 12px; cursor: pointer; margin-bottom: 20px;
}
.field-row { display: flex; gap: 15px; margin-bottom: 15px; }
.field-col { flex: 1; }
.iqra-form-wrapper label { font-size: 13px; font-weight: 600; display: block; margin-bottom: 5px; }
.iqra-form-wrapper input, .iqra-form-wrapper select, .iqra-form-wrapper textarea {
    width: 100%; padding: 10px; border: 1px solid #eee; border-radius: 8px; font-size: 14px;
}
#submitBtn {
    background: #FF6B35; color: #fff; border: none; width: 100%;
    padding: 15px; border-radius: 10px; font-weight: 700; cursor: pointer; margin-top: 15px;
}
.success-msg { color: #28a745; text-align: center; margin-top: 10px; font-weight: 600; }
.error-msg { color: #dc3545; text-align: center; margin-top: 10px; font-weight: 600; }

@media (max-width: 600px) { .field-row { flex-direction: column; } }
</style>

<script>
document.getElementById('catch_photo').onchange = function() {
    document.getElementById('preview_name').innerText = this.files[0].name;
};

document.getElementById('catchUploadForm').onsubmit = async (e) => {
    e.preventDefault();
    let btn = document.getElementById('submitBtn');
    let msg = document.getElementById('msgBox');
    btn.innerText = "SUBMITTING..."; btn.disabled = true;

    let formData = new FormData(e.target);
    formData.append('action', 'submit_custom_catch');

    let response = await fetch('/wp-admin/admin-ajax.php', { method: 'POST', body: formData });
    let result = await response.json();

    if(result.success) {
        msg.innerHTML = `<p class="success-msg">${result.data}</p>`;
        e.target.reset();
        document.getElementById('preview_name').innerText = "";
    } else {
        msg.innerHTML = `<p class="error-msg">${result.data}</p>`;
    }
    btn.innerText = "SUBMIT FOR APPROVAL"; btn.disabled = false;
};
</script>/* End custom CSS */