/*
 * MANA Module: mana-toc – MANA Builder stylesheet: STRUCTURE ONLY.
 *
 * זכויות יוצרים © MANA (mana.agency). כל הזכויות שמורות.
 * השימוש בקובץ כפוף לתנאי הרישיון של MANA (LICENSE.txt).
 *
 * No colours, fonts, borders or shadows here – the site (theme, design wizard, global classes, document CSS)
 * styles .mana-toc and its parts. This file only makes the component work: list reset, nesting indent,
 * toggle as a bare button, hidden/open states, sticky position and the scroll offset under a fixed header.
 * --mana-toc-header / --mana-toc-offset are written on <html> by toc.js; --mana-toc-top by the component.
 */

.mb-root .mana-toc[hidden] { display: none !important; }
.mb-root .mana-toc { box-sizing: border-box; text-align: start; }
.mb-root .mana-toc *, .mb-root .mana-toc *::before, .mb-root .mana-toc *::after { box-sizing: inherit; }

.mb-root .mana-toc__title { margin: 0; }
.mb-root .mana-toc__toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-sm, .5rem);
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	color: inherit;
	font: inherit;
	text-align: start;
	cursor: default;
}
.mb-root .mana-toc__chevron { display: none; flex: 0 0 auto; width: 1em; height: 1em; transition: transform .25s ease; }

.mb-root .mana-toc__body { min-height: 0; }
.mb-root .mana-toc__list, .mb-root .mana-toc__list--sub { list-style: none; margin: 0; padding: 0; }
.mb-root .mana-toc__list--sub { padding-inline-start: var(--space-md, 1rem); }
.mb-root .mana-toc__link { display: flex; align-items: baseline; gap: var(--space-xs, .5rem); position: relative; text-decoration: none; }
.mb-root .mana-toc__num { flex: 0 0 2em; font-variant-numeric: tabular-nums; }
.mb-root .mana-toc__text { flex: 1 1 auto; min-width: 0; }

/* Sticky (desktop): the node is the flex item inside its container. */
@media (min-width: 1025px) {
	.mb-root .mana-toc--sticky {
		position: sticky;
		top: calc(var(--mana-toc-header, 0px) + var(--mana-toc-top, 24px));
		display: flex;
		flex-direction: column;
		max-height: calc(100vh - var(--mana-toc-header, 0px) - var(--mana-toc-top, 24px) - 16px);
	}
	.mb-root .mana-toc--sticky .mana-toc__body { overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; }
}

/* Collapsible: closed state only with JS (html.mana-toc-js) – without it the list is open. */
@media (max-width: 1024px) {
	.mb-root .mana-toc--collapse-tablet .mana-toc__toggle { cursor: pointer; }
	.mb-root .mana-toc--collapse-tablet .mana-toc__chevron { display: block; }
	.mb-root .mana-toc--collapse-tablet.is-open .mana-toc__chevron { transform: rotate(180deg); }
	html.mana-toc-js .mb-root .mana-toc--collapse-tablet:not(.is-open) .mana-toc__body { display: none; }
}
@media (max-width: 767px) {
	.mb-root .mana-toc--collapse-mobile .mana-toc__toggle { cursor: pointer; }
	.mb-root .mana-toc--collapse-mobile .mana-toc__chevron { display: block; }
	.mb-root .mana-toc--collapse-mobile.is-open .mana-toc__chevron { transform: rotate(180deg); }
	html.mana-toc-js .mb-root .mana-toc--collapse-mobile:not(.is-open) .mana-toc__body { display: none; }
}

/* Headings get room under a fixed header, also for native #anchor navigation. */
.mb-root :where(h1, h2, h3, h4, h5, h6)[id] { scroll-margin-top: var(--mana-toc-offset, 0px); }

.mb-root .mana-toc--notice { font-size: var(--text-small, .9em); opacity: .75; }

@media (prefers-reduced-motion: reduce) {
	.mb-root .mana-toc__chevron { transition: none; }
}
