/* v12.10.516 — keep each merchant logo and offer action on one shared row.
   The mobile card has a semantic actions wrapper, so it can use a stable
   three-column row: logo, CTA, favorite. */
/* Commercial import metadata is retained in the record/editor, but must not
   occupy a public catalogue card. This also covers cards saved by old builds. */
html body:not(.nc-editor-page) :is(.product-commercial-details,.nc-mobile-commercial-details,.m2-commercial-details,[data-op-flow-role="commercial"]){
  display:none!important;
}

@media (max-width:760px){
  html body:not(.nc-editor-page) .nc-mobile-product-card .nc-mobile-product-actions{
    display:grid!important;
    grid-template-columns:36px minmax(0,1fr) 32px!important;
    align-items:center!important;
    column-gap:8px!important;
    min-height:40px!important;
  }
  html body:not(.nc-editor-page) .nc-mobile-product-card .nc-mobile-product-actions .nc-mobile-product-merchant-logo{
    grid-column:1!important;
    grid-row:1!important;
    position:static!important;
    margin:0!important;
    align-self:center!important;
  }
  html body:not(.nc-editor-page) .nc-mobile-product-card .nc-mobile-product-actions .nc-mobile-offer-link{
    grid-column:2!important;
    grid-row:1!important;
    justify-self:center!important;
    margin:0!important;
    white-space:nowrap!important;
  }
  html body:not(.nc-editor-page) .nc-mobile-product-card .nc-mobile-product-actions .nc-mobile-favorite-btn{
    grid-column:3!important;
    grid-row:1!important;
    position:static!important;
    inset:auto!important;
    margin:0!important;
    justify-self:end!important;
    align-self:center!important;
  }
}

/* The legacy <=1100px rule made the reader controls part of the document.
   On tablets this placed them after the complete catalogue rather than below
   the active page. Keep the page buttons persistently reachable. */
@media (min-width:761px) and (max-width:1440px){
  body:not(.op-catalog-fullscreen) .stage{padding-bottom:104px!important;}
  body:not(.op-catalog-fullscreen) .controls{
    position:fixed!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    z-index:2147481000!important;
    display:grid!important;
    grid-template-columns:minmax(132px,1fr) minmax(150px,1.25fr) minmax(132px,1fr)!important;
    align-items:center!important;
    gap:12px!important;
    min-height:82px!important;
    height:auto!important;
    padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px))!important;
  }
  body:not(.op-catalog-fullscreen) .controls>#prevPage,
  body:not(.op-catalog-fullscreen) .controls>#nextPage{
    display:block!important;
    visibility:visible!important;
    width:100%!important;
    min-width:0!important;
  }
  body:not(.op-catalog-fullscreen) .controls>.pager{
    grid-column:2!important;
    min-width:0!important;
  }
  body:not(.op-catalog-fullscreen) .controls>.view-buttons{display:none!important;}
  body:not(.op-catalog-fullscreen) .controls>#prevPage{grid-column:1!important;}
  body:not(.op-catalog-fullscreen) .controls>#nextPage{grid-column:3!important;}
}