.alert{
  position:relative;display:flex;align-items:flex-start;gap:1rem;
  border-left-width:4px;border-radius:.5rem;padding:.75rem 1.25rem;
  box-shadow:0 1px 2px rgba(0,0,0,.05);line-height:1.25;
}
.alert-error  { border-left-color:#ef4444;background:#fee2e2cc;color:#7f1d1d; }
.alert-warning{ border-left-color:#f59e0b;background:#fffbeb;color:#78350f; }
.alert-success{ border-left-color:#10b981;background:#ecfdf5;color:#064e3b; }
.alert-info   { border-left-color:#3b82f6;background:#eff6ff;color:#1e3a8a; }

.alert-error  svg{ color:#dc2626; }
.alert-warning svg{ color:#d97706; }
.alert-success svg{ color:#059669; }
.alert-info    svg{ color:#2563eb; }

.alert button{ margin-left:auto;margin-right:-.25rem;border-radius:.25rem;opacity:.7 }
.alert button:hover{ opacity:1 }

.field-error{ margin-top:.25rem;font-size:.875rem;color:#b91c1c }