Internal links to SEO landing pages (role quick-links on list pages)

The /استخدام/{role}/{city} and /شیفت/{role} landing pages were only reachable via
the sitemap — no internal links, which is weak for ranking. Add a role quick-link
chip strip to the Jobs and Shifts list pages linking to the per-role landing URLs.
Since those list pages ARE the landing pages, this also cross-links every landing
page to all the others, building an internal-link mesh that passes authority and
aids crawl far more than the sitemap alone.

Improvement 2 of the backlog (SEO).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

src/JobsMedical.Web/Pages/Jobs/Index.cshtml

@@ -18,6 +18,18 @@
 </div>
 
 <div class="container section">
+    @if (Model.Roles.Count > 0)
+    {
+        @* Internal links to the SEO landing pages (/استخدام/{نقش}) — and since this page IS the
+           landing page, every landing page cross-links to all the others. *@
+        <div class="role-links">
+            <span class="rl-label">استخدام بر اساس نقش:</span>
+            @foreach (var r in Model.Roles.Take(14))
+            {
+                <a class="rl-chip" href="/استخدام/@JobsMedical.Web.Services.SeoSlug.Of(r.Name)">@r.Name</a>
+            }
+        </div>
+    }
     <div class="layout-2">
         <aside class="card card-pad filter-card">
             <h3>فیلترها</h3>

src/JobsMedical.Web/Pages/Shifts/Index.cshtml

@@ -18,6 +18,17 @@
 </div>
 
 <div class="container section">
+    @if (Model.Roles.Count > 0)
+    {
+        @* Internal links to the SEO landing pages (/شیفت/{نقش}); this page is itself such a page. *@
+        <div class="role-links">
+            <span class="rl-label">شیفت بر اساس نقش:</span>
+            @foreach (var r in Model.Roles.Take(14))
+            {
+                <a class="rl-chip" href="/شیفت/@JobsMedical.Web.Services.SeoSlug.Of(r.Name)">@r.Name</a>
+            }
+        </div>
+    }
     <div class="layout-2">
         <aside class="card card-pad filter-card">
             <h3>فیلترها</h3>

src/JobsMedical.Web/wwwroot/css/site.css

@@ -320,6 +320,12 @@ mark { background: #fff3bf; color: inherit; padding: 0 2px; border-radius: 3px;
 .hero-chips .hc-label { color: rgba(255,255,255,.85); }
 .hero-chips a { background: rgba(255,255,255,.16); color: #fff; padding: 5px 13px; border-radius: 999px; font-weight: 600; transition: background .15s; }
 .hero-chips a:hover { background: rgba(255,255,255,.3); }
+/* Role quick-links on the list pages — internal links to the SEO landing pages. */
+.role-links { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0 0 18px; }
+.role-links .rl-label { color: var(--muted); font-size: 13px; font-weight: 700; }
+.role-links .rl-chip { background: var(--surface); border: 1px solid var(--line); color: var(--ink);
+  padding: 5px 12px; border-radius: 999px; font-size: 13px; transition: all .15s; }
+.role-links .rl-chip:hover { border-color: var(--primary); color: var(--primary); }
 @media (max-width: 560px) {
   /* Smaller, tighter typography on phones */
   .hero { padding: 28px 0 32px; }