/* AI phone agent pages (Admin::PhoneAgentController) and the call card on the
   lead page. Almost everything reuses the portal's classes and tokens (--navy,
   --line, .detail-card, .vi-transcript, .badge ...); these are the few pieces
   it did not already have. */

.phone-narrow { max-width: 860px; }

.phone-card-header { margin-bottom: 14px; }
.phone-card-header h2 { margin: 0; }

.phone-approval h2 { font-size: 17px; font-weight: 800; color: var(--navy); }

.phone-dispatch {
  margin-top: 6px; padding: 12px 14px; border-radius: 11px;
  background: var(--light); border: 1px solid var(--line);
  font-size: 14.5px; color: var(--ink); white-space: pre-wrap;
}

.phone-actions { margin-top: 16px; }
.pipeline-actions form { display: inline; margin: 0; }

.phone-audio { width: 100%; max-width: 520px; height: 40px; }

.phone-when { white-space: nowrap; font-variant-numeric: tabular-nums; }
.phone-sub { font-size: 12.5px; }

.filter-bar .badge { text-decoration: none; }
.filter-bar .badge:hover { box-shadow: inset 0 0 0 1.5px var(--line); }