/* ============================================================
   uploadStrategy — the BYO-strategy / PineScript upload modal
   Scoped .us-* classes. Tokens only; reuses shared .modal/.field.
   ============================================================ */

/* head — icon chip + breadcrumb subtitle + close */
.us-ichip{ background:var(--brand-tint); color:var(--brand); }

.us-sub{
  font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase;
  color:var(--text-3); margin-left:2px;
}

.us-close{ margin-left:auto; padding:6px; }
.us-close svg{ width:16px; height:16px; }

/* body field blocks */
.us-modal .modal__body{ display:flex; flex-direction:column; gap:14px; }

.us-field{ display:flex; flex-direction:column; gap:7px; }

.us-label{
  font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
  color:var(--text-2);
}
.us-label-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; }

.us-lang{ gap:4px; }
.us-lang svg{ width:12px; height:12px; }

/* the code textarea — denser, monospaced, with a faint editor feel */
textarea.us-code{
  min-height:208px;
  background:var(--surface-2);
  border-color:var(--border);
  color:var(--text);
  line-height:1.55;
  tab-size:4;
}
textarea.us-code:focus{
  background:var(--surface);
  border-color:var(--brand);
}
textarea.us-code::placeholder{ color:var(--text-3); opacity:1; }

/* helper note */
.us-note{
  display:flex; align-items:flex-start; gap:7px;
  margin:-2px 0 0; font-size:11.5px; line-height:1.5;
}
.us-note svg{ width:13px; height:13px; flex-shrink:0; margin-top:2px; color:var(--teal); }

/* detected preview row */
.us-detected{
  display:flex; align-items:center; flex-wrap:wrap; gap:9px;
  padding:11px 13px;
  background:var(--surface-2);
  border:1px dashed var(--border-strong);
  border-radius:var(--r);
  min-height:46px;
}
.us-detected-lbl{
  font-size:10.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--text-3);
}
.us-detected-empty{ font-size:12px; }

.us-chips{ display:flex; flex-wrap:wrap; gap:7px; align-items:center; }
.us-chips .pill{ box-shadow:var(--shadow-sm); }

/* convert button — success flash */
#us-convert.is-ok{
  background:var(--up); border-color:var(--up); color:#fff;
}