/* menu-fix.css - desktop fixes for /menu (loads after all other menu CSS).
   1) filter bar sticks directly under the sticky header (no gap, no overlap)
   2) filter tabs stay on ONE row (scroll sideways instead of wrapping)
   3) "Add to Cart" button is never squeezed/clipped inside the card
   Phone layout is untouched (everything below is min-width:761px). */
:root{--bbf-nav-h:58px}
@media (min-width:761px){
  /* the "Fresh - Local / View Cart" strip must scroll normally, not stick behind the filter bar */
  body.bbf-marketplace-page .market-category-bar{position:static !important;top:auto !important;z-index:1 !important}

  .menu-toolbar{
    top:calc(var(--bbf-nav-h) + 6px) !important;
    z-index:30 !important;
    flex-wrap:nowrap !important;
    gap:12px !important;
    padding:10px 12px !important;
    margin-bottom:22px !important;
    border-radius:18px !important;
    background:#fffdf8 !important;
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
  }
  .menu-toolbar .category-tabs{
    flex:1 1 auto !important;min-width:0 !important;
    flex-wrap:nowrap !important;overflow-x:auto !important;
    padding:2px 0 !important;scrollbar-width:none;
    -webkit-mask-image:linear-gradient(to right,#000 calc(100% - 26px),transparent);
            mask-image:linear-gradient(to right,#000 calc(100% - 26px),transparent);
  }
  .menu-toolbar .category-tabs::-webkit-scrollbar{display:none}
  .menu-toolbar .category-tabs button{
    flex:0 0 auto !important;white-space:nowrap !important;
    padding:9px 16px !important;font-size:13px !important;
  }
  .menu-toolbar .menu-search{
    flex:0 0 auto !important;min-width:0 !important;margin:0 !important;
    display:flex !important;gap:8px !important;
  }
  .menu-toolbar .menu-search input{width:210px !important;min-width:0 !important;flex:none !important;padding:10px 14px !important;font-size:13px !important}
  .menu-toolbar .menu-search select{width:175px !important;padding:10px 12px !important;font-size:13px !important}

  /* equal-height cards, price row pinned to the bottom */
  .menu-group-grid{align-items:stretch}
  .menu-product{height:100%}
  .menu-product-body{display:flex !important;flex-direction:column;flex:1 1 auto}
  .menu-product .menu-price-row{
    margin-top:auto !important;padding-top:14px;
    display:flex !important;flex-wrap:wrap !important;
    align-items:center !important;justify-content:space-between !important;gap:10px !important;
  }
  .menu-product .menu-price-row .price{flex:0 1 auto;min-width:0}

  /* Add to Cart: real pill button, text never cut off */
  .menu-product .menu-add,
  html body .menu-product .menu-add{
    width:auto !important;height:auto !important;min-width:0 !important;min-height:40px !important;
    padding:0 18px !important;border-radius:999px !important;
    background:var(--green,#087f3e) !important;color:#fff !important;
    font-size:13px !important;font-weight:800 !important;line-height:1 !important;
    white-space:nowrap !important;flex:0 0 auto !important;overflow:visible !important;
    display:inline-flex !important;align-items:center;justify-content:center;
  }
  .menu-product .menu-add:hover:not(:disabled){background:#066b34 !important;transform:none !important}
  .menu-product .menu-add:disabled{background:#c7cec9 !important;color:#fff !important}
}
