/* Existing XStore footer widget areas, styled as simple navigation columns. */
body .et-footers-wrapper,
body .et-footers-wrapper footer.footer {
    background: #fff !important;
}

body .et-footers-wrapper footer.footer {
    border: 0 !important;
    border-top: 1px solid #dedede !important;
    padding: 0 !important;
}

/* XStore offsets this legacy separator into the copyright row. The row's
   own container border is the single intended separator. */
body .et-footers-wrapper footer.footer::after {
    content: none;
    display: none;
}

body .et-footers-wrapper footer.footer > .container,
body .et-footers-wrapper .bambu-footer-copyright > .container {
    width: min(1200px, calc(100% - 48px));
    max-width: 1200px;
    padding-right: 0;
    padding-left: 0;
}

body .et-footers-wrapper .bambu-footer-copyright > .container {
    border-top: 1px solid #d0d0d0;
    padding-top: 18px;
    padding-bottom: 24px;
}

body .et-footers-wrapper .bambu-footer-copyright p {
    margin: 0;
    color: #000;
    font-family: 'Manrope', sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.5;
    text-align: left;
}

/* Mobile already has a measured sticky-cart spacer. Leave the new copyright
   readable above the fixed purchase bar on larger product-page viewports too. */
@media (min-width: 768px) {
    body.single-product:has(.etheme-sticky-cart) .et-footers-wrapper .bambu-footer-copyright > .container {
        padding-bottom: 90px;
    }
}

body .et-footers-wrapper footer.footer > .container > .row {
    display: grid;
    row-gap: 42px;
    margin: 0;
    padding: 50px 0 54px;
}

/* Bootstrap's legacy row clearfix becomes an anonymous grid item unless it is
   removed, which otherwise shifts column one and wraps column four. */
body .et-footers-wrapper footer.footer > .container > .row::before,
body .et-footers-wrapper footer.footer > .container > .row::after {
    display: none !important;
    content: none !important;
}

body .et-footers-wrapper footer.footer .footer-widgets {
    float: none;
    width: auto;
    max-width: none;
    margin: 0;
    padding: 0;
}

body .et-footers-wrapper footer.footer .footer-widget,
body .et-footers-wrapper footer.footer .menu-element {
    margin: 0 !important;
    padding: 0 !important;
    text-align: left;
}

body .et-footers-wrapper footer.footer .widget-title,
body .et-footers-wrapper footer.footer .widget-title span {
    display: block;
    margin: 0 0 15px !important;
    padding: 0 !important;
    border: 0 !important;
    color: #151515 !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    text-align: left;
    text-transform: none !important;
}

body .et-footers-wrapper footer.footer .widget-title::before,
body .et-footers-wrapper footer.footer .widget-title::after,
body .et-footers-wrapper footer.footer .widget-title span::before,
body .et-footers-wrapper footer.footer .widget-title span::after {
    display: none !important;
    content: none !important;
}

body .et-footers-wrapper footer.footer .menu-element > div > ul.menu {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

body .et-footers-wrapper footer.footer .menu-element > div > ul.menu > li {
    position: static !important;
    display: block;
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    list-style: none;
}

body .et-footers-wrapper footer.footer .menu-element > div > ul.menu > li > a.item-link {
    display: inline;
    width: auto;
    margin: 0;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #888 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.45 !important;
    text-align: left;
    text-decoration: none;
    text-transform: none !important;
    transition: color 150ms ease;
}

body .et-footers-wrapper footer.footer .menu-element > div > ul.menu > li > a.item-link:hover,
body .et-footers-wrapper footer.footer .menu-element > div > ul.menu > li > a.item-link:focus-visible {
    color: #222 !important;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* Footer widgets remain editable, but only their top-level menu links are
   presented. Native XStore dropdowns and header-only mega panels cannot open. */
body .et-footers-wrapper footer.footer .menu-element .nav-sublist-dropdown,
body .et-footers-wrapper footer.footer .menu-element ul.sub-menu,
body .et-footers-wrapper footer.footer .menu-element .bambu-mega-menu,
body .et-footers-wrapper footer.footer .menu-element .arrow,
body .et-footers-wrapper footer.footer .menu-element svg.arrow,
body .et-footers-wrapper footer.footer .menu-element .open-child,
body .et-footers-wrapper footer.footer .menu-element > div > ul.menu > li > a::before,
body .et-footers-wrapper footer.footer .menu-element > div > ul.menu > li > a::after {
    display: none !important;
    content: none !important;
}

body .et-footers-wrapper footer.footer .footer-bottom,
body .et-footers-wrapper footer.footer + .footer-bottom {
    border-top-color: #e5e5e5;
}

@media (min-width: 1024px) {
    /* Equal gaps between content-sized columns, without an empty trailing track. */
    body .et-footers-wrapper footer.footer > .container > .row {
        grid-template-columns: repeat(4, max-content);
        justify-content: space-between;
        column-gap: 24px;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    body .et-footers-wrapper footer.footer > .container > .row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 64px;
        padding-top: 44px;
        padding-bottom: 48px;
    }
}

@media (max-width: 767px) {
    body .et-footers-wrapper footer.footer > .container,
    body .et-footers-wrapper .bambu-footer-copyright > .container {
        width: calc(100% - 32px);
    }

    body .et-footers-wrapper footer.footer > .container > .row {
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
        align-items: start;
        padding: 8px 0 calc(82px + env(safe-area-inset-bottom, 0px));
    }

    body .et-footers-wrapper footer.footer .footer-widgets,
    body .et-footers-wrapper footer.footer .footer-widget {
        width: auto;
        min-width: 0;
        height: auto;
        min-height: 0;
    }

    body .et-footers-wrapper footer.footer .footer-widgets {
        border-bottom: 1px solid #e8e8e8;
    }

    /* Full-width native buttons replace only the mobile heading contents. */
    body .et-footers-wrapper footer.footer .footer-widgets .footer-widget > .widget-title {
        margin-bottom: 0 !important;
        padding: 0 !important;
        height: auto;
        min-height: 0;
        overflow-wrap: anywhere;
        text-align: center !important;
    }

    body .et-footers-wrapper footer.footer .widget-title span {
        margin-bottom: 0 !important;
        padding: 0 !important;
        text-align: center !important;
    }

    body .et-footers-wrapper footer.footer .bambu-footer-toggle {
        display: block;
        width: 100%;
        min-width: 0;
        min-height: 66px;
        height: auto;
        margin: 0;
        padding: 22px 12px;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        color: #151515;
        font: inherit;
        font-weight: 500 !important;
        line-height: 1.4;
        text-align: center;
        text-transform: none;
        white-space: normal;
        overflow-wrap: anywhere;
        cursor: pointer;
    }

    body .et-footers-wrapper footer.footer .bambu-footer-toggle:focus-visible {
        outline: 2px solid #00ae42;
        outline-offset: -3px;
    }

    body .et-footers-wrapper footer.footer .bambu-footer-panel {
        display: grid !important;
        height: auto !important;
        grid-template-rows: 0fr;
        visibility: hidden;
        transition: grid-template-rows 200ms ease, visibility 200ms;
    }

    body .et-footers-wrapper footer.footer .bambu-footer-panel.is-open {
        grid-template-rows: 1fr;
        visibility: visible;
    }

    /* XStore's closed widget opacity must not hide the new controlled panel. */
    body .et-footers-wrapper footer.footer .footer-widget > .bambu-footer-panel {
        opacity: 1 !important;
    }

    /* Ignore native accordion inline display/slide heights. The panel above
       owns collapse; min-height:0 and overflow:hidden allow grid animation. */
    body .et-footers-wrapper footer.footer .menu-element {
        display: block !important;
        padding: 0 !important;
        height: auto !important;
        min-height: 0;
        opacity: 1 !important;
        overflow: hidden !important;
        text-align: center !important;
    }

    body .et-footers-wrapper footer.footer .bambu-footer-panel .menu-element > div {
        padding-bottom: 18px;
    }

    body .et-footers-wrapper footer.footer .menu-element > div > ul.menu {
        gap: 0;
        height: auto;
        min-height: 0;
        align-items: center;
        text-align: center;
    }

    /* Legacy menu clearfix pseudo-elements would become extra flex items/gaps. */
    body .et-footers-wrapper footer.footer .menu-element > div > ul.menu::before,
    body .et-footers-wrapper footer.footer .menu-element > div > ul.menu::after {
        display: none;
        content: none;
    }

    body .et-footers-wrapper footer.footer .menu-element > div > ul.menu > li {
        min-width: 0;
        text-align: center;
        line-height: 1.45;
    }

    body .et-footers-wrapper footer.footer .menu-element > div > ul.menu > li > a.item-link {
        display: block;
        min-height: 44px;
        max-width: 100%;
        padding: 11px 8px !important;
        color: #707070 !important;
        white-space: normal;
        overflow-wrap: anywhere;
        text-align: center;
    }

    body .et-footers-wrapper footer.footer .menu-element > div > ul.menu > li > a.item-link:is(:hover, :focus-visible) {
        color: #222 !important;
    }

    /* While the footer is visible, park the existing control in its reserved
       bottom space instead of letting it float across expanded links. */
    body #back-top.bambu-footer-back-top {
        top: var(--bambu-footer-back-top-top);
        bottom: auto;
        transition-property: opacity, visibility;
    }
}

@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
    body .et-footers-wrapper footer.footer .bambu-footer-panel { transition: none; }
}
