/* ========================================================================
   Supported AI Providers list

   Used by:
     docs/agentq/deep-dive/supported-ai-providers.md

   Provider names stay on one line so the column reads as a list of names,
   the File Uploads mark sizes to its icon, and the model column takes
   whatever is left over.
   ======================================================================== */
.agentq-providers-table table {
  width: 100%;
  /* The theme already wraps tables in its own horizontal scroller, so a second
     overflow container here would draw a second scrollbar. A min-width is all
     that is needed: below it the table overflows and the theme's wrapper scrolls. */
  min-width: 48rem;
}

.agentq-providers-table table th,
.agentq-providers-table table td {
  vertical-align: top;
}

.agentq-providers-table table th:nth-child(1),
.agentq-providers-table table td:nth-child(1) {
  white-space: nowrap;
  min-width: 14rem;
}

.agentq-providers-table table th:nth-child(2),
.agentq-providers-table table td:nth-child(2) {
  width: 100%;
}

.agentq-providers-table table th:nth-child(3),
.agentq-providers-table table td:nth-child(3) {
  white-space: nowrap;
  text-align: center;
}

/* Stacked model IDs: line-height alone sets the rhythm, so a provider with three
   models does not open the row to three paragraphs' worth of height. */
.agentq-providers-table table td:nth-child(2) {
  line-height: 1.9;
}

/* The footnote marker sits right against the provider name otherwise. A margin
   rather than a literal space, so it cannot collapse or wrap on its own. */
.agentq-providers-table table td sup {
  margin-left: 0.3em;
}

/* Table notes, set as a footnote block directly under the table rather than at
   the page foot, so a marker and its note stay within one glance of each other.
   A hairline and a quiet label separate them from the table without the weight
   of a section rule, and each note is a paragraph, not a list item, so its
   number can carry the same superscript shape the marker in the table has. */
.agentq-providers-notes {
  /* The table scrolls horizontally, so its scrollbar sits right under it. The
     top margin clears that bar before the rule is drawn. */
  margin: 1.4rem 0 1.2rem;
  padding-top: 0.7rem;
  border-top: 1px solid var(--md-default-fg-color--lighter);
}

.agentq-providers-notes .agentq-notes-label {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  opacity: 0.55;
  margin: 0 0 0.4em;
}

.agentq-providers-notes p {
  font-size: 0.75rem;
  line-height: 1.7;
  margin: 0.15em 0;
  color: var(--md-default-fg-color--light);
}

.agentq-providers-notes p > sup:first-child {
  margin-right: 0.3em;
  font-weight: 700;
}
