/* Portal da API do i-go — design system VUSE (cor base da marca #1c7a9c, neutros
   frios, temas claro e escuro), os mesmos tokens do painel do projeto. */
:root {
  --bg: #f2f2f3; --sup: #ffffff; --sup-2: #f7f7f8; --borda: #dcdce1;
  --texto-1: #14151a; --texto-2: #37383f; --texto-3: #62646c;
  --marca: #1c7a9c; --marca-texto: #186986; --marca-suave: #ecf5f8;
  --r: 10px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not(.ref) {
    --bg: #1a1a1e; --sup: #22232a; --sup-2: #2d2d34; --borda: #3e3e46;
    --texto-1: #fafaff; --texto-2: #cfcfd3; --texto-3: #a3a4ab;
    --marca: #5cb6d6; --marca-texto: #5cb6d6; --marca-suave: #1f2e35;
    color-scheme: dark;
  }
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--texto-1);
  font: 16px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }
code { font: 13.5px ui-monospace, "SF Mono", Menlo, Consolas, monospace; color: var(--texto-2); overflow-wrap: anywhere; }

.topo { position: sticky; top: 0; z-index: 3; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px;
  background: var(--sup); border-bottom: 1px solid var(--borda); padding: calc(env(safe-area-inset-top, 0px) + 8px) 16px 8px; }
.marca { font-weight: 800; font-size: 18px; color: var(--marca-texto); text-decoration: none; }
.marca span { font-weight: 600; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--texto-3); margin-left: 4px; }
.topo nav { display: flex; gap: 2px; overflow-x: auto; scrollbar-width: none; }
.topo nav::-webkit-scrollbar { display: none; }
.topo nav a { flex: none; color: var(--texto-2); text-decoration: none; font-size: 14px; padding: 6px 10px; border-radius: 999px; }
.topo nav a:hover, .topo nav a:focus-visible { background: var(--marca-suave); color: var(--marca-texto); }
.topo nav a[aria-current="page"] { background: var(--marca-suave); color: var(--marca-texto); font-weight: 650; }
:focus-visible { outline: 3px solid var(--marca); outline-offset: 2px; }

.pagina { max-width: 1180px; margin: 0 auto; padding: 16px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
@media (min-width: 960px) {
  .pagina { grid-template-columns: 240px minmax(0, 1fr); gap: 28px; padding-top: 24px; }
  .indice { position: sticky; top: 72px; align-self: start; max-height: calc(100vh - 88px); overflow-y: auto; }
}
.indice details { background: var(--sup); border: 1px solid var(--borda); border-radius: 14px; padding: 10px 14px; }
.indice summary { cursor: pointer; font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--marca-texto); }
.indice ol { margin: 8px 0 2px; padding-left: 20px; display: grid; gap: 2px; font-size: 14px; }
.indice a { color: var(--texto-2); text-decoration: none; }
.indice a:hover { color: var(--marca-texto); text-decoration: underline; }

.documento { background: var(--sup); border: 1px solid var(--borda); border-radius: 14px; padding: 20px 18px 28px; line-height: 1.65; overflow-wrap: anywhere; }
@media (min-width: 960px) { .documento { padding: 28px 36px 40px; } }
.documento h1 { font-size: 26px; line-height: 1.25; margin: 0 0 12px; }
.documento h2 { font-size: 20px; margin: 36px 0 10px; padding-top: 12px; border-top: 1px solid var(--borda); scroll-margin-top: 72px; }
.documento h3 { font-size: 17px; margin: 24px 0 6px; scroll-margin-top: 72px; }
.documento h4 { font-size: 15px; margin: 16px 0 4px; }
.documento p, .documento li { color: var(--texto-2); }
.documento ul, .documento ol { padding-left: 22px; }
.documento li > ul, .documento li > ol { margin: 4px 0; }
.documento a { color: var(--marca-texto); }
.documento blockquote { margin: 14px 0; padding: 4px 16px; border-left: 3px solid var(--marca); background: var(--marca-suave); border-radius: 0 var(--r) var(--r) 0; }
.documento pre { background: var(--sup-2); border: 1px solid var(--borda); border-radius: var(--r); padding: 12px 14px; overflow-x: auto; }
.documento pre code { overflow-wrap: normal; white-space: pre; font-size: 13px; }
.documento hr { border: 0; border-top: 1px solid var(--borda); margin: 20px 0; }
.documento .tabela { overflow-x: auto; margin: 12px 0; border: 1px solid var(--borda); border-radius: var(--r); }
.documento table { border-collapse: collapse; width: 100%; font-size: 14px; }
.documento th, .documento td { text-align: left; vertical-align: top; padding: 8px 10px; border-top: 1px solid var(--borda); overflow-wrap: normal; }
.documento th { background: var(--sup-2); border-top: 0; color: var(--texto-1); }
.documento th:empty { display: none; }
.documento td { color: var(--texto-2); min-width: 110px; }

.rodape { max-width: 1180px; margin: 0 auto; padding: 8px 16px 32px; font-size: 13px; color: var(--texto-3); }

/* referência: o Swagger UI só tem tema claro; a página acompanha */
.ref .aviso { max-width: 1460px; margin: 16px auto 0; padding: 12px 16px; background: var(--marca-suave);
  border-left: 4px solid var(--marca); border-radius: 0 var(--r) var(--r) 0; font-size: 14px; color: var(--texto-2); }
@media (min-width: 1500px) { .ref .aviso { margin: 16px auto 0; } }
.ref .aviso a { color: var(--marca-texto); }
.swagger-ui .topbar { display: none; }
.swagger-ui .info .title { color: var(--texto-1); }
.swagger-ui .btn.authorize { color: var(--marca-texto); border-color: var(--marca); }
.swagger-ui .btn.authorize svg { fill: var(--marca-texto); }
