����
������������������������������������
// Step Form Script
var currentStep = 1;
var totalSteps = 17;
var updateProgressBar;

function displayStep(stepNumber) {
  // if (stepNumber >= 1 && stepNumber <= 17) {
  if (stepNumber >= 1 && stepNumber <= totalSteps) {
    $(".step-" + currentStep).hide();
    $(".step-" + stepNumber).show();
    currentStep = stepNumber;
    updateProgressBar();
  }
}

$(document).ready(function() {
  $('#multi-step-form').find('.step').slice(1).hide();

  $(".next-step").click(function() {
      console.log('test');
      // saveCurrentStepData();
    if (currentStep < totalSteps) {

        $(".step-" + currentStep).addClass("animate__animated animate__fadeOutLeft");
      currentStep++;
      setTimeout(function() {
        $(".step").removeClass("animate__animated animate__fadeOutLeft").hide();
        $(".step-" + currentStep).show().addClass("animate__animated animate__fadeInRight");
        updateProgressBar();
      }, 500);
    }
  });

    $(".prev-step").click(function() {
      if (currentStep > 1) {
        $(".step-" + currentStep).addClass("animate__animated animate__fadeOutRight");
        currentStep--;
        setTimeout(function() {
          $(".step").removeClass("animate__animated animate__fadeOutRight").hide();
          $(".step-" + currentStep).show().addClass("animate__animated animate__fadeInLeft");
          updateProgressBar();
        }, 500);
      }
    });

    updateProgressBar = function() {
      // var progressPercentage = ((currentStep - 1) / 2) * 100;
      var progressPercentage = ((currentStep - 1) / (totalSteps - 1)) * 100;
      $(".progress-bar").css("width", progressPercentage + "%");
    }
});
// End Stepper Script

const input = document.querySelectorAll(".input");
const inputField = document.querySelector(".inputfield");
const submitButton = document.getElementById("submit");
let inputCount = 0,
  finalInput = "";

//Update input
const updateInputConfig = (element, disabledStatus) => {
  element.disabled = disabledStatus;
  if (!disabledStatus) {
    element.focus();
  } else {
    element.blur();
  }
};

input.forEach((element) => {
  element.addEventListener("keyup", (e) => {
    e.target.value = e.target.value.replace(/[^0-9]/g, "");
    let { value } = e.target;

    if (value.length == 1) {
      updateInputConfig(e.target, true);
      if (inputCount <= 6 && e.key != "Backspace") {
        finalInput += value;
        if (inputCount < 6) {
          updateInputConfig(e.target.nextElementSibling, false);
        }
      }
      inputCount += 1;
    } else if (value.length == 0 && e.key == "Backspace") {
      finalInput = finalInput.substring(0, finalInput.length - 1);
      if (inputCount == 0) {
        updateInputConfig(e.target, false);
        return false;
      }
      updateInputConfig(e.target, true);
      e.target.previousElementSibling.value = "";
      updateInputConfig(e.target.previousElementSibling, false);
      inputCount -= 1;
    } else if (value.length > 1) {
      e.target.value = value.split("")[0];
    }
    submitButton.classList.add("hide");
  });
});

window.addEventListener("keyup", (e) => {
  if (inputCount > 6) {
    submitButton.classList.remove("hide");
    submitButton.classList.add("show");
    if (e.key == "Backspace") {
      finalInput = finalInput.substring(0, finalInput.length - 1);
      updateInputConfig(inputField.lastElementChild, false);
      inputField.lastElementChild.value = "";
      inputCount -= 1;
      submitButton.classList.add("hide");
    }
  }
});

const validateOTP = () => {
  alert("Success");
};

//Start
const startInput = () => {
  inputCount = 0;
  finalInput = "";
  input.forEach((element) => {
    element.value = "";
  });
  updateInputConfig(inputField.firstElementChild, false);
};

window.onload = startInput();


function saveCurrentStepData() {
    const formData = {};
    // Assuming your form fields have appropriate IDs or classes
    $(".step-" + currentStep + " .input").each(function() {
        const fieldName = $(this).attr('name');
        const fieldValue = $(this).val();
        formData[fieldName] = fieldValue;
    });
}