/* ========== NOTICE SCROLLER WRAPPER ========== */

.cn-notice-scroller {
    background:#fff;
    padding:25px 30px;      /* Stays visible, never scrolls */
    border-radius:6px;
    box-sizing:border-box;
	height: 500px;
}

/* Scroll happens only inside this box */
.cn-scroll-body {
    height:450px;            /* adjust widget height here */
    overflow-y:hidden;       /* hides scrollbar */
    position:relative;
}

/* UL layout */
.cn-notice-list {
    margin:0;
    padding:0;
}
.cn-notice-list li {
    list-style:none;
    border-bottom:1px solid #e5e5e5;
    padding:10px 0;
    display:flex;
    align-items:flex-start;
    gap:10px;
}


/* ========== ICON FIX (NO MORE WRAP ISSUES) ========== */
.notice-icon {
    font-size:18px;
    margin-top:2px;
    flex-shrink:0;       /* prevents icon from being pushed */
}


/* ========== TEXT SECTION – THIS FIXES THE WRAP ISSUE ========== */
.notice-text {
    width:100%;
    line-height:1.45;
    display:block;
}

.notice-text a {
    text-decoration: none !important;
}

/* TITLE */
.notice-text a {
    font-size:15px;
    font-weight:600;
    text-decoration:none;
    color:#006699;
}

/* DESCRIPTION (always below the title, not icon) */
.notice-desc {
    margin-top:4px;
    margin-left:0;
    font-size:13px;
    color:#444;
    line-height:1.35;
}

/* Hover highlight */
.cn-notice-list li:hover {
    background:#fafafa;
}

/* ========== BADGES ========== */
.cn-badge {
    display:inline-block;
    font-size:10px;
    padding:2px 6px;
    border-radius:3px;
    margin-left:8px;
    font-weight:bold;
    color:#fff;
    line-height:13px;
}
.cn-badge.new       { background:#e74c3c; }  /* Red */
.cn-badge.important { background:#f39c12; }  /* Orange */
.cn-badge.urgent    { background:#c0392b; }  /* Dark Red */
.cn-badge.info      { background:#3498db; }  /* Blue */


/* ========== ALL NOTICES PAGE ========== */
.cn-all-notices li {
    list-style:none;
    margin-bottom:10px;
    border-bottom:1px dashed #ccc;
    padding-bottom:6px;
}

.cn-all-notices a {
    font-weight:600;
    text-decoration:none;
    color:#004d80;
}
.cn-all-notices a:hover { text-decoration:underline; }


/* ========== APPEAR ANIMATION ========== */
.cn-notice-item {
    opacity:0;
    transform:translateY(10px);
    transition:all .4s ease;
}
.cn-notice-item.visible {
    opacity:1;
    transform:translateY(0);
}