<div class="modal fade" id="saveQueryModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-sm modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header bg-primary text-white py-2">
                <h6 class="modal-title"><i class="bi bi-save me-2"></i>Save Query</h6>
                <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close save query"></button>
            </div>
            <div class="modal-body py-2">
                <label class="form-label small mb-1">Query Name</label>
                <input type="text" class="form-control form-control-sm" id="querySaveName" placeholder="e.g., customer_orders">
                <small class="text-muted">Leave blank to use “Untitled”.</small>
            </div>
            <div class="modal-footer py-2">
                <button type="button" class="btn btn-sm btn-secondary" data-bs-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-sm btn-primary" id="btnSaveQueryConfirm">Save</button>
            </div>
        </div>
    </div>
</div>
