/* =========================================================
   TRANS-NZOIA AHP TRACKER — Sitemap Page CSS
   ========================================================= */

.sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
.fade-up { opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease; }
.fade-up.is-visible { opacity:1;transform:translateY(0); }

/* BREADCRUMB */
.breadcrumb { display:flex;align-items:center;gap:.5rem;margin-bottom:var(--space-6,1.5rem);font-size:.78rem; }
.breadcrumb-link { color:rgba(255,255,255,.55);text-decoration:none;transition:color .2s; }
.breadcrumb-link:hover { color:var(--lime,#9fe870); }
.breadcrumb-sep { color:rgba(255,255,255,.25);font-size:.6rem; }
.breadcrumb-current { color:rgba(255,255,255,.88);font-weight:600; }

/* =========================================================
   S1 — HERO
   ========================================================= */
.sm-hero {
  position:relative;min-height:440px;display:flex;align-items:center;
  padding:calc(var(--navbar-height,72px) + var(--ticker-height,36px) + 3rem) 0 4rem;
  overflow:hidden;
}
.sm-hero-bg { position:absolute;inset:0;background:var(--primary-700,#163300);z-index:0; }
.sm-hero-overlay {
  position:absolute;inset:0;
  background:radial-gradient(ellipse at 30% 50%,rgba(30,77,0,.5) 0%,transparent 65%);
}
.sm-hero-grid {
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(159,232,112,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(159,232,112,.05) 1px,transparent 1px);
  background-size:44px 44px;
}
.sm-hero .container { position:relative;z-index:1; }
.sm-hero-body { max-width:660px; }
.sm-hero-eyebrow {
  display:inline-flex;align-items:center;gap:.5em;
  font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--lime,#9fe870);background:rgba(159,232,112,.1);
  border:1px solid rgba(159,232,112,.22);border-radius:100px;
  padding:.35rem 1rem;margin-bottom:var(--space-5,1.25rem);
}
.sm-hero-title {
  font-family:var(--font-display,'Syne',sans-serif);
  font-size:clamp(2.2rem,5vw,3.2rem);font-weight:900;color:#fff;
  line-height:1.1;letter-spacing:-.03em;margin-bottom:var(--space-4,1rem);
}
.sm-hero-sub {
  font-size:clamp(.9rem,1.4vw,1rem);color:rgba(255,255,255,.7);
  line-height:1.7;max-width:520px;margin-bottom:var(--space-7,1.75rem);
}

/* Search */
.sm-search-wrap {
  position:relative;max-width:500px;margin-bottom:var(--space-7,1.75rem);
}
.sm-search-icon {
  position:absolute;left:1rem;top:50%;transform:translateY(-50%);
  color:rgba(255,255,255,.4);font-size:.85rem;pointer-events:none;z-index:1;
}
.sm-search-input {
  width:100%;height:50px;padding:0 3rem 0 2.6rem;
  background:rgba(255,255,255,.08);border:1.5px solid rgba(255,255,255,.16);
  border-radius:14px;color:#fff;font-size:.92rem;font-family:inherit;
  outline:none;transition:background .22s,border-color .22s,box-shadow .22s;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
.sm-search-input::placeholder { color:rgba(255,255,255,.35); }
.sm-search-input:focus {
  background:rgba(255,255,255,.12);border-color:var(--lime,#9fe870);
  box-shadow:0 0 0 3px rgba(159,232,112,.15);
}
.sm-search-clear {
  position:absolute;right:.8rem;top:50%;transform:translateY(-50%);
  width:28px;height:28px;border-radius:50%;border:none;
  background:rgba(255,255,255,.12);color:rgba(255,255,255,.65);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;font-size:.72rem;transition:background .2s;
}
.sm-search-clear:hover { background:rgba(255,255,255,.22);color:#fff; }

/* Hero stats */
.sm-hero-stats {
  display:flex;align-items:center;gap:1rem;
  background:rgba(5,10,2,.5);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.1);border-radius:12px;
  overflow:hidden;max-width:360px;
  padding:.8rem 1.2rem;
}
.sm-stat { display:flex;flex-direction:column;align-items:center;flex:1; }
.sm-stat-div { width:1px;height:36px;background:rgba(255,255,255,.1); }
.sm-stat-num {
  font-size:1.25rem;font-weight:800;color:var(--lime,#9fe870);
  font-family:var(--font-display,'Syne',sans-serif);line-height:1;letter-spacing:-.02em;
}
.sm-stat-lbl { font-size:.62rem;color:rgba(255,255,255,.45);letter-spacing:.04em;margin-top:.15rem; }

/* =========================================================
   S2 — VISUAL GRID
   ========================================================= */
.sm-grid-section { padding:var(--space-12,3rem) 0 var(--space-16,4rem);background:#fff; }
.sm-section-header { text-align:center;margin-bottom:var(--space-10,2.5rem); }
.sm-section-title {
  font-family:var(--font-display,'Syne',sans-serif);
  font-size:clamp(1.5rem,3vw,2rem);font-weight:800;
  color:var(--neutral-950,#050a02);letter-spacing:-.02em;margin-bottom:.4rem;
}
.sm-section-sub { font-size:.9rem;color:var(--neutral-500,#5a7a48); }

/* No results */
.sm-no-results {
  text-align:center;padding:3rem 2rem;color:var(--neutral-500,#5a7a48);
  border:1.5px dashed var(--neutral-200,#ddeece);border-radius:16px;margin-bottom:2rem;
}
.sm-no-results i { font-size:2rem;opacity:.3;display:block;margin-bottom:.75rem; }
.sm-inline-btn { background:none;border:none;color:var(--primary-600,#1e4d00);font-weight:700;cursor:pointer;text-decoration:underline;font-size:inherit;font-family:inherit;padding:0; }

/* Grid layout */
.sm-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.5rem;
}

/* Card */
.sm-card {
  background:#fff;border:1.5px solid var(--neutral-200,#ddeece);
  border-radius:18px;overflow:hidden;
  box-shadow:0 2px 12px rgba(0,0,0,.04);
  transition:box-shadow .22s,transform .22s;
}
.sm-card:hover { box-shadow:0 8px 28px rgba(0,0,0,.08);transform:translateY(-2px); }
.sm-card.is-hidden { display:none; }

.sm-card-header {
  display:flex;align-items:center;gap:.85rem;
  padding:1.1rem 1.25rem;
}
.sm-card-header--green  { background:var(--primary-600,#1e4d00); }
.sm-card-header--blue   { background:#1e3a8a; }
.sm-card-header--amber  { background:#92400e; }
.sm-card-header--neutral{ background:var(--neutral-700,#2e4a1e); }
.sm-card-header--pink   { background:#831843; }
.sm-card-header--teal   { background:#0f766e; }

.sm-card-icon {
  width:38px;height:38px;border-radius:10px;
  background:rgba(255,255,255,.15);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:1rem;flex-shrink:0;
}
.sm-card-title { font-family:var(--font-display,'Syne',sans-serif);font-size:.95rem;font-weight:800;color:#fff;margin-bottom:.1rem; }
.sm-card-count { font-size:.7rem;color:rgba(255,255,255,.6);font-weight:500; }

/* Links list */
.sm-card-links { list-style:none;padding:0;margin:0; }
.sm-card-links > li { border-bottom:1px solid var(--neutral-50,#f6faf0); }
.sm-card-links > li:last-child { border-bottom:none; }
.sm-card-links > li.is-hidden { display:none; }

.sm-link {
  display:flex;align-items:center;gap:.75rem;
  padding:.85rem 1.1rem;text-decoration:none;
  transition:background .18s;
}
.sm-link:hover { background:var(--neutral-50,#f6faf0); }
.sm-link--current { background:var(--primary-50,#edfbd6) !important; }

.sm-link-icon {
  width:30px;height:30px;border-radius:8px;flex-shrink:0;
  background:var(--neutral-100,#eef7e6);color:var(--neutral-500,#5a7a48);
  display:flex;align-items:center;justify-content:center;font-size:.78rem;
}
.sm-link-body { display:flex;flex-direction:column;flex:1;min-width:0; }
.sm-link-name { font-size:.85rem;font-weight:600;color:var(--neutral-950,#050a02);line-height:1.3; }
.sm-link-desc { font-size:.72rem;color:var(--neutral-400,#7a9a65);line-height:1.4;margin-top:.05rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }

/* Status badges */
.sm-badge {
  display:inline-flex;align-items:center;
  padding:.18rem .6rem;border-radius:100px;
  font-size:.62rem;font-weight:700;white-space:nowrap;flex-shrink:0;
}
.sm-badge--live       { background:#dcfce7;color:#166534; }
.sm-badge--soon       { background:#fef9c3;color:#92400e; }
.sm-badge--restricted { background:#fee2e2;color:#991b1b; }
.sm-badge--ext        { background:#e8f0fe;color:#1e40af; }

/* =========================================================
   S3 — ALL PAGES TABLE
   ========================================================= */
.sm-table-section { padding:var(--space-12,3rem) 0 var(--space-14,3.5rem);background:var(--neutral-50,#f6faf0); }
.sm-table-wrap { overflow-x:auto;border-radius:16px;border:1.5px solid var(--neutral-200,#ddeece);box-shadow:0 2px 12px rgba(0,0,0,.04); }
.sm-table { width:100%;border-collapse:collapse;background:#fff;min-width:580px; }
.sm-th {
  padding:.75rem 1rem;text-align:left;background:var(--primary-600,#1e4d00);
  color:var(--lime,#9fe870);font-size:.72rem;font-weight:700;
  letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;
}
.sm-th.sortable { cursor:pointer;user-select:none; }
.sm-th.sortable:hover { background:var(--primary-500,#3b8a00); }
.sm-sort-icon { margin-left:.35em;opacity:.5;font-size:.65rem; }
.sm-th[aria-sort="ascending"]  .sm-sort-icon,
.sm-th[aria-sort="descending"] .sm-sort-icon { opacity:1; }

.sm-table tbody tr { border-bottom:1px solid var(--neutral-50,#f6faf0);transition:background .15s; }
.sm-table tbody tr:last-child { border-bottom:none; }
.sm-table tbody tr:hover { background:var(--neutral-50,#f6faf0); }
.sm-table tbody tr.is-hidden { display:none; }
.sm-table td { padding:.7rem 1rem;font-size:.82rem;color:var(--neutral-700,#2e4a1e);vertical-align:middle; }
.sm-table td:first-child { font-weight:600;color:var(--neutral-950,#050a02); }
.sm-tbl-link { color:var(--primary-600,#1e4d00);text-decoration:none;font-family:monospace;font-size:.8rem;transition:color .2s; }
.sm-tbl-link:hover { color:var(--primary-400,#5aaa1a);text-decoration:underline; }
.sm-tbl-na { color:var(--neutral-400,#7a9a65);font-family:monospace;font-size:.8rem; }

/* =========================================================
   S4 — XML SITEMAP
   ========================================================= */
.sm-xml-section { padding:var(--space-12,3rem) 0 var(--space-16,4rem);background:#fff; }
.sm-xml-wrap {
  background:var(--primary-700,#163300);border-radius:20px;overflow:hidden;
  position:relative;
}
.sm-xml-header {
  display:flex;align-items:center;gap:1rem;
  padding:1.5rem 2rem;border-bottom:1px solid rgba(255,255,255,.1);
  flex-wrap:wrap;
}
.sm-xml-icon {
  width:48px;height:48px;border-radius:14px;flex-shrink:0;
  background:rgba(159,232,112,.12);color:var(--lime,#9fe870);
  display:flex;align-items:center;justify-content:center;font-size:1.3rem;
}
.sm-xml-title {
  font-family:var(--font-display,'Syne',sans-serif);
  font-size:1.2rem;font-weight:800;color:#fff;letter-spacing:-.01em;margin-bottom:.2rem;
}
.sm-xml-sub { font-size:.8rem;color:rgba(255,255,255,.55); }
.sm-xml-actions { display:flex;gap:.6rem;margin-left:auto; }
.sm-xml-btn {
  display:inline-flex;align-items:center;gap:.4em;
  padding:.5rem 1.1rem;border-radius:100px;font-size:.82rem;
  font-weight:700;cursor:pointer;font-family:inherit;transition:all .2s;
  text-decoration:none;
}
.sm-xml-btn--copy {
  background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.25);color:#fff;
}
.sm-xml-btn--copy:hover { background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.4); }
.sm-xml-btn--download {
  background:var(--lime,#9fe870);border:1.5px solid var(--lime,#9fe870);
  color:var(--primary-700,#163300);
}
.sm-xml-btn--download:hover { transform:translateY(-1px);box-shadow:0 4px 16px rgba(159,232,112,.25); }

.sm-xml-code-wrap { overflow-x:auto;max-height:360px;overflow-y:auto; }
.sm-xml-code {
  margin:0;padding:1.5rem 2rem;
  font-family:'Fira Code','Cascadia Code',Consolas,monospace;
  font-size:.78rem;line-height:1.75;
  color:rgba(255,255,255,.75);
  background:transparent;
  white-space:pre;
}
.sm-xml-code-wrap::-webkit-scrollbar { width:6px;height:6px; }
.sm-xml-code-wrap::-webkit-scrollbar-track { background:rgba(255,255,255,.05); }
.sm-xml-code-wrap::-webkit-scrollbar-thumb { background:rgba(255,255,255,.18);border-radius:3px; }

.sm-xml-copy-toast {
  display:flex;align-items:center;gap:.5em;
  position:absolute;bottom:1.25rem;right:1.5rem;
  background:rgba(159,232,112,.18);border:1px solid rgba(159,232,112,.4);
  color:var(--lime,#9fe870);font-size:.8rem;font-weight:700;
  padding:.45rem 1rem;border-radius:100px;
  animation:toastIn .3s ease forwards;
}
@keyframes toastIn { from { opacity:0;transform:translateY(8px); } to { opacity:1;transform:translateY(0); } }

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1100px) {
  .sm-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:720px) {
  .sm-grid { grid-template-columns:1fr; }
  .sm-xml-header { padding:1.25rem; }
  .sm-xml-code { padding:1.25rem; }
  .sm-xml-actions { margin-left:0;width:100%; }
  .sm-xml-btn { flex:1;justify-content:center; }
}
@media (max-width:480px) {
  .sm-hero-stats { max-width:100%; }
  .sm-xml-code { font-size:.7rem; }
}
