/* Kole UI Mobile · Toast 样式 — 对齐移动端规格 §12
   轻提示：深底 + 反色文字（亮色 15.78:1 / 暗色 15.00:1，脚本实测），居中于视口；
   不抢焦点、不阻断交互（mask=true 时遮罩吸收手势）；动效 240ms。 */

.kole-m-toast {
  --kole-m-toast-radius: var(--kole-radius-large);
  --kole-m-toast-max-width: 70%;
  position: fixed;
  z-index: 2100;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--kole-space-8);
  max-width: var(--kole-m-toast-max-width);
  padding: var(--kole-space-16) var(--kole-space-20);
  border-radius: var(--kole-m-toast-radius);
  background: var(--kole-color-tooltip-bg);
  color: var(--kole-color-text-inverse);
  font-family: var(--kole-font-family);
  font-size: var(--kole-m-font-size-label);
  line-height: 1.4;
  text-align: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--kole-m-duration-slide) var(--kole-m-ease-slide);
}

.kole-m-toast.is-open {
  opacity: 1;
}

/* 变体 position：三个位置（默认居中） */
.kole-m-toast--center {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.kole-m-toast--bottom {
  left: 50%;
  bottom: calc(var(--kole-m-touch-target) + var(--kole-m-safe-bottom));
  transform: translateX(-50%);
}

.kole-m-toast--top {
  left: 50%;
  top: calc(var(--kole-m-navbar-height) + var(--kole-m-safe-top));
  transform: translateX(-50%);
}

.kole-m-toast__icon {
  flex: 0 0 auto;
  font-size: var(--kole-m-font-size-title);
  line-height: 1;
}

.kole-m-toast__text {
  word-break: break-word;
}

/* 状态 loading：图标持续旋转（reduced-motion 下停止） */
.kole-m-toast--loading .kole-m-toast__icon {
  animation: kole-m-toast-spin 1s linear infinite;
}

@keyframes kole-m-toast-spin {
  to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
  .kole-m-toast { transition: none; }
  .kole-m-toast--loading .kole-m-toast__icon { animation: none; }
}

/* 变体 mask=true：透明遮罩吸收手势，下方不可点 */
.kole-m-toast__mask {
  position: fixed;
  inset: 0;
  z-index: 2099;
  background: var(--kole-color-mask-strong);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--kole-m-duration-slide) var(--kole-m-ease-slide);
}

.kole-m-toast__mask.is-open {
  opacity: 1;
  pointer-events: auto;
}