jQuery(document).ready(function ($) {
    // Apply dynamic sizing from localized settings
    if (typeof smarwpwcsearchVars !== 'undefined') {
        var width = parseInt(smarwpwcsearchVars.inputWidth, 10) || 300;
        var height = parseInt(smarwpwcsearchVars.inputHeight, 10) || 40;
        var iconSize = parseInt(smarwpwcsearchVars.iconSize, 10) || Math.round(height * 0.75);

        var $container = $('.ai-search-container');
        var $input = $container.find('input[type="text"]');
        var $button = $container.find('button');
        var $icon = $container.find('.ai-search-icon');

        $container.css({
            '--ai-search-input-width': width + 'px',
            '--ai-search-input-height': height + 'px',
            '--ai-search-icon-size': iconSize + 'px'
        });

        $input.css({
            width: width + 'px',
            height: height + 'px'
        });

        $button.css({
            height: height + 'px'
        });

        $icon.css({
            'font-size': iconSize + 'px',
            'line-height': height + 'px'
        });
    }

    // Optional: add a simple "searching" spinner when form submits
    $('#ai-search-form').on('submit', function () {
        var $form = $(this);
        var $spinner = $form.find('.ai-search-spinner');
        if ($spinner.length) {
            $spinner.show();
        }
    });
});