/* =====================================================
   WPD Cockpit — Alerts
   ===================================================== */

.wpd-alert {
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-sm);
  padding: var(--spacing-sm) var(--spacing);
  border-radius: var(--border-radius);
  border: 1px solid transparent;
  font-size: var(--fontsize-body);
  line-height: var(--lineheight-default);
}

.wpd-alert__icon {
  flex-shrink: 0;
  margin-top: 0.1em;
}

.wpd-alert__body {
  flex: 1;
}

.wpd-alert__title {
  font-family: var(--fontfamily-title);
  font-weight: var(--fontweight-title);
  margin-bottom: var(--spacing-2xs);
}

.wpd-alert__dismiss {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  flex-shrink: 0;
  opacity: 0.6;
  font-size: 1rem;
  line-height: 1;
  align-self: flex-start;
  color: inherit;
  transition: opacity var(--transition-fast);
}
.wpd-alert__dismiss:hover {
  opacity: 1;
}

/* ---- Variants ---- */
.wpd-alert--success {
  background: #d4edda;
  border-color: #c3e6cb;
  color: #155724;
}

.wpd-alert--danger {
  background: #f8d7da;
  border-color: #f5c6cb;
  color: #721c24;
}

.wpd-alert--warning {
  background: #fff3cd;
  border-color: #ffeeba;
  color: #856404;
}

.wpd-alert--info {
  background: var(--color-grey-50);
  border-color: var(--color-brand-5);
  color: var(--color-grey-900);
}

.wpd-alert--brand {
  background: rgb(223 9 30 / 8%);
  border-color: var(--color-brand-1);
  color: var(--color-brand-2);
}