/*
 * AIRSAFE CUSTOM STYLESHEET (18 Jul 2026)
 * Hand-maintained additions, deliberately kept OUTSIDE the compiled theme
 * bundle (dist/css/style.css) so no webpack build is required.
 * Loaded after the main stylesheet — see the clearly-marked block in header.php.
 *
 * Contents:
 *   1. Sticky right rail on the Internal Page template (desktop only, >900px).
 *      Mobile (<=900px) stacking behaviour is intentionally untouched.
 */

@media (min-width: 901px) {

    /*
     * 1c. The theme sets .container-page { overflow: hidden } (in the compiled
     * bundle), which silently disables position:sticky for every descendant.
     * overflow: clip performs the identical clipping WITHOUT creating a scroll
     * container, so the rail can stick. Browsers too old to know `clip` ignore
     * this line and simply keep the current non-sticky behaviour.
     */
    .container-page {
        overflow: clip;
    }

    /*
     * 1a. Full-height pale-blue band in the right-hand gutter.
     * Previously this band was painted by .internal-menu:after, relying on the
     * menu stretching to the full column height. Once the rail contents become
     * sticky the menu no longer stretches, so the equivalent band is painted
     * here on the column itself (same colour/width formula as the original).
     */
    .internal-page-content-columns__secondary::before {
        content: "";
        position: absolute;
        z-index: -1;
        top: 0;
        left: 100%;
        height: 100%;
        width: calc(((100vw - 1200px) / 2) - 60px);
        background-color: #eff6f9; /* $brand-secondary */
    }

    /*
     * 1b. The sticky wrapper (added in template-internal-page.php around the
     * Fast Quote form + internal menu). Sits below the 140px fixed header.
     * When the rail is taller than the window it scrolls within itself, so
     * every menu item stays reachable and the form stays pinned at the top.
     */
    .internal-rail-sticky {
        position: sticky;
        top: 160px; /* 140px fixed header + 20px breathing room */
        max-height: calc(100vh - 180px);
        overflow-y: auto;
        display: flex;
        flex-direction: column;
    }

    /* Inside the sticky wrapper the menu must not stretch (see 1a). */
    .internal-rail-sticky .internal-menu {
        flex: 0 0 auto;
    }
}

/*
 * 2. 'Submit a Sample' rail button (per-page ACF toggle on the Internal Page
 *    template — see template-internal-page.php). Padding mirrors the rail's
 *    menu block; full-width button reads clearly in the narrow column.
 *    Applies at all widths (on mobile it simply flows with the stacked rail).
 */
.rail-sample-cta {
    background-color: white;
    padding: 40px 60px 0;
}
.rail-sample-cta .btn {
    width: 100%;
    text-align: center;
}
@media (max-width: 1100px) {
    .rail-sample-cta {
        padding: 30px 40px 0;
    }
}
@media (max-width: 900px) {
    .rail-sample-cta {
        padding: 30px 20px 0;
    }
}