Forms Ajax — Gravity

.gf-header h1 font-weight: 600; font-size: 1.7rem; letter-spacing: -0.3px; display: flex; align-items: center; gap: 0.6rem;

.gf-header h1::before content: "⚡"; font-size: 1.8rem; filter: drop-shadow(0 2px 2px rgba(0,0,0,0.2)); gravity forms ajax

<div class="form-container"> <!-- AJAX status message panel (dynamic) --> <div id="ajaxStatusPanel" class="ajax-status hidden-status"> <div class="status-icon" id="statusIcon">📡</div> <div class="status-message" id="statusMessage">Ready — submit the form asynchronously</div> </div> .gf-header h1 font-weight: 600

/* subtle field error highlight */ .field-error border-color: #c73e2f !important; background-color: #fff8f7 !important; .gf-header h1::before content: "⚡"

/* simple footer */ .gf-footer background: #f7fafc; padding: 1rem 2rem; font-size: 0.75rem; text-align: center; color: #4a627a; border-top: 1px solid #e2edf7;

.ajax-status.hidden-status display: none;