/* SteadyPress Classic — docs styles (loaded only on docs pages).
   Pairs with template-docs.php and template-docs-index.php. */

/* ── Docs index card grid ─────────────────────────────────────── */
.sp-docs-grid{
  list-style:none;margin:0;padding:0;
  display:grid;gap:20px;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
}
.sp-docs-card{margin:0;}
.sp-docs-card__link{
  display:flex;flex-direction:column;gap:8px;height:100%;
  padding:24px;border-radius:10px;
  background:var(--color-surface-card,#fff);
  border:1px solid var(--color-border-default,#e2e8f0);
  text-decoration:none;color:inherit;
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.sp-docs-card__link:hover{
  transform:translateY(-1px);
  border-color:var(--color-navy-700,#21335c);
  box-shadow:0 6px 24px rgba(33,51,92,.08);
}
.sp-docs-card__title{
  font-family:var(--font-heading);font-size:19px;line-height:1.3;
  font-weight:600;color:var(--color-text-primary);margin:0;
}
.sp-docs-card__desc{
  font-size:15px;line-height:1.55;color:var(--color-text-secondary);margin:0;
}
.sp-docs-card__cta{
  margin-top:auto;font-size:14px;font-weight:600;color:var(--color-navy-700,#21335c);
}

/* ── Breadcrumb ───────────────────────────────────────────────── */
.sp-docs-breadcrumb{background:var(--color-surface-page,#f7f9fc);border-bottom:1px solid var(--color-border-default,#e2e8f0);}
.sp-docs-breadcrumb a{color:var(--color-text-secondary);text-decoration:none;}
.sp-docs-breadcrumb a:hover{text-decoration:underline;}

/* ── Two-column layout: sidebar + article ─────────────────────── */
.sp-docs-layout{display:grid;gap:32px;grid-template-columns:1fr;}
@media (min-width:900px){
  .sp-docs-layout{grid-template-columns:240px 1fr;gap:48px;}
}

/* ── Sidebar (left rail TOC) ──────────────────────────────────── */
.sp-docs-sidebar{font-family:var(--font-body);font-size:14px;}
@media (min-width:900px){
  .sp-docs-sidebar{position:sticky;top:96px;align-self:start;max-height:calc(100vh - 120px);overflow:auto;}
}
.sp-docs-sidebar__eyebrow{
  text-transform:uppercase;letter-spacing:.06em;font-size:11px;font-weight:700;
  color:var(--color-text-tertiary,#64748b);margin:0 0 10px;
}
.sp-docs-sidebar__eyebrow a{color:inherit;text-decoration:none;}
.sp-docs-sidebar__list{list-style:none;margin:0;padding:0;border-left:1px solid var(--color-border-default,#e2e8f0);}
.sp-docs-sidebar__list li{margin:0;}
.sp-docs-sidebar__link{
  display:block;padding:6px 12px;margin-left:-1px;
  color:var(--color-text-secondary);text-decoration:none;
  border-left:2px solid transparent;line-height:1.45;
}
.sp-docs-sidebar__link:hover{color:var(--color-text-primary);}
.sp-docs-sidebar__link.is-current{
  color:var(--color-navy-700,#21335c);font-weight:600;
  border-left-color:var(--color-navy-700,#21335c);
  background:rgba(33,51,92,.04);
}

/* ── Article prose ────────────────────────────────────────────── */
.sp-docs-article{max-width:760px;}
.sp-docs-article > h1{font-size:34px;line-height:1.2;margin:0 0 24px;font-weight:700;}
.sp-docs-article h2{font-size:24px;line-height:1.3;margin:40px 0 14px;color:var(--color-text-primary);font-weight:600;}
.sp-docs-article h3{font-size:19px;line-height:1.35;margin:28px 0 10px;color:var(--color-text-primary);font-weight:600;}
.sp-docs-article h4{font-size:16px;margin:22px 0 8px;color:var(--color-text-primary);font-weight:600;}
.sp-docs-article p{margin:0 0 14px;}
.sp-docs-article ul,.sp-docs-article ol{margin:0 0 18px;padding-left:22px;}
.sp-docs-article li{margin:6px 0;}
.sp-docs-article a{color:var(--color-navy-700,#21335c);text-decoration:underline;text-underline-offset:2px;}
.sp-docs-article a:hover{color:var(--color-navy-800,#162244);}
.sp-docs-article code{
  font-family:var(--font-mono);font-size:.92em;
  background:rgba(33,51,92,.06);border:1px solid rgba(33,51,92,.08);
  border-radius:4px;padding:1px 5px;color:var(--color-text-primary);
}
.sp-docs-article pre.sp-code{
  background:#0f172a;color:#e2e8f0;font-family:var(--font-mono);font-size:13.5px;line-height:1.55;
  padding:14px 16px;border-radius:8px;overflow:auto;margin:0 0 20px;
}
.sp-docs-article pre.sp-code code{background:transparent;border:0;padding:0;color:inherit;font-size:inherit;}
.sp-docs-article blockquote{
  margin:0 0 18px;padding:6px 18px;border-left:3px solid var(--color-navy-700,#21335c);
  background:rgba(33,51,92,.04);color:var(--color-text-secondary);font-style:italic;
}
.sp-docs-article hr{border:0;border-top:1px solid var(--color-border-default,#e2e8f0);margin:32px 0;}
.sp-table-wrap{overflow-x:auto;margin:0 0 22px;}
.sp-docs-article table.sp-table{
  width:100%;border-collapse:collapse;font-size:14.5px;
  border:1px solid var(--color-border-default,#e2e8f0);
}
.sp-docs-article table.sp-table th,
.sp-docs-article table.sp-table td{
  padding:9px 12px;border:1px solid var(--color-border-default,#e2e8f0);
  vertical-align:top;text-align:left;
}
.sp-docs-article table.sp-table thead th{
  background:var(--color-surface-page,#f7f9fc);font-weight:600;color:var(--color-text-primary);
}

/* ── End-of-article rule + help link ──────────────────────────── */
.sp-docs-end-rule{margin-top:48px;}
.sp-docs-end-help{font-size:14.5px;color:var(--color-text-secondary);}

/* ── Admin-only TODO callout (rendered above docs-index content) ─ */
.sp-admin-todo{
  border:1px dashed #b45309;background:#fffbeb;color:#7c2d12;
  border-radius:8px;padding:14px 18px;margin:0 0 28px;
  font-size:14.5px;line-height:1.55;
}
.sp-admin-todo__label{
  margin:0 0 8px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;
  font-size:12px;color:#b45309;
}
.sp-admin-todo__body ol,.sp-admin-todo__body ul{margin:0 0 6px 22px;padding:0;}
.sp-admin-todo__body li{margin:4px 0;}
.sp-admin-todo__hint{margin:8px 0 0;font-size:12.5px;color:#7c2d12;opacity:.8;}
