/* ==========================================================================
   SMART LABEL NAVIGATION CONSOLE (For Main Post Section Only)
   ========================================================================== */

/* 1. Hide default Label list & Title in Main Content to prevent blank spaces */
#main-content .widget.Label .title,
#main-content .widget.Label .widget-title,
#main-content .widget.Label h2,
#main-content .widget.Label h3,
#main-content .widget.Label .widget-content {
   display: none !important;
}

#main-content .widget.Label {
   margin: 0 !important;
   padding: 0 !important;
   border: none !important;
   background: transparent !important;
   box-shadow: none !important;
}

/* 2. Safe Navigation Console Styling (Clash-Free) */
.main-post-label-nav {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 12px;
   margin: 30px 0 10px 0;
   padding: 15px;
   background: var(--surface-color);
   border: 1px dashed var(--border-color);
   border-radius: 8px;
   font-family: inherit;
}

.main-post-label-nav button,
.main-post-label-nav a {
   padding: 8px 16px;
   border: 1px solid var(--border-color);
   background: var(--surface-color);
   color: var(--text-main);
   text-decoration: none;
   border-radius: 6px;
   font-size: 0.9rem;
   font-weight: 500;
   cursor: pointer;
   transition: all 0.3s ease;
   display: inline-flex;
   align-items: center;
   justify-content: center;
}

.main-post-label-nav button:hover,
.main-post-label-nav a:hover {
   background: var(--accent-color);
   color: #fff;
   border-color: var(--accent-color);
   transform: translateY(-2px);
   box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

  <b:if cond='data:view.isSingleItem'>
    <script>
      //<![CDATA[
      document.addEventListener("DOMContentLoaded", async function() {
        const mainLabelWidgets = document.querySelectorAll("#main-content .widget.Label");
        if (mainLabelWidgets.length === 0) return;

        function normalize(url) {
          try {
            const u = new URL(url, window.location.origin);
            return (u.origin + u.pathname.replace(/\/+$/, "")).toLowerCase();
          } catch (e) {
            return url.split("?")[0].replace(/\/+$/, "").toLowerCase();
          }
        }

        const currentCanonical = normalize(
          document.querySelector('link[rel="canonical"]') ? 
          document.querySelector('link[rel="canonical"]').href : 
          window.location.href
        );

        async function fetchLabelEntries(label) {
          const feedUrl = "/feeds/posts/default/-/" + encodeURIComponent(label) + "?alt=json&max-results=150";
          try {
            const res = await fetch(feedUrl);
            if (!res.ok) return [];
            const data = await res.json();
            const entries = (data.feed && data.feed.entry) ? data.feed.entry : [];
            return entries.map(e => {
              const alt = e.link.find(l => l.rel === "alternate");
              return alt ? alt.href : null;
            }).filter(Boolean);
          } catch (e) { return []; }
        }

        for (const widget of mainLabelWidgets) {
          widget.style.display = "none";

          const links = widget.querySelectorAll('a[href*="/search/label/"]');
          let supportedLabels = [];
          links.forEach(a => {
            try {
              let labelPart = a.href.split('/search/label/')[1].split('?')[0];
              supportedLabels.push(decodeURIComponent(labelPart));
            } catch(e) {}
          });
          supportedLabels = [...new Set(supportedLabels)];

          let activeLabel = null;
          let labelEntries = [];

          for (const label of supportedLabels) {
            const entries = await fetchLabelEntries(label);
            const normalized = entries.map(normalize);
            const idx = normalized.indexOf(currentCanonical);
            
            if (idx !== -1) {
              activeLabel = label;
              labelEntries = entries;
              break; 
            }
          }

          if (activeLabel) {
            // Updated Safe Class Name Here
            const consoleDiv = document.createElement("div");
            consoleDiv.className = "main-post-label-nav"; 
            
            const prevBtn = document.createElement("button");
            prevBtn.innerHTML = "&laquo; Newer";
            
            const allLink = document.createElement("a");
            allLink.href = "/search/label/" + encodeURIComponent(activeLabel);
            allLink.textContent = "All in " + activeLabel;
            
            const nextBtn = document.createElement("button");
            nextBtn.innerHTML = "Older &raquo;";

            consoleDiv.appendChild(prevBtn);
            consoleDiv.appendChild(allLink);
            consoleDiv.appendChild(nextBtn);
            
            widget.appendChild(consoleDiv);

            const currentIndex = labelEntries.map(normalize).indexOf(currentCanonical);

            prevBtn.onclick = function() {
              if (currentIndex > 0) window.location.href = labelEntries[currentIndex - 1];
              else alert("You are reading the newest post in " + activeLabel);
            };
            nextBtn.onclick = function() {
              if (currentIndex < labelEntries.length - 1) window.location.href = labelEntries[currentIndex + 1];
              else alert("You are reading the oldest post in " + activeLabel);
            };

            widget.style.display = "block";
          }
        }
      });
      //]]>
    </script>
  </b:if>