/* Provider chip: one look for a provider name in a table, list or card. */
/*
 * Shape = the badges.css chip (6px radius, 11px/600). Tints come from the
 * colour families of ofo_provider_catalog() (lib/helpers.php): ChatGPT
 * #10b981 -> emerald, Gemini #4285f4 -> blue, Perplexity #8b5cf6 -> violet,
 * AI Overview #f59e0b -> amber. Unknown providers stay grey.
 * Rendered by ofo_provider_chip_html() (PHP) and ofoProviderChip() (js/ofo-util.js).
 * Always loaded (lib/nav.php ofo_css()).
 *
 * @author Sander Tamaela
 * @created 2026-11-07
 * @modified 2026-11-08
 */
.ofo-prov-chip {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
  white-space: nowrap;
  vertical-align: middle;
  background: var(--tb-f3f4f6, #f3f4f6);
  color: var(--tc-4b5563, #4b5563);
}
.ofo-prov-chip--chatgpt     { background: var(--tb-d1fae5, #d1fae5); color: var(--tc-065f46, #065f46); }
.ofo-prov-chip--gemini      { background: var(--tb-dbeafe, #dbeafe); color: var(--tc-1e40af, #1e40af); }
.ofo-prov-chip--perplexity  { background: var(--tb-ede9fe, #ede9fe); color: var(--tc-5b21b6, #5b21b6); }
.ofo-prov-chip--ai_overview { background: var(--tb-fef3c7, #fef3c7); color: var(--tc-92400e, #92400e); }

/* Status / count chip in the same shape (DESIGN-UX.md "Badges / chips"), for
   any small label that is not a provider: "shared", "Orphan", "Shown", a
   count, a type. Tints = the quadrant chip tints (search-insights .si-q--*).
   Grey is the default; never a solid fill, never a round pill. Lives here
   because this sheet is always loaded. */
.ofo-chip {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
  white-space: nowrap;
  vertical-align: middle;
  background: var(--tb-f3f4f6, #f3f4f6);
  color: var(--tc-4b5563, #4b5563);
}
.ofo-chip--green  { background: var(--tb-dcfce7, #dcfce7); color: var(--tc-166534, #166534); }
.ofo-chip--blue   { background: var(--tb-dbeafe, #dbeafe); color: var(--tc-1e40af, #1e40af); }
.ofo-chip--amber  { background: var(--tb-fef3c7, #fef3c7); color: var(--tc-92400e, #92400e); }
.ofo-chip--red    { background: var(--tb-fee2e2, #fee2e2); color: var(--tc-991b1b, #991b1b); }
.ofo-chip--violet { background: var(--tb-ede9fe, #ede9fe); color: var(--tc-5b21b6, #5b21b6); }

/* A chip inside a link (opens the answer): blue hover ring, no underline. */
a:hover > .ofo-prov-chip,
a:focus-visible > .ofo-prov-chip {
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.25);
}