/* Procurement V2.3.6 - Outlet Mobile Order Polish
   UI-only overrides. No DB changes. */

@media (max-width: 820px){
  /* Keep mobile content inside the viewport and above fixed controls */
  .catalog-v234{
    width:100%;
    max-width:100%;
    overflow:visible;
    padding:0 0 calc(190px + env(safe-area-inset-bottom))!important;
  }
  .catalog-v234 *{box-sizing:border-box}

  /* Search + category: compact and horizontally scrollable */
  .catalog-v234 .order-toolbar{
    position:sticky;
    top:0;
    z-index:20;
    margin:0 -2px 10px;
    padding:8px 2px 7px;
    background:rgba(244,247,247,.97);
    backdrop-filter:blur(12px);
  }
  .catalog-v234 .order-search{width:100%;}
  .catalog-v234 .order-search input{
    width:100%!important;
    height:43px!important;
    min-width:0!important;
    padding:9px 13px 9px 38px!important;
    font-size:13px!important;
    border-radius:14px!important;
  }
  .catalog-v234 .category-scroll{
    width:100%;
    gap:7px;
    padding:9px 1px 3px;
    overscroll-behavior-inline:contain;
    scroll-snap-type:x proximity;
  }
  .catalog-v234 .category-chip{
    flex:0 0 auto;
    scroll-snap-align:start;
    min-height:36px;
    padding:8px 14px;
    font-size:10px;
  }

  /* FIX: date + note were squeezed side-by-side on iPhone */
  .catalog-v234 .order-meta-mobile{
    margin:0 0 12px;
    padding:12px;
    border-radius:18px;
    overflow:hidden;
  }
  .catalog-v234 .order-meta-mobile .split{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:10px!important;
  }
  .catalog-v234 .order-meta-mobile .form-group{
    width:100%!important;
    min-width:0!important;
    margin:0!important;
  }
  .catalog-v234 .order-meta-mobile label{
    display:block;
    margin:0 0 6px;
    font-size:11px!important;
    line-height:1.25;
  }
  .catalog-v234 .order-meta-mobile input{
    display:block;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:46px!important;
    padding:10px 12px!important;
    font-size:13px!important;
    border-radius:13px!important;
  }

  /* Two-column catalog like the agreed mobile preview */
  .catalog-v234 .order-mobile-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    width:100%;
  }
  .catalog-v234 .catalog-card-v234{
    width:100%!important;
    min-width:0!important;
    overflow:hidden;
    border-radius:18px!important;
  }
  .catalog-v234 .catalog-photo-v234{
    height:118px!important;
  }
  .catalog-v234 .catalog-photo-v234 img{padding:9px!important;}
  .catalog-v234 .catalog-placeholder-v234{gap:5px;}
  .catalog-v234 .catalog-placeholder-v234 span{font-size:27px;}
  .catalog-v234 .catalog-placeholder-v234 small{
    font-size:9px;
    text-align:center;
    padding:0 8px;
  }
  .catalog-v234 .catalog-photo-v234 .statusBadge{
    top:8px;
    right:8px;
    max-width:calc(100% - 16px);
    padding:5px 8px;
    font-size:8px;
  }

  .catalog-v234 .catalog-card-body-v234{padding:10px!important;}
  .catalog-v234 .product-category-tag{
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:6px;
    font-size:8px!important;
  }
  .catalog-v234 .catalog-card-v234 h3{
    min-height:31px!important;
    margin:0 0 3px!important;
    font-size:12.5px!important;
    line-height:1.22!important;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  .catalog-v234 .catalog-card-v234 .sku{
    min-height:12px;
    margin-bottom:7px!important;
    font-size:8.5px!important;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .catalog-v234 .catalog-stock-v234{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:5px!important;
    margin:7px 0!important;
  }
  .catalog-v234 .catalog-stock-v234>span{
    min-width:0;
    padding:6px!important;
    font-size:8px!important;
  }
  .catalog-v234 .catalog-stock-v234 b{
    font-size:10px!important;
    line-height:1.2;
    overflow-wrap:anywhere;
  }
  .catalog-v234 .catalog-stock-v234 small{display:none!important;}

  /* Physical stock: smaller but still easy to edit */
  .catalog-v234 .catalog-physical-v234{margin-top:7px!important;}
  .catalog-v234 .catalog-physical-v234>label,
  .catalog-v234 .qty-label,
  .catalog-v234 .uom-select-wrap label{
    margin-bottom:5px!important;
    font-size:8.5px!important;
    line-height:1.2;
  }
  .catalog-v234 .catalog-physical-v234>div{height:38px;border-radius:11px;}
  .catalog-v234 .catalog-physical-v234 input{
    height:36px!important;
    min-width:0!important;
    padding:7px 8px!important;
    font-size:11px!important;
  }
  .catalog-v234 .catalog-physical-v234 span{
    flex:0 0 auto;
    max-width:42px;
    padding:0 7px!important;
    font-size:8px!important;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  /* Qty and UOM stay stacked inside each narrow card, without overflow */
  .catalog-v234 .catalog-qty-v234{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:7px!important;
    margin-top:8px!important;
  }
  .catalog-v234 .catalog-qty-v234>div{min-width:0!important;}
  .catalog-v234 .qty-stepper{
    width:100%!important;
    height:40px!important;
    grid-template-columns:34px minmax(0,1fr) 34px!important;
    border-radius:12px!important;
  }
  .catalog-v234 .qty-stepper button{font-size:18px!important;}
  .catalog-v234 .qty-stepper input{
    width:100%!important;
    min-width:0!important;
    height:38px!important;
    padding:4px 2px!important;
    font-size:13px!important;
  }
  .catalog-v234 .uom-select-wrap select,
  .catalog-v234 .uom-select-wrap input{
    width:100%!important;
    min-width:0!important;
    height:40px!important;
    padding:7px 9px!important;
    font-size:10px!important;
    border-radius:12px!important;
  }
  .catalog-v234 .conversion-mobile{
    min-height:12px;
    margin-top:5px!important;
    font-size:7.5px!important;
    line-height:1.25;
    text-align:right;
    overflow-wrap:anywhere;
  }

  /* Floating cart: clear of iPhone bottom nav and less intrusive */
  .catalog-v234 .cart-float{
    left:12px!important;
    right:12px!important;
    bottom:calc(79px + env(safe-area-inset-bottom))!important;
    min-height:64px;
    padding:10px 12px!important;
    border-radius:18px!important;
    gap:8px!important;
  }
  .catalog-v234 .cart-float>div{min-width:0;}
  .catalog-v234 .cart-float strong{font-size:11px!important;}
  .catalog-v234 .cart-float span{
    display:block;
    margin-top:2px;
    font-size:8.5px!important;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .catalog-v234 .cart-float .btn{
    flex:0 0 auto;
    min-height:42px;
    padding:9px 12px!important;
    font-size:11px!important;
    border-radius:12px!important;
  }

  /* Checkout sheet safe spacing */
  .catalog-checkout-sheet-v234{
    max-height:calc(92vh - env(safe-area-inset-top));
    padding-bottom:calc(24px + env(safe-area-inset-bottom))!important;
  }
}

@media (max-width: 370px){
  /* Very small devices get a readable one-column fallback */
  .catalog-v234 .order-mobile-grid{
    grid-template-columns:minmax(0,1fr)!important;
  }
  .catalog-v234 .catalog-photo-v234{height:150px!important;}
}