/* #2016 — Admin → Repos and client data styles.
   Theme tokens only, no colour literals. One card per repo, stacked; works at
   phone width with no table and no horizontal scroll. */
.rb-root { display: flex; flex-direction: column; gap: 16px; margin-top: 24px; font-size: 14px; color: var(--text); }
.rb-root .rb-heading { margin: 0; font-size: 16px; }

/* Status / owner / as-of lines ------------------------------------------ */
.rb-root .rb-status,
.rb-root .rb-owner,
.rb-root .rb-asof { margin: 0; color: var(--text-dim); font-size: 12px; }
.rb-root .rb-warning { margin: 0; padding: 8px 12px; border-left: 3px solid var(--warning); border-radius: var(--radius-sm); background: var(--bg-3); color: var(--text); }

/* Cards ------------------------------------------------------------------ */
.rb-root .rb-list { display: flex; flex-direction: column; gap: 16px; }
.rb-root .rb-card { border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--bg-2); padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.rb-root .rb-repo { margin: 0; font-size: 14px; font-weight: 700; color: var(--text); overflow-wrap: anywhere; }

/* The question ------------------------------------------------------------ */
.rb-root .rb-field { margin: 0; border: none; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.rb-root .rb-legend { padding: 0; font-weight: 600; color: var(--text); }
.rb-root .rb-choices { display: flex; flex-wrap: wrap; gap: 8px; }
.rb-root .rb-choice { min-height: 44px; padding: 0 16px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--bg-3); color: var(--text); font-weight: 600; cursor: pointer; }
.rb-root .rb-choice.is-chosen { border-color: var(--success); color: var(--success); background: var(--bg-2); }
.rb-root .rb-choice:disabled { cursor: default; }
.rb-root .rb-choice:disabled:not(.is-chosen) { color: var(--text-dim); }
.rb-root .rb-reason { margin: 0; color: var(--text-dim); font-size: 12px; }

/* Ceiling / provenance ------------------------------------------------------ */
.rb-root .rb-ceiling { margin: 0; color: var(--text); }
.rb-root .rb-provenance { margin: 0; color: var(--text-dim); font-size: 12px; overflow-wrap: anywhere; }

/* Pending request ---------------------------------------------------------- */
.rb-root .rb-pending { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.rb-root .rb-badge-pending { display: inline-block; padding: 1px 7px; border-radius: 999px; font-size: 11px; font-weight: 600; line-height: 1.5; border: 1px solid var(--warning); color: var(--warning); background: var(--bg-3); }
.rb-root .rb-pending-who { color: var(--text-dim); font-size: 12px; overflow-wrap: anywhere; }
.rb-root .rb-pending button { min-height: 44px; }

/* Receipts / errors ---------------------------------------------------------- */
.rb-root .rb-receipt { margin: 0; color: var(--success); font-weight: 600; }
.rb-root .rb-error { margin: 0; color: var(--danger); font-size: 13px; }

/* Phone: everything stacks already; make the acts full-width ---------------- */
@media (max-width: 640px) {
  .rb-root .rb-choices,
  .rb-root .rb-pending { flex-direction: column; align-items: stretch; }
  .rb-root .rb-choice,
  .rb-root .rb-pending button { width: 100%; }
}

/* Respect user's motion preference ------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
  .rb-root,
  .rb-root .rb-card,
  .rb-root .rb-choice { transition: none; animation: none; }
}