/* Route Planner Teams — документация API /teams/api/ (scripts/build-teams-api-page.js, 22.10.2026).
   Поверх how-to.css (токены, шапка, подвал, хлебные крошки), teams.css (кнопки .tp-btn) и teams-guides.css (колонка
   .tg-inner, заголовки, разделы, оглавление, заметки, списки). Здесь — код, таблицы полей и плашки методов. */

.ta-body {
  --code-bg: #F1F5F9;
  --code-border: #E2E8F0;
  --code-text: #0F172A;
  --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
}
.tg-inner { min-width: 0; }
/* Ссылки вводной части (заметка над оглавлением) — как в разделах гайдов */
.tg-article > .tg-note a { color: var(--accent); font-weight: 600; text-decoration: none; }
.tg-article > .tg-note a:hover { text-decoration: underline; }

/* Код в тексте */
.ta-body code {
  font-family: var(--mono);
  font-size: 0.88em;
  color: var(--code-text);
  background: rgba(15, 23, 42, 0.06);
  padding: 0.12em 0.38em;
  border-radius: 6px;
  overflow-wrap: anywhere;
}
.ta-body pre code { background: none; padding: 0; border-radius: 0; font-size: inherit; overflow-wrap: normal; }

/* Пример запроса / ответа: подпись и блок кода с прокруткой по горизонтали (страница не прокручивается вбок) */
.ta-example { margin: 4px 0 18px; min-width: 0; }
.ta-example figcaption {
  margin: 0 0 6px;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.ta-example figcaption code { text-transform: none; letter-spacing: 0; font-size: 0.95em; }
.ta-pre {
  margin: 0;
  max-width: 100%;
  padding: 14px 16px;
  background: var(--code-bg);
  border: 1px solid var(--code-border);
  border-radius: 12px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  font-family: var(--mono);
  font-size: 0.84rem;
  line-height: 1.6;
  color: var(--code-text);
  white-space: pre;
  tab-size: 2;
}
.ta-pre:focus-visible { outline: var(--focus-ring); outline-offset: var(--focus-offset); }

/* Заголовок метода: плашка GET / POST / DELETE и путь */
.tg-section .ta-endpoint {
  margin: 34px 0 10px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  font-size: 1.12rem;
  font-weight: 800;
  line-height: 1.3;
  color: var(--text);
  scroll-margin-top: calc(5.5rem + env(safe-area-inset-top, 0px));
}
.ta-endpoint code { font-size: 1.02rem; font-weight: 700; background: none; padding: 0; }
.ta-method {
  display: inline-block;
  min-width: 4.4em;
  padding: 3px 8px;
  border-radius: 7px;
  font-family: var(--mono);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  line-height: 1.45;
  text-align: center;
}
.ta-method--get { background: #DCFCE7; color: #14532D; }
.ta-method--post { background: #E0E7FF; color: #312E81; }
.ta-method--delete { background: #FEE2E2; color: #7F1D1D; }
.tg-section h3:not(.ta-endpoint) {
  margin: 26px 0 10px;
  scroll-margin-top: calc(5.5rem + env(safe-area-inset-top, 0px));
  font-size: 1.08rem;
  font-weight: 800;
  line-height: 1.3;
  color: var(--text);
}

/* Таблицы полей, ошибок и заголовков: описание переносится, первая колонка — нет */
.ta-table {
  margin: 4px 0 18px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
}
.ta-table table { width: 100%; border-collapse: collapse; font-size: 0.92rem; }
.ta-table th, .ta-table td {
  padding: 9px 12px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--border);
  line-height: 1.5;
}
.ta-table th { font-weight: 700; color: var(--text); background: var(--surface); white-space: nowrap; }
.ta-table td { color: var(--text); }
.ta-table td:first-child, .ta-table td.ta-nw { white-space: nowrap; }
.ta-table td:first-child code, .ta-table td.ta-nw code { overflow-wrap: normal; }
.ta-table td:last-child { min-width: 9em; }
/* Тип поля / HTTP-статус — под именем поля, серым */
.ta-ftype { display: block; margin-top: 3px; font-size: 0.82rem; color: var(--text-muted); }
.ta-table tbody tr:last-child td { border-bottom: none; }
.ta-table a { color: var(--accent); font-weight: 600; text-decoration: none; }
.ta-table a:hover { text-decoration: underline; }

@media (max-width: 480px) {
  .ta-body .howto-container {
    padding-left: max(16px, env(safe-area-inset-left));
    padding-right: max(16px, env(safe-area-inset-right));
  }
  .ta-pre { padding: 12px 14px; font-size: 0.8rem; }
  .ta-table table { font-size: 0.86rem; }
  .ta-table th, .ta-table td { padding: 8px 10px; }
}