function createAqurTimer() {
  const aqurTimer = document.createElement("div");
  aqurTimer.id = "aqur_timer";
  aqurTimer.className = "chatformBtn aqurBtn";
  aqurTimer.innerHTML = `
    <img class="aqur_timer_img" src="https://res.cloudinary.com/dts6mbw86/image/upload/v1713319985/aqur/common/icon_azvikf.png" alt="Icon">
    <div class="aqur_timer_container"></div>
  `;
  document.body.appendChild(aqurTimer);
  return document.querySelector(".aqur_timer_container");
}

let interval = null;

function updateAqurTimer(aqurTimerContainer) {
  const now = new Date();
  const oneDay = 24 * 60 * 60 * 1000;
  const untilFinishTime = new Date(new Date().setHours(23, 59, 59, 999)) - now;

  const h = Math.floor((untilFinishTime % oneDay) / (60 * 60 * 1000));
  const m = Math.floor((untilFinishTime % oneDay) / (60 * 1000)) % 60;
  const s = Math.floor((untilFinishTime % oneDay) / 1000) % 60;
  const ms = Math.floor((untilFinishTime % 1000) / 10);

  aqurTimerContainer.innerHTML = `
    <div>
      <div class="timer_1">
        お急ぎください！本日受付終了まで
      </div>
      <div class="timer_2">
        <span class="text-label">あと</span>
        <span class="number">${String(h).padStart(2, '0')}</span><span class="text-label">時間</span>
        <span class="number">${String(m).padStart(2, '0')}</span><span class="text-label">分</span>
        <span class="number">${String(s).padStart(2, '0')}</span><span class="text-label">秒</span>
        
      </div>
    </div>
  `;
}

function initAqurTimerBtn() {
  setTimeout(() => {
    const aqurTimerContainer = createAqurTimer();
    interval = setInterval(() => updateAqurTimer(aqurTimerContainer), 1000);
  }, 2000); // 5秒後にcreateAqurTimerを実行
}

initAqurTimerBtn();