/*
 * jobs.css — the Jobs panel styles (Session 8).
 * The panel reuses the dialog shell classes (dialog-head/dialog-body)
 * from dashboard.css and the log body from log.css (log-panel__body);
 * this file owns only the panel-specific chrome: the dialog width, the
 * two tables (own jobs + systemd units), the state chips, the
 * scheduler health line, and the drill-in log view. No palette values
 * inline (design §9): every color comes from tokens.css custom
 * properties. No framework, no CDN (D1/D2).
 */

/* --- dialog ------------------------------------------------------------ */

dialog.jobs-dialog {
  width: min(60rem, 94vw);
  max-width: min(94vw, 1000px);
}

.jobs-autorefresh-label {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.78rem;
  color: var(--text-muted);
  white-space: nowrap;
}

/* --- scheduler health line --------------------------------------------- */

.jobs-scheduler-line {
  margin: 0 0 0.6rem 0;
  font-size: 0.78rem;
  color: var(--text-muted);
}

/* --- tables ------------------------------------------------------------- */

.jobs-section {
  margin-bottom: 0.9rem;
}

.jobs-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
}

.jobs-table th {
  text-align: left;
  padding: 0.4rem 0.6rem;
  border-bottom: 1px solid var(--border);
  color: var(--text-muted);
  font-weight: 600;
  position: sticky;
  top: 0;
  background: var(--bg-raised);
}

.jobs-table td {
  padding: 0.4rem 0.6rem;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
  word-break: break-word;
}

.jobs-table td.cell-mono,
.jobs-table td.cell-time {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.78rem;
  white-space: nowrap;
}

.jobs-table td.cell-error {
  color: var(--err);
  word-break: break-all;
}

.jobs-table tr.state td {
  color: var(--text-muted);
  font-style: italic;
}

/* Unit rows open the drill-in: a visible affordance, never a mystery
   click (grid standard §5: obvious affordances). */
.jobs-table tr[data-unit] {
  cursor: pointer;
}

.jobs-table tr[data-unit]:hover {
  background: var(--bg-inset);
}

/* --- state chips (unit + job result) ------------------------------------- */

.unit-state-chip,
.job-result-chip {
  display: inline-block;
  padding: 0.1rem 0.5rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 600;
  border: 1px solid var(--border);
}

.unit-state-chip--active { color: var(--ok); }
.unit-state-chip--inactive { color: var(--text-muted); }
.unit-state-chip--failed { color: var(--err); }
.unit-state-chip--unknown {
  color: var(--text-muted);
  border-style: dashed;
}

.job-result-chip--ok { color: var(--ok); }
.job-result-chip--error { color: var(--err); }
.job-result-chip--never { color: var(--text-muted); border-style: dashed; }

/* --- drill-in log view ---------------------------------------------------- */

.jobs-drillin {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 0.5rem 0.65rem;
  background: var(--bg-inset);
}

.jobs-drillin__head {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.4rem;
}

.jobs-drillin__title {
  font-size: 0.8rem;
  font-weight: 600;
}

.jobs-drillin__title .jobs-drillin__unit {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.jobs-drillin__body {
  max-height: 16rem;
  overflow-y: auto;
  margin: 0;
}

.jobs-drillin__body .log-line--select { color: var(--accent); }
.jobs-drillin__body .log-line--ring { color: var(--warn); }
.jobs-drillin__body .log-line--resp { color: var(--ok); }
.jobs-drillin__body .log-line--codec { color: var(--accent); }
.jobs-drillin__body .log-line--fail { color: var(--err); font-weight: 600; }
.jobs-drillin__body .log-line--deny { color: var(--err); font-weight: 600; }
.jobs-drillin__body .log-line--error { color: var(--err); }
.jobs-drillin__body .log-line--warn { color: var(--warn); }

.jobs-drillin__meta {
  font-size: 0.72rem;
  color: var(--text-muted);
  margin: 0.35rem 0 0 0;
}