.notices-root {
    position: relative;
    display: flex;
    flex-direction: column;

    height: auto;
    width: calc(100% - 22rem);
    margin: 2rem 11rem 5rem 11rem;

    border-radius: 8px;
}

.notices-title {font-size: 1.3rem; font-weight: 600; margin: 0vh 0vw 0vh 0vw;}

.accordion-button {
    font-size: 1.1rem;
}

.notice-title {
    font-size: 1.0rem;
    font-weight: 500;
}
.accordion-body {
    font-size: 1rem;
    text-align: justify;
}

.notices-accordion .accordion-item {
    margin: 0vh 0vw 1vh 0vw;
    border: none;
    border-bottom: 0.5px solid #b5b4b4;
}

.date-badge {
    color: #2b4f2e;
    border-radius: 6px;
    padding: 4px 8px;
    font-size: 0.85rem;
    font-weight: 600;
    white-space: nowrap;
}

.general {
    background: rgba(199, 213, 248, 0.5);
}

.important {
    background: rgba(248, 242, 199, 0.5);
}

.academic {
    background: rgba(222, 248, 199, 0.5);
}

.urgent {
    background: rgba(248, 199, 199, 0.5);
}

.other {
    background: rgba(242, 199, 248, 0.5);
}

@media (max-width: 992px) {
    .notices-root {
        width: calc(100% - 2rem);
        margin: 3vh 1rem 3vh 1rem;
    }
    
    .notices-accordion .accordion-item {
        margin: 0vh 0vw 1rem 0vw;
    }
}