(function () {
  function initReservationForm(form) {
    var dateInput = form.querySelector('[data-reservation-date]');
    var partySelect = form.querySelector('[data-party-size]');
    var timeSelect = form.querySelector('[data-reservation-time]');
    var note = form.querySelector('[data-availability-note]');

    if (!dateInput || !partySelect || !timeSelect || !note || typeof nazarReservationData === 'undefined') {
      return;
    }

    var messages = nazarReservationData.messages || {};
    var requestCounter = 0;

    function setPlaceholder(text, disabled) {
      timeSelect.innerHTML = '';
      var option = document.createElement('option');
      option.value = '';
      option.textContent = text;
      timeSelect.appendChild(option);
      timeSelect.disabled = !!disabled;
      timeSelect.value = '';
    }

    function updateAvailability() {
      var date = dateInput.value;
      var partySize = partySelect.value;

      if (!date || !partySize) {
        setPlaceholder(messages.chooseDateAndParty || 'Bitte wählen Sie zuerst Datum und Personenzahl.', true);
        note.textContent = messages.chooseDateAndParty || 'Bitte wählen Sie zuerst Datum und Personenzahl.';
        return;
      }

      requestCounter += 1;
      var currentRequest = requestCounter;

      setPlaceholder(messages.loading || 'Verfügbare Uhrzeiten werden geladen …', true);
      note.textContent = messages.loading || 'Verfügbare Uhrzeiten werden geladen …';

      var body = new URLSearchParams();
      body.append('action', 'nazar_get_available_times');
      body.append('nonce', nazarReservationData.nonce);
      body.append('reservation_date', date);
      body.append('party_size', partySize);

      fetch(nazarReservationData.ajaxUrl, {
        method: 'POST',
        headers: {
          'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
        },
        body: body.toString()
      })
        .then(function (response) {
          return response.json();
        })
        .then(function (payload) {
          if (currentRequest !== requestCounter) {
            return;
          }

          if (!payload || !payload.success || !payload.data) {
            throw new Error('invalid_response');
          }

          var times = Array.isArray(payload.data.times) ? payload.data.times : [];

          if (!times.length) {
            setPlaceholder(messages.empty || 'Für diese Auswahl ist aktuell keine freie Uhrzeit verfügbar.', true);
            note.textContent = payload.data.message || messages.empty || 'Für diese Auswahl ist aktuell keine freie Uhrzeit verfügbar.';
            return;
          }

          timeSelect.innerHTML = '';
          var defaultOption = document.createElement('option');
          defaultOption.value = '';
          defaultOption.textContent = 'Bitte wählen';
          timeSelect.appendChild(defaultOption);

          times.forEach(function (slot) {
            var option = document.createElement('option');
            option.value = slot.value;
            option.textContent = slot.label;
            timeSelect.appendChild(option);
          });

          timeSelect.disabled = false;
          note.textContent = payload.data.message || '';
        })
        .catch(function () {
          if (currentRequest !== requestCounter) {
            return;
          }

          setPlaceholder(messages.error || 'Die verfügbaren Uhrzeiten konnten gerade nicht geladen werden. Bitte versuchen Sie es erneut.', true);
          note.textContent = messages.error || 'Die verfügbaren Uhrzeiten konnten gerade nicht geladen werden. Bitte versuchen Sie es erneut.';
        });
    }

    dateInput.addEventListener('change', updateAvailability);
    partySelect.addEventListener('change', updateAvailability);
  }

  document.addEventListener('DOMContentLoaded', function () {
    document.querySelectorAll('[data-availability-form]').forEach(initReservationForm);
  });
})();