.status.stock-attention,
.stock-alert-pill.attention {
  background: #fff2dd;
  color: #a86d1d;
}

.status.replenish,
.stock-alert-pill.low {
  background: #feebec;
  color: #ba4149;
}

.stock-alert-list {
  display: grid;
  gap: 8px;
  max-height: min(42vh, 420px);
  overflow: auto;
  margin: 8px 0 4px;
  padding: 2px 3px 2px 0;
}

.stock-alert-item {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid #efd49f;
  border-radius: 8px;
  background: #fffaf0;
}

.stock-alert-item.low {
  border-color: #edc7cb;
  background: #fff5f5;
}

.stock-alert-pill {
  justify-self: start;
  padding: 5px 8px;
  border-radius: 99px;
  background: #fff2dd;
  color: #a86d1d;
  font-size: .72rem;
  font-weight: 700;
  white-space: nowrap;
}

.stock-alert-item.low .stock-alert-pill {
  background: #feebec;
  color: #ba4149;
}

.stock-alert-item strong,
.stock-alert-item small {
  display: block;
  overflow-wrap: anywhere;
}

.stock-alert-item strong {
  color: #39464c;
  font-size: .82rem;
}

.stock-alert-item small {
  margin-top: 3px;
  color: #718087;
  font-size: .73rem;
  line-height: 1.45;
}

.stock-alert-empty {
  padding: 16px;
  border: 1px solid #d9e9e1;
  border-radius: 8px;
  background: #f4faf6;
  color: #28745d;
  font-size: .82rem;
}

.stock-alert-modal .utility-form {
  display: grid;
  gap: 8px;
}