/* ─────────────────────────────────────────────────────────────────────────────
   DOCS — sidebar layout, module pages and the generated command reference.
   Generated pages only (docs/*.html). Uses the tokens already defined in
   site.css; the Discord demo-card + embed components also live there.
   ───────────────────────────────────────────────────────────────────────────── */

.docs-shell{display:grid;grid-template-columns:236px minmax(0,1fr);gap:44px;align-items:start;padding:34px 0 70px;}

/* ── Sidebar ─────────────────────────────────────────────────────────────── */
.docs-nav{position:sticky;top:86px;max-height:calc(100vh - 110px);overflow-y:auto;padding-right:6px;}
.docs-nav-home{display:block;font-size:13.5px;font-weight:600;color:var(--text-muted);padding:7px 10px;border-radius:8px;text-decoration:none;}
.docs-nav-home:hover,.docs-nav a:hover{background:var(--surface-2);color:var(--text);}
.docs-nav-group{margin-top:20px;}
.docs-nav-cat{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:var(--text-dim);padding:0 10px 7px;}
.docs-nav a{display:block;font-size:13.5px;color:var(--text-muted);padding:6px 10px;border-radius:8px;text-decoration:none;transition:background .14s,color .14s;}
.docs-nav a.is-active,.docs-nav-home.is-active{background:var(--crimson-dim);color:var(--crimson-2);font-weight:600;}

/* ── Main column ─────────────────────────────────────────────────────────── */
.docs-main{min-width:0;max-width:780px;}
.docs-crumb{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--text-dim);margin-bottom:10px;}
.docs-crumb a{color:var(--text-dim);text-decoration:none;}
.docs-crumb a:hover{color:var(--crimson-2);}
.docs-crumb span{opacity:.5;margin:0 5px;}
.docs-h1{font-family:'Bebas Neue',sans-serif;font-size:clamp(38px,5vw,54px);letter-spacing:.5px;line-height:1;margin:0 0 12px;color:#fff;}
.docs-lead{font-size:17px;color:var(--text-muted);line-height:1.6;margin:0 0 22px;}
.docs-actions{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:8px;}
.docs-h2{font-family:'Bebas Neue',sans-serif;font-size:27px;letter-spacing:.6px;margin:40px 0 14px;display:flex;align-items:center;gap:10px;color:#fff;}
.docs-h2::before{content:"";width:15px;height:3px;border-radius:2px;background:var(--grad-crimson);box-shadow:0 0 10px var(--glow-crimson);}
.docs-count{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:0;color:var(--text-dim);background:var(--surface-2);border:1px solid var(--border);border-radius:999px;padding:2px 9px;}
.docs-main p{font-size:14.5px;color:var(--text-muted);line-height:1.65;}
/* Inline prose links only. This must NOT hit .btn (its own white text loses to
   `.docs-main a` on specificity, which made "Configure in dashboard" crimson on
   crimson and unreadable), nor the chips/cards that set their own colour. */
.docs-main a:not(.btn):not(.docs-rel):not(.docs-card){color:var(--crimson-2);}
.docs-generated{font-size:13px !important;color:var(--text-dim) !important;font-style:italic;margin-top:-6px;}

.doc-list{margin:12px 0 0;padding-left:20px;}
.doc-list li{font-size:14.5px;color:var(--text-muted);line-height:1.6;margin-bottom:9px;}
.doc-list li b{color:var(--text);}
.doc-steps{margin:12px 0 0;padding-left:20px;}
.doc-steps li{font-size:14.5px;color:var(--text-muted);line-height:1.6;margin-bottom:10px;}
.docs-main code{font-family:'JetBrains Mono',monospace;font-size:12.5px;background:var(--surface-2);border:1px solid var(--border);border-radius:5px;padding:1px 6px;color:var(--crimson-2);}

/* ── Demo cards on a docs page (narrower column than the homepage) ───────── */
.docs-cards{grid-template-columns:repeat(2,1fr);}
@media (max-width:900px){ .docs-cards{grid-template-columns:1fr;} }

/* ── Generated command reference ─────────────────────────────────────────── */
.doc-cmd{border:1px solid var(--border);border-radius:var(--radius-sm,12px);background:var(--surface-2);padding:15px 17px;margin-bottom:10px;transition:border-color .15s;}
.doc-cmd:hover{border-color:var(--crimson-border);}
.doc-cmd-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.doc-cmd-name{font-family:'JetBrains Mono',monospace;font-size:15px;font-weight:600;color:var(--crimson-2);}
.doc-cmd-desc{margin:6px 0 0 !important;font-size:14px !important;}
.doc-cmd .cf-perm{margin-left:auto;font-size:10px;font-weight:700;letter-spacing:.5px;padding:3px 8px;border-radius:5px;text-transform:uppercase;}
.perm-everyone{background:rgba(16,185,129,0.12);color:var(--green,#10b981);border:1px solid rgba(16,185,129,0.3);}
.perm-mod{background:rgba(99,102,241,0.12);color:#818cf8;border:1px solid rgba(99,102,241,0.3);}
.perm-admin{background:var(--crimson-dim);color:var(--crimson-2);border:1px solid var(--crimson-border);}
.perm-dash{background:rgba(20,184,166,0.12);color:var(--teal,#14b8a6);border:1px solid rgba(20,184,166,0.3);}

.doc-opt{display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:baseline;gap:10px;margin-top:8px;padding-top:8px;border-top:1px solid var(--border);}
.doc-opt code{font-size:12px;}
.doc-opt-req{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.6px;text-transform:uppercase;color:var(--text-dim);border:1px solid var(--border);border-radius:4px;padding:1px 6px;white-space:nowrap;}
.doc-opt-req.is-req{color:var(--crimson-2);border-color:var(--crimson-border);}
.doc-opt-d{font-size:13px;color:var(--text-muted);line-height:1.5;}

/* ── Hub ─────────────────────────────────────────────────────────────────── */
.docs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;}
.docs-card{padding:16px 17px;text-decoration:none;}
.docs-card h3{font-size:15.5px;margin:0 0 5px;color:#fff;}
.docs-card p{font-size:13px !important;margin:0 !important;line-height:1.55 !important;}
.docs-steps-grid{display:grid;gap:12px;}
.docs-step{display:flex;gap:14px;align-items:flex-start;border:1px solid var(--border);background:var(--surface-2);border-radius:12px;padding:15px 17px;}
.docs-step-n{flex:0 0 auto;width:32px;height:32px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-family:'Bebas Neue',sans-serif;font-size:18px;background:var(--crimson-dim);border:1px solid var(--crimson-border);color:var(--crimson-2);}
.docs-step b{color:#fff;font-size:15px;}
.docs-step p{margin:4px 0 0 !important;font-size:13.5px !important;}
.docs-rels{display:flex;flex-wrap:wrap;gap:8px;}
.docs-rel{font-size:13px;color:var(--text-muted);border:1px solid var(--border);background:var(--surface-2);border-radius:999px;padding:6px 13px;text-decoration:none;transition:border-color .15s,color .15s;}
.docs-rel:hover{border-color:var(--crimson-border);color:var(--crimson-2);}

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width:860px){
  .docs-shell{grid-template-columns:1fr;gap:0;padding-top:22px;}
  .docs-nav{position:static;max-height:none;display:flex;gap:6px;overflow-x:auto;white-space:nowrap;padding:0 0 14px;margin-bottom:18px;border-bottom:1px solid var(--border);}
  .docs-nav-group{margin-top:0;display:flex;gap:6px;align-items:center;}
  .docs-nav-cat{display:none;}
  .docs-nav a,.docs-nav-home{padding:6px 12px;border:1px solid var(--border);border-radius:999px;font-size:12.5px;}
  .doc-opt{grid-template-columns:1fr;gap:3px;}
}

/* ── Hub search ──────────────────────────────────────────────────────────── */
.docs-search-wrap{margin:0 0 30px;}
.docs-search{width:100%;}
.docs-results{display:flex;flex-direction:column;gap:7px;}
.docs-hit{display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:baseline;gap:12px;padding:11px 14px;border:1px solid var(--border);background:var(--surface-2);border-radius:10px;text-decoration:none;transition:border-color .14s;}
.docs-hit:hover{border-color:var(--crimson-border);}
.docs-hit-n{font-family:'JetBrains Mono',monospace;font-size:13.5px;font-weight:600;color:var(--crimson-2);white-space:nowrap;}
.docs-hit-m{font-size:10px;letter-spacing:.6px;text-transform:uppercase;color:var(--text-dim);border:1px solid var(--border);border-radius:999px;padding:2px 8px;white-space:nowrap;}
.docs-hit-d{font-size:13px;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.docs-no-hits{padding:26px;text-align:center;color:var(--text-dim);font-size:13.5px;border:1px dashed var(--border);border-radius:12px;}
@media (max-width:700px){
  .docs-hit{grid-template-columns:1fr;gap:4px;}
  .docs-hit-d{white-space:normal;}
  .docs-hit-m{justify-self:start;}
}
/* Anchored command lands clear of the sticky nav, and flashes so it's findable. */
.doc-cmd{scroll-margin-top:86px;}
.doc-cmd:target{border-color:var(--crimson-border);box-shadow:0 0 0 3px var(--crimson-dim);}