/* =========================================================
   /de/preisrechner-api + /ru/api-kalkulyatora — documentation
   of the public calculator interfaces (REST + MCP).
   Loaded only on these two pages (api-docs.blade.php @push).
   Tokens (--pa-*) come from design-system.css (:root).
   ========================================================= */

.api-docs-page .page-title { padding-bottom: 8px; }

.api-docs {
  max-width: 880px;
  margin:    0 auto;
  padding:   8px 0 32px;
}

.api-docs h2 {
  font-size:   24px;
  line-height: 32px;
  margin:      40px 0 12px;
  color:       var(--pa-text);
  text-align:  left;
}
.api-docs h3 {
  font-size:   18px;
  line-height: 26px;
  margin:      24px 0 8px;
  color:       var(--pa-primary);
}
.api-docs p,
.api-docs li,
.api-docs dd {
  font-size:   16px;
  line-height: 26px;
  color:       var(--pa-text);
}
.api-docs p  { margin: 0 0 14px; }
.api-docs ul,
.api-docs ol { margin: 0 0 14px; padding-left: 22px; }
.api-docs li { margin: 0 0 6px; }

.api-docs__lead {
  font-size:   18px;
  line-height: 28px;
  color:       var(--pa-text-muted);
}

/* Table of contents */
.api-docs__toc {
  background:    var(--pa-bg-alt);
  border:        1px solid var(--pa-border);
  border-radius: var(--pa-radius-card);
  padding:       16px 20px;
  margin:        20px 0 8px;
}
.api-docs__toc ol {
  columns:    2;
  column-gap: 24px;
  margin:     8px 0 0;
  padding-left: 20px;
}
.api-docs__toc li { font-size: 15px; line-height: 24px; break-inside: avoid; }

/* Quick facts (dl grid) */
.api-docs__facts {
  display:               grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap:                   12px;
  margin:                18px 0 16px;
}
.api-docs__fact {
  background:    var(--pa-bg);
  border:        1px solid var(--pa-border);
  border-radius: var(--pa-radius-card);
  box-shadow:    var(--pa-shadow-card);
  padding:       14px 16px;
  min-width:     0;
}
.api-docs__fact dt {
  font-size:      12px;
  font-weight:    700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color:          var(--pa-text-muted);
  margin:         0 0 4px;
}
.api-docs__fact dd {
  margin:        0;
  font-size:     15px;
  line-height:   22px;
  overflow-wrap: anywhere;
}

/* Code */
.api-docs code {
  font-family:   ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  font-size:     14px;
  background:    var(--pa-bg-alt);
  border:        1px solid var(--pa-border);
  border-radius: 4px;
  padding:       1px 6px;
  overflow-wrap: anywhere;
}
.api-docs pre {
  background:    var(--pa-primary-dark);
  color:         #e5e7eb;
  border-radius: var(--pa-radius-card);
  padding:       16px 18px;
  margin:        10px 0 18px;
  overflow-x:    auto;
  font-size:     13px;
  line-height:   20px;
  -webkit-overflow-scrolling: touch;
}
.api-docs pre code {
  background: transparent;
  border:     0;
  padding:    0;
  color:      inherit;
  font-size:  inherit;
  overflow-wrap: normal;
}

/* Tables (override design-system .content-section table rules by cascade position) */
.api-docs__scroll { overflow-x: auto; margin: 10px 0 18px; -webkit-overflow-scrolling: touch; }
.api-docs table {
  width:           100%;
  min-width:       600px;
  border-collapse: collapse;
  font-size:       15px;
}
.api-docs table th,
.api-docs table td {
  text-align:     left;
  vertical-align: top;
  padding:        10px 12px;
  border-bottom:  1px solid var(--pa-border);
  line-height:    22px;
}
.api-docs table th {
  background:  var(--pa-bg-alt);
  font-weight: 700;
  color:       var(--pa-text);
}

/* Callout */
.api-docs__note {
  border-left:   4px solid var(--pa-accent);
  background:    var(--pa-bg-alt);
  padding:       12px 16px;
  border-radius: 0 var(--pa-radius-card) var(--pa-radius-card) 0;
}

.api-docs__meta {
  font-size:   14px;
  line-height: 22px;
  color:       var(--pa-text-muted);
  margin-top:  24px;
}

@media (max-width: 767px) {
  .api-docs h2 { font-size: 21px; line-height: 28px; margin-top: 32px; }
  .api-docs__toc ol { columns: 1; }
  .api-docs__facts { grid-template-columns: 1fr; }
  .api-docs pre { padding: 12px 14px; font-size: 12px; line-height: 18px; }
  .api-docs__lead { font-size: 17px; line-height: 26px; }
}
