/* SSE通知样式 */
.sse-notification {
    position: fixed;
    top: 20px;
    right: 20px;
    padding: 12px 20px;
    border-radius: 8px;
    background: white;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    display: flex;
    align-items: center;
    gap: 10px;
    z-index: 10000;
    animation: slideIn 0.3s ease-out;
    max-width: 400px;
}

.sse-notification--success {
    border-left: 4px solid #10b981;
    color: #065f46;
}

.sse-notification--warning {
    border-left: 4px solid #f59e0b;
    color: #92400e;
}

.sse-notification--info {
    border-left: 4px solid #3b82f6;
    color: #1e40af;
}

.sse-notification--error {
    border-left: 4px solid #ef4444;
    color: #991b1b;
}

.sse-notification__icon {
    font-size: 1.2em;
}

.sse-notification__text {
    font-size: 0.9em;
    font-weight: 500;
}

.sse-notification--fadeout {
    animation: fadeOut 0.3s ease-out forwards;
}

@keyframes slideIn {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes fadeOut {
    from {
        transform: translateX(0);
        opacity: 1;
    }
    to {
        transform: translateX(100%);
        opacity: 0;
    }
}

/* 状态栏可点击元素 */
.eco-statusbar__clickable {
    cursor: pointer;
    transition: background 0.2s;
}

.eco-statusbar__clickable:hover {
    background: rgba(255, 255, 255, 0.05);
}

/* 状态栏任务数徽章 */
.eco-statusbar__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    background: var(--color-primary, #3b82f6);
    color: white;
    font-size: 10px;
    font-weight: 600;
    border-radius: 8px;
    cursor: pointer;
    transition: transform 0.2s;
}

.eco-statusbar__badge:hover {
    transform: scale(1.1);
}