/* WIDGET: lead-routing — score bars use transform: scaleX, rows enter with translateY + opacity */
.lr-body { container-type: inline-size; }

.lr-stream { display: flex; flex-direction: column; gap: 8px; }

.lr-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 9px 12px;
  border-radius: var(--radius-md);
  border: 1px solid var(--line-1);
  background: var(--surface-2);
}

.lr-row-top { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.lr-id { font-size: 0.86rem; font-weight: 600; color: var(--text-1); }
.lr-source {
  padding: 1px 7px;
  border-radius: 999px;
  border: 1px solid var(--line-2);
  font-family: var(--font-mono);
  font-size: 0.68rem;
  color: var(--text-3);
}
.lr-clock { margin-left: auto; font-family: var(--font-mono); font-size: 0.7rem; color: var(--text-4); font-variant-numeric: tabular-nums; }

.lr-phone { font-family: var(--font-mono); font-size: 0.74rem; color: var(--text-3); letter-spacing: 0.02em; }
.lr-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; }

.lr-score { display: flex; align-items: center; gap: 10px; }
.lr-score-bar {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
  height: 5px;
  border-radius: 999px;
  background: var(--surface-3);
  overflow: hidden;
}
.lr-score-fill {
  position: absolute;
  inset: 0;
  transform-origin: 0 50%;
  transform: scaleX(0);
  border-radius: inherit;
  background: linear-gradient(90deg, var(--prod-mf), var(--accent));
  transition: transform var(--dur-4) var(--ease-out);
}
.lr-score-val {
  flex-shrink: 0;
  width: 2.4em;
  text-align: right;
  font-family: var(--font-mono);
  font-size: 0.76rem;
  color: var(--text-1);
  font-variant-numeric: tabular-nums;
}

.lr-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.lr-tags li {
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--accent-soft);
  border: 1px solid var(--accent-line);
  font-size: 0.68rem;
  color: var(--text-2);
  white-space: nowrap;
}

.lr-status { display: flex; align-items: center; gap: 8px; }
.lr-status-dot { flex-shrink: 0; width: 7px; height: 7px; border-radius: 50%; background: var(--text-4); }
.lr-status-text { font-size: 0.78rem; color: var(--text-3); overflow-wrap: anywhere; }

.lr-row.is-scoring .lr-status-dot { background: var(--text-4); }
.lr-row.is-assigned .lr-status-dot { background: var(--ok); box-shadow: 0 0 6px rgba(63, 207, 142, 0.6); }
.lr-row.is-assigned .lr-status-text { color: var(--text-1); }
.lr-row.is-reclaimed { border-color: var(--accent-line); }
.lr-row.is-reclaimed .lr-status-dot { background: var(--accent); box-shadow: 0 0 6px var(--accent-glow); }
.lr-row.is-reclaimed .lr-status-text { color: #FF9DB3; }

/* Narrow phones: drop the source chip and clock to keep rows readable at 320px */
@container (max-width: 360px) {
  .lr-source { display: none; }
  .lr-clock { margin-left: 0; }
  .lr-score-val { width: 2em; }
}