/* AlertBox Component Styles */

.mint-alert {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  padding: 0.75rem 0.875rem;
  border: 1px solid;
  border-radius: var(--radius-md);
}

.mint-alert--success {
  background-color: var(--mint-success-bg);
  border-color: var(--mint-success-border);
}

.mint-alert--error {
  background-color: var(--mint-error-bg);
  border-color: var(--mint-error-border);
}

.mint-alert--warning {
  background-color: var(--mint-warning-bg);
  border-color: var(--mint-warning-border);
}

.mint-alert--info {
  background-color: var(--mint-info-bg);
  border-color: var(--mint-info-border);
}

/* Semantic color stays in the surface and the icon only (1h, same rule as Toast). */
.mint-alert__icon {
  width: 1rem;
  height: 1rem;
  margin-top: 0.125rem;   /* centers on the first 13px/1.5 text line */
  flex-shrink: 0;
}

.mint-alert__icon--success { color: var(--mint-success-hover); }
.mint-alert__icon--error   { color: var(--_ink-error); }
.mint-alert__icon--warning { color: var(--mint-warning-text); }
.mint-alert__icon--info    { color: var(--mint-info); }

.mint-alert__content {
  flex: 1;
  min-width: 0;
}

.mint-alert__title {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--text-primary);
  line-height: 1.5;
  margin-top: 0 !important;
  margin-bottom: 0.125rem !important;
  padding: 0 !important;
}

.mint-alert__message {
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--text-secondary-strong);
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
}

.mint-alert__actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}

.mint-alert__dismiss {
  padding: 0.25rem;
  border-radius: var(--radius-sm);
  color: var(--text-muted);
  background: transparent;
  border: none;
  cursor: pointer;
  transition: color 0.15s ease, background-color 0.15s ease;
}

.mint-alert__dismiss:hover {
  color: var(--text-primary);
  background-color: var(--bg-tertiary);
}

.mint-alert__dismiss:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring-offset);
}

.mint-alert__dismiss-icon {
  width: 0.875rem;
  height: 0.875rem;
}