/* Hide desktop navigation on menu and checkout pages */
.action-menu #top-navigation,
.action-checkout #top-navigation {
    position: relative !important;
    height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Ensure mobile navigation is visible and properly positioned */
.action-menu .mobile-nav-wrapper,
.action-checkout .mobile-nav-wrapper {
    display: block !important;
    position: relative;
    z-index: 100;
}

/* Preserve mobile button and checkout functionality */
.action-menu #vue-widget-nav-mobile,
.action-checkout #vue-widget-nav-mobile {
    display: block !important;
    margin-top: 0;
}

/* Hide transaction info component on menu and checkout pages - more aggressive approach */
.action-menu .flexcol component-transaction-info,
.action-checkout .flexcol component-transaction-info,
.action-menu [ref="transaction_info"],
.action-checkout [ref="transaction_info"],
.action-menu component-transaction-info,
.action-checkout component-transaction-info,
.action-menu #vue-widget-nav-mobile component-transaction-info,
.action-checkout #vue-widget-nav-mobile component-transaction-info {
    display: none !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    visibility: hidden !important;
    position: absolute !important;
    pointer-events: none !important;
}

/* Hide the entire first flexcol in mobile navigation on menu and checkout pages */
.action-menu #vue-widget-nav-mobile .flexcol:first-child,
.action-checkout #vue-widget-nav-mobile .flexcol:first-child {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Adjust spacing when top nav is hidden */
.action-menu .container-fluid,
.action-checkout .container-fluid {
    padding-top: 0px;
}