.ml-toast-host {
  position: fixed;
  bottom: var(--ml-space-6);
  right: var(--ml-space-6);
  z-index: var(--ml-z-index-toast);
  display: flex;
  flex-direction: column;
  gap: var(--ml-space-3);
  max-width: min(360px, calc(100vw - 48px));
}

[dir="rtl"] .ml-toast-host {
  right: auto;
  left: var(--ml-space-6);
}

.ml-toast {
  padding: var(--ml-space-4) var(--ml-space-5);
  border-radius: var(--ml-radius-md);
  background: var(--ml-color-surface-ink);
  color: var(--ml-color-text-inverse);
  box-shadow: var(--ml-shadow-strong);
  font-size: var(--ml-font-size-sm);
  border: 1px solid var(--ml-color-surface-line);
}

.ml-toast--success {
  background: var(--ml-color-semantic-success);
  color: var(--ml-color-text-inverse);
}

.ml-toast--error {
  background: var(--ml-color-semantic-error);
  color: var(--ml-color-text-inverse);
}