/* =========================================================
   PNU Theme (부산대 상징색 기반)
   ---------------------------------------------------------
   Primary Blue : #005BAC
   Accent Green : #009688
   Neutral Gray : #4A4A4A / #666 / #999
   Soft BG      : #F5F7FB
========================================================= */

:root {
    --pnu-blue: #005BAC;
    --pnu-blue-dark: #003F7D;
    --pnu-green: #009688;
    --pnu-gray-100: #f5f7fb;
    --pnu-gray-200: #e9ecf1;
    --pnu-gray-500: #666;
    --pnu-gray-700: #4A4A4A;
}

/* 전체 배경 & 기본 텍스트 */
body {
    background-color: var(--pnu-gray-100);
    color: var(--pnu-gray-700);
    font-family: "Segoe UI", "Apple SD Gothic Neo", sans-serif;
}

/* =========================================================
   헤더 & 네비게이션
========================================================= */
.wj-header-bar {
    background: linear-gradient(90deg, var(--pnu-blue) 0%, var(--pnu-blue-dark) 100%);
    color: #fff;
}

.wj-header-title-ko {
    font-size: 1.8rem;      /* 기존보다 더 큼 */
    font-weight: 600;       /* 더 굵게 */
    letter-spacing: 0.03em;
}

.wj-header-title-en {
    font-size: 1rem;
    font-weight: 500;
    opacity: 0.9;
}


/* 메뉴바 */
.nav a {
    color: var(#689cc9);
    font-weight: 600;
    padding: 0.4rem 0.8rem;
}

.nav a:hover {
    color: var(--pnu-blue-dark);
    text-decoration: underline;
}


.wj-nav-bar {
    background-color: var(--pnu-blue);                  /* 네비바 배경색: 짙은 하늘색 */
    padding: 0.4rem 0.6rem;                     /* 상·하·좌·우 내부 여백 */
    border-radius: 30px;                        /* 네비바 모서리 둥글게 */
    border: 2px solid rgba(196, 196, 196, 0.8);          /* 외곽선: 부산대 파란색 */
    margin-top: 0.4rem;                         /* 상단 여백 */
    box-shadow: 0 4px 12px rgba(122, 132, 224, 0.596);  /* 네비바 아래 그림자 */
}

/* nav-link 기본 색상 (부드러운 파스텔 느낌 유지) */
.wj-nav-bar .nav-link {
    color: #ffffff !important;                  /* 글자색 흰색 */
    opacity: 0.85;                               /* 약간 흐리게(부드러운 느낌) */
    font-weight: 600;                            /* 글자 두께 중간 굵기 */
    margin-right: 20px;                          /* 메뉴 간 간격 */
    border-radius: 18px;                         /* 메뉴 버튼 모서리 둥글게 */
    padding: 0.55rem 1rem;                       /* 메뉴 버튼 안쪽 여백 */
}

/* hover */
.wj-nav-bar .nav-link:hover {
    background-color: rgba(255,255,255,0.2);     /* hover 시 밝은 흰색 오버레이 */
    opacity: 1;                                  /* hover 시 불투명하게 */
}

/* active 탭: 부산대 녹색 */
.wj-nav-bar .nav-link.active {
    background-color: var(--pnu-green) !important; /* 활성 메뉴: 부산대 녹색 */
    color: #fff !important;                        /* 글자는 완전 흰색 */
    opacity: 1;                                     /* 완전 불투명 */
}

/* 메뉴 간 구분선 */
.wj-nav-bar .nav-link + .nav-link {
    border-left: 1px solid rgba(255,255,255,0.25); /* 메뉴 사이 연한 흰색 구분선 */
}

/* 우측 브랜드 링크 스타일 */
.wj-nav-brand-link {
    color: #ffffff;                                /* 링크 글씨 흰색 */
    text-decoration: none;                         /* 밑줄 제거 */
    opacity: 0.9;                                   /* 약간 부드러운 느낌 */
}

.wj-nav-brand-link:hover {
    color: #ffffff;                                /* hover 시에도 흰색 */
    text-decoration: none;                         /* 밑줄 없음 유지 */
    opacity: 1;                                     /* 살짝 강조 */
}

.navbar-toggler,
.navbar-toggler:focus,
.navbar-toggler:active {
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
}

/* =========================================================
   버티컬 여백 & 기본 레이아웃
========================================================= */
.wj-main-container {
    padding-top: 1.2rem;
    padding-bottom: 2rem;
}

/* 섹션 제목 스타일 */
.section-title {
    font-weight: 700;
    font-size: 1.35rem;
    color: var(--pnu-blue);
    margin-bottom: 0.2rem;
}

.section-subtitle {
    font-size: 0.85rem;
    color: #888;
    margin-bottom: 1.2rem;
}

.section-subtitle-indent {
    margin-left: 6px;   /* 적당히 오른쪽으로 이동 */
}

/* =========================================================
   공통 카드 스타일 (페이스북형 타임라인)
========================================================= */
.post-card,
.notice-card {
    border: none;
    border-radius: 14px;
    background-color: #fff;
    padding: 1.2rem 1.3rem;
    margin-bottom: 1rem;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

/* 제목 */
.post-title,
.notice-title {
    font-size: 1.1rem;
    font-weight: 700;
}

/* 작성 시간 */
.post-meta,
.notice-meta {
    font-size: 0.85rem;
    color: #888;
    margin-bottom: 0.8rem;
}

/* 본문 */
.post-content,
.notice-content {
    line-height: 1.6;
    margin-bottom: 0.8rem;
}

/* 첨부파일 영역 */
.attach-section {
    background-color: var(--pnu-gray-200);
    padding: 0.5rem 0.8rem;
    border-radius: 8px;
    margin-top: 0.8rem;
}

.attach-section .file-item {
    margin-bottom: 0.25rem;
}

.attach-section a {
    color: var(--pnu-blue-dark);
    font-weight: 600;
}

.attach-section a:hover {
    text-decoration: underline;
}

/* “내용 보기” 버튼 */
.btn-toggle {
    margin-top: 0.5rem;
}


/* =========================================================
   댓글 스타일 (페이스북 유사)
========================================================= */

/* 전체 댓글 박스 (한 줄 유지) */
.comment-wrapper {
    background-color: #f2fbf6;
    padding: 4px 8px;
    border-radius: 8px;
    width: 100%;
    display: block;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    margin-bottom: 6px;

    flex-wrap: wrap;          /* 줄바꿈 허용 */
    word-break: break-word;   /* 긴 문자열 자동 줄바꿈 */
}

/* 작성자 박스 (조금 더 진한 초록) */
.comment-author-box {
    background-color: #d7f4e5;
    padding: 2px 6px;
    border-radius: 6px;
    font-weight: 600;
    white-space: nowrap;      /* 줄바꿈 없음 */
}

/* 내용 */
.comment-content {
    white-space: normal;      /* 자동 줄바꿈 허용 */
    flex: 1;                  /* 가능한 너비 차지 */
}

/* 시점 */
.comment-time {
    color: #6a6a6a;
    font-size: 0.78rem;
    white-space: nowrap;
    margin-left: 4px;
}

/* 아이콘 버튼 */
.comment-icon-btn {
    cursor: pointer;
    margin-left: 3px;
    font-size: 0.9rem;
    vertical-align: middle;
    transform: translateY(1px); /* 살짝 아래로 */
}

.comment-icon-btn:hover {
    opacity: 1;
}

.comment-edit-box {
    width: 100%;
}



.comment-box {
    margin-top: 1rem;
    padding-top: 0.8rem;
    border-top: 1px solid var(--pnu-gray-200);
}

.comment-item {
    padding: 0.4rem 0;
    border-bottom: 1px solid #eee;
}

.comment-author {
    font-weight: 600;
    color: var(--pnu-blue-dark);
}

.comment-text {
    margin-left: 0.3rem;
}

.comment-time {
    font-size: 0.75rem;
    color: #999;
}

.comment-input {
    margin-top: 0.5rem;
}

.comment-input input {
    border-radius: 20px;
    padding-left: 14px;
}

.comment-submit-btn {
    border-radius: 20px;
    padding: 0.35rem 1rem;
}

.comment-edit-icon,
.comment-delete-icon {
    cursor: pointer;
    font-size: 0.95rem;
    padding: 2px 4px;
    border-radius: 6px;
    background: #eee;
    display: inline-flex;
    align-items: center;
    justify-content: center;

    /* ⭐ 아이콘 vertical alignment */
    line-height: 1;
    transform: translateY(2px);

    margin-left: 4px;
}


/* =========================================================
   버튼 스타일 (부산대 색상)
========================================================= */
.btn-primary {
    background-color: var(--pnu-blue);
    border-color: var(--pnu-blue);
}

.btn-primary:hover {
    background-color: var(--pnu-blue-dark);
    border-color: var(--pnu-blue-dark);
}

.btn-outline-primary {
    color: var(--pnu-blue);
    border-color: var(--pnu-blue);
}

.btn-outline-primary:hover {
    background-color: var(--pnu-blue);
    color: #fff;
}

/* 작은 회색 버튼 */
.btn-gray {
    background-color: #ddd;
    border-color: #ccc;
    color: #444;
}

.btn-gray:hover {
    background-color: #ccc;
}

.comment-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 30%;
    background: #f1f1f1;
    margin-left: 2px;
    cursor: pointer;
    transition: 0.15s;
}

.comment-icon-btn:hover {
    background: #e1e1e1;
}

.btn-xs {
    padding: 0.15rem 0.45rem !important;
    font-size: 0.7rem !important;   /* 기존 대비 약 70% */
    border-radius: 4px !important;
}


/* =========================================================
   1) 툴바 버튼 정렬 및 크기 조정
========================================================= */

/* 버튼 간 간격 */
.fc-toolbar-chunk .fc-button {
    margin-right: 6px !important;
}

/* today와 title 사이 간격 */
.fc-toolbar-title {
    margin-left: 8px !important;
    margin-right: 8px !important;
    font-size: 1.1rem !important;
}

/* 버튼 크기 축소 */
.fc .fc-button {
    font-size: 0.75rem !important;
    padding: 2px 6px !important;
    border-radius: 6px !important;
}

/* ================================
   이벤트 표기
================================ */
/* 시간 글씨 작게 */
.fc-event-time {
    font-size: 0.4rem !important;
    line-height: 0.9 !important;
    padding: 0px 0px 
    padding-right: 1px !important;
}

/* 이벤트 제목 글자 크기 */
.fc-event-title {
    font-size: 0.6rem !important;
    line-height: 0.9 !important;
    padding: 0px 0px !important;
}

/* 이벤트 내부 패딩 축소 */
.fc-event-main {
    padding: 1px 1px !important;
    margin-bottom: 0px !important;
}

/* 이벤트 바(bar) 자체의 상하 여백을 줄임 */
.fc-daygrid-event {
    padding-top: 1px !important;
    padding-bottom: 0px !important;
    margin-top: 0.5px !important;
    margin-bottom: 0.5px !important;
}


/* ================================
   토요일 우측 여백 제거 (핵심 수정)
================================ */
.fc-daygrid-week {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
}

/* 빈칸(day-other) 제거 → 여백 문제 해결 */
.fc-daygrid-day.fc-day-other {
    visibility: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ================================
   날짜 셀 최소 높이 확보 (안정 버전)
================================ */
.fc-daygrid-day-frame {
    min-height: 90px !important;   /* 필요 시 조정 */
}

.fc-daygrid-day {
    height: auto !important;
}


/* =========================================================
   2) 요일 제목 스타일
========================================================= */

.fc-col-header-cell-cushion {
    font-weight: 700 !important;
    text-decoration: none !important;
}

/* 일요일 */
.fc-col-header-cell:nth-child(1) .fc-col-header-cell-cushion {
    color: #d9534f !important;
}

/* 평일 */
.fc-col-header-cell:nth-child(2) .fc-col-header-cell-cushion,
.fc-col-header-cell:nth-child(3) .fc-col-header-cell-cushion,
.fc-col-header-cell:nth-child(4) .fc-col-header-cell-cushion,
.fc-col-header-cell:nth-child(5) .fc-col-header-cell-cushion,
.fc-col-header-cell:nth-child(6) .fc-col-header-cell-cushion {
    color: #666 !important;
}

/* 토요일 */
.fc-col-header-cell:nth-child(7) .fc-col-header-cell-cushion {
    color: #005bac !important;
}


/* =========================================================
   3) 날짜 숫자 원형 스타일 (dayCellContent → .wj-day-circle)
========================================================= */

/* 날짜 원 공통 스타일 */
.wj-day-circle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    font-size: 0.70rem;
    font-weight: 600;
    color: #fff;
    margin-left: 1px;
    margin-top: 0px !important; /* 상단 여백 최소화 */
}

/* 날짜 상단 영역 여백 축소 */
.fc-daygrid-day-top {
    padding-top: 0 !important;
    margin-top: -2px !important;  /* FullCalendar 기본 오프셋 보정 */
}

/* 요일별 색상 */
.fc-day-sun .wj-day-circle {
    background-color: #d9534f !important;
}

.fc-day-sat .wj-day-circle {
    background-color: #005bac !important;
}

.fc-day-mon .wj-day-circle,
.fc-day-tue .wj-day-circle,
.fc-day-wed .wj-day-circle,
.fc-day-thu .wj-day-circle,
.fc-day-fri .wj-day-circle {
    background-color: #777 !important;
}


/* =========================================================
   4) 모바일 스크롤 제거 (전체 높이 자동)
========================================================= */
#calendar {
    height: auto !important;
    max-height: none !important;
}

.fc-scroller {
    overflow: visible !important;
}


/* =========================================================
   5) 토요일 우측 border 단절 해결
========================================================= */

.fc-daygrid-day.fc-day-sat,
.fc-daygrid-day.fc-day-sat > .fc-daygrid-day-frame {
    border-right: 1px solid #ddd !important;
}

/* 전체 그리드 안정화를 위해 (옵션) */
.fc-daygrid-day {
    border-bottom: 1px solid #eee !important;
}

/* =========================================================
   ck-editor
========================================================= */
.ck-editor__editable {
    resize: vertical;
    min-height: 200px;
    max-height: 1000px;
}

/* =========================================================
   모바일 반응형
========================================================= */
@media (max-width: 576px) {
    .post-card,
    .notice-card {
        padding: 1rem;
    }

    .post-title,
    .notice-title {
        font-size: 1rem;
    }
}