/*
====================================================
DoseClock Status, Badge, Flash, and Alert Styles
Phase 4 Package 4
Shared clinical-modern status language
====================================================
*/

.badge,
.status-badge,
.status-pill,
.tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  min-height: 1.75rem;
  padding: 0.25rem 0.65rem;
  border-radius: 999px;
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

.badge--success,
.status--success,
.status-pill--success,
.flash--success {
  background: #e8f7ef;
  color: #17623b;
  border-color: rgba(23, 98, 59, 0.22);
}

.badge--warning,
.status--warning,
.status-pill--warning,
.flash--warning {
  background: #fff4dc;
  color: #7a4d00;
  border-color: rgba(122, 77, 0, 0.22);
}

.badge--danger,
.status--danger,
.status-pill--danger,
.flash--danger,
.flash--error {
  background: #fdecec;
  color: #8f1d1d;
  border-color: rgba(143, 29, 29, 0.22);
}

.badge--info,
.status--info,
.status-pill--info,
.flash--info,
.flash--message {
  background: #e8f1ff;
  color: var(--color-primary);
  border-color: rgba(10, 45, 111, 0.18);
}

.badge--muted,
.status--muted,
.status-pill--muted {
  background: #eef2f7;
  color: #4b5563;
  border-color: rgba(75, 85, 99, 0.18);
}

.flash-container {
  display: grid;
  gap: 0.75rem;
  margin-bottom: 1.25rem;
}

.flash,
.alert,
.notice {
  padding: 0.9rem 1rem;
  border: 1px solid rgba(10, 45, 111, 0.14);
  border-radius: var(--radius-lg);
  background: #f8fbff;
  color: var(--color-text);
  box-shadow: var(--shadow-sm);
}

.alert strong,
.notice strong,
.flash strong {
  color: var(--color-heading);
}