/*
 * Lista poradni obok treści poradni (makieta: _section-poradnia.scss, część
 * `clinic-nav` i `__aside`; 1:1). Od 1024 px po lewej i przyklejona, gdy cała
 * lista mieści się w oknie (od 1056 px wysokości); poniżej przyklejona pod
 * paskiem nagłówka jako zwijany pasek w kolorze marki, rozwinięta lista to
 * panel nad treścią.
 */

.clinic-nav {
	border: 1px solid var(--c-border);
	border-radius: var(--radius-7);
	background: var(--c-surface);
}

.clinic-nav__summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-9);
	padding: var(--space-11) var(--space-13);
	color: var(--c-ink);
	font-family: var(--font-serif);
	font-size: var(--text-8);
	font-weight: 600;
	line-height: 1.3;
	list-style: none;
	cursor: pointer;
}

.clinic-nav__summary::-webkit-details-marker {
	display: none;
}

.clinic-nav__summary:hover {
	color: var(--c-primary-hover);
}

.clinic-nav__chev {
	flex: none;
	width: 1.25rem;
	height: 1.25rem;
	color: var(--c-primary-hover);
	transition: transform var(--duration-fast) var(--ease-out-soft);
}

.clinic-nav[open] .clinic-nav__chev {
	transform: rotate(180deg);
}

.clinic-nav__body {
	display: grid;
	gap: var(--space-5);
	padding: 0 var(--space-7) var(--space-11);
}

.clinic-nav__group {
	margin: 0;
	padding: var(--space-7) var(--space-7) var(--space-2);
	color: var(--c-primary-hover);
	font-size: var(--text-3);
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.clinic-nav__list {
	display: grid;
	gap: var(--space-1);
	margin: 0;
	padding: 0;
	list-style: none;
}

.clinic-nav__link {
	display: flex;
	align-items: center;
	min-height: var(--target-min);
	padding: var(--space-4) var(--space-7);
	border-left: 3px solid transparent;
	border-radius: var(--radius-3);
	color: var(--c-text);
	font-size: var(--text-4);
	font-weight: 600;
	text-decoration: none;
}

.clinic-nav__link:hover {
	background: var(--c-tint);
	color: var(--c-primary-hover);
}

@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {

	.clinic-nav__link {
		min-height: 2.25rem;
		padding-block: var(--space-2);
	}
}

.clinic-nav__link[aria-current="page"] {
	border-left-color: var(--c-accent);
	background: var(--c-tint);
	color: var(--c-primary-hover);
}

/*
 * Dział z podstronami (poza makietą, decyzja klienta 2026-10-30): przycisk
 * rozwijania na wysokości pierwszego wiersza odnośnika działu, podstrony
 * wcięte pod nim. Odnośnik działu zostawia miejsce na przycisk.
 */
.clinic-nav__item {
	position: relative;
	--clinic-nav-toggle: var(--target-min);
}

.clinic-nav__item--dzial > .clinic-nav__link {
	padding-right: calc(var(--clinic-nav-toggle) + var(--space-2));
}

.clinic-nav__item:has(.clinic-nav__link--sub[aria-current="page"]) > .clinic-nav__link {
	color: var(--c-primary-hover);
}

.clinic-nav__toggle {
	position: absolute;
	top: 0;
	right: 0;
	display: grid;
	place-items: center;
	width: var(--clinic-nav-toggle);
	height: var(--clinic-nav-toggle);
	border-radius: var(--radius-3);
	color: var(--c-primary-hover);
	list-style: none;
	cursor: pointer;
}

.clinic-nav__toggle::-webkit-details-marker {
	display: none;
}

.clinic-nav__toggle:hover {
	background: var(--c-tint);
}

.clinic-nav__toggle-chev {
	width: 1.125rem;
	height: 1.125rem;
	transition: transform var(--duration-fast) var(--ease-out-soft);
}

.clinic-nav__sub[open] > .clinic-nav__toggle .clinic-nav__toggle-chev {
	transform: rotate(180deg);
}

.clinic-nav__list--sub {
	margin-top: var(--space-1);
	padding-left: var(--space-9);
}

.clinic-nav__link--sub {
	font-weight: 500;
}

@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {

	.clinic-nav__item {
		--clinic-nav-toggle: 2.25rem;
	}
}

@media (prefers-reduced-motion: reduce) {

	.clinic-nav__toggle-chev {
		transition: none;
	}
}

@media (forced-colors: active) {

	.clinic-nav__toggle {
		color: LinkText;
	}
}

@media (min-width: 1024px) and (min-height: 1056px) {

	.spzoz-lista-poradni {
		position: sticky;
		top: calc(var(--header-offset) + var(--space-13));
		max-height: calc(100dvh - var(--header-offset) - 3rem);
		overflow-y: auto;
		scrollbar-gutter: stable;
		scroll-padding-block: var(--space-5);
	}
}

@media (max-width: 1023.98px) {

	.js .spzoz-lista-poradni {
		position: sticky;
		top: var(--header-offset);
		z-index: 40;
		order: -1;
		padding-block: var(--space-5);
		border-image: conic-gradient(var(--c-surface) 0 0) fill 0 / / 0 100vw;
	}

	.js .clinic-nav {
		position: relative;
		border-color: var(--c-primary);
		background: var(--c-primary);
	}

	.js .clinic-nav:has(.clinic-nav__summary:hover) {
		border-color: var(--c-primary-hover);
		background: var(--c-primary-hover);
	}

	.js .clinic-nav__summary {
		padding-block: var(--space-7);
		color: var(--c-surface);
	}

	.js .clinic-nav__summary:hover,
	.js .clinic-nav__summary .clinic-nav__chev {
		color: var(--c-surface);
	}

	.js .clinic-nav__body {
		position: absolute;
		top: calc(100% + var(--space-2));
		right: 0;
		left: 0;
		max-height: calc(100dvh - var(--header-offset) - 6rem);
		overflow-y: auto;
		overscroll-behavior: contain;
		padding-top: var(--space-7);
		border: 1px solid var(--c-border);
		border-radius: var(--radius-7);
		background: var(--c-surface);
		box-shadow: var(--shadow-panel);
	}
}

@media (max-width: 1023.98px) and (forced-colors: active) {

	.js .clinic-nav__summary .clinic-nav__chev {
		color: CanvasText;
	}
}