/* =========================================================
   M&A INSTITUTE — COMMUNITY (bbPress)
   mai-community/assets/mai-community.css

   적용 대상
     1. [bbp-topic-index]  커뮤니티 메인
     2. Single Forum       /community/subject/...
     3. Single Topic       /community/topic/...
     4. Replies
     5. [mai_forum_list]   좌측 포럼 목록 (이 플러그인이 출력)

   수정 지점은 두 곳뿐입니다.
     · 색상      → 01. DESIGN TOKENS
     · 칼럼 비율 → 01. 안의 --mai-cols
   ========================================================= */


/* =========================================================
   01. DESIGN TOKENS
   ★ 여기 값만 바꾸면 전체가 따라옵니다.
   ========================================================= */

:root {

    /* ---------- Brand colours ---------- */
    --mai-navy:        #082f5b;   /* M&A Institute 메인 Navy */
    --mai-blue:        #246895;   /* 링크 / secondary blue */
    --mai-blue-hover:  #174d72;   /* hover */
    --mai-light-blue:  #f2f6fa;   /* 표 헤더 배경 */
    --mai-row-hover:   #fafcfe;   /* 행 hover 배경 */
    --mai-text:        #253342;   /* 본문 */
    --mai-muted:       #707b86;   /* 보조정보 */
    --mai-border:      #dde3e9;   /* 테두리 */
    --mai-border-soft: #e6eaee;   /* 행 구분선 */
    --mai-white:       #ffffff;

    /* bbPress.org 에서 가져온 상태 표시 색 */
    --mai-stripe:      #fbfcfd;   /* 짝수 행 (얇은 줄무늬) */
    --mai-sticky:      #fffaeb;   /* 고정(sticky) 토픽 */
    --mai-sticky-bar:  #e2b84a;   /* 고정 토픽 좌측 띠 */
    --mai-lead:        #f5f9fc;   /* 토픽 원글(첫 글) 배경 */

    /* ---------- Layout ---------- */

    /* ★ bbPress 영역의 최대 폭.
       Astra 가 제목(.entry-header)에 주는 max-width 와 같은 값이어야
       Forum / Topic 화면에서 제목과 표의 좌측이 일치합니다.

       Astra 기준: Content Width 1200px + 좌우 여백 40px = 1240px
       (Appearance > Customize > Container 에서 폭을 바꾸면 이 값도 바꾸십시오)

       1.1.0 까지는 제가 임의로 정한 74rem(=1332px, root 18px 기준)이었고,
       그 때문에 표가 제목보다 92px 넓어 좌측이 46px 어긋났습니다. */
    --mai-content-width: 1240px;
    --mai-radius:        0.35rem;

    /* ★ Forum / Topic 화면에서 제목 위 여백.
       Astra 가 topic 글 유형에만 142.5px 를 주어 토픽 제목이 포럼보다
       106px 아래로 쏠려 있었습니다. 두 화면을 이 값으로 통일합니다.
       (포럼 화면의 원래 값이 36px 이라 그 값을 기준으로 삼았습니다) */
    --mai-entry-top:     36px;

    /* 제목 영역 아래 여백. Astra 는 Topic 화면에만 142.5px 를 주고
       Forum 화면에는 0 을 줍니다. 두 화면을 같게 맞추는 값입니다. */
    --mai-entry-bottom:  0px;

    --mai-side-space:    clamp(1rem, 3vw, 2.5rem);
    --mai-row-y:         clamp(0.9rem, 1.4vw, 1.25rem);
    --mai-row-x:         clamp(0.9rem, 1.6vw, 1.4rem);
    --mai-section-gap:   clamp(1.5rem, 3vw, 3rem);

    /* ---------- Typography ---------- */
    --mai-topic-title: clamp(0.96rem, 1vw + 0.35rem, 1.08rem);
    --mai-meta-size:   clamp(0.72rem, 0.4vw + 0.55rem, 0.82rem);
    --mai-body-size:   clamp(0.92rem, 0.35vw + 0.78rem, 1rem);

    /* ---------- 표 칼럼 비율 ----------
       ★ 토픽 표의 칼럼 폭은 여기 한 곳에서만 바꿉니다.
          Topic  Voices  Posts  Last Post
    */
    --mai-cols:
        minmax(0,      62fr)
        minmax(4.5rem,  9fr)
        minmax(4.5rem,  9fr)
        minmax(9rem,   20fr);

    /* 태블릿 — Voices / Posts 를 숨기고 2칼럼 */
    --mai-cols-tablet:
        minmax(0,    72fr)
        minmax(7rem, 28fr);

    /* 모바일 — Topic 만 */
    --mai-cols-mobile: 1fr;

    /* ★ 좌측 포럼 목록에서 설명을 몇 줄까지 보일지.
       [mai_forum_list description="full"] 이면 이 값과 무관하게 전체 표시,
       description="none" 이면 아예 출력하지 않습니다. */
    --mai-forum-desc-lines: 2;

    /* 반응형 전환 폭은 미디어쿼리에 변수를 쓸 수 없어 17/18 항목에 직접 적혀 있습니다.
       tablet 48rem / mobile 34rem */
}


/* =========================================================
   02. GLOBAL CONTAINER
   ========================================================= */

#bbpress-forums {
    width: min(100%, var(--mai-content-width));
    margin-inline: auto;

    /* 칼럼 비율을 컨테이너 단위로 한 번 더 받아둡니다.
       덕분에 미디어쿼리에서 이 한 줄만 바꾸면 헤더와 모든 행이 함께 움직입니다. */
    --mai-grid: var(--mai-cols);

    font-family: inherit;
    font-size: var(--mai-body-size);
    line-height: 1.6;
    color: var(--mai-text);
}

#bbpress-forums ul,
#bbpress-forums li {
    box-sizing: border-box;
}


/* =========================================================
   03. 숨기는 bbPress 기본 요소
   ★ 이 블록이 이 파일에서 !important 를 쓰는 유일한 곳입니다.
     (테마가 display 를 다시 켜는 경우가 있어 필요합니다)
     되살리려면 해당 규칙을 지우십시오.
   ========================================================= */

/* breadcrumb — 커뮤니티 메인에서는 숨깁니다 (제목 바로 아래라 중복) */
#bbpress-forums .bbp-breadcrumb {
    display: none !important;
}

/* ★ 단, Forum / Topic 화면에서는 되살립니다.
   bbPress.org 처럼 상위 포럼으로 돌아가는 길이 있어야 합니다.
   숨기고 싶으면 이 블록을 지우십시오. */
body.single-forum #bbpress-forums .bbp-breadcrumb,
body.single-topic #bbpress-forums .bbp-breadcrumb {
    display: block !important;
    margin-bottom: clamp(0.7rem, 1.2vw, 1rem);
    font-size: var(--mai-meta-size);
    color: var(--mai-muted);
}

body.single-forum #bbpress-forums .bbp-breadcrumb a,
body.single-topic #bbpress-forums .bbp-breadcrumb a {
    color: var(--mai-blue);
    text-decoration: none;
}

body.single-forum #bbpress-forums .bbp-breadcrumb a:hover,
body.single-topic #bbpress-forums .bbp-breadcrumb a:hover {
    text-decoration: underline;
}

/* "Viewing 3 topics - 1 through 3..." — 목록 화면에서는 숨깁니다 */
#bbpress-forums .bbp-pagination-count {
    display: none !important;
}

/* ★ 단, Topic 화면에서는 답글 수를 보여줍니다 (bbPress.org 와 동일).
   답글이 0개면 PHP 쪽 필터가 문구를 비우고, 아래 :empty 규칙이 그 줄을 숨깁니다. */
body.single-topic #bbpress-forums .bbp-pagination-count {
    display: block !important;
    font-size: var(--mai-meta-size);
    color: var(--mai-muted);
}

body.single-topic #bbpress-forums .bbp-pagination-count:empty {
    display: none !important;
}

/* Astra 가 Forum / Topic 상단에 출력하는 작성자 meta */
body.single-forum .entry-meta,
body.single-topic .entry-meta {
    display: none !important;
}

/* "This forum has..." / "This topic has..." 안내박스 */
body.single-forum #bbpress-forums > .bbp-template-notice.info,
body.single-topic #bbpress-forums > .bbp-template-notice.info {
    display: none !important;
}


/* =========================================================
   04. 표 컨테이너 (토픽 목록 / 포럼 목록 / 답글)
   ========================================================= */

#bbpress-forums ul.bbp-topics,
#bbpress-forums ul.bbp-forums,
#bbpress-forums ul.bbp-replies {
    margin: 0;
    border: 1px solid var(--mai-border);
    background: var(--mai-white);
    border-radius: var(--mai-radius);
    overflow: hidden;
}


/* =========================================================
   05. 표 헤더
   Topic | Voices | Posts | Last Post
   ========================================================= */

#bbpress-forums li.bbp-header {
    padding: 0;
    border: 0;
    background: var(--mai-light-blue);
}

#bbpress-forums li.bbp-header li {
    padding: clamp(0.7rem, 1vw, 0.9rem) var(--mai-row-x);
    font-size: var(--mai-meta-size);
    font-weight: 600;
    color: var(--mai-navy);
    text-transform: none;

    /* 좁은 칼럼에서 Voices 가 한 글자씩 잘리는 현상 방지 */
    white-space: nowrap;
}


/* =========================================================
   06. GRID — 헤더 / 토픽 행 / 포럼 행에 같은 비율 적용
   bbPress 기본값은 float + % 폭이므로 반드시 초기화해야 합니다.
   ========================================================= */

#bbpress-forums li.bbp-header ul.forum-titles,
#bbpress-forums li.bbp-body   ul.topic,
#bbpress-forums li.bbp-body   ul.forum {
    display: grid;
    grid-template-columns: var(--mai-grid);
    align-items: center;
    width: 100%;
}

/* float / 고정폭 초기화 */
#bbpress-forums .bbp-topic-title,
#bbpress-forums .bbp-topic-voice-count,
#bbpress-forums .bbp-topic-reply-count,
#bbpress-forums .bbp-topic-freshness,
#bbpress-forums .bbp-forum-info,
#bbpress-forums .bbp-forum-topic-count,
#bbpress-forums .bbp-forum-reply-count,
#bbpress-forums .bbp-forum-freshness {
    float: none;
    width: auto;
    min-width: 0;
    box-sizing: border-box;
}


/* =========================================================
   07. 각 행
   ========================================================= */

#bbpress-forums li.bbp-body ul.topic,
#bbpress-forums li.bbp-body ul.forum {
    padding: 0;
    margin: 0;
    border-top: 1px solid var(--mai-border);
    background: var(--mai-white);
    transition: background-color 0.15s ease;
}

#bbpress-forums li.bbp-body ul.topic:first-child,
#bbpress-forums li.bbp-body ul.forum:first-child {
    border-top: 0;
}

#bbpress-forums li.bbp-body ul.topic:hover,
#bbpress-forums li.bbp-body ul.forum:hover {
    background: var(--mai-row-hover);
}

#bbpress-forums li.bbp-body ul.topic > li,
#bbpress-forums li.bbp-body ul.forum > li {
    padding: var(--mai-row-y) var(--mai-row-x);
}


/* =========================================================
   08. 토픽 / 포럼 제목
   ========================================================= */

#bbpress-forums a.bbp-topic-permalink,
#bbpress-forums .bbp-forum-title {
    color: var(--mai-blue);
    font-size: var(--mai-topic-title);
    font-weight: 600;
    line-height: 1.4;
    text-decoration: none;
}

#bbpress-forums a.bbp-topic-permalink:hover,
#bbpress-forums .bbp-forum-title:hover {
    color: var(--mai-blue-hover);
    text-decoration: underline;
}


/* =========================================================
   09. Started by / Forum meta
   ========================================================= */

#bbpress-forums .bbp-topic-meta {
    margin-top: 0.35rem;
    font-size: var(--mai-meta-size);
    color: var(--mai-muted);
    line-height: 1.4;
}

#bbpress-forums .bbp-topic-meta a {
    color: var(--mai-muted);
    text-decoration: none;
}

#bbpress-forums .bbp-topic-meta a:hover {
    color: var(--mai-blue);
}

/* 포럼 설명에 섞여 들어온 제목 태그가 튀지 않게 하는 안전장치 */
#bbpress-forums .bbp-forum-content :is(h1, h2, h3, h4),
#bbpress-forums .mai-forum-intro :is(h1, h2, h3, h4) {
    font-size: inherit;
    line-height: inherit;
    margin: 0;
}

/* ★ 개별 포럼 화면의 설명 (템플릿 오버라이드가 출력).
   bbPress 원본은 이 화면에서 설명을 전혀 출력하지 않습니다.

   ★ 클래스에 `bbp-forum-content` 를 쓰지 않습니다. bbPress 기본 CSS 가
     그 클래스에 `margin-left: 130px` 를 주어(작성자 칸을 비우는 용도)
     설명만 130px 안쪽으로 밀려납니다.
     혹시 물려받더라도 아래 margin-left/padding 으로 다시 0 이 됩니다.

   ★ 구독·즐겨찾기 링크가 float:right 라 clear 가 필요합니다. */
#bbpress-forums .mai-forum-intro {
    clear: both;
    margin: 0 0 clamp(1rem, 2vw, 1.5rem);
    margin-left: 0;
    padding: 0;
    font-size: var(--mai-body-size);
    line-height: 1.6;
    color: var(--mai-text);
}

#bbpress-forums .mai-forum-intro p {
    margin: 0 0 0.6em;
}

#bbpress-forums .mai-forum-intro p:last-child {
    margin-bottom: 0;
}


/* =========================================================
   10. Voices / Posts / Last Post
   ========================================================= */

#bbpress-forums .bbp-topic-voice-count,
#bbpress-forums .bbp-topic-reply-count,
#bbpress-forums .bbp-forum-topic-count,
#bbpress-forums .bbp-forum-reply-count {
    text-align: center;
    font-size: var(--mai-meta-size);
    color: var(--mai-muted);

    /* 숫자와 단어가 한 글자씩 줄바꿈되는 현상 방지 */
    white-space: nowrap;
    word-break: normal;
    overflow-wrap: normal;
}

#bbpress-forums .bbp-topic-freshness,
#bbpress-forums .bbp-forum-freshness {
    font-size: var(--mai-meta-size);
    color: var(--mai-muted);
    line-height: 1.4;

    /* 1 week, / 6 days / ago 처럼 세 줄로 깨지는 것을 막습니다 */
    word-break: normal;
    overflow-wrap: normal;
}

#bbpress-forums .bbp-topic-freshness a,
#bbpress-forums .bbp-forum-freshness a {
    color: var(--mai-muted);
    text-decoration: none;
}

#bbpress-forums .bbp-topic-freshness a:hover,
#bbpress-forums .bbp-forum-freshness a:hover {
    color: var(--mai-blue);
}


/* =========================================================
   11. 표 하단 footer — 정보량이 낮아 숨깁니다.
   ★ 되살리려면 display: block;
   ========================================================= */

#bbpress-forums li.bbp-footer {
    display: none;
}


/* =========================================================
   12. PAGINATION — 숫자만 노출
   ========================================================= */

/* ★ 중요 — 페이지가 1장뿐이면 이 div 는 비어 있는데도 위아래 여백을 차지합니다.
   그 때문에 좌측 포럼 목록과 우측 토픽 목록의 첫 줄이 약 54px 어긋났습니다.
   내용이 있을 때만 여백을 줍니다. */
#bbpress-forums .bbp-pagination {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin: 0;
}

/* 주의 — 페이지가 1장일 때도 bbPress 는 .bbp-pagination-links div 자체는
   출력합니다(내용만 비어 있음). 그래서 div 존재가 아니라 실제 페이지 번호
   링크(a)가 있는지로 판단해야 합니다. */
#bbpress-forums .bbp-pagination:has(.bbp-pagination-links a) {
    margin: clamp(1rem, 2vw, 1.5rem) 0;
}

/* Topic 화면 — 좌측에 답글 수, 우측에 페이지 번호.
   답글 수 문구가 실제로 있을 때만 여백을 줍니다. */
body.single-topic #bbpress-forums .bbp-pagination:has(.bbp-pagination-count:not(:empty)) {
    justify-content: space-between;
    margin: clamp(0.7rem, 1.2vw, 1rem) 0;
}

#bbpress-forums .bbp-pagination-links {
    float: none;
}

#bbpress-forums .bbp-pagination-links a,
#bbpress-forums .bbp-pagination-links span.current {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    min-height: 2rem;
    margin-inline: 0.12rem;
    border: 1px solid var(--mai-border);
    background: var(--mai-white);
    color: var(--mai-blue);
    text-decoration: none;
}

#bbpress-forums .bbp-pagination-links span.current {
    background: var(--mai-navy);
    border-color: var(--mai-navy);
    color: var(--mai-white);
}


/* =========================================================
   13. SINGLE FORUM / SINGLE TOPIC 제목
   ========================================================= */

/* ★ 제목은 가운데 정렬입니다 — 커뮤니티 메인("M&A Community")과 같습니다.
   모바일에서 Astra 가 왼쪽으로 돌리는 것까지 막아 모든 폭에서 같게 합니다.
   왼쪽 정렬을 원하시면 아래 center 를 left 로 바꾸십시오. */
body.single-forum .entry-header,
body.single-topic .entry-header,
body.single-forum .entry-title,
body.single-topic .entry-title {
    text-align: center;
}

body.single-forum .entry-title,
body.single-topic .entry-title {
    color: var(--mai-navy);
    font-size: clamp(1.7rem, 2.5vw, 2.5rem);
    line-height: 1.2;
    margin-bottom: clamp(1rem, 2vw, 1.8rem);
}

/* ★ 제목 위/아래 여백을 Forum 과 Topic 에서 같게 맞춥니다.

   원인: Astra 의 `.site .site-content #primary .ast-article-single`
         규칙이 `padding: 10% 5%` 를 줍니다. 10% 는 article 폭(1425px)에
         대한 비율이라 142.5px 이 되고, Topic 화면만 제목이 그만큼
         아래로 밀려 있었습니다. Forum 화면은 2em(36px)으로 계산됩니다.

   이 선택자에 `#primary` 가 들어 있어 우선순위가 (0,1,3,0) 입니다.
   그래서 이쪽도 같은 형태로 써야 이깁니다 — 클래스만 나열하면 집니다.

   좌우 여백은 건드리지 않습니다. `min(100%, --mai-content-width)` 와
   가운데 정렬 덕분에 두 화면 모두 결과가 같기 때문입니다(좌측 92.5px). */
body.single-forum .site-content #primary .ast-article-single,
body.single-topic .site-content #primary .ast-article-single {
    padding-top: var(--mai-entry-top);
    padding-bottom: var(--mai-entry-bottom);
}

body.single-forum #bbpress-forums {
    margin-top: clamp(1rem, 2vw, 2rem);
}


/* =========================================================
   13-2. 즐겨찾기(Favorite) · 구독(Subscribe) 링크

   둘은 서로 다른 기능입니다.
     즐겨찾기 — 내 북마크 목록에 담기   (#favorite-toggle, 토픽 화면만)
     구독하기 — 새 답글 알림 메일 받기 (#subscription-toggle, 포럼·토픽)

   bbPress 가 둘 다 float:right 로 breadcrumb 과 같은 줄 오른쪽에 붙입니다.
   위치는 건드리지 않고 글자 크기만 breadcrumb 과 맞춥니다.

   ★ 기본값은 #bbpress-forums 의 본문 크기(17~18px)를 물려받아 바로 옆
     breadcrumb(13.94~14.76px)보다 컸습니다.
   ========================================================= */

#bbpress-forums #favorite-toggle,
#bbpress-forums #favorite-toggle span,
#bbpress-forums a.favorite-toggle,
#bbpress-forums #subscription-toggle,
#bbpress-forums #subscription-toggle span,
#bbpress-forums a.subscription-toggle {
    font-size: var(--mai-meta-size);
    line-height: 1.6;
}

#bbpress-forums a.favorite-toggle {
    color: var(--mai-blue);
    text-decoration: none;
}

#bbpress-forums a.favorite-toggle:hover {
    color: var(--mai-blue-hover);
    text-decoration: underline;
}

/* 위치는 건드리지 않습니다 — bbPress 가 float: right 를 주어 breadcrumb 과
   같은 줄 오른쪽 끝에 붙습니다. 글자 크기만 맞추는 것이 목적입니다. */

#bbpress-forums a.subscription-toggle {
    color: var(--mai-blue);
    text-decoration: none;
}

#bbpress-forums a.subscription-toggle:hover {
    color: var(--mai-blue-hover);
    text-decoration: underline;
}


/* =========================================================
   13-3. 안내 알림(bbp-template-notice) 목록 정리
   내용이 없는 항목이 빈 불릿으로 남지 않게 합니다.
   ========================================================= */

#bbpress-forums .bbp-template-notice ul {
    margin: 0;
    padding-left: 0;
    list-style: none;
}

#bbpress-forums .bbp-template-notice ul:empty,
#bbpress-forums .bbp-template-notice li:empty {
    display: none;
}


/* =========================================================
   14. REPLY
   ========================================================= */

/* ★ "Author | Posts" 머리줄을 숨깁니다.
   bbPress 기본 CSS 가 이 줄의 Author 칼럼만 120px 로 고정해서,
   본문의 20% 칼럼과 64px 어긋나 있었습니다. 글자 두 개뿐이라 정보도 없고,
   bbPress.org 의 토픽 화면에도 이 줄이 없습니다.
   되살리려면 이 규칙을 지우십시오. */
#bbpress-forums ul.bbp-replies > li.bbp-header {
    display: none;
}

#bbpress-forums div.bbp-reply-header {
    padding: clamp(0.5rem, 0.9vw, 0.7rem) var(--mai-row-x);
    background: var(--mai-light-blue);
    border-top: 1px solid var(--mai-border);
    font-size: var(--mai-meta-size);
    color: var(--mai-muted);
}

#bbpress-forums div.bbp-reply-author {
    width: 20%;
    padding: clamp(1rem, 2vw, 1.5rem);
    font-size: var(--mai-meta-size);
    color: var(--mai-muted);
}

#bbpress-forums div.bbp-reply-content {
    width: 80%;
    margin-left: 20%;
    padding: clamp(1rem, 2vw, 1.7rem);
    font-size: var(--mai-body-size);
    line-height: 1.75;
    color: var(--mai-text);
}

#bbpress-forums .bbp-author-name {
    color: var(--mai-navy);
    font-weight: 600;
    text-decoration: none;
}

/* ★ 아바타 크기는 여기서 */
#bbpress-forums .bbp-author-avatar img.avatar {
    width:  clamp(2.3rem, 4vw, 3.6rem);
    height: clamp(2.3rem, 4vw, 3.6rem);
    border-radius: 50%;
}


/* =========================================================
   15. FORM (새 토픽 / 답글)
   ========================================================= */

#bbpress-forums fieldset.bbp-form {
    margin-top: var(--mai-section-gap);
    padding: clamp(1rem, 2vw, 1.8rem);
    border: 1px solid var(--mai-border);
    background: var(--mai-white);
}

#bbpress-forums fieldset.bbp-form legend {
    color: var(--mai-navy);
    font-weight: 600;
    padding-inline: 0.4rem;
}

#bbpress-forums textarea,
#bbpress-forums input[type="text"],
#bbpress-forums input[type="email"],
#bbpress-forums select {
    width: 100%;
    border: 1px solid #cfd7df;
    border-radius: 0.25rem;
    padding: clamp(0.65rem, 1vw, 0.85rem);
    font-family: inherit;
    font-size: 1rem;
}

#bbpress-forums button.submit,
#bbpress-forums input[type="submit"] {
    background: var(--mai-navy);
    color: var(--mai-white);
    border: 0;
    padding: clamp(0.65rem, 1vw, 0.85rem) clamp(1.1rem, 2vw, 1.7rem);
    font-weight: 600;
    cursor: pointer;
}

#bbpress-forums button.submit:hover,
#bbpress-forums input[type="submit"]:hover {
    background: var(--mai-blue);
}


/* =========================================================
   16. 좌측 포럼 목록 — [mai_forum_list]
   색상은 모두 01 의 변수를 따릅니다.
   ========================================================= */

/* ★ 우측 토픽 목록과 같은 카드 모양으로 맞췄습니다.
   (전에는 좌측만 윗줄 하나짜리 표여서 두 목록이 다른 물건처럼 보였습니다) */
.mai-forum-list {
    width: 100%;
    border: 1px solid var(--mai-border);
    border-radius: var(--mai-radius);
    background: var(--mai-white);
    overflow: hidden;
    font-family: inherit;
}

/* 좁은 칼럼이라 좌우 여백만 따로 둡니다 */
.mai-forum-list {
    --mai-forum-row-x: clamp(0.75rem, 1.2vw, 1.1rem);

    /* ★ line-height 를 #bbpress-forums 와 같게 고정합니다.
       이것이 없으면 테마의 line-height 를 물려받아 좌측 헤더가 2.6px 더 높아지고,
       그만큼 두 목록의 첫 줄이 어긋납니다. */
    line-height: 1.6;
    color: var(--mai-text);
}

.mai-forum-list-header,
.mai-forum-list-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.75rem;
}

/* ★ 세로 padding 을 우측 표 헤더(li.bbp-header li)와 똑같이 맞춰야
   두 목록의 첫 줄 높이가 일치합니다. */
.mai-forum-list-header {
    padding: clamp(0.7rem, 1vw, 0.9rem) var(--mai-forum-row-x);
    background: var(--mai-light-blue);
    font-size: var(--mai-meta-size);
    font-weight: 600;
    color: var(--mai-navy);
    white-space: nowrap;
}

/* 구분선은 헤더의 border-bottom 이 아니라 각 행의 border-top 으로 냅니다.
   (헤더에 border 를 주면 그 1px 만큼 우측 표보다 높아집니다) */
.mai-forum-list-row {
    align-items: center;
    padding: var(--mai-row-y) var(--mai-forum-row-x);
    border-top: 1px solid var(--mai-border);
    background: var(--mai-white);
    transition: background-color 0.15s ease;
}

.mai-forum-list-row:hover {
    background: var(--mai-row-hover);
}

/* 짝수 행 줄무늬 — bbPress.org 방식.
   클래스는 shortcode(PHP)에서 붙입니다. */
.mai-forum-list-row--alt {
    background: var(--mai-stripe);
}

.mai-forum-list-row--alt:hover {
    background: var(--mai-row-hover);
}

/* 제목 + 설명을 한 칸에 담습니다 (오른쪽 Posts 칸과 2열 grid 를 유지하려면
   둘을 감싸야 합니다). min-width:0 이 없으면 긴 단어가 칸을 밀어냅니다. */
.mai-forum-list-main {
    min-width: 0;
}

.mai-forum-list-row a {
    color: var(--mai-blue);
    font-size: clamp(0.86rem, 0.3vw + 0.78rem, 0.98rem);
    font-weight: 500;
    line-height: 1.35;
    text-decoration: none;
}

/* ★ 포럼 설명 — 기본 2줄까지만 보이고 말줄임 처리됩니다.
   글자 수로 자르지 않고 줄 수로 자르므로 한글·영문 모두 칸에 맞게 잘립니다.
   줄 수는 01 의 --mai-forum-desc-lines 에서 바꾸십시오. */
.mai-forum-list-desc {
    margin: 0.3rem 0 0;
    font-size: var(--mai-meta-size);
    line-height: 1.45;
    color: var(--mai-muted);

    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: var(--mai-forum-desc-lines, 2);
    line-clamp: var(--mai-forum-desc-lines, 2);
    overflow: hidden;
}

/* description="full" 일 때 */
.mai-forum-list-desc--full {
    display: block;
    -webkit-line-clamp: none;
    line-clamp: none;
    overflow: visible;
}

.mai-forum-list-row a:hover {
    color: var(--mai-blue-hover);
    text-decoration: underline;
}

.mai-forum-post-count {
    color: var(--mai-muted);
    font-size: 0.82rem;
    text-align: right;
    white-space: nowrap;
}


/* =========================================================
   17. 행 상태 표시 — bbPress.org 에서 가져온 것
   ========================================================= */

/* 줄무늬 — 행이 많아질 때 가로 읽기가 쉬워집니다.
   bbPress 가 행마다 붙이는 even / odd 클래스를 씁니다. */
#bbpress-forums li.bbp-body ul.topic.even,
#bbpress-forums li.bbp-body ul.forum.even {
    background: var(--mai-stripe);
}

/* 고정(sticky) 토픽 — 공지처럼 위에 붙는 글을 눈에 띄게 */
#bbpress-forums li.bbp-body ul.topic.sticky,
#bbpress-forums li.bbp-body ul.topic.super-sticky {
    background: var(--mai-sticky);
    box-shadow: inset 3px 0 0 var(--mai-sticky-bar);
}

#bbpress-forums li.bbp-body ul.topic.sticky:hover,
#bbpress-forums li.bbp-body ul.topic.super-sticky:hover {
    background: #fff6dd;
}

/* 닫힌 토픽 */
#bbpress-forums li.bbp-body ul.topic.status-closed a.bbp-topic-permalink {
    color: var(--mai-muted);
}


/* =========================================================
   18. 토픽 원글 강조 / 작성자 역할
   bbPress.org 는 첫 글(질문)을 답글과 다른 배경으로 구분합니다.
   ========================================================= */

/* 첫 번째 글 = 토픽 본문(질문).
   구조: ul.bbp-replies > li.bbp-body > ul.bbp-replies-list > li:first-child
   ('bbp-body:first-of-type' 은 헤더 li 를 가리키므로 쓸 수 없습니다) */
#bbpress-forums div.bbp-topic-content,
#bbpress-forums ul.bbp-replies-list > li:first-child div.bbp-reply-content {
    background: var(--mai-lead);
}

#bbpress-forums .bbp-author-role {
    display: block;
    margin-top: 0.15rem;
    font-size: 0.72rem;
    font-style: normal;
    color: var(--mai-muted);
}


/* =========================================================
   19. 로그인 / 회원가입 안내 영역
   비로그인 상태의 Forum·Topic 화면 하단에 그대로 노출되던
   날것 그대로의 로그인 폼을 카드로 정리합니다.
   ========================================================= */

#bbpress-forums .bbp-no-topic,
#bbpress-forums .bbp-no-reply {
    max-width: 30rem;
    margin: var(--mai-section-gap) 0 0;
    padding: clamp(1rem, 2vw, 1.6rem);
    border: 1px solid var(--mai-border);
    border-radius: var(--mai-radius);
    background: var(--mai-light-blue);
}

#bbpress-forums .bbp-no-topic .bbp-template-notice,
#bbpress-forums .bbp-no-reply .bbp-template-notice {
    margin: 0 0 clamp(0.8rem, 1.5vw, 1.2rem);
    padding: 0;
    border: 0;
    background: none;
    font-size: var(--mai-body-size);
    font-weight: 600;
    color: var(--mai-navy);
}

#bbpress-forums .bbp-login-form fieldset.bbp-form {
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
}

#bbpress-forums .bbp-login-form legend {
    display: none;
}

#bbpress-forums .bbp-login-form .bbp-username,
#bbpress-forums .bbp-login-form .bbp-email,
#bbpress-forums .bbp-login-form .bbp-password,
#bbpress-forums .bbp-login-form .bbp-remember-me {
    margin-bottom: 0.7rem;
}

#bbpress-forums .bbp-login-form label {
    display: block;
    margin-bottom: 0.25rem;
    font-size: var(--mai-meta-size);
    font-weight: 600;
    color: var(--mai-text);
}

#bbpress-forums .bbp-login-form .bbp-remember-me label {
    display: inline;
    font-weight: 400;
}

#bbpress-forums .bbp-login-form .bbp-submit-wrapper {
    margin-top: 0.9rem;
    text-align: left;
}


/* =========================================================
   19-2. 커뮤니티 메인의 바깥 정렬 보정

   커뮤니티 페이지의 슬러그를 bbPress 의 Forum root slug 와 같게 두면
   그 URL 이 "포럼 아카이브"로 처리됩니다(body.post-type-archive-forum).
   그러면 Astra 가 페이지용이 아니라 **아카이브용 레이아웃**을 적용합니다.

     · Astra Pro: `.ast-plain-container .ast-grid-2 > .site-main > .ast-row`
       에 `margin: 0 -1em` → 콘텐츠가 화면 밖으로 18px 삐져나가 가로 스크롤
     · Spectra alignfull 컨테이너에 좌우 padding 이 129px 붙어
       블록 전체가 헤더보다 왼쪽으로 43~70px 치우침

   편집기 설정 문제가 아닙니다. 페이지는 그대로이고 적용되는 템플릿이
   바뀐 것입니다. 아래에서 그 두 가지를 되돌려 헤더와 같은 칸에 맞춥니다.

   ★ `.ast-row.ast-row` 로 클래스를 두 번 쓴 것은 우선순위 때문입니다.
     Astra Pro 규칙이 클래스 4개(0,0,4,0)라 그냥 쓰면 집니다.

   ★ `.entry-content` 의 `width:100%` 도 필요합니다. article 이 flex 라
     이것이 없으면 내용 폭으로 줄어듭니다(jcinus 에서 1240 → 1188.8).

   ★ 이 블록은 `.mai-forum-list` 가 있는 페이지에만 적용됩니다.
     다른 아카이브나 페이지는 건드리지 않습니다.
   ========================================================= */

body:has(.mai-forum-list) .site-main .ast-row.ast-row {
    margin-left: 0;
    margin-right: 0;
}

body:has(.mai-forum-list) .site-main > article {
    padding-left: 0;
    padding-right: 0;
}

body:has(.mai-forum-list) .entry-content {
    width: 100%;
    max-width: var(--mai-content-width);
    margin-left: auto;
    margin-right: auto;
}

body:has(.mai-forum-list) .entry-content > .wp-block-uagb-container {
    padding-left: 0;
    padding-right: 0;
}


/* =========================================================
   20. 좁은 화면에서 두 열 쌓기 (≤ 62rem / 992px)
   커뮤니티 메인은 Spectra 컨테이너로 좌(포럼 목록) · 우(토픽 목록)
   두 열을 만듭니다. 992px 밑에서는 좌측이 170px 정도로 눌려
   포럼 이름이 줄바꿈되고 Last Post 가 잘립니다.

   ★ 블록 ID(uagb-block-xxxx)를 쓰지 않습니다. :has() 로
     "포럼 목록을 품고 있는 열 묶음"만 찾아내므로 local·staging·live
     어디서나 같게 동작하고, 다른 페이지의 Spectra 는 건드리지 않습니다.

   Spectra 편집기에서 직접 쌓도록 설정하셨다면 이 블록은 지우셔도 됩니다.
   ========================================================= */

@media (max-width: 62rem) {

    .uagb-container-inner-blocks-wrap:has(.mai-forum-list):has(#bbpress-forums) {
        flex-wrap: wrap;
    }

    .uagb-container-inner-blocks-wrap:has(.mai-forum-list):has(#bbpress-forums)
    > .wp-block-uagb-container {
        flex: 1 1 100%;
        width: 100%;
        max-width: 100%;
    }

    /* 쌓인 뒤 두 목록 사이 간격 */
    .uagb-container-inner-blocks-wrap:has(.mai-forum-list):has(#bbpress-forums)
    > .wp-block-uagb-container:first-child {
        margin-bottom: clamp(1rem, 2.5vw, 1.75rem);
    }
}


/* =========================================================
   21. TABLET (≤ 48rem)
   Voices / Posts 를 숨기고 Topic + Last Post 2칼럼
   ========================================================= */

@media (max-width: 48rem) {

    /* ★ 칼럼 변경은 이 한 줄이 전부입니다 */
    #bbpress-forums {
        --mai-grid: var(--mai-cols-tablet);
    }

    #bbpress-forums .bbp-topic-voice-count,
    #bbpress-forums .bbp-topic-reply-count,
    #bbpress-forums .bbp-forum-topic-count,
    #bbpress-forums .bbp-forum-reply-count {
        display: none;
    }

    /* 헤더에서도 같은 칼럼을 숨겨야 열이 맞습니다 */
    #bbpress-forums li.bbp-header ul.forum-titles > li:nth-child(2),
    #bbpress-forums li.bbp-header ul.forum-titles > li:nth-child(3) {
        display: none;
    }

    /* 답글 — 작성자 / 본문 세로 배치 */
    #bbpress-forums div.bbp-reply-author,
    #bbpress-forums div.bbp-reply-content {
        width: 100%;
        margin-left: 0;
        float: none;
    }

    #bbpress-forums div.bbp-reply-author {
        border-bottom: 1px solid var(--mai-border);
        text-align: left;
    }
}


/* =========================================================
   22. MOBILE (≤ 34rem)
   Last Post 도 숨기고 Topic 만 전체 폭
   ========================================================= */

@media (max-width: 34rem) {

    #bbpress-forums {
        --mai-grid: var(--mai-cols-mobile);
    }

    #bbpress-forums .bbp-topic-freshness,
    #bbpress-forums .bbp-forum-freshness {
        display: none;
    }

    #bbpress-forums li.bbp-header ul.forum-titles > li:nth-child(4) {
        display: none;
    }
}