/*
 Theme Name: 가평교회 차일드 테마
 Theme URI: https://gapyeongchurch.org
 Author: GP Church Dev
 Description: 가평교회 공식 WordPress 차일드 테마 - 부모 테마의 커스터마이징용
 Template: gapyeong-church
 Version: 1.0.0
 Text Domain: gapyeong-church-child
*/

/* ─── 차일드 테마 커스텀 스타일은 여기에 추가 ─── */


/* ==========================================================
   FR-03: 커뮤니티 게시판 통합 UI 리뉴얼
   - 공지사항 (#kboard-avatar-list)
   - 갤러리   (#kboard-thumbnail-list)
   - 교회일정 (#kboard-calendar-list)
   모두 홈페이지 테마 컬러/폰트/여백으로 통일
   ========================================================== */

/* ── 공통: KBoard 헤더 (전체 건수 + 정렬 선택) ────────── */
.kboard-list-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 0.5rem 0 1rem !important;
    border-bottom: 2px solid var(--primary-100, #ede9fe) !important;
    margin-bottom: 1.25rem !important;
}
.kboard-total-count {
    font-size: 0.875rem !important;
    color: var(--slate-500, #64748b) !important;
    font-weight: 500 !important;
}
.kboard-sort select {
    font-size: 0.875rem !important;
    padding: 0.35rem 0.75rem !important;
    border: 1px solid var(--border-color, #e2e8f0) !important;
    border-radius: 8px !important;
    background: #fff !important;
    color: var(--slate-700, #334155) !important;
    cursor: pointer !important;
    outline: none !important;
}

/* ── 공통: 검색창 ─────────────────────────────────────── */
.kboard-search-form {
    margin-top: 1.5rem !important;
    display: flex !important;
    gap: 0.5rem !important;
}
.kboard-search-form input[type="text"] {
    flex: 1 !important;
    padding: 0.6rem 1rem !important;
    border: 1px solid var(--border-color, #e2e8f0) !important;
    border-radius: 8px !important;
    font-size: 0.9rem !important;
    outline: none !important;
    transition: border-color 0.2s !important;
}
.kboard-search-form input[type="text"]:focus {
    border-color: var(--primary-400, #a78bfa) !important;
}
.kboard-search-form input[type="submit"],
.kboard-search-form button {
    padding: 0.6rem 1.25rem !important;
    background: var(--primary-600, #7c3aed) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: background 0.2s !important;
}
.kboard-search-form input[type="submit"]:hover {
    background: var(--primary-700, #6d28d9) !important;
}

/* ── 공통: 페이지네이션 ───────────────────────────────── */
.kboard-page {
    display: flex !important;
    justify-content: center !important;
    gap: 0.35rem !important;
    margin-top: 2rem !important;
    flex-wrap: wrap !important;
}
.kboard-page a,
.kboard-page strong {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 36px !important;
    height: 36px !important;
    padding: 0 0.5rem !important;
    border: 1px solid var(--border-color, #e2e8f0) !important;
    border-radius: 8px !important;
    font-size: 0.875rem !important;
    color: var(--slate-600, #475569) !important;
    text-decoration: none !important;
    transition: all 0.2s !important;
}
.kboard-page a:hover {
    background: var(--primary-50, #f5f3ff) !important;
    border-color: var(--primary-300, #c4b5fd) !important;
    color: var(--primary-600, #7c3aed) !important;
}
.kboard-page strong {
    background: var(--primary-600, #7c3aed) !important;
    border-color: var(--primary-600, #7c3aed) !important;
    color: #fff !important;
    font-weight: 700 !important;
}

/* ── 글쓰기 버튼 ──────────────────────────────────────── */
.kboard-add-document a,
a.kboard-write-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.4rem !important;
    padding: 0.55rem 1.2rem !important;
    background: var(--primary-600, #7c3aed) !important;
    color: #fff !important;
    border-radius: 8px !important;
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: background 0.2s !important;
}
.kboard-add-document a:hover {
    background: var(--primary-700, #6d28d9) !important;
}


/* ==========================================================
   1. 공지사항 – #kboard-avatar-list (table 기반 → 카드 스타)
   ========================================================== */
#kboard-avatar-list .kboard-list table {
    width: 100% !important;
    border-collapse: collapse !important;
    background: #fff !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 1px 6px rgba(0,0,0,0.06) !important;
}
#kboard-avatar-list .kboard-list thead tr {
    background: var(--primary-50, #f5f3ff) !important;
}
#kboard-avatar-list .kboard-list thead td {
    padding: 0.85rem 1rem !important;
    font-size: 0.8rem !important;
    font-weight: 700 !important;
    color: var(--primary-700, #6d28d9) !important;
    border-bottom: 1px solid var(--border-color, #e2e8f0) !important;
    letter-spacing: 0.03em !important;
    text-transform: uppercase !important;
}
#kboard-avatar-list .kboard-list tbody tr {
    border-bottom: 1px solid var(--border-color, #e2e8f0) !important;
    transition: background 0.15s !important;
}
#kboard-avatar-list .kboard-list tbody tr:last-child {
    border-bottom: none !important;
}
#kboard-avatar-list .kboard-list tbody tr:hover {
    background: var(--primary-50, #f5f3ff) !important;
}
#kboard-avatar-list .kboard-list tbody td {
    padding: 1rem 1rem !important;
    font-size: 0.9rem !important;
    color: var(--slate-700, #334155) !important;
    vertical-align: middle !important;
}
#kboard-avatar-list .kboard-list tbody .kboard-list-title a {
    color: var(--slate-800, #1e293b) !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    transition: color 0.15s !important;
}
#kboard-avatar-list .kboard-list tbody .kboard-list-title a:hover {
    color: var(--primary-600, #7c3aed) !important;
}
#kboard-avatar-list .kboard-list tbody .kboard-list-uid,
#kboard-avatar-list .kboard-list tbody .kboard-list-view,
#kboard-avatar-list .kboard-list tbody .kboard-list-vote {
    color: var(--slate-400, #94a3b8) !important;
    font-size: 0.82rem !important;
    text-align: center !important;
}
#kboard-avatar-list .kboard-list tbody .kboard-list-date {
    font-size: 0.82rem !important;
    color: var(--slate-400, #94a3b8) !important;
    white-space: nowrap !important;
}
/* 모바일: 테이블 열 일부 숨김 */
@media (max-width: 640px) {
    #kboard-avatar-list .kboard-list-uid,
    #kboard-avatar-list .kboard-list-vote,
    #kboard-avatar-list .kboard-list-view,
    #kboard-avatar-list .kboard-list-user {
        display: none !important;
    }
}


/* ==========================================================
   2. 갤러리 – #kboard-thumbnail-list (썸네일 그리드 카드)
   ========================================================== */
#kboard-thumbnail-list .kboard-list {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important;
    gap: 1.25rem !important;
}
#kboard-thumbnail-list .kboard-list table,
#kboard-thumbnail-list .kboard-list thead,
#kboard-thumbnail-list .kboard-list tbody,
#kboard-thumbnail-list .kboard-list tr {
    display: contents !important;
}
#kboard-thumbnail-list .kboard-list td {
    display: block !important;
}

/* 카드 wrapper */
#kboard-thumbnail-list .kboard-list tbody tr {
    display: flex !important;
    flex-direction: column !important;
    background: #fff !important;
    border-radius: 14px !important;
    border: 1px solid var(--border-color, #e2e8f0) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05) !important;
    overflow: hidden !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
#kboard-thumbnail-list .kboard-list tbody tr:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 8px 24px rgba(124,58,237,0.12) !important;
}
/* 썸네일 */
#kboard-thumbnail-list .kboard-list .kboard-list-thumbnail {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}
#kboard-thumbnail-list .kboard-list .kboard-list-thumbnail img {
    width: 100% !important;
    height: 180px !important;
    object-fit: cover !important;
    display: block !important;
}
/* 제목 */
#kboard-thumbnail-list .kboard-list .kboard-list-title {
    padding: 0.85rem 1rem 0.25rem !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    color: var(--slate-800, #1e293b) !important;
}
#kboard-thumbnail-list .kboard-list .kboard-list-title a {
    color: inherit !important;
    text-decoration: none !important;
}
#kboard-thumbnail-list .kboard-list .kboard-list-title a:hover {
    color: var(--primary-600, #7c3aed) !important;
}
/* 날짜/작성자 */
#kboard-thumbnail-list .kboard-list .kboard-list-date,
#kboard-thumbnail-list .kboard-list .kboard-list-user {
    padding: 0 1rem 0.85rem !important;
    font-size: 0.78rem !important;
    color: var(--slate-400, #94a3b8) !important;
}
/* 불필요 td 숨김 */
#kboard-thumbnail-list thead,
#kboard-thumbnail-list .kboard-list-uid,
#kboard-thumbnail-list .kboard-list-vote,
#kboard-thumbnail-list .kboard-list-view {
    display: none !important;
}


/* ==========================================================
   3. 교회일정 – #kboard-calendar-list
   ========================================================== */
/* 달력 그리드 헤더(요일) 강조 */
#kboard-calendar-list .kboard-calendar-week {
    background: var(--primary-50, #f5f3ff) !important;
    border-radius: 8px 8px 0 0 !important;
}
#kboard-calendar-list .kboard-calendar-week td {
    text-align: center !important;
    padding: 0.6rem 0 !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    color: var(--primary-600, #7c3aed) !important;
    letter-spacing: 0.08em !important;
}
/* 달력 날짜 셀 */
#kboard-calendar-list .kboard-calendar-date {
    border: 1px solid var(--border-color, #e2e8f0) !important;
    border-radius: 0 !important;
    min-height: 80px !important;
    vertical-align: top !important;
    padding: 0.4rem !important;
    font-size: 0.82rem !important;
    transition: background 0.15s !important;
}
#kboard-calendar-list .kboard-calendar-date:hover {
    background: var(--primary-50, #f5f3ff) !important;
}
/* 오늘 날짜 강조 */
#kboard-calendar-list .kboard-calendar-today {
    background: var(--primary-50, #f5f3ff) !important;
    border-color: var(--primary-200, #ddd6fe) !important;
}
#kboard-calendar-list .kboard-calendar-today .kboard-calendar-day {
    background: var(--primary-600, #7c3aed) !important;
    color: #fff !important;
    border-radius: 50% !important;
    width: 24px !important;
    height: 24px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 700 !important;
}
/* 일정 항목 점(이벤트 도트) */
#kboard-calendar-list .kboard-calendar-event a {
    font-size: 0.72rem !important;
    color: var(--primary-700, #6d28d9) !important;
    background: var(--primary-100, #ede9fe) !important;
    border-radius: 4px !important;
    padding: 1px 5px !important;
    display: block !important;
    margin-bottom: 2px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    text-decoration: none !important;
}
#kboard-calendar-list .kboard-calendar-event a:hover {
    background: var(--primary-200, #ddd6fe) !important;
}
/* 월 네비게이션 */
#kboard-calendar-list .kboard-calendar-navigate {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 1.5rem !important;
    margin-bottom: 1.25rem !important;
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    color: var(--slate-800, #1e293b) !important;
}
#kboard-calendar-list .kboard-calendar-navigate a {
    color: var(--primary-600, #7c3aed) !important;
    text-decoration: none !important;
    font-size: 1.4rem !important;
    line-height: 1 !important;
    transition: color 0.15s !important;
}
#kboard-calendar-list .kboard-calendar-navigate a:hover {
    color: var(--primary-800, #5b21b6) !important;
}

@media (max-width: 640px) {
    #kboard-calendar-list .kboard-calendar-date {
        min-height: 50px !important;
        padding: 0.2rem !important;
    }
    #kboard-calendar-list .kboard-calendar-event a {
        font-size: 0.65rem !important;
    }
}
/* ── 교회일정 페이지네이션 수정 ─────────────────────────
   .kboard-pagination > ul.kboard-pagination-pages > li 구조
   ────────────────────────────────────────────────────── */
.kboard-pagination {
    display: flex !important;
    justify-content: center !important;
    margin-top: 2rem !important;
}
.kboard-pagination-pages {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 0.35rem !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
}
.kboard-pagination-pages li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}
.kboard-pagination-pages li a,
.kboard-pagination-pages li.active a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 36px !important;
    height: 36px !important;
    padding: 0 0.5rem !important;
    border: 1px solid var(--border-color, #e2e8f0) !important;
    border-radius: 8px !important;
    font-size: 0.875rem !important;
    color: var(--slate-600, #475569) !important;
    text-decoration: none !important;
    transition: all 0.2s !important;
    background: #fff !important;
}
.kboard-pagination-pages li a:hover {
    background: var(--primary-50, #f5f3ff) !important;
    border-color: var(--primary-300, #c4b5fd) !important;
    color: var(--primary-600, #7c3aed) !important;
}
.kboard-pagination-pages li.active a {
    background: var(--primary-600, #7c3aed) !important;
    border-color: var(--primary-600, #7c3aed) !important;
    color: #fff !important;
    font-weight: 700 !important;
    pointer-events: none !important;
}
.kboard-pagination-pages li.next-page a,
.kboard-pagination-pages li.last-page a,
.kboard-pagination-pages li.prev-page a,
.kboard-pagination-pages li.first-page a {
    font-size: 0.8rem !important;
    color: var(--primary-600, #7c3aed) !important;
}

/* ── 교회일정 날짜 UI 개선 ──────────────────────────────
   기존: 큰 보라 박스 형태 → 새로운: 심플 pill 뱃지 + 카드
   ────────────────────────────────────────────────────── */

/* 리스트 전체 컨테이너 */
#kboard-calendar-list .kboard-calendar-schedule-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.5rem !important;
    padding: 0 !important;
}

/* 각 일정 항목 */
#kboard-calendar-list .kboard-calendar-item {
    border-bottom: none !important;
    background: #fff !important;
    border: 1px solid var(--border-color, #e2e8f0) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    transition: transform 0.18s ease, box-shadow 0.18s ease !important;
}
#kboard-calendar-list .kboard-calendar-item:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 16px rgba(124, 58, 237, 0.1) !important;
}

/* 링크 레이아웃 */
#kboard-calendar-list .kboard-calendar-link {
    display: flex !important;
    align-items: center !important;
    gap: 1rem !important;
    padding: 0.6rem 1.25rem !important;
    text-decoration: none !important;
    color: inherit !important;
    border-radius: 0 !important;
    background: none !important;
}
#kboard-calendar-list .kboard-calendar-link:hover {
    background: none !important;
    color: inherit !important;
}

/* 날짜 뱃지 – 기존 큰 박스 → 심플 pill */
#kboard-calendar-list .kboard-calendar-date-col {
    flex-shrink: 0 !important;
    min-width: auto !important;
}
#kboard-calendar-list .kboard-calendar-date {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0.3rem 0.75rem !important;
    background: var(--primary-50, #f5f3ff) !important;
    color: var(--primary-700, #6d28d9) !important;
    border: 1px solid var(--primary-200, #ddd6fe) !important;
    border-radius: 999px !important;    /* pill 형태 */
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.03em !important;
    white-space: nowrap !important;
    font-family: 'Pretendard', 'Noto Sans KR', sans-serif !important;
}

/* -- 기간 행사 (12.04~12.06) 스타일 */
#kboard-calendar-list .kboard-calendar-date-col span {
    display: inline-flex !important;
    align-items: center !important;
}

/* 제목 영역 */
#kboard-calendar-list .kboard-calendar-info-col {
    flex: 1 !important;
    min-width: 0 !important;
}
#kboard-calendar-list .kboard-calendar-title {
    font-size: 0.95rem !important;
    font-weight: 500 !important;
    color: var(--slate-800, #1e293b) !important;
    display: block !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
#kboard-calendar-list .kboard-calendar-link:hover .kboard-calendar-title {
    color: var(--primary-600, #7c3aed) !important;
}

/* 화살표 아이콘(→) 제거 및 미니 chevron 추가 */
#kboard-calendar-list .kboard-calendar-info-col::after {
    content: '›' !important;
    color: var(--slate-300, #cbd5e1) !important;
    font-size: 1.2rem !important;
    margin-left: auto !important;
    flex-shrink: 0 !important;
}

@media (max-width: 640px) {
    #kboard-calendar-list .kboard-calendar-link {
        padding: 0.75rem 1rem !important;
        gap: 0.75rem !important;
    }
    #kboard-calendar-list .kboard-calendar-title {
        font-size: 0.875rem !important;
    }
}