/* UI-r13: responsive audit guard
   Scope: mobile/tablet/desktop overflow and density guard after mobile flatten/navigation changes.
   No business logic. */

html,
body{
  max-width:100%;
  overflow-x:hidden;
}

img,
svg,
video,
canvas{
  max-width:100%;
  height:auto;
}

#app,
.app,
.page,
.spa-page,
.container,
.spa-content,
.spa-page-hero,
.spa-page-hero--with-tools,
.spa-hero-layout,
.spa-hero-tools-card,
.catalog-tools,
.catalog-tools__inner,
.catalog-tools__actions,
.catalog-tools__search,
.mo-card,
.master-card,
.parts-category-card,
.part-card,
.msng-item,
.news-card,
.admin-card,
.cmodal-card,
.modal-dialog-v2,
.modal-panel-v2{
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
}

.catalog-tool-btn,
.bnav-item,
.drawer-link,
.btn,
.ui-btn,
.mo-action-btn,
.msng-action-btn,
.parts-action-btn,
.admin-action-btn{
  min-width:0;
  max-width:100%;
}

.catalog-tool-btn b,
.catalog-tool-btn strong,
.bnav-label,
.drawer-link span,
.btn span,
.ui-btn span,
.mo-card-title,
.master-card-title,
.parts-category-title,
.news-card-title,
.msng-title{
  min-width:0;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
}

@media (max-width: 430px){
  :root{
    --ui-mobile-page-pad: 8px;
    --ui-mobile-card-pad: 10px;
    --ui-mobile-gap: 8px;
  }

  .container,
  .spa-content > .container,
  .msng-page-content,
  .masters-content > .container,
  .parts-page .container,
  .myorders-page .container,
  .admin-page .container,
  .news-page .container{
    width:100% !important;
    max-width:100% !important;
    padding-left:var(--ui-mobile-page-pad) !important;
    padding-right:var(--ui-mobile-page-pad) !important;
  }

  .spa-page-hero.spa-page-hero--with-tools{
    margin-left:0 !important;
    margin-right:0 !important;
  }

  .spa-hero-layout,
  .spa-hero-tools-card,
  .catalog-tools,
  .catalog-tools__inner{
    gap:var(--ui-mobile-gap) !important;
  }

  .mo-card,
  .master-card,
  .parts-category-card,
  .part-card,
  .msng-item,
  .news-card,
  .admin-card{
    padding:var(--ui-mobile-card-pad) !important;
  }

  #bottom-nav,
  #bottomNavInner,
  .bnav-inner{
    max-width:100vw !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
  }
}

@media (min-width:431px) and (max-width:640px){
  .container,
  .spa-content > .container,
  .msng-page-content,
  .masters-content > .container,
  .parts-page .container,
  .myorders-page .container,
  .admin-page .container,
  .news-page .container{
    width:100% !important;
    max-width:100% !important;
    padding-left:10px !important;
    padding-right:10px !important;
  }
}

@media (min-width:641px) and (max-width:1023px){
  .spa-hero-layout.spa-hero-layout--with-tools{
    grid-template-columns:1fr !important;
    gap:14px !important;
  }

  .catalog-tools__actions,
  .catalog-tools__search{
    width:100% !important;
    max-width:100% !important;
  }
}

@media (min-width:1024px){
  .spa-hero-layout.spa-hero-layout--with-tools{
    align-items:stretch;
  }

  .spa-hero-tools-card[data-tools-standard="spa-hero-unified-v2"]{
    min-width:0;
    max-width:100%;
  }
}