/* =============================================================================
   Hiking Engine — Frontend Styles
   Covers: trail stats shortcode + map container
   All selectors are prefixed .hiking-engine-* or .hike-* to avoid conflicts.
   ============================================================================= */

/* =============================================================================
   Stats block
   ============================================================================= */

.hiking-engine-stats {
	border: 1px solid #dde0e4;
	border-radius: 8px;
	padding: 16px 20px;
	margin: 20px 0;
	background: #fff;
	font-size: 14px;
	line-height: 1.5;
	box-sizing: border-box;
}

.hike-stats-header {
	margin-bottom: 14px;
}

.hike-stats-mountain {
	display: block;
	font-size: 12px;
	color: #888;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin-bottom: 2px;
}

.hike-stats-name {
	font-size: 20px;
	font-weight: 700;
	margin: 0 0 4px;
	color: #1a1a1a;
	line-height: 1.2;
}

.hike-stats-type {
	display: inline-block;
	font-size: 11px;
	color: #555;
	background: #f0f2f5;
	padding: 1px 7px;
	border-radius: 2px;
}

/* ----- Stats grid ---- */

.hike-stats-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
	gap: 8px;
	margin-bottom: 14px;
}

.hike-stat {
	background: #f7f8fa;
	border-radius: 6px;
	padding: 10px 8px;
	text-align: center;
}

.hike-stat-value {
	display: block;
	font-size: 15px;
	font-weight: 600;
	color: #222;
	line-height: 1.2;
}

.hike-stat-label {
	display: block;
	font-size: 11px;
	color: #999;
	margin-top: 3px;
}

/* ----- Difficulty badge ----- */

.hike-difficulty {
	display: inline-block;
	padding: 1px 7px;
	border-radius: 3px;
	font-size: 12px;
	font-weight: 600;
}

.hike-difficulty-easy     { background: #d4edda; color: #155724; }
.hike-difficulty-moderate { background: #fff3cd; color: #856404; }
.hike-difficulty-hard     { background: #f8d7da; color: #721c24; }
.hike-difficulty-expert   { background: #721c24; color: #fff;    }
.hike-difficulty-unknown  { background: #e9ecef; color: #495057; }

/* ----- Season risk badge ----- */

.hike-season-risk {
	display: inline-block;
	padding: 1px 7px;
	border-radius: 3px;
	font-size: 12px;
	font-weight: 600;
}

.hike-risk-level-low      { background: #d4edda; color: #155724; }
.hike-risk-level-moderate { background: #fff3cd; color: #856404; }
.hike-risk-level-high     { background: #f8d7da; color: #721c24; }
.hike-risk-level-very-high{ background: #721c24; color: #fff;    }
.hike-risk-level-unknown  { background: #e9ecef; color: #495057; }

/* ----- Risk score bar ----- */

.hike-risk-wrap {
	margin: 12px 0;
}

.hike-risk-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 4px;
}

.hike-risk-label {
	font-size: 12px;
	color: #555;
	font-weight: 600;
}

.hike-risk-score {
	font-size: 13px;
	font-weight: 700;
	color: #222;
}

.hike-risk-bar {
	height: 8px;
	background: #e9ecef;
	border-radius: 4px;
	overflow: hidden;
}

.hike-risk-fill {
	height: 100%;
	border-radius: 4px;
	transition: width 0.4s ease;
}

.hike-risk-desc {
	font-size: 12px;
	color: #666;
	margin: 4px 0 0;
}

/* ----- Closure warning ----- */

.hike-closure-warning {
	background: #fff3cd;
	border: 1px solid #ffc107;
	border-left: 4px solid #e0a800;
	padding: 8px 12px;
	border-radius: 4px;
	margin-bottom: 12px;
	font-size: 13px;
	color: #533f03;
}

/* ----- Attribution ----- */

.hike-attribution {
	font-size: 11px;
	color: #aaa;
	margin: 10px 0 0;
	padding-top: 8px;
	border-top: 1px solid #f0f0f0;
}

/* =============================================================================
   Map container
   ============================================================================= */

.hiking-trail-map {
	width: 100%;
	min-height: 300px;
	border-radius: 6px;
	overflow: hidden;
	margin: 20px 0;
	position: relative;
	background: #eae6df; /* OSM default land color, reduces flash */
}

/* Loading placeholder shown via pseudo-element before Leaflet initialises */
.hiking-trail-map::before {
	content: attr(data-loading-text);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #888;
	font-size: 13px;
	pointer-events: none;
	z-index: 0;
}

/* Once Leaflet adds .leaflet-container, the pseudo-element is covered */
.hiking-trail-map .leaflet-container {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}

/* ----- Map status overlays ----- */

.hiking-map-loading,
.hiking-map-error {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: rgba(255, 255, 255, 0.92);
	padding: 10px 18px;
	border-radius: 4px;
	font-size: 13px;
	color: #555;
	z-index: 500;
	white-space: nowrap;
	pointer-events: none;
}

.hiking-map-error {
	color: #c00;
	border: 1px solid #fcc;
}

/* ----- Closed trail overlay ----- */

.hiking-map-closed-banner {
	position: absolute;
	top: 10px;
	left: 50%;
	transform: translateX(-50%);
	background: rgba(220, 53, 69, 0.92);
	color: #fff;
	padding: 6px 14px;
	border-radius: 4px;
	font-size: 12px;
	font-weight: 600;
	z-index: 600;
	pointer-events: none;
	text-align: center;
	max-width: 90%;
}

/* =============================================================================
   Affiliate disclosure box
   ============================================================================= */

.hiking-disclosure {
	background: #f0f7ff;
	border: 1px solid #c3d9f5;
	border-left: 4px solid #3b82f6;
	border-radius: 4px;
	padding: 10px 14px;
	margin: 0 0 20px;
	font-size: 13px;
	line-height: 1.6;
	color: #444;
	box-sizing: border-box;
}

.hiking-disclosure-text {
	margin: 0;
}

/* =============================================================================
   Gear section wrapper (he-gear-section) + Gear box
   ============================================================================= */

/* Outer section block (contains h2 + gear box) */
.he-gear-section {
	margin: 40px 0 32px;
	background: #f8faf9;
	border: 1px solid #d4ead9;
	border-top: 4px solid #2d6a4f;
	border-radius: 0 0 10px 10px;
	padding: 24px 24px 20px;
	box-sizing: border-box;
}

.he-gear-section h2 {
	font-size: 1.15rem;
	font-weight: 700;
	color: #1b4332;
	margin: 0 0 16px;
	padding: 0;
	border: none;
}

.hiking-gear-box {
	margin: 0;
}

/* ----- Section header ----- */

.hiking-gear-header {
	background: linear-gradient(135deg, #1a3a2a 0%, #2d5a3d 100%);
	border-radius: 8px 8px 0 0;
	padding: 14px 18px 12px;
	margin-bottom: 2px;
}

.hiking-gear-title {
	font-size: 15px;
	font-weight: 700;
	color: #fff;
	margin: 0 0 4px;
	line-height: 1.4;
}

.hiking-gear-subtitle {
	font-size: 12px;
	color: rgba(255,255,255,0.75);
	margin: 0;
}

/* ----- Individual gear item ----- */

.hiking-gear-item {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 16px;
	border: 1px solid #dde0e4;
	border-left-width: 4px;
	border-radius: 0;
	margin-bottom: 0;
	border-top: none;
	background: #fff;
	box-sizing: border-box;
}

.hiking-gear-item:first-of-type {
	border-top: 1px solid #dde0e4;
}

.hiking-gear-item:last-of-type {
	border-radius: 0 0 6px 6px;
}

/* ----- Rank badge ----- */

.hiking-gear-rank {
	flex-shrink: 0;
	width: 36px;
	height: 36px;
	background: #e8213c;
	color: #fff;
	font-size: 11px;
	font-weight: 800;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 2px;
}

.hiking-gear-item:nth-child(2) .hiking-gear-rank { background: #e8213c; }
.hiking-gear-item:nth-child(3) .hiking-gear-rank { background: #ff6b35; }
.hiking-gear-item:nth-child(4) .hiking-gear-rank { background: #f5a623; color: #333; }
.hiking-gear-item:nth-child(5) .hiking-gear-rank { background: #7c8e6b; }
.hiking-gear-item:nth-child(6) .hiking-gear-rank { background: #adb5bd; color: #333; }

/* ----- Hook copy ----- */

.hiking-gear-hook {
	display: block;
	font-size: 11px;
	font-weight: 700;
	color: #e8213c;
	margin-bottom: 3px;
	line-height: 1.4;
}

.hiking-gear-item-info {
	flex: 1;
	min-width: 0;
}

.hiking-gear-name {
	display: block;
	font-size: 15px;
	color: #1a1a1a;
	margin: 2px 0 4px;
	line-height: 1.3;
}

.hiking-gear-reason {
	font-size: 13px;
	color: #555;
	margin: 0;
	line-height: 1.5;
}

.hiking-gear-action {
	flex-shrink: 0;
	align-self: center;
}

/* ── 기어박스 모바일 반응형 ── */
@media (max-width: 480px) {
	.hiking-gear-item {
		flex-direction: column;
		gap: 10px;
	}

	.hiking-gear-action {
		width: 100%;
	}

	.hiking-gear-action a {
		display: block;
		text-align: center;
		width: 100%;
		box-sizing: border-box;
	}

	.hike-stats-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.he-gear-section {
		padding: 16px 14px 14px;
		margin: 28px 0 24px;
	}
}

/* ----- Affiliate button ----- */

.hiking-gear-btn {
	display: inline-block;
	background: #e8213c; /* Coupang brand red */
	color: #fff;
	padding: 7px 14px;
	border-radius: 4px;
	font-size: 12px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	transition: background 0.15s;
}

.hiking-gear-btn:hover,
.hiking-gear-btn:focus {
	background: #c01b32;
	color: #fff;
	text-decoration: none;
}

/* =============================================================================
   Mid-content gear carousel (TOP 1~5 auto-slide)
   ============================================================================= */

.he-gear-carousel {
	border: 3px solid #e8213c;
	border-radius: 12px;
	overflow: hidden;
	margin: 36px 0;
	background: #fff;
	box-shadow: 0 4px 20px rgba(232,33,60,0.18);
}

/* ── 최상단 주목 바 ── */
.he-gear-carousel__alert {
	background: #e8213c;
	color: #fff;
	font-size: 13px;
	font-weight: 800;
	text-align: center;
	padding: 8px 16px;
	letter-spacing: 0.01em;
	animation: he-alert-pulse 2.4s ease-in-out infinite;
}

@keyframes he-alert-pulse {
	0%, 100% { opacity: 1; }
	50%       { opacity: 0.82; }
}

/* ── 헤더 (타이틀 + 도트) ── */
.he-gear-carousel__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: #1a1a1a;
	padding: 10px 18px;
}

.he-gear-carousel__title {
	font-size: 13px;
	font-weight: 700;
	color: #fff;
	margin: 0;
	letter-spacing: 0.01em;
}

.he-gear-carousel__dots {
	display: flex;
	gap: 6px;
}

.he-gear-carousel__dot {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	border: none;
	background: rgba(255,255,255,0.3);
	cursor: pointer;
	padding: 0;
	transition: background 0.2s, transform 0.2s;
}

.he-gear-carousel__dot.is-active {
	background: #e8213c;
	transform: scale(1.25);
}

/* ── 슬라이드 뷰포트 ── */
.he-gear-carousel__viewport {
	overflow: hidden;
}

.he-gear-carousel__track {
	display: flex;
	transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
	will-change: transform;
}

/* ── 개별 슬라이드 ── */
.he-gear-carousel__item {
	flex: 0 0 100%;
	width: 100%;
	padding: 20px 22px 22px;
	box-sizing: border-box;
	background: #fff;
}

/* 순위 + 베스트셀러 뱃지 행 */
.he-gear-carousel__slide-top {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 10px;
}

.he-gear-carousel__rank-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #e8213c;
	color: #fff;
	font-size: 12px;
	font-weight: 900;
	border-radius: 6px;
	padding: 3px 10px;
	letter-spacing: 0.02em;
}

.he-gear-carousel__bestseller {
	font-size: 11px;
	font-weight: 700;
	color: #e8213c;
	background: #ffeaed;
	border: 1px solid #f5c6cb;
	border-radius: 20px;
	padding: 2px 10px;
}

/* 후킹 멘트 */
.he-gear-carousel__hook {
	font-size: 15px;
	font-weight: 800;
	color: #1a1a1a;
	margin: 0 0 6px;
	line-height: 1.4;
	letter-spacing: -0.02em;
}

/* 상품명 */
.he-gear-carousel__name {
	display: block;
	font-size: 22px;
	font-weight: 900;
	color: #e8213c;
	margin: 0 0 8px;
	line-height: 1.2;
	letter-spacing: -0.03em;
}

/* 이유 */
.he-gear-carousel__reason {
	font-size: 13px;
	color: #666;
	margin: 0 0 16px;
	line-height: 1.6;
}

/* CTA 버튼 — 전폭, 크고 굵게 */
.he-carousel-btn {
	display: block;
	width: 100%;
	background: #e8213c;
	color: #fff;
	padding: 14px 20px;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 800;
	text-decoration: none;
	text-align: center;
	box-sizing: border-box;
	letter-spacing: 0.01em;
	transition: background 0.15s, transform 0.1s;
	animation: he-btn-glow 2s ease-in-out infinite;
}

@keyframes he-btn-glow {
	0%, 100% { box-shadow: 0 3px 12px rgba(232,33,60,0.35); }
	50%       { box-shadow: 0 3px 22px rgba(232,33,60,0.6); }
}

.he-carousel-btn:hover,
.he-carousel-btn:focus {
	background: #c01b32;
	color: #fff;
	text-decoration: none;
	transform: translateY(-1px);
}

@media (max-width: 480px) {
	.he-gear-carousel__item {
		padding: 16px;
	}

	.he-gear-carousel__hook {
		font-size: 14px;
	}

	.he-gear-carousel__name {
		font-size: 20px;
	}

	.he-carousel-btn {
		font-size: 14px;
		padding: 13px 16px;
	}
}

/* ----- Priority badge ----- */

.hiking-gear-priority-badge {
	display: inline-block;
	font-size: 10px;
	font-weight: 700;
	padding: 1px 5px;
	border-radius: 2px;
	margin-bottom: 3px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

/* Left-border accent and badge colours per priority */

.hiking-gear-item.hiking-gear-priority-essential {
	border-left-color: #28a745;
}
.hiking-gear-priority-badge.hiking-gear-priority-essential {
	background: #d4edda;
	color: #155724;
}

.hiking-gear-item.hiking-gear-priority-recommended {
	border-left-color: #007bff;
}
.hiking-gear-priority-badge.hiking-gear-priority-recommended {
	background: #cce5ff;
	color: #004085;
}

.hiking-gear-item.hiking-gear-priority-optional {
	border-left-color: #adb5bd;
}
.hiking-gear-priority-badge.hiking-gear-priority-optional {
	background: #e9ecef;
	color: #495057;
}

/* ----- Affiliate disclosure ----- */

.hiking-gear-disclosure {
	font-size: 11px;
	color: #aaa;
	margin: 10px 0 0;
	padding-top: 8px;
	border-top: 1px solid #f0f0f0;
	line-height: 1.6;
}

/* =============================================================================
   Shortcode error (admin-only)
   ============================================================================= */

.hiking-engine-shortcode-error {
	background: #fff0f0;
	border: 1px solid #fcc;
	padding: 6px 10px;
	border-radius: 3px;
	font-size: 12px;
	font-family: monospace;
}

/* =============================================================================
   Map wrapper — lazy skeleton + load button
   Replaces the old bare .hiking-trail-map approach.
   The wrapper retains the height set by the shortcode (style="height:…").
   ============================================================================= */

.hiking-trail-map-wrap {
	position: relative;
	width: 100%;
	margin: 20px 0;
	border-radius: 6px;
	overflow: hidden;
	background: #eae6df; /* OSM default land colour — reduces flash on activate */
	box-sizing: border-box;
}

/* ----- Skeleton tile ----- */

.hiking-map-skeleton {
	position: absolute;
	inset: 0;
	background: #e8e3db;
	overflow: hidden;
}

/* Shimmer sweep */
@keyframes hiking-shimmer {
	0%   { transform: translateX(-100%); }
	100% { transform: translateX(100%); }
}

.hiking-map-skeleton__shimmer {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		90deg,
		transparent 0%,
		rgba(255, 255, 255, 0.38) 50%,
		transparent 100%
	);
	animation: hiking-shimmer 1.6s ease-in-out infinite;
}

/* ----- Placeholder bar (icon + hint text + button) ----- */

.hiking-map-placeholder-bar {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	z-index: 10;
	text-align: center;
	/* Prevent text selection while dragging */
	user-select: none;
}

.hiking-map-placeholder-icon {
	font-size: 34px;
	line-height: 1;
	filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.22));
}

.hiking-map-placeholder-text {
	font-size: 13px;
	color: #555;
	background: rgba(255, 255, 255, 0.78);
	padding: 3px 12px;
	border-radius: 12px;
	white-space: nowrap;
	backdrop-filter: blur(3px);
}

.hiking-map-load-btn {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 9px 22px;
	background: #2d6a4f;
	color: #fff;
	border: none;
	border-radius: 7px;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.28);
	transition: background 0.15s, transform 0.1s;
}

.hiking-map-load-btn:hover,
.hiking-map-load-btn:focus {
	background: #1b4332;
	transform: translateY(-1px);
	outline: 2px solid #52b788;
	outline-offset: 2px;
}

/* ----- Transitional loading state (after click, before Leaflet arrives) ----- */

.hiking-trail-map-wrap--loading::after {
	content: '지도 로드 중…';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 13px;
	color: #888;
	pointer-events: none;
}

/* ==========================================================================
   Portal Shortcodes — [hiking_portal_hero], [hiking_popular_courses],
   [hiking_seasonal_picks]
   ========================================================================== */

/* ── Hero section ── */

.he-portal-hero {
	text-align: center;
	padding: 48px 16px 40px;
	background: linear-gradient(160deg, #f0f9f0 0%, #e8f5e9 100%);
	border-radius: 12px;
	margin-bottom: 40px;
}

.he-portal-hero__title {
	font-size: clamp(1.6rem, 4vw, 2.4rem);
	font-weight: 800;
	margin: 0 0 12px;
	color: #1b4332;
	line-height: 1.2;
}

.he-portal-hero__desc {
	font-size: 1rem;
	color: #4a6b55;
	margin: 0 0 32px;
	line-height: 1.6;
}

/* ── Quick-access cards row ── */

.he-portal-quick-cards {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	justify-content: center;
	max-width: 680px;
	margin: 0 auto;
}

.he-portal-quick-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	padding: 18px 24px;
	background: #fff;
	border-radius: 10px;
	text-decoration: none;
	color: inherit;
	min-width: 140px;
	flex: 1 1 140px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .06);
	transition: transform .15s, box-shadow .15s;
	border: 2px solid #b7e4c7;
}

.he-portal-quick-card:hover,
.he-portal-quick-card:focus {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(0, 0, 0, .10);
	border-color: #2d6a4f;
	text-decoration: none;
}

.he-portal-quick-card--trail   { border-color: #b7e4c7; }
.he-portal-quick-card--course  { border-color: #95d5b2; }
.he-portal-quick-card--mountain { border-color: #74c69d; }

.he-portal-quick-card__icon  { font-size: 1.8rem; line-height: 1; }
.he-portal-quick-card__label { font-size: .95rem; font-weight: 700; color: #1b4332; }
.he-portal-quick-card__sub   { font-size: .78rem; color: #888; }

/* ── Portal card grid ── */

.he-portal-card-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 20px;
	margin-bottom: 12px;
}

.he-portal-card {
	background: #fff;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .06);
	transition: box-shadow .15s, transform .15s;
	display: flex;
	flex-direction: column;
}

.he-portal-card:hover {
	box-shadow: 0 6px 20px rgba(0, 0, 0, .10);
	transform: translateY(-2px);
}

.he-portal-card__thumb {
	display: block;
	position: relative;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: #e8f5e9;
	text-decoration: none;
}

.he-portal-card__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.he-portal-card__emoji {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	font-size: 2.5rem;
}

.he-portal-card__badge {
	position: absolute;
	top: 8px;
	left: 8px;
	font-size: 11px;
	font-weight: 700;
	padding: 2px 7px;
	border-radius: 4px;
	color: #fff;
}

.he-portal-card__badge--easy { background: #2d9e5f; }
.he-portal-card__badge--mid  { background: #e88c2a; }
.he-portal-card__badge--hard { background: #d9534f; }

.he-portal-card__body {
	padding: 14px 16px 16px;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.he-portal-card__mountain {
	font-size: 12px;
	color: #888;
	margin: 0 0 4px;
}

.he-portal-card__title {
	font-size: .95rem;
	font-weight: 700;
	margin: 0 0 8px;
	line-height: 1.3;
}

.he-portal-card__title a {
	color: #1b4332;
	text-decoration: none;
}

.he-portal-card__title a:hover { text-decoration: underline; }

.he-portal-card__meta {
	font-size: 12px;
	color: #666;
	display: flex;
	gap: 10px;
	margin-bottom: 12px;
}

.he-portal-card__cta {
	margin-top: auto;
	font-size: 13px;
	font-weight: 600;
	color: #2d6a4f;
	text-decoration: none;
}

.he-portal-card__cta:hover { text-decoration: underline; }

/* ── Section "더보기" link ── */

.he-portal-section-more {
	text-align: right;
	margin: 4px 0 32px;
	font-size: 13px;
}

.he-portal-section-more a {
	color: #2d6a4f;
	font-weight: 600;
	text-decoration: none;
}

.he-portal-section-more a:hover { text-decoration: underline; }

/* ── Seasonal label pill ── */

.he-portal-seasonal-label {
	font-size: 1rem;
	font-weight: 700;
	color: #2d6a4f;
	margin: 0 0 14px;
	padding: 6px 14px;
	background: #e8f5e9;
	border-radius: 20px;
	display: inline-block;
}

/* ── CTA link buttons (코스 찾기 / 명산 찾기 sections) ── */

.he-portal-cta-link {
	display: inline-block;
	padding: 10px 22px;
	background: #2d6a4f;
	color: #fff !important;
	border-radius: 6px;
	font-weight: 600;
	font-size: .9rem;
	text-decoration: none !important;
	transition: background .15s;
}

.he-portal-cta-link:hover { background: #1b4332; }

/* ── Safety note ── */

.he-portal-safety-note {
	margin-top: 36px;
	padding: 14px 18px;
	background: #fffbf0;
	border-left: 4px solid #f59e0b;
	border-radius: 0 6px 6px 0;
	font-size: .88rem;
	color: #555;
	line-height: 1.6;
}

.he-portal-safety-note a { color: #b45309; }

/* ── Empty state ── */

.he-portal-empty {
	color: #888;
	font-style: italic;
	padding: 24px 0;
}

/* ── Responsive ── */

@media (max-width: 600px) {
	.he-portal-hero        { padding: 32px 16px 28px; }
	.he-portal-quick-cards { gap: 8px; }
	.he-portal-quick-card  { min-width: 110px; padding: 14px 12px; }
	.he-portal-card-grid   { grid-template-columns: 1fr 1fr; gap: 12px; }
}

@media (max-width: 380px) {
	.he-portal-card-grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Course Finder — [hiking_course_finder]
   ========================================================================== */

/* ── Wrapper ── */

.he-finder {
	margin: 24px 0 40px;
}

/* ── Filter form ── */

.he-finder__form {
	background: #f8faf9;
	border: 1px solid #d4ead9;
	border-radius: 10px;
	padding: 20px 20px 16px;
	margin-bottom: 24px;
}

.he-finder__filter-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
	gap: 10px 14px;
	margin-bottom: 14px;
}

.he-finder__filter-group {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.he-finder__filter-group--keyword {
	grid-column: span 2;
}

.he-finder__label {
	font-size: 11px;
	font-weight: 700;
	color: #5a7a65;
	text-transform: uppercase;
	letter-spacing: .05em;
}

/* Custom select arrow (SVG, no image request) */
.he-finder__select {
	padding: 8px 28px 8px 10px;
	border: 1px solid #cde5d8;
	border-radius: 6px;
	font-size: 13px;
	color: #333;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23666'/%3E%3C/svg%3E") no-repeat right 10px center;
	appearance: none;
	-webkit-appearance: none;
	width: 100%;
	cursor: pointer;
	transition: border-color .15s;
}

.he-finder__select:focus {
	outline: 2px solid #2d6a4f;
	outline-offset: 1px;
	border-color: #2d6a4f;
}

.he-finder__input {
	padding: 8px 10px;
	border: 1px solid #cde5d8;
	border-radius: 6px;
	font-size: 13px;
	color: #333;
	background: #fff;
	width: 100%;
	transition: border-color .15s;
	box-sizing: border-box;
}

.he-finder__input:focus {
	outline: 2px solid #2d6a4f;
	outline-offset: 1px;
	border-color: #2d6a4f;
}

.he-finder__form-footer {
	display: flex;
	align-items: center;
	gap: 14px;
	padding-top: 4px;
}

.he-finder__submit {
	padding: 9px 20px;
	background: #2d6a4f;
	color: #fff;
	border: none;
	border-radius: 6px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: background .15s;
}

.he-finder__submit:hover,
.he-finder__submit:focus {
	background: #1b4332;
	outline: 2px solid #52b788;
	outline-offset: 2px;
}

.he-finder__reset {
	font-size: 13px;
	color: #888;
	text-decoration: none;
}

.he-finder__reset:hover {
	color: #333;
	text-decoration: underline;
}

/* ── Results header ── */

.he-finder__results-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 16px;
	padding-bottom: 10px;
	border-bottom: 1px solid #e4ede8;
	font-size: 13px;
}

.he-finder__count {
	font-weight: 700;
	color: #333;
}

.he-finder__per-page {
	color: #999;
}

/* ── Card grid (inherits .he-portal-card-grid layout) ── */

.he-finder__card-grid {
	margin-bottom: 8px;
}

/* Risk hint badge inside finder cards */

.he-finder-card__risk {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	padding: 2px 6px;
	border-radius: 4px;
	color: #fff;
	line-height: 1.4;
}

.he-finder-card__risk--safe   { background: #2d9e5f; }
.he-finder-card__risk--low    { background: #52b788; }
.he-finder-card__risk--mid    { background: #e88c2a; }
.he-finder-card__risk--high   { background: #d9534f; }
.he-finder-card__risk--closed { background: #777; }

/* ── No results ── */

.he-finder__no-results {
	text-align: center;
	padding: 52px 16px;
	color: #888;
}

.he-finder__no-results p {
	margin: 0 0 16px;
	font-size: .95rem;
}

.he-finder__reset-btn {
	display: inline-block;
	padding: 10px 22px;
	background: #2d6a4f;
	color: #fff;
	border-radius: 6px;
	text-decoration: none;
	font-size: 14px;
	font-weight: 600;
	transition: background .15s;
}

.he-finder__reset-btn:hover { background: #1b4332; }

/* ── Pagination ── */

.he-finder__pagination {
	margin-top: 36px;
	display: flex;
	justify-content: center;
}

.he-finder__pagination .page-numbers {
	display: flex;
	list-style: none;
	gap: 6px;
	padding: 0;
	margin: 0;
	flex-wrap: wrap;
	justify-content: center;
}

.he-finder__pagination .page-numbers li > * {
	display: block;
	padding: 7px 13px;
	border: 1px solid #cde5d8;
	border-radius: 5px;
	color: #2d6a4f;
	text-decoration: none;
	font-size: 14px;
	font-weight: 500;
	line-height: 1;
	transition: background .12s, color .12s;
}

.he-finder__pagination .page-numbers li > .current {
	background: #2d6a4f;
	color: #fff;
	border-color: #2d6a4f;
}

.he-finder__pagination .page-numbers li > a:hover {
	background: #e8f5e9;
	border-color: #74c69d;
}

.he-finder__pagination .page-numbers li > .dots {
	border-color: transparent;
	color: #aaa;
	cursor: default;
}

/* ── Responsive ── */

@media (max-width: 640px) {
	.he-finder__filter-grid       { grid-template-columns: 1fr 1fr; gap: 8px 10px; }
	.he-finder__filter-group--keyword { grid-column: 1 / -1; }
	.he-finder__results-header    { flex-direction: column; align-items: flex-start; gap: 6px; }
}

@media (max-width: 400px) {
	.he-finder__filter-grid { grid-template-columns: 1fr; }
	.he-finder__filter-group--keyword { grid-column: 1; }
}

/* ==========================================================================
   Mountain Finder — [hiking_mountain_finder]
   Extends the shared .he-finder and .he-portal-card styles with mountain-
   specific elements (region tag, elevation tag, course count, popular badge).
   ========================================================================== */

/* ── Card grid — fewer columns for taller mountain cards ── */

.he-mfinder__card-grid {
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
}

/* ── Region + elevation tags ── */

.he-mountain-card__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	margin-bottom: 6px;
}

.he-mountain-card__region {
	font-size: 11px;
	padding: 2px 7px;
	background: #e8f5e9;
	color: #2d6a4f;
	border-radius: 4px;
	font-weight: 600;
	white-space: nowrap;
}

.he-mountain-card__elevation {
	font-size: 11px;
	padding: 2px 7px;
	background: #f0f4f8;
	color: #4a5568;
	border-radius: 4px;
	font-weight: 600;
	white-space: nowrap;
}

/* ── "인기" badge (reuses .he-portal-card__badge position/size rules) ── */

.he-mountain-card__badge--popular {
	background: #2d6a4f;
}

/* ── Course count line ── */

.he-mountain-card__count {
	font-size: 12px;
	color: #666;
	margin: 0 0 10px;
}

/* ── Responsive ── */

@media (max-width: 480px) {
	.he-mfinder__card-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
}

@media (max-width: 320px) {
	.he-mfinder__card-grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Popular page notices
   ========================================================================== */

/* Admin-only fallback warning (shown when no popularity scores in DB) */
.he-popular-fallback-notice {
	background: #fff8e1;
	border-left: 4px solid #f59e0b;
	border-radius: 4px;
	color: #78350f;
	font-size: 0.875rem;
	line-height: 1.5;
	margin: 0 0 20px;
	padding: 10px 14px;
}

/* User-friendly indexing note (auto_index_topN mode) */
.he-popular-index-note {
	color: #6b7280;
	font-size: 0.8125rem;
	margin: 0 0 16px;
}

/* ==========================================================================
   Season page (/season/)
   ========================================================================== */

/* Intro wrapper */
.he-season-intro {
	margin-bottom: 28px;
}
.he-season-intro h1 {
	margin-bottom: 8px;
}

/* ── Tab bar ── */
.he-season-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 36px;
	padding-bottom: 14px;
	border-bottom: 2px solid #e5e7eb;
}

.he-season-tab {
	display: inline-flex;
	align-items: center;
	padding: 6px 18px;
	border-radius: 20px;
	font-size: 0.9rem;
	font-weight: 500;
	color: #4b5563;
	text-decoration: none;
	background: #f3f4f6;
	border: 1px solid transparent;
	transition: background 0.15s, border-color 0.15s, color 0.15s;
}

.he-season-tab:hover {
	background: #e5e7eb;
	color: #111827;
	text-decoration: none;
}

.he-season-tab.is-current {
	background: #1e3a5f;
	color: #fff;
	border-color: #1e3a5f;
	font-weight: 600;
}

/* ── Season sections ── */
.he-season-section {
	margin-bottom: 56px;
	padding-top: 20px;
	border-top: 1px solid #e5e7eb;
	scroll-margin-top: 80px; /* clearance for sticky header */
}

.he-season-section.is-current {
	background: #f0f7ff;
	border-top: 3px solid #1e3a5f;
	border-radius: 0 0 8px 8px;
	padding: 20px 20px 8px;
	margin-left: -20px;
	margin-right: -20px;
}

/* Section heading row */
.he-season-section__header {
	margin-bottom: 12px;
}

.he-season-section__title {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	font-size: 1.375rem;
	font-weight: 700;
	margin: 0 0 8px;
	color: #111827;
}

/* "현재 시즌" badge */
.he-season-badge--current {
	display: inline-block;
	font-size: 0.75rem;
	font-weight: 600;
	padding: 2px 10px;
	border-radius: 12px;
	background: #1e3a5f;
	color: #fff;
	letter-spacing: 0.02em;
	vertical-align: middle;
}

/* ── Safety warnings ── */
.he-season-safety-warn {
	border-left: 4px solid #6b7280;
	background: #f9fafb;
	border-radius: 0 4px 4px 0;
	padding: 9px 14px;
	font-size: 0.8125rem;
	line-height: 1.6;
	color: #374151;
	margin-bottom: 18px;
}

.he-season-safety-warn--winter {
	border-left-color: #3b82f6;
	background: #eff6ff;
	color: #1e40af;
}

.he-season-safety-warn--spring {
	border-left-color: #22c55e;
	background: #f0fdf4;
	color: #15803d;
}

.he-season-safety-warn--summer {
	border-left-color: #f97316;
	background: #fff7ed;
	color: #9a3412;
}

.he-season-safety-warn--monsoon {
	border-left-color: #6366f1;
	background: #eef2ff;
	color: #3730a3;
}

.he-season-safety-warn--autumn {
	border-left-color: #d97706;
	background: #fffbeb;
	color: #92400e;
}

/* ── Responsive ── */
@media (max-width: 600px) {
	.he-season-section.is-current {
		margin-left: -12px;
		margin-right: -12px;
		padding-left: 12px;
		padding-right: 12px;
	}
}

/* ==========================================================================
   Trust pages (safety / data-sources / affiliate-disclosure / privacy /
   contact) — shared components
   ========================================================================== */

/* ── Info / warning banners ── */
.he-trust-notice {
	border-left: 4px solid #6b7280;
	background: #f9fafb;
	border-radius: 0 4px 4px 0;
	padding: 12px 16px;
	font-size: 0.875rem;
	line-height: 1.6;
	color: #374151;
	margin: 0 0 28px;
}

.he-trust-notice--warning {
	border-left-color: #f59e0b;
	background: #fffbeb;
	color: #78350f;
}

.he-trust-notice--affiliate {
	border-left-color: #3b82f6;
	background: #eff6ff;
	color: #1e3a8a;
}

/* ── Data table ── */
.he-trust-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.875rem;
	margin: 0 0 24px;
}

.he-trust-table th,
.he-trust-table td {
	text-align: left;
	padding: 9px 12px;
	border: 1px solid #e5e7eb;
	vertical-align: top;
}

.he-trust-table thead th {
	background: #f3f4f6;
	font-weight: 600;
	color: #111827;
}

.he-trust-table tbody tr:nth-child(even) td {
	background: #fafafa;
}

/* ── Privacy policy review note ── */
.he-review-note {
	border-left: 4px solid #f59e0b;
	background: #fffbeb;
	border-radius: 0 4px 4px 0;
	padding: 9px 14px;
	font-size: 0.8125rem;
	line-height: 1.55;
	color: #78350f;
	margin: 0 0 16px;
}

/* ── Contact form block ── */
.he-contact-form {
	background: #f9fafb;
	border: 1px solid #e5e7eb;
	border-radius: 6px;
	padding: 20px 24px;
	margin: 0 0 28px;
}

.he-contact-email-link {
	display: inline-block;
	font-size: 1.125rem;
	font-weight: 600;
	color: #1e3a5f;
	text-decoration: none;
	word-break: break-all;
}

.he-contact-email-link:hover {
	text-decoration: underline;
}

.he-contact-reply-note {
	font-size: 0.875rem;
	color: #6b7280;
	margin: 6px 0 12px;
}

.he-contact-form-hint {
	font-size: 0.8125rem;
	color: #9ca3af;
	margin: 0;
	border-top: 1px solid #e5e7eb;
	padding-top: 10px;
}

/* ── Responsive ── */
@media (max-width: 640px) {
	.he-trust-table {
		display: block;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
	.he-contact-form {
		padding: 14px 16px;
	}
}

/* =============================================================================
   HTML Sitemap  [hiking_html_sitemap]
   ============================================================================= */

.he-sitemap__refresh-badge {
	background: #fef3c7;
	border: 1px solid #f59e0b;
	border-radius: 4px;
	padding: 6px 12px;
	font-size: 0.8125rem;
	color: #92400e;
	margin: 0 0 16px;
}

.he-sitemap__summary {
	font-size: 0.9375rem;
	color: #4b5563;
	margin: 0 0 24px;
}

.he-sitemap__empty {
	color: #6b7280;
	font-style: italic;
}

.he-sitemap__empty-admin {
	background: #fffbeb;
	border: 1px dashed #f59e0b;
	border-radius: 6px;
	padding: 14px 18px;
	font-size: 0.875rem;
	color: #78350f;
	line-height: 1.6;
}

.he-sitemap__empty-admin code {
	background: #fde68a;
	border-radius: 3px;
	padding: 1px 5px;
	font-size: 0.8125rem;
}

/* Section block */
.he-sitemap__section {
	margin: 0 0 40px;
	border-top: 2px solid #1e3a5f;
	padding-top: 16px;
}

.he-sitemap__section-title {
	font-size: 1.25rem;
	font-weight: 700;
	color: #1e3a5f;
	margin: 0 0 6px;
	display: flex;
	align-items: baseline;
	gap: 6px;
}

.he-sitemap__count {
	font-size: 0.875rem;
	font-weight: 400;
	color: #6b7280;
}

.he-sitemap__group-meta {
	font-size: 0.8125rem;
	color: #6b7280;
	margin: 0 0 14px;
}

/* Group (region / mountain) */
.he-sitemap__group {
	margin: 0 0 20px;
}

.he-sitemap__group-title {
	font-size: 0.9375rem;
	font-weight: 600;
	color: #374151;
	margin: 0 0 6px;
	padding-bottom: 3px;
	border-bottom: 1px solid #e5e7eb;
}

/* List items */
.he-sitemap__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.he-sitemap__list--columns {
	column-count: 3;
	column-gap: 20px;
}

@media (max-width: 900px) {
	.he-sitemap__list--columns {
		column-count: 2;
	}
}

@media (max-width: 600px) {
	.he-sitemap__list--columns {
		column-count: 1;
	}
}

.he-sitemap__item {
	display: flex;
	align-items: baseline;
	gap: 8px;
	padding: 3px 0;
	break-inside: avoid;
}

.he-sitemap__link {
	font-size: 0.9375rem;
	color: #1e40af;
	text-decoration: none;
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.he-sitemap__link:hover {
	text-decoration: underline;
	color: #1d4ed8;
}

.he-sitemap__date {
	flex: 0 0 auto;
	font-size: 0.75rem;
	color: #9ca3af;
	white-space: nowrap;
}