/* Глобальные тосты (top-right стек). См. static/js/toast.js. */

.app-toasts {
  position: fixed;
  top: 16px;
  right: 16px;
  z-index: 1200;
  width: min(420px, calc(100vw - 32px));
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: none;
}

.app-toast {
  position: relative;
  pointer-events: auto;
  padding: 12px 36px 12px 14px;
  background: var(--color-bg);
  color: var(--color-ink);
  border: 1px solid var(--color-line);
  border-left: 4px solid var(--color-line);
  border-radius: var(--radius-sm);
  box-shadow: 0 12px 32px rgba(22, 18, 14, 0.18);
  font-size: 14px;
  line-height: 1.4;
  opacity: 0;
  transform: translateY(-6px);
  transition: opacity 200ms ease, transform 200ms ease;
}

.app-toast.is-visible {
  opacity: 1;
  transform: none;
}

.app-toast--success { border-left-color: var(--color-success, #3B6B3A); }
.app-toast--error   { border-left-color: var(--color-amber-deep); }
.app-toast--info    { border-left-color: var(--color-amber); }

.app-toast-close {
  appearance: none;
  -webkit-appearance: none;
  position: absolute;
  top: 6px;
  right: 6px;
  width: 24px;
  height: 24px;
  border: 0;
  background: transparent;
  color: var(--color-ink-2);
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  border-radius: 999px;
}
.app-toast-close:hover {
  color: var(--color-ink);
  background: var(--color-bg-card);
}