[data-sonner-toast][data-styled="true"] {
  /* padding: 12px 16px; */
  --normal-bg: var(--wp-toast-bg);
  --normal-border: var(--wp-toast-border);
  --normal-text: var(--wp-text-color);
  --border-radius: var(--wp-border-radius);

  /* 关闭按钮（closeButton 选项）挪到右上角：sonner 默认放左上角（仅 RTL 才在右），
     而左上角正是类型图标一侧，且桌面端的习惯是右上角关闭。
     配色不用另设，它本就取上面这三个 --normal-* 变量，与 toast 主体一致 */
  --toast-close-button-start: unset;
  --toast-close-button-end: 0;
  --toast-close-button-transform: translate(35%, -35%);
}

  [data-sonner-toast][data-styled="true"][data-type="success"] [data-icon] {
      color: var(--wp-success-color);
    }

  [data-sonner-toast][data-styled="true"] [data-description] {
    color: var(--normal-text);
  }

  [data-sonner-toast][data-styled="true"] [data-content] {
    min-width: 0;
  }

  [data-sonner-toast][data-styled="true"] .sonner-loading-bar {
    /* background-color: var(--wp-primary-color); */
    background-color: var(--wp-text-color-2);
  }

[data-sonner-toaster][data-x-position="center"] {
  /* 缩放跨过窄屏断点时，left 与 transform 同时切换；只过渡 transform 会让提示横向滑入。
     容器定位直接跟随视口，单条 toast 仍保留自身的进出动画。 */
  transition: none;
}

[data-sonner-toast][data-x-position="center"] {
  left: 0 !important;
  right: 0 !important;
  margin-left: auto;
  margin-right: auto;
}

/* 修复移动端 toaster 容器因 left: 16px + width: 100% 导致整体偏右的问题 */
@media (max-width: 600px) {
  [data-sonner-toaster][data-x-position="center"] {
    left: 0 !important;
    right: 0 !important;
  }
}
