/* ═══════════════════════════════════════════════════════════════════
   ROSTER MODULE — neon pink/cyan brand styling
   Reuses the app's .panel / .section-h / .data / .status-pill / .avatar-sm
   primitives; adds roster-* and rr-* bits for tags + on-clock badge.
   ═══════════════════════════════════════════════════════════════════ */

.roster-view { display: block; }

/* Keep the live table comfortable to scan on smaller screens. */
.roster-table { width: 100%; }
.roster-table td { vertical-align: middle; }

/* Empty / loading / error state inside a .panel */
.rr-empty {
  padding: 28px 20px;
  text-align: center;
  color: var(--rr-text-muted, rgba(255, 255, 255, 0.55));
  font-size: 13px;
  line-height: 1.7;
}

.rr-muted { color: var(--rr-text-muted, rgba(255, 255, 255, 0.45)); }

/* Training / capability tags */
.rr-tag {
  display: inline-block;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.2px;
  padding: 2px 8px;
  border-radius: 999px;
  line-height: 1.5;
  margin-right: 4px;
  white-space: nowrap;
}
.rr-tag-cyan {
  background: rgba(88, 249, 244, 0.13);
  color: var(--rr-cyan, #58F9F4);
  border: 1px solid rgba(88, 249, 244, 0.22);
}
.rr-tag-pink {
  background: rgba(242, 57, 247, 0.12);
  color: var(--rr-pink, #F239F7);
  border: 1px solid rgba(242, 57, 247, 0.22);
}

/* A-player / leadership star */
.rr-aplayer {
  color: var(--rr-yellow, #FFF140);
  font-size: 15px;
  text-shadow: 0 0 8px rgba(255, 241, 64, 0.45);
}

/* "On the clock now" live badge — manager-only */
.rr-onclock {
  display: inline-block;
  margin-left: 10px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  color: #2BFF95;
  padding: 1px 8px;
  border-radius: 999px;
  background: rgba(43, 255, 149, 0.12);
  border: 1px solid rgba(43, 255, 149, 0.3);
  vertical-align: middle;
  animation: rr-onclock-pulse 2.2s ease-in-out infinite;
}
@keyframes rr-onclock-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(43, 255, 149, 0.0); }
  50%      { box-shadow: 0 0 10px 0 rgba(43, 255, 149, 0.35); }
}

/* Footnote under the table */
.roster-foot {
  margin-top: 12px;
  font-size: 11.5px;
  line-height: 1.6;
  padding-left: 2px;
}

@media (max-width: 720px) {
  .rr-onclock { display: block; margin: 4px 0 0 36px; width: fit-content; }
  .rr-tag { margin-bottom: 3px; }
}