/*
 * FAQ Sync. Every rule is wrapped in :where() (zero specificity) so any theme
 * or custom CSS rule overrides it without !important. Customize via variables.
 */
:where(.faq-sync) {
	--faq-sync-accent: #2563eb;
	--faq-sync-text: inherit;
	--faq-sync-muted: #6b7280;
	--faq-sync-border: #e5e7eb;
	--faq-sync-bg: transparent;
	--faq-sync-gap: 1.5rem;
	--faq-sync-radius: 999px;
	--faq-sync-bullet: "•";
	--faq-sync-bullet-color: var(--faq-sync-accent);
	--faq-sync-menu-bg: #f3f4f6;
	--faq-sync-menu-active-bg: var(--faq-sync-accent);
	--faq-sync-menu-active-text: #fff;
	color: var(--faq-sync-text);
	background: var(--faq-sync-bg);
}
:where(.faq-sync) :where(*) { box-sizing: border-box; }

:where(.faq-sync__search) { margin: 0 0 var(--faq-sync-gap); }
:where(.faq-sync__search-input) { width: 100%; padding: .75em 1em; border: 1px solid var(--faq-sync-border); border-radius: .5rem; font: inherit; }
:where(.faq-sync__search-status) { margin: .5em 0 0; color: var(--faq-sync-muted); font-size: .9em; }
:where(.faq-sync__search-status:empty) { display: none; }

:where(.faq-sync__menu-list) { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; margin: 0 0 var(--faq-sync-gap); padding: 0; }
:where(.faq-sync__menu-link) { display: inline-block; padding: .4em 1em; border-radius: var(--faq-sync-radius); background: var(--faq-sync-menu-bg); color: inherit; text-decoration: none; }
:where(.faq-sync__menu-link:hover, .faq-sync__menu-link:focus-visible, .faq-sync__menu-item.is-active .faq-sync__menu-link) { background: var(--faq-sync-menu-active-bg); color: var(--faq-sync-menu-active-text); }

:where(.faq-sync__category) { margin: 0 0 var(--faq-sync-gap); scroll-margin-top: 6rem; }
:where(.faq-sync__category-title, .faq-sync__related-title) { margin: 0 0 .5em; }
:where(.faq-sync__list) { list-style: none; margin: 0; padding: 0; }
:where(.faq-sync__item) { position: relative; padding: .35em 0 .35em 1.25em; }
:where(.faq-sync__item)::before { content: var(--faq-sync-bullet); position: absolute; left: 0; top: .35em; color: var(--faq-sync-bullet-color); }
:where(.faq-sync__link) { color: inherit; }
:where(.faq-sync__link:hover, .faq-sync__link:focus-visible) { color: var(--faq-sync-accent); }

:where(.faq-sync__summary) { cursor: pointer; list-style: none; }
:where(.faq-sync__summary)::-webkit-details-marker { display: none; }
:where(.faq-sync__summary)::after { content: " +"; color: var(--faq-sync-accent); }
:where(.faq-sync__details[open] .faq-sync__summary)::after { content: " −"; }
:where(.faq-sync__answer) { padding: .5em 0 .25em; color: var(--faq-sync-muted); }
:where(.faq-sync__answer p) { margin: 0 0 .5em; }
:where(.faq-sync__more) { color: var(--faq-sync-accent); }

:where(.faq-sync--single) { margin-top: var(--faq-sync-gap); }
:where(.faq-sync__back) { margin: 0 0 var(--faq-sync-gap); }
:where(.faq-sync__back-link) { color: var(--faq-sync-accent); }

@media (min-width: 900px) {
	:where(.faq-sync--menu-side) { display: grid; grid-template-columns: minmax(12rem, 1fr) 3fr; gap: var(--faq-sync-gap); align-items: start; }
	:where(.faq-sync--menu-side .faq-sync__search) { grid-column: 1 / -1; }
	:where(.faq-sync--menu-side .faq-sync__menu) { position: sticky; top: 2rem; }
	:where(.faq-sync--menu-side .faq-sync__menu-list) { flex-direction: column; align-items: flex-start; }
}

/* Functional: hidden search results must stay hidden regardless of theme display rules. */
.faq-sync .is-hidden,
.faq-sync [hidden] { display: none !important; }
