/* ============================================================
   Component: toast (bildirim)
   ============================================================ */
.toast-stack {
  position: fixed; z-index: var(--z-toast);
  bottom: var(--space-5); right: var(--space-5);
  display: flex; flex-direction: column; gap: var(--space-2);
  max-width: calc(100vw - 2 * var(--space-5));
}
.toast {
  display: flex; align-items: flex-start; gap: var(--space-3);
  min-width: 240px; max-width: 360px;
  padding: 12px var(--space-4);
  background: var(--surface); color: var(--text);
  border: 1px solid var(--border); border-left: 4px solid var(--text-muted);
  border-radius: 0;   /* köşeli — renkli sol kenar menü aktif öğesiyle aynı dil */
  box-shadow: var(--shadow-md);
  animation: toast-in .22s cubic-bezier(.4,0,.2,1);
}
.toast.is-leaving { animation: toast-out .2s ease forwards; }
.toast--success { border-left-color: var(--green); }
.toast--error   { border-left-color: var(--red); }
.toast--warn    { border-left-color: var(--yellow); }
.toast--info    { border-left-color: var(--blue); }

/* Gövde: mesaj + (varsa) liste dikey yığılır. */
.toast-body { flex: 1; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.toast-msg { font-size: var(--fs-sm); }
.toast--list .toast-msg { font-weight: 700; }   /* liste başlığı vurgulu */

/* Çoklu bildirim listesi — numaralı (1, 2, 3). */
/* Global reset ol/ul list-style:none → burada decimal'i açıkça geri ver. */
.toast-list { margin: 0; padding-left: 1.5em; font-size: var(--fs-sm); list-style: decimal outside; }
.toast-list li { line-height: 1.35; margin: 0; }
.toast-list li + li { margin-top: 3px; }

.toast-close { flex-shrink: 0; color: var(--text-faint); font-size: 18px; line-height: 1; }
.toast-close:hover { color: var(--text); }

/* Anahtarlı toast yerinde güncellenince (yeni kutu açmadan) kısa "nabız" → değişim fark edilir. */
.toast--bump { animation: toast-bump .28s cubic-bezier(.4,0,.2,1); }

@keyframes toast-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes toast-out { to { opacity: 0; transform: translateX(20px); } }
@keyframes toast-bump { 0% { transform: scale(1); } 40% { transform: scale(1.04); } 100% { transform: scale(1); } }

@media (max-width: 640px) {
  .toast-stack { left: var(--space-4); right: var(--space-4); bottom: var(--space-4); }
  .toast { max-width: none; }
}