/* V2.6.0-F — Stable supplier color chips (presentation only) */
.supplier-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  min-width: 0;
  vertical-align: middle;
  padding: 3px 10px;
  line-height: 1.45;
  font-size: inherit;
  font-weight: 700;
  text-align: center;
  border-radius: 999px;
  border: 1px solid var(--sup-border, #506477);
  background: var(--sup-bg, #20384b);
  color: var(--sup-fg, #d6e9f4);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  box-sizing: border-box;
}
.supplier-badge-empty { color: #aebfc9; background: #1b2a38; border-color: #324a5b; }
.supplier-tone-0 { --sup-bg: #123f43; --sup-border: #25b2b1; --sup-fg: #8df3e4; }
.supplier-tone-1 { --sup-bg: #253954; --sup-border: #5598e8; --sup-fg: #b5d9ff; }
.supplier-tone-2 { --sup-bg: #422c57; --sup-border: #ad77ed; --sup-fg: #e5c6ff; }
.supplier-tone-3 { --sup-bg: #4a3430; --sup-border: #ee9b6d; --sup-fg: #ffceaa; }
.supplier-tone-4 { --sup-bg: #3f3b20; --sup-border: #c8aa42; --sup-fg: #f8e09b; }
.supplier-tone-5 { --sup-bg: #1d4335; --sup-border: #4ac58a; --sup-fg: #a4f4cd; }
.supplier-tone-6 { --sup-bg: #3f2d47; --sup-border: #db79bb; --sup-fg: #ffd0ef; }
.supplier-tone-7 { --sup-bg: #173e54; --sup-border: #4ab6ef; --sup-fg: #b1e6ff; }
.supplier-tone-8 { --sup-bg: #47302b; --sup-border: #e57e83; --sup-fg: #ffcad1; }
/* Auto Fit: supplier is a pinned column. The badge truncates instead of widening the table. */
.shipments-list-table td[data-col="supplier"] { min-width: 0; max-width: 180px; }
.shipments-list-table td[data-col="supplier"] .supplier-badge { max-width: 100%; }
.page-dashboard .ops-alert .supplier-badge,
.page-dashboard .v260b-timeline-entry .supplier-badge { font-size: inherit; }
.page-view .supplier-detail-field b { display: flex; align-items: center; justify-content: center; min-width: 0; }
.page-view .pagehead h1 > .supplier-badge { font-size: 0.64em; margin-inline: 8px; }
@media (max-width: 640px) {
  .supplier-badge { padding: 3px 8px; }
  .shipments-list-table td[data-col="supplier"] { max-width: 148px; }
}
@media (prefers-contrast: more) {
  .supplier-badge { border-width: 2px; }
}