/* 공개 화면(Bulma 위에 공통 UI) - Bulma와 이름이 겹치는 부품의 남은 Bulma 모양을 지운다. 화면을 옮기며 채운다(2026-10-05) */

/* ── 폼 엔진(/form/{코드})·콘텐츠 페이지·404·서브 배너/사이드바 (2026-10-05, form/show.php · form/_shared/_field.php · page/view.php · errors/404.php) ── */
/* 공개 폼 칸 묶음 - 라벨 위, 짧은 칸(.is-half)은 넓으면 두 칸씩. 공통 그리드(2열 고정) 대신 줄바꿈 flex로 둬서
   짧은 칸이 긴 칸(여러 줄·알약·파일) 앞에 혼자 남으면 빈 칸 없이 줄을 다 쓴다. 칸 순서(=Tab 순서)는 마크업 그대로 */
.form-panel.is-label-top.form-engine-panel { display: flex; flex-wrap: wrap; gap: .9rem 1rem; }
.form-engine-panel > * { flex: 1 1 100%; min-width: 0; }
.form-engine-panel > .form-row.is-half { flex: 1 1 calc(50% - .51rem); }
.form-engine-panel > .form-row > * { flex: 0 0 auto; } /* 세로로 쌓인 줄 - 공통 flex: 1 1 0이 높이가 되어 입력칸이 눌리지 않게 */
.form-engine-panel > .form-panel-title { margin: 0; }
.form-engine-panel > .form-engine-heading { margin-top: .4rem; padding-top: .9rem; border-top: 1px solid var(--uk-line); }
.form-engine-desc { margin: -.5rem 0 0; font-size: 13px; color: var(--uk-muted); word-break: keep-all; }
.form-engine-divider { height: 0; margin: .1rem 0; border: 0; border-top: 1px solid var(--uk-line); background: none; }
.form-engine-panel .label { margin-bottom: 0; } /* Bulma .label:not(:last-child) 아래 여백 */
.form-engine-panel .form-help { margin: 0; }
/* Bulma .select:not(.is-multiple)::after 화살표가 공통 화살표를 덮는다 - 공통 모양으로 되돌린다 */
.form-engine-panel .select:not(.is-multiple)::after {
  right: .8rem; width: 7px; height: 7px; margin-top: -5px; z-index: auto;
  border: solid var(--uk-muted); border-width: 0 1.5px 1.5px 0; transform: rotate(45deg);
}
.form-engine-panel .select:not(.is-multiple) { height: auto; }
/* 동의 문구 상자 - 300px 대신 낮게(8rem) 두고 칸 안에서 민다 */
.form-engine-consent {
  max-height: 8rem; overflow-y: auto; padding: .6rem .75rem; white-space: pre-line;
  border: 1px solid var(--uk-border); border-radius: var(--uk-r-sm); background: var(--uk-sunk);
  font-size: 13px; line-height: 1.6; color: var(--uk-fg); word-break: keep-all;
}
/* 파일 한 개(폼과 함께 보냄) - 공통 점선 상자 모양만. 고르면 상자를 낮추고 파일 이름을 보인다, 틀리면 빨간 선 */
.form-engine-file .file-drop { min-height: 72px; }
.form-engine-file.is-picked .file-drop { border-style: solid; border-color: var(--uk-brand); }
.form-engine-file .file-drop b { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.form-engine-file .file-upload-input.field-error + .file-drop { border-color: var(--uk-danger); background: var(--uk-danger-light); }
.form-engine-file .file-upload-input:focus + .file-drop { border-color: var(--uk-brand); }
.sub-content > .notice { margin-bottom: 1rem; }
.form-engine .form-actions { border-top: 0; }
/* 접수 끝 */
.form-engine-done { padding: 2.5rem 1rem; text-align: center; }
.form-engine-done-msg { margin: 0 0 1.25rem; font-size: 16px; font-weight: 600; color: var(--uk-fg); word-break: keep-all; }
@media (max-width: 767px) {
  .form-engine-panel > .form-row.is-half { flex-basis: 100%; }
}
/* 콘텐츠 페이지 틀 - 본문(편집기 HTML)은 Bulma .content 글 모양 그대로 */
.page-view { padding: 1.5rem 1.75rem; }
@media (max-width: 767px) { .page-view { padding: 1rem; } }
/* 404 - 공통 빈 상태를 화면 가운데에 */
.error-page { max-width: 40rem; margin: 3rem auto; padding: 0 1rem; }
.error-page .empty-state { margin: 0; padding: 3rem 1rem; }
/* 서브 배너·왼쪽 메뉴 - 구조·배경 무늬(custom.css)는 그대로, 글자·선 색만 공통 토큰으로 */
.sub-banner-title, .sub-breadcrumb .is-current, .sub-sidebar-title,
.sub-contact-box strong, .sub-contact-phone { color: var(--uk-fg); }
.sub-breadcrumb, .sub-breadcrumb a, .sub-sidebar-list a { color: var(--uk-muted); }
.sub-breadcrumb .sep, .sub-contact-hours { color: var(--uk-muted); opacity: .8; }
.sub-breadcrumb a:hover, .sub-sidebar-list a:hover, .sub-sidebar-list a.is-active { color: var(--uk-brand); }
.sub-sidebar-list a.is-active { border-left-color: var(--uk-brand); }
.sub-sidebar-title { border-bottom-color: var(--uk-fg); }
.sub-sidebar-list li { border-bottom-color: var(--uk-line); }
.sub-contact-box { background: var(--uk-head); border-radius: var(--uk-r-md); }
.sub-contact-icon { background: var(--uk-brand-light); color: var(--uk-brand); }
/* ── 폼 엔진·콘텐츠 페이지·404·서브 배너/사이드바 끝 ── */

/* ── 회원 화면(member/auth · member/account · 프로필 편집) - 2026-10-05 ── */
/* 구글(빨강)·카카오(노랑) 버튼은 브랜드 색이라 공통 버튼 색의 예외다(custom.css .social-login-btn).
   공통 .button:hover(글자 강조색)가 뒤에 실려 브랜드 바탕 위 글자를 파랗게 바꾸지 않게 되돌린다 */
.button.social-login-btn.google:hover { color: #fff; }
.button.social-login-btn.kakao:hover { color: #191600; }
.form-row-stack > .button.social-login-btn { margin: 0; }
.auth-social-help { text-align: center; }
/* 프로필 편집 저장 바 - custom.css의 어두운 버튼 규칙(.profile-appearance-savebar .button, 마우스 올림 #262626)이
   공통 주 버튼(.is-primary)의 마우스 올림만 덮어써 색이 섞이지 않게 */
.profile-appearance-savebar .button.is-primary:hover { background: var(--uk-brand-dark); }
.profile-appearance-savebar .button.is-primary:disabled:hover { background: var(--uk-sunk); }
/* ── 회원 화면 끝 ── */

/* ── 게시판 화면(board/**) - 2026-10-05 공통 UI로 옮기며. 색은 테마 변수(--uk-*)만 ── */
/* Bulma 충돌: custom.css의 현재 쪽 번호가 정의되지 않은 --brand를 써서 비어 보였다 → 공통 쪽 번호 색으로 */
.sub-content .pagination-link.is-current { background: var(--uk-brand); border-color: var(--uk-brand); color: var(--uk-on-strong); }
.sub-content .list-card > .pagination { padding: .7rem 1rem .9rem; }
.sub-content .list-search + .list-card { margin-top: 1rem; }

/* 갤러리 목록 - Bulma .box·.image.is-4by3 대신 */
.board-gallery { padding: 1rem; }
.board-gallery .gallery-card { color: var(--uk-fg); border-radius: var(--uk-r-sm); }
.board-gallery-thumb { margin: 0; aspect-ratio: 4 / 3; background: var(--uk-bg); border-radius: var(--uk-r-sm); overflow: hidden; }
.board-gallery-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.board-gallery .gallery-card-meta { color: var(--uk-muted); }

/* FAQ 목록 - 질문 펼치기 */
.board-faq-item { border-bottom: 1px solid var(--uk-line); padding: .85rem 1.1rem; }
.board-faq-item:last-child { border-bottom: 0; }
.board-faq-item > summary { cursor: pointer; font-weight: 600; color: var(--uk-fg); }
.board-faq-answer { margin-top: .6rem; white-space: pre-line; color: var(--uk-fg); overflow-wrap: anywhere; }
.board-faq-more { display: inline-block; margin-top: .4rem; font-size: 13px; }

/* 글 보기 */
.board-view-head { display: block; }
.board-view-badges { display: flex; flex-wrap: wrap; gap: .3rem; margin-bottom: .45rem; }
.board-view .board-view-title { font-size: 1.35rem; line-height: 1.4; overflow-wrap: anywhere; }
.board-view-meta { margin: .35rem 0 0; padding-bottom: .8rem; border-bottom: 1px solid var(--uk-line); font-size: 13px; color: var(--uk-muted); }
.board-view-body { min-height: 120px; padding: .4rem 0 1rem; overflow-wrap: anywhere; }
.board-view-body.is-plain-text { white-space: pre-line; }
.board-section-title { margin: 0 0 .5rem; font-size: 14px; font-weight: 700; color: var(--uk-fg); }
.board-files { padding-top: .8rem; border-top: 1px solid var(--uk-line); }
.board-file-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .4rem; }
.board-file { display: flex; align-items: center; gap: .7rem; min-width: 0; }
.board-file-thumb { flex: 0 0 auto; width: 56px; height: 56px; border-radius: var(--uk-r-sm); overflow: hidden; border: 1px solid var(--uk-line); }
.board-file-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.board-file-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--uk-fg); }
.board-file-meta { flex: 0 0 auto; font-size: 12.5px; color: var(--uk-muted); }
.board-view-actions .is-right form { display: contents; }
.sub-content .detail-panel + .detail-panel { margin-top: 1rem; }

/* 답변·댓글 */
.board-reply-list { list-style: none; margin: 0; padding: 0; }
.board-reply-list > li { padding: .5rem 0; border-bottom: 1px solid var(--uk-line); }
.board-reply-list > li:last-child { border-bottom: 0; }
.board-comment { border-bottom-color: var(--uk-line); }
.board-comment-head { display: flex; align-items: center; gap: .5rem; }
.board-comment-head .cell-sub { margin: 0; }
.board-comment-head form { display: inline; margin-left: auto; }
.board-comment-body { margin-top: .25rem; overflow-wrap: anywhere; color: var(--uk-fg); }
.board-comment-body.is-deleted { color: var(--uk-muted); }
.board-comment-form { display: flex; flex-direction: column; gap: .5rem; margin-top: .9rem; }
.board-comment-guest { display: flex; gap: .5rem; }
.board-comment-guest > .input { flex: 1 1 0; min-width: 0; }
.board-comment-submit { display: flex; justify-content: flex-end; }
.board-comment-login { margin-top: .8rem; }

/* 글쓰기 - 첨부 상자가 사진 바둑판형일 때 위 라벨과 간격 */
.board-write .file-upload { width: 100%; }
@media (max-width: 767px) {
  .board-file-meta { display: none; }
  .board-comment-guest { flex-direction: column; }
}
/* ── 게시판 화면 끝 ── */

/* ── 마이페이지 탭(2026-10-05 브라우저 점검) - 가운데 정렬이면 탭마다 본문 높이가 달라 탭 줄이 위아래로 움직인다. 탭이 있는 화면은 위에 붙인다 ── */
.auth-bare-page:has(.detail-tabs) { padding: 3rem 1rem 2.5rem; }
.auth-bare-page:has(.detail-tabs) .auth-bare-wrap { margin: 0 auto; }
