/* ============================================================
   GeoVisualizer — Background tasks UI (progress bar + Tasks tab)
   Matches the existing status bar / terminal vocabulary.
   ============================================================ */

/* ---- determinate progress bar in the status bar ---- */
.proc { min-width: 0; }
.proc-track { width: 96px; }
.proc-fill {
  position: absolute; left: 0; top: 0; bottom: 0; width: 0%;
  background: var(--accent);
  border-radius: 999px;
  transition: width 0.2s var(--ease);
}
/* Hide the determinate fill and run the wave only while % is unknown */
.proc .proc-wave { display: none; }
.proc.indeterminate .proc-fill { display: none; }
.proc.indeterminate .proc-wave { display: block; }
#proc-pct { color: var(--text-3); min-width: 30px; text-align: right; }
#proc-label {
  max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* ---- Task Console: "Tasks" tab ---- */
.terminal-tasks {
  flex: 1; overflow-y: auto; padding: 12px 14px;
  font-family: var(--font-mono); font-size: 12px;
  color: var(--text-2);
}
.tasks-empty { color: var(--text-3); padding: 6px 2px; line-height: 1.6; }

.task-row {
  padding: 9px 11px; margin-bottom: 8px;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r-md);
}
.task-row.running { border-color: color-mix(in srgb, var(--c-amber) 45%, var(--border)); }
.task-row.error { border-color: color-mix(in srgb, var(--c-rose) 45%, var(--border)); }

.task-top { display: flex; align-items: center; gap: 9px; }
.task-badge {
  font-size: 9.5px; padding: 1px 6px; border-radius: 4px; min-width: 58px; text-align: center;
  text-transform: uppercase; letter-spacing: 0.05em;
}
.task-badge.run { background: color-mix(in srgb, var(--c-amber) 18%, transparent); color: var(--c-amber); }
.task-badge.ok { background: color-mix(in srgb, var(--c-green) 18%, transparent); color: var(--c-green); }
.task-badge.err { background: color-mix(in srgb, var(--c-rose) 18%, transparent); color: var(--c-rose); }
.task-label { color: var(--text); flex: 1; font-family: var(--font-sans); font-weight: 500; }
.task-dur { color: var(--text-3); font-size: 11px; }
.task-msg { color: var(--text-2); margin: 5px 0 7px; font-size: 11.5px; }

.task-bar { height: 4px; border-radius: 999px; background: var(--surface-3); overflow: hidden; }
.task-bar-fill { height: 100%; border-radius: 999px; transition: width 0.2s var(--ease); }
.task-bar-fill.run { background: var(--c-amber); }
.task-bar-fill.ok { background: var(--c-green); }
.task-bar-fill.err { background: var(--c-rose); }