/* Billing Dashboard: status pills, 2:1 chips and the edit-window hold. */

/* Billing status pills and 2:1 chips. One color per billing step, only Voided
   gray; 2:1 is a square-cornered pink chip with a two-people icon so it never
   reads as a status. Design: "Billing · Status and 2:1 colors" (Pencil). */
.status-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.125rem 0.625rem;
  border-radius: 9999px;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.25rem;
  white-space: nowrap;
  background: #ece6dc;
  color: #5a5248;
}
.status-pill__icon { width: 0.8125rem; height: 0.8125rem; flex: none; }
.status-pill--pending_review  { background: #dbeafe; color: #1e3a8a; }
.status-pill--flagged         { background: #f2b517; color: #1f1a14; }
.status-pill--approved        { background: #ccefe9; color: #115e59; }
.status-pill--ready_to_submit { background: #2b2a28; color: #ffffff; }
.status-pill--submitted       { background: #2b2a28; color: #ffffff; }
.status-pill--accepted        { background: #2e7d4f; color: #ffffff; }
.status-pill--rejected        { background: #b42318; color: #ffffff; }
.status-pill--corrected       { background: #ffedd5; color: #9a3412; }
.status-pill--voided          { background: #ece6dc; color: #5a5248; }

.two-to-one-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  width: fit-content;
  padding: 0.125rem 0.5rem;
  border: 1px solid transparent;
  border-radius: 0.375rem;
  font-size: 11.5px;
  font-weight: 600;
  line-height: 1.25rem;
  white-space: nowrap;
  background: #fce7f3;
  color: #9d174d;
}
.two-to-one-chip--other-provider { background: #ffffff; border-color: #db2777; }
.two-to-one-chip__icon { width: 0.75rem; height: 0.75rem; flex: none; }

/* A billing hold (the DSP edit window): a normal wait that still keeps the
   shift out of billing, so it sits between gray and red. */
.flag-hold {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0 0.5rem;
  border: 1px solid #f5b88a;
  border-radius: 9999px;
  background: #fff1e6;
  color: #9a3412;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.25rem;
  white-space: nowrap;
  cursor: help;
}
.flag-hold-row {
  border: 1px solid #f5b88a;
  background: #fff1e6;
  color: #9a3412;
}