/**
 * Global sticky-footer shell and browse fill layout.
 */

:root {
    --htr-gutter: max(1rem, 4vw);
    --htr-main-padding-block: clamp(1.25rem, 3vw, 2rem);
}

.htr-site {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
}

.htr-header,
.htr-footer {
    flex-shrink: 0;
}

.htr-main {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    padding-top: var(--htr-header-height);
}

.htr-main--fill:has(.htr-hero) {
    padding-top: 0;
}

.htr-site-content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    width: 100%;
}

.htr-main:not(.htr-main--fill) > .htr-site-content:not(.htr-site-content--flush) {
    padding-block: var(--htr-main-padding-block);
}

.htr-container {
    width: min(100% - (var(--htr-gutter) * 2), var(--htr-container));
    margin-inline: auto;
}

.htr-container--wide {
    width: min(100% - (var(--htr-gutter) * 2), var(--htr-wide));
}

.htr-main--fill {
    padding: 0;
}

.htr-site-content--fill {
    flex: 1 1 auto;
    min-height: 0;
}

.htr-site-content--fill > .htr-hero {
    flex: 0 0 auto;
}

.htr-main--fill .htr-browse-directory {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    margin-block: 0;
}

.htr-main--fill .htr-browse-directory > .htr-hero--map {
    flex: 0 0 auto;
}

.htr-main--fill .htr-browse-directory__body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

.htr-main--fill .htr-browse-directory__layout {
    flex: 1 1 auto;
    min-height: 0;
}

.htr-main--fill .htr-browse-directory__main,
.htr-main--fill .htr-directory-results {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

.htr-main--fill .htr-browse-directory__body > :not(.htr-browse-directory__layout) {
    flex-shrink: 0;
}

.htr-main--fill .htr-directory-list-wrap {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

.htr-main--fill .htr-directory-results__bar {
    flex-shrink: 0;
}

.htr-browse-directory__body {
    padding: 1.5rem var(--htr-gutter) 1rem;
    width: min(100% - (var(--htr-gutter) * 2), var(--htr-wide));
    margin-inline: auto;
}

.htr-main--fill .ht-trailer-directory,
.htr-main--fill .ht-manage-listings {
    margin-block: 0;
}

@media (max-width: 900px) {
    .htr-browse-directory__body {
        padding: 1rem var(--htr-gutter) 0.75rem;
    }
}