/* ── Toasts ── */
#toastContainer {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 2000;
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-width: 400px;
}

.toast {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  background: var(--card-elevated);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-lg);
  font-size: 13px;
  font-weight: 500;
  animation: toast-in 0.35s var(--ease-out);
  position: relative;
  overflow: hidden;
  cursor: pointer;
  backdrop-filter: blur(16px);
}

.toast::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  height: 3px;
  background: var(--accent);
  animation: toast-progress 4s linear forwards;
  border-radius: 0 3px 0 0;
}

.toast.success::after { background: var(--success); }
.toast.error::after { background: var(--danger); }
.toast.warning::after { background: var(--warning); }
.toast.info::after { background: var(--accent); }

@keyframes toast-progress {
  from { width: 100%; }
  to { width: 0%; }
}

.toast.closing {
  animation: toast-out 0.3s var(--ease-out) forwards;
}

.toast.success { border-left: 3px solid var(--success); }
.toast.error { border-left: 3px solid var(--danger); }
.toast.warning { border-left: 3px solid var(--warning); }
.toast.info { border-left: 3px solid var(--accent); }

.toast-icon {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.toast-icon svg {
  width: 18px;
  height: 18px;
}

.toast.success .toast-icon { color: var(--success); }
.toast.error .toast-icon { color: var(--danger); }
.toast.warning .toast-icon { color: var(--warning); }
.toast.info .toast-icon { color: var(--accent); }

@keyframes toast-in {
  from {
    opacity: 0;
    transform: translateX(40px) scale(0.96);
  }
  to {
    opacity: 1;
    transform: translateX(0) scale(1);
  }
}

@keyframes toast-out {
  from {
    opacity: 1;
    transform: translateX(0) scale(1);
  }
  to {
    opacity: 0;
    transform: translateX(40px) scale(0.96);
  }
}