/**
 * Navigation Sidebar — matches the site-source .page-directory design.
 * Loaded only on posts where the ACF "navigation_sidebar" toggle is on.
 */

.als-nav-sidebar {
    --als-nav-navy: #0b2b49;
    --als-nav-text: #35546b;
    --als-nav-action: #0b5ea8;
    --als-nav-line: #dce7ef;
    --als-nav-bg: #f5f8fb;
    --als-nav-hover: #e4f1fa;

    position: relative;
    z-index: 8;
    padding: 28px 18px 48px;
    background: var(--als-nav-bg);
    border-right: 1px solid var(--als-nav-line);
    font-family: Arial, Helvetica, sans-serif;
    box-sizing: border-box;
}

.als-nav-sidebar__title {
    position: sticky;
    top: 104px;
    margin: 0 0 12px;
    padding: 0 8px;
    color: var(--als-nav-navy);
    font-size: 13px;
    font-weight: 900;
    line-height: 1.3;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.als-nav-sidebar__nav {
    position: sticky;
    top: 137px;
    max-height: calc(100vh - 165px);
    overflow: auto;
    padding: 0 5px 8px;
}

.als-nav-sidebar__list {
    display: grid;
    gap: 2px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.als-nav-sidebar__item {
    margin: 0;
    padding: 0;
}

.als-nav-sidebar__item::before {
    content: none;
}

.als-nav-sidebar__link {
    display: block;
    padding: 9px 10px;
    border-radius: 7px;
    color: var(--als-nav-text);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.25;
    text-decoration: none;
}

.als-nav-sidebar__link:hover,
.als-nav-sidebar__link:focus-visible {
    background: var(--als-nav-hover);
    color: var(--als-nav-action);
    text-decoration: underline;
    outline: none;
}

.als-nav-sidebar__item.active > .als-nav-sidebar__link {
    background: var(--als-nav-hover);
    color: var(--als-nav-action);
    box-shadow: inset 3px 0 0 var(--als-nav-action);
}

.als-nav-sidebar__item.current-ancestor > .als-nav-sidebar__link {
    color: var(--als-nav-action);
}

/* Nested levels (only printed when als_navigation_sidebar_depth > 1). */
.als-nav-sidebar__list--level-2,
.als-nav-sidebar__list--level-3,
.als-nav-sidebar__list--level-4 {
    margin: 2px 0 4px 12px;
    padding-left: 8px;
    border-left: 1px solid var(--als-nav-line);
}

.als-nav-sidebar__list--level-2 .als-nav-sidebar__link {
    padding: 7px 10px;
    font-weight: 600;
}

/* Landing Page template: full-height sidebar column beside the blocks. */
.landing-page.has-navigation-sidebar {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);
    align-items: stretch;
}

.landing-page.has-navigation-sidebar > .site-main {
    min-width: 0;
}

/* Blocks pad against 100vw; inside the narrower column, pad against the column instead. */
.landing-page.has-navigation-sidebar .entry-content > [class*="als-"][class*="-block"]:not(.als-hero-block-wrap),
.landing-page.has-navigation-sidebar .entry-content > .als-hero-block-wrap > .als-hero-block {
    padding-left: max(calc((100% - 1060px) / 2), 38px);
    padding-right: max(calc((100% - 1060px) / 2), 38px);
}

/* The hero wrapper (hero + priority card) runs edge to edge in the column. */
.landing-page.has-navigation-sidebar .entry-content > .als-hero-block-wrap {
    padding-left: 0;
    padding-right: 0;
}

.landing-page.has-navigation-sidebar .als-hero-block-wrap .als-hero-block__priority {
    margin-left: max(calc((100% - 1060px) / 2), 38px);
    margin-right: max(calc((100% - 1060px) / 2), 38px);
}

/* Bootstrap column templates (default Page, Service): no column border, rounded panel. */
.col-md-3 > .als-nav-sidebar {
    border-right: 0;
    border-radius: 12px;
    padding: 22px 12px 26px;
}

/* Tablet / mobile: horizontal scrolling pills, like the mockup. */
@media (max-width: 1120px) {
    .landing-page.has-navigation-sidebar {
        display: block;
    }

    .als-nav-sidebar,
    .col-md-3 > .als-nav-sidebar {
        border-right: 0;
        border-bottom: 1px solid var(--als-nav-line);
        border-radius: 0;
        padding: 14px 24px;
    }

    .als-nav-sidebar__title,
    .als-nav-sidebar__nav {
        position: static;
    }

    .als-nav-sidebar__title {
        margin-bottom: 8px;
    }

    .als-nav-sidebar__nav {
        max-height: none;
        overflow-x: auto;
        padding: 0 0 4px;
    }

    .als-nav-sidebar__list--level-1 {
        display: flex;
        gap: 6px;
    }

    .als-nav-sidebar__list--level-1 > .als-nav-sidebar__item {
        flex: 0 0 auto;
    }

    .als-nav-sidebar__list--level-1 > .als-nav-sidebar__item > .als-nav-sidebar__link {
        background: #fff;
        border: 1px solid var(--als-nav-line);
        white-space: nowrap;
    }

    .als-nav-sidebar__list--level-1 > .als-nav-sidebar__item.active > .als-nav-sidebar__link {
        background: var(--als-nav-hover);
        border-color: var(--als-nav-action);
        box-shadow: none;
    }

    /* Pills stay one row; nested levels are reachable from the child page itself. */
    .als-nav-sidebar__list--level-2 {
        display: none;
    }
}