/*
 * Mobile department navigation — expand/collapse, not the desktop
 * mega-menu's hover model. Rendered inside the existing native
 * <details>/<summary> mobile overlay (shell.css owns .toga-mobile-menu
 * itself); this file only styles the per-department disclosures nested
 * inside it. No JavaScript: open/close is native <details> behavior, same
 * as the outer overlay without navigation.js's progressive enhancement.
 */

.toga-mobile-department-nav {
	list-style: none;
	margin: 0;
	padding: 0;
}

.toga-mobile-department-nav__item {
	border-block-end: 1px solid var(--toga-border);
}

.toga-mobile-department-nav__link {
	display: flex;
	align-items: center;
	min-height: var(--toga-tap-target);
	color: var(--toga-ink);
	font-size: var(--toga-text-body);
	text-decoration: none;
	transition: var(--toga-transition);
}

.toga-mobile-department-nav__link:hover,
.toga-mobile-department-nav__link:focus-visible {
	color: var(--toga-terracotta);
}

.toga-mobile-department-nav__disclosure > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: var(--toga-tap-target);
	color: var(--toga-ink);
	font-size: var(--toga-text-body);
	cursor: pointer;
	list-style: none;
	transition: var(--toga-transition);
}

.toga-mobile-department-nav__disclosure > summary:hover {
	color: var(--toga-terracotta);
}

.toga-mobile-department-nav__disclosure > summary::-webkit-details-marker {
	display: none;
}

.toga-mobile-department-nav__disclosure > summary:focus-visible {
	outline: var(--toga-focus-ring-width) solid var(--toga-focus-ring-color);
	outline-offset: var(--toga-focus-ring-offset);
}

.toga-mobile-department-nav__chevron {
	flex: 0 0 auto;
	width: 8px;
	height: 8px;
	border-right: 2px solid currentcolor;
	border-bottom: 2px solid currentcolor;
	transform: rotate(45deg);
}

@media (prefers-reduced-motion: no-preference) {
	.toga-mobile-department-nav__chevron {
		transition: transform 0.15s ease;
	}
}

.toga-mobile-department-nav__disclosure[open] > summary .toga-mobile-department-nav__chevron {
	transform: rotate(-135deg);
}

.toga-mobile-department-nav__children {
	list-style: none;
	margin: 0;
	padding-block-end: var(--toga-space-2);
}

.toga-mobile-department-nav__child-link {
	display: flex;
	align-items: center;
	min-height: 40px;
	padding-inline-start: var(--toga-space-4);
	color: var(--toga-muted);
	font-size: var(--toga-text-small);
	text-decoration: none;
	transition: var(--toga-transition);
}

.toga-mobile-department-nav__child-link:hover,
.toga-mobile-department-nav__child-link:focus-visible {
	color: var(--toga-terracotta);
}

.toga-mobile-department-nav__child-link--all {
	color: var(--toga-ink);
	font-weight: 500;
}