/* ============================================================
   cp-consumer-badge.css — Recognized / Unknown badge for AI
   consumers (Claude, ChatGPT, etc.) rendered next to a
   grant's consumer_id everywhere it appears in the wallet.

   Honesty rule (encoded in the wording, mirrored here in
   styling): "Recognized" ≠ "Verified". The badge confirms
   the NAME is in our curated registry — it does NOT prove
   which app actually holds the bearer token. So the positive
   state is soft-positive, not a triumphant green checkmark.
   The negative state is neutral/informational, not alarming:
   most consumers will legitimately be unknown early on, and
   training users to ignore an over-loud warning is worse than
   no warning at all.
   ============================================================ */

.cp-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.01em;
  line-height: 1.4;
  vertical-align: middle;
  white-space: nowrap;
  cursor: help; /* tooltip lives on the native title attribute */
  user-select: none;
}

.cp-badge-recognized {
  background: #fafff0;
  color: #2d5a1a;
  border: 1px solid #c9f560;
}
.cp-badge-recognized::before {
  content: "✓";
  font-weight: 700;
  font-size: 10px;
}

.cp-badge-unknown {
  background: #f4f3ef;
  color: #6a6862;
  border: 1px solid transparent;
}

/* Inline live-update badge that sits next to the consumer
   dropdown in the mint modal. Slightly larger to read at a
   glance when the user is making the choice. */
.cp-badge-inline {
  margin-left: 8px;
  font-size: 12px;
  padding: 3px 10px;
}