@charset "utf-8";

/* 전체게시물(new) 스킨 - site 087 전용.
   theme/vue-087/css/style.css의 .layout-grid/.section-head/.gallery(li >
   .feature-card: .thumb/.card-body/.card-cat/.card-meta/.progress-foot)/
   .pager/.board-actions/.board-search/.btn(.btn-ghost) 클래스를 그대로
   재사용한다. list.skin.php는 검색어 없는 첫 페이지 첫 일반글만
   gb_render_featured()(리본+뱃지)로 확대하지만, 전체게시물은 단일 하이라이트가
   안 맞아 모든 항목을 gb_render_row()와 동일한 표준 .feature-card 구조로
   통일했다(리본 미사용). progress-foot(조회수 기반 인기도 바)는 gb_render_row()
   와 동일한 공식(hit/20, 최대 100%)으로 그대로 살렸다. 그룹/게시판을 기존
   .card-cat(카테고리 라벨) 자리에 합쳐 넣었다. name은 raw 그대로 출력
   (strip_tags 금지, sv_wrap CSS-hide로 처리) - gb_render_row() 자체는
   htmlspecialchars를 쓰지만 그건 board.php 컨텍스트(팝업 마크업 없음)에서만
   안전하다.

   [rail 없음 - 의도된 것] 이 사이트는 list.skin.php가 <div class="layout-grid"
   style="grid-template-columns:1fr;">로 강제 1단 레이아웃을 쓰고 gb_render_rail()을
   호출하지 않는다(rail은 홈 화면 전용). new.php도 그 관례를 그대로 따라 rail을
   생략했다 - 다른 사이트 전부에 있던 사이드바가 이 사이트만 없는 건 실수가
   아니라 원본 list.skin.php와 동일한 의도된 레이아웃이다.

   [카드 overflow:hidden 클리핑 버그 - site048/051/058/067/070/073/079/080/081/
   082/084와 동일 패턴] .feature-card가 모서리 둥글림(border-radius:var(--radius-lg))
   을 위해 overflow:hidden을 쓴다. .card-meta/그 안의 span에는 overflow/ellipsis가
   없다(제목(h3 a)에만 있는 line-clamp는 제목 전용). #fnewlist가 .feature-card의
   조상이 되도록 new.skin.php에서 폼이 카드를 감싸게 만들어서(site075 이후 습관)
   스코프 셀렉터가 정상 매칭된다.

   [.chk_box/.selec_chk 충돌 없음] 이 테마는 .selec_chk에 accent-color를
   `.secret_cm input.selec_chk`로만 스코프해서 걸어뒀다(댓글 비밀글 체크박스
   전용). 관리자 체크박스는 .secret_cm 조상이 없으므로 실제 충돌은 없지만,
   다른 99개 사이트와의 일관성 + 향후 이 사이트 CSS가 바뀔 가능성에 대비해
   표준 #fnewlist 스코프 오버라이드를 그대로 적용했다. */

#fnewlist .feature-card { overflow: visible; }

.new-actions { margin:16px 0; }
.new-search { border:none; margin:0; padding:0; display:flex; flex-wrap:wrap; align-items:center; gap:8px; width:100%; }
.new-search legend { position:absolute; margin:0; padding:0; font-size:0; line-height:0; text-indent:-9999em; overflow:hidden; }
.new-search form { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.new-search select,
.new-search input[type="text"] {
  height:38px;
  padding:0 12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface);
  color:var(--text);
  font-family:var(--font-body);
  font-size:.88rem;
}
.new-search select { background:var(--surface-alt); cursor:pointer; }
.new-search input[type="text"] { min-width:180px; }
.new-search select:focus,
.new-search input:focus { outline:none; border-color:var(--accent); }
.new-search-hint { flex:1 1 100%; margin:8px 0 0; font-family:var(--font-mono); font-size:.76rem; color:var(--muted); }

.admin_new_btn { display:flex; align-items:center; justify-content:flex-end; gap:16px; margin:14px 0; }
.new-allchk { margin-right:auto; }

/* 썸네일 좌상단 관리자 체크박스 오버레이. 조합 셀렉터(.chk_box.new-inline-chk)로
   명시도를 #fnewlist .chk_box(1,1,0)보다 높여서(1,2,0) position:absolute가
   소스 순서와 무관하게 항상 이기게 한다(site082의 소스-순서-의존 버그 재발 방지). */
#fnewlist .chk_box.new-inline-chk {
  position: absolute; top: 10px; left: 10px; z-index: 2;
  background: var(--surface); border-radius: var(--radius-sm);
  padding: 4px 8px; box-shadow: var(--shadow-sm);
}
#fnewlist .selec_chk { position:absolute; top:0; left:0; width:0; height:0; opacity:0; outline:0; z-index:-1; overflow:hidden; }
#fnewlist .chk_box { position:relative; display:inline-flex; align-items:center; font-size:inherit; color:inherit; }
#fnewlist .chk_box label { display:inline-flex; }
#fnewlist .chk_box input[type="checkbox"] + label { position:relative; padding-left:22px; color:var(--muted); cursor:pointer; font-size:.78rem; }
#fnewlist .chk_box input[type="checkbox"] + label:hover { color:var(--accent-dark); }
#fnewlist .chk_box input[type="checkbox"] + label span {
  position:absolute; top:1px; left:0; width:15px; height:15px; display:block;
  margin:0; background:var(--surface); border:1px solid var(--border); border-radius:3px;
}
#fnewlist .chk_box input[type="checkbox"]:checked + label { color:var(--text); }
#fnewlist .chk_box input[type="checkbox"]:checked + label span {
  background:var(--accent) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M3 8.5l3 3 7-7" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat 50% 50%;
  border-color:var(--accent-dark);
}