<% live_section = request.path.start_with?("/live") %>
<div class="site-chrome">
  <div class="site-masthead">
    <div class="wrap mast-inner">
      <%= link_to root_path, class: "mast-brand", aria: { label: "Match Live Tv" } do %>
        <img class="mast-brand-logo" src="/logo.png?v=3" alt="" width="40" height="40" decoding="async">
        <span class="brand">Match <span>Live TV</span></span>
      <% end %>

      <button type="button" class="nav-toggle" aria-label="Apri menu" aria-expanded="false" aria-controls="site-nav">
        <span class="nav-toggle-bar" aria-hidden="true"></span>
        <span class="nav-toggle-bar" aria-hidden="true"></span>
        <span class="nav-toggle-bar" aria-hidden="true"></span>
      </button>
    </div>
  </div>

  <nav id="site-nav" class="nav" aria-label="Menu principale" aria-hidden="true">
    <div class="nav-panel">
      <%= link_to "Home", root_path, class: (request.path == "/" ? "nav-active" : nil) %>
      <%= link_to "Funzionalità", public_features_path, class: (request.path == "/funzionalita" ? "nav-active" : nil) %>
      <%= link_to "Prezzi", public_prezzi_path, class: (request.path == "/prezzi" ? "nav-active" : nil) %>
      <%= link_to "FAQ", public_faq_path, class: (request.path == "/faq" ? "nav-active" : nil) %>
      <%= link_to "Dirette live", public_live_index_path, class: (live_section ? "nav-active" : nil) %>
      <div class="nav-actions">
        <% if logged_in? %>
          <% if current_user.primary_club || current_user.manageable_teams.any? %>
            <% if current_user.primary_club %>
              <%= link_to "Società", public_club_path(current_user.primary_club), class: "nav-link-item" %>
            <% elsif current_user.manageable_teams.first %>
              <%= link_to "Dettagli squadra", public_team_details_path(current_user.manageable_teams.first), class: "nav-link-item" %>
            <% end %>
          <% end %>
          <%= button_to "Esci", public_logout_path, method: :delete, class: "btn btn-secondary nav-btn" %>
        <% else %>
          <%= link_to "Accedi", public_login_path, class: "nav-link-item" %>
          <%= link_to "Registra squadra", public_signup_path, class: "btn btn-primary nav-btn" %>
        <% end %>
      </div>
    </div>
  </nav>
</div>

<div class="nav-backdrop" id="nav-backdrop" aria-hidden="true"></div>

<script>
(function () {
  var chrome = document.querySelector(".site-chrome");
  var toggle = document.querySelector(".nav-toggle");
  var backdrop = document.getElementById("nav-backdrop");
  var nav = document.getElementById("site-nav");
  if (!chrome || !toggle || !nav) return;

  function setOpen(open) {
    chrome.classList.toggle("nav-open", open);
    document.body.classList.toggle("nav-menu-open", open);
    toggle.setAttribute("aria-expanded", open ? "true" : "false");
    toggle.setAttribute("aria-label", open ? "Chiudi menu" : "Apri menu");
    nav.setAttribute("aria-hidden", open ? "false" : "true");
    if (backdrop) backdrop.setAttribute("aria-hidden", open ? "false" : "true");
  }

  function closeMenu() { setOpen(false); }

  toggle.addEventListener("click", function (e) {
    e.stopPropagation();
    document.body.classList.contains("nav-menu-open") ? closeMenu() : setOpen(true);
  });

  if (backdrop) backdrop.addEventListener("click", closeMenu);

  nav.querySelectorAll("a, button").forEach(function (el) {
    el.addEventListener("click", closeMenu);
  });

  window.addEventListener("resize", function () {
    if (window.matchMedia("(min-width: 900px)").matches) closeMenu();
  });

  document.addEventListener("keydown", function (e) {
    if (e.key === "Escape") closeMenu();
  });
})();
</script>
