/* Alert and Flash Message Components */

.alert {
  position: relative;
  padding: var(--spacing-md) var(--spacing-lg);
  margin-bottom: var(--spacing-lg);
  border: 1px solid transparent;
  border-radius: var(--border-radius);
}

.alert-dismissible {
  padding-right: 3rem;
}

/* Used alert variants only */
.alert-success {
  color: var(--color-success-dark);
  background-color: var(--color-success-light);
  border-color: var(--color-success-border);
}

.alert-danger {
  color: var(--color-danger-dark);
  background-color: var(--color-danger-light);
  border-color: var(--color-danger-border);
}

.alert-warning {
  color: var(--color-warning-text);
  background-color: var(--color-warning-light);
  border-color: var(--color-warning-border);
}

.alert-info {
  color: var(--color-info-dark);
  background-color: var(--color-info-light);
  border-color: var(--color-info-border);
}

/* Flash Messages Container */
.flash-messages {
  position: fixed;
  top: var(--spacing-xl);
  right: var(--spacing-xl);
  z-index: 1050;
  max-width: 400px;
}