/* pages/api-logs.css — D4 Epic K refresh styles.
   Depends on tokens.css + components.css + shell.css. */

/* Filter card */
.ot-inspector-filter {
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ot-inspector-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: flex-end;
}
.ot-inspector-filter-field { display: flex; flex-direction: column; gap: 4px; }
.ot-inspector-filter-field .ot-input,
.ot-inspector-filter-field .ot-select { min-width: 140px; }
.ot-inspector-filter-field--uuid .ot-input { min-width: 280px; font-family: var(--ot-font-mono); }
.ot-inspector-filter-field--wide .ot-input { min-width: 200px; }
.ot-inspector-filter-field--narrow .ot-input { min-width: 96px; }
.ot-inspector-filter-actions { display: flex; gap: 6px; margin-left: auto; }

/* List table-specific tweaks */
.ot-inspector-table td { font-size: 12px; }
.ot-inspector-table .col-ts    { width: 148px; font-family: var(--ot-font-mono); color: var(--ot-text-3); }
.ot-inspector-table .col-method { width: 68px; }
/* col-uri: max-width:0 is the CSS idiom for a flex-growing table cell that
   clips with ellipsis; the actual width is the remainder after sibling
   columns take their fixed widths. */
.ot-inspector-table .col-uri   { font-family: var(--ot-font-mono); max-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ot-inspector-table .col-status { width: 60px; font-family: var(--ot-font-mono); font-weight: 600; }
.ot-inspector-table .col-code  { width: 72px; font-family: var(--ot-font-mono); color: var(--ot-text-2); }
.ot-inspector-table .col-dur   { width: 72px; font-family: var(--ot-font-mono); text-align: right; color: var(--ot-text-2); }
.ot-inspector-table .col-user  { width: 100px; font-family: var(--ot-font-mono); color: var(--ot-text-3); }
.ot-inspector-table .col-trace { width: 96px; }
.ot-inspector-table .col-error { color: var(--ot-danger); font-size: 11px; }

.ot-inspector-table .status-4xx { color: var(--ot-danger); }
.ot-inspector-table .status-5xx { color: var(--ot-danger); font-weight: 700; }
.ot-inspector-table .status-3xx { color: var(--ot-warning); }
.ot-inspector-table .dur-slow   { color: var(--ot-warning); }
.ot-inspector-table .dur-vslow  { color: var(--ot-danger); font-weight: 600; }

/* Meta definition list (detail page) */
.ot-meta-dl dt,
.ot-meta-dl dd { margin: 0; }

/* Pagination footer */
.ot-inspector-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  border-top: 1px solid var(--ot-divider);
  font-size: 12px;
  color: var(--ot-text-3);
}
.ot-inspector-pagination-actions { display: flex; gap: 8px; }