/* ============================================
   IntegraRenave — página de documentação da API
   ============================================ */

.docs { padding: 48px 0 60px; max-width: 900px; }

.docs-intro { padding-bottom: 10px; }

.docs-intro h1 {
  font-size: clamp(1.8rem, 3.4vw, 2.5rem);
  color: var(--titulo);
  letter-spacing: -1px;
  line-height: 1.15;
  margin: 14px 0 12px;
}

.docs-intro p { color: var(--texto-suave); font-size: 1.05rem; max-width: 700px; }

.docs-base-url {
  margin-top: 18px;
  background: var(--superficie);
  border: 1.5px solid var(--borda);
  border-radius: 12px;
  padding: 12px 16px;
  font-size: 0.92rem;
  color: var(--texto);
}

.docs-base-url code { color: var(--laranja-texto); font-weight: 700; }

.docs section { padding: 34px 0 6px; }

.docs h2 {
  color: var(--titulo);
  font-size: 1.4rem;
  letter-spacing: -0.5px;
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.docs h2 .ic { color: var(--laranja); width: 22px; height: 22px; }

.docs h3 { color: var(--titulo); font-size: 1.05rem; margin: 22px 0 10px; }

.docs p { color: var(--texto); font-size: 0.95rem; margin-bottom: 10px; }

.docs code {
  background: var(--azul-claro);
  color: var(--titulo);
  border-radius: 6px;
  padding: 2px 7px;
  font-size: 0.85em;
  font-family: Consolas, "Courier New", monospace;
}

.docs-lista { list-style: none; display: grid; gap: 8px; margin: 12px 0; }

.docs-lista li {
  padding-left: 22px;
  position: relative;
  font-size: 0.93rem;
  color: var(--texto);
}

.docs-lista li::before {
  content: "→";
  position: absolute;
  left: 0;
  color: var(--laranja-texto);
  font-weight: 800;
}

/* Tabelas */
.docs-tabela {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.89rem;
  margin: 12px 0 18px;
  background: var(--superficie);
  border: 1px solid var(--borda);
  border-radius: 12px;
  overflow: hidden;
}

.docs-tabela th {
  text-align: left;
  font-size: 0.73rem;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: var(--texto-suave);
  padding: 11px 14px;
  border-bottom: 2px solid var(--borda);
  background: var(--campo-fundo);
}

.docs-tabela td {
  padding: 12px 14px;
  border-bottom: 1px solid var(--borda);
  vertical-align: top;
  color: var(--texto);
}

.docs-tabela tr:last-child td { border-bottom: none; }

/* Badges de método HTTP */
.metodo {
  display: inline-block;
  font-weight: 800;
  font-size: 0.72rem;
  padding: 3px 10px;
  border-radius: 7px;
  letter-spacing: 0.5px;
}

.metodo.get { background: var(--verde-claro); color: var(--verde-texto); }
.metodo.post { background: var(--azul-claro); color: var(--titulo); }
.metodo.patch { background: var(--laranja-claro); color: #a05a12; }
html[data-tema="escuro"] .metodo.patch { color: #f3b26b; }
.metodo.delete { background: var(--vermelho-claro); color: var(--vermelho-texto); }

/* Blocos de código */
.bloco-codigo {
  background: #10141f;
  color: #d7e0f2;
  border-radius: 12px;
  padding: 16px 18px;
  font-family: Consolas, "Courier New", monospace;
  font-size: 0.82rem;
  overflow-x: auto;
  margin: 12px 0 16px;
  line-height: 1.6;
  white-space: pre;
}

.voltar-site {
  margin-top: 30px;
  font-size: 0.9rem;
  color: var(--texto-suave);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
}

.voltar-site:hover { color: var(--laranja-texto); }

@media (max-width: 700px) {
  .docs-tabela { display: block; overflow-x: auto; }
}

/* ---------- Impressão da documentação ---------- */
@media print {
  .navbar, .guga-botao, .guga-painel, .rodape, .btn { display: none !important; }
  .bloco-codigo { background: #fff !important; color: #111; border: 1px solid #ccc; white-space: pre-wrap; }
  .bloco-codigo .cmt { color: #666; }
  .bloco-codigo .str { color: #155e3f; }
}