/* pipeline.css - transformation pipeline panel (item 29). Variables first,
 * one dark block (A12 rule for every module stylesheet). */

:root {
  --pipe-bg: #f6f3ec;
  --pipe-border: #d8d2c4;
  --pipe-text: #2b2a26;
  --pipe-muted: #6b675c;
  --pipe-accent: #854f0b;
  --pipe-stage-bg: #fdfcf8;
}

body.dark {
  --pipe-bg: #23211c;
  --pipe-border: #3c382f;
  --pipe-text: #e8e6df;
  --pipe-muted: #a8a294;
  --pipe-accent: #d9a35c;
  --pipe-stage-bg: #2a2822;
}

#pipeline-panel {
  border: 1px solid var(--pipe-border);
  background: var(--pipe-bg);
  color: var(--pipe-text);
  border-radius: 6px;
  padding: 8px 10px;
  margin: 8px 0;
  font-size: 12.5px;
  max-height: 40%;
  overflow-y: auto;
}
#pipeline-panel[hidden] { display: none !important; }

.pipeline-head { display: flex; align-items: baseline; gap: 8px; margin-bottom: 4px; }
.pipeline-title { font-weight: 600; }
.pipeline-note { color: var(--pipe-muted); line-height: 1.45; margin-bottom: 6px; }

.pipeline-list { display: flex; flex-direction: column; gap: 6px; }
.pipeline-stage {
  border: 1px solid var(--pipe-border);
  background: var(--pipe-stage-bg);
  border-radius: 5px;
  padding: 6px 8px;
}
.pipeline-stage-top { display: flex; align-items: baseline; gap: 8px; }
.pipeline-stage-name { font-weight: 600; color: var(--pipe-accent); }
.pipeline-stage-scope { color: var(--pipe-muted); font-size: 11px; }
.pipeline-stage-summary { margin-top: 2px; line-height: 1.4; }
.pipeline-stage-notices { margin-top: 2px; color: var(--pipe-muted); font-size: 11px; }
.pipeline-empty { color: var(--pipe-muted); line-height: 1.45; }

.pipeline-override { display: flex; align-items: center; gap: 6px; margin-top: 4px; cursor: pointer; }
.pipeline-override input { margin: 0; }
.pipeline-override-label { color: var(--pipe-text); }