.line-clamp-2{
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

/* --- Styles for smooth grid animation (reusable for notices and filters) --- */
.collapsible-container {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.4s ease-in-out;
}
.collapsible-container.open {
    grid-template-rows: 1fr;
}
.collapsible-container > div {
    overflow: hidden;
}

.rotate-180 {
    transform: rotate(180deg);
}

/* 모달 액션 버튼 비활성 스타일 */
#cm-syllabus.disabled,
#cm-cv.disabled {
    pointer-events: none;
    background-color: #f3f4f6 !important;
    color: #9ca3af !important;
    box-shadow: none !important;
}

#cm-syllabus.disabled:hover,
#cm-cv.disabled:hover {
    background-color: #f3f4f6 !important;
}

@media (max-height: 768px) {
    html {
        font-size: 11px; /* 더 작게 조정 */
    }
}

/* [UPDATED] Notice styles */
.notice-body {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.35s ease-in-out;
}
.notice-item.open .notice-body {
    grid-template-rows: 1fr;
}
.notice-body > div {
    overflow: hidden;
}

.notice-header:focus-visible { /* Using focus-visible for better accessibility */
    outline: 2px solid #86263355;
    outline-offset: 2px;
    border-radius: 0.75rem;
}

.notice-item.open .chev {
    transform: rotate(180deg);
}

/* --- Notice: unified icon + inline expansion just below the clicked card --- */
/* Unify icon container across all cards without touching HTML */
#notice-grid .notice-header > div:first-child {
    width:2.75rem;
    height:2.75rem;
    border-radius:.75rem;
    background:#F8F5F5;
    color:#8A0000;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0
}
#notice-grid .notice-header > div:first-child svg {
    width:1.25rem;
    height:1.25rem;
    stroke-width:2
}

/* Panel spans full width of the grid and animates smoothly */
#notice-grid #notice-panel {
    grid-column:1 / -1
}

/* Align text rhythm */
.notice-panel h3,.notice-panel h4{
    margin-top:0;
    margin-bottom:.5rem
}
.notice-panel ul{
    margin:0;
    padding-left:1.25rem
}