﻿/* 提示框容器样式 - 屏幕居中 */
.toast-container {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9999;
    width: 350px;
    pointer-events: none; /* 容器本身不拦截事件，但内部元素可以 */
}

/* 提示框基础样式 */
.custom-toast {
    margin-bottom: 10px;
    padding: 15px;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    display: flex;
    align-items: center;
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.3s ease-out;
    position: relative; /* 为z-index生效提供基础 */
    z-index: 10000; /* 提示框本身层级高于容器 */
    pointer-events: auto; /* 允许提示框接收鼠标事件 */
}

    /* 提示框显示动画 */
    .custom-toast.show {
        opacity: 1;
        transform: translateY(0);
    }

/* 提示框图标样式 */
.toast-icon {
    margin-right: 15px;
    font-size: 20px;
}

/* 提示框内容区域 */
.toast-content {
    flex: 1;
}

/* 提示框标题 */
.toast-title {
    font-weight: 600;
    margin-bottom: 4px;
    font-size: 16px;
}

/* 提示框消息（支持链接） */
.toast-message {
    font-size: 14px;
    opacity: 0.9;
    margin: 0;
}

    /* 提示框中的链接样式 */
    .toast-message a {
        text-decoration: underline;
        font-weight: 500;
        transition: opacity 0.2s;
        cursor: pointer;
        padding: 2px 4px; /* 扩大点击区域 */
        display: inline-block;
        position: relative; /* 确保z-index生效 */
        z-index: 10001; /* 链接层级最高，确保优先捕获事件 */
    }
/* 不同类型提示框的链接颜色适配 */
.toast-success .toast-message a {
    color: #059669;
}

.toast-error .toast-message a {
    color: #dc2626;
}

.toast-warning .toast-message a {
    color: #d97706;
}

.toast-info .toast-message a {
    color: #1d4ed8;
}
/* 链接 hover 效果 */
.toast-message a:hover {
    opacity: 1;
    text-decoration: none;
}

/* 关闭按钮 */
.toast-close {
    background: none;
    border: none;
    font-size: 16px;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.2s;
    padding: 0 5px;
    margin-left: 10px;
    position: relative;
    z-index: 10001; /* 按钮层级同样最高 */
}

    .toast-close:hover {
        opacity: 1;
    }

/* 不同类型提示框的样式 */
.toast-success {
    background-color: #f0fdf4;
    border-left: 4px solid #10b981;
    color: #059669;
}

.toast-error {
    background-color: #fef2f2;
    border-left: 4px solid #ef4444;
    color: #dc2626;
}

.toast-warning {
    background-color: #fffbeb;
    border-left: 4px solid #f59e0b;
    color: #d97706;
}

.toast-info {
    background-color: #eff6ff;
    border-left: 4px solid #3b82f6;
    color: #1d4ed8;
}
