/* ========================================================================
   Jira connection field-reference tables

   Used by:
     docs/settings/integrations/ticketing/jira/how-tos/connection/add-connection.md
     docs/settings/integrations/ticketing/jira/how-tos/connection/edit-connection.md
   ======================================================================== */
/* Only a min-width here, never overflow-x: the theme already wraps every table
   in .md-typeset__scrollwrap, which scrolls and carries a -0.8rem side margin.
   A second scrolling wrapper around it is narrower than its own content and
   shows a stray scrollbar even when the table fits. Past this width the theme's
   wrapper scrolls instead of letting the nowrap columns squash the description. */
.jira-fields-table table {
  width: 100%;
  min-width: 34rem;
}

.jira-fields-table table th,
.jira-fields-table table td {
  vertical-align: top;
}

.jira-fields-table table th:nth-child(1),
.jira-fields-table table td:nth-child(1) {
  white-space: nowrap;
}

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

.jira-fields-table table th:nth-child(4),
.jira-fields-table table td:nth-child(4) {
  width: 100%;
}

/* ========================================================================
   Available ticketing integrations

   Used by:
     docs/settings/integrations/ticketing/ticketing.md
   ======================================================================== */
/* Same rule as the field table above: a min-width only, and the theme's own
   wrapper does the scrolling. Past this width the integration name and the
   capability columns keep their shape instead of wrapping into each other. */
.ticketing-list-table table {
  table-layout: fixed;
  width: 100%;
  min-width: 34rem;
}

/* The theme puts min-width: 5rem on every th, which fights the narrow columns. */
.ticketing-list-table table th {
  min-width: 0;
}

/* 1 - Logo + Integration: absorbs the width the capability columns leave. */
.ticketing-list-table table td:nth-child(1) img {
  vertical-align: middle;
  margin-right: 0.45rem;
}

/* 2 onwards - the capability columns: one fixed width for the three, centered.
   Wide enough for "Both ways" to sit on one line with room around it; the
   integration column absorbs whatever they leave. */
.ticketing-list-table table th:nth-child(n + 2),
.ticketing-list-table table td:nth-child(n + 2) {
  width: 8rem;
  text-align: center;
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}
