(function () {
  var STORAGE_KEY = "mltv_admin_analytics_chart_hidden";
  var trend = window.adminAnalyticsTrend || [];
  var i18n = window.adminAnalyticsI18n || {};
  var panel = document.getElementById("admin-analytics-trend");
  var canvas = document.getElementById("chart-analytics-trend");
  var toggle = document.getElementById("admin-analytics-trend-toggle");
  var body = document.getElementById("admin-analytics-trend-body");

  function setHidden(hidden) {
    if (!panel || !body || !toggle) return;
    body.hidden = hidden;
    panel.classList.toggle("is-collapsed", hidden);
    toggle.setAttribute("aria-expanded", hidden ? "false" : "true");
    toggle.textContent = hidden
      ? (i18n.showChart || "Mostra grafico")
      : (i18n.hideChart || "Nascondi grafico");
    try {
      localStorage.setItem(STORAGE_KEY, hidden ? "1" : "0");
    } catch (e) { /* ignore */ }
  }

  function initiallyHidden() {
    try {
      return localStorage.getItem(STORAGE_KEY) === "1";
    } catch (e) {
      return false;
    }
  }

  if (toggle && body) {
    setHidden(initiallyHidden());
    toggle.addEventListener("click", function () {
      setHidden(!body.hidden);
    });
  }

  if (!canvas || !trend.length || typeof Chart === "undefined") return;

  function dayLabel(dayStr) {
    var parts = dayStr.split("-");
    if (parts.length < 3) return dayStr;
    var d = new Date(parseInt(parts[0], 10), parseInt(parts[1], 10) - 1, parseInt(parts[2], 10));
    return d.toLocaleDateString([], { day: "2-digit", month: "short" });
  }

  new Chart(canvas, {
    type: "line",
    data: {
      labels: trend.map(function (row) { return dayLabel(row.day); }),
      datasets: [
        {
          label: i18n.pageviews || "Pageviews",
          data: trend.map(function (r) { return r.pageviews || 0; }),
          borderColor: "rgba(229, 57, 53, 0.95)",
          backgroundColor: "rgba(229, 57, 53, 0.18)",
          fill: true,
          tension: 0.25,
          pointRadius: 3,
          pointHoverRadius: 5
        }
      ]
    },
    options: {
      responsive: true,
      maintainAspectRatio: false,
      interaction: { mode: "index", intersect: false },
      animation: { duration: 280 },
      scales: {
        x: {
          ticks: { maxTicksLimit: 14, color: "#9a9aad", font: { size: 10 } },
          grid: { color: "rgba(255,255,255,0.06)" }
        },
        y: {
          beginAtZero: true,
          ticks: {
            color: "#9a9aad",
            font: { size: 10 },
            precision: 0
          },
          grid: { color: "rgba(255,255,255,0.06)" }
        }
      },
      plugins: {
        legend: { display: false }
      }
    }
  });
})();