// Assuming this script is in 'my-custom-script.js'
jQuery(document).ready(function($) {
    $('#resetSettings').click(function() {
        var settings = JSON.parse('<?php echo json_encode($settings); ?>');
        settings.forEach(function(setting) {
            var id = setting[0];
            var defaultValue = setting[2];
            $('#' + id).val(defaultValue);
            saveSetting(id, defaultValue); 
        });
    });

    $('.style-form input').change(function() {
        var id = $(this).attr('id');
        var value = $(this).val();
        saveSetting(id, value); 
    });

    function saveSetting(settingId, settingValue) {
        $.ajax({
            url: my_ajax_obj.ajax_url,
            type: 'POST',
            data: {
                action: 'save_my_setting',
                nonce: my_ajax_obj.nonce,
                setting_id: settingId,
                setting_value: settingValue,
            },
            success: function(response) {
                // Handle success, maybe update UI to show setting is saved
                console.log('Setting saved', response);
            },
            error: function(error) {
                // Handle error
                console.error('Error saving setting', error);
            }
        });
    }
});
