/* =========================================
   Site-wide layout (every front-end page)
   ========================================= */

/* Footer sits at the bottom of the screen on short pages: the page fills at least
   the viewport (less the admin bar when logged in) and the main content grows to
   take the spare height. Longer pages are unaffected. */
#page-container {
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - var(--wp-admin--admin-bar--height, 0px));
    min-height: calc(100dvh - var(--wp-admin--admin-bar--height, 0px));
}
#page-container > #et-main-area {
    display: flex;
    flex-direction: column;
    flex: 1 0 auto;
}
#et-main-area > #main-content {
    flex: 1 0 auto;
}

/* That spare height is white, like the page. Divi makes #main-content transparent on
   builder pages and template archives (each section paints its own background), so
   it showed the grey body. Other pages (My Account, blog posts) keep their grey. */
body.et_pb_pagebuilder_layout #main-content,
body.archive.et-tb-has-template #main-content {
    display: flex;
    flex-direction: column;
    background-color: #fff;
}

/* Spare height goes above a closing "Connect with Us" band, so the band sits on the
   footer. The wrappers between #main-content and the sections pass the height down. */
body.et_pb_pagebuilder_layout #main-content > article,
body.et_pb_pagebuilder_layout #main-content > article > .entry-content,
body.et_pb_pagebuilder_layout #main-content > article > .entry-content > .et-l--post,
body.et_pb_pagebuilder_layout #main-content > article > .entry-content > .et-l--post > .et_builder_inner_content,
body.archive.et-tb-has-template #main-content > #et-boc,
body.archive.et-tb-has-template #main-content > #et-boc > .et-l--body,
body.archive.et-tb-has-template #main-content > #et-boc > .et-l--body > .et_builder_inner_content {
    display: flex;
    flex-direction: column;
    flex: 1 0 auto;
}
body.et_pb_pagebuilder_layout .et_builder_inner_content > .et_pb_section:last-child:has(.et_pb_social_media_follow),
body.archive.et-tb-has-template .et_builder_inner_content > .et_pb_section:last-child:has(.et_pb_social_media_follow) {
    margin-top: auto;
}