/* RWD rules are centralized here. Keep breakpoint vocabulary stable. */
/* NI_MOBILE_SHELL_CANONICAL_GUARD_START
 * Root cause: CSS split left this file with empty breakpoint shells while mobile header
 * visibility depended only on legacy-bridge + inline display:none in page_header.lbi.
 * Restore the canonical mobile shell contract here so every page keeps <=700px behavior
 * even when later bridge layers fail to paint.
 */
.ni-mobile-luxe-topbar,
.ni-mobile-luxe-overlay,
.ni-mobile-luxe-drawer {
  display: none;
}

@media screen and (max-width: 700px) {
  html,
  body {
    overflow-x: hidden;
    min-width: 0;
  }

  html body .block,
  html body .block.clearfix,
  html body .block_s,
  html body #mainNav,
  html body #mainNav.clearfix {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
  }

  html body .ni-premium-utilbar,
  html body .ni-premium-brandrow {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  html body .ni-mobile-luxe-topbar {
    display: grid !important;
    visibility: visible !important;
  }
}
/* NI_MOBILE_SHELL_CANONICAL_GUARD_END */

/* NI_RWD_BREAKPOINT_VOCABULARY
 * Canonical bands (do not introduce 768/860/861 one-offs):
 * - mobile:        max-width 700px
 * - tablet-compact:701px – 865px (footer nav row, member compact stacks)
 * - tablet-wide:   866px – 1024px
 * - desktop frame: 960px content max; >=961px fixed frame width
 * Token names: tokens.css --ni-breakpoint-* */

@media (max-width: 700px) {
  .ni-breadcrumb-wrap,
  .ni-global-breadcrumb-wrap {
    width: calc(100% - 22px);
    margin: 6px auto 6px;
    padding: 0;
  }

  .ni-breadcrumb,
  .ni-soft-breadcrumb,
  .ni-breadcrumb-wrap #ur_here,
  .ni-global-breadcrumb-wrap #ur_here,
  #ur_here.ni-breadcrumb,
  #ur_here.ni-soft-breadcrumb {
    font-size: 11px;
    line-height: 1.65;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .ni-pagination-control,
  #pager.pagebar,
  .pagebar {
    gap: 5px;
  }
}

/* NI_GLOBAL_960_RESPONSIVE_GUARD_START */
@media (max-width: 960px){
  html body{
    width:100% !important;
  }
}
/* NI_GLOBAL_960_RESPONSIVE_GUARD_END */

/* NI_CSS_SPLIT_RELOCATED_COMPAT: article/help responsive guards now live in page-content.css. Guard markers preserved: body.ni-page-article .ni-article-layout | NI_ARTICLE_LIST_SHELL_RESPONSIVE | .ni-article-search__field | .ni-help-message-form__row | .ni-help-message-form__fieldset | NI_ARTICLE_WIDGETS_RESPONSIVE | .ni-help-sidebar__groups | .ni-article-category-tree__body */
/* NI_CSS_SPLIT_RELOCATED: listing responsive base moved to page-specific CSS. Guard markers preserved: NI_LISTING_RESPONSIVE_CONVERGENCE */

/* NI_SIDEBAR_RWD_CONVERGENCE */
@media (max-width:700px){
  html body .ni-sidebar-card{
    margin-bottom:10px;
    padding:13px;
    border-radius:20px;
  }
  html body .ni-sidebar-products{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }
  html body .ni-sidebar-product{
    grid-template-columns:52px minmax(0,1fr);
    gap:8px;
  }
  html body .ni-sidebar-product__media{
    width:52px;
    height:52px;
  }
  html body .ni-history-product{
    grid-template-columns:52px minmax(0,1fr);
    gap:8px;
  }
  html body .ni-history-product__media{
    width:52px;
    height:52px;
  }
}
@media (max-width:374px){
  html body .ni-sidebar-products{
    grid-template-columns:1fr;
  }
}

/* NI_CSS_SPLIT_RELOCATED: listing mobile drawer/micro responsive moved to page-specific CSS. Guard markers preserved: NI_LISTING_MOBILE_ACTION_DRAWER_RESPONSIVE | NI_LISTING_MICRO_RWD_CONVERGENCE */

/* NI_CSS_SPLIT_RELOCATED: flow responsive base moved to page-specific CSS. Guard markers preserved: NI_FLOW_CART_STEP_RESPONSIVE | .ni-flow-mobile-submit */

/* NI_CSS_SPLIT_RELOCATED: member responsive rules moved to page-specific CSS. Guard markers preserved: ni-member-layout | ni-member-dashboard | ni-member-profile | ni-member-wallet | ni-member-address | ni-member-collection | ni-member-affiliate | ni-member-message | ni-member-order-detail | ni-passport | ni-member-catalog-notice | .ni-member-service-rail | scroll-snap-type:x mandatory */

/* NI_CSS_SPLIT_RELOCATED: article/help responsive base moved to page-specific CSS. Guard markers preserved: NI_ARTICLE_DETAIL_SHELL_RESPONSIVE | .ni-article-shell */

/* NI_CSS_SPLIT_RELOCATED: listing experience responsive moved to page-specific CSS. Guard markers preserved: NI_LISTING_EXPERIENCE_RESPONSIVE_START | NI_LISTING_EXPERIENCE_RESPONSIVE_END */

/* NI_CSS_SPLIT_RELOCATED: checkout UX responsive moved to page-specific CSS. Guard markers preserved: NI_FLOW_CHECKOUT_UX_MODERNIZATION_PACK responsive layer | .ni-flow-mobile-submit */

/* NI_CSS_SPLIT_RELOCATED: content commerce responsive moved to page-specific CSS. Guard markers preserved: NI_CONTENT_COMMERCE_RESPONSIVE | .ni-content-action-rail | .ni-content-commerce__grid | .ni-content-support-cta */

/* NI_CSS_SPLIT_RELOCATED: edge responsive rules moved to page-specific CSS. Guard markers preserved: NI_EDGE_PAGES_RESPONSIVE */

