/*
Theme Name: 우리동네 찐사장 (LSL Theme)
Description: 우리동네 찐사장 사이트용 가벼운 블록 테마. 머리말(로고·메뉴 3개·무료 진단 버튼)과 꼬리말만 담당하고, 진단·홈 화면은 lsl-diagnosis 플러그인이 그린다.
Version: 0.8.1
Requires at least: 6.6
Requires PHP: 8.1
Text Domain: lsl-theme
*/

/* 글꼴·글자 크기 6단계 (플러그인 lsl.css 와 같은 값 — 플러그인 없이도 머리말·꼬리말이 깨지지 않게) */
:root {
	--lsl-fs-xs: 13px; --lsl-fs-sm: 15px; --lsl-fs-md: 17px; --lsl-fs-lg: 20px;
	--lsl-fs-xl: clamp(22px, 5.6vw, 26px); --lsl-fs-2xl: clamp(34px, 9vw, 40px);
}
body { -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font-family: inherit; }

/* 머리말 */
.lsl-header { border-bottom: 1px solid var(--wp--preset--color--line); }
/* 로고 그림 [lsl_logo] (2026-10-15 '우리동네 찐사장'). 높이만 정하고 너비는 비율대로. */
.lsl-logo { display: inline-flex; align-items: center; line-height: 0; flex: none; }
.lsl-logo img { display: block; width: auto; height: 52px; }
@media (max-width: 599px) { .lsl-header .lsl-logo img { height: 44px; } }
.lsl-header .wp-block-navigation a { min-height: 48px; display: inline-flex; align-items: center; color: var(--wp--preset--color--ink); text-decoration: none; }
.lsl-header .wp-block-navigation__responsive-container-open { min-width: 48px; min-height: 48px; justify-content: center; }
.lsl-header .wp-block-button__link { min-height: 44px; display: inline-flex; align-items: center; padding: 8px 18px; white-space: nowrap; }
/* 600~1023px: 워드프레스 기본은 600px 부터 메뉴를 펼쳐 두는데, 로그인 회원은 '내 기록·순위·내 계정·단계'까지 붙어
   900px 안팎에서 두 줄로 넘쳤다 (2026-10-15). 이 구간도 메뉴는 ☰ 버튼으로 접는다. 열린 메뉴(is-menu-open)는 그대로. */
@media (min-width: 600px) and (max-width: 1023px) {
	.lsl-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.lsl-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}
.lsl-header .lsl-exit a { display: inline-flex; align-items: center; min-height: 48px; padding: 0 4px; color: var(--wp--preset--color--muted); }
@media (max-width: 599px) { .lsl-header .lsl-header-cta { display: none; } }
/* 메뉴 정리 (2026-10-16 사용자 요청: 메뉴가 화면에 안 맞음). PC 메뉴는 3개, '내 기록·순위·영상 샘플·추천 상품'은 ☰ 안에만(lsl-nav-m).
   휴대폰에서 머리말 오른쪽 묶음이 화면보다 넓어(375px 에서 404px) 페이지 전체가 옆으로 늘어나 보였다 →
   1023px 아래에서는 '내 기록·순위' 글자 링크를 빼고(☰ 안에 있음) '내 계정'만 남기고, ☰ 를 맨 오른쪽으로. 줄어들 수 있게 min-width:0. */
.lsl-header .wp-block-group { min-width: 0; }
@media (min-width: 1024px) { .lsl-header .lsl-nav-m { display: none; } }
@media (max-width: 1023px) {
	.lsl-header .lsl-login-link.is-my { display: none; }
	.lsl-header .wp-block-navigation { order: 3; }
}
@media (max-width: 599px) {
	.lsl-header .lsl-login-link { font-size: 14px; }
	.lsl-header .lsl-login-link .lsl-tier-tag { font-size: 11px; padding: 1px 6px; }
}

/* 진단·셀프 도구 화면 바탕 (시안: 위쪽 연한 초록) */
.lsl-diagnosis-page { background: linear-gradient(180deg, #f1f9f4 0, #ffffff 420px); }

/* 꼬리말 */
.lsl-footer a { color: inherit; }
.lsl-footer p { margin: 6px 0; }

/* 바닥 (시안 모바일 12 · PC 공통, 2026-10-09) */
.lsl-footer a { color: inherit; text-decoration: none; }
.lsl-footer a:hover { text-decoration: underline; }
.lsl-foot-grid { display: grid; gap: 20px; }
.lsl-foot-logo { display: flex; align-items: center; margin: 0 0 8px; }
.lsl-foot-logo .lsl-logo img { height: 60px; }
.lsl-foot-brand p { margin: 0; }
.lsl-foot-nav { display: grid; gap: 10px; }
.lsl-foot-legal { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 24px 0 0; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, 0.15); }
.lsl-foot-note, .lsl-foot-copy { margin: 12px 0 0; color: #c9d3ce; font-size: var(--lsl-fs-xs); }
.lsl-foot-copy { margin-top: 6px; }
/* 사업자 정보 줄 [lsl_biz] (2026-10-18) */
.lsl-foot-biz { margin: 8px 0 0; color: #c9d3ce; font-size: var(--lsl-fs-xs); line-height: 1.7; word-break: keep-all; }
.lsl-foot-biz a { color: inherit; }
@media (min-width: 780px) {
	.lsl-foot-grid { grid-template-columns: 1fr auto; align-items: start; }
	.lsl-foot-nav { grid-auto-flow: column; gap: 24px; }
}

/* 머리말 로그인 / 내 계정 링크 (2026-10-09) */
.lsl-login-link { font-size: var(--lsl-fs-sm); color: inherit; text-decoration: none; white-space: nowrap; }
.lsl-login-link:hover { color: var(--wp--preset--color--green, #1b7f43); text-decoration: underline; }

/* 페이지 폭 통일 (2026-10-10): 모든 페이지를 머리말·로고와 같은 1080px 폭으로. 글만 있는 문단(약관·개인정보처리방침 등)은
   읽기 좋게 760px 까지만, 왼쪽 끝은 제목과 맞춘다. */
.wp-block-post-content > :where(p, ul, ol, h2, h3, h4, blockquote, table, .wp-block-list) { max-width: 760px; margin-left: 0 !important; }

/* 로고 아래 부제 (2026-10-15, 로고 그림의 초록 띠와 같은 모양: 초록 바탕 · 뒷부분만 노랑).
   옆에 두면 로그인 회원 메뉴(내 기록·내 계정·단계 표시)와 한 줄에 안 들어가서 로고 밑에 붙인다. 1024px 미만은 숨김 */
.lsl-header .lsl-brand { align-items: center; }
.lsl-head-tag { padding: 2px 10px; border-radius: 999px; background: var(--wp--preset--color--green); color: #fff; font-size: 12px; font-weight: 700; white-space: nowrap; }
.lsl-head-tag em, .lsl-foot-tag em { font-style: normal; color: #ffe66d; }
@media (min-width: 1024px) {
	.lsl-header .lsl-brand { flex-direction: column; align-items: flex-start; gap: 3px; }
	.lsl-header .lsl-brand .lsl-logo img { height: 44px; }
}
@media (max-width: 1023px) { .lsl-head-tag { display: none; } }
.lsl-foot-tag { font-weight: 700; word-break: keep-all; }