<%

  var _st = !!locals.showStaff;
  var _tabs = [
    ['overview', 'Overview', '/reputation'], ['search', 'Search Results', '/reputation/search'], ['ai', 'AI Answers', '/reputation/ai'],
    ['reviews', 'Reviews', '/reputation/reviews'], ['cases', 'Cases', '/reputation/cases', openCases],
    ['removals', 'Removals', '/reputation/removals'], ['suppression', 'Suppression', '/reputation/suppression'],
    ['content', 'Content', '/reputation/content', locals.contentWaiting]
  ];
  if (crisis.on || _st) _tabs.push(['crisis', crisis.on ? 'Crisis ●' : 'Crisis', '/reputation/crisis']);
  if (_st) _tabs.push(['settings', 'Settings', '/reputation/settings']);
  var _eq = entities.length > 1 ? '?e=' + entity._id : '';
  var _when = function (d) { return d ? h.date(d) : 'not yet'; };
%>
<div class="pg-head" style="margin-bottom:0">
  <div><div class="eyebrow">Reputation / <% if (tab === 'content' && title !== 'Content Approvals') { %><a href="/reputation/content" style="text-decoration:none">Content Approvals</a><% } else { %><%= title === 'Reputation' ? 'Overview' : title %><% } %></div></div>
  <div class="ph-right" style="display:flex; gap:10px; align-items:center; flex-wrap:wrap">
    <% var _last = [rep.lastSerpAt, rep.lastAiAt, rep.lastReviewsAt].filter(Boolean).sort(function (a, b) { return new Date(b) - new Date(a); })[0]; %><span class="rr-meta" title="Google <%= _when(rep.lastSerpAt) %> · AI <%= _when(rep.lastAiAt) %> · Reviews <%= _when(rep.lastReviewsAt) %>"><%= _last ? 'Updated ' + h.date(_last) : 'Not checked yet' %></span>
    <% if (_st && ws && ws.isDemo === true) { %>
      <span class="chip flat" title="Demo data is fixed. Nothing here calls SerpApi or an AI engine.">Demo data, nothing runs</span>
    <% } else if (_st) { %>
      <form class="js-rep" method="POST" action="/api/reputation/run" data-confirm="Check Google, AI answers and reviews for <%= brand %> now? Uses SerpApi credits."><button class="btn btn-primary btn-sm" type="submit"<%= running ? ' disabled' : '' %>><%= running ? 'Running…' : 'Run now' %></button></form>
    <% } %>
  </div>
</div>
<h1 class="claim" style="margin-bottom:6px"><%= title %></h1>

<% if (crisis.on) { %>
  <a class="rep-crisis-bar" href="/reputation/crisis"><b>Crisis mode on since <%= h.date(crisis.since) %></b> · Google daily, AI weekly</a>
<% } %>

<nav class="rep-nav" aria-label="Reputation sections">
  <% _tabs.forEach(function (t) { %><a class="<%= tab === t[0] ? 'on' : '' %>" href="<%= t[2] %><%= t[0] !== 'settings' && t[0] !== 'crisis' ? _eq : '' %>"><%= t[1] %><% if (t[3]) { %> <span class="pilln"><%= t[3] %></span><% } %></a><% }) %>
</nav>

<% if (entities.length > 1 && ['overview', 'search', 'ai', 'suppression'].indexOf(tab) > -1) { %>
  <div class="rep-ent">
    <span class="rr-meta">Showing</span>
    <% entities.forEach(function (e) { %><a class="efilt <%= String(e._id) === String(entity._id) ? 'on' : '' %>" href="?e=<%= e._id %>"><%= e.name %> <span class="rr-meta"><%= e.type %></span></a><% }) %>
  </div>
<% } %>

<% if (running) { %>
<div class="rep-prog" data-status="/api/reputation/status">
  <div class="rep-bar"><i style="width:<%= Math.max(2, rep.pct || 0) %>%"></i></div>
  <div class="rep-pl"><span class="rep-lab"><%= rep.progress || 'starting' %></span><b class="rep-pct"><%= rep.pct || 0 %>%</b></div>
</div>
<% } %>
<%

  var _errs = String(rep.error || '').split(' · ').filter(Boolean);
  var _bad = _errs.filter(function (x) { return /^claims: /.test(x); }).length;
  _errs = _errs.filter(function (x) { return !/^claims: /.test(x); });
  if (_bad) _errs.push(_bad + ' AI answer' + (_bad === 1 ? '' : 's') + ' could not be checked for problems on the last run. They are checked again on the next one.');
%>
<% var _pt = rep.partial && rep.partial.at && (rep.partial.serp || rep.partial.ai || rep.partial.reviews) ? rep.partial : null; %>
<% if (_st && _pt && !running && !(ws && ws.isDemo === true)) { var _left = [_pt.serp ? 'Google' : '', _pt.ai ? 'AI answers' : '', _pt.reviews ? 'reviews' : ''].filter(Boolean).join(', '); %>
  <div class="rep-stop">
    <div><b>Check stopped on <%= h.date(_pt.at) %></b><span><%= _pt.reason ? Array.from(new Set(String(_pt.reason).split(' · ').map(function (x) { return x.replace(/^"[^"]*": /, ''); }))).join(' · ') : 'The server stopped before it finished.' %> Still to do: <%= _left %>.</span></div>
    <div class="rep-stop-a">
      <form class="js-rep" method="POST" action="/api/reputation/run"><input type="hidden" name="resume" value="1"><button class="btn btn-primary btn-sm">Resume</button></form>
      <% if (/searches left|hourly limit/i.test(_pt.reason || '')) { %><form class="js-rep" method="POST" action="/api/reputation/run" data-confirm="Resume using the SerpApi searches kept back for the Keyword Tracker?"><input type="hidden" name="resume" value="1"><input type="hidden" name="reserve" value="1"><button class="btn btn-sm">Resume with reserved searches</button></form><% } %>
    </div>
  </div>
<% } else if (_st && _errs.length) { %><div class="rr-meta" style="color:var(--warn-ink); margin-top:8px"><%= _errs.join(' · ') %></div><% } %>
<style>
  .rep-stop{display:flex; justify-content:space-between; gap:14px; align-items:center; flex-wrap:wrap; margin-top:12px; padding:12px 16px; border-radius:12px; background:var(--warn-tint); border:1px solid color-mix(in srgb, var(--warn) 35%, transparent)}
  .rep-stop b{display:block; color:var(--ink); font-size:13.5px} .rep-stop span{font-size:12.5px; color:var(--warn-ink)}
  .rep-stop-a{display:flex; gap:8px; flex-wrap:wrap} .rep-stop-a form{margin:0}
</style>
