/* board-list: 게시판 목록, 전체 검색 */

/* 목록 제목 줄: 좁은 화면(320px)에서 '제보하기' 버튼과 분류명이 글자 중간에서 줄바꿈되지 않게 */
.panel-head .list-write { flex: none; white-space: nowrap; }
.panel-head h1.title:has(+ .list-write), .panel-head h1.title:only-child { flex-wrap: wrap; row-gap: 2px; word-break: keep-all; }
.panel-head h1.title .crumb { white-space: nowrap; }

/* 목록 머리: 건수, 정렬, 목록 수 */
.list-bar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; padding: 12px 18px; border-bottom: 1px solid var(--line); }
.list-info { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; margin: 0; color: var(--muted); font-size: var(--fs-sm); font-variant-numeric: tabular-nums; min-width: 0; }
.list-kw { color: #fff; font-weight: 700; max-width: 16em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.list-scope { color: var(--muted); font-size: var(--fs-xs); font-weight: 600; padding: 0 8px; line-height: 20px; border-radius: 999px; background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line); }
.list-reset { display: inline-flex; align-items: center; min-height: 28px; padding: 0 10px; margin-left: 2px; border-radius: var(--r-sm); color: var(--muted); font-size: var(--fs-xs); font-weight: 600; white-space: nowrap; transition: color .15s, background-color .15s; }
.list-reset:hover { color: var(--accent-hi); background: var(--surface-3); }

.list-tools { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; }
.list-sort { display: flex; align-items: center; gap: 2px; }
.list-sort a { position: relative; display: inline-flex; align-items: center; min-height: 36px; padding: 0 12px; border-radius: var(--r-sm); color: var(--muted); font-size: var(--fs-sm); font-weight: 600; white-space: nowrap; transition: background-color .15s, color .15s; }
.list-sort a:hover { color: #fff; background: var(--surface-3); }
.list-sort a.active { color: var(--accent-hi); background: var(--accent-wash); box-shadow: inset 0 0 0 1px var(--accent-line); }
.list-rows { display: flex; align-items: center; gap: 6px; margin: 0; }
.list-rows label { display: inline-flex; align-items: center; color: var(--muted); font-size: var(--fs-sm); white-space: nowrap; }
.list-rows .form-select { width: auto; min-height: 36px; font-size: 14px; font-variant-numeric: tabular-nums; cursor: pointer; }

/* 목록 표 */
.list-table .t-title { max-width: 0; } /* 긴 제목을 칸 안에서 줄임 */
/* 위치 지정된 줄(tr)에 반투명 배경을 깔면 칸 경계에 이음매가 생겨 안쪽 그림자로 칠한다 */
.list-table tbody tr { position: relative; transition: box-shadow .15s; }
.list-table tbody tr:hover { background: none; box-shadow: inset 0 0 0 999px rgba(91, 155, 255, .05); }
.list-table tbody tr:has(.post-title-link:focus-visible) { box-shadow: inset 0 0 0 999px var(--accent-wash); }
.list-table .t-check { width: 1%; padding-right: 0; }
.list-table .t-check .form-check-input { position: relative; z-index: 1; margin: 0; width: 17px; height: 17px; cursor: pointer; }
.list-table .t-views { text-align: right; }
.list-table th.t-views { text-align: right; }
.list-table .t-date time { cursor: default; }
.list-table tr.is-notice { box-shadow: inset 0 0 0 999px var(--accent-wash); }
.list-table tr.is-notice:hover { box-shadow: inset 0 0 0 999px rgba(91, 155, 255, .16); }
.list-table tr.is-notice .post-title-link { color: #fff; }
.list-table .tag-notice { display: inline-flex; align-items: center; margin-right: 0; }
.list-table .t-title .tag-notice.notice-sm { display: none; }

.t-line { display: flex; align-items: center; gap: 0 6px; min-width: 0; }
.t-line > .tag { flex: none; margin-right: 0; }
.list-table .post-title-link { display: inline-flex; align-items: center; gap: 5px; flex: 0 1 auto; min-width: 0; }
.list-table .post-title-link::after { content: ""; position: absolute; inset: 0; } /* 줄 전체를 누를 수 있게 */
.list-table .post-title-link:focus-visible { outline-offset: 3px; }
.t-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.row-lock { width: 14px; height: 14px; color: var(--muted); stroke-width: 2.1; }
.post-title-link .row-lock { flex: none; }
.row-icon { display: inline-flex; flex: none; color: var(--muted); }
.row-icon .ico { width: 14px; height: 14px; }
.row-cmt { display: inline-flex; align-items: center; gap: 3px; flex: none; color: var(--accent); font-size: var(--fs-xs); font-weight: 700; font-variant-numeric: tabular-nums; }
.row-cmt .ico { width: 13px; height: 13px; stroke-width: 2.1; }
.row-badge { display: inline-flex; align-items: center; flex: none; font-size: 12px; font-weight: 800; line-height: 17px; padding: 0 5px; border-radius: 4px; margin-left: 3px; vertical-align: 2px; }
.t-line > .row-badge { margin-left: 0; }
.row-new { color: #fff; background: var(--accent); }
.row-hot { color: var(--danger-hi); box-shadow: inset 0 0 0 1px rgba(255, 90, 106, .45); }

/* 찾은 말 표시 */
mark.hl { padding: 0 1px; border-radius: 3px; background: var(--accent-wash); color: var(--accent-hi); box-shadow: inset 0 -1px 0 var(--accent-line); }

/* 홈 등에서 쓰는 한 줄 목록 */
.prow-title .row-lock { margin-right: 4px; vertical-align: -.15em; }
.prow-title .row-badge { margin-left: 5px; }
.prow-meta .prow-like { margin-left: 0; }

/* 빈 목록 */
.list-empty { padding: 48px 20px 44px; }
.empty-ico { display: block; margin-bottom: 12px; color: #56627e; line-height: 0; }
.empty-ico .ico { width: 34px; height: 34px; stroke-width: 1.5; }
.list-empty p { color: var(--muted); font-size: var(--fs-md); }
.empty-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; }

/* 관리자 일괄 처리 */
.bulk-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; padding: 12px 18px; border-top: 1px solid var(--line); background: var(--surface-2); }
.bulk-bar .form-select { width: auto; max-width: 100%; min-height: 36px; font-size: 14px; }
.bulk-count { margin-right: 6px; color: var(--muted); font-size: var(--fs-sm); white-space: nowrap; font-variant-numeric: tabular-nums; }
.bulk-count strong { color: #fff; font-weight: 800; margin-right: 1px; }
.bulk-bar.has-sel .bulk-count strong { color: var(--accent-hi); }
.bulk-sep { width: 1px; height: 18px; margin: 0 4px; background: var(--line-strong); }
.bulk-bar .btn:disabled { opacity: .45; cursor: not-allowed; }
.bulk-bar .bulk-del:not(:disabled):hover { color: var(--danger-hi); border-color: rgba(255, 90, 106, .5); background: rgba(255, 90, 106, .08); }

/* 페이지 */
.list-foot { padding: 16px 12px 6px; }
.list-pager .page-link { display: inline-flex; align-items: center; justify-content: center; min-width: 36px; min-height: 36px; text-align: center; font-variant-numeric: tabular-nums; }
.list-pager .page-link:focus { box-shadow: none; }
.list-pager .page-step .ico { width: 14px; height: 14px; stroke-width: 2.2; }
.list-pager .page-item.disabled .page-link { background: var(--surface-2); border-color: var(--line); color: var(--muted); opacity: .4; }

/* 검색 */
.list-search .form-select { flex: 0 0 auto; width: auto; }
.list-search .btn { flex: 0 0 auto; min-height: 44px; }
.search-form .lookup { margin-bottom: 8px; }
.search-form .lookup > .ico { align-self: center; flex: none; width: 18px; height: 18px; margin: 0 2px 0 10px; color: var(--muted); }
.search-opts { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; max-width: 600px; }
.search-opts .form-select { width: auto; max-width: 100%; font-size: 15px; }
.search-opts .search-reset { min-height: 36px; font-size: var(--fs-sm); }
.search-hint { font-size: var(--fs-sm); }
/* 번호·텔레그램으로 찾았을 때 결과 위 요약. 제보가 있으면 금색으로 눈에 띄게 */
.ident-sum { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; margin-bottom: 12px; padding: 14px 18px; border-radius: var(--r-md); background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); }
.ident-ico { display: inline-flex; flex: none; color: var(--muted); }
.ident-ico .ico { width: 22px; height: 22px; }
.ident-body { display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 8px; min-width: 0; }
.ident-kind { color: var(--muted); font-size: var(--fs-xs); font-weight: 700; }
.ident-val { color: #fff; font-size: var(--fs-lg); font-weight: 800; font-variant-numeric: tabular-nums; letter-spacing: .01em; overflow-wrap: anywhere; }
.ident-count { margin: 0 0 0 auto; color: var(--muted); font-size: var(--fs-sm); }
.ident-count strong { color: #fff; font-weight: 800; font-variant-numeric: tabular-nums; }
.ident-all { margin-left: 6px; color: var(--accent-hi); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.ident-sum.is-found { box-shadow: inset 0 0 0 1px rgba(242, 193, 78, .4); background: linear-gradient(90deg, rgba(242, 193, 78, .08), var(--surface) 60%); }
.ident-sum.is-found .ident-ico, .ident-sum.is-found .ident-count strong { color: var(--gold); }

@media (max-width: 767.98px) {
  .list-bar { padding: 10px 12px; }
  .list-table .t-title .tag-notice.notice-sm { display: inline-flex; }
  .list-table .t-check { padding-left: 12px; }
  .list-table .t-check .form-check-input { width: 20px; height: 20px; }
  .list-table td.t-title { padding-top: 12px; padding-bottom: 12px; }
  .list-table .post-meta-sm { display: flex; align-items: center; flex-wrap: wrap; gap: 2px 0; margin-top: 4px; font-variant-numeric: tabular-nums; }
  .post-meta-sm .m-item { display: inline-flex; align-items: center; gap: 3px; min-width: 0; white-space: nowrap; }
  .post-meta-sm .m-item + .m-item::before { content: ""; width: 1px; height: 9px; margin: 0 8px 0 5px; background: var(--line-strong); }
  .post-meta-sm .m-item .ico { width: 12px; height: 12px; }
  .post-meta-sm .m-nick, .post-meta-sm .m-board { max-width: 10em; overflow: hidden; text-overflow: ellipsis; }
  .bulk-bar { padding: 10px 12px; }
  .bulk-bar .btn, .bulk-bar .form-select { min-height: 44px; }
  .list-search { flex-wrap: wrap; padding: 12px; }
  .list-search .form-control { flex: 1 1 80px; }
  .list-search .form-select { max-width: 112px; }
  .list-search .btn { padding: 0 14px; }
  .list-search .form-control, .list-search .form-select, .list-search .btn { min-height: 44px; }
  .list-sort a::after { content: ""; position: absolute; inset: -4px 0; } /* 누르는 범위 44px */
  .list-rows .form-select { min-height: 44px; }
  .list-pager .page-link { min-width: 40px; min-height: 44px; }
  .list-pager .page-far { display: none; }
  .list-reset { min-height: 36px; }
  .empty-actions .btn { min-height: 44px; }
  .ident-sum { padding: 12px 14px; }
  .ident-count { flex: 1 1 100%; margin-left: 36px; }
}
@media (max-width: 420px) {
  .list-tools { width: 100%; justify-content: space-between; }
  .list-sort a { padding: 0 9px; }
  .list-rows label .lbl-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .bulk-bar .form-select { flex: 1 1 100%; }
  .bulk-bar .btn { flex: 1 1 0; }
  .bulk-sep { display: none; }
  .list-kw { max-width: 10em; }
}
/* 아주 좁은 화면: 정렬은 한 줄을 고르게 쓰고, 줄바꿈된 목록 수·검색 버튼이 왼쪽에 홀로 남지 않게 */
@media (max-width: 359.98px) {
  .list-sort { flex: 1 1 100%; }
  .list-sort a { flex: 1; justify-content: center; padding: 0 4px; }
  .list-rows { margin-left: auto; }
  .list-search .btn { flex: 1 1 100%; }
}