/* ==========================================================
   t10 커뮤니티 (community.php) — 피그마 "05-01-디자인 확산 누적본"
   프레임: 3760:78141 / 78347 / 78748 / 78885 / 79037 / 79191 /
           79350 / 79501 / 79734 / 79929, 4482:90395(글쓰기) / 90617(상세)
   스코프: .community-root (본문), .community-modal (모달)
   ========================================================== */

.community-root {
    --fbc-green: #1d783b;
    --fbc-green-l: #ecf8f0;
    --fbc-line: rgba(0, 0, 0, 0.1);
    --fbc-gray: #6b7280;
    --fbc-text: #000;
    background: #fff;
    color: #000;
    padding: 0 0 130px;
    min-height: 0;
    letter-spacing: -0.03em;
}

.fbc-sr-only {
    position: absolute !important;
    width: 1px; height: 1px;
    margin: -1px; padding: 0;
    overflow: hidden; clip: rect(0 0 0 0);
    white-space: nowrap; border: 0;
}

/* ---------- 히어로 (1920x540) ---------- */
.community-root .community-editorial-header.fbc-hero {
    position: relative;
    height: 540px;
    padding: 0;
    margin: 0 0 75px;
    background: #4fb2f0;
    border: 0;
    overflow: hidden;
    text-align: center;
}
.community-root .fbc-hero-bg {
    position: absolute;
    left: 50%;
    top: -4.06%;
    width: max(100%, 1920px);
    height: auto;
    aspect-ratio: 4096 / 1273;
    transform: translateX(-50%);
    max-width: none;
    display: block;
    pointer-events: none;
}
.community-root .fbc-hero-title {
    position: absolute;
    left: 50%;
    top: 25px;
    width: 504px;
    margin: 0 0 0 -252px;
    line-height: 0;
    z-index: 1;
}
.community-root .fbc-hero-title img {
    width: 100%;
    height: auto;
    display: block;
}

/* ---------- 레이아웃 (231 + 20 + 926 = 1177) ---------- */
.community-root .community-container {
    max-width: 1177px;
    padding: 0;
}
.community-root .cafe-layout {
    grid-template-columns: 231px minmax(0, 926px);
    gap: 20px;
}
.community-root .cafe-sidebar { gap: 20px; }

/* ---------- 사이드바: 카페 프로필 ---------- */
.community-root .cafe-profile {
    background: #fff;
    border: 1px solid var(--fbc-line);
    border-radius: 8px;
    padding: 30px;
}
.community-root .cafe-name {
    font-size: 15px;
    font-weight: 600;
    color: #000;
    letter-spacing: -0.45px;
    line-height: normal;
    margin: 0 0 12px;
}
.community-root .cafe-info-stats {
    font-size: 12px;
    line-height: 22.4px;
    letter-spacing: -0.36px;
    color: var(--fbc-gray);
    gap: 12px;
    margin: 0 0 12px;
    padding: 0 0 11px; /* 피그마 Line 22 는 높이 0 (y96) → 선 1px 을 패딩에서 뺀다 */
    border-bottom: 1px solid var(--fbc-line);
}
.community-root .cafe-info-stats span { display: inline-flex; align-items: center; gap: 6px; height: 23px; }
.community-root .cafe-info-stats strong { color: #000; font-weight: 500; }
.community-root .cafe-user-card { font-size: 13px; }
.community-root .user-guest p {
    font-size: 13px;
    line-height: 1.35;
    letter-spacing: -0.39px;
    color: var(--fbc-gray);
    margin: 0 0 24px;
}
@media (min-width: 769px) {
    /* 피그마 3760:78373: 2줄 텍스트 박스 36(17.55×2 올림) → 버튼 y168, 프로필 240, 메뉴 y260 */
    .community-root .user-guest p { min-height: 36px; }
}
.community-root .login-link-btn,
.community-root .sidebar-btn {
    height: 41px;
    border-radius: 4px;
    background: var(--fbc-green);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.42px;
}
.community-root .login-link-btn:hover,
.community-root .sidebar-btn:hover { background: #166030; }

/* ---------- 사이드바: 메뉴 ---------- */
.community-root .cafe-menu-nav {
    background: #fff;
    border: 1px solid var(--fbc-line);
    border-radius: 8px;
    padding: 30px 0;
    overflow: hidden;
}
.community-root .cafe-menu-list { display: flex; flex-direction: column; gap: 8px; }
.community-root .menu-divider { display: none; }
.community-root .menu-item {
    gap: 8px;
    padding: 10px 30px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: -0.36px;
    color: rgba(0, 0, 0, 0.7);
    border-left: 0;
}
.community-root .menu-item svg {
    width: 16px;
    height: 16px;
    color: rgba(0, 0, 0, 0.7);
    flex-shrink: 0;
}
.community-root .menu-item:hover {
    background: var(--fbc-green-l);
    color: var(--fbc-green);
}
.community-root .menu-item:hover svg { color: var(--fbc-green); }
.community-root .menu-item.active {
    background: var(--fbc-green-l);
    color: var(--fbc-green);
    font-weight: 600;
    border-left: 0;
    box-shadow: inset 1px 0 0 var(--fbc-green); /* 피그마 border-l 은 레이아웃에 영향 없음 */
    padding-left: 30px;
}
.community-root .menu-item.active svg { color: var(--fbc-green); }

/* ---------- 사이드바: 로그인 회원 카드 (3760:79748) ---------- */
.community-root .user-welcome { gap: 12px; margin: 0 0 16px; }
.community-root .avatar-icon {
    width: 46px; height: 46px;
    padding: 0;
    background: #f2f2f2;
    border: 0;
    border-radius: 5.52px;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.community-root .user-welcome-text { display: flex; flex-direction: column; line-height: 22.4px; min-width: 0; }
.community-root .user-welcome .user-role {
    font-size: 12px; font-weight: 500; letter-spacing: -0.36px;
    color: var(--fbc-green);
}
.community-root .user-welcome .user-name {
    display: flex; align-items: baseline; gap: 4px; height: 23px;
    font-size: 15px; letter-spacing: -0.45px; color: #000;
    white-space: nowrap; overflow: hidden;
}
.community-root .user-welcome .user-name strong { font-weight: 600; overflow: hidden; text-overflow: ellipsis; }
.community-root .user-welcome .user-name em {
    font-style: normal; font-size: 12px; letter-spacing: -0.36px; color: rgba(0, 0, 0, 0.5);
}
.community-root .user-mine-links {
    gap: 8px; margin: 0 0 24px; border: 0;
}
.community-root .user-mine-link {
    height: 32px; /* 피그마 3760:79772: 테두리는 안쪽 선 → 높이 32 */
    box-sizing: border-box;
    padding: 0 11px; /* 피그마 3760:79539: px12 는 안쪽 선 기준 → 글자 x12, 꺽쇠 오른쪽 12 */
    align-items: center;
    border: 1px solid var(--fbc-line);
    border-radius: 4px;
    background: #fff;
    font-size: 12px; font-weight: 500; line-height: 1.3; letter-spacing: -0.36px;
    color: rgba(0, 0, 0, 0.7);
}
.community-root .user-mine-link:last-child { border-bottom: 1px solid var(--fbc-line); }
.community-root .user-mine-link:hover,
.community-root .user-mine-link.is-active {
    background: var(--fbc-green-l);
    border-color: var(--fbc-green-l);
    color: var(--fbc-green);
    font-weight: 600;
}
.community-root .user-mine-meta { gap: 6px; color: var(--fbc-green); font-weight: 600; }
.community-root .user-mine-meta strong { font-weight: 600; }
.community-root .user-mine-link svg { width: 6px; height: 6px; color: rgba(0, 0, 0, 0.5); flex-shrink: 0; }
.community-root .avatar-icon svg { width: 22.08px; height: 22.08px; display: block; }
.community-root .fbc-ico { stroke-width: 1; display: block; flex-shrink: 0; }
.community-root .sidebar-btn { gap: 4.7px; }

/* ---------- 게시판 목록 (3760:78416) ---------- */
.community-root .board-list-view {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.community-root .board-view-header {
    align-items: flex-start;
    border: 0;
    padding: 0;
    margin: 0;
}
.community-root .board-view-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 18px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: -0.54px;
    color: #000;
}
.community-root .board-view-title svg { color: var(--fbc-green); width: 18px; height: 18px; } /* 3760:78958 등 */
.community-root .board-view-title .fbc-ico-qna { width: 20px; height: 20px; } /* 3760:78419 */
.community-root .board-view-meta {
    font-size: 13px;
    letter-spacing: -0.39px;
    color: #666;
    line-height: normal;
}
.community-root .board-view-meta strong { color: var(--fbc-green); font-weight: 600; }

/* 검색 · 글쓰기 바 */
.community-root .control-panel {
    background: #fafafa;
    border: 0;
    padding: 12px 24px;
    margin: 0;
}
.community-root .search-and-write { gap: 12px; align-items: stretch; }
.community-root .search-form { gap: 0; }
.community-root .search-input-wrapper {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 46px;
    padding: 0 16px;
    background: #fff;
    border-radius: 4px;
    box-sizing: border-box;
}
.community-root .search-input-wrapper input {
    flex: 1;
    min-width: 0;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    font-size: 15px;
    letter-spacing: -0.45px;
    color: #000;
}
.community-root .search-input-wrapper input::placeholder { color: rgba(0, 0, 0, 0.4); }
.community-root .search-input-wrapper:focus-within { box-shadow: inset 0 0 0 1px var(--fbc-green); }
.community-root .clear-search { position: static; transform: none; color: rgba(0, 0, 0, 0.4); }
.community-root .search-submit-btn {
    width: 22px;
    height: 22px;
    padding: 0;
    background: none;
    color: #000;
    border: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.community-root .search-submit-btn:hover { background: none; color: var(--fbc-green); }
.community-root .write-trigger-btn {
    height: 46px;
    padding: 0 16px;
    gap: 10px;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 4px;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: -0.45px;
    color: #fff;
}
.community-root .write-trigger-btn:hover { background: var(--fbc-green); }
.community-root .write-trigger-btn .fbc-ico { flex-shrink: 0; }
.community-root .mine-toolbar-right { gap: 12px; }
.community-root .mine-delete-btn {
    height: 46px;
    padding: 0 16px;
    background: #fff;
    border: 1px solid var(--fbc-line);
    border-radius: 4px;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: -0.45px;
    color: #000;
}

/* 목록 테이블 */
.community-root .posts-feed { gap: 0; }
.community-root .board-list-view .module-list { border-top: 1px solid rgba(0, 0, 0, 0.2); }
.community-root .module-list-head {
    gap: 12px;
    padding: 8px;
    min-height: 40px;
    box-sizing: border-box;
    border-bottom: 1px solid var(--fbc-line);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: -0.42px;
}
.community-root .module-list-head span,
.community-root .module-list-head .module-item-title,
.community-root .module-list-head .module-item-comments,
.community-root .module-list-head .module-item-author,
.community-root .module-list-head .module-item-origin,
.community-root .module-list-head .module-item-date,
.community-root .module-list-head .module-item-cat {
    color: #000;
    font-weight: 500;
    font-size: 14px;
}
.community-root .module-item {
    gap: 12px;
    padding: 12px 8px;
    border-bottom: 1px solid var(--fbc-line);
    font-size: 14px;
    line-height: 1.6;
    letter-spacing: -0.42px;
}
.community-root .module-item:last-child,
.community-root .board-list-view .module-item:last-child { border-bottom: 1px solid var(--fbc-line); }
.community-root .module-item:hover { background: #fafafa; }
.community-root .module-item-title { color: #000; display: block; }
/* 피그마 3760:78225: 토픽 칸 높이 23 (텍스트 19 + 2/2) → 행 48 */
.community-root .module-item-title .topic-tag { display: inline-block; margin-right: 12px; vertical-align: top; height: 23px; line-height: 19px; box-sizing: border-box; }
.community-root .module-list-head .module-item-title { display: block; }
.community-root .module-item:hover .module-item-title { color: var(--fbc-green); text-decoration: none; }
.community-root .module-item-comments { width: 40px; font-size: 14px; font-weight: 400; color: rgba(0, 0, 0, 0.5); }
.community-root .module-item-author,
.community-root .module-item-date { width: 100px; font-size: 14px; color: rgba(0, 0, 0, 0.5); }
.community-root .module-item-origin { font-size: 14px; color: rgba(0, 0, 0, 0.5); }

/* Q&A 토픽 뱃지 */
.community-root .topic-tag,
.community-modal .topic-tag {
    margin: 0;
    padding: 2px 6px;
    font-size: 12px;
    font-weight: 500;
    line-height: 18.432px;
    letter-spacing: 0;
    border: 0;
    border-radius: 4px;
    background: #effff4;
    color: var(--fbc-green, #1d783b);
    flex-shrink: 0;
}
.community-root .topic-tag[data-topic="비자"],
.community-root .topic-tag[data-topic="교통"],
.community-modal .topic-tag[data-topic="비자"],
.community-modal .topic-tag[data-topic="교통"] { background: #d9eeff; color: #0075d5; }
.community-root .topic-tag[data-topic="기타"],
.community-modal .topic-tag[data-topic="기타"] { background: #f2f2f2; color: #666; }

/* 내가 쓴 글/댓글: 체크박스 + 카테고리 텍스트 (3760:79850) */
.community-root .mine-row-check { width: 13px; }
.community-root .mine-row-check input {
    appearance: none;
    -webkit-appearance: none;
    width: 13px; height: 13px;
    border: 1px solid #ddd;
    border-radius: 2px;
    background: #fff;
    position: relative;
}
.community-root .mine-row-check input:checked { background: var(--fbc-green); border-color: var(--fbc-green); }
.community-root .mine-row-check input:checked::after {
    content: "";
    position: absolute; left: 3.5px; top: 1px;
    width: 3px; height: 6px;
    border: solid #fff; border-width: 0 1.5px 1.5px 0;
    transform: rotate(45deg);
}
.community-root .module-item-cat { width: 80px; justify-content: flex-start; text-align: left; }
.community-root .module-list-head .module-item-cat { width: 80px; text-align: center; justify-content: center; }
/* R2(3760:79929): 피그마 머리행은 체크박스 없이 "카테고리"가 왼쪽(x8)에서 시작. 전체선택 체크박스(기능 유지)가 있으므로
   가운데 정렬 대신 행의 카테고리 글자와 같은 x에서 시작해 피그마 위치에 가깝게 맞춘다 */
.community-root .module-list-head.has-check .module-item-cat { text-align: left; justify-content: flex-start; }
.community-root .module-item-cat .post-badge {
    padding: 0;
    background: none;
    font-size: 12px;
    font-weight: 500;
    line-height: 18.432px;
    letter-spacing: 0;
    white-space: nowrap;
}
.community-root .module-item-cat .cat-qna { color: var(--fbc-green); }
.community-root .module-item-cat .cat-join { color: #0075d5; }
.community-root .module-item-cat .cat-chat { color: #ff7904; }
.community-root .module-item-cat .cat-tip { color: #8b5cf6; }

/* 페이지네이션 */
.community-root .cafe-pagination { gap: 6px; margin: 0; padding: 0; }
.community-root .cafe-pagination .page-num {
    min-width: 34px; height: 34px; padding: 0; letter-spacing: 0;
    border-radius: 4px;
    font-size: 14px; font-weight: 400; color: #9e9e9e;
    background: none;
}
.community-root .cafe-pagination .page-num:hover { background: #f5f5f5; color: #000; }
.community-root .cafe-pagination .page-num.active { background: none; color: #000; font-weight: 600; }
.community-root .cafe-pagination .page-nav {
    width: 3px; min-width: 0; height: 34px; padding: 0;
    border: 0; background: none; color: #9e9e9e;
    display: inline-flex; align-items: center; justify-content: center;
}
/* 피그마 3760:78483: 화살표(3×6) ↔ 숫자 묶음 간격 18 = gap 6 + 12 */
.community-root .cafe-pagination .page-nav.prev { margin-right: 12px; }
.community-root .cafe-pagination .page-nav.next { margin-left: 12px; }
.community-root .cafe-pagination .page-nav:hover { background: none; color: #000; }
.community-root .cafe-pagination .page-nav.is-disabled { color: #9e9e9e; pointer-events: none; }
.community-root .cafe-pagination .page-nav svg { width: 4px; height: 7px; margin: 0 -0.5px; overflow: visible; }

/* ---------- 전체글보기 모듈 (3760:78245) ---------- */
.community-root .integrated-main { gap: 32px; }
.community-root .board-module {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 24px;
}
.community-root .module-header {
    align-items: flex-start;
    padding: 0 0 12px;
    margin: 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.community-root .module-title {
    gap: 8px;
    font-size: 18px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: -0.54px;
    color: #000;
}
.community-root .module-title svg { color: var(--fbc-green); width: 20px; height: 20px; }
.community-root .module-title.fbc-ik-join svg { width: 18px; height: 18px; } /* 피그마 3760:78248 */
.community-root .module-more {
    gap: 10px;
    font-size: 13px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.39px;
    color: #666;
}
/* 피그마 3760:78140: 4.644×9.226 꺽쇠(선 1px 이 박스 밖으로 0.5px) */
.community-root .module-more svg { width: 5.644px; height: 10.226px; margin: -0.5px; overflow: visible; }
.community-root .module-more:hover { color: var(--fbc-green); }
.community-root .module-list-head { height: 41px; }

/* ---------- 빈 상태 (3760:78845) ---------- */
.community-root .no-posts-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 36px 0;
    background: none;
    border: 0;
    text-align: center;
}
.community-root .no-posts-icon { display: block; width: 40px; height: 40px; line-height: 0; }
.community-root .no-posts-card h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 500;
    line-height: 19px; /* 3760:78850 */
    letter-spacing: 0;
    color: #000;
}
.community-root .no-posts-card p {
    margin: -8px 0 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 17px; /* 3760:78851 */
    letter-spacing: 0;
    color: #aaa;
}
.community-root .module-empty {
    padding: 36px 0 12px;
    font-size: 14px;
    line-height: 17px; /* 피그마 3760:79427 텍스트 박스 17 */
    letter-spacing: 0;
    color: #aaa;
}
/* Q&A 목록 머리: 토픽 칸(33) 자리 (피그마 3760:78218) */
.community-root .fbc-head-tag { display: block; width: 33px; height: 24px; flex-shrink: 0; }
.community-root .write-trigger-btn.sidebar-btn {
    width: 100%;
    height: 41px;
    padding: 0 8px;
    gap: 4.7px;
    justify-content: center;
    background: var(--fbc-green);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.42px;
}
.community-root .write-trigger-btn.sidebar-btn:hover { background: #166030; }

/* ==========================================================
   모달 공통 (.community-modal)
   ========================================================== */
.community-modal {
    --fbc-green: #1d783b;
    --fbc-green-l: #ecf8f0;
    background-color: rgba(0, 0, 0, 0.6);
    backdrop-filter: none;
    letter-spacing: -0.03em;
}
.community-modal .modal-card {
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 8px;
    box-shadow: none;
}
.community-modal .close-btn { padding: 0; color: rgba(0, 0, 0, 0.5); line-height: 0; }
.community-modal .close-btn svg { width: 13.72px; height: 13.72px; display: block; }

/* ---------- 글쓰기 모달 (4482:90574) ---------- */
/* 피그마 4482:90574: 테두리는 안쪽 선(레이아웃 미포함) → 패딩에서 1px 뺀다 (본문 338 = 440-51*2) */
#writeModal.community-modal .modal-card,
#loginWarningModal.community-modal .modal-card {
    max-width: 440px;
    padding: 39px 50px;
}
#writeModal.community-modal .modal-header,
#loginWarningModal.community-modal .modal-header {
    margin: 0 0 20px;
    padding: 0;
    border: 0;
    gap: 6px;
}
#writeModal.community-modal .modal-header h3 {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.6;
    letter-spacing: -0.6px;
    color: #111;
}
#writeModal.community-modal .modal-form { gap: 22px; }
#writeModal.community-modal .form-group { gap: 8px; }
#writeModal.community-modal .form-group label {
    margin: 0;
    font-size: 15px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.45px;
    color: #333;
}
#writeModal.community-modal .form-group label span { color: #f00 !important; font-size: 16px; font-weight: 500; letter-spacing: -0.48px; line-height: normal; margin-left: 2px; }
#writeModal.community-modal .form-group select,
#writeModal.community-modal .form-group input,
#writeModal.community-modal .form-group textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 8px;
    background-color: #fff;
    font-size: 13px;
    line-height: 1.4;
    letter-spacing: -0.39px;
    color: #000;
}
#writeModal.community-modal .form-group select {
    height: 42px;
    padding: 0 40px 0 12px;
    appearance: none;
    -webkit-appearance: none;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none'%3E%3Cpath d='M11.6235 7.4971L8.62354 10.4971L5.62354 7.4971' stroke='%23AAAAAA' stroke-width='1.125' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center / 18px 18px;
    cursor: pointer;
}
#writeModal.community-modal .form-group select:invalid,
#writeModal.community-modal .form-group select:has(option[value=""]:checked) { color: #aaa; }
#writeModal.community-modal .form-group input { height: 42px; }
#writeModal.community-modal .form-group textarea { height: 120px; min-height: 120px; resize: vertical; }
#writeModal.community-modal .form-group input::placeholder,
#writeModal.community-modal .form-group textarea::placeholder { color: #aaa; }
#writeModal.community-modal .form-group select:focus,
#writeModal.community-modal .form-group input:focus,
#writeModal.community-modal .form-group textarea:focus { border-color: var(--fbc-green); background-color: #fff; }
.community-modal .modal-actions {
    gap: 12px;
    margin: 20px 0 0;
    padding: 0;
    border: 0;
    justify-content: stretch;
}
.community-modal .cancel-btn {
    width: 88px;
    height: 42px;
    padding: 0 8px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: -0.45px;
    color: #555;
    flex-shrink: 0;
}
.community-modal .submit-btn {
    flex: 1;
    height: 42px;
    padding: 0 8px;
    background: var(--fbc-green);
    border-radius: 4px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.45px;
    color: #fff;
}
.community-modal .submit-btn:hover { background: #166030; }
#loginWarningModal.community-modal .modal-header h3 { color: #111 !important; font-size: 20px; font-weight: 600; }
#loginWarningModal.community-modal .modal-header h3 svg { color: var(--fbc-green); }
#loginWarningModal.community-modal .warning-modal-body { padding: 0 !important; }
#loginWarningModal.community-modal .warning-modal-body p:first-child { font-size: 15px !important; font-weight: 600 !important; color: #111 !important; }
#loginWarningModal.community-modal .warning-modal-body p + p { font-size: 13px !important; color: #666 !important; }
#loginWarningModal.community-modal .modal-actions { margin-top: 24px !important; }
#loginWarningModal.community-modal .submit-btn { display: inline-flex !important; align-items: center; justify-content: center; line-height: 1 !important; }

/* ---------- 게시글 상세 모달 (4482:90796) ---------- */
#detailModal.community-modal .detail-modal-card {
    max-width: 638px;
    padding: 39px 50px; /* 4787:90281: 카드 638, 본문 536 (테두리 1px 포함 51) */
}
#detailModal.community-modal .modal-header {
    gap: 8px;
    margin: 0 0 20px;
    padding: 0;
    border: 0;
}
#detailModal.community-modal .modal-header .post-badge,
#detailModal.community-modal .modal-header .topic-tag {
    display: inline-flex;
    align-items: center;
    height: 30px;
    padding: 0 12px;
    border: 0;
    border-radius: 4px;
    background: var(--fbc-green-l);
    color: var(--fbc-green);
    font-size: 12px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: -0.36px;
}
#detailModal.community-modal .modal-header .topic-tag[data-topic="비자"],
#detailModal.community-modal .modal-header .topic-tag[data-topic="교통"] { background: #d9eeff; color: #0075d5; }
#detailModal.community-modal .modal-header .topic-tag[data-topic="기타"] { background: #f2f2f2; color: #666; }
#detailModal.community-modal .detail-modal-meta { margin: 0 0 4px; }
#detailModal.community-modal .reviewer-info { display: flex; align-items: center; gap: 6px; }
#detailModal.community-modal .reviewer-info .avatar { display: flex; width: 18px; height: 18px; line-height: 0; }
#detailModal.community-modal .reviewer-name {
    font-size: 12px; font-weight: 500; line-height: 1.4; letter-spacing: -0.36px; color: #000;
}
#detailModal.community-modal .detail-modal-title {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.6;
    letter-spacing: -0.6px;
    color: #111;
}
#detailModal.community-modal .post-date {
    display: block;
    margin: 8px 0 0;
    font-size: 10px;
    line-height: 1.4;
    letter-spacing: -0.3px;
    color: #aaa;
}
#detailModal.community-modal .detail-content-divider { margin: 20px 0; background: rgba(0, 0, 0, 0.1); }
#detailModal.community-modal .detail-modal-content {
    font-size: 14px;
    line-height: 1.6;
    letter-spacing: -0.42px;
    color: #333;
}
#detailModal.community-modal .modal-comments-section { margin: 0; padding: 0; border: 0; }
#detailModal.community-modal .comments-heading {
    margin: 0 0 12px;
    font-size: 15px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.45px;
    color: #333;
}
#detailModal.community-modal .comments-heading .comments-count { color: #1d783b; font-weight: 600; }
/* 4787:90281: 목록 내부 스크롤 없음(전체 높이), 긴 스레드는 모달 카드가 스크롤 */
#detailModal.community-modal .comments-list { gap: 8px; margin: 0 0 20px; max-height: none; overflow: visible; }
/* 최상위 댓글: 카드 없음 (너비 536). 답글만 #f8f8f8 카드 */
#detailModal.community-modal .comment-item {
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
}
/* 스레드 구분선: 두 번째 이후 최상위 댓글 위에 1px 선 (gap 8 + margin 16 = 선 위 24, 선 아래 padding 24) */
#detailModal.community-modal .comments-list > .comment-item:not(.is-reply):not(:first-child) {
    margin-top: 16px;
    padding-top: 24px;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 0;
}
#detailModal.community-modal .comment-item.is-reply { margin-left: 24px; padding: 12px; background: #f8f8f8; border-radius: 8px; }
/* 채택 답변은 기능상 강조 카드 유지 */
#detailModal.community-modal .comment-item.accepted:not(.is-reply) { padding: 12px; background: #ecf8f0; border: 0; border-radius: 8px; }
#detailModal.community-modal .comment-item-top { align-items: center; min-height: 18px; line-height: 18px; }
#detailModal.community-modal .comment-item-header {
    justify-content: flex-start;
    gap: 6px;
    margin: 0;
}
/* 아이콘: 최상위 = 18px 원형 아바타(#ECF8F0 + 초록 사람), 답글 = 14px 초록 화살표 */
#detailModal.community-modal .comment-item-header::before {
    content: "";
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #ecf8f0 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none'%3E%3Ccircle cx='9' cy='7.2' r='2.1' stroke='%231D783B' stroke-width='1.1'/%3E%3Cpath d='M5 13.2c0-1.9 1.7-3 4-3s4 1.1 4 3' stroke='%231D783B' stroke-width='1.1' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / 18px 18px;
}
#detailModal.community-modal .comment-item.is-reply .comment-item-header::before {
    width: 14px;
    height: 14px;
    border-radius: 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none'%3E%3Cpath transform='rotate(180 9 9)' fill-rule='evenodd' clip-rule='evenodd' fill='%231D783B' d='M8.22485 3.7734C8.45917 4.00771 8.45917 4.38761 8.22485 4.62192L5.64912 7.19766H10.2006C12.5202 7.19766 14.4006 9.07806 14.4006 11.3977V13.7977C14.4006 14.129 14.1319 14.3977 13.8006 14.3977C13.4693 14.3977 13.2006 14.129 13.2006 13.7977V11.3977C13.2006 9.74081 11.8574 8.39766 10.2006 8.39766H5.64912L8.22485 10.9734C8.45917 11.2077 8.45917 11.5876 8.22485 11.8219C7.99054 12.0562 7.61064 12.0562 7.37633 11.8219L3.77633 8.22192C3.542 7.98761 3.542 7.60771 3.77633 7.3734L7.37633 3.7734C7.61064 3.53908 7.99054 3.53908 8.22485 3.7734Z'/%3E%3C/svg%3E") no-repeat center / 14px 14px;
}
#detailModal.community-modal .comment-author {
    font-size: 12px; font-weight: 500; line-height: 1.4; letter-spacing: -0.36px; color: #000;
}
#detailModal.community-modal .comment-date { font-size: 10px; line-height: 1.4; letter-spacing: -0.3px; color: #aaa; }
#detailModal.community-modal .comment-body {
    margin: 9px 0 0;
    padding-left: 24px;
    font-size: 12px;
    line-height: 1.4;
    letter-spacing: -0.36px;
    color: #686868;
}
#detailModal.community-modal .comment-actions-row { margin: 8px 0 0; padding-left: 24px; }
#detailModal.community-modal .comment-item.is-reply .comment-body,
#detailModal.community-modal .comment-item.is-reply .comment-actions-row { padding-left: 20px; }
#detailModal.community-modal .comment-reply-btn { font-size: 11px; font-weight: 500; color: #999; }
#detailModal.community-modal .comment-reply-btn:hover { color: var(--fbc-green); }
#detailModal.community-modal .comment-kebab { width: 22px; height: 18px; font-size: 16px; color: #999; }
#detailModal.community-modal .comment-kebab-menu { border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 4px; overflow: hidden; }
#detailModal.community-modal .comment-badge-staff,
#detailModal.community-modal .comment-badge-accepted {
    margin-left: 6px; padding: 1px 6px; border-radius: 3px; font-size: 10px; font-weight: 600;
}
#detailModal.community-modal .comment-badge-staff { background: #ff7904; }
#detailModal.community-modal .comment-badge-accepted { background: var(--fbc-green); }
#detailModal.community-modal .adopt-btn { border-radius: 4px; background: var(--fbc-green); font-size: 11px; }
#detailModal.community-modal .adopt-btn.active { background: #e5e7eb; color: #6b7280; }
#detailModal.community-modal .comment-adopt-actions { margin: 0; }
#detailModal.community-modal .comment-edit-box { border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 4px; }
#detailModal.community-modal .comment-reply-hint { font-size: 12px; color: var(--fbc-green); }
#detailModal.community-modal .comment-input-group { gap: 12px; }
#detailModal.community-modal .comment-input-group input {
    height: 42px;
    padding: 0 12px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    background: #fff;
    font-size: 12px;
    letter-spacing: -0.36px;
    color: #000;
}
#detailModal.community-modal .comment-input-group input::placeholder { color: #aaa; }
#detailModal.community-modal .comment-input-group input:focus { border-color: var(--fbc-green); }
#detailModal.community-modal .comment-submit-btn {
    height: 42px;
    padding: 0 12px;
    border-radius: 4px;
    background: var(--fbc-green);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.45px;
}
#detailModal.community-modal .detail-modal-footer {
    margin: 20px 0 0;
    padding: 20px 0 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}
#detailModal.community-modal .cafe-foot-btn {
    height: 34px;
    padding: 0 14px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    background: #fff;
    font-size: 13px;
    font-weight: 500;
    color: #555;
}
#detailModal.community-modal .cafe-foot-btn:hover { border-color: var(--fbc-green); color: var(--fbc-green); background: #fff; }
#writeModal.community-modal .form-group { margin: 0; }
#writeModal.community-modal .modal-actions { margin-top: -2px; }
#detailModal.community-modal .detail-modal-content { white-space: normal; }
.community-root .module-item-origin { width: 100px; }

/* ==========================================================
   반응형 (태블릿·모바일)
   ========================================================== */
@media (max-width: 1240px) {
    .community-root .community-container { padding: 0 24px; }
}
@media (max-width: 1024px) {
    .community-root .community-editorial-header.fbc-hero { height: 400px; margin-bottom: 48px; }
    .community-root .fbc-hero-bg { width: auto; height: 110.5%; min-width: 100%; }
    .community-root .fbc-hero-title { width: 374px; margin-left: -187px; top: 18px; }
}
@media (max-width: 768px) {
    .community-root { padding-bottom: 80px; }
    .community-root .community-container { padding: 0 16px; }
    .community-root .community-editorial-header.fbc-hero { height: 300px; margin-bottom: 32px; }
    .community-root .fbc-hero-title { width: 260px; margin-left: -130px; top: 14px; }
    .community-root .cafe-layout { grid-template-columns: minmax(0, 1fr); gap: 16px; }
    .community-root .cafe-sidebar { gap: 12px; }
    .community-root .cafe-profile { padding: 20px; }

    /* 메뉴: 가로 스크롤 칩 */
    .community-root .cafe-menu-nav { padding: 0; border: 0; background: transparent; border-radius: 0; overflow: visible; }
    .community-root .cafe-menu-list {
        flex-direction: row;
        gap: 6px;
        overflow-x: auto;
        padding: 0 0 4px;
        border: 0;
        scrollbar-width: none;
    }
    .community-root .menu-item,
    .community-root .menu-item.active {
        padding: 8px 14px;
        border: 1px solid var(--fbc-line);
        border-radius: 999px;
        background: #fff;
        white-space: nowrap;
    }
    .community-root .menu-item.active {
        background: var(--fbc-green);
        border-color: var(--fbc-green);
        color: #fff;
    }
    .community-root .menu-item.active svg { color: #fff; }

    /* 게시판 박스 */
    .community-root .board-list-view,
    .community-root .board-module { padding: 16px; }
    .community-root .board-list-view { gap: 16px; }
    .community-root .board-view-title { font-size: 16px; }
    .community-root .board-view-meta { white-space: nowrap; }
    .community-root .control-panel { padding: 10px; }
    .community-root .search-and-write { gap: 8px; }
    .community-root .search-input-wrapper { height: 42px; padding: 0 12px; }
    .community-root .search-input-wrapper input { font-size: 14px; }
    .community-root .write-trigger-btn { height: 42px; padding: 0 12px; gap: 6px; font-size: 14px; }
    .community-root .mine-delete-btn { height: 42px; font-size: 14px; }

    /* 목록: 작성자 숨김, 폭 축소 */
    .community-root .module-list-head,
    .community-root .module-item { gap: 8px; padding-left: 4px; padding-right: 4px; }
    .community-root .module-item-author,
    .community-root .module-list-head .module-item-author { display: none; }
    .community-root .module-item-comments { width: 36px; font-size: 13px; white-space: nowrap; }
    .community-root .module-item-title .topic-tag { margin-right: 6px; }
    .community-root .module-item-date { width: 72px; font-size: 12px; }
    .community-root .module-item-title { font-size: 14px; gap: 6px; }
    .community-root .module-item-cat,
    .community-root .module-list-head .module-item-cat { width: 64px; }
    .community-root .module-item-cat .post-badge { white-space: normal; line-height: 1.3; }
    .community-root .module-item-origin,
    .community-root .module-list-head .module-item-origin,
    .community-root .module-item.is-mine-comments .module-item-origin,
    .community-root .module-list-head.is-mine-comments .module-item-origin { display: none; }
    .community-root .module-list-head span { font-size: 13px; }

    /* 모달 */
    #writeModal.community-modal .modal-card,
    #loginWarningModal.community-modal .modal-card,
    #detailModal.community-modal .detail-modal-card { padding: 28px 20px; }
}

/* 피그마 3760:78850/78851/79427: 빈 상태 문구는 Noto Sans KR (웹폰트는 A3 전역 로드) */
.community-root .no-posts-card h3,
.community-root .no-posts-card p,
.community-root .module-empty {
    font-family: 'Noto Sans KR', 'Pretendard Variable', Pretendard, sans-serif;
}