@import "https://assets.elements.dev/assets/app/shared/ui-catalog/catalog/style.c38e1d7304920e3.css";

.prompt-demo-chat {
  display:        flex;
  flex-direction: column;
  gap:            var(--space-2);
  width:          100%;
  max-width:      var(--container-md);
  height:         calc(var(--control-height) * 13);
  padding:        var(--space-2);
  border:         var(--surface-border-width) solid var(--surface-border);
  border-radius:  var(--radius-surface);
  background:     var(--surface-bg);
}

.prompt-demo-box {
  display:        flex;
  flex-direction: column;
  gap:            var(--space-2);
  width:          100%;
  max-width:      var(--container-md);
}

/* A character count beside the tools: a fixed width for the longest count. */
.prompt-demo-count {
  min-width:            9ch;
  white-space:          nowrap;
  font-family:          var(--font-mono);
  font-size:            var(--text-xs);
  font-variant-numeric: tabular-nums;
  color:                var(--ink-dim);
}

.prompt-demo-tabs {
  min-width: calc(var(--container-xs) * 0.7);
}

.prompt-demo-sent {
  margin:      0;
  padding:     0;
  list-style:  none;
  min-height:  1lh;
}

.prompt-demo-command {
  border-bottom: 1px solid var(--rule);
}

.prompt-demo-command .command-list {
  max-height: calc(var(--item-height) * 3.5);
}

.prompt-demo-row {
  display:   flex;
  flex-wrap: wrap;
  gap:       var(--space-2);
}

.prompt-demo-cursor {
  min-width: calc(var(--container-xs) * 0.8);
}