/* ==================== Toast notifications (Ant Design message style) ==================== */

.toast-container {
  position: fixed;
  top: 8px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10000;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  pointer-events: none;
  width: max-content;
  max-width: calc(100vw - 32px);
}

.toast-notice {
  pointer-events: all;
  padding: 9px 12px;
  background: #fff;
  border-radius: 8px;
  box-shadow:
    0 6px 16px 0 rgba(0, 0, 0, 0.08),
    0 3px 6px -4px rgba(0, 0, 0, 0.12),
    0 9px 28px 8px rgba(0, 0, 0, 0.05);
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: inherit;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.88);
  line-height: 1.5714;
  white-space: nowrap;
  max-width: 100%;
  animation: toast-slide-in 0.3s cubic-bezier(0.08, 0.82, 0.17, 1) forwards;
}

.toast-notice.toast-out {
  animation: toast-slide-out 0.3s cubic-bezier(0.6, 0.04, 0.98, 0.34) forwards;
}

.toast-notice__icon {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  display: flex;
  align-items: center;
}

.toast-notice__icon svg {
  width: 16px;
  height: 16px;
}

.toast-notice--error .toast-notice__icon { color: #ff4d4f; }
.toast-notice--success .toast-notice__icon { color: #52c41a; }
.toast-notice--warning .toast-notice__icon { color: #faad14; }
.toast-notice--info .toast-notice__icon { color: #1677ff; }

.toast-notice__text {
  white-space: normal;
  word-break: break-word;
}

@keyframes toast-slide-in {
  0%   { opacity: 0; transform: translateY(-8px) scaleY(0.8); }
  100% { opacity: 1; transform: translateY(0)    scaleY(1);   }
}

@keyframes toast-slide-out {
  0%   { opacity: 1; transform: translateY(0)    scaleY(1);   max-height: 100px; margin-bottom: 0; }
  100% { opacity: 0; transform: translateY(-8px) scaleY(0.8); max-height: 0;     margin-bottom: -8px; }
}
