/* ============================================================
   Evisa 前台全局 Toast 样式
   ============================================================
   Phase Z hotfix6+ (2026-05-12): 完全对齐 toastr 视觉协议.
   不引入 jquery + toastr.min.js, 仅复刻 vendor toastr.min.css layout +
   静态侧 vendor-overrides.css 主题 token alias (跟 4 主题 status token + 跨工作区
   协议字符级对齐 — 红线 #24 延伸).

   节点 (toast.js 生成):
     #evisa-toast-container.toast-top-right > .evisa-toast.evisa-toast-{type}
       > .evisa-toast-title (可选)
       > .evisa-toast-message (单行 textContent 时无此 wrapper)
       > .evisa-toast-progress (可选)
       > button.evisa-toast-close (可选)

   主题接入: fox theme.css alias --theme-{state-invalid,radius-input,toast-offset-top,...}
   palette CSS 覆盖 brand-* / status-* → toast 配色自动跟随.
   ============================================================ */

#evisa-toast-container {
    position: fixed;
    top: var(--theme-toast-offset-top, 12px);
    right: 12px;
    z-index: 999999;
    pointer-events: none;
    display: flex;
    flex-direction: column;
}

#evisa-toast-container * {
    box-sizing: border-box;
}

/* 单个 toast — 完全按 toastr #toast-container > div 视觉. */
.evisa-toast {
    position: relative;
    pointer-events: auto;
    overflow: hidden;  /* progressBar 用 */
    margin: 0 0 6px;
    padding: 15px 15px 15px 50px;
    width: 300px;
    border-radius: var(--theme-radius-input, var(--radius, 3px));
    background-position: 15px center;
    background-repeat: no-repeat;
    box-shadow: 0 0 12px #999;
    color: #fff;
    opacity: 0;  /* 入场动画从 0 → .8 */
    transform: translateX(20px);
    transition: opacity 0.3s ease, transform 0.3s ease, box-shadow 0.2s ease;
    font-size: 14px;
    line-height: 1.4;
    word-break: break-word;
    -ms-word-wrap: break-word;
    word-wrap: break-word;
}

.evisa-toast.show {
    opacity: 0.95;
    transform: translateX(0);
}

/* hover 加深: 阴影更深 + 不透明 + 鼠标指针 (toastr 视觉) */
.evisa-toast:hover {
    box-shadow: 0 0 12px #000;
    opacity: 1;
    cursor: pointer;
}

/* 4 类背景色 — 走主题 status token alias (palette 切换跟随).
   fallback 是 toastr vendor 默认色 (#51A351 / #BD362F / #2F96B4 / #F89406). */
.evisa-toast-success { background-color: var(--status-ok,   #51A351); }
.evisa-toast-error   { background-color: var(--status-err,  #BD362F); }
.evisa-toast-info    { background-color: var(--status-info, #2F96B4); }
.evisa-toast-warning { background-color: var(--status-warn, #F89406); }

/* ============================================================
   Icon — inline SVG mask (跟 toastr base64 PNG 视觉对齐, 但用 currentColor
   跟随文字白 — 比 base64 PNG 更灵活). 24x24 居中 left: 15px (跟 background-position 一致).
   ============================================================ */
.evisa-toast::before {
    content: "";
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background-color: currentColor;
    flex-shrink: 0;
}

/* success: ✓ 圆圈勾 */
.evisa-toast-success::before {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m8 12 3 3 5-6'/%3E%3C/svg%3E") no-repeat center / contain;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m8 12 3 3 5-6'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* error: shield + ! 警示盾 (跟 toastr error 视觉对齐, 警示感强) */
.evisa-toast-error::before {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/%3E%3Cline x1='12' y1='8' x2='12' y2='13'/%3E%3Cline x1='12' y1='16' x2='12' y2='16'/%3E%3C/svg%3E") no-repeat center / contain;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/%3E%3Cline x1='12' y1='8' x2='12' y2='13'/%3E%3Cline x1='12' y1='16' x2='12' y2='16'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* warning: 三角形 ! */
.evisa-toast-warning::before {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z'/%3E%3Cline x1='12' y1='9' x2='12' y2='13'/%3E%3Cline x1='12' y1='17' x2='12' y2='17'/%3E%3C/svg%3E") no-repeat center / contain;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z'/%3E%3Cline x1='12' y1='9' x2='12' y2='13'/%3E%3Cline x1='12' y1='17' x2='12' y2='17'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* info: 圆圈 i */
.evisa-toast-info::before {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='12' y1='16' x2='12' y2='12'/%3E%3Cline x1='12' y1='8' x2='12' y2='8'/%3E%3C/svg%3E") no-repeat center / contain;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='12' y1='16' x2='12' y2='12'/%3E%3Cline x1='12' y1='8' x2='12' y2='8'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* ============================================================
   title + message 双层 (toastr toast-title / toast-message 视觉对齐).
   单段 textContent 时无 wrapper, font-size: 14px 默认.
   ============================================================ */
.evisa-toast-title {
    font-weight: 700;       /* toastr 默认 700 加粗 */
    font-size: 14px;
    margin-bottom: 2px;     /* toastr 视觉 */
    line-height: 1.3;
}
.evisa-toast-message {
    font-size: 13px;
    line-height: 1.5;
    -ms-word-wrap: break-word;
    word-wrap: break-word;
}

/* ============================================================
   progressBar — 顶部细线 (toastr toast-progress 视觉对齐).
   toast.js 可选添加 .evisa-toast-progress 元素 + duration animation.
   ============================================================ */
.evisa-toast-progress {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 4px;
    background-color: #000;
    opacity: 0.4;
}

/* ============================================================
   close-button × (toastr toast-close-button 视觉对齐).
   toast.js 可选添加 button.evisa-toast-close.
   ============================================================ */
.evisa-toast-close {
    position: absolute;
    right: 0.3em;
    top: 0.3em;
    padding: 0;
    background: transparent;
    border: 0;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    opacity: 0.8;
    text-shadow: 0 1px 0 #fff;
}
.evisa-toast-close:hover,
.evisa-toast-close:focus {
    color: #000;
    opacity: 0.4;
}

/* ============================================================
   Responsive — toastr media query 视觉对齐.
   ============================================================ */
@media all and (max-width: 240px) {
    .evisa-toast {
        padding: 8px 8px 8px 50px;
        width: 11em;
    }
}
@media all and (min-width: 241px) and (max-width: 480px) {
    #evisa-toast-container {
        right: 12px;
        left: 12px;
    }
    .evisa-toast {
        padding: 8px 8px 8px 50px;
        width: auto;
        max-width: none;
    }
}
