/*
 * Luigi's Box filter sidebar.
 *
 * Registered by the templates that need it, with style() and getModuleUrl(),
 * so it is in <head> from the first render: on bbg's Twig theme the page body,
 * sidebar included, renders before layout/base writes the head.
 */

/*
 * A filter group with more values than the "Max. visible values per filter
 * group" setting shows that many and scrolls.
 *
 * The count arrives as --lbx-visible-values on .lbx-facets, the one value the
 * template sets. Nothing in the theme's stylesheet can be relied on for the
 * height: their SCSS generates .maxHeightValId-1 to -20, but their PurgeCSS
 * build has stripped those, and what survives is .content--scrollable's own
 * 200px. So the selector outranks theirs and is !important, and the setting
 * wins whatever the theme says.
 *
 * A row is their 40px — a 24px line plus the .asnFilter's 16px margin.
 * --lbx-facet-row-height in the theme's CSS adjusts it if that ever changes.
 */
.lbx-facets .asn .asnGroup.box .content.lbx-facet-values--capped {
    max-height: calc(var(--lbx-facet-row-height, 40px) * var(--lbx-visible-values, 5)) !important;
    overflow-y: auto !important;
}

/*
 * The way back to the filters, below the sidebar: sticky in the sidebar
 * column, pinned under the theme's header, which is sticky too. facets.js
 * measures the header into --lbx-header-height; 98px is its height from xl up,
 * for a page whose JavaScript did not run.
 */
.lbx-filters-return {
    position: sticky;
    top: calc(var(--lbx-header-height, 98px) + 1rem);
}

.lbx-filters-return__link {
    display: inline-block;
    padding: 8px 0;
    font-size: 1rem;
    line-height: 1.5rem;
    color: var(--color-link-text-link);
    text-decoration: underline;
}

.lbx-filters-return__link:hover {
    color: var(--color-link-text-link-hover);
}

.lbx-filters-return__icon {
    display: inline-block;
    margin-right: 8px;
    text-decoration: none;
}