/* Etik Bakkal Çekirdek — menüdeki kategori ağacı (masaüstü açılır panel ve mobil yan menü).
 * Yalnızca görünüm; menü öğeleri ve bağlantılar temanın menüsünden gelir. */

/* ---------- Masaüstü: açılır panel ---------- */

.header-nav .nav-dropdown.nav-dropdown-simple {
	display: grid;
	grid-template-columns: repeat(var(--etik-nav-cols, 5), minmax(150px, 1fr));
	gap: 6px 10px;
	width: max-content;
	min-width: 220px;
	max-width: min(1140px, calc(100vw - 32px));
	padding: 16px;
	border: 1px solid #ececec;
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.12);
}

/* Az öğeli menüler tek sütun: geniş boş panel olmasın. */
.header-nav .nav-dropdown.nav-dropdown-simple:not(:has(> li.nav-dropdown-col)) {
	grid-template-columns: minmax(200px, 1fr);
}

.header-nav .nav-dropdown.nav-dropdown-simple:has(> li.nav-dropdown-col:nth-child(3):last-child),
.header-nav .nav-dropdown.nav-dropdown-simple:has(> li:nth-child(3):last-child) {
	--etik-nav-cols: 3;
}

.header-nav .nav-dropdown.nav-dropdown-simple > li {
	display: block;
	width: auto;
	min-width: 0;
	margin: 0;
	padding: 0;
	border: 0 !important;
}

/* Üst kategori (sütun başlığı ya da alt kategorisi olmayan kategori) */
.header-nav .nav-dropdown.nav-dropdown-simple > li > a {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 40px;
	margin: 0;
	padding: 6px 10px;
	border: 0;
	border-radius: 10px;
	color: #1f1f1f;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: 0;
	text-transform: none;
	white-space: normal;
	transition: background-color 0.15s, color 0.15s;
}

.header-nav .nav-dropdown.nav-dropdown-simple > li > a img.emoji {
	flex: 0 0 auto;
	width: 18px !important;
	height: 18px !important;
	margin: 0 !important;
}

/* Alt kategoriler */
.header-nav .nav-dropdown.nav-dropdown-simple .nav-column {
	display: block;
	margin: 2px 0 6px;
	padding: 0;
}

.header-nav .nav-dropdown.nav-dropdown-simple .nav-column > li {
	margin: 0;
	padding: 0;
	border: 0;
}

.header-nav .nav-dropdown.nav-dropdown-simple .nav-column > li > a {
	display: flex;
	align-items: center;
	min-height: 34px;
	margin: 0;
	padding: 4px 10px;
	border: 0;
	border-radius: 8px;
	color: #555;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0;
	text-transform: none;
	white-space: normal;
	transition: background-color 0.15s, color 0.15s;
}

.header-nav .nav-dropdown.nav-dropdown-simple > li > a:hover,
.header-nav .nav-dropdown.nav-dropdown-simple .nav-column > li > a:hover,
.header-nav .nav-dropdown.nav-dropdown-simple li.active > a,
.header-nav .nav-dropdown.nav-dropdown-simple li.current-menu-item > a {
	background: #f4f8ec;
	background: color-mix(in srgb, var(--fs-color-primary, #5b8c01) 9%, #fff);
	color: #2f4a00;
}

.header-nav .nav-dropdown.nav-dropdown-simple a:focus-visible {
	outline: 2px solid var(--fs-color-primary, #5b8c01);
	outline-offset: 1px;
}

/* ---------- Mobil: yan menüdeki ağaç ---------- */

.mobile-sidebar {
	background: #fff;
}

.mobile-sidebar .nav-sidebar.nav-vertical > li.menu-item {
	border-top: 1px solid #f0f0f0;
}

.mobile-sidebar .nav-sidebar.nav-vertical > li.menu-item > a {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 52px;
	padding: 8px 16px;
	color: #1f1f1f;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: none;
}

.mobile-sidebar .nav-sidebar.nav-vertical > li.menu-item > a img.emoji {
	width: 20px !important;
	height: 20px !important;
	margin: 0 !important;
}

.mobile-sidebar .nav-sidebar.nav-vertical li.menu-item > .toggle {
	width: 48px;
	min-height: 52px;
	margin: 0;
	opacity: 1;
	color: #444;
}

.mobile-sidebar .nav-sidebar.nav-vertical > li.menu-item.active > a,
.mobile-sidebar .nav-sidebar.nav-vertical > li.menu-item.current-menu-item > a,
.mobile-sidebar .nav-sidebar.nav-vertical > li.menu-item.current-menu-ancestor > a {
	color: #2f4a00;
}

/* İkinci düzey: açık gri zemin üzerinde gruplar */
.mobile-sidebar .nav-sidebar.nav-vertical > li.menu-item > ul.children,
.mobile-sidebar .nav-sidebar.nav-vertical > li.menu-item > ul.sub-menu {
	margin: 0;
	padding: 6px 12px 12px;
	background: #f7f7f5;
}

.mobile-sidebar .nav-sidebar.nav-vertical > li.menu-item > ul > li {
	margin: 0;
	padding: 0;
	border: 0;
}

.mobile-sidebar .nav-sidebar.nav-vertical > li.menu-item > ul > li > a {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 46px;
	padding: 6px 8px;
	border-radius: 10px;
	color: #1f1f1f;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: none;
}

.mobile-sidebar .nav-sidebar.nav-vertical > li.menu-item > ul > li > a img.emoji {
	width: 18px !important;
	height: 18px !important;
	margin: 0 !important;
}

/* Üçüncü düzey: soldan çizgili liste */
.mobile-sidebar .nav-sidebar.nav-vertical > li.menu-item > ul > li > ul {
	margin: 0 0 8px 16px;
	padding: 0 0 0 10px;
	border-left: 2px solid #e2e2de;
}

.mobile-sidebar .nav-sidebar.nav-vertical > li.menu-item > ul > li > ul > li {
	margin: 0;
	padding: 0;
	border: 0;
}

.mobile-sidebar .nav-sidebar.nav-vertical > li.menu-item > ul > li > ul > li > a {
	display: flex;
	align-items: center;
	min-height: 44px;
	padding: 6px 8px;
	border-radius: 8px;
	color: #444;
	font-size: 15px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
}

.mobile-sidebar .nav-sidebar.nav-vertical li.menu-item a:active {
	background: #eef3e4;
}

@media (prefers-reduced-motion: reduce) {
	.header-nav .nav-dropdown.nav-dropdown-simple a {
		transition: none;
	}
}