document.addEventListener("DOMContentLoaded", function () {

  const calendarDays = document.getElementById("calendarDays");
  const calendarYear = document.getElementById("calendarYear");
  const calendarMonth = document.getElementById("calendarMonth");

  const today = new Date();
  const currentYear = today.getFullYear();
  const currentMonth = today.getMonth();
  const currentDate = today.getDate();

  const monthNames = [
    "JANUARY","FEBRUARY","MARCH","APRIL","MAY","JUNE",
    "JULY","AUGUST","SEPTEMBER","OCTOBER","NOVEMBER","DECEMBER"
  ];

  function generateCalendar(year, month){

    calendarDays.innerHTML = "";
    calendarYear.textContent = year;
    calendarMonth.textContent = monthNames[month];

    const firstDay = new Date(year, month, 1).getDay();
    const lastDate = new Date(year, month + 1, 0).getDate();

    for(let i=0;i<firstDay;i++){
      const empty = document.createElement("span");
      calendarDays.appendChild(empty);
    }

    for(let day=1;day<=lastDate;day++){

      const dayCell = document.createElement("span");
      dayCell.textContent = day;

      if(day === currentDate){
        dayCell.classList.add("today");
      }

      calendarDays.appendChild(dayCell);
    }
  }

  generateCalendar(currentYear,currentMonth);

});
const toggle = document.getElementById("profileToggle");
const menu = document.getElementById("profileMenu");

toggle.addEventListener("click", () => {
    menu.style.display =
      menu.style.display === "flex" ? "none" : "flex";
});

document.addEventListener("DOMContentLoaded", function () {
    const calendarDays = document.getElementById("calendarDays");
    if (calendarDays) {
        calendarDays.innerHTML = "<div>1</div>";
    }

    const profileToggle = document.getElementById("profileToggle");
    if (profileToggle) {
        profileToggle.addEventListener("click", function () {
            console.log("Profile clicked");
        });
    }
});