/* .ap-callout — tinted info box (contact sidebar, etc.) and .ap-alert — inline
   success/error message, both theme-token driven. */

.ap-callout {
  background: var(--ap-surface-alt);
  border: 1px solid var(--ap-border);
  border-radius: var(--ap-radius-lg);
  padding: var(--ap-space-lg);
}

.ap-callout h2, .ap-callout h3, .ap-callout h4 {
  font-size: var(--ap-fs-body);
  margin-bottom: var(--ap-space-sm);
}

.ap-callout p {
  color: var(--ap-text-muted);
  font-size: var(--ap-fs-sm);
}

.ap-callout a {
  color: var(--ap-primary);
}

.ap-alert {
  border-radius: var(--ap-radius-md);
  padding: var(--ap-space-sm) var(--ap-space-md);
  font-size: var(--ap-fs-sm);
  font-weight: 600;
  margin-bottom: var(--ap-space-md);
}

.ap-alert--success {
  background: color-mix(in srgb, var(--ap-success) 15%, transparent);
  color: var(--ap-success);
}

.ap-alert--error {
  background: color-mix(in srgb, var(--ap-error) 15%, transparent);
  color: var(--ap-error);
}