/*!
 * HCJM Desktop — WordPress native menu (wp_menu 전용, .hcjm-nav-menu 와 분리)
 */

@media (min-width: 1024px) {
	/* 서브메뉴가 헤더 밖(아래)로 펼쳐지도록 overflow 클립 제거 */
	.hcjm-header-desktop:has(.hcjm-wp-nav),
	.hcjm-header-desktop:has(.hcjm-wp-nav) .hcjm-container {
		overflow: visible;
	}

	.hcjm-wp-nav {
		flex: 1;
		min-width: 0;
		display: flex;
		justify-content: center;
		overflow: visible;
	}

	/* overflow-x:auto 는 overflow-y 를 auto 로 만들어 드롭다운이 헤더 안에 갇힘 — 사용 금지 */
	.hcjm-wp-nav-menu {
		display: flex;
		flex-wrap: nowrap;
		gap: 4px;
		list-style: none;
		margin: 0;
		padding: 0;
		max-width: 100%;
		overflow: visible;
	}

	.hcjm-wp-nav-link {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		padding: 8px 14px;
		border-radius: 10px;
		text-decoration: none;
		color: var(--hcjm-text-sub);
		font-size: 14px;
		font-weight: 700;
		letter-spacing: -0.2px;
		transition: all var(--hcjm-dur) ease;
		white-space: nowrap;
	}

	.hcjm-wp-nav-link:hover {
		background: var(--hcjm-primary-soft);
		color: var(--hcjm-primary);
	}

	.hcjm-wp-nav-link.is-active {
		background: var(--hcjm-primary);
		color: #fff;
	}

	.hcjm-wp-nav-link.is-active:hover {
		background: var(--hcjm-primary-dark);
	}

	.hcjm-wp-nav-link i {
		font-size: 18px;
	}

	.hcjm-wp-nav-item {
		position: relative;
		list-style: none;
		overflow: visible;
	}

	.hcjm-wp-nav-item.has-children > .hcjm-wp-nav-link .hcjm-wp-nav-caret {
		font-size: 16px;
		margin-left: 2px;
		transition: transform var(--hcjm-dur-fast) ease;
	}

	.hcjm-wp-nav-item.has-children.is-open > .hcjm-wp-nav-link .hcjm-wp-nav-caret,
	.hcjm-wp-nav-item.has-children:hover > .hcjm-wp-nav-link .hcjm-wp-nav-caret,
	.hcjm-wp-nav-item.has-children:focus-within > .hcjm-wp-nav-link .hcjm-wp-nav-caret {
		transform: rotate(180deg);
	}

	.hcjm-wp-nav-parent {
		border: 0;
		background: transparent;
		cursor: pointer;
		font-family: inherit;
	}

	.hcjm-wp-nav-submenu {
		display: none;
		position: absolute;
		top: calc(100% + 6px);
		left: 0;
		min-width: 200px;
		max-height: min(70vh, 420px);
		margin: 0;
		padding: 6px;
		list-style: none;
		background: #fff;
		border: 1px solid var(--hcjm-border);
		border-radius: 12px;
		box-shadow: 0 12px 32px rgba(15, 16, 36, .12);
		z-index: calc(var(--hcjm-z-header, 100) + 50);
		overflow-x: hidden;
		overflow-y: auto;
		overscroll-behavior: contain;
	}

	/* 부모 링크 ↔ 드롭다운 사이 간격에서 :hover 가 끊기지 않도록 히트 영역 연결 */
	.hcjm-wp-nav-submenu::before {
		content: '';
		position: absolute;
		top: -6px;
		left: 0;
		right: 0;
		height: 6px;
	}

	.hcjm-wp-nav-submenu .hcjm-wp-nav-submenu {
		top: 0;
		left: calc(100% + 4px);
	}

	.hcjm-wp-nav-submenu .hcjm-wp-nav-submenu::before {
		top: 0;
		bottom: 0;
		left: -4px;
		right: auto;
		width: 4px;
		height: auto;
	}

	.hcjm-wp-nav-item.has-children:hover > .hcjm-wp-nav-submenu,
	.hcjm-wp-nav-item.has-children:focus-within > .hcjm-wp-nav-submenu,
	.hcjm-wp-nav-item.has-children.is-open > .hcjm-wp-nav-submenu {
		display: block;
	}

	.hcjm-wp-nav-submenu .hcjm-wp-nav-link {
		display: flex;
		width: 100%;
		padding: 10px 12px;
		border-radius: 8px;
		font-size: 13px;
	}

	.hcjm-wp-nav-submenu .hcjm-wp-nav-item.has-children > .hcjm-wp-nav-link .hcjm-wp-nav-caret {
		margin-left: auto;
		transform: rotate(-90deg);
	}

	.hcjm-wp-nav-submenu .hcjm-wp-nav-item.has-children.is-open > .hcjm-wp-nav-link .hcjm-wp-nav-caret,
	.hcjm-wp-nav-submenu .hcjm-wp-nav-item.has-children:hover > .hcjm-wp-nav-link .hcjm-wp-nav-caret,
	.hcjm-wp-nav-submenu .hcjm-wp-nav-item.has-children:focus-within > .hcjm-wp-nav-link .hcjm-wp-nav-caret {
		transform: rotate(0deg);
	}

	.hcjm-header-desktop.is-theme-dark .hcjm-wp-nav-link {
		color: var(--hcjm-header-text-sub, rgba(255, 255, 255, .72));
	}

	.hcjm-header-desktop.is-theme-dark .hcjm-wp-nav-link:hover {
		background: var(--hcjm-header-surface-hover, rgba(255, 255, 255, .14));
		color: var(--hcjm-header-text, #fff);
	}

	.hcjm-header-desktop.is-theme-dark .hcjm-wp-nav-link.is-active {
		background: var(--hcjm-primary);
		color: #fff;
	}

	.hcjm-header-desktop.is-theme-dark .hcjm-wp-nav-submenu {
		background: var(--hcjm-header-bg, #0f1024);
		border-color: var(--hcjm-header-border, rgba(255, 255, 255, .08));
	}

	.hcjm-header-desktop.is-theme-dark .hcjm-wp-nav-submenu .hcjm-wp-nav-link {
		color: var(--hcjm-header-text-sub, rgba(255, 255, 255, .72));
	}

	.hcjm-header-desktop.is-theme-dark .hcjm-wp-nav-submenu .hcjm-wp-nav-link:hover {
		background: var(--hcjm-header-surface-hover, rgba(255, 255, 255, .14));
		color: var(--hcjm-header-text, #fff);
	}
}
