/* Alert Component - BEM naming */

.alert {
  padding: var(--spacing-md);
  border-radius: var(--radius-md);
  margin-bottom: var(--spacing-md);
  font-size: var(--font-size-sm);
  border: 1px solid transparent;
}

.alert--success {
  background-color: #d1fae5;
  color: #065f46;
  border-color: #a7f3d0;
}

.alert--error {
  background-color: #fee2e2;
  color: #991b1b;
  border-color: #fca5a5;
}

.alert--warning {
  background-color: #fef3c7;
  color: #92400e;
  border-color: #fcd34d;
}

.alert--info {
  background-color: #dbeafe;
  color: #1e40af;
  border-color: #93c5fd;
}

.alert__title {
  font-weight: 600;
  margin-bottom: var(--spacing-xs);
}

.alert__message {
  margin: 0;
}

.alert__icon {
  margin-right: var(--spacing-sm);
}

/* Alert with icon */
.alert--with-icon {
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-sm);
}

/* Legacy classes for backwards compatibility */
.alert-success {
  background-color: #d1fae5;
  color: #065f46;
  border: 1px solid #a7f3d0;
  padding: var(--spacing-md);
  border-radius: var(--radius-md);
  margin-bottom: var(--spacing-md);
  font-size: var(--font-size-sm);
}

.alert-error {
  background-color: #fee2e2;
  color: #991b1b;
  border: 1px solid #fca5a5;
  padding: var(--spacing-md);
  border-radius: var(--radius-md);
  margin-bottom: var(--spacing-md);
  font-size: var(--font-size-sm);
}

/* Flash Messages */
.flash-message {
  padding: var(--spacing-md) var(--spacing-lg);
  border-radius: var(--radius-lg);
  margin-top: var(--spacing-lg);
  margin-bottom: var(--spacing-lg);
  font-size: var(--font-size-sm);
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
}

.flash-notice {
  background-color: #d1fae5;
  color: #065f46;
  border: 1px solid #a7f3d0;
}

.flash-alert {
  background-color: #fee2e2;
  color: #991b1b;
  border: 1px solid #fca5a5;
}