/* _astoler-demo-pill.css
 * Shared "DEMO" indicator for sandbox data. Any est_number / job_number
 * starting with 'SBX-' should get this pill near its identifier so demo
 * data never gets confused with real bookings.
 *
 * Usage:
 *   <span class="ast-demo-pill" title="Sandbox demo data">DEMO</span>
 * Or with the JS helper:
 *   astolerDemoPillFor('SBX-26-001')  -> returns HTML string or ''
 */

.ast-demo-pill {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 7px;
  border-radius: 4px;
  background: rgba(167, 139, 250, 0.18);
  color: #8b5cf6;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  vertical-align: middle;
  border: 1px solid rgba(139, 92, 246, 0.32);
  white-space: nowrap;
}
.ast-demo-pill.is-bid    { background: rgba(245, 158, 11, 0.16); color: #d97706; border-color: rgba(245, 158, 11, 0.32); }
.ast-demo-pill.is-active { background: rgba(34, 197, 94, 0.14);  color: #16a34a; border-color: rgba(34, 197, 94, 0.32); }
.ast-demo-pill.is-closed { background: rgba(107, 114, 128, 0.14);color: #6b7280; border-color: rgba(107, 114, 128, 0.32); }