/* ───────────────────────────────────────────────────────────
   Jungla Digital — [jd_tui], clon del TUI de Claude Code.
   Misma ventana oscura que [jd_term]; adentro, las cajas
   redondeadas, el ✻ arcilla y la selección de opciones del
   Claude Code real.
   ─────────────────────────────────────────────────────────── */

.jd-tui{margin:2em 0;border:1px solid #1d4631;border-radius:12px;overflow:hidden;background:#06120A;font-family:var(--font-mono)}
:root[data-mode="consola"] .jd-tui{border-radius:0;border-color:color-mix(in srgb,#34E07A 35%,transparent)}

/* barra superior (idéntica a jd-term) */
.jd-tui__bar{display:flex;align-items:center;gap:12px;padding:10px 14px;background:#0A1B11;border-bottom:1px solid #143524;margin:0}
.jd-tui__dots{display:inline-flex;gap:6px}
.jd-tui__dots i{width:11px;height:11px;border-radius:99px;background:#1d4631}
.jd-tui__dots i:first-child{background:#FF5E3A}
.jd-tui__dots i:nth-child(2){background:#C3FF01}
.jd-tui__dots i:last-child{background:#34E07A}
.jd-tui__title{flex:1;font-size:12.5px;color:#5E8870;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jd-tui__play{background:none;border:1px solid #1d4631;border-radius:99px;color:#D6E8DC;font-family:var(--font-mono);font-size:12px;padding:4px 12px;cursor:pointer;transition:border-color .15s,color .15s;flex-shrink:0}
.jd-tui__play:hover{border-color:#D97757;color:#D97757}
.jd-tui__play:focus-visible{outline:2px solid #D97757;outline-offset:2px}
:root[data-mode="consola"] .jd-tui__play{border-radius:4px}

/* pantalla */
.jd-tui__screen{padding:18px 20px;overflow-x:auto;font-size:14px;line-height:1.7;color:#D6E8DC}
.jd-tui__step{display:block;white-space:pre-wrap;word-break:break-word;margin:0 0 6px}
.jd-tui__step[hidden]{display:none}

/* líneas de shell (antes de abrir el TUI / al salir) */
.jd-tui__ps1{color:#34E07A;font-weight:700}
.jd-tui__shell .jd-tui__typed{color:#D6E8DC}

/* cajas redondeadas del TUI (bienvenida, diálogos, prompt) */
.jd-tui__box{border:1px solid #3D5246;border-radius:8px;padding:12px 16px;margin:10px 0;white-space:normal}
.jd-tui__box[hidden]{display:none}
.jd-tui__box p{margin:0 0 8px;font-size:inherit}
.jd-tui__box p:last-child{margin-bottom:0}
/* bienvenida real: logo pixelado + tres líneas, sin caja */
.jd-tui__welcome{display:flex;gap:14px;align-items:flex-start;margin:12px 0;white-space:normal}
.jd-tui__welcome[hidden]{display:none}
.jd-tui__logo{width:52px;height:auto;flex-shrink:0;image-rendering:pixelated}
.jd-tui__welcometext p{margin:0;line-height:1.5}
.jd-tui__star{color:#D97757;font-weight:700}
.jd-tui__dim{color:#5E8870}
.jd-tui__path{color:#8FB79E}
.jd-tui__q{font-weight:700}
.jd-tui__asktitle{color:#8FB79E;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase}

/* opciones de diálogo (trust / permisos): la elegida lleva ❯ y cian */
.jd-tui__opts{list-style:none;margin:10px 0 0;padding:0}
.jd-tui__opts li{padding:1px 0;color:#8FB79E}
.jd-tui__caret{display:inline-block;width:1.1em;color:#53C1DE;font-weight:700}
.jd-tui__opts li.is-sel{color:#53C1DE}
.jd-tui__opts li.is-chosen{color:#53C1DE;font-weight:700}

/* conversación */
.jd-tui__user{color:#8FB79E}
.jd-tui__gt{color:#5E8870;font-weight:700}
.jd-tui__think{color:#D97757}
.jd-tui__think [data-jd-text]{color:#5E8870;font-style:italic}
.jd-tui__tool{color:#D6E8DC;font-weight:700}
.jd-tui__dot{color:#34E07A}
.jd-tui__say .jd-tui__dot{color:#D6E8DC}
.jd-tui__out{color:#5E8870;padding-left:1.2em}
.jd-tui__l{color:#3D5246}

/* prompt de entrada fijado al final mientras la sesión está abierta */
.jd-tui__inputwrap{margin-top:12px}
.jd-tui__inputwrap[hidden]{display:none}
/* el prompt real no es una caja: línea fina arriba y abajo */
.jd-tui__box--input{margin:0;display:flex;gap:8px;align-items:baseline;border:0;border-top:1px solid #3D5246;border-bottom:1px solid #3D5246;border-radius:0;padding:8px 6px}
.jd-tui__box--input .jd-tui__gt{color:#D6E8DC}
.jd-tui__hint{margin:4px 0 0;padding-left:6px;color:#3D5246;font-size:12.5px}

/* cursor de bloque parpadeante */
.jd-tui__cursor{display:inline-block;width:.55em;height:1.05em;background:#D6E8DC;vertical-align:text-bottom;animation:jdTuiBlink 1.1s steps(1) infinite}
@keyframes jdTuiBlink{50%{opacity:0}}

/* animación de aparición de cada paso */
.jd-tui__step.is-in{animation:jdTuiIn .18s ease}
@keyframes jdTuiIn{from{opacity:0;transform:translateY(2px)}to{opacity:1;transform:none}}

@media (prefers-reduced-motion:reduce){
	.jd-tui__cursor{animation:none}
	.jd-tui__step.is-in{animation:none}
	.jd-tui__play{display:none}
}
