/* nle — the timeline list and renaming in place.
   One section of the old nle.css. The pieces load in filename order
   and that order is the cascade, so do not rearrange them. */
/* ---------- the timeline list ---------- */

.nle-tl-add {
  flex: none; margin: 8px 9px; padding: 7px 0;
  background: var(--card); border: 1px dashed var(--border-dash); border-radius: 3px;
  color: var(--text-dim); font-family: inherit; font-size: 10.5px; font-weight: 700;
  cursor: pointer;
}
.nle-tl-add:hover { border-style: solid; border-color: var(--accent); color: var(--accent); }
.nle-tl-list { flex: 1; min-height: 0; overflow: auto; padding: 0 9px 9px; }
.nle-tl-row {
  display: flex; align-items: center; gap: 6px; padding: 7px 8px; margin-bottom: 4px;
  background: var(--card); border: 1px solid var(--border); border-radius: 3px;
  cursor: pointer;
}
.nle-tl-row:hover { border-color: var(--border-dash); }
.nle-tl-row.on { border-color: var(--accent); background: rgba(var(--accent-rgb), .08); }
.nle-tl-name {
  flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 11px; font-weight: 700; color: var(--text);
}
.nle-tl-row.on .nle-tl-name { color: var(--accent); }
/* Editing in place — the name becomes a field rather than opening a dialog to
   change one word. */
.nle-tl-name[contenteditable="true"] {
  outline: none; border-bottom: 1px solid var(--accent); cursor: text;
  -webkit-user-select: text; user-select: text;
}
.nle-tl-b {
  flex: none; width: 20px; height: 20px; padding: 0; border-radius: 3px;
  background: none; border: 1px solid transparent; color: var(--text-faint);
  cursor: pointer; font-size: 11px; line-height: 1;
}
.nle-tl-row:hover .nle-tl-b { border-color: var(--border); }
.nle-tl-b:hover { color: var(--text); background: var(--surface-sunk); }
.nle-tl-b.del:hover { color: #fff; background: var(--red, var(--danger)); }
.nle-tl-empty { color: var(--text-faint); font-size: 10.5px; padding: 10px; text-align: center; }