jQuery(document).ready(function ($) {
    $('#search-icon').on('click keydown', function (event) {
        // Check if the event is a click or an "Enter" or "Space" key press
        if (event.type === 'click' || event.key === 'Enter' || event.key === ' ') {
            $('#search-form-container').toggleClass('visible');
            
            // Check if the search form is now visible
            if ($('#search-form-container').hasClass('visible')) {
                // Find the first input field within the search form and focus it
                $('#search-form-container').find('input[type="search"]').focus();
            }

            // Prevent default action for "Space" to avoid scrolling the page
            event.preventDefault();
        }
    });
});



// icons
jQuery(document).ready(function ($) {
    $('#share-icon').on('click', function () {
        $('#icons-container').toggle();
    });

    // Add a window resize event listener to reset the visibility on view change
    $(window).on('resize', function () {
        var windowWidth = $(window).width();
        if (windowWidth > 768) { // Assuming 768px is the breakpoint for mobile to desktop
            $('#icons-container').show(); // Show search form container on desktop view
        } else {
            $('#icons-container').hide(); // Hide search form container on mobile view
        }
    });

    // Trigger resize event to set initial state
    $(window).trigger('resize');
});

// JavaScript to toggle phone number visibility on click or keyboard
const showNumberIcon = document.getElementById('show-number');
const phoneNumber = document.getElementById('phone-number');

// Function to toggle the phone number display
function togglePhoneNumber() {
    if (phoneNumber.style.display === 'none' || phoneNumber.style.display === '') {
        phoneNumber.style.display = 'block';  // Show number
    } else {
        phoneNumber.style.display = 'none';  // Hide number
    }
}

// Event listener for mouse click
showNumberIcon.addEventListener('click', togglePhoneNumber);

// Event listener for keyboard navigation (Enter or Space key)
showNumberIcon.addEventListener('keydown', function(event) {
    if (event.key === 'Enter' || event.key === ' ') {
        event.preventDefault();  // Prevent scrolling for space key
        togglePhoneNumber();
    }
});


// JavaScript to toggle appointment button visibility on click or keyboard, but only on mobile
const toggleAppointmentIcon = document.getElementById('toggle-appointment');
const appointmentButton = document.getElementById('appointment-button');

// Function to check if the screen width is mobile (768px or below)
function isMobileView() {
    return window.innerWidth <= 768;
}

// Function to toggle the appointment button display
function toggleAppointment() {
    if (isMobileView()) { // Only execute if it's mobile view
        if (appointmentButton.style.display === 'none' || appointmentButton.style.display === '') {
            appointmentButton.style.display = 'block';  // Show button
        } else {
            appointmentButton.style.display = 'none';  // Hide button
        }
    }
}

// Event listener for mouse click
toggleAppointmentIcon.addEventListener('click', toggleAppointment);

// Event listener for keyboard navigation (Enter or Space key)
toggleAppointmentIcon.addEventListener('keydown', function(event) {
    if (event.key === 'Enter' || event.key === ' ') {
        event.preventDefault();  // Prevent scrolling for space key
        toggleAppointment();
    }
});