@charset "utf-8";

/* =========================================================
   게시판(kilhonet 테마) 디자인 CSS
   - 모양은 kilho.net 의 css/app.css(daisyUI 빌드)가 맡는다. 여기에는 게시판에만 필요한 것만 둔다.
   ========================================================= */

a { text-decoration: none; }

/* 앵커(#) 이동 시 sticky 헤더에 가려지지 않도록 + 부드러운 스크롤 */
html { scroll-padding-top: 5rem; scroll-behavior: smooth; }

/* 본문 바탕(bg-base-200)을 꼬리말까지 채운다 (2026-09-28).
   kilho.net 셸의 <main class="flex-1"> 을 frame.php 가 <div class="flex-1"> 로 바꿔 그 안에 .drawer 를 넣는데,
   이 div 는 늘어나도 안의 .drawer 는 내용 높이뿐이라 비밀번호 확인처럼 짧은 페이지는 회색이 중간에서 끊겼다 */
#app-main > .flex-1 { display: flex; flex-direction: column; }
#app-main > .flex-1 > .drawer { flex: 1 0 auto; }
/* 회원 화면(비밀번호 확인 · 회원 확인 · 가입 등)의 카드 — 세로 1/3 쯤에 둔다 (위 빈칸 : 아래 빈칸 = 1 : 2).
   스킨은 my-auto 로 가운데에 두려 했지만 #site-main 이 flex 가 아니라 먹지 않고 맨 위에 붙어 있었다 */
#site-main:has(> .my-auto) { display: flex; flex-direction: column; }
#site-main:has(> .my-auto)::before { content: ''; flex: 1 1 0; }
#site-main:has(> .my-auto)::after  { content: ''; flex: 2 1 0; }
#site-main > .my-auto { margin-block: 0; }

/* 다크 모드 — 코어 스킨이 흰색을 박아 둔 곳을 테마 색으로 (2026-09-28). 코어는 고치지 않고 여기서 더 구체적인 선택자로 덮는다.
   내용 페이지(회사소개 · 개인정보 처리방침 · 이용약관)는 코어 skin/content/basic 을 쓴다 */
article#ctt { background: var(--color-base-100); }