/* ── bash-exercise.css — bash terminal interactive exercise widget ────
   Companion to bash-exercise.js. Independent of bash_terminal_emulator/
   (which has its own styling for the terminal itself, inside the iframe).
   All classes are prefixed with  bash-  to avoid collisions, mirroring
   cpp-runner.css's conventions (same color palette, same
   --pst-font-family-monospace usage) for visual consistency with the
   existing widget family.
   ──────────────────────────────────────────────────────────────────── */

/* ── The JSON config block is data, not something a student should see ──
   !important: the theme's own code-block wrapper styling (copy button etc.)
   sets display on this same element with higher specificity otherwise --
   confirmed by inspecting the actual rendered page, this rule alone is
   not enough without it. cpp-runner.css already does the same for the
   same kind of reason (see its .cpp-editable rule). */
.bash-exercise-config {
  display: none !important;
}

/* ── Embedded terminal iframe ──────────────────────────────────────── */
.bash-terminal-frame {
  display: block;
  width: 100%;
  height: 200px;
  margin-top: 0.55rem;
  border: 1px solid #c5cdd6;
  border-radius: 4px;
}

/* `:class: quiz-bash large` on the exercise directive */
.bash-terminal-frame.bash-terminal-large {
  height: 500px;
}

/* `:class: quiz-bash small` on the exercise directive — fits ~3 lines */
.bash-terminal-frame.bash-terminal-small {
  height: 100px;
}

/* ── Button row ────────────────────────────────────────────────────── */
.bash-btn-row {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
  margin-top: 0.45rem;
}

.bash-secondary-btn {
  padding: 0.3rem 0.75rem;
  font-size: 0.88rem;
  border: 1px solid #aab;
  border-radius: 4px;
  background: transparent;
  color: #555;
  cursor: pointer;
  white-space: nowrap;
}

.bash-secondary-btn:hover:not(:disabled) { background: #f0f0f0; }
.bash-secondary-btn:disabled { opacity: 0.55; cursor: default; }

/* ── Feedback panel ────────────────────────────────────────────────── */
.bash-feedback-panel {
  margin-top: 0.55rem;
  padding: 0.55rem 0.85rem;
  border-radius: 0 4px 4px 0;
  font-family: var(--pst-font-family-monospace, monospace);
  font-size: 0.88rem;
  border-left: 3px solid #aab4be;
  background: rgba(0,0,0,0.03);
  color: #222;
}

.bash-feedback-line {
  display: block;
}

.bash-feedback-pass {
  color: #1e7e34;
}

.bash-feedback-fail {
  color: #5a1010;
}

.bash-feedback-hint {
  color: #7a5c00;
}

.bash-success-msg {
  margin-top: 0.55rem;
  padding: 0.4rem 0.85rem;
  border-left: 3px solid #2a7a2a;
  background: #f2faf2;
  border-radius: 0 4px 4px 0;
  font-weight: 600;
  font-size: 0.9rem;
  color: #1e7e34;
}

/* ── Debug event log (spec.debug = true) ───────────────────────────── */
.bash-debug-wrap {
  margin-top: 0.55rem;
  border: 1px dashed #aab4be;
  border-radius: 4px;
  overflow: hidden;
}

.bash-debug-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.3rem 0.65rem;
  background: #f5f7fa;
  border-bottom: 1px dashed #aab4be;
  font-family: var(--pst-font-family-monospace, monospace);
  font-size: 0.82rem;
  color: #556;
  font-weight: 600;
}

.bash-debug-clear-btn {
  padding: 0.15rem 0.5rem;
  font-size: 0.78rem;
  border: 1px solid #aab;
  border-radius: 3px;
  background: transparent;
  color: #667;
  cursor: pointer;
}
.bash-debug-clear-btn:hover { background: #eaecf0; }

.bash-debug-panel {
  max-height: 180px;
  overflow-y: auto;
  padding: 0.35rem 0.65rem;
  font-family: var(--pst-font-family-monospace, monospace);
  font-size: 0.82rem;
  line-height: 1.55;
}

.bash-debug-empty {
  color: #999;
  font-style: italic;
}

.bash-debug-row {
  display: flex;
  gap: 0.6rem;
  align-items: baseline;
}

.bash-debug-type {
  color: #2a6496;
  white-space: nowrap;
  flex-shrink: 0;
}

.bash-debug-payload {
  color: #444;
  word-break: break-all;
}

/* ── Dark mode ─────────────────────────────────────────────────────── */
@media (prefers-color-scheme: dark) {
  .bash-terminal-frame {
    border-color: #555;
  }

  .bash-secondary-btn{ color: #aaa; border-color: #555; }
  .bash-secondary-btn:hover:not(:disabled) { background: #2a2d35; }

  .bash-feedback-panel { background: rgba(255,255,255,0.04); color: #ccc; border-left-color: #556; }
  .bash-feedback-pass   { color: #5cb85c; }
  .bash-feedback-fail   { color: #d09090; }
  .bash-feedback-hint   { color: #d4b85a; }

  .bash-success-msg  { background: #1a2e1a; border-left-color: #3a7a3a; color: #5cb85c; }

  .bash-debug-wrap    { border-color: #445; }
  .bash-debug-header  { background: #1e2128; border-bottom-color: #445; color: #99a; }
  .bash-debug-clear-btn { border-color: #445; color: #889; }
  .bash-debug-clear-btn:hover { background: #2a2d35; }
  .bash-debug-panel   { }
  .bash-debug-empty   { color: #667; }
  .bash-debug-type    { color: #6ab0d4; }
  .bash-debug-payload { color: #bbb; }
}