/* ==========================================================================
   EFORIA — docs.css · centro de documentación (estilo docs.getnexor.ai)
   Depende de styles.css (tokens, botones, brand).
   ========================================================================== */

.doc-body{ background:var(--blanco); }

/* ---------- Top bar ---------- */
.dnav{ position:sticky; top:0; z-index:60; height:60px; background:rgba(251,250,246,.9);
  backdrop-filter:saturate(180%) blur(12px); border-bottom:1px solid var(--linea); }
.dnav__in{ display:flex; align-items:center; gap:16px; height:60px; max-width:1400px; margin-inline:auto; padding-inline:20px; }
.dnav .brand{ font-size:1.28rem; }
.dnav .brand svg{ width:26px; height:26px; }
.dnav__pill{ font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--acero);
  border:1px solid var(--linea); border-radius:6px; padding:2px 8px; }
.dnav__spacer{ flex:1; }
.dnav__search{ display:flex; align-items:center; gap:8px; background:var(--bruma); border:1px solid var(--linea);
  border-radius:10px; padding:7px 12px; min-width:230px; color:var(--acero); font-size:14px; cursor:text; }
.dnav__search svg{ width:15px; height:15px; }
.dnav__search kbd{ margin-left:auto; font-family:var(--mono); font-size:11px; background:var(--surface); border:1px solid var(--linea);
  border-radius:5px; padding:1px 6px; color:var(--acero); }
.dnav__back{ font-size:14px; font-weight:500; color:var(--noche); padding:.4em .7em; border-radius:8px; }
.dnav__back:hover{ background:rgba(14,34,51,.05); }
.dnav__burger{ display:none; background:transparent; border:1px solid var(--linea); border-radius:8px; padding:8px; }
.dnav__burger svg{ width:18px; height:18px; color:var(--noche); }

/* ---------- Shell ---------- */
.doc-shell{ display:grid; grid-template-columns:274px minmax(0,1fr) 224px; max-width:1400px; margin-inline:auto; }

/* ---------- Sidebar ---------- */
.doc-side{ position:sticky; top:60px; align-self:start; height:calc(100vh - 60px); overflow-y:auto;
  padding:30px 20px 60px 20px; border-right:1px solid var(--linea); }
.doc-side__group{ margin-bottom:26px; }
.doc-side__group h5{ font-family:var(--sans); font-size:11.5px; font-weight:700; letter-spacing:.11em; text-transform:uppercase;
  color:var(--acero); margin:0 0 10px 10px; }
.doc-side a{ display:flex; align-items:center; gap:9px; padding:7px 10px; border-radius:8px; font-size:14.5px; font-weight:450;
  color:var(--noche); opacity:.82; margin-bottom:1px; transition:background .15s ease, color .15s ease, opacity .15s ease; }
.doc-side a:hover{ background:var(--bruma); opacity:1; }
.doc-side a.is-active{ background:var(--bruma-2); opacity:1; font-weight:600; color:var(--noche); box-shadow:inset 2px 0 0 var(--faro); }
.doc-side a .di{ width:15px; height:15px; color:var(--senal); flex:none; }

/* ---------- Content ---------- */
.doc-main{ min-width:0; padding:44px clamp(24px,4vw,64px) 100px; }
.doc-article{ max-width:760px; }
.doc-crumb{ font-size:13px; color:var(--acero); margin-bottom:14px; }
.doc-crumb b{ color:var(--noche); font-weight:600; }
.doc-article h1{ font-size:clamp(2rem,4vw,2.7rem); margin-bottom:14px; }
.doc-article h2{ font-size:1.5rem; margin:44px 0 14px; padding-top:14px; }
.doc-article h3{ font-size:1.16rem; margin:28px 0 10px; }
.doc-article p{ color:#2c3a45; font-size:16.5px; line-height:1.7; margin:0 0 16px; }
.doc-article ul.bul{ list-style:none; margin:0 0 18px; padding:0; }
.doc-article ul.bul li{ position:relative; padding:5px 0 5px 22px; color:#2c3a45; font-size:16px; line-height:1.65; }
.doc-article ul.bul li::before{ content:""; position:absolute; left:4px; top:14px; width:6px; height:6px; border-radius:50%; background:var(--senal); }
.doc-article a.link{ color:var(--senal-dk); font-weight:500; border-bottom:1px solid rgba(47,143,166,.3); }
.doc-article a.link:hover{ border-bottom-color:var(--senal-dk); }
.doc-article strong{ color:var(--noche); font-weight:600; }
.doc-lead{ font-size:19px !important; color:var(--acero) !important; line-height:1.6 !important; }

/* code */
.doc-article code{ font-family:var(--mono); font-size:.86em; background:var(--bruma-2); border:1px solid var(--linea);
  border-radius:5px; padding:1px 6px; color:var(--noche); }
.codeblock{ background:var(--noche); border-radius:14px; overflow:hidden; margin:0 0 22px; box-shadow:var(--shadow); }
.codeblock__bar{ display:flex; align-items:center; justify-content:space-between; padding:9px 14px; border-bottom:1px solid rgba(255,255,255,.08); }
.codeblock__bar .name{ font-family:var(--mono); font-size:11.5px; color:var(--acero-2); }
.codeblock__bar .dots{ display:flex; gap:5px; }
.codeblock__bar .dots i{ width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.16); }
.codeblock pre{ margin:0; padding:16px 18px; overflow-x:auto; }
.codeblock code{ font-family:var(--mono); font-size:13.5px; line-height:1.75; color:#cfd6dd; background:none; border:0; padding:0; white-space:pre; display:block; }
.codeblock .t{ color:#9fd7e5; }   /* method / type */
.codeblock .s{ color:#e6b98a; }   /* string */
.codeblock .k{ color:#c9a0e0; }   /* keyword */
.codeblock .c{ color:#6b7683; }   /* comment */
.codeblock .g{ color:#5fd08a; }   /* success */
.codeblock .a{ color:var(--faro); }

/* callout */
.callout{ display:flex; gap:12px; background:var(--bruma); border:1px solid var(--linea); border-left:3px solid var(--faro);
  border-radius:10px; padding:14px 16px; margin:0 0 22px; }
.callout svg{ width:19px; height:19px; color:var(--faro-dk); flex:none; margin-top:2px; }
.callout p{ margin:0; font-size:14.5px; color:#2c3a45; }
.callout.note{ border-left-color:var(--senal); }
.callout.note svg{ color:var(--senal-dk); }

/* method table */
.endpoint{ display:flex; align-items:center; gap:10px; background:var(--bruma); border:1px solid var(--linea);
  border-radius:10px; padding:11px 14px; margin:0 0 12px; font-family:var(--mono); font-size:13.5px; }
.endpoint .m{ font-weight:600; padding:2px 9px; border-radius:6px; font-size:12px; }
.endpoint .m.get{ background:rgba(47,143,166,.16); color:var(--senal-dk); }
.endpoint .m.post{ background:rgba(95,180,120,.18); color:#2f7a4a; }
.endpoint .path{ color:var(--noche); }

/* pager */
.doc-pager{ display:flex; justify-content:space-between; gap:14px; margin-top:48px; padding-top:26px; border-top:1px solid var(--linea); }
.doc-pager a{ flex:1; border:1px solid var(--linea); border-radius:12px; padding:14px 18px; transition:border-color .2s ease, background .2s ease; }
.doc-pager a:hover{ border-color:var(--senal); background:var(--bruma); }
.doc-pager .dir{ font-size:12px; color:var(--acero); }
.doc-pager .ttl{ font-weight:600; color:var(--noche); margin-top:2px; }
.doc-pager .next{ text-align:right; }
.doc-pager .spacer{ border:0; background:none; pointer-events:none; }

/* ---------- TOC ---------- */
.doc-toc{ position:sticky; top:60px; align-self:start; height:calc(100vh - 60px); overflow-y:auto; padding:44px 20px 60px 8px; }
.doc-toc h6{ font-family:var(--sans); font-size:11px; font-weight:700; letter-spacing:.11em; text-transform:uppercase;
  color:var(--acero); margin:0 0 12px; }
.doc-toc a{ display:block; font-size:13px; color:var(--acero); padding:4px 0 4px 12px; border-left:2px solid var(--linea);
  transition:color .15s ease, border-color .15s ease; }
.doc-toc a:hover{ color:var(--noche); }
.doc-toc a.is-active{ color:var(--noche); border-left-color:var(--faro); font-weight:500; }

/* doc pages toggle */
.doc-page{ display:none; }
.doc-page.is-active{ display:block; }

/* ---------- Responsive ---------- */
.doc-side__backdrop{ display:none; }
@media (max-width:1100px){
  .doc-shell{ grid-template-columns:274px minmax(0,1fr); }
  .doc-toc{ display:none; }
}
@media (max-width:860px){
  .doc-shell{ grid-template-columns:1fr; }
  .dnav__search{ display:none; }
  .dnav__burger{ display:inline-flex; }
  .doc-side{ position:fixed; inset:60px auto 0 0; width:280px; background:var(--blanco); z-index:59;
    transform:translateX(-100%); transition:transform .25s ease; border-right:1px solid var(--linea); }
  .doc-side.is-open{ transform:none; box-shadow:var(--shadow-lg); }
  .doc-side__backdrop.is-open{ display:block; position:fixed; inset:60px 0 0 0; background:rgba(14,34,51,.28); z-index:58; }
}
