/* ==========================================================================
   [DOWNLOAD] · [HISTORY] 모양 (inc/download.php · inc/history.php)
   글 화면에서 두 숏코드가 있을 때만 불러온다.
   색은 테마 변수(v2: --color-primary 등)를 쓰고, 없으면 기본값.
   ========================================================================== */

/* ---- 다운로드 버튼 ---- */
.kh-download-buttons { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.5rem; }
/* 크기는 v2 앱 페이지의 다운로드 버튼(.btn)과 같다 — 높이 2.5rem · 글자 12.8px · 보통 굵기 */
.kh-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	height: 2.5rem;
	padding: 0 1rem;
	border: 0;
	border-radius: var(--radius-field, 0.25rem);
	background: var(--color-primary, #0088cc);
	color: var(--color-primary-content, #fff) !important;
	font-size: 0.8rem;
	font-weight: 400;
	line-height: 1.5;
	white-space: nowrap;
	text-decoration: none !important;
	cursor: pointer;
}
.kh-btn:hover { filter: brightness(1.1); }

/* nosetup — 버튼 + 오른쪽 ▾ 로 설치/무설치 고르기 */
.kh-split { position: relative; display: inline-flex; }
.kh-split > .kh-btn { border-start-end-radius: 0; border-end-end-radius: 0; }
.kh-split-menu > summary {
	padding-inline: 0.75rem;
	border-start-start-radius: 0;
	border-end-start-radius: 0;
	border-left: 1px solid rgb(255 255 255 / 0.35);
	list-style: none;
}
.kh-split-menu > summary::-webkit-details-marker { display: none; }
.kh-split-menu > summary::after { content: "▾"; }
.kh-split-menu > ul {
	position: absolute;
	top: calc(100% + 0.25rem);
	right: 0;
	z-index: 10;
	min-width: 10rem;
	margin: 0 !important;
	padding: 0.375rem 0 !important;
	border: 1px solid var(--color-base-300, #ddd);
	border-radius: var(--radius-box, 0.25rem);
	background: var(--color-base-100, #fff);
	box-shadow: 0 8px 24px -8px rgb(0 0 0 / 0.25);
	list-style: none !important;
}
.kh-split-menu > ul li { margin: 0 !important; }
.kh-split-menu > ul a {
	display: block;
	padding: 0.375rem 1rem;
	color: var(--color-base-content, #222) !important;
	text-decoration: none !important;
}
.kh-split-menu > ul a:hover { background: var(--color-base-200, #f5f5f5); }

/* ---- 업데이트 · 히스토리 ---- */
.kh-update ul,
.kh-history > ul { list-style: none !important; padding-left: 0 !important; }
.kh-update li + li { margin-top: 0.25em; }
.kh-update li:not(:first-child)::before,
.kh-history ul ul li::before { content: "- "; }
.kh-history > ul > li + li { margin-top: 0.75em; }
.kh-history ul ul { list-style: none !important; padding-left: 0 !important; margin-top: 0.25em !important; }

/* 최신 판 — 첫 굵은 글씨 문단 강조 (옛 사이트의 .text-update) */
[data-kh-lead] { text-align: center; margin-bottom: 2.25rem !important; color: var(--color-base-content, #222529); }
[data-kh-lead] > strong::before { content: "✨ "; }
[data-kh-lead] > strong::after { content: " " attr(data-kh-lead) " ✨"; }   /* 문구는 inc/history.php (언어별) */
@media (width < 48rem) {
	[data-kh-lead] > strong::after { content: " ✨"; }
}

/* 옛 판 — 새 글 안내 */
.kh-notice {
	margin: 0 0 1.5rem;
	padding: 0.625rem 1rem;
	border: 1px solid #f1aeb5;
	border-radius: var(--radius-box, 0.25rem);
	background: #f8d7da;
	color: #58151c;
	text-align: center;
}
.kh-notice a { color: inherit !important; font-weight: 700; }
html[data-theme="kilho-dark"] .kh-notice { border-color: #842029; background: #2c0b0e; color: #ea868f; }

/* ---- 앱 스토어 ([APPSTORE]) — 아이콘 + 스토어 이름 + 기기, 가로로 가운데 ---- */
.kh-appstore { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.75rem; margin: 1.5rem 0; }
.kh-store {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.75rem;
	width: 9rem;
	padding: 1.25rem 0.75rem 1rem;
	border: 1px solid var(--color-base-300, #ddd);
	border-radius: var(--radius-box, 0.25rem);
	background: var(--color-base-100, #fff);
	color: var(--color-body, #777) !important;
	font-size: 0.8rem;
	line-height: 1.5;
	text-align: center;
	text-decoration: none !important;
}
.kh-store:hover { border-color: var(--color-primary, #0088cc); }
.kh-store img { width: 64px; height: 64px; object-fit: contain; }
.kh-store strong { color: var(--color-base-content, #222); font-size: 0.9rem; }
