/* ===== 公告模块 ===== */
#announcementContainer {
    margin-bottom: 20px;
}

.announcement-wrapper {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.announcement-item {
    background: #fafcff;
    border-left: 4px solid #4a90d9;
    border-radius: 10px;
    padding: 14px 18px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    transition: opacity 0.25s ease;
}

.announcement-item .announcement-header {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.announcement-item .announcement-badge {
    display: inline-block;
    font-size: 12px;
    font-weight: 500;
    padding: 2px 12px;
    border-radius: 20px;
    background: #e8eef6;
    color: #2c3e50;
    flex-shrink: 0;
    letter-spacing: 0.3px;
}

.announcement-item .announcement-title {
    font-weight: 600;
    font-size: 15px;
    color: #1a2332;
    flex: 1;
    min-width: 60px;
}

.announcement-item .announcement-close {
    background: none;
    border: none;
    font-size: 20px;
    cursor: pointer;
    color: #b0bec5;
    padding: 0 4px;
    line-height: 1;
    flex-shrink: 0;
    transition: color 0.2s;
}

.announcement-item .announcement-close:hover {
    color: #e74c3c;
}

.announcement-item .announcement-body {
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    font-size: 14px;
    color: #3d4a5c;
    line-height: 1.7;
}

.announcement-item .announcement-body p {
    margin: 0;
}

/* ===== 不同类型配色 ===== */
.announcement-item[data-type="info"] {
    border-left-color: #4a90d9;
    background: #f7faff;
}
.announcement-item[data-type="info"] .announcement-badge {
    background: #e3edfb;
    color: #1a5a9c;
}

.announcement-item[data-type="warning"] {
    border-left-color: #f5a623;
    background: #fffbf0;
}
.announcement-item[data-type="warning"] .announcement-badge {
    background: #fef3d6;
    color: #8a6d1b;
}

.announcement-item[data-type="success"] {
    border-left-color: #4caf84;
    background: #f4fcf8;
}
.announcement-item[data-type="success"] .announcement-badge {
    background: #ddf4ea;
    color: #1f7b5a;
}

.announcement-item[data-type="danger"] {
    border-left-color: #e8685a;
    background: #fef6f5;
}
.announcement-item[data-type="danger"] .announcement-badge {
    background: #fde8e5;
    color: #b13e30;
}