/**
 * nak-nav.css — kitchen navigation (1.23.0)
 *
 *   1. Primary menu — the active-item rule in each kitchen's hand.
 *   2. Kitchens panel — three kitchen cards under "Kitchens" (desktop).
 *   3. Kitchen bar — sticky under the header on /indian/, /khmer/, /fusion/.
 *   4. Phone drawer — kitchen tiles, menu rows, Order / Book, talk row.
 *
 * Kitchen accents match nak-features.css (--k, --k-gold, --k-soft) so a
 * kitchen looks the same in its card, its badge and its bar.
 *
 * @package NamasteAngkorTheme
 */

.nak-menu__kitchen--indian, .nak-kbar--indian, .nak-drawer__tile--indian { --k: #a01b2e; --k-deep: #7c1324; --k-gold: #f2a52a; --k-soft: #fbecd2; }
.nak-menu__kitchen--khmer,  .nak-kbar--khmer,  .nak-drawer__tile--khmer  { --k: #8a3d24; --k-deep: #5a2614; --k-gold: #d9b45a; --k-soft: #efe2c6; }
.nak-menu__kitchen--fusion, .nak-kbar--fusion, .nak-drawer__tile--fusion { --k: #7a1f2b; --k-deep: #2c1410; --k-gold: #e8871e; --k-soft: #f6e7d6; }

/* =====================================================================
 * 1. Primary menu — the active rule, per kitchen
 * ================================================================== */
@media (min-width: 761px) {
	html[data-style="indian"] .nak-nav .nak-menu > li > a::after { height: 3px; border-radius: 3px; background: linear-gradient(90deg, #e8871e, #f2b035); }
	html[data-style="khmer"]  .nak-nav .nak-menu > li > a::after {
		height: 5px; bottom: -6px; border-radius: 0;
		background: linear-gradient(var(--nak-saffron), var(--nak-saffron)) top / 100% 1px no-repeat,
		            linear-gradient(var(--nak-saffron), var(--nak-saffron)) bottom / 100% 2px no-repeat;
	}
	html[data-style="fusion"] .nak-nav .nak-menu > li > a::after { height: 2px; border-radius: 2px; background: linear-gradient(90deg, var(--nak-lotus), var(--nak-saffron)); }
	.nak-nav .nak-menu > li.current-menu-ancestor > a::after { right: 0; }
}

/* =====================================================================
 * 2. Kitchens panel (desktop)
 * ================================================================== */
.nak-menu__ktext { display: flex; flex-direction: column; min-width: 0; }
.nak-menu__khouse, .nak-menu__khere { display: none; }

@media (min-width: 761px) {
	.nak-header__inner { position: relative; }
	.nak-nav .nak-menu > li.nak-menu__kitchens { position: static; }

	.nak-nav .nak-menu > li.nak-menu__kitchens > .sub-menu {
		left: auto; right: 0;
		top: calc(100% - .35rem);
		width: min(700px, calc(100vw - 2rem));
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: .6rem;
		padding: .7rem;
		transform: translateY(8px);
		border-radius: calc(var(--craft-r, 8px) + 4px);
	}
	.nak-nav .nak-menu > li.nak-menu__kitchens > .sub-menu::before { top: -1.9rem; height: 1.9rem; }
	.nak-nav .nak-menu > li.nak-menu__kitchens:hover > .sub-menu,
	.nak-nav .nak-menu > li.nak-menu__kitchens:focus-within > .sub-menu { transform: translateY(0); }

	/* One card per kitchen */
	.nak-nav .nak-menu > li.nak-menu__kitchens > .sub-menu > li > a,
	.nak-nav .nak-menu > li.nak-menu__kitchens > .sub-menu > li.current-menu-item > a {
		position: relative;
		display: grid;
		grid-template-columns: auto 1fr;
		align-items: center;
		gap: .75rem;
		height: 100%;
		padding: 1rem .9rem .95rem;
		white-space: normal;
		text-transform: none;
		letter-spacing: 0;
		color: var(--nak-ink);
		background: var(--k-soft);
		border: 1px solid color-mix(in srgb, var(--k) 16%, transparent);
		border-top: 3px solid var(--k);
		border-radius: var(--craft-r, 8px);
		transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
	}
	.nak-nav .nak-menu > li.nak-menu__kitchens > .sub-menu > li > a:hover,
	.nak-nav .nak-menu > li.nak-menu__kitchens > .sub-menu > li > a:focus-visible {
		background: var(--k-soft);
		color: var(--nak-ink);
		transform: translateY(-2px);
		border-color: color-mix(in srgb, var(--k) 45%, transparent);
		border-top-color: var(--k);
		box-shadow: 0 14px 24px -18px color-mix(in srgb, var(--k) 70%, transparent);
	}
	.nak-nav .nak-menu__kitchens .sub-menu .nak-menu__icon,
	.nak-nav .nak-menu__kitchens .sub-menu .current-menu-item .nak-menu__icon {
		width: 44px; height: 44px;
		padding: 9px;
		box-sizing: border-box;
		color: var(--k-gold);
		background: var(--k);
		border-radius: 50%;
	}
	.nak-nav .nak-menu__kitchen--indian .nak-menu__icon { border-radius: 50% 50% 10px 10px / 60% 60% 10px 10px !important; } /* temple arch */
	.nak-nav .nak-menu__kitchen--khmer  .nak-menu__icon { border-radius: 3px !important; }                                   /* cut stone   */
	.nak-nav .nak-menu__kitchens .nak-menu__kname {
		font-family: var(--nak-display);
		font-weight: var(--nak-disp-weight, 600);
		font-size: 1.02rem;
		line-height: 1.15;
		color: var(--k);
	}
	.nak-nav .nak-menu__kitchens .nak-menu__khouse {
		display: block;
		margin-top: .2rem;
		font-size: .74rem;
		font-weight: 500;
		line-height: 1.3;
		color: var(--nak-ink-soft);
	}
	.nak-nav .nak-menu__kitchens .nak-menu__khere {
		display: inline-block;
		position: absolute; top: -.62rem; right: .6rem;
		padding: .12rem .45rem;
		font-size: .6rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
		color: #fffdf8;
		background: var(--k);
		border-radius: 999px;
	}
	.nak-nav .nak-menu__kitchens .current-menu-item > a { box-shadow: inset 0 0 0 1.5px var(--k); }
}

/* =====================================================================
 * 3. Kitchen bar
 * ================================================================== */
.nak-kbar {
	position: sticky;
	top: var(--nak-header-only, var(--nak-header-h, 76px));
	z-index: 90;
	color: #fbf4e6;
	background: var(--k-deep);
	box-shadow: 0 10px 22px -18px rgba(20, 8, 3, .8);
}
.nak-kbar::after { content: ""; position: absolute; left: 0; right: 0; bottom: -3px; height: 3px; pointer-events: none; }
.nak-kbar--indian::after { background: linear-gradient(90deg, #e8871e, #f2b035 50%, #e8871e); }
.nak-kbar--khmer::after  { background: repeating-linear-gradient(90deg, #d9b45a 0 8px, #5a2614 8px 16px); }
.nak-kbar--fusion::after { background: linear-gradient(90deg, #a01b2e, #e8871e 50%, #8a3d24); }
.nak-kbar--fusion { background: linear-gradient(100deg, #2c1410, #3d1a16 60%, #2c1410); }

.nak-kbar__inner {
	display: flex;
	align-items: center;
	gap: clamp(.6rem, 1.4vw, 1.25rem);
	min-height: 54px;
}
.nak-kbar a { color: inherit; text-decoration: none; }

/* Identity */
.nak-kbar__id { display: flex; align-items: center; gap: .6rem; flex: none; }
.nak-kbar__seat {
	display: grid; place-items: center;
	width: 34px; height: 34px;
	color: var(--k-gold);
	background: rgba(255, 255, 255, .08);
	border: 1px solid color-mix(in srgb, var(--k-gold) 45%, transparent);
	border-radius: 50%;
}
.nak-kbar--indian .nak-kbar__seat { border-radius: 50% 50% 8px 8px / 60% 60% 8px 8px; }
.nak-kbar--khmer  .nak-kbar__seat { border-radius: 3px; }
.nak-kbar__seat svg { width: 22px; height: 22px; }
.nak-kbar__idtext { display: flex; flex-direction: column; line-height: 1.05; }
.nak-kbar__name { font-family: var(--nak-display); font-weight: var(--nak-disp-weight, 600); font-size: 1.05rem; }
.nak-kbar__house { margin-top: .2rem; font-size: .62rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--k-gold); }

/* Sections */
.nak-kbar__links {
	display: flex; align-items: center; justify-content: center;
	gap: .2rem;
	flex: 1 1 auto; min-width: 0;
	list-style: none; margin: 0; padding: 0;
}
.nak-kbar__link {
	position: relative;
	display: inline-flex; align-items: center; gap: .42rem;
	padding: .5rem .8rem;
	font-size: .8rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase;
	white-space: nowrap;
	color: rgba(251, 244, 230, .78) !important;
	border-radius: 999px;
	transition: background-color .18s ease, color .18s ease;
}
.nak-kbar__icon { width: 17px; height: 17px; opacity: .85; }
.nak-kbar__link:hover, .nak-kbar__link:focus-visible { color: #fff !important; background: rgba(255, 255, 255, .08); }

/* "You are here" in each kitchen's hand */
.nak-kbar--indian .nak-kbar__link.is-active { color: var(--k-deep) !important; background: var(--k-gold); }
.nak-kbar--indian .nak-kbar__link.is-active .nak-kbar__icon { opacity: 1; }
.nak-kbar--khmer .nak-kbar__link { border-radius: 2px; }
.nak-kbar--khmer .nak-kbar__link.is-active {
	color: var(--k-gold) !important;
	background:
		linear-gradient(var(--k-gold), var(--k-gold)) center bottom 7px / calc(100% - 1.6rem) 1px no-repeat,
		linear-gradient(var(--k-gold), var(--k-gold)) center bottom 3px / calc(100% - 1.6rem) 2px no-repeat;
}
.nak-kbar--fusion .nak-kbar__link.is-active { color: #fff !important; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--k-gold) 75%, transparent); }
.nak-kbar--fusion .nak-kbar__link.is-active::before {
	content: ""; position: absolute; top: 50%; left: -.15rem;
	width: 6px; height: 6px; margin-top: -3px;
	background: var(--k-gold); border-radius: 50%;
	box-shadow: 0 0 0 3px rgba(232, 135, 30, .25);
}

/* Book a table */
.nak-kbar__book {
	display: inline-flex; align-items: center; gap: .45rem;
	flex: none;
	padding: .55rem 1rem;
	font-size: .8rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
	color: var(--k-deep) !important;
	background: #fbf4e6;
	border-radius: 999px;
	transition: background-color .18s ease, transform .18s ease;
}
.nak-kbar--khmer .nak-kbar__book { border-radius: 3px; }
.nak-kbar__book:hover, .nak-kbar__book:focus-visible { background: var(--k-gold); transform: translateY(-1px); }
.nak-kbar__book.is-active { box-shadow: 0 0 0 2px var(--k-gold); }

/* The other two kitchens */
.nak-kbar__switch { display: flex; align-items: center; gap: .35rem; flex: none; padding-left: clamp(.4rem, 1vw, .9rem); border-left: 1px solid rgba(251, 244, 230, .18); }
.nak-kbar__other {
	display: inline-flex; align-items: center; gap: .35rem;
	padding: .38rem .6rem .38rem .45rem;
	font-size: .72rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
	color: rgba(251, 244, 230, .8) !important;
	border: 1px solid rgba(251, 244, 230, .2);
	border-radius: 999px;
	transition: border-color .18s ease, color .18s ease, background-color .18s ease;
}
.nak-kbar__other svg { width: 18px; height: 18px; }
.nak-kbar__other--indian svg { color: #f2a52a; }
.nak-kbar__other--khmer svg  { color: #d9b45a; }
.nak-kbar__other--fusion svg { color: #e8871e; }
.nak-kbar__other:hover, .nak-kbar__other:focus-visible { color: #fff !important; border-color: rgba(251, 244, 230, .55); background: rgba(255, 255, 255, .06); }

.nak-kbar__link[hidden], .nak-kbar__links li[hidden] { display: none !important; }

@media (max-width: 1180px) {
	.nak-kbar__house { display: none; }
	.nak-kbar__other span { display: none; }
	.nak-kbar__other { padding: .38rem; }
}
@media (max-width: 1000px) {
	.nak-kbar__icon { display: none; }
	.nak-kbar__book .nak-kbar__icon { display: inline-block; }
	.nak-kbar__link { padding-inline: .6rem; }
}
@media (max-width: 760px) {
	.nak-kbar__inner { min-height: 46px; gap: .5rem; padding-inline: 0; }
	.nak-kbar .nak-wrap { padding-inline: 12px; }
	.nak-kbar__idtext, .nak-kbar__switch { display: none; }
	.nak-kbar__seat { width: 30px; height: 30px; }
	.nak-kbar__seat svg { width: 19px; height: 19px; }
	.nak-kbar__links {
		justify-content: flex-start;
		overflow-x: auto;
		scrollbar-width: none;
		-webkit-mask: linear-gradient(90deg, #000 85%, transparent);
		mask: linear-gradient(90deg, #000 85%, transparent);
		padding-right: 1.2rem;
	}
	.nak-kbar__links::-webkit-scrollbar { display: none; }
	.nak-kbar__link { font-size: .72rem; padding: .45rem .6rem; }
	.nak-kbar__book { padding: .45rem .7rem; font-size: .72rem; }
	.nak-kbar__book span { display: none; }
	.nak-kbar__book .nak-kbar__icon { width: 18px; height: 18px; }
}

/* =====================================================================
 * 4. Phone drawer
 * ================================================================== */
.nak-drawer__kitchens, .nak-drawer__foot { display: none; }

@media (max-width: 760px) {
	.nak-nav {
		width: min(90vw, 380px);
		padding: 5.25rem 1.25rem 1.25rem;
		gap: 0;
		/* Colour and texture set apart: a shorthand with the colour first is invalid and drops both. */
		background-color: var(--nak-cream);
		background-image: var(--nak-texture, none);
		border-left: 0;
		box-shadow: -24px 0 60px -30px rgba(20, 8, 3, .75);
	}
	/* Scrim over the page while the drawer is open (tap closes, see nak.js). */
	body.nak-nav-open .nak-header::after {
		content: ""; position: fixed; inset: 0; z-index: 0;
		background: rgba(26, 12, 5, .5);
		-webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
	}

	/* Kitchen tiles */
	.nak-drawer__kitchens { display: block; width: 100%; margin-bottom: 1rem; }
	.nak-drawer__label { margin: 0 0 .55rem; font-size: .66rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--nak-ink-soft); }
	.nak-drawer__tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; list-style: none; margin: 0; padding: 0; }
	.nak-drawer__tile {
		display: flex; flex-direction: column; align-items: center; gap: .4rem;
		padding: .8rem .3rem .65rem;
		font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
		color: var(--k) !important;
		text-decoration: none;
		background: var(--k-soft);
		border: 1px solid color-mix(in srgb, var(--k) 18%, transparent);
		border-radius: var(--craft-r, 8px);
	}
	.nak-drawer__tile svg { width: 30px; height: 30px; }
	.nak-drawer__tile.is-here { color: #fbf4e6 !important; background: var(--k-deep); border-color: var(--k-deep); }
	.nak-drawer__tile.is-here svg { color: var(--k-gold); }

	/* Menu rows (the tiles replace the Kitchens group here) */
	.nak-nav .nak-menu { gap: 0; }
	.nak-nav .nak-menu > li { width: 100%; }
	.nak-nav .nak-menu > li.nak-menu__kitchens,
	.nak-nav .nak-menu > li.nak-menu__kitchen { display: none; }
	.nak-nav .nak-menu > li > a {
		display: flex; align-items: center; width: 100%;
		padding: .95rem .15rem;
		font-size: .95rem;
		border-bottom: 1px solid color-mix(in srgb, var(--nak-ink) 10%, transparent);
	}
	.nak-nav .nak-menu > li > a::after,
	.nak-nav .nak-menu > li.current-menu-item > a::after {
		content: ""; position: static; display: block !important;
		width: .42rem; height: .42rem; margin-left: auto;
		background: none;
		border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
		transform: rotate(-45deg);
		opacity: .4;
		transition: none;
	}
	.nak-nav .nak-menu > li.current-menu-item > a { color: var(--nak-lotus); }
	.nak-nav .nak-menu > li.current-menu-item > a::after { opacity: 1; }

	/* Foot: Order / Book, then the three ways to talk */
	.nak-drawer__foot { display: block; width: 100%; margin-top: auto; padding-top: 1.4rem; }
	.nak-drawer__actions { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
	.nak-drawer__btn {
		display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
		padding: .8rem .5rem;
		font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
		color: var(--nak-lotus) !important;
		text-decoration: none;
		border: 1.5px solid var(--nak-lotus);
		border-radius: var(--craft-r, 8px);
	}
	.nak-drawer__btn--order { color: #fffdf8 !important; background: var(--nak-lotus); }
	.nak-drawer__talk { display: flex; justify-content: space-between; gap: .4rem; margin: .9rem 0 0; }
	.nak-drawer__talk a {
		display: inline-flex; align-items: center; gap: .35rem;
		font-size: .78rem; font-weight: 600;
		color: var(--nak-ink-soft) !important;
		text-decoration: none;
	}
	.nak-drawer__talk svg { color: var(--nak-lotus); }
}

@media (prefers-reduced-motion: reduce) {
	.nak-kbar__link, .nak-kbar__book, .nak-kbar__other,
	.nak-nav .nak-menu > li.nak-menu__kitchens > .sub-menu > li > a { transition: none; }
}