/* 멀티뷰 게시판 목록 (리스트 · 웹진 · 카드 · 갤러리). 테마 색 변수(커뮤니티 테마 --bfc-*, 빌더 --bf-color-*)를 따르고 없으면 기본 색 */
.bfmv {
    --mv-primary: var(--bfc-primary, var(--bf-color-primary, #3e9fde));
    --mv-soft: color-mix(in srgb, var(--mv-primary) 10%, transparent);
    --mv-ink: var(--bfc-ink, var(--bf-color-text, #27272a));
    --mv-ink2: var(--bfc-ink-2, #52525b);
    --mv-muted: var(--bfc-faint, var(--bf-color-muted, #8b8b94));
    --mv-line: var(--bfc-line, var(--bf-color-border, #e6e6ea));
    --mv-line-soft: var(--bfc-line-soft, color-mix(in srgb, var(--mv-line) 60%, transparent));
    --mv-surface: var(--bfc-surface, var(--bf-color-bg, #fff));
    --mv-bg-soft: var(--bfc-surface-2, var(--bf-color-bg-soft, #f6f7f9));
    --mv-radius: var(--bfc-radius, var(--bf-radius, 6px));
    --mv-danger: #e5484d;
    display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; margin: 0 auto; color: var(--mv-ink); font-size: 15px;
}
.bfmv * { box-sizing: border-box; }
.bfmv a { color: inherit; text-decoration: none; }
.bfmv .bfmv-ico { width: 1.05em; height: 1.05em; flex-shrink: 0; vertical-align: -.15em; }
.bfmv .sound_only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* 분류 */
.bfmv-cats ul { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.bfmv-cats a { display: inline-flex; align-items: center; height: 32px; padding: 0 14px; border: 1px solid var(--mv-line); border-radius: 999px; background: var(--mv-surface); color: var(--mv-ink2); font-size: 13.5px; transition: border-color .12s, color .12s; }
.bfmv-cats a:hover { border-color: var(--mv-primary); color: var(--mv-primary); }
.bfmv-cats a#bo_cate_on { border-color: var(--mv-primary); background: var(--mv-primary); color: #fff; font-weight: 700; }

/* 위 줄: 건수 · 보기 단추 · 도구 */
.bfmv-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.bfmv-count { margin: 0; color: var(--mv-muted); font-size: 13.5px; }
.bfmv-count strong { color: var(--mv-ink); }
.bfmv-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.bfmv-switch { display: inline-flex; padding: 3px; border: 1px solid var(--mv-line); border-radius: calc(var(--mv-radius) + 2px); background: var(--mv-bg-soft); }
.bfmv-switch a { display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 10px; border-radius: var(--mv-radius); color: var(--mv-muted); font-size: 13px; font-weight: 600; transition: background-color .12s, color .12s; }
.bfmv-switch a:hover { color: var(--mv-ink); }
.bfmv-switch a.is-on { background: var(--mv-surface); color: var(--mv-primary); box-shadow: 0 1px 3px rgba(15, 23, 42, .1); }
.bfmv-btn { display: inline-flex; align-items: center; justify-content: center; gap: 5px; height: 36px; padding: 0 14px; border: 1px solid var(--mv-line); border-radius: var(--mv-radius); background: var(--mv-surface); color: var(--mv-ink); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; transition: border-color .12s, color .12s, background-color .12s; }
.bfmv-btn:hover { border-color: var(--mv-primary); color: var(--mv-primary); }
.bfmv-btn--icon { width: 36px; padding: 0; }
/* .bfmv a { color: inherit } 보다 강하게 (글쓰기 · 검색 단추 글자는 흰색) */
.bfmv .bfmv-btn--primary, .bfmv .bfmv-btn--primary:hover { border-color: var(--mv-primary); background: var(--mv-primary); color: #fff; }
.bfmv .bfmv-btn--primary:hover { filter: brightness(1.06); }
.bfmv-btn--danger:hover { border-color: var(--mv-danger); color: var(--mv-danger); }

/* 검색 */
.bfmv-search { display: flex; flex-wrap: wrap; gap: 8px; padding: 14px; border: 1px solid var(--mv-line); border-radius: var(--mv-radius); background: var(--mv-bg-soft); }
.bfmv-search[hidden] { display: none; }
.bfmv-search select, .bfmv-search input[type="search"] { height: 38px; padding: 0 12px; border: 1px solid var(--mv-line); border-radius: var(--mv-radius); background: var(--mv-surface); color: var(--mv-ink); font: inherit; font-size: 14px; }
.bfmv-search input[type="search"] { flex: 1; min-width: 160px; }

/* 공통 표시 */
.bfmv-tag { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 999px; background: var(--mv-soft); color: var(--mv-primary); font-size: 12px; font-weight: 700; white-space: nowrap; }
.bfmv-tag--notice { background: var(--mv-primary); color: #fff; }
.bfmv-tag--hot { background: color-mix(in srgb, var(--mv-danger) 12%, transparent); color: var(--mv-danger); }
.bfmv-title { display: flex; align-items: center; gap: 6px; min-width: 0; margin: 0; font-size: inherit; font-weight: 700; line-height: 1.45; }
.bfmv-title > a { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: color .12s; }
.bfmv-title > a:hover { color: var(--mv-primary); }
.bfmv-marks { display: inline-flex; flex-shrink: 0; align-items: center; gap: 4px; }
.bfmv-mark { display: inline-flex; color: var(--mv-muted); }
.bfmv-cmt { color: var(--mv-primary); font-size: .85em; font-weight: 800; }
.bfmv-cmt::before { content: "["; }
.bfmv-cmt::after { content: "]"; }
.bfmv-new { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; border-radius: 4px; background: #ff6b35; color: #fff; font-size: 10px; font-weight: 800; }
.bfmv-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; color: var(--mv-muted); font-size: 12.5px; }
.bfmv-meta > span { display: inline-flex; align-items: center; gap: 3px; min-width: 0; }
.bfmv-meta__name { color: var(--mv-ink2); font-weight: 600; }
.bfmv-excerpt { display: -webkit-box; margin: 0; overflow: hidden; color: var(--mv-ink2); font-size: 13.5px; line-height: 1.6; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.bfmv-media { position: relative; display: block; overflow: hidden; border-radius: var(--mv-radius); background: var(--mv-bg-soft); }
.bfmv-media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .25s; }
.bfmv-media__empty { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: color-mix(in srgb, var(--mv-muted) 70%, transparent); font-size: 28px; }
.bfmv-chk { display: inline-flex; align-items: center; }
.bfmv-chk input, .bfmv-allchk input { width: 16px; height: 16px; accent-color: var(--mv-primary); }
.bfmv-allchk { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 8px; color: var(--mv-ink2); font-size: 13.5px; }
.is-current .bfmv-title > a { color: var(--mv-primary); }

/* 공지 (리스트가 아닌 보기) */
.bfmv-notices { display: grid; margin: 0 0 14px; padding: 4px 14px; border: 1px solid var(--mv-line); border-radius: var(--mv-radius); background: var(--mv-surface); list-style: none; }
.bfmv-notices li { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 9px 0; }
.bfmv-notices li + li { border-top: 1px solid var(--mv-line-soft); }
.bfmv-notices .bfmv-title { flex: 1; }
.bfmv-notices__date { flex-shrink: 0; color: var(--mv-muted); font-size: 12.5px; }

/* 리스트 */
.bfmv-list, .bfmv-webzine { margin: 0; padding: 4px 18px; border: 1px solid var(--mv-line); border-radius: calc(var(--mv-radius) + 4px); background: var(--mv-surface); list-style: none; }
.bfmv-list > li:last-child, .bfmv-webzine > li:last-child { border-bottom: 0; }
.bfmv-list__head, .bfmv-list__row { display: grid; grid-template-columns: 64px minmax(0, 1fr) 120px 64px 88px; align-items: center; gap: 10px; padding: 12px 8px; border-bottom: 1px solid var(--mv-line-soft); }
.bfmv-list.has-good .bfmv-list__head, .bfmv-list.has-good .bfmv-list__row { grid-template-columns: 64px minmax(0, 1fr) 120px 56px 56px 88px; }
.bfmv-list.has-chk .bfmv-list__head, .bfmv-list.has-chk .bfmv-list__row { grid-template-columns: 24px 64px minmax(0, 1fr) 120px 64px 88px; }
.bfmv-list.has-chk.has-good .bfmv-list__head, .bfmv-list.has-chk.has-good .bfmv-list__row { grid-template-columns: 24px 64px minmax(0, 1fr) 120px 56px 56px 88px; }
.bfmv-list__head { color: var(--mv-muted); font-size: 13px; font-weight: 600; text-align: center; }
.bfmv .bfmv-list__head > span { color: var(--mv-muted); font-size: 13px; font-weight: 600; }
.bfmv-list__head .bfmv-list__subject { text-align: left; }
.bfmv-list__row:hover .bfmv-title > a { color: var(--mv-primary); }
.bfmv-list__row.is-notice .bfmv-title { font-weight: 700; }
.bfmv-list__num, .bfmv-list__hit, .bfmv-list__date { color: var(--mv-muted); font-size: 13px; text-align: center; white-space: nowrap; }
.bfmv-list__name { min-width: 0; overflow: hidden; color: var(--mv-ink2); font-size: 13.5px; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.bfmv-list__subject { display: flex; align-items: center; gap: 6px; min-width: 0; padding-left: calc(var(--bfmv-depth, 0) * 14px); }
.bfmv-list__subject .bfmv-title { font-weight: 600; }
.bfmv-list__label { display: none; }
.bfmv-reply { display: inline-flex; color: var(--mv-muted); }


/* 웹진 */
.bfmv-webzine { display: grid; }
.bfmv-webzine__item { display: grid; grid-template-columns: 220px minmax(0, 1fr); align-items: center; gap: 20px; padding: 18px 0; border-bottom: 1px solid var(--mv-line-soft); }
.bfmv-webzine.has-chk .bfmv-webzine__item { grid-template-columns: auto 220px minmax(0, 1fr); }
.bfmv-webzine .bfmv-media { aspect-ratio: 3 / 2; }
.bfmv-webzine__item:hover .bfmv-media img { transform: scale(1.04); }
.bfmv-webzine__body { display: grid; align-content: center; justify-items: start; gap: 8px; min-width: 0; }
.bfmv-webzine__body .bfmv-title { max-width: 100%; font-size: 17px; }

/* 카드 · 갤러리 */
.bfmv-grid { display: grid; grid-template-columns: repeat(var(--bfmv-cols, 3), minmax(0, 1fr)); gap: 20px; margin: 0; padding: 0; list-style: none; }
.bfmv-card__item, .bfmv-gallery__item { position: relative; display: flex; flex-direction: column; min-width: 0; }
.bfmv-card__item { overflow: hidden; border: 1px solid var(--mv-line); border-radius: calc(var(--mv-radius) + 4px); background: var(--mv-surface); transition: box-shadow .15s, transform .15s; }
.bfmv-card__item:hover { box-shadow: 0 10px 28px rgba(15, 23, 42, .09); transform: translateY(-2px); }
.bfmv-card .bfmv-media { aspect-ratio: 16 / 10; border-radius: 0; }
.bfmv-card__body { display: grid; align-content: start; justify-items: start; gap: 7px; padding: 14px 16px 16px; }
.bfmv-card__body .bfmv-title { max-width: 100%; font-size: 15.5px; }
.bfmv-gallery { gap: 16px 14px; }
.bfmv-gallery .bfmv-media { aspect-ratio: var(--bfmv-ratio, 4 / 3); border-radius: calc(var(--mv-radius) + 2px); }
.bfmv-gallery__item:hover .bfmv-media img { transform: scale(1.05); }
.bfmv-gallery__body { display: grid; gap: 4px; padding: 9px 2px 0; }
.bfmv-gallery__body .bfmv-title { font-size: 14.5px; font-weight: 600; }
.bfmv-grid .bfmv-chk { position: absolute; top: 8px; left: 8px; z-index: 1; padding: 4px; border-radius: 4px; background: rgba(255, 255, 255, .92); }

/* 빈 목록 · 관리 · 아래 줄 */
.bfmv-empty { display: grid; justify-items: center; gap: 8px; margin: 0; padding: 60px 0; color: var(--mv-muted); }
.bfmv-empty .bfmv-ico { width: 32px; height: 32px; }
.bfmv-manage { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 12px; color: var(--mv-muted); font-size: 13.5px; }
.bfmv-manage .bfmv-btn { height: 32px; padding: 0 12px; font-size: 13px; }
.bfmv-foot { display: grid; justify-items: center; gap: 14px; }
.bfmv-foot__btns { display: flex; gap: 8px; justify-self: end; }
.bfmv .pg_wrap { display: flex; justify-content: center; margin: 0; }
.bfmv .pg { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; }
.bfmv .pg a, .bfmv .pg strong { display: inline-flex; align-items: center; justify-content: center; min-width: 34px; height: 34px; padding: 0 8px; border: 1px solid var(--mv-line); border-radius: var(--mv-radius); background: var(--mv-surface); color: var(--mv-ink2); font-size: 13.5px; text-indent: 0; overflow: visible; }
/* 그누보드 기본 CSS 가 처음 · 이전 · 다음 · 맨끝 글자를 숨기고 그림으로 보이므로, 그림 대신 글자로 */
.bfmv .pg .pg_start, .bfmv .pg .pg_prev, .bfmv .pg .pg_next, .bfmv .pg .pg_end { width: auto; padding: 0 10px; background-image: none; font-size: 12.5px; }
.bfmv .pg a:hover { border-color: var(--mv-primary); color: var(--mv-primary); }
.bfmv .pg strong.pg_current { border-color: var(--mv-primary); background: var(--mv-primary); color: #fff; }

/* 좁은 화면 */
@media (max-width: 1024px) {
    .bfmv-grid { grid-template-columns: repeat(min(var(--bfmv-cols, 3), 3), minmax(0, 1fr)); }
}

@media (max-width: 768px) {
    .bfmv-switch__label { display: none; }
    /* 휴대폰: 제목 줄은 전체 선택 칸만 (관리자일 때) */
    .bfmv-list__head { display: flex; align-items: center; gap: 8px; padding: 10px 0; }
    .bfmv-list__head > :not(.bfmv-chk) { display: none; }
    .bfmv-list.has-chk .bfmv-list__head::after { content: "이 쪽 전체 선택"; color: var(--mv-muted); font-size: 12.5px; font-weight: 400; }
    .bfmv-list:not(.has-chk) .bfmv-list__head { display: none; }
    .bfmv-list, .bfmv-webzine { padding: 2px 14px; }
    .bfmv .bfmv-list__row { gap: 4px; padding: 12px 0; }
    .bfmv-list__row { display: flex; flex-wrap: wrap; align-items: center; column-gap: 10px; }
    .bfmv-list__row .bfmv-list__num { display: none; }
    .bfmv-list__row.is-notice .bfmv-list__num { display: inline-flex; }
    .bfmv-list__subject { flex: 1 1 100%; order: -1; }
    .bfmv-list__row .bfmv-chk { order: -2; }
    .bfmv-list__name, .bfmv-list__hit, .bfmv-list__date { font-size: 12px; text-align: left; }
    .bfmv-list__label { display: inline; margin-right: 2px; }
    .bfmv-webzine__item, .bfmv-webzine.has-chk .bfmv-webzine__item { grid-template-columns: 120px minmax(0, 1fr); gap: 14px; padding: 14px 0; }
    .bfmv-webzine__item .bfmv-chk { position: absolute; }
    .bfmv-webzine__item { position: relative; }
    .bfmv-webzine__body .bfmv-title { font-size: 15px; }
    .bfmv-webzine .bfmv-excerpt { -webkit-line-clamp: 1; }
    .bfmv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .bfmv-card__body { padding: 10px 12px 12px; }
    .bfmv-card .bfmv-excerpt { display: none; }
}