/* ==========================================================================
   Terminal and Run tool windows.

   Palette entries the shared tokens do not carry (a terminal needs the eight
   ANSI colours) are declared here against the same two themes, so nothing in
   this file ever names a literal colour outside the two token blocks below.
   ========================================================================== */

:root, [data-theme='darcula'] {
  --term-bg: #1e1f22;
  --term-fg: #bcbec4;
  --term-dim: #7a7e85;
  --term-bold: #dfe1e5;
  --term-red: #f75464;
  --term-green: #6aab73;
  --term-yellow: #e0c341;
  --term-blue: #56a8f5;
  --term-magenta: #c77dbb;
  --term-cyan: #2aacb8;
  --term-caret: #cdd0d6;
  --term-caret-fg: #1e1f22;
  --term-sel: #214283;
  --term-tab-bg: #2b2d30;
  --term-link: #548af7;
  --run-console-bg: #1e1f22;
  --run-hit-bg: rgba(53, 116, 240, 0.16);
}

[data-theme='light'] {
  --term-bg: #ffffff;
  --term-fg: #1e1f22;
  --term-dim: #8c8c8c;
  --term-bold: #000000;
  --term-red: #cc4b4b;
  --term-green: #067d17;
  --term-yellow: #9e880d;
  --term-blue: #1750eb;
  --term-magenta: #871094;
  --term-cyan: #00627a;
  --term-caret: #1e1f22;
  --term-caret-fg: #ffffff;
  --term-sel: #a6d2ff;
  --term-tab-bg: #f7f8fa;
  --term-link: #1a5fb4;
  --run-console-bg: #ffffff;
  --run-hit-bg: rgba(53, 116, 240, 0.12);
}

[data-theme='hc'] {
  --term-bg: #000000;
  --term-fg: #ffffff;
  --term-dim: #b0b0b0;
  --term-bold: #ffffff;
  --term-caret: #ffffff;
  --term-caret-fg: #000000;
  --term-tab-bg: #000000;
  --run-console-bg: #000000;
}

/* ------------------------------------------------------------- terminal */

.term-root {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  background: var(--term-bg);
  min-height: 0;
}

.term-tabs {
  display: flex;
  align-items: center;
  gap: 2px;
  flex: none;
  height: 26px;
  padding: 0 4px;
  background: var(--term-tab-bg);
  border-bottom: 1px solid var(--bd);
  overflow-x: auto;
  scrollbar-width: none;
}
.term-tabs::-webkit-scrollbar { height: 0; }

.term-tab {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex: none;
  height: 20px;
  padding: 0 4px 0 7px;
  border-radius: var(--radius-s);
  color: var(--fg-dim);
  font-size: var(--fs-ui-s);
  white-space: nowrap;
  transition: background 90ms var(--ease), color 90ms var(--ease);
}
.term-tab:hover { background: var(--bg-hover); color: var(--fg); }
.term-tab.active { background: var(--bg-pressed); color: var(--fg); }
.term-tab svg { width: 13px; height: 13px; opacity: var(--icon-op); }
.term-tab-x {
  display: grid;
  place-items: center;
  width: 14px;
  height: 14px;
  border-radius: 2px;
  opacity: 0;
}
.term-tab:hover .term-tab-x, .term-tab.active .term-tab-x { opacity: 0.65; }
.term-tab-x:hover { background: var(--bg-hover); opacity: 1; }
.term-tab-x svg { width: 10px; height: 10px; }
.term-tab-add {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  flex: none;
  border-radius: var(--radius-s);
  color: var(--fg-muted);
}
.term-tab-add:hover { background: var(--bg-hover); color: var(--fg); }
.term-tab-add svg { width: 13px; height: 13px; }

.term-panes { display: flex; flex: 1; min-height: 0; gap: 1px; background: var(--bd); }

.term-pane {
  position: relative;
  display: flex;
  flex: 1 1 0;
  min-width: 0;
  min-height: 0;
  background: var(--term-bg);
}
.term-panes > .term-pane + .term-pane { border-left: 1px solid var(--bd); }
.term-pane.active::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px transparent;
}
.term-panes > .term-pane:not(:only-child).active::after { box-shadow: inset 0 0 0 1px var(--bd-focus); }

.term-scroll {
  flex: 1;
  min-width: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 4px 8px 8px;
  scrollbar-width: thin;
  scrollbar-color: var(--scroll-thumb) transparent;
}

.term-out {
  font-family: var(--font-mono);
  font-size: var(--fs-editor);
  line-height: 1.45;
  color: var(--term-fg);
  user-select: text;
  cursor: text;
  white-space: pre-wrap;
  word-break: break-word;
}
.term-out ::selection { background: var(--term-sel); }

.term-line { min-height: 1.45em; white-space: pre-wrap; }
.term-prompt-line.running { min-height: 0; }
.term-probe { position: absolute; visibility: hidden; white-space: pre; }

.term-cursor {
  background: var(--term-caret);
  color: var(--term-caret-fg);
  border-radius: 1px;
  animation: termBlink 1.06s steps(1) infinite;
}
@keyframes termBlink { 0%, 55% { opacity: 1; } 56%, 100% { opacity: 0.25; } }

.term-keys {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 1px;
  height: 1px;
  padding: 0;
  border: 0;
  resize: none;
  opacity: 0;
  background: transparent;
}

.term-link, .run-link {
  color: var(--term-link);
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
.term-link:hover, .run-link:hover { text-decoration-thickness: 2px; }

/* chunk colours, shared by both windows */
.t-plain { color: var(--term-fg); }
.t-dim { color: var(--term-dim); }
.t-bold { font-weight: 700; color: var(--term-bold); }
.t-red { color: var(--term-red); }
.t-green { color: var(--term-green); }
.t-yellow { color: var(--term-yellow); }
.t-blue { color: var(--term-blue); }
.t-magenta { color: var(--term-magenta); }
.t-cyan { color: var(--term-cyan); }
.t-link { color: var(--term-link); }

/* ------------------------------------------------------------------ run */

.run-root {
  position: absolute;
  inset: 0;
  display: flex;
  min-height: 0;
  background: var(--bg-panel);
}
.run-root > .tw-empty { flex: 1; }
.run-tb-sep { width: 16px; height: 1px; background: var(--bd-soft); margin: 4px 0; flex: none; }
.run-root .tw-act.stop svg { color: var(--stop-red); }
.run-root .tw-act.stop.disabled svg { color: var(--fg-disabled); }

.run-main { display: flex; flex-direction: column; flex: 1; min-width: 0; min-height: 0; }

.run-status {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: none;
  height: 28px;
  padding: 0 10px;
  border-bottom: 1px solid var(--bd-soft);
  font-size: var(--fs-ui-s);
  color: var(--fg-dim);
  white-space: nowrap;
  overflow: hidden;
}
.run-cfg { display: inline-flex; align-items: center; gap: 5px; color: var(--fg); font-weight: 600; }
.run-cfg svg { width: 13px; height: 13px; color: var(--run-green); }
.run-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--fg-muted); flex: none; }
.run-dot.ok { background: var(--run-green); }
.run-dot.fail { background: var(--stop-red); }
.run-dot.warn { background: var(--sq-warning); }
.run-state.ok { color: var(--run-green); }
.run-state.fail { color: var(--stop-red); }
.run-state.warn { color: var(--sq-warning); }
.run-counts { color: var(--fg-muted); }
.run-counts b { font-weight: 600; }
.run-counts b.ok { color: var(--run-green); }
.run-counts b.fail { color: var(--stop-red); }
.run-progress {
  flex: 1;
  min-width: 40px;
  max-width: 200px;
  height: 4px;
  border-radius: 2px;
  background: var(--bd-soft);
  overflow: hidden;
}
.run-progress > i { display: block; height: 100%; background: var(--run-green); transition: width 140ms linear; }
.run-progress.fail > i { background: var(--stop-red); }
.run-elapsed { margin-left: auto; font-variant-numeric: tabular-nums; color: var(--fg-muted); }

.run-body { display: flex; flex: 1; min-height: 0; }

.run-tests {
  width: 300px;
  flex: none;
  overflow: auto;
  padding: 4px 0;
  border-right: 1px solid var(--bd-soft);
  font-size: var(--fs-ui);
  scrollbar-width: thin;
  scrollbar-color: var(--scroll-thumb) transparent;
}
.run-suite {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 3px 8px;
  color: var(--fg);
  font-weight: 600;
}
.run-suite svg { width: 14px; height: 14px; flex: none; }
.run-suite.failed { color: var(--stop-red); }
.run-suite .label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.run-suite-count { margin-left: auto; color: var(--fg-muted); font-weight: 400; font-size: var(--fs-ui-s); }
.run-test {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 2px 8px 2px 22px;
  color: var(--fg-dim);
  white-space: nowrap;
}
.run-test:hover { background: var(--bg-hover); }
.run-test.selected { background: var(--bg-sel); color: var(--fg); }
.run-test .label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.run-test.pending { opacity: 0.45; }
.run-test.failed { color: var(--stop-red); }
.run-test-icon { display: grid; place-items: center; flex: none; }
.run-test-icon svg { width: 13px; height: 13px; }
.run-test-icon.passed { color: var(--run-green); }
.run-test-icon.failed { color: var(--stop-red); }
.run-test-icon.skipped, .run-test-icon.pending { color: var(--fg-muted); }
.run-time {
  margin-left: auto;
  flex: none;
  white-space: nowrap;
  color: var(--fg-muted);
  font-size: var(--fs-ui-s);
  font-variant-numeric: tabular-nums;
}

.run-console-wrap { display: flex; flex-direction: column; flex: 1; min-width: 0; min-height: 0; }

.run-console {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 4px 10px 10px;
  background: var(--run-console-bg);
  font-family: var(--font-mono);
  font-size: var(--fs-editor);
  line-height: 1.45;
  color: var(--term-fg);
  user-select: text;
  white-space: pre-wrap;
  word-break: break-word;
  scrollbar-width: thin;
  scrollbar-color: var(--scroll-thumb) transparent;
}
.run-console.nowrap { white-space: pre; word-break: normal; overflow-x: auto; }
.run-console ::selection { background: var(--term-sel); }
.run-line { min-height: 1.45em; border-radius: 2px; }
.run-line.hit { background: var(--run-hit-bg); box-shadow: inset 2px 0 0 var(--accent); }

.run-assert {
  flex: none;
  max-height: 132px;
  overflow: auto;
  padding: 6px 10px 8px;
  border-top: 1px solid var(--bd-soft);
  background: var(--bg-panel);
  font-size: var(--fs-ui-s);
}
.run-assert-title { color: var(--fg); font-weight: 600; margin-bottom: 4px; word-break: break-all; }
.run-assert-row { display: flex; gap: 8px; padding: 1px 0; font-family: var(--font-mono); }
.run-assert-row .k { width: 62px; flex: none; color: var(--fg-muted); font-family: var(--font-ui); }
.run-assert-row .v { color: var(--fg); word-break: break-all; }
.run-assert-row .v.ok { color: var(--run-green); }
.run-assert-row .v.fail { color: var(--stop-red); }
.run-assert-frame {
  margin-top: 3px;
  font-family: var(--font-mono);
  color: var(--term-link);
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
  word-break: break-all;
}

/* ----------------------------------------------------------- responsive */

@media (max-width: 900px) {
  .run-tests { width: 210px; }
  .run-progress { display: none; }
}
@media (max-width: 640px) {
  .run-tests { display: none; }
  .run-cfg { max-width: 130px; overflow: hidden; text-overflow: ellipsis; }
}
body.tiny .term-tab .label { max-width: 88px; overflow: hidden; text-overflow: ellipsis; }
