/* ── Alert / inline message ── */

.alert {
  display:     flex;
  align-items: flex-start;
  gap:         var(--sp-3);
  padding:     var(--sp-3) var(--sp-4);
  border-radius: var(--r-md);
  font-size:   var(--text-sm);
  line-height: var(--leading-normal);
  border:      1px solid;
}

.alert-icon {
  flex-shrink: 0;
  margin-top:  1px;
  display:     flex;
}

.alert-error   { background: var(--color-danger-bg);  color: var(--color-danger-fg);  border-color: var(--color-danger-border); }
.alert-success { background: var(--color-success-bg); color: var(--color-success-fg); border-color: var(--color-success-border); }
.alert-warning { background: var(--color-warning-bg); color: var(--color-warning-fg); border-color: var(--color-warning-border); }
.alert-info    { background: var(--color-info-bg);    color: var(--color-info-fg);    border-color: var(--color-info-border); }