/* Inference pages shared by Plower and admin: LLM router and evals. */

/* ==========================================================================
   Evals (see evals.rs)
   ========================================================================== */

.infra-evals__select-all td {
  font-size: var(--text-xs);
}

.infra-evals__run-row {
  cursor: pointer;
}

.infra-evals__run-row:hover,
.infra-evals__run-row:focus-visible,
.infra-evals__run-row.is-active {
  background: var(--bg-hover);
}

.infra-evals__summary {
  color: var(--text-dim);
  margin: 0 0 var(--space-4);
}

.infra-evals__scores {
  display: grid;
  gap: var(--space-3);
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  margin-bottom: var(--space-5);
}

.infra-evals__score {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--bg-inset);
  padding: var(--space-4);
  min-width: 0;
}

.infra-evals__score header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
}

.infra-evals__score h3 {
  font-family: var(--font-display);
  font-size: var(--text-sm);
  text-transform: capitalize;
  margin: 0;
}

.infra-evals__score p {
  color: var(--text-dim);
  font-size: var(--text-sm);
  margin: var(--space-2) 0 0;
}

.infra-evals__bar {
  height: 6px;
  border-radius: var(--radius-sm);
  background: var(--line);
  overflow: hidden;
}

.infra-evals__bar-fill {
  display: block;
  height: 100%;
}

.infra-evals__bar-fill--success { background: var(--color-success); }
.infra-evals__bar-fill--danger { background: var(--color-danger); }

.infra-evals__score-value {
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  color: var(--text-faint);
  margin-top: var(--space-1);
}

.infra-evals__evidence,
.infra-evals__causes {
  list-style: none;
  margin: var(--space-3) 0 0;
  padding: 0;
  display: grid;
  gap: var(--space-2);
}

.infra-evals__evidence li,
.infra-evals__causes li {
  font-size: var(--text-xs);
  color: var(--text-dim);
  border-left: 2px solid var(--line-strong);
  padding-left: var(--space-3);
}

.infra-evals__evidence blockquote {
  margin: var(--space-1) 0;
  color: var(--text);
  font-style: italic;
  overflow-wrap: anywhere;
}

.infra-evals__causes p {
  margin: var(--space-1) 0 0;
}

.infra-evals__adhoc {
  display: grid;
  gap: var(--space-3);
  max-width: 760px;
}

.infra-evals__adhoc textarea {
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  min-height: 160px;
  resize: vertical;
}


/* ==========================================================================
   LLM router (router/*.rs). Sections, tables, drawers and fields are the
   shared ui-* components; these rules only lay out what they don't cover.
   ========================================================================== */

/* The page header's action: the last reload's result, then the button. */
.infra-router__deploy {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-3);
}

/* The one-time key reveal. */

/* Groups of fields with a label of their own (limits, days, weights). */
.infra-router__limits,
.infra-router__days,
.infra-router__weights {
  display: grid;
  gap: var(--space-2);
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.infra-router__limits > legend,
.infra-router__days > legend,
.infra-router__weights > legend { margin-bottom: var(--space-2); padding: 0; }
.infra-router__weights > .ui-field__hint { margin: 0; }
/* Limits sit under the form's other fields as a group of their own. */
.infra-router__limits > legend {
  color: var(--text);
  font-size: var(--text-14);
  font-weight: var(--weight-semibold);
}

.infra-router__drawer-note {
  margin: 0;
  max-width: var(--prose-max);
  color: var(--text-dim);
  font-size: var(--text-13);
}

/* One-line forms under a section: fields grow, the button keeps its size. */
.infra-router__add {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--space-3);
}
.infra-router__add > .ui-field { flex: 1 1 12rem; min-width: 0; }

.infra-router__strategy {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}
.infra-router__form-actions { display: flex; justify-content: flex-end; }

.infra-router__weight {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 7rem;
  align-items: center;
  gap: var(--space-3);
  font-size: var(--text-13);
}
.infra-router__weight > .u-mono { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Provider cards: one form per provider. */
.infra-router__providers {
  display: grid;
  gap: var(--space-4);
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr));
}
.infra-router__provider {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  min-width: 0;
  padding: var(--space-4);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--bg-raised);
}
.infra-router__provider-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}
.infra-router__provider-head h3 {
  margin: 0;
  font-size: var(--text-14);
  font-weight: var(--weight-semibold);
}
.infra-router__provider > .ui-field__hint { margin: 0; }
.infra-router__provider-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--space-2);
  margin-top: auto;
}