function my_datepicker_limits() {
?>
<script type="text/javascript">
window.addEventListener("DOMContentLoaded", function () { 
(function($) { 
	$('.avia_datepicker').eq(1).parent('p.form_element').css('display', 'none');
	
    setTimeout(function() {
        var $allDatepickers = $('.avia_datepicker');

        // Let's assume that the first avia_datepicker found is the start date
        var $startDateField = $allDatepickers.eq(0);
        // and the second avia_datepicker found the end date
        var $endDateField = $allDatepickers.eq(1);

        // Check whether we have found at least two datepicker fields
        if ($startDateField.length === 0 || $endDateField.length === 0) {
            console.warn('Could not find both Start and End datepicker fields. Ensure they are the first two .avia_datepicker elements.');
            return; // Exit script if not enough fields are found
        }

        // Find the container of the end date field (the <p> element in your structure)
        // This is the parent tag of the input field that also contains the label.
        var $endDateFieldContainer = $endDateField.parent('p.form_element');

        // Fallback if the container is not the <p> tag or is not found
        if (!$endDateFieldContainer.length) {
            $endDateFieldContainer = $endDateField; // Then we only hide the input field itself
        }


        function updateEndDatepickerState() {
            var selectedStartDate = $startDateField.datepicker('getDate');
            

            if (selectedStartDate) {
                // Optional: Add one day to ensure that the end date is at least one day after the start date.
                // then remove the backslashes of the next line
                // selectedStartDate.setDate(selectedStartDate.getDate() + 1);
              
                // If a start date is selected, display the end date field
                $endDateFieldContainer.css('display', 'block'); // Verwendet 'block', da <p> ein Block-Element ist

                $endDateField.datepicker('option', 'minDate', selectedStartDate);

                // Optional: Make sure that the end date is not before the start date.
                var currentEndDate = $endDateField.datepicker('getDate');
                if (currentEndDate && currentEndDate < selectedStartDate) {
                    $endDateField.datepicker('setDate', selectedStartDate);
                }

            } else {
                // If no start date is selected, hide the end date field
                $endDateFieldContainer.css('display', 'none');

                // Reset minDate of the end date date picker (e.g. to “today”)
                $endDateField.datepicker('option', 'minDate', 0);
            }
        }

        if ($startDateField.data('datepicker')) {
            $startDateField.datepicker('option', {
                beforeShowDay: $.datepicker.noWeekends,
                minDate: "+7d", 
                maxDate: "+12m",
                onSelect: function(dateText, inst) {
                    // Update the state when a date is selected
                    updateEndDatepickerState();
                },
                onClose: function(dateText, inst) {
                    // Update the state even when closing the data picker (for robustness)
                    updateEndDatepickerState();
                }
            });
        }

        if ($endDateField.data('datepicker')) {
            $endDateField.datepicker('option', {
                // beforeShowDay: $.datepicker.noWeekends,
                minDate: 0,
                maxDate: "+12m"
            });
        }

        // Execute the function once when loading the page to set the initial state
        updateEndDatepickerState();

    }, 500);
}(jQuery));
});
</script>
<?php
}
add_action('wp_footer', 'my_datepicker_limits', 20);